/**
 * filter-chip-hide-bs.css — Active filter/provider chip hide
 *
 * ITER 685 (2026-05-23): Shared CSS module — /slot + /livecasino + /casino
 * sayfalarında arama veya provider seçildikten sonra çıkan sarı/altın
 * "active filter chip"i gizler.
 *
 * BS canlı (m.bahissende305.com/tr/live-casino/home + /tr/casino/slots):
 *   BS bu chip'i göstermiyor. MR'da default göstermek istemiyor (user 2026-05-23).
 *
 * Hangi sayfalarda yüklenir:
 *   - /slot (slot.astro)
 *   - /livecasino (livecasino.astro)
 *   - /casino (casino.astro) — opsiyonel
 *
 * Selectors (max-specificity belt+suspenders+parachute):
 *   - ID selectors (specificity 100)
 *   - Multiple parent chain selectors
 *   - !important on every property
 *   - display + visibility + size + pointer-events + opacity combo
 *
 * Hedef DOM:
 *   .slot-page-root / .liveCasinoWrapper
 *     > .casino-container
 *       > .slots-filter-and-games.casinoGenericPageTemplate
 *         > .slots-layout > .games-main
 *           > .slots-game-search-bar.games-header
 *             > #active-filters-box (40×var)
 *               > #active-filters-row
 *                 > .active-filter-tag (108×34 sarı chip)
 *
 * Davranış sonrası:
 *   - DOM'da var (JS state'i bozmaz) ama 0px yer kaplar
 *   - Arama yapıldıktan sonra: input içindeki X butonu kalır, sarı chip yok
 *   - Provider seçildikten sonra: "Sağlayıcı seç" pill'inde aktif gösterge
 *     (count badge vs.) kullanılabilir (varsa). Tag chip görünmez.
 */

/* ─────── ACTIVE FILTER CHIP HIDE (multi-page shared) ─────── */
html body.mobile-site .casinoGenericPageTemplate #active-filters-box,
html body.mobile-site .slots-filter-and-games #active-filters-box,
html body.mobile-site .slots-game-search-bar #active-filters-box,
html body.mobile-site #active-filters-box,
html body.mobile-site #active-filters-row,
html body.mobile-site .active-filter-tag,
body.mobile-site #active-filters-box,
body.mobile-site #active-filters-row,
body.mobile-site .active-filter-tag,
#active-filters-box,
#active-filters-row,
.active-filter-tag {
  display: none !important;
  visibility: hidden !important;
  width: 0 !important;
  max-width: 0 !important;
  height: 0 !important;
  max-height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
  opacity: 0 !important;
}

/* Ek güvenlik — herhangi bir flex/grid container chip'ı render etmeye çalışırsa
 * collapse edilsin (height:0 + flex-basis:0). */
html body.mobile-site #active-filters-box,
html body.mobile-site .active-filter-tag {
  flex: 0 0 0 !important;
  flex-basis: 0 !important;
}

/* ─────── SEARCH ALWAYS-EXPANDED FIX (ITER 686, 2026-05-23) ─────── */
/* User bug raporu: anasayfa/slot → CANLI CASİNO tab SPA nav sonra search button
 * açılmıyor (42px collapsed kalıyor). Direkt URL'de çalışıyor.
 *
 * Root cause: Astro ClientRouter view transition sonrası DOM class değişikliği
 * CSS engine'in :not(.is-expanded) evaluation'unu stale bırakıyor (browser
 * reflow bug). Class is-expanded SSR'da set olsa da :not(.is-expanded) rule'u
 * yine match ediyor → collapsed style uygulanıyor.
 *
 * Fix: .always-expanded class'ı (SSR'da set, JS tarafından kaldırılmaz)
 * için high-specificity rule. Bu rule .is-expanded'tan bağımsız çalışır,
 * stale evaluation sorununu bypass eder.
 *
 * Etkilenen sayfalar: /slot + /livecasino (her ikisinde de search SSR'da
 * is-expanded always-expanded class'larıyla render olur). */
/* Specificity calc: slot-deep-fixes.css collapsed rule = (0,1,4,2)
 * Bizimki .slot-page-root + .always-expanded ile (0,1,5,2) — daha yüksek.
 * Garanti override için extra .liveCasinoWrapper alternatif selector. */
html.mobile-root body.mobile-site .slot-page-root #gamesSearchExpand.always-expanded,
html.mobile-root body.mobile-site .slot-page-root .games-search-expand.always-expanded,
html.mobile-root body.mobile-site .liveCasinoWrapper #gamesSearchExpand.always-expanded,
html.mobile-root body.mobile-site .liveCasinoWrapper .games-search-expand.always-expanded {
  width: 100% !important;
  min-width: 200px !important;
  max-width: 100% !important;
  flex: 1 1 auto !important;
}
html.mobile-root body.mobile-site .slot-page-root #gamesSearchExpand.always-expanded .games-search-bar,
html.mobile-root body.mobile-site .slot-page-root .games-search-expand.always-expanded .games-search-bar,
html.mobile-root body.mobile-site .liveCasinoWrapper #gamesSearchExpand.always-expanded .games-search-bar,
html.mobile-root body.mobile-site .liveCasinoWrapper .games-search-expand.always-expanded .games-search-bar {
  width: 100% !important;
  flex: 1 1 auto !important;
  justify-content: flex-start !important;
  overflow: visible !important;
}
html.mobile-root body.mobile-site .slot-page-root #gamesSearchExpand.always-expanded .games-search-input,
html.mobile-root body.mobile-site .slot-page-root .games-search-expand.always-expanded .games-search-input,
html.mobile-root body.mobile-site .liveCasinoWrapper #gamesSearchExpand.always-expanded .games-search-input,
html.mobile-root body.mobile-site .liveCasinoWrapper .games-search-expand.always-expanded .games-search-input {
  position: relative !important;
  width: auto !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  opacity: 1 !important;
  clip: auto !important;
  pointer-events: auto !important;
  margin: 0 !important;
  padding: 9px 10px !important;
  height: 40px !important;
}
