/* Sitem — firmanın kendi vitrin/marka ekranı (039).
   Form iskeleti kurum ayarlarıyla ortak (.odev-formu.kurum-formu); burada yalnız
   renk seçicileri, logo önizlemesi ve banner listesi var. */

.sitem-renkler {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
    gap: 1rem;
}

.sitem-renkler label {
    display: grid;
    gap: .4rem;
}

/* 44 px dokunma hedefi: tarayıcı varsayılanı 23 px'lik bir kutu çiziyor. */
.sitem-renkler input[type="color"] {
    inline-size: 100%;
    block-size: 44px;
    padding: 2px;
    border: 1px solid var(--cizgi, #e2e5ea);
    border-radius: 10px;
    background: #fff;
    cursor: pointer;
    font-weight: 400;
    font-size: var(--yazi-satir, 16px);
    line-height: 1.5;
    font-family: inherit;
}

.sitem-logo-onizleme {
    display: block;
    margin-block: .5rem;
    padding: .75rem;
    border: 1px solid var(--cizgi, #e2e5ea);
    border-radius: 12px;
    background: #fff;
    inline-size: fit-content;
}

.sitem-logo-onizleme img {
    display: block;
    max-block-size: 64px;
    max-inline-size: 240px;
}

.sitem-onay {
    display: flex;
    align-items: center;
    gap: .6rem;
    min-block-size: 44px;
    font-weight: 400;
    font-size: var(--yazi-satir, 15px);
    line-height: 1.5;
    font-family: inherit;
}

.sitem-onay input[type="checkbox"] {
    inline-size: 20px;
    block-size: 20px;
    flex: 0 0 auto;
}

/* ------------------------------------------------------------- banner listesi */

.banner-liste {
    display: grid;
    gap: .75rem;
}

.banner-satir {
    display: grid;
    grid-template-columns: minmax(0, 150px) minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
    padding: .75rem;
    border: 1px solid var(--cizgi, #e2e5ea);
    border-radius: 12px;
    background: #fff;
}

.banner-satir--pasif {
    opacity: .72;
}

.banner-onizleme img {
    display: block;
    inline-size: 100%;
    block-size: auto;
    border-radius: 8px;
}

.banner-onizleme .gorsel-yok {
    display: grid;
    place-items: center;
    min-block-size: 56px;
    border: 1px dashed var(--cizgi, #e2e5ea);
    border-radius: 8px;
    color: var(--sonuk, #6b7280);
    font-weight: 400;
    font-size: var(--yazi-mikro, 13px);
    line-height: 1.4;
    font-family: inherit;
}

.banner-bilgi h3 {
    margin: 0 0 .25rem;
    font-weight: 700;
    font-size: var(--yazi-kart-baslik, 16px);
    line-height: 1.3;
    font-family: inherit;
}

.banner-bilgi p {
    margin: 0 0 .35rem;
    color: var(--sonuk, #6b7280);
}

.banner-bilgi .kunye {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem .75rem;
    margin: 0;
    padding: 0;
    list-style: none;
    color: var(--sonuk, #6b7280);
    font-weight: 400;
    font-size: var(--yazi-mikro, 13px);
    line-height: 1.4;
    font-family: inherit;
}

.banner-islem {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
    justify-content: flex-end;
}

.banner-islem .ikon-dugme {
    min-inline-size: 44px;
    min-block-size: 44px;
}

@media (max-width: 720px) {
    .banner-satir {
        grid-template-columns: minmax(0, 1fr);
    }

    .banner-islem {
        justify-content: flex-start;
    }
}

/* Vitrin bilgi kartındaki bağlantılar: metin bağlantısı da 44 px dokunma hedefi. */
.sitem-bilgi-bag {
    display: inline-flex;
    align-items: center;
    min-block-size: 44px;
}

/* ================================================== 042: dinamik menu + sayfalar */

/* --- Menu agaci --- */
.sm-menu-liste, .sm-menu-alt { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.sm-menu-alt { margin: 8px 0 4px 24px; border-left: 2px solid var(--cizgi, #E5E7EB); padding-left: 12px; }

.sm-menu-satir {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center;
    padding: 10px 14px; border: 1px solid var(--cizgi, #E5E7EB); border-radius: 12px;
    background: #fff;
}
.sm-menu-satir--pasif { opacity: .62; }
.sm-menu-bilgi { min-width: 0; display: grid; gap: 2px; }
.sm-menu-bilgi strong { font-weight: 650; font-size: var(--yazi-satir, 15px); line-height: 1.35; }
.sm-menu-bilgi small { font-size: 13px; color: var(--metin-soluk, #6B7280); }
.sm-menu-islem { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; justify-content: flex-end; }
/* Dokunma hedefi 44 px (satir ici ikon dugmeleri dahil). */
.sm-menu-islem .ikon-dugme,
.sm-menu-islem .ince-dugme { min-inline-size: 44px; min-block-size: 44px; }

/* --- 060: satir ici duzenle/ekle formu (Duzenle = sayfa yenilemez, satirin altinda acilir) --- */
.sm-menu-duzenle-satir { list-style: none; }
.sm-menu-inline-form {
    display: grid; grid-template-columns: 1fr 1fr; gap: 12px;
    margin-top: 2px; padding: 14px 16px; border: 1px dashed var(--cizgi, #E5E7EB);
    border-radius: 12px; background: var(--zemin-acik, #F9FAFB);
}
.sm-menu-inline-form .genis-alan { grid-column: 1 / -1; }
.sm-menu-inline-form label { display: grid; gap: 6px; color: var(--metin); font-size: var(--yazi-meta, 13px); font-weight: 600; }
.sm-menu-inline-form input, .sm-menu-inline-form select {
    width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid var(--cizgi, #E5E7EB);
    border-radius: 10px; color: var(--metin); background: #fff; font-weight: 400;
    font-size: var(--yazi-satir, 15px); line-height: 1.5; font-family: inherit;
}
.sm-menu-inline-form input:focus, .sm-menu-inline-form select:focus { border-color: var(--kirmizi); outline: 3px solid rgba(var(--vurgu-rgb), .08); }
.sm-menu-form-islemleri { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.sm-menu-form-islemleri .buton, .sm-menu-form-islemleri .ince-dugme { min-block-size: 44px; }
.sm-menu-form-hata { color: var(--kirmizi); font-size: 13px; font-weight: 600; }
@media (max-width: 720px) {
    .sm-menu-inline-form { grid-template-columns: minmax(0, 1fr); }
}

/* --- Sayfa tablosu --- */
.sm-sayfa-tablo code { font-size: 12px; word-break: break-all; }
.sm-sayfa-islem { white-space: nowrap; }
.sm-sayfa-islem .ince-dugme { min-block-size: 44px; }

/* --- Basit metin duzenleyici --- */
.sm-duzenleyici { display: grid; gap: 8px; }
.sm-duzenleyici-arac { display: flex; flex-wrap: wrap; gap: 6px; }
.sm-arac-dugme {
    min-inline-size: 44px; min-block-size: 44px; padding: 0 12px;
    border: 1px solid var(--cizgi, #E5E7EB); border-radius: 10px; background: #fff;
    font-weight: 600; font-size: var(--yazi-satir, 15px); line-height: 1; font-family: inherit;
    cursor: pointer;
}
.sm-arac-dugme:hover { background: var(--zemin-acik, #F9FAFB); }
.sm-duzenleyici-alan { display: grid; gap: 6px; }
.sm-duzenleyici-alan textarea {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: var(--yazi-satir, 15px); line-height: 1.6;
}

/* --- Yuklenen gorseller --- */
.sm-gorsel-izgara {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 14px; margin-top: 14px;
}
.sm-gorsel-kutu {
    margin: 0; border: 1px solid var(--cizgi, #E5E7EB); border-radius: 12px; overflow: hidden; background: #fff;
}
.sm-gorsel-kutu img { display: block; width: 100%; height: 118px; object-fit: cover; }
.sm-gorsel-kutu figcaption {
    display: grid; gap: 6px; padding: 10px 12px 12px;
    font-size: 13px; color: var(--metin-soluk, #6B7280);
}
.sm-gorsel-kutu figcaption small { font-size: 12px; }
.sm-gorsel-kutu .ince-dugme { min-block-size: 44px; justify-content: center; }

@media (max-width: 720px) {
    .sm-menu-satir { grid-template-columns: minmax(0, 1fr); }
    .sm-menu-islem { justify-content: flex-start; }
    .sm-menu-alt { margin-left: 12px; }
}

/* 🔴 042: Vitrin grubundaki form alanlari 16 px'in ALTINA dusmesin.
   iOS 16 px alti alanda sayfayi buyutuyor, klavye acilinca duzen kayiyor
   (DERSLER, 29.09). Panelin genelinde 15 px'lik form alani borcu var ama o
   ayri bir tasarim turu isi; burada BU ekranlar (Sitem / Banner / Menu /
   Sayfalar / Sayfa / Kunye / Dil + kurs gorseli formu) kapatiliyor.
   `input[type=x]` secicisi tipi YAZILMAMIS alanla eslesmez (DERSLER) ->
   `:not()` zinciri kullaniliyor. */
.kurum-formu input,
.kurum-formu select,
.kurum-formu textarea,
.sm-duzenleyici textarea,
.magaza-gorsel-formu input:not([type="checkbox"]):not([type="radio"]),
.magaza-gorsel-formu select {
    font-size: 16px;
    line-height: 1.5;
    font-family: inherit;
}
/* Onay kutusu/renk secici 16 px kurali disinda ama dokunma hedefi 44 px olmali. */
.kurum-formu input[type="checkbox"],
.kurum-formu input[type="radio"] { inline-size: 22px; block-size: 22px; }
.kurum-formu input[type="color"] { inline-size: 100%; min-block-size: 44px; }
/* Dosya secici: tarayici varsayilani 12 px'e dusuyor, acikca baglanir. */
.kurum-formu input[type="file"],
.magaza-gorsel-formu input[type="file"] { font-size: 16px; min-block-size: 44px; }

/* Urun (kurs) duzenleme formu da Vitrin grubunun parcasi: ayni 16 px kurali.
   Panelin GERI KALANINDAKI 15 px borcu ayri bir tasarim turu isi (g47'de olculdu). */
.magaza-yonetim-formu input,
.magaza-yonetim-formu select,
.magaza-yonetim-formu textarea {
    font-size: 16px;
    line-height: 1.5;
    font-family: inherit;
}
.magaza-yonetim-formu input[type="checkbox"] { inline-size: 22px; block-size: 22px; }

/* ============================== 042: Vitrin grubu ekranlarinda 44 px dokunma hedefi
   Panelin PAYLASILAN dugme stilleri telefonda 34-40 px (g47'de olculup kayda gecen
   panel geneli borc). Burada yalnız Vitrin grubunun kendi ekranlari kapatiliyor;
   kabuk (sol menu, ust cubuk) ve oteki modullerin dugmeleri ayri bir tasarim turu isi.
   Kapsam HOOK'u: ekran basinda basilan gorunmez `.sitem-isaret` + `:has()`.
   Boylece mevcut ekran govdelerini sarmalamak (ve div dengesi riski) gerekmiyor. */
.panel-icerik:has(.sitem-isaret) .buton,
.panel-icerik:has(.sitem-isaret) .ince-dugme,
.panel-icerik:has(.sitem-isaret) .ikon-dugme,
.panel-icerik:has(.sitem-isaret) .sm-arac-dugme { min-block-size: 44px; }
.panel-icerik:has(.sitem-isaret) .buton--kucuk { min-block-size: 44px; padding-block: 0; }
/* Satir ici metin baglantilari (tablo hucresi, kirinti, "mağazada gör") */
.panel-icerik:has(.sitem-isaret) .tablo a,
.panel-icerik:has(.sitem-isaret) .sayfa-geri,
.panel-icerik:has(.sitem-isaret) .kart-baslik a,
.panel-icerik:has(.sitem-isaret) .sayfa-basligi a,
.sitem-bilgi-bag { display: inline-flex; align-items: center; min-block-size: 44px; }
.sitem-isaret { display: block; width: 0; height: 0; overflow: hidden; }

/* Sayfa listesi telefonda YATAY KAYMASIN: tablo satirlari kart gibi yiğilir.
   (Yatay kaydirma kutusu da tasma sayardi: hucreler goruntu alani disinda kaliyor.) */
@media (max-width: 720px) {
    .sm-sayfa-tablo, .sm-sayfa-tablo tbody, .sm-sayfa-tablo tr, .sm-sayfa-tablo td { display: block; width: 100%; }
    .sm-sayfa-tablo thead { display: none; }
    .sm-sayfa-tablo tr {
        border: 1px solid var(--cizgi, #E5E7EB); border-radius: 12px;
        padding: 10px 12px; margin-bottom: 10px; background: #fff;
    }
    .sm-sayfa-tablo td { border: 0; padding: 3px 0; }
    .sm-sayfa-islem { display: flex; flex-wrap: wrap; gap: 6px; white-space: normal; }
}

/* 045 — Bildirim E-postaları ekranı (sitem-mailler).
   Olay listesi gruplara ayrılıyor; fieldset/legend panelin hiçbir yerinde
   kullanılmadığı için tarayıcı varsayılanı (kalın kenarlık, 16 px kenar
   boşluğu) buradaki tek görünümdü — ölçeğe çekiliyor. */
.mail-grup {
    border: 1px solid var(--cizgi, #E5E7EB);
    border-radius: 12px;
    padding: 10px 14px 12px;
    margin: 0 0 14px;
    min-inline-size: 0;            /* fieldset kendi içeriğinden taşmasın */
}
.mail-grup legend {
    padding: 0 6px;
    font-size: .9rem;
    font-weight: 700;
    color: var(--koyu, #1F2937);
}
.mail-grup .sitem-onay { margin: 0; }
.mail-grup .sitem-onay small { color: var(--ikincil-yazi, #6B7280); }

/* Gönderim kaydının filtre çubuğu — kart başlığının sağında, telefonda altına iner. */
.mail-filtre { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.mail-filtre input, .mail-filtre select { font-size: 1rem; min-block-size: 44px; }
.panel-icerik:has(.sitem-isaret) .mail-filtre input,
.panel-icerik:has(.sitem-isaret) .mail-filtre select { font-size: 1rem; }
@media (max-width: 720px) {
    .mail-filtre { width: 100%; }
    .mail-filtre input, .mail-filtre select, .mail-filtre button { flex: 1 1 100%; }
}