/* ============================================================
   WINGS MOBILE — report Filament paneli mobil taban
   TÜM kurallar max-width:768px altında -> masaüstüne SIFIR etki.
   Filament v3.3 semantik DOM class'ları (fi-*). Filament upgrade
   sonrası bu dosya görsel olarak yeniden doğrulanmalı.
   Bölümler: [1] Topbar/Sayfa [2] Tablolar [3] Formlar [4] Modallar
             [5] Widget/Dashboard [6] Kart görünümü (wings-card)
             [7] Alt navigasyon (mobile-bottom-nav.blade.php)
   [6] kolon eşleme sınıfları: wc-title, wc-badge, wc-line, wc-half, wc-hide
   NOT: dosyada 2 media query var — ana mobil blok (max-width:768px) ve
   dosya sonunda alt barı masaüstünde gizleyen (min-width:769px) blok.
   ============================================================ */

@media (max-width: 768px) {

  /* ---------- [1] Topbar + sayfa iskeleti ---------- */
  /* Uygulama kanvası: zemin gri, kartlar beyaz (wireframe dili) */
  .fi-body { background-color: #f4f4f5 !important; }
  .dark .fi-body { background-color: rgb(9 9 11) !important; }
  .fi-topbar nav { padding-inline: 0.75rem; }
  .fi-logo { height: 1.625rem !important; }
  .fi-main { padding-inline: 0.625rem !important; padding-block: 0.75rem !important; }
  .fi-header { row-gap: 0.5rem; }
  .fi-header-heading { font-size: 1.125rem !important; }
  /* Sayfa başlığı aksiyonları: tam genişlik, alt alta (rez. detay dahil) */
  .fi-header .fi-ac { width: 100%; flex-direction: column; align-items: stretch; }
  .fi-header .fi-ac > * { width: 100%; }
  .fi-header .fi-ac .fi-btn { justify-content: center; }
  /* Dropdown panelleri ekrandan taşmasın (filtre panelleri dahil) */
  .fi-dropdown-panel { max-width: calc(100vw - 1.5rem) !important; }

  /* ---------- [2] Tablolar (global) ---------- */
  /* DOĞAL sayfa kaydırması: iç dikey scroll YOK (container'da takılma hissi
     veriyordu — Tamer canlı geri bildirimi). Yalnız yatay taşma kayar. */
  .fi-ta-content { -webkit-overflow-scrolling: touch; }
  .fi-ta-header-cell { white-space: nowrap; }
  .fi-ta-table { font-size: 0.8125rem; }
  .fi-ta-cell { padding-block: 0.375rem !important; }
  /* Dokunma hedefleri */
  .fi-ta-actions-cell .fi-icon-btn { min-height: 44px; min-width: 44px; }

  /* ---------- [3] Formlar ---------- */
  /* 16px altı font iOS'ta odakta otomatik zoom yapar -> 16px sabit */
  .fi-fo-field-wrp input,
  .fi-fo-field-wrp select,
  .fi-fo-field-wrp textarea,
  .fi-input,
  select.fi-select-input { font-size: 16px !important; }

  /* ---------- [4] Modallar ---------- */
  /* Mobilde modallar tam genişlik + yüksek (bottom-sheet DOM gereği yapılamıyor,
     grid wrapper p-4 padding'i içinde %100 genişlik kullanılır) */
  .fi-modal-window:not(.fi-modal-slide-over-window) {
    width: 100%; max-width: 100% !important;
    max-height: 92dvh;
    overflow-y: auto;
  }
  /* Slide-over: tam genişlik */
  .fi-modal-window.fi-modal-slide-over-window { width: 100vw !important; max-width: 100vw !important; }

  /* ---------- [5] Widget / Dashboard ---------- */
  /* Widget alanları TAM genişlik: widget grid'leri ve widget kökleri şablonsuz
     'grid' olduğundan mobilde içerik-genişliğine büzülüp sola yaslanıyordu
     (sağda boşluk). Tek tam-genişlik kolona sabitle — tüm sayfalarda geçerli. */
  .fi-wi { grid-template-columns: minmax(0, 1fr) !important; }
  /* KÖK NEDEN FIX (lab'da ölçüldü): widget'ların inline --col-span-default'u
     (span 2 / span 1 / 1 -1 karışımı) tek kolonlu mobil grid'de örtük 2. kolon
     doğurup kutuları 93px'e büzüyordu. Mobilde her widget tam kolona zorlanır. */
  .fi-wi > * { grid-column: 1 / -1 !important; }
  .fi-wi-widget { width: 100%; min-width: 0; grid-template-columns: minmax(0, 1fr); }
  .fi-wi-stats-overview-stats-ctn { width: 100%; }
  /* Stats kartları 2'li grid (Filament mobil default'u 1'li) */
  .fi-wi-stats-overview-stats-ctn {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.5rem !important;
  }
  .fi-wi-stats-overview-stat { padding: 0.75rem !important; }
  /* Grafikler ekranı yutmasın */
  .fi-wi-chart { max-height: 260px; overflow: hidden; }

  /* Dashboard mobil dizilim: operasyon üste, grafikler alta.
     DOM sırası = widget $sort: 1 Stats, 2 LatestRez, 3 SourceChart,
     4 RevenueChart, 5 UpcomingCheckIns, 6 TodayCheckInOut.
     !! Provider'a widget eklenir/sort değişirse veya bir widget'a canView() eklenirse bu blok güncellenmeli !! */
  .fi-dashboard-page .fi-wi { display: grid; }
  .fi-dashboard-page .fi-wi > * { order: 9; } /* eşlenmemiş/yeni widget en alta */
  .fi-dashboard-page .fi-wi > *:nth-child(1) { order: 1; } /* StatsOverview */
  .fi-dashboard-page .fi-wi > *:nth-child(6) { order: 2; } /* TodayCheckInOut */
  .fi-dashboard-page .fi-wi > *:nth-child(5) { order: 3; } /* UpcomingCheckIns */
  .fi-dashboard-page .fi-wi > *:nth-child(2) { order: 4; } /* LatestReservations */
  .fi-dashboard-page .fi-wi > *:nth-child(3) { order: 5; } /* SourceDistributionChart */
  .fi-dashboard-page .fi-wi > *:nth-child(4) { order: 6; } /* MonthlyRevenueChart */

  /* ---------- [6] Kart görünümü (yalnız recordClasses('wings-card') verilen tablolar) ---------- */
  /* Panel kabuğu şeffaflaşır: kartlar gri zeminde ayrık yüzer (wireframe dili) */
  .fi-ta-ctn:has(.wings-card) {
    background: transparent; box-shadow: none;
    overflow: visible; border-radius: 0;
  }
  .fi-ta-ctn:has(.wings-card) > :not([hidden]) ~ :not([hidden]) { border-top-width: 0 !important; }
  /* Arama/filtre çubuğu ve sayfalama kendi beyaz kartında */
  .fi-ta-ctn:has(.wings-card) .fi-ta-header-toolbar,
  .fi-ta-ctn:has(.wings-card) .fi-ta-pagination {
    background: #fff; border-radius: 1rem;
    box-shadow: 0 1px 2px rgb(0 0 0 / 0.05);
  }
  .fi-ta-ctn:has(.wings-card) .fi-ta-header-toolbar { margin-bottom: 0.625rem; }
  .fi-ta-ctn:has(.wings-card) .fi-ta-pagination { margin-top: 0.625rem; padding: 0.5rem 0.75rem; }
  .dark .fi-ta-ctn:has(.wings-card) .fi-ta-header-toolbar,
  .dark .fi-ta-ctn:has(.wings-card) .fi-ta-pagination { background: rgb(24 24 27); }
  .fi-ta-table:has(.wings-card) { display: block; }
  .fi-ta-table:has(.wings-card) thead { display: none; }
  .fi-ta-table:has(.wings-card) tbody { display: block; }
  tr.wings-card {
    display: flex; flex-wrap: wrap; align-items: baseline;
    gap: 0.125rem 0.625rem; padding: 0.875rem 1rem;
    margin: 0 0 0.625rem;
    background: #fff; border-radius: 1rem;
    box-shadow: 0 1px 2px rgb(0 0 0 / 0.05);
    white-space: normal;
  }
  .dark tr.wings-card { background: rgb(24 24 27); }
  .fi-ta-table:has(.wings-card) tbody > tr + tr { border-top-width: 0 !important; }
  tr.wings-card > td { display: block; padding: 0 !important; width: auto; order: 5; }
  tr.wings-card .fi-ta-text { padding: 0; }
  tr.wings-card > td[data-label]::before {
    content: attr(data-label) ": ";
    font-size: 0.6875rem; color: rgb(120 113 108);
  }
  tr.wings-card > td[data-label] { display: flex; align-items: baseline; gap: 0.25rem; }
  tr.wings-card > td[data-label] > * { min-width: 0; }
  /* Kolon eşleme sınıfları (extraCellAttributes ile verilir) */
  tr.wings-card > td.wc-title { flex: 1 1 55%; order: 1; font-weight: 600; }
  tr.wings-card > td.wc-badge { order: 2; margin-left: auto; }
  tr.wings-card > td.wc-line  { flex: 1 1 100%; order: 3; }
  tr.wings-card > td.wc-half  { flex: 1 1 42%; order: 4; }
  tr.wings-card > td.wc-hide  { display: none; }
  tr.wings-card > td.fi-ta-selection-cell { order: 0; flex: 0 0 auto; }
  tr.wings-card > td.fi-ta-actions-cell   { order: 9; flex: 1 1 100%; }
  /* Summary başlık satırı kart modunda gürültü (kolonlar gizli) */
  .fi-ta-table:has(.wings-card) .fi-ta-summary-header-row { display: none; }
  /* visibleFrom + wings-card birleşimi: gizli kolon kartta dirilmesin */
  tr.wings-card > td.hidden { display: none; }

  /* Kart görsel cilası (wireframe disiplini: başlık belirgin, kimlik satırı gri,
     tutarlar tabular — veri/etiket DEĞİŞMEZ, salt tipografi/hiza) */
  tr.wings-card > td.wc-title { font-size: 0.9375rem; }
  tr.wings-card > td.wc-line  { color: rgb(120 113 108); font-size: 0.75rem; }
  tr.wings-card > td.wc-half  { font-variant-numeric: tabular-nums; }
  tr.wings-card > td.wc-half .fi-ta-text { font-weight: 600; font-size: 0.875rem; }
  /* Stat kutuları: yumuşak köşe (kart diliyle uyum) */
  .fi-wi-stats-overview-stat { border-radius: 1rem !important; }

  /* ---------- [7] Alt navigasyon (yalnız mobil; renderHook BODY_END) ---------- */
  .wings-bottom-nav {
    display: flex; position: fixed; bottom: 0; left: 0; right: 0; z-index: 25;
    background: #fff; border-top: 1px solid rgb(231 229 228);
    padding: 0.25rem 0.25rem calc(0.25rem + env(safe-area-inset-bottom));
  }
  .dark .wings-bottom-nav { background: rgb(17 24 39); border-color: rgb(41 37 36); }
  .wings-bottom-nav-item {
    flex: 1 1 0; min-width: 0; display: flex; flex-direction: column;
    align-items: center; justify-content: center; gap: 2px;
    padding: 0.375rem 0.125rem; min-height: 48px;
    font-size: 0.625rem; line-height: 1.15; text-align: center;
    color: rgb(120 113 108); text-decoration: none;
  }
  .wings-bottom-nav-item .wings-bottom-nav-icon { width: 1.375rem; height: 1.375rem; flex: 0 0 auto; }
  /* Uygulama havası: her sekmenin kendi ikon rengi + aktif sekmede pill arka plan */
  .wings-bottom-nav-item:nth-child(1) .wings-bottom-nav-icon { color: #2563eb; } /* Dashboard */
  .wings-bottom-nav-item:nth-child(2) .wings-bottom-nav-icon { color: #16a34a; } /* Onaylı Rez. */
  .wings-bottom-nav-item:nth-child(3) .wings-bottom-nav-icon { color: #d97706; } /* Ön Rez. */
  .wings-bottom-nav-item:nth-child(4) .wings-bottom-nav-icon { color: #7c3aed; } /* Kasa */
  .wings-bottom-nav-item.is-active {
    color: rgb(41 37 36); font-weight: 600;
    background: rgb(245 245 244); border-radius: 0.75rem;
  }
  .dark .wings-bottom-nav-item.is-active { color: #fff; background: rgb(41 37 36); }
  /* İçerik alt barın altında kalmasın */
  .fi-main { padding-bottom: 5.5rem !important; }
}

/* Alt bar masaüstünde yok — masaüstü görünümü değişmez */
@media (min-width: 769px) {
  .wings-bottom-nav { display: none; }
}
