/**
 * Kılıf Bulucu (modules/bulucu.php + assets/bulucu.js).
 *
 * T.REX "Holster Finder" kalıbı, SNN token'larıyla: koyu haki kutu (referanstaki siyah bandın
 * karşılığı, "onun koyu kısmı bizde haki"), açık metin, turuncu buton + koyu metin. Token'lar
 * çocuk temanın tokens.css'inden; tema yoksa sabit değerler devreye girer.
 * Izgara: 1440 kademeler + buton tek satır · ≤999 px 2 sütun + tam genişlik buton · ≤599 px tek sütun.
 */

.snn-bulucu {
  box-sizing: border-box;
  background: var(--snn-koyu-zemin, #2F3222);
  color: var(--snn-koyu-metin, #ECEBE3);
  border: 1px solid var(--snn-koyu-kenar, #4E5340);
  border-radius: var(--snn-radius-kart, 6px);
  padding: 28px 32px 32px;
  font-family: var(--snn-font, "Archivo Narrow", "Arial Narrow", Arial, sans-serif);
}

.snn-bulucu *,
.snn-bulucu *::before,
.snn-bulucu *::after { box-sizing: inherit; }

.snn-bulucu__baslik {
  margin: 0 0 8px;
  text-align: center;
  font-size: 24px;
  line-height: 1.2;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--snn-koyu-baslik, #F7F6EE);
}

.snn-bulucu__aciklama {
  margin: 0 0 20px;
  font-size: 17px;
  line-height: 1.4;
  color: var(--snn-koyu-metin, #ECEBE3);
}

.snn-bulucu__form {
  display: grid;
  grid-template-columns: repeat(var(--snn-bulucu-kademe, 4), minmax(0, 1fr)) auto;
  gap: 16px;
  align-items: end;
  margin: 0;
}

.snn-bulucu__alan { min-width: 0; }

.snn-bulucu__alan label {
  display: block;
  margin-bottom: 6px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--snn-koyu-baslik, #F7F6EE);
}

.snn-bulucu__secim {
  width: 100%;
  min-height: 44px;
  margin: 0;
  padding: 10px 40px 10px 12px;
  background-color: var(--snn-koyu-bolum, #3A3E2B);
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='%23ECEBE3' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  border: 1px solid var(--snn-koyu-kenar, #4E5340);
  border-radius: var(--snn-radius, 4px);
  color: var(--snn-koyu-baslik, #F7F6EE);
  font: inherit;
  font-size: 16px;
  line-height: 1.3;
  -webkit-appearance: none;
  appearance: none;
  cursor: pointer;
  transition: border-color .15s, opacity .15s;
}

.snn-bulucu__secim:hover:not(:disabled) { border-color: var(--snn-koyu-ikincil, #B9B8AC); }

.snn-bulucu__secim:focus-visible {
  outline: 2px solid var(--snn-vurgu, #F8A72B);
  outline-offset: 2px;
  border-color: var(--snn-vurgu, #F8A72B);
}

.snn-bulucu__secim:disabled {
  opacity: .45;
  cursor: not-allowed;
}

/* Açılan listenin satırları: Windows/Chrome ve Firefox select rengini devralmaz. */
.snn-bulucu__secim option {
  background: var(--snn-koyu-bolum, #3A3E2B);
  color: var(--snn-koyu-baslik, #F7F6EE);
}

.snn-bulucu__buton-kabi { min-width: 0; }

.snn-bulucu__buton {
  display: inline-block;
  width: 100%;
  min-height: 44px;
  margin: 0;
  padding: 10px 24px;
  background: var(--snn-vurgu, #F8A72B);
  color: var(--snn-vurgu-metin, #1A1A18);
  border: 0;
  border-radius: var(--snn-radius, 4px);
  font: inherit;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .15s, opacity .15s;
}

.snn-bulucu__buton:hover:not(:disabled),
.snn-bulucu__buton:focus-visible { background: var(--snn-vurgu-hover, #E5901A); color: var(--snn-vurgu-metin, #1A1A18); }

.snn-bulucu__buton:focus-visible {
  outline: 2px solid var(--snn-koyu-baslik, #F7F6EE);
  outline-offset: 2px;
}

.snn-bulucu__buton:disabled {
  opacity: .5;
  cursor: not-allowed;
}

.snn-bulucu__not {
  margin: 16px 0 0;
  font-size: 14px;
  line-height: 1.4;
  color: var(--snn-koyu-ikincil, #B9B8AC);
}

.snn-bulucu__not a {
  color: var(--snn-koyu-baslik, #F7F6EE);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.snn-bulucu__not a:hover { color: var(--snn-vurgu, #F8A72B); }

/* ---- Bağlamlar ---------------------------------------------------- */

/* Ana sayfa: vitrinin hemen altında, sayfa zemininde; sonraki şerit (markalar) bitişik gelir. */
.snn-bolum.snn-bolum--bulucu { padding: 40px 0; }

.snn-bulucu-kap {
  max-width: calc(var(--snn-icerik, 100%) + 32px); /* tam genişlik (2026-09-21): --snn-icerik 100% */
  margin: 0 auto;
  padding: 0 16px;
}

/* Kılıfını Seç, Kılıf Türleri, mağaza, kategori, arama: içerik sütununun genişliğinde, altına boşluk. */
.snn-bulucu--silahini-sec,
.snn-bulucu--kilif-turleri,
.snn-bulucu--magaza,
.snn-bulucu--kategori,
.snn-bulucu--arama,
.snn-bulucu--kisa-kod { margin: 0 0 32px; }

/* Ürün listesinin altı ya da "ürün bulunamadı" notunun altı (yer kuralları 2026-09-24). */
.snn-bulucu.snn-bulucu--alt { margin: 40px 0 0; }

/* Ürün sayfası: sekmelerin ya da benzer ürünlerin altı. Blocksy ürün düzeni tam genişlik;
   sekme sarmalayıcısıyla aynı içerik sınırı (snn-child urun.css `.woocommerce-tabs` hesabı). */
.snn-bulucu-urun {
  clear: both;
  width: min(100%, var(--theme-container-edge-spacing, 92vw));
  max-width: var(--snn-icerik, 100%);
  margin: 48px auto;
}

.snn-bulucu--urun { margin: 0; }

/* 404: arama kutusunun altı, ortalı dar sütunda değil hero genişliğinde. */
.snn-bulucu--bulunamadi { margin: 40px 0 0; text-align: left; }

/* ---- Duyarlı ------------------------------------------------------ */

@media (max-width: 999.98px) {
  .snn-bulucu { padding: 24px 20px 24px; }

  .snn-bulucu__form { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .snn-bulucu__buton-kabi { grid-column: 1 / -1; }
}

@media (max-width: 599.98px) {
  .snn-bulucu { padding: 20px 16px 20px; }

  .snn-bulucu__baslik { font-size: 20px; letter-spacing: .1em; }

  .snn-bulucu__aciklama { font-size: 16px; margin-bottom: 16px; }

  .snn-bulucu__form { grid-template-columns: minmax(0, 1fr); gap: 12px; }

  .snn-bolum.snn-bolum--bulucu { padding: 24px 0; }
}

@media (prefers-reduced-motion: reduce) {
  .snn-bulucu__secim,
  .snn-bulucu__buton { transition: none; }
}
