/* =============================================================================
 * chrome.css — header (mega menü + arama paneli), mobil drawer, footer, dock.
 *
 * Tasarımın inline stilleri markup'ta kalır. Buraya YALNIZ inline'a konulamayan
 * kurallar girer:
 *   1) `hidden` ile aç/kapa edilen öğelerin `display`i (inline display [hidden]'ı yener)
 *   2) Elementor/armor'ın ezdiği değerlerin geri verilmesi (özgüllük >= 0,3,0)
 *   3) durum seçicileri (aria-expanded) ve kısa ekran yoğunlaştırması
 *
 * Kapsam kökü: .mulubey-app · `mulubey.css`'ten SONRA yüklenir.
 * ========================================================================== */

/* ───────────────────────────────────────────────────────────────────────────
 * 1) AÇ/KAPA EDİLEN ÖĞELER — display sınıfta, inline'da DEĞİL
 * `[hidden]` inline `display:flex`e kaybeder; armor !important ile kurtarsa da
 * sözleşme gereği toggle edilen hiçbir öğeye inline display verilmez.
 * ─────────────────────────────────────────────────────────────────────────── */

/* Arama paneli — yalnız `display`; kalan bildirimler tasarımdaki gibi inline. */
.mulubey-app .mu-hq-idle { display: flex; }
.mulubey-app .mu-hq-results { display: block; }
.mulubey-app .mu-hq-results__head { display: flex; }
.mulubey-app .mu-hq-clear { display: inline-flex; align-items: center; justify-content: center; }

/* Mobil drawer */
.mulubey-app .mu-drawer { display: flex; flex-direction: column; }
.mulubey-app .mu-drawer__head { display: flex; align-items: center; justify-content: space-between; }
.mulubey-app .mu-drawer__sub { display: flex; flex-direction: column; }

/* Google rozeti (kapatma düğmesi `hidden` yapar) */
.mulubey-app .mu-gbadge { display: flex; align-items: stretch; }

/* ───────────────────────────────────────────────────────────────────────────
 * 2) ARMOR SONRASI GERİ VERİLENLER
 * `.mulubey-app button{border:0;background:transparent}` (0,2,0) ve
 * `.elementor img{height:auto}` bu değerleri siliyor → (0,3,0)/(0,3,1) ile geri.
 * ─────────────────────────────────────────────────────────────────────────── */

/* Arama düğmesi bir <button>: display ve açık durumdaki kum zemin. */
.mulubey-app .mu-hq-btn { display: flex; }
.mulubey-app .mu-hq-btn[aria-expanded="true"] { background: #F6F2EA; border-color: #9A7A50; }

/* Kapatma "×" düğmesi ortalanmalı (reset `button{display:block}`). */
.mulubey-app .mu-hq-close,
.mulubey-app .mu-drawer__close,
.mulubey-app .mu-drawer__sub-btn { display: inline-flex; align-items: center; justify-content: center; }

/* "Tüm sonuçlar →" bir submit düğmesi — bağlantı gibi görünmeli. */
.mulubey-app .mu-hq-all { border: 0; line-height: 1.4; }

/* Rozet kapatma düğmesinin ayırıcı çizgisi (armor `border:0` ile siliyor). */
.mulubey-app .mu-gbadge .mu-gbadge__close { border: 0; border-left: 1px solid #EDE4D4; }

/* Footer logosu tasarımda 52px; armor `.mu-logo--footer img`'i 44px'e kilitliyor. */
.mulubey-app [data-mu-footer] .mu-logo--footer img { height: 52px; max-height: 52px; }

/* ───────────────────────────────────────────────────────────────────────────
 * 3) MOBİL DRAWER — kısa telefonda alttaki CTA ve telefon görünür kalmalı
 * ─────────────────────────────────────────────────────────────────────────── */
.mulubey-app .mu-drawer {
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

/* 375×640 gibi kısa ekranlarda içerik yoğunlaştırılır. */
@media (max-height: 700px) {
  .mulubey-app .mu-drawer__head { height: 66px !important; }
  .mulubey-app .mu-logo--mobile img { height: 32px; max-height: 32px; }
  .mulubey-app .mu-drawer nav { padding-top: 2px !important; padding-bottom: 18px !important; }
  .mulubey-app .mu-drawer__link { padding-top: 11px !important; padding-bottom: 11px !important; font-size: 16.5px !important; }
  .mulubey-app .mu-drawer__sub > a { padding-top: 9px !important; padding-bottom: 9px !important; }
  .mulubey-app .mu-drawer form { height: 46px !important; margin-top: 14px !important; }
  .mulubey-app .mu-drawer__cta { height: 46px !important; margin-top: 16px !important; }
  .mulubey-app .mu-drawer__tel { height: 46px !important; }
}

/* ───────────────────────────────────────────────────────────────────────────
 * 4) DOCK VE ROZET — JS footer görününce opacity/transform yazıyor
 * ─────────────────────────────────────────────────────────────────────────── */
.mulubey-app [data-mu-dock],
.mulubey-app [data-gbadge] { transition: opacity .3s ease, transform .3s ease; }

@media (prefers-reduced-motion: reduce) {
  .mulubey-app [data-mu-dock],
  .mulubey-app [data-gbadge] { transition: none; }
}