/* ============================================================================
   SÜZGEÇ ŞERİDİ — tek satır, nizami, Excel/Sheets benzeri ince çerçeve
   Kart #993255 · Mehmet Şah (8 Eki 2026, birebir):
   "inputların margin paddingleri ayarla ve alta düşmeleri engelle tek satırda
    nizami bir görüntü input çerçeveleri belli belirsiz aynı excel gibi olsun
    bu şekilde yapalım ben önceden manuel yapıyordum."

   NEDEN ORTAK DOSYA: bu düzen bugüne kadar her ekranda ELLE tutturuluyordu
   (sahibin kendi sözü). Elle tutturulan düzen yeni ekran eklenince kayar ve
   aynı iş ikinci kez yapılır — bu depoda ölçülmüş arıza sınıfı. Artık tek
   kaynak burasıdır; yeni ekran `.kl-suzgec-serit` sınıfını alır, bitti.

   İKİ SEÇİCİ, TEK KURAL — gerekçe:
     .kl-suzgec-serit          -> yeni ekranların açıkça seçtiği sınıf
     #collapseFilter #filter_form -> BUGÜN var olan dört ekranın ortak deseni
   İkincisi sayesinde hiçbir ekranın markup'ına dokunmadan düzen yürürlüğe
   giriyor. Bu özellikle gerekliydi: 8 Eki'de `admin/prices.php` başka bir
   oturum tarafından kilitliydi (.claude/locks/admin/prices.php, #993256) ve o
   dosyaya dokunmak çakışma üretirdi.

   ⚠ KAPSAM: yalnız GÖRÜNÜM. Süzgeç işlevi, backend sorgusu, para yolu ve
   #prices_table hücre kuralları bu dosyanın DIŞINDA (tablo CSS'i #993256'da).
   ============================================================================ */

/* --- 1) TEK SATIR: alta düşme yok -------------------------------------------
   Bootstrap `.row` varsayılanı `flex-wrap: wrap` — şikâyetin kaynağı tam bu.
   `nowrap` + yatay kaydırma: dar ekranda kutular ezilmek yerine kayar. */
.kl-suzgec-serit .row,
#collapseFilter #filter_form .row {
  flex-wrap: nowrap;
  overflow-x: auto;
  overflow-y: visible;
  align-items: flex-end;     /* farklı yükseklikteki kutular ALTTAN hizalanır */
  gap: 8px;                  /* 4px ızgarası */
  margin-left: 0;
  margin-right: 0;
  padding-bottom: 4px;       /* kaydırma çubuğu kutulara yapışmasın */
  scrollbar-width: thin;
}

/* Kolonlar sabit tabanlı: ne büyüyüp satırı bozsun ne de okunmaz hâle gelsin. */
.kl-suzgec-serit .row > [class*="col-"],
#collapseFilter #filter_form .row > [class*="col-"] {
  flex: 0 0 auto;
  width: auto;
  min-width: 148px;
  max-width: 240px;
  padding-left: 0;
  padding-right: 0;
}
/* Düğme kolonları daralmasın ama yer de kaplamasın. */
.kl-suzgec-serit .row > .d-grid,
#collapseFilter #filter_form .row > .d-grid {
  min-width: 112px;
}

/* --- 2) MARGIN / PADDING: tutarlı, 4px ızgarasında --------------------------
   Ekranlarda `mb-2` / `mb-3` / `m-4` karışık kullanılmıştı; alt boşluklar
   eşit değildi. Şeridin içinde hepsi SIFIRLANIP tek kurala bağlanıyor. */
.kl-suzgec-serit .form-floating,
.kl-suzgec-serit .form-icon-container,
#collapseFilter #filter_form .form-floating,
#collapseFilter #filter_form .form-icon-container {
  margin-bottom: 0 !important;
  margin-top: 0 !important;
}
.kl-suzgec-serit .form-control,
.kl-suzgec-serit .form-select,
#collapseFilter #filter_form .form-control,
#collapseFilter #filter_form .form-select {
  padding: 8px 10px;         /* dikey 8px — nefes eşiği ≥6px */
  min-height: 36px;
  height: auto;
  font-size: 12px;           /* ≥11px */
  line-height: 1.4;          /* ≥1.3, px ile çakılmadı */
}
/* `.form-floating` etiketi kutunun içinde yüzüyor; dolu kutuda metni ezmesin. */
.kl-suzgec-serit .form-floating > label,
#collapseFilter #filter_form .form-floating > label {
  padding: 6px 10px;
  font-size: 11px;
  line-height: 1.3;
}
.kl-suzgec-serit .form-floating > .form-control:focus ~ label,
.kl-suzgec-serit .form-floating > .form-control:not(:placeholder-shown) ~ label,
#collapseFilter #filter_form .form-floating > .form-control:focus ~ label,
#collapseFilter #filter_form .form-floating > .form-control:not(:placeholder-shown) ~ label {
  opacity: .62;
  transform: scale(.8) translateY(-7px) translateX(2px);
}

/* --- 3) ÇERÇEVE: belli belirsiz, Excel hücre çizgisi gibi -------------------
   Ton 6.0 onaylı tasarımdan: #e4e7ea (ASISTAN-6.0-ONAYLI.html paletinde 19 kez
   geçen ayırıcı tonu). Sabit renk YAZILMADI — önce temanın kendi değişkeni
   denenir, yoksa 6.0 tonuna düşülür; koyu tema böylece kırılmaz. */
.kl-suzgec-serit .form-control,
.kl-suzgec-serit .form-select,
#collapseFilter #filter_form .form-control,
#collapseFilter #filter_form .form-select {
  border: 1px solid var(--phoenix-border-color, #e4e7ea);
  border-radius: 4px;
  box-shadow: none;
  background-clip: padding-box;
  transition: border-color .12s ease-in-out;
}
.kl-suzgec-serit .form-control:hover,
.kl-suzgec-serit .form-select:hover,
#collapseFilter #filter_form .form-control:hover,
#collapseFilter #filter_form .form-select:hover {
  border-color: var(--phoenix-secondary-bg, #cfd4dc);
}
/* Odak: Bootstrap'in kalın mavi halkası Excel hissini bozuyordu — ince çizgi. */
.kl-suzgec-serit .form-control:focus,
.kl-suzgec-serit .form-select:focus,
#collapseFilter #filter_form .form-control:focus,
#collapseFilter #filter_form .form-select:focus {
  border-color: var(--phoenix-primary, #3874ff);
  box-shadow: 0 0 0 1px var(--phoenix-primary, #3874ff);
  outline: none;
}

/* --- 4) ŞERİDİN KABI: kart gürültüsü azalsın -------------------------------- */
.kl-suzgec-serit,
#collapseFilter > .card.card-body {
  padding: 12px;
  border: 1px solid var(--phoenix-border-color, #e4e7ea);
  border-radius: 6px;
}

/* Şerit içindeki düğmeler de aynı yükseklikte dursun (hizalı grid görünümü). */
.kl-suzgec-serit .btn,
#collapseFilter #filter_form .btn {
  min-height: 36px;
  height: 36px;
  align-self: flex-end;
  padding: 0 14px;
  font-size: 12px;
  line-height: 1.4;
  border-radius: 4px;
  white-space: nowrap;
}
.kl-suzgec-serit .btn-lg,
#collapseFilter #filter_form .btn-lg {
  font-size: 12px;           /* `btn-lg` şeridi şişiriyordu */
  padding: 8px 14px;
}

/* `.d-grid` kolonu dugmeyi dikey olarak GERIYORDU (onizlemede olculdu: SONRA
   panelinde dugmeler hala kutulardan iki kat uzundu). Sutun artik gerilmiyor. */
.kl-suzgec-serit .row > .d-grid,
#collapseFilter #filter_form .row > .d-grid {
  display: flex !important;
  align-items: flex-end;
}
.kl-suzgec-serit .row > .d-grid > .btn,
#collapseFilter #filter_form .row > .d-grid > .btn {
  width: 100%;
}
/* Etiketi olan duz alanlar (uye invoices.php deseni) da ayni yuksekligi alsin. */
.kl-suzgec-serit .form-label {
  font-size: 11px;
  line-height: 1.3;
  margin-bottom: 4px;
  color: var(--phoenix-secondary-color, #6e7891);
}

/* `-lg` boy varyantlari seridi bozuyordu: admin/prices.php'de durum secimi
   `form-select form-control-lg form-lg` sinifini tasiyor ve komsu kutulardan
   ~6px uzun duruyordu (onizlemede olculdu). Serit icinde boy varyanti YOK —
   nizami gorunumun sarti butun kutularin AYNI yukseklikte olmasi. */
.kl-suzgec-serit .form-control-lg,
.kl-suzgec-serit .form-select-lg,
.kl-suzgec-serit .form-lg,
#collapseFilter #filter_form .form-control-lg,
#collapseFilter #filter_form .form-select-lg,
#collapseFilter #filter_form .form-lg {
  min-height: 36px;
  height: 36px;
  padding: 0 10px;
  font-size: 12px;
  line-height: 1.4;
  border-radius: 4px;
}
/* `.form-floating` kutulari etiket tasidigi icin 36px'e sigmaz — serit
   icindeki TEK istisna onlardir ve kendi aralarinda esittir. */
.kl-suzgec-serit .form-floating > .form-control,
#collapseFilter #filter_form .form-floating > .form-control {
  height: 44px;
  min-height: 44px;
  padding: 14px 10px 4px;
}
.kl-suzgec-serit .row > [class*="col-"]:not(.d-grid),
#collapseFilter #filter_form .row > [class*="col-"]:not(.d-grid) {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
