/* SNN tema bileşenleri: KOYU HAKİ header/footer + AÇIK (kırık beyaz) gövde (karar 2026-09-19).
   Düzen referansı Shopco (ölçüler tokens.css'te), ritim referansı izmiravmarket.com
   ("onun koyu kısmı bizde haki"): koyu bant/header → açık gövde → koyu vurgu bandı → koyu footer.
   Kurallar: haki ürün kartı zemininde YOK; turuncu butonda koyu metin; kartta düz fiyat; en çok 2 rozet.
   Açık zeminde turuncu metin okunmaz: bağlantı koyu + altı çizili (tokens.css --snn-baglanti).

   Koyu/açık bağlam tokens.css'teki `.snn-koyu` seçici listesinden gelir; burada
   --snn-metin / --snn-kenar / --snn-bolum gibi isimler iki bağlamda da doğru değeri verir.

   Not: Blocksy dinamik CSS'i bu dosyadan sonra basılır. Kritik yerlerde ya theme_mods
   (scripts/tema-ayarlari.php) ile ayarlanır ya da burada özgüllük/!important ile ezilir. */

/* ==================================================================
   1. Genel gövde
   ================================================================== */

#main-container,
.site-main,
.wp-site-blocks {
  background: transparent;
}

a { color: var(--theme-link-initial-color); }
a:hover { color: var(--snn-baglanti-hover); }

/* Açık zeminde metin içi bağlantı: turuncu 4.5:1'i tutturmuyor → koyu + altı çizili.
   Buton/kart/menü bağlantıları dışarıda bırakılır. */
.entry-content p a,
.entry-content li a,
.entry-content td a,
.woocommerce-Tabs-panel p a,
.woocommerce-Tabs-panel li a {
  text-decoration: underline;
  text-underline-offset: 2px;
  text-decoration-thickness: 1px;
}
.entry-content p a:hover,
.entry-content li a:hover { text-decoration-color: var(--snn-baglanti-hover); }
.entry-content .wp-block-button__link,
.entry-content .snn-marka-seridi a,
.entry-content .snn-kategori-kart,
.entry-content .snn-uyumlu-modeller a { text-decoration: none; }

hr, .ct-divider { border-color: var(--snn-kenar); }

::selection { background: var(--snn-vurgu); color: var(--snn-vurgu-metin); }

/* ==================================================================
   1b. Tam genişlikte uzun metin (karar 2026-09-21)
   Site kenardan kenara (tokens.css --snn-icerik 100%); düz metin blokları ise
   okunabilirlik için 960 px'te kalır (Archivo Narrow dar, ~110 karakter satır).
   Izgaralar, kartlar, tablolar, kısa kod çıktıları (Kılıfını Seç listesi, bulucu)
   etkilenmez: yalnız paragraf/liste/başlık/alıntı hedeflenir. Ürün sekmeleri urun.css 3a.
   ================================================================== */

.page:not(.home) [class*="ct-container"] > article .entry-content > :is(p, ul, ol, h1, h2, h3, h4, blockquote) {
  max-width: 960px;
}

/* ==================================================================
   2. Üst duyuru bandı (Shopco TopBanner: py-2, text-xs/sm)
   ================================================================== */

.ct-header [data-row="top"] {
  background-color: var(--snn-bant) !important;
  --theme-text-color: var(--snn-koyu-metin);
  --theme-link-initial-color: var(--snn-beyaz);
  font-size: 14px;
}
.ct-header [data-row="top"] .ct-container { min-height: 0; }
.ct-header [data-row="top"] a { color: var(--snn-beyaz); text-decoration: underline; text-underline-offset: 2px; }
.ct-header [data-row="top"] a:hover { color: var(--snn-vurgu); }

.snn-bant-metin {
  margin: 0;
  text-align: center;
  letter-spacing: .01em;
  white-space: normal;
  overflow-wrap: anywhere;
}
.ct-header [data-row="top"] .ct-header-text,
.ct-header [data-row="top"] .entry-content { min-width: 0; }

/* ==================================================================
   3. Header (koyu; logo · menü · arama · "Silahını Seç" · sepet)
   ================================================================== */

.ct-header [data-row="middle"] {
  background-color: var(--snn-koyu-zemin) !important;
  border-bottom: 1px solid var(--snn-koyu-kenar);
}

.ct-header [data-id="logo"] .site-title a {
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--snn-koyu-baslik);
}
.ct-header [data-id="logo"] .site-title a:hover { color: var(--snn-vurgu); }

/* Menü: Shopco gibi sade; Blocksy varsayılanı 12px/uppercase/700, biz 15px/500.
   Ölçüler (font 15px + boşluk 14px) altı üst öğenin de sığması içindir. Blocksy'nin
   "Diğer" açılırı kapalı (B2); dar masaüstü kırılımı aşağıda (arama bölümünün altı). */
.ct-header [data-id="menu"] { --menu-items-gap: 14px !important; }
.ct-header [data-id="menu"] > ul > li > a.ct-menu-link {
  font-size: 15px;
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
  color: var(--snn-metin);
}
.ct-header [data-id="menu"] > ul > li > a.ct-menu-link:hover,
.ct-header [data-id="menu"] > ul > li.current-menu-item > a.ct-menu-link { color: var(--snn-vurgu); }

/* "Kılıfını Seç" (Bülent 2026-09-21): üst menüdeki ilk öğe header zemininden ayrılmış
   bir kutuda (turuncu tonlu zemin + kenarlık, köşe 4px) yumuşakça yanıp söner: yalnız
   KUTU nabız atar (zemin tonu, kenarlık, dış halka; 1,8 sn), metin hep açık krem kalır.
   Metin rengini de değiştirmek yanlıştı: ara karelerde turuncu üstünde kahverengi metin
   okunmuyordu. Hover ve etkin sayfada sabit dolu turuncu + koyu metin (buton gibi).
   Öğenin sınıfı yok, adresinden yakalanır (`/kydex-kilif-sec/`, 2026-09-25'e kadar `/silahini-sec/`; alt menüdeki "Markaya Göre"
   `.sub-menu`'de, kapsam dışı). Sistem "hareketi azalt" ve panel "Hareketi kapat"
   (`.snn-hareketsiz`) animasyonu kapatır; öğe sabit kutu olarak kalır. */
@keyframes snn-menu-nabiz {
  0%, 100% {
    background-color: rgba(248, 167, 43, .08);
    border-color: rgba(248, 167, 43, .40);
    box-shadow: 0 0 0 0 rgba(248, 167, 43, 0);
  }
  50% {
    background-color: rgba(248, 167, 43, .32);
    border-color: var(--snn-vurgu);
    box-shadow: 0 0 0 4px rgba(248, 167, 43, .25);
  }
}
.ct-header [data-id="menu"] > ul > li > a.ct-menu-link[href$="/kydex-kilif-sec/"],
.ct-header [data-id="menu"] > ul > li > a.ct-menu-link[href$="/silahini-sec/"] {
  align-self: center;         /* Blocksy bağlantıyı header boyunca uzatır (96 px); kutu metin kadar */
  height: auto;
  padding: 8px 12px;
  margin-inline-end: 4px;
  border: 1px solid rgba(248, 167, 43, .40);
  border-radius: var(--snn-radius);
  background-color: rgba(248, 167, 43, .08);
  color: var(--snn-metin);
  font-weight: 600;
  line-height: 1;
}
.ct-header [data-id="menu"] > ul > li > a.ct-menu-link[href$="/kydex-kilif-sec/"]:hover,
.ct-header [data-id="menu"] > ul > li > a.ct-menu-link[href$="/silahini-sec/"]:hover,
.ct-header [data-id="menu"] > ul > li.current-menu-item > a.ct-menu-link[href$="/kydex-kilif-sec/"],
.ct-header [data-id="menu"] > ul > li.current-menu-item > a.ct-menu-link[href$="/silahini-sec/"] {
  background-color: var(--snn-vurgu);
  border-color: var(--snn-vurgu);
  color: var(--snn-vurgu-metin);
}
@media (prefers-reduced-motion: no-preference) {
  body:not(.snn-hareketsiz) .ct-header [data-id="menu"] > ul > li:not(.current-menu-item) > a.ct-menu-link[href$="/kydex-kilif-sec/"],
  body:not(.snn-hareketsiz) .ct-header [data-id="menu"] > ul > li:not(.current-menu-item) > a.ct-menu-link[href$="/silahini-sec/"] {
    animation: snn-menu-nabiz 1.8s ease-in-out infinite;
  }
  body:not(.snn-hareketsiz) .ct-header [data-id="menu"] > ul > li > a.ct-menu-link[href$="/kydex-kilif-sec/"]:hover,
  body:not(.snn-hareketsiz) .ct-header [data-id="menu"] > ul > li > a.ct-menu-link[href$="/silahini-sec/"]:hover {
    animation: none;
  }
}

/* Açılır menü: Blocksy alt menü rengini palet 8'den alıyor (koyu temada okunmaz) */
.ct-header [data-id="menu"] .sub-menu {
  --theme-link-initial-color: var(--snn-metin);
  background-color: var(--snn-bant);
  border: 1px solid var(--snn-kenar);
  border-radius: var(--snn-radius);
}
.ct-header [data-id="menu"] .sub-menu .ct-menu-link { color: var(--snn-metin) !important; font-size: 15px; }
.ct-header [data-id="menu"] .sub-menu .ct-menu-link:hover { color: var(--snn-vurgu) !important; }

/* Arama: Blocksy başlıkta ikon/modal kullanıyor. Shopco'daki çubuk hissi için
   çocuk temada gerçek bir arama kutusu (snn-arama) header'a basılıyor (functions.php). */
.snn-arama {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 190px;
  max-width: 280px;
  flex: 0 1 240px;
  background: var(--snn-koyu-bolum);
  border: 1px solid var(--snn-koyu-kenar);
  border-radius: var(--snn-radius);
  padding: 0 12px;
  height: 44px;
}
.snn-arama svg { flex: 0 0 auto; fill: var(--snn-koyu-ikincil); }
.snn-arama input[type="search"] {
  flex: 1 1 auto;
  min-height: 0;
  height: 42px;
  padding: 0;
  margin: 0;
  border: 0;
  background: transparent;
  color: var(--snn-metin);
  font-family: var(--snn-font);
  font-size: 15px;
  box-shadow: none;
}
.snn-arama input[type="search"]:focus { outline: none; box-shadow: none; }
.snn-arama input::placeholder { color: var(--snn-ikincil); opacity: 1; }
.snn-arama:focus-within { border-color: var(--snn-vurgu); }
/* Tam genişlikte (2026-09-21) geniş header'da arama kutusu orantısız küçük kalmasın. */
@media (min-width: 1600px) {
  .snn-arama { flex-basis: 320px; max-width: 360px; }
}

/* B2 (2026-09-19): Blocksy'nin "Diğer ⌄" taşıma JS'i kapalı (functions.php), sığma burada.
   Menü hiç daralmaz (içeriği üst üste binmesin); sıkışınca önce arama kutusu küçülür.
   ≥1280: tam arama çubuğu · 1000–1279: arama ikonu (Blocksy modalı) + daha sık menü. */
.ct-header [data-device="desktop"] [data-id="menu"] { flex-shrink: 0; }
.ct-header [data-id="menu"] > ul > li > a.ct-menu-link { white-space: nowrap; }
.snn-arama-ikon { display: none; }

@media (min-width: 1000px) and (max-width: 1279.98px) {
  .ct-header [data-device="desktop"] .snn-arama { display: none; }
  .ct-header [data-device="desktop"] .snn-arama-ikon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
    background: transparent;
    border: 0;
    cursor: pointer;
    flex-shrink: 0;
  }
  .snn-arama-ikon .ct-icon { fill: var(--snn-metin); }
  .snn-arama-ikon:hover .ct-icon,
  .snn-arama-ikon:focus-visible .ct-icon { fill: var(--snn-vurgu); }
  .ct-header [data-id="menu"] { --menu-items-gap: 6px !important; }
  .ct-header [data-id="menu"] > ul > li > a.ct-menu-link { font-size: 14px; }
}

/* Header ikonları (arama tetiği, sepet, mobil menü) */
.ct-header [data-id="cart"] .ct-icon,
.ct-header [data-id="search"] .ct-icon,
.ct-header [data-id="trigger"] .ct-icon,
.ct-header .snn-hesap-ikon .ct-icon { fill: var(--snn-metin); }
.ct-header [data-id="cart"]:hover .ct-icon,
.ct-header [data-id="search"]:hover .ct-icon,
.ct-header .snn-hesap-ikon:hover .ct-icon,
.ct-header .snn-hesap-ikon:focus-visible .ct-icon { fill: var(--snn-vurgu); }

/* Hesap simgesi (parts/header-sepet.php, 2026-09-24): sepetin önünde, aynı boyda ikon. */
.ct-header .snn-hesap-ikon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
}
.ct-header .snn-hesap-ikon .ct-icon { width: 15px; height: 15px; }

/* Dar telefonda dört ikon (arama, hesap, sepet, menü) logoyla çakışıyor (390'da 31 px):
   hesap simgesi gizlenir, hesaba erişim mobil açılır menünün sonundaki "Hesabım / Giriş yap"
   satırında (functions.php, `menu_mobile`). */
@media (max-width: 479.98px) {
  .ct-header [data-device="mobile"] .snn-hesap-ikon { display: none !important; }
}
.ct-header [data-id="cart"] .ct-cart-badge {
  background: var(--snn-vurgu);
  color: var(--snn-vurgu-metin);
}

/* ------------------------------------------------------------------
   Mobil/tablet header tetikleyicileri: 44×44 dokunma hedefi (2026-09-20)

   Blocksy mobil satırda öğeleri ikon boyutunda basıyor (arama 15×15,
   sepet 15×15, hamburger 18×18) ve her birine 10 px yan boşluk veriyor.
   Parmakla isabet ettirmek zordu. İkonun görsel boyutu AYNI kalır;
   büyüyen yalnız tıklanabilir kutu. Yan boşluk 4 px'e iner → aradaki
   açıklık 8 px (44 px'lik kutular 390'da logoyla çakışmadan sığsın).
   Masaüstü satırı bu kuralların dışında (yalnız [data-device="mobile"]).
   ------------------------------------------------------------------ */

@media (max-width: 999.98px) {
  .ct-header [data-device="mobile"] [data-row="middle"] .ct-header-search,
  .ct-header [data-device="mobile"] [data-row="middle"] .ct-header-trigger,
  .ct-header [data-device="mobile"] [data-row="middle"] .ct-header-cart > .ct-cart-item,
  .ct-header [data-device="mobile"] [data-row="middle"] .snn-hesap-ikon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 44px;
    padding: 0;
  }

  /* Yan boşluk: Blocksy öğe aralığını `#header [data-items] > * { margin: var(--margin, 0 10px) }`
     ile veriyor (main.min.css). Seçici ID taşıdığı için sınıf/öznitelikle yenilemez;
     doğru kanca değişkenin kendisi. `--margin` öğe üstünde tanımlanınca aralık 20 → 8 px
     olur, grup sağ kenara yapışık kalır ve logoyla çakışmaz (!important yok). */
  .ct-header [data-device="mobile"] [data-row="middle"] [data-id="search"] { --margin: 0 4px 0 0; }
  .ct-header [data-device="mobile"] [data-row="middle"] [data-id="cart"]   { --margin: 0 4px; }
  .ct-header [data-device="mobile"] [data-row="middle"] [data-id="snn-hesap"] { --margin: 0 4px; }
  .ct-header [data-device="mobile"] [data-row="middle"] [data-id="trigger"]{ --margin: 0 0 0 4px; }

  /* Sepet sayacı (Blocksy: span.ct-dynamic-count-cart) `.ct-cart-item`'a göre mutlak
     konumlanıyor; kutu 44 px olunca ikondan kopuyordu. Ortadan ölçülüp ikonun sağ üstüne
     geri alınır (ikon 15×15). */
  .ct-header [data-device="mobile"] [data-row="middle"] .ct-cart-item .ct-dynamic-count-cart {
    top: 50%;
    right: 50%;
    transform: translate(60%, -120%);
  }
}

/* Header mini sepeti küçük görseli: kırpılmamış görsel kareye sığar (B7, functions.php) */
.woocommerce-mini-cart .ct-media-container img {
  object-fit: contain;
  background: var(--snn-kart);
}

/* "Silahını Seç" turuncu düğme yuvası */
.ct-header [data-id="button"] .ct-button,
.snn-silah-sec {
  background: var(--snn-vurgu);
  color: var(--snn-vurgu-metin) !important;
  font-weight: 700;
  border-radius: var(--snn-radius);
  white-space: nowrap;
}
.ct-header [data-id="button"] .ct-button:hover,
.snn-silah-sec:hover { background: var(--snn-vurgu-hover); }

/* ------------------------------------------------------------------
   3b. Yapışkan header (site geneli, YALNIZ ≥1000 px — karar 2026-09-20)

   Blocksy ücretsizde yapışkan header yok (Pro özelliği), bu yüzden kendi
   CSS + JS'imiz: `position: sticky` + NEGATİF `top`. Header kutusu üst bant
   yüksekliği kadar yukarıdan yapışır → üst duyuru bandı ("Siparişe özel
   üretim…") viewport'un üstüne kayıp gider, orta satır (logo · menü · arama ·
   "Silahını Seç" · sepet) ekranda kalır.

   Neden sticky, neden fixed değil: sticky'yi kıracak kaydırma atası yok.
   Blocksy `#main-container{overflow:hidden;overflow:clip}` yazıyor; modern
   tarayıcı `clip`i uygular ve `clip` KAYDIRMA KUTUSU YARATMAZ. `body{overflow-x:hidden}`
   ise html görünür olduğu için viewport'a devredilir, body'de `visible` kalır.
   Doğrulandı 2026-09-20 (aynı gerekçeyle ürün sayfasındaki yapışkan galeri
   sütunu da çalışıyor). Fixed olsaydı gövdeye üst boşluk eklemek gerekirdi.

   Üst bant yüksekliği sabit yazılmaz (metin iki satıra düşebilir):
   assets/js/header-yapiskan.js `[data-row="top"]`ı ölçüp :root'a
   `--snn-ust-bant-yuk` yazar (load + resize). tokens.css'teki 40px yedektir.

   Yapışık orta satırın yüksekliği DETERMİNİSTİK: `--snn-header-yapisik-yuk` (64px).
   Ürün sayfasındaki yapışkan öğelerin `top`u bu değerden hesaplandığı için
   (urun.css bölüm 2b) JS ölçümüne bırakılmadı.

   Blocksy'nin kendi değişkenleri kullanılıyor (üçüncü taraf kod düzenlenmiyor):
   satır yüksekliği `--shrink-height` (`#header [data-row]>div{min-height:…}`),
   logo yüksekliği `--logo-shrink-height` (`.site-logo-container{height:…}`).
   İkisi de Pro'nun yapışkan header'ı için tanımlı, ücretsizde hiç yazılmıyor.

   z-index: Blocksy `#header{z-index:50}` veriyor — ürün sayfasındaki yapışkan
   öğelerin (z 2–3), yönetici çubuğunun (99999) ve Blocksy panellerinin
   (.ct-panel 999999) ALTINDA kalmadan doğru sırayı veriyor; değiştirilmedi.
   ------------------------------------------------------------------ */

@media (min-width: 1000px) {
  .ct-header#header {
    position: sticky;
    top: calc(var(--admin-bar, 0px) - var(--snn-ust-bant-yuk, 40px));
  }

  /* Yapışınca (body.snn-header-yapisik, header-yapiskan.js ekler):
     orta satır sabit yüksekliğe iner, logo küçülür. */
  body.snn-header-yapisik .ct-header [data-row="middle"] {
    --shrink-height: var(--snn-header-yapisik-yuk);
  }
  body.snn-header-yapisik .ct-header [data-id="logo"] .site-logo-container {
    --logo-shrink-height: var(--snn-logo-yuk-kucuk);
  }

  .ct-header [data-row="middle"] > div { transition: min-height .2s ease; }
  /* Blocksy `.site-logo-container{transition:none}` yazıyor; geçiş burada açılır. */
  .ct-header [data-id="logo"] .site-logo-container { transition: height .2s ease; }

  /* Sayfa içi çıpalar (#snn-secenekler, #ic-tasima …) yapışkan header'ın altında
     kalmasın. `:where()` özgüllüğü 0 bırakır → gerekirse tek satırla ezilir. */
  :where([id]) {
    scroll-margin-top: calc(var(--admin-bar, 0px) + var(--snn-header-yapisik-yuk) + 16px);
  }
}

@media (min-width: 1000px) and (prefers-reduced-motion: reduce) {
  .ct-header [data-row="middle"] > div,
  .ct-header [data-id="logo"] .site-logo-container { transition: none; }
}

/* Offcanvas (mobil menü paneli) koyu kalsın */
#offcanvas .ct-panel-inner { background-color: var(--snn-footer); }
#offcanvas .ct-menu-link { color: var(--snn-metin); }
#search-modal { background-color: rgba(30, 32, 24, .97); }

/* ==================================================================
   4. Butonlar
   ================================================================== */

.button,
.wp-block-button__link,
.ct-button,
.wp-element-button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce .single_add_to_cart_button {
  font-family: var(--snn-font);
  font-weight: 600;
  font-size: 15px;
  letter-spacing: .02em;
  text-transform: none;
  border-radius: var(--snn-radius);
  background-color: var(--snn-vurgu);
  color: var(--snn-vurgu-metin);
  border: none;
}
.button:hover,
.wp-block-button__link:hover,
.ct-button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce .single_add_to_cart_button:hover {
  background-color: var(--snn-vurgu-hover);
  color: var(--snn-vurgu-metin);
}

/* İkincil / çerçeveli buton: haki çerçeve, zemin şeffaf.
   Açık gövdede koyu metin + haki çerçeve, koyu bantta açık metin + haki çerçeve. */
.snn-buton-ikincil,
.button.snn-buton-ikincil,
.wp-block-button.is-style-outline > .wp-block-button__link,
.wp-block-button__link.is-style-outline {
  background: transparent !important;
  color: var(--snn-metin) !important;
  box-shadow: inset 0 0 0 1.5px var(--snn-marka);
  border: none;
}
.snn-buton-ikincil:hover,
.button.snn-buton-ikincil:hover,
.wp-block-button.is-style-outline > .wp-block-button__link:hover,
.wp-block-button__link.is-style-outline:hover {
  background: transparent !important;
  color: var(--snn-vurgu) !important;
  box-shadow: inset 0 0 0 1.5px var(--snn-vurgu);
}

/* Koyu bantta çerçeve hakinin açığı olsun (haki üstünde haki kaybolur) */
.snn-koyu .snn-buton-ikincil,
.snn-hero .wp-block-button.is-style-outline > .wp-block-button__link,
.snn-bolum--koyu .wp-block-button.is-style-outline > .wp-block-button__link {
  box-shadow: inset 0 0 0 1.5px rgba(236, 235, 227, .55);
}

/* ==================================================================
   5. Bölümler ve başlıklar (Shopco: text-[32px] md:text-5xl, mb-8 md:mb-14)
   ================================================================== */

.snn-bolum { padding: 56px 0; }

/* Açık vurgulu şerit (marka şeridi gibi): kırık beyazın bir ton koyusu */
.snn-bolum--vurgu { background: var(--snn-bolum); }

/* Koyu haki vurgu bandı ("Neden Kydex") — referanstaki siyah bandın karşılığı.
   Tam genişlik: `alignfull` ile basılır (snn-core/templates/ana-sayfa/neden.php). */
.snn-bolum--koyu {
  background: var(--snn-koyu-zemin);
  padding: 64px 0;
}
/* Tam genişlik şeritler bitişik dursun: WP'nin blok aralığı (1.5em) araya
   açık bir çizgi bırakıyordu (kahraman ile marka şeridi arasında 26px). */
.snn-hero,
.snn-bolum--vurgu,
.snn-bolum--koyu { margin-block: 0 !important; }

.snn-bolum-baslik,
.ct-module-title,
.related > h2,
.up-sells > h2 {
  font-size: 40px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .015em;
  color: var(--snn-baslik);
  text-align: center;
  margin: 0 0 var(--snn-bolum-bosluk);
}

/* Sayfa başlığı şeridi (Blocksy hero) — açık gövdede açık şerit.
   type-2 (ortalanmış, tam genişlik) şerit olarak durur; type-1 kapsayıcı genişliğinde
   basıldığı için zemin verilirse sayfanın ortasında kutu gibi görünüyor → şeffaf. */
.hero-section { background-color: var(--snn-bolum) !important; }
.hero-section[data-type="type-1"] {
  background-color: transparent !important;
  border-bottom: 1px solid var(--snn-kenar);
  padding-bottom: 20px;
}
.hero-section .page-title,
.entry-header .page-title { color: var(--snn-baslik); }
.ct-breadcrumbs,
.ct-breadcrumbs a { color: var(--snn-ikincil); }
.ct-breadcrumbs a:hover { color: var(--snn-baglanti-hover); }

/* ==================================================================
   5b. Kahraman (.snn-hero) — kendi markup'ımız, `wp:cover` değil
   snn-core/templates/ana-sayfa/kahraman-sabit.php
   Ölçüler eski cover bloğuyla birebir: 520 px yükseklik, 1em iç boşluk,
   başlık/alt metin akışkan (clamp) tipografi, butonlar arası 1.5em.
   Örtünün rengi --snn-koyu-zemin (panelden değişir), yoğunluğu satır içi
   `opacity` (SNN Ayarları → Ana Sayfa → Kahraman karartma).
   ================================================================== */

.snn-hero {
  position: relative;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 520px;
  padding: 1em;
  overflow: clip;
  background: var(--snn-koyu-zemin);
}

.snn-hero-gorsel {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  margin: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  object-fit: cover;
  object-position: 50% 50%;
}

.snn-hero-orti {
  position: absolute;
  inset: 0;
  background-color: var(--snn-koyu-zemin);
}

.snn-hero-ic {
  position: relative;
  z-index: 1;
  width: 100%;
  text-align: center;
}

.snn-hero-baslik {
  margin: 0 0 .52em;
  font-size: clamp(27.894px, 1.743rem + ((1vw - 3.2px) * 1.571), 48px);
  line-height: 1.1;
  text-transform: uppercase;
  color: var(--snn-koyu-baslik);
}

.snn-hero-alt {
  margin: 0 0 1.5em;
  font-size: clamp(14px, 0.875rem + ((1vw - 3.2px) * 0.313), 18px);
  color: var(--snn-koyu-metin);
}

.snn-hero-ic > :last-child { margin-bottom: 0; }

.snn-hero-butonlar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--theme-content-spacing, 1.5em);
}

/* ==================================================================
   6. Ürün ızgarası ve kartı — AÇIK KART (haki yasak)
   ================================================================== */

/* Mağaza: 4 sütun masaüstü / 2 mobil (filtre paneli yok); tam genişlikte ≥1600 px'te 5 sütun
   (2026-09-21: 1856 px içerikte 4 kart 444 px'e büyüyordu; 5 sütun kartı ~355 px'te tutar). */
[data-products] { --shop-columns: repeat(4, minmax(0, 1fr)); gap: var(--snn-izgara-bosluk); }
@media (min-width: 1600px) {
  /* Blocksy dinamik CSS'i `[data-products]` (0,1,0) ile sonra basar → (0,2,0) gerekir;
     `.related/.upsells [data-products]` (0,2,0) Blocksy'de sonra geldiği için 3 sütunda kalır. */
  [data-products][data-products] { --shop-columns: repeat(5, minmax(0, 1fr)); }
}

[data-products] .product,
.products .product {
  background: var(--snn-kart);
  border: 1px solid var(--snn-kart-kenar);
  border-radius: var(--snn-radius-kart);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: var(--snn-golge);
  transition: box-shadow .15s ease, transform .15s ease, border-color .15s ease;

  /* Açık kart bağlamı: içerideki her şey koyu metne döner */
  --theme-text-color: var(--snn-kart-metin);
  --theme-headings-color: var(--snn-kart-metin);
  --theme-link-initial-color: var(--snn-kart-metin);
  --theme-border-color: var(--snn-kart-kenar);
  color: var(--snn-kart-metin);
}
[data-products] .product:hover,
.products .product:hover {
  box-shadow: var(--snn-golge-kart);
  border-color: var(--snn-kart-kenar-hover);
  transform: translateY(-2px);
}

/* Görsel alanı: beyaz, 1:1 (Shopco aspect-square) */
[data-products] .product figure,
[data-products] .product .ct-media-container,
.products .product .ct-media-container {
  background: var(--snn-kart-gorsel);
  border-radius: 0;
  margin: 0;
  --product-element-spacing: 0;
}
[data-products] .product .ct-image-container,
[data-products] .product img {
  aspect-ratio: 1 / 1;
  object-fit: contain;
  width: 100%;
}

[data-products] .product .woocommerce-loop-product__title,
.products .product .woocommerce-loop-product__title {
  font-size: 17px;
  font-weight: 600;
  line-height: 1.3;
  color: var(--snn-kart-metin);
  padding: 14px 14px 0;
  margin: 0;
  /* ad en çok 2 satır */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 2.6em;
}
[data-products] .product .woocommerce-loop-product__title a { color: inherit; }

[data-products] .product .price,
.products .product .price {
  font-size: 19px;
  font-weight: 700;
  color: var(--snn-kart-metin);
  padding: 6px 14px 0;
  margin: 0;
  --product-element-spacing: 0;
}
[data-products] .product .price del { color: var(--snn-kart-ikincil); font-weight: 400; font-size: 15px; }
[data-products] .product .price ins { text-decoration: none; color: var(--snn-indirim); }
[data-products] .product .price .woocommerce-price-suffix { display: block; font-size: 12px; font-weight: 400; color: var(--snn-kart-ikincil); } /* "+ %20 KDV" (Woo → Vergi) fiyatın altında küçük */

/* Kart butonu "Modelini Seç" (functions.php üretiyor) */
.snn-kart-buton,
[data-products] .product .ct-woo-card-actions .button {
  display: block;
  text-align: center;
  margin: 14px 14px 14px;
  margin-top: auto;
  padding: 10px 16px;
  font-size: 15px;
  font-weight: 600;
  background: var(--snn-vurgu);
  color: var(--snn-vurgu-metin);
  border-radius: var(--snn-radius);
}
.snn-kart-buton:hover { background: var(--snn-vurgu-hover); color: var(--snn-vurgu-metin); }

/* Puan/meta kartta yok (karar: rozet var, puan yok) */
[data-products] .product .star-rating,
[data-products] .product .entry-meta { display: none; }

/* ==================================================================
   7. Rozetler (en çok 2; snn-core/modules/rozetler.php basar)
   ================================================================== */

.snn-rozetler {
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  pointer-events: none;
}
.snn-rozet {
  font-family: var(--snn-font);
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: .05em;
  text-transform: uppercase;
  padding: 6px 9px;
  border-radius: var(--snn-radius);
  white-space: nowrap;
}
.snn-rozet--kisiye-ozel { background: var(--snn-vurgu); color: var(--snn-vurgu-metin); }
.snn-rozet--fenerli {
  background: transparent;
  color: var(--snn-marka);
  box-shadow: inset 0 0 0 1.5px var(--snn-marka);
  background-color: rgba(255, 255, 255, .85);
}
.snn-rozet--indirim { background: var(--snn-indirim); color: var(--snn-beyaz); }
/* Ön sipariş: koyu haki plaka + açık metin (stok durumundan otomatik; modules/stok.php) */
.snn-rozet--on-siparis { background: var(--snn-koyu-bolum); color: var(--snn-koyu-metin); }

[data-products] .product figure,
.woocommerce-product-gallery { position: relative; }

/* Ürün sayfasındaki rozet şeridi: akış içinde */
.entry-summary .snn-rozetler,
.snn-rozetler--satir {
  position: static;
  flex-direction: row;
  flex-wrap: wrap;
  margin: 0 0 16px;
}

/* WooCommerce indirim rozeti ("%6 İndirim", rozetler.php) ve Blocksy tükendi rozeti ("Tükendi", sözlükten) */
.onsale, .out-of-stock-badge, [class*="ct-woo-badge-"] {
  font-family: var(--snn-font);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  border-radius: var(--snn-radius);
  background: var(--snn-indirim);
  color: var(--snn-beyaz);
}
.out-of-stock-badge { background: var(--snn-koyu-bolum); color: var(--snn-koyu-metin); }

/* ==================================================================
   8. Kategori kartları (2026-09-24: panelden seçilen kategoriler, varsayılan 9 kart)
   Şablon snn-core/templates/ana-sayfa/kategoriler.php; ev dosyası
   reports/2026-09-24-ana-sayfa-kategori-kartlari.md.
   60'lık bölüm: her kartın satırdaki payı satır içi `--kk-m` (masaüstü) / `--kk-t` (tablet) /
   `--kk-p` (telefon) değişkeniyle gelir (60 = tam satır); PHP satırları dengeler, her satır tam dolar.
   Esnek kutu: genişlik = (100% + boşluk) × pay / 60 − boşluk (60 sütunluk grid'de 59 boşluk taşar).
   Fotoğraf <img> (object-fit: cover), üstünde alttan koyu degrade; görselsiz kart açık
   bölüm zemininde koyu metin. Haki zemin YOK (kart fotoğrafı kaybolmasın).
   ================================================================== */

.snn-kategoriler {
  --kk-bosluk: var(--snn-izgara-bosluk);
  display: flex;
  flex-wrap: wrap;
  gap: var(--kk-bosluk);
}
.snn-kategori-kart {
  --kk-yuk: 230px;
  --kk-pay: var(--kk-m, 20);
  position: relative;
  flex: 0 0 auto;
  width: calc((100% + var(--kk-bosluk)) * var(--kk-pay) / 60 - var(--kk-bosluk));
  display: flex;
  align-items: flex-end;
  min-height: var(--kk-yuk);
  overflow: hidden;
  isolation: isolate;
  border-radius: var(--snn-radius-kart);
  border: 1px solid var(--snn-kart-kenar);
  background: var(--snn-kart-gorsel);  /* fotoğraf yüklenirken beyaz (ürün fotoğrafları beyaz zeminli) */
  color: var(--snn-koyu-baslik);
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
}
.snn-kategori-kart--buyuk { --kk-yuk: 320px; }

.snn-kategori-kart__gorsel {
  position: absolute;
  inset: 0;
  z-index: -1;
}
.snn-kategori-kart__resim {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
/* Alttan karartma: metin her fotoğrafta okunur, üst yarı (ürün) açık kalır. */
.snn-kategori-kart__gorsel::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(var(--snn-orti-rgb), .88) 0%,
    rgba(var(--snn-orti-rgb), .55) 38%,
    rgba(var(--snn-orti-rgb), 0) 68%
  );
}

.snn-kategori-kart__metin {
  display: flex;
  flex-direction: column;
  gap: 4px;
  width: 100%;
  padding: 18px 20px;
}
.snn-kategori-kart__etiket {
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--snn-koyu-ikincil);
}
.snn-kategori-kart__ad {
  font-size: 20px;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: .02em;
  text-transform: uppercase;
  color: var(--snn-koyu-baslik);
}
.snn-kategori-kart--buyuk .snn-kategori-kart__ad { font-size: 28px; }
.snn-kategori-kart__alt {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-top: 4px;
  font-size: 14px;
  line-height: 1.3;
}
.snn-kategori-kart__sayi { color: var(--snn-koyu-metin); }
.snn-kategori-kart__kesfet {
  margin-left: auto;
  font-weight: 700;
  color: var(--snn-vurgu);           /* koyu degrade üstünde turuncu: okunur */
  white-space: nowrap;
}
.snn-kategori-kart__ok { display: inline-block; }

/* Görselsiz kart: açık bölüm zemini + koyu metin, kehribar "Keşfet" (açık zeminde turuncu okunmaz).
   tokens.css `.snn-kategori-kart`'ı koyu bağlama koyar (--snn-bolum/--snn-baslik koyu değer alır),
   bu yüzden burada açık gövdenin sabit token'ları kullanılır. */
.snn-kategori-kart--gorselsiz {
  background: var(--snn-acik-bolum);
  border-color: var(--snn-kart-kenar);
}
.snn-kategori-kart--gorselsiz .snn-kategori-kart__gorsel { display: none; }
.snn-kategori-kart--gorselsiz .snn-kategori-kart__ad { color: var(--snn-kart-metin); }
.snn-kategori-kart--gorselsiz .snn-kategori-kart__etiket,
.snn-kategori-kart--gorselsiz .snn-kategori-kart__sayi { color: var(--snn-kart-ikincil); }
.snn-kategori-kart--gorselsiz .snn-kategori-kart__kesfet { color: var(--snn-vurgu-koyu); }

/* Durumlar: hover yalnız fareli cihazda; klavye odağı her yerde görünür. */
@media (hover: hover) {
  .snn-kategori-kart:hover { border-color: var(--snn-vurgu); }
  .snn-kategori-kart--gorselsiz:hover .snn-kategori-kart__kesfet { text-decoration: underline; }
}
.snn-kategori-kart:focus-visible {
  outline: 2px solid var(--snn-vurgu);
  outline-offset: 2px;
}
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .snn-kategori-kart__resim { transition: transform .45s ease; }
  .snn-kategori-kart__ok { transition: transform .2s ease; }
  .snn-kategori-kart:hover .snn-kategori-kart__resim { transform: scale(1.05); }
  .snn-kategori-kart:hover .snn-kategori-kart__ok { transform: translateX(4px); }
}

/* Tablet: en çok 3'lü, kartlar eşit boy. */
@media (max-width: 999.98px) {
  .snn-kategori-kart,
  .snn-kategori-kart--buyuk { --kk-pay: var(--kk-t, 20); --kk-yuk: 210px; }
  .snn-kategori-kart--buyuk .snn-kategori-kart__ad { font-size: 20px; }
}

/* Telefon: en çok 2'li; tek kalan kart en üstte tam genişlik. */
@media (max-width: 689.98px) {
  .snn-kategoriler { --kk-bosluk: 12px; }
  .snn-kategori-kart,
  .snn-kategori-kart--buyuk { --kk-pay: var(--kk-p, 30); --kk-yuk: 160px; }
  .snn-kategori-kart__metin { padding: 12px; gap: 2px; }
  .snn-kategori-kart__ad,
  .snn-kategori-kart--buyuk .snn-kategori-kart__ad { font-size: 16px; }
  .snn-kategori-kart__etiket { font-size: 11px; }
  .snn-kategori-kart__alt { font-size: 13px; flex-wrap: wrap; gap: 2px 8px; }
  .snn-kategori-kart__kesfet { margin-left: 0; }
}

/* ==================================================================
   9. "Neden Kydex" 3 kutu + bülten bandı
   ================================================================== */

.snn-neden {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--snn-izgara-bosluk);
}
.snn-neden-kutu {
  padding: 24px;
  border: 1px solid var(--snn-kenar);
  border-radius: var(--snn-radius-kart);
  background: var(--snn-kutu);
  box-shadow: var(--snn-golge);
}
.snn-neden-kutu h3 { font-size: 20px; margin: 0 0 8px; color: var(--snn-baslik); }
.snn-neden-kutu p { margin: 0; color: var(--snn-ikincil); }

/* İletişim / bülten bandı: açık gövde içinde koyu haki kutu */
.snn-bulten {
  background: var(--snn-koyu-bolum);
  border-radius: var(--snn-radius-kart);
  padding: 32px;
  display: grid;
  grid-template-columns: 1fr minmax(260px, 380px);
  gap: 24px;
  align-items: center;
}
.snn-bulten h2 { margin: 0; font-size: 32px; text-transform: uppercase; color: var(--snn-beyaz); }

/* ==================================================================
   10. Footer (koyu) — body[data-footer] SEÇİLMEZ, gövdeyi boyar
   ================================================================== */

#main-container > footer.ct-footer,
footer.ct-footer {
  background-color: var(--snn-footer) !important;
  --theme-text-color: var(--snn-koyu-ikincil);
  color: var(--snn-ikincil);
}
footer.ct-footer [data-row] { background-color: transparent !important; }
footer.ct-footer [data-row="top"],
footer.ct-footer [data-row="middle"] { border-top: none; }
footer.ct-footer [data-row="bottom"] { border-top: 1px solid rgba(236, 235, 227, .1); }

footer.ct-footer,
footer.ct-footer p,
footer.ct-footer li,
footer.ct-footer .ct-widget { color: var(--snn-ikincil); }
footer.ct-footer a { color: var(--snn-koyu-metin); }
footer.ct-footer a:hover { color: var(--snn-vurgu); }
footer.ct-footer .widget-title,
footer.ct-footer h3 {
  color: var(--snn-beyaz);
  text-transform: uppercase;
  letter-spacing: .06em;
  font-size: 15px;
  font-weight: 700;
}
footer.ct-footer .ct-footer-copyright { font-size: 14px; }

/* Alt satır (telif + ödeme şeridi) sayfada ortalı (Bülent 2026-09-24). */
footer.ct-footer [data-row="bottom"] [data-column="copyright"] { justify-content: center; text-align: center; }
footer.ct-footer [data-row="bottom"] .ct-footer-copyright { width: 100%; text-align: center; }

/* PayTR ödeme logosu (snn-core footer.php): telifin yanında, dar ekranda altına iner. */
footer.ct-footer .snn-odeme-logolari {
  display: inline-block;
  vertical-align: middle;
  margin-left: 24px;
  line-height: 0;
}
footer.ct-footer .snn-odeme-logolari img { height: 24px; width: auto; max-width: 100%; }
@media (max-width: 689.98px) {
  footer.ct-footer .snn-odeme-logolari { display: block; margin: 12px 0 0; }
}

footer.ct-footer .snn-footer-kimlik { font-size: 13px; opacity: .85; }
footer.ct-footer [data-id="logo"] .site-title a { color: var(--snn-beyaz); }

/* ==================================================================
   11. Form alanları (açık gövde; koyu bantta hakiye döner)
   ================================================================== */

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
input[type="number"],
input[type="password"],
input[type="search"],
textarea,
select {
  font-family: var(--snn-font);
  border-radius: var(--snn-radius);
  background-color: var(--snn-kutu);
  border: 1px solid var(--snn-form-kenar);
  color: var(--snn-metin);
}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="number"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus { border-color: var(--snn-vurgu-koyu); outline: 2px solid rgba(143, 83, 8, .25); outline-offset: 1px; }
input::placeholder, textarea::placeholder { color: var(--snn-ikincil); }

/* Açık kart / panel içindeki formlar koyu metne döner */
.snn-acik input[type="text"],
.snn-acik input[type="email"],
.snn-acik input[type="tel"],
.snn-acik input[type="number"],
.snn-acik textarea,
.snn-acik select,
.entry-summary input[type="text"],
.entry-summary input[type="email"],
.entry-summary input[type="number"],
.entry-summary textarea,
.entry-summary select {
  background-color: var(--snn-kutu);
  border-color: var(--snn-kart-kenar);
  color: var(--snn-kart-metin);
}

/* WooCommerce bildirimleri (açık zeminde okunur) */
.woocommerce-info,
.woocommerce-message,
.woocommerce-error,
.wc-block-components-notice-banner {
  background-color: var(--snn-bolum);
  color: var(--snn-metin);
  border: 1px solid var(--snn-kenar);
  border-left: 3px solid var(--snn-vurgu);
  border-radius: var(--snn-radius);
}
.woocommerce-message,
.wc-block-components-notice-banner.is-success { border-left-color: var(--snn-basari); }
.woocommerce-error,
.wc-block-components-notice-banner.is-error { border-left-color: var(--snn-indirim); }
.wc-block-components-notice-banner > .wc-block-components-notice-banner__content { color: var(--snn-metin); }
/* Bildirim içindeki metin ve bağlantılar: Blocksy'nin eski bildirim stili (koyu zemin
   varsayımı) bağlantıyı beyaz yapıyordu; açık zeminde okunmuyordu (ör. ödemede "şartlar ve
   koşulları okuyun" hatası). Açık gövde bağlantı kuralı: koyu + altı çizili, hover kehribar. */
.woocommerce-info li,
.woocommerce-message li,
.woocommerce-error li { color: var(--snn-metin); }
.woocommerce-info a:not(.button),
.woocommerce-message a:not(.button),
.woocommerce-error a:not(.button),
.wc-block-components-notice-banner a:not(.button) {
  --theme-link-initial-color: #1A1A18;
  --theme-link-hover-color: #8F5308;
  color: #1A1A18;
  text-decoration: underline;
}
.woocommerce-info a:not(.button):hover,
.woocommerce-message a:not(.button):hover,
.woocommerce-error a:not(.button):hover,
.wc-block-components-notice-banner a:not(.button):hover { color: #8F5308; }

/* ==================================================================
   12. Mobil (390 px referans)
   ================================================================== */

@media (max-width: 999.98px) {
  [data-products] { --shop-columns: repeat(2, minmax(0, 1fr)); }
  .snn-neden { grid-template-columns: 1fr; }
  .snn-bulten { grid-template-columns: 1fr; }
  .snn-arama { display: none; }
}

@media (max-width: 689.98px) {
  [data-products] { --shop-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .snn-bolum { padding: 32px 0; }
  .snn-bolum-baslik,
  .ct-module-title { font-size: 28px; margin-bottom: var(--snn-bolum-bosluk-mobil); }
  [data-products] .product .woocommerce-loop-product__title { font-size: 15px; padding: 10px 10px 0; }
  [data-products] .product .price { font-size: 17px; padding: 4px 10px 0; }
  .snn-kart-buton { margin: 10px; padding: 9px 12px; font-size: 14px; }
  .snn-rozet { font-size: 10px; padding: 5px 7px; }
  .snn-bulten h2 { font-size: 24px; }
  .ct-header [data-row="top"] { font-size: 12px; }

  /* Kahraman mobilde ekranın %60'ı: svh sayesinde adres çubuğu açılıp kapanınca
     yükseklik zıplamaz; svh'yi bilmeyen eski tarayıcı üstteki vh satırına düşer. */
  .snn-hero {
    min-height: 60vh;
    min-height: 60svh;
  }
}

/* ==================================================================
   13. WooCommerce blok ızgarası (boş sepet "New in store", blok temalı sayfalar)
   Blocksy'nin .products kart stili buraya uygulanmıyor; aynı açık kart dili verilir.
   ================================================================== */

.wc-block-grid__product {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0 0 14px;
  background: var(--snn-kart);
  border: 1px solid var(--snn-kart-kenar);
  box-shadow: var(--snn-golge);
  border-radius: var(--snn-radius-kart);
  overflow: hidden;
  text-align: left;
  color: var(--snn-kart-metin);
}
.wc-block-grid__product-image { background: var(--snn-kart-gorsel); margin: 0; display: block; }
.wc-block-grid__product-image img { aspect-ratio: 1 / 1; object-fit: contain; width: 100%; }
.wc-block-grid__product-title {
  font-size: 17px;
  font-weight: 600;
  line-height: 1.3;
  color: var(--snn-kart-metin);
  padding: 14px 14px 0;
  margin: 0;
}
.wc-block-grid__product-link { color: var(--snn-kart-metin); text-decoration: none; }
.wc-block-grid__product-link:hover { color: var(--snn-kart-metin); text-decoration: underline; }
.wc-block-grid__product-price {
  font-size: 19px;
  font-weight: 700;
  color: var(--snn-kart-metin);
  padding: 6px 14px 0;
  margin: 0;
}
.wc-block-grid__product-price { text-align: left; }
.wc-block-grid__product-add-to-cart { margin: 12px 14px 0; margin-top: auto; padding-top: 12px; text-align: left; }
.wc-block-grid__product-add-to-cart .wp-block-button__link { width: 100%; text-align: center; }
.wc-block-grid__product-onsale { background: var(--snn-indirim); color: var(--snn-beyaz); border: none; }

/* Boş sepet metni ve simgesi açık zeminde okunur kalsın */
.wc-block-cart__empty-cart__title { color: var(--snn-baslik); }
.wp-block-woocommerce-empty-cart-block .wp-block-separator { border-color: var(--snn-kenar); }
.wc-block-cart__empty-cart__image svg { color: var(--snn-ikincil); }

/* ==================================================================
   14. Blocksy gövde bileşenleri açık zeminde (sayfalama, tablo, alıntı, arama)
   ================================================================== */

/* Blocksy: `[data-pagination=simple] .page-numbers.current` (0,3,0) — aynı özgüllükte
   ve bizden sonra yükleniyor; bu yüzden seçiciye nitelik eklenip özgüllük artırıldı.
   Blocksy etkin sayfayı `--theme-link-hover-color` ile boyuyor (bizde koyu kehribar);
   marka turuncusu + koyu metin doğrusu. */
.ct-pagination[data-pagination] .page-numbers {
  color: var(--snn-metin);
  border: 1px solid var(--snn-kenar);
  border-radius: var(--snn-radius);
  background: var(--snn-kart);
}
.ct-pagination[data-pagination] .page-numbers.current {
  background: var(--snn-vurgu);
  color: var(--snn-vurgu-metin);
  border-color: var(--snn-vurgu);
  --theme-text-active-color: var(--snn-vurgu-metin);
}
.ct-pagination[data-pagination] .page-numbers:not(.dots):not(.current):hover {
  background: var(--snn-bolum);
  color: var(--snn-metin);
  border-color: var(--snn-vurgu);
}

.entry-content table { border-color: var(--snn-kenar); }
.entry-content th { background: var(--snn-bolum); color: var(--snn-baslik); }
.entry-content td, .entry-content th { border-color: var(--snn-kenar); }
.entry-content blockquote {
  border-left: 3px solid var(--snn-vurgu);
  background: var(--snn-bolum);
  padding: 16px 20px;
  border-radius: var(--snn-radius);
}
.entry-content code, .entry-content pre { background: var(--snn-bolum); color: var(--snn-metin); }

/* Arama sonucu / 404 ve genel içerik listeleri */
.ct-no-results,
.search-no-results .entry-content { color: var(--snn-metin); }
.error404 .page-title, .search-results .page-title { color: var(--snn-baslik); }

/* WooCommerce sıralama/sonuç sayısı ve sekme kutuları */
.woocommerce-ordering select,
.woocommerce-result-count { color: var(--snn-metin); }
.woocommerce-tabs .tabs { border-color: var(--snn-kenar); }
.shop_table, .shop_table th, .shop_table td { border-color: var(--snn-kenar); color: var(--snn-metin); }



/* ==================================================================
   14. Arama öneri kutusu (P2, 2026-09-20)

   Üç yerde aynı kutu: masaüstü header çubuğu (.snn-arama), mobil arama
   penceresi (#search-modal .ct-search-form) ve "Kılıfını Seç" sayfasındaki
   kutu ([data-snn-arama-kutu]). İçeriği assets/js/arama.js basar.

   Kutu HER ZAMAN açık kart dilinde durur: #search-modal koyu haki bağlam
   (tokens.css) ama --snn-kart* değişkenleri orada da açık kalır, bu yüzden
   kart/metin renkleri bilerek o token'lardan alınır.
   ================================================================== */

.snn-arama,
.snn-arama-modal,
.snn-oneri-yuva { position: relative; }

.snn-oneri {
  /* Kutu koyu haki bir bağlamın (header, #search-modal) İÇİNDE duruyor: orada
     --snn-metin / --snn-ikincil / --snn-baglanti AÇIK renklere dönüyor ve beyaz
     kartta okunmuyordu (2026-09-20). Token'lar burada açık yüzeye geri alınır. */
  --snn-metin: var(--snn-kart-metin);
  --snn-baslik: var(--snn-kart-metin);
  --snn-ikincil: var(--snn-kart-ikincil);
  --snn-kenar: var(--snn-kart-kenar);
  --snn-bolum: var(--snn-acik-bolum);
  --snn-baglanti: var(--snn-kart-metin);
  --snn-baglanti-hover: var(--snn-vurgu-koyu);
  --snn-golge-kart: 0 8px 20px rgba(0, 0, 0, .14);

  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  z-index: 60;                    /* Blocksy #header z-index: 50 */
  background: var(--snn-kart);
  border: 1px solid var(--snn-kart-kenar);
  border-radius: var(--snn-radius-kart);
  box-shadow: var(--snn-golge-kart);
  overflow: hidden;
  text-align: left;
}
.snn-oneri[hidden] { display: none; }

.snn-oneri__liste {
  list-style: none;
  margin: 0;
  padding: 4px 0;
  max-height: 50vh;
  overflow-y: auto;
}

.snn-oneri__satir {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  margin: 0;
  padding: 6px 12px;
  cursor: pointer;
  color: var(--snn-kart-metin);
  font-family: var(--snn-font);
  font-size: 15px;
  line-height: 1.25;
}
.snn-oneri__satir:hover,
.snn-oneri__satir.is-secili { background: var(--snn-acik-bolum); }

.snn-oneri__metin {
  flex: 1 1 auto;
  min-width: 0;
}
.snn-oneri__ad {
  display: block;
  color: var(--snn-kart-metin);
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.snn-oneri__alt {
  display: block;
  color: var(--snn-kart-ikincil);
  font-size: 13px;
  font-weight: 400;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Tip rozeti: "Model" / "Marka" */
.snn-oneri__tip {
  flex: 0 0 auto;
  background: var(--snn-acik-bolum);
  color: var(--snn-kart-ikincil);
  border-radius: var(--snn-radius);
  padding: 3px 7px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .02em;
  text-transform: none;
}

/* Sonuç yok satırı. Turuncu bağlantı KULLANILMAZ (açık zeminde 3.5:1). */
.snn-oneri__talep { color: var(--snn-kart-ikincil); }
.snn-oneri__talep .snn-oneri__metin { white-space: normal; }
.snn-oneri__bag {
  color: var(--snn-baglanti);
  font-weight: 600;
  text-decoration: underline;
}
.snn-oneri__talep:hover .snn-oneri__bag,
.snn-oneri__talep.is-secili .snn-oneri__bag { color: var(--snn-vurgu-koyu); }

@media (prefers-reduced-motion: no-preference) {
  .snn-oneri__satir { transition: background-color .12s ease; }
}

/* Masaüstü header çubuğu dar (232 px): kutu model adlarını kesmesin diye
   çubuktan geniş açılır ve SOLA taşar (sağda "Silahını Seç" düğmesi var). */
.snn-arama .snn-oneri {
  left: auto;
  right: 0;
  width: 360px;
  max-width: 60vw;
}

/* Mobil arama penceresi: kutu formun tam genişliğinde. */
#search-modal .snn-oneri { top: calc(100% + 8px); }

/* ------------------------------------------------------------------
   Arama penceresi mobil/tablette ÜSTE yaslanır (2026-09-20, canlı telefon testi)

   Blocksy `.ct-panel-content`'i dikeyde ortalıyor (`justify-content: center`).
   Telefonda klavye açılınca kutu klavyenin hemen üstünde kalıyor ve öneri
   listesi klavyenin altına düşüp hiç görünmüyordu. Kutu kapatma düğmesinin
   altına, üstten ~72 px'e sabitlenir; liste onun altında, klavyenin üstünde kalır.

   Masaüstünde (≥1000 px) pencere yalnız dar masaüstü ikonundan açılıyor ve
   klavye sorunu yok → orada Blocksy'nin ortalı düzeni korunur.

   Liste yüksekliği: 50vh ama en çok 320 px. Sert üst sınır şart, çünkü Android'de
   klavye açılınca görsel alan küçülse de vh/dvh çoğu tarayıcıda değişmiyor.
   ------------------------------------------------------------------ */

@media (max-width: 999.98px) {
  #search-modal .ct-panel-content {
    justify-content: flex-start;
    padding-top: 40px;          /* .ct-panel-actions 32 px + 40 → form üstü ~72 px */
  }

  #search-modal .snn-oneri,
  #search-modal .snn-oneri__liste { max-height: min(50vh, 320px); }
}

@supports (height: 100dvh) {
  @media (max-width: 999.98px) {
    #search-modal .snn-oneri,
    #search-modal .snn-oneri__liste { max-height: min(50dvh, 320px); }
  }
}

/* "Kılıfını Seç" sayfasındaki kutu (snn-core kısa kodu) */
[data-snn-arama-kutu] { position: relative; }
[data-snn-arama-kutu] .snn-oneri__liste { max-height: 60vh; }

/* ------------------------------------------------------------------
   Ürün sayfası üstündeki model şeridi (snn-core basıyor): WooCommerce
   bildirim kutusuyla aynı dil (.woocommerce-info), sadece kendi boşluğu.
   ------------------------------------------------------------------ */
.snn-model-seridi {
  /* WooCommerce `.woocommerce-info`'yu flex kutuya çeviriyor; o zaman
     <strong> ile ardındaki metin ayrı flex öğesi olup aradaki boşluk yok oluyor
     ("…Megaiçin seçildi"). Şerit düz metin akışı olmalı. */
  display: block;
  background-color: var(--snn-bolum);
  color: var(--snn-metin);
  border: 1px solid var(--snn-kenar);
  border-left: 3px solid var(--snn-vurgu);
  border-radius: var(--snn-radius);
  /* Şerit ürün sarmalayıcısının ÖNÜNDE, kapsayıcının dışında basılıyor:
     genişliği tema kapsayıcısıyla aynı hizaya alınır (1240px / 92vw). */
  max-width: min(var(--snn-icerik), var(--theme-container-edge-spacing, 92vw));
  margin: 0 auto 10px; /* 24 → 10 (2026-09-21, dikey boşluk sıkılaştırma, 2. tur) */
  padding: 6px 12px;   /* 12/16 → 6/12: şerit tek satır, 60 → ~34 px */
  min-height: 0;       /* Blocksy legacy-notice.scss `.woocommerce-info{min-height:60px}` ezilir */
  font-size: 14px;
  line-height: 1.45;
}
/* WooCommerce bildirim ikonu (::before, mutlak konumlu) 16px'lik dolgumuzda
   metnin üstüne biniyordu; bu şeritte ikon yok. */
.snn-model-seridi::before { content: none; }
.snn-model-seridi a { color: var(--snn-baglanti); text-decoration: underline; }
.snn-model-seridi a:hover { color: var(--snn-baglanti-hover); }

/* ==================================================================
   15. Silah modeli sayfası (2026-09-20)

   Açılış sayfası: /silah-modeli/<model>/ · gövde sınıfı `tax-pa_silah-modeli`.
   Markup snn-core/modules/model-sayfasi.php'den gelir; burada YALNIZ stil var.
   Sayfa bir WooCommerce ürün niteliği arşivi olduğu için urun.css de yüklüdür
   (uyumlu model çipleri `.snn-uyumlu-modeller` oradan gelir, dokunulmuyor).
   ================================================================== */

/* Tek ürün listeleniyor: "Tek bir sonuç gösteriliyor" sayacı ve sıralama kutusu
   burada bilgi taşımıyor, şeridin kendisi de boşluk bırakıyordu. */
.tax-pa_silah-modeli .woo-listing-top,
.tax-pa_silah-modeli .woocommerce-result-count,
.tax-pa_silah-modeli .woocommerce-ordering { display: none; }

/* Ürün kartı: mağaza ızgarası 4 sütun, tek kart orada cılız kalıyordu.
   Kart en çok 360 px, ızgara soldan doldurur (birden çok ürün olursa yan yana dizilir). */
.tax-pa_silah-modeli [data-products] {
  --shop-columns: repeat(auto-fill, minmax(0, 360px));
  justify-content: start;
  margin: 32px 0 0;
}

/* Üst metin (terim açıklaması, model-metinleri.md): paragraf aralığı; Blocksy telefonda
   `.ct-hidden-sm` ile gizliyordu, modele özgü tek metin olduğu için model sayfasında görünür. */
.tax-pa_silah-modeli .hero-section .page-description p { margin: 0; }
.tax-pa_silah-modeli .hero-section .page-description p + p { margin-top: 0.9em; }

@media (max-width: 689.98px) {
  .tax-pa_silah-modeli .hero-section .page-description.ct-hidden-sm { display: block !important; }
  .tax-pa_silah-modeli .hero-section .page-description { text-align: left; }
}

/* Giriş bloğu ve başlıklar */
.snn-model-giris > p { margin: 0 0 16px; }

.snn-model-baslik {
  /* Ölçü/ağırlık tema h2 kalıbından gelir; burada yalnız ritim ve hizalama sabitlenir. */
  text-transform: none;
  text-align: left;
  color: var(--snn-baslik);
  margin: 40px 0 16px;
}

/* Vurgulu uyum satırı: .woocommerce-info / .snn-model-seridi ile aynı ritim. */
.snn-model-uyum {
  display: block;
  background-color: var(--snn-bolum);
  color: var(--snn-metin);
  border: 1px solid var(--snn-kenar);
  border-left: 3px solid var(--snn-vurgu);
  border-radius: var(--snn-radius);
  margin: 0 0 24px;
  padding: 12px 16px;
  font-size: 15px;
  line-height: 1.45;
}
.snn-model-uyum::before { content: none; }

/* Boş durum (modele bağlı ürün yok) — vurgusuz, ikincil metin. */
.snn-model-bos {
  background-color: var(--snn-bolum);
  color: var(--snn-ikincil);
  border: 1px solid var(--snn-kenar);
  border-radius: var(--snn-radius);
  margin: 0 0 24px;
  padding: 12px 16px;
  font-size: 15px;
}

/* CTA: turuncu buton stili .button'dan gelir, burada yalnız dikey boşluk. */
.snn-model-cta { margin: 24px 0; }

/* ---------- Kılıf türleri ---------- */

.snn-model-kilif-turleri {
  list-style: none;
  margin: 0 0 8px;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}

.snn-model-kilif-turu {
  display: flex;
  align-items: center;
  gap: 10px;              /* ad ile fiyat farkı bitişik yazılıyordu */
  margin: 0;
  padding: 8px 14px;
  min-height: 48px;
  background: var(--snn-kart);
  border: 1px solid var(--snn-kart-kenar);
  border-radius: var(--snn-radius-kart);
  color: var(--snn-kart-metin);
}
.snn-model-kilif-gorsel {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  object-fit: contain;
  background: var(--snn-kart-gorsel);
  border-radius: var(--snn-radius);
}
.snn-model-kilif-ad {
  flex: 1 1 auto;
  min-width: 0;
}
.snn-model-kilif-fark {
  flex: 0 0 auto;
  color: var(--snn-kart-ikincil);
  font-size: 14px;
  white-space: nowrap;
}

@media (min-width: 768px) {
  .snn-model-kilif-turleri { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px; }
}

/* ---------- Sıkça sorulan sorular ---------- */

.snn-model-sss-oge {
  background: var(--snn-kart);
  border: 1px solid var(--snn-kenar);
  border-radius: var(--snn-radius-kart);
  margin: 0 0 8px;
}
.snn-model-sss-oge > summary {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 48px;
  padding: 8px 16px;
  cursor: pointer;
  font-weight: 600;
  color: var(--snn-baslik);
  list-style: none;
}
.snn-model-sss-oge > summary::-webkit-details-marker { display: none; }
.snn-model-sss-oge > summary::marker { content: ""; }
.snn-model-sss-oge > summary:focus-visible {
  outline: 2px solid var(--snn-vurgu-koyu);
  outline-offset: -2px;
  border-radius: var(--snn-radius-kart);
}

/* Ok işareti: kapalıyken sağa, açıkken aşağı bakar. */
.snn-model-sss-oge > summary::before {
  content: "";
  flex: 0 0 auto;
  width: 8px;
  height: 8px;
  border-right: 2px solid var(--snn-ikincil);
  border-bottom: 2px solid var(--snn-ikincil);
  transform: rotate(-45deg);
  transform-origin: center;
}
.snn-model-sss-oge[open] > summary::before { transform: rotate(45deg); }

/* Cevap, soru metniyle aynı sol hizada başlar:
   summary sol dolgusu 16 + ok 8 + gap 12 = 36 px. */
.snn-model-sss-oge > :not(summary) {
  margin: 0;
  padding: 0 16px 16px 36px;
  color: var(--snn-kart-metin);
}

@media (prefers-reduced-motion: no-preference) {
  .snn-model-sss-oge > summary::before { transition: transform .15s ease; }
}

@media (max-width: 689.98px) {
  .snn-model-baslik { margin-top: 32px; }
  .snn-model-kilif-turu { padding: 8px 12px; }
}