/* =========================================================================
   KobiCar admin panel - GLOBAL mobile layer (admin-mobile.css)
   app.blade.php <head> icinde EN SON yuklenir; onceki panel CSS'lerini ezer.
   Derleme/Tailwind yok -> duz CSS.

   ONEMLI: Kenar cubugu off-canvas cekmecesi Tabler/bs4-uyum katmaninda
   halledilir (.app-sidebar + .sidebar-mobile-open). Bozulmamasi icin kenar
   cubugu ve icerik kenar bosluklarina burada DOKUNULMAZ.
   This file only fixes content-level issues the theme cannot know about:
   tables, split-views, filter bars, dropdowns, breadcrumb, tabs.
   ========================================================================= */

/* Smooth momentum scroll inside any horizontally-scrollable table wrapper */
.page-body .table-responsive { -webkit-overflow-scrolling: touch; }

/* ===================== TABLET and below (<= 991.98px) ===================== */
@media (max-width: 991.98px) {

  /* Legacy Tailwind 'w-full' tables sit inside .card.overflow-hidden which
     CLIPS overflow (worse than no wrapper). Let the card scroll horizontally
     and give the table a min content width so the scroll actually triggers. */
  .page-body .card.overflow-hidden { overflow-x: auto !important; -webkit-overflow-scrolling: touch; }
  .page-body table.w-full { min-width: 680px; }

  /* Notification (330px) + user (230px) dropdowns must not exceed the viewport */
  .navbar .dropdown-menu { max-width: calc(100vw - 20px); }

  /* Topbar logo: mobilde HER ZAMAN buyuk (yuklenen tasarim) logo; mini-logo asla.
     closed-sidebar (resize JS <1250px ekler) mini-logo'yu acmasin -> yuksek ozgulluk + !important. */
  .app-container .app-header .kobicar-mini-logo,
  .app-container.closed-sidebar .app-header .kobicar-mini-logo { display: none !important; }
  .app-container.closed-sidebar .app-header .app-header__logo .logo-src a,
  .app-container.closed-sidebar .app-header .app-header__logo .logo-src a svg,
  .app-container.closed-sidebar .app-header .app-header__logo .logo-src svg { display: block !important; }
  .app-container.closed-sidebar .app-header .app-header__logo .logo-src a { display: inline-flex !important; }
  .app-container.closed-sidebar .app-header .app-header__logo .logo-src img:not(.kobicar-mini-logo) { display: inline-block !important; }
}

/* ===================== PHONE (<= 768px) ===================== */
@media (max-width: 768px) {

  /* NOT: .page-body overflow-x:hidden KULLANMA -> overflow-y'yi auto'ya zorlar,
     position:sticky kaydet cubugunu bozar. Yatay tasma zaten tablo auto-wrap ile cozuldu. */

  /* --- Card breathing room: smaller padding gives tables more width --- */
  .page-body .card-body { padding: 14px !important; }
  .page-body .card-header { padding: 10px 14px !important; }

  /* --- Kart basligi: tema mobilde block+center yapip aksiyon butonunu alta itiyor
         (base.css ~37218 body .card-header{display:block;text-align:center} +
          .btn-actions-pane-right{padding-top:.75rem}). responsive-center HARIC
          tum kart basliklarini satira/sola geri al, butonu saga yapistir. --- */
  body .page-body .card-header:not(.responsive-center) {
    display: flex !important; flex-direction: row; align-items: center; flex-wrap: wrap;
    text-align: left !important; gap: 6px 10px;
  }
  body .page-body .card-header:not(.responsive-center) .btn-actions-pane-right {
    padding: 0 !important; margin-left: auto;
  }

  /* --- Fixed-pixel filter / search inputs -> full width (style="width:NNNpx") --- */
  .filter-content [style*="width:"],
  .page-body form .d-flex.flex-wrap > [style*="width:"],
  .page-body .d-flex.flex-wrap > [style*="width:"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: 1 1 100% !important;
  }
  .filter-content .form-control,
  .page-body form .d-flex.flex-wrap .form-control,
  .page-body form .d-flex.flex-wrap select.form-control { width: 100% !important; min-width: 0 !important; }

  /* --- Tab bars: scroll horizontally instead of wrapping to many rows --- */
  .page-body .nav-tabs,
  .page-body .nav-pills { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .page-body .nav-tabs::-webkit-scrollbar,
  .page-body .nav-pills::-webkit-scrollbar { height: 3px; }
  .page-body .nav-tabs .nav-item,
  .page-body .nav-pills .nav-item { flex: 0 0 auto; }

  /* --- Breadcrumb: keep on one line, scroll if the chain is long --- */
  .kobicar-breadcrumb {
    white-space: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .kobicar-breadcrumb::-webkit-scrollbar { display: none; }

  /* --- SPLIT-VIEW: WhatsApp inbox -> single column --- */
  .main-chat-container {
    flex-direction: column !important;
    height: auto !important;
    max-width: 100% !important;
    margin: 12px 0 !important;
  }
  .main-chat-container .chat-list {
    width: 100% !important;
    border-right: 0 !important;
    border-bottom: 1px solid #eee !important;
    border-radius: 12px 12px 0 0 !important;
    max-height: 42vh;
  }
  .main-chat-container .chat-container { min-height: 56vh; }

  /* --- SPLIT-VIEW: File manager -> single column --- */
  .fm-wrap { flex-direction: column !important; }
  .fm-wrap .fm-yan {
    flex: 1 1 auto !important;
    width: 100% !important;
    max-height: 42vh;
  }
  .fm-wrap .CodeMirror { height: 52vh !important; }

  /* --- Page-title actions stack below the title on small screens --- */
  .app-page-title .page-title-actions { float: none !important; display: block; margin-top: .6rem; }

  /* --- GENIS TABLO ZOOM-OUT FIX (orn. Guvenlik): flex-column cocuklari icerik
         genisligine kilitlenip sayfayi genisletmesin; tablo .table-responsive
         icinde yatay kaysin. min-width:0 = flex item icerigin altina kuculebilir. --- */
  .page-body > *,
  .page-body .main-card,
  .page-body .card,
  .page-body .card-body,
  .page-body .row > [class*="col"] { min-width: 0; }
  .page-body .table-responsive { max-width: 100%; }
}

/* ===================== SMALL PHONE (<= 576px) ===================== */
@media (max-width: 576px) {

  /* Modal almost full-width (shrink side gutters) */
  .modal-dialog { margin: .5rem; max-width: calc(100vw - 1rem); }

  /* Site Settings horizontal tab bar: compact, but keep labels readable */
  .site-sekme-bar .site-sekme { padding: 7px 11px; font-size: .82rem; }
}

/* ============ GLOBAL POPUP STANDARDI (tasarim butunlugu) ============ */
/* Mobil (<=576px): TUM modallar + onay kartlari alttan kayan sheet */
@media (max-width: 576px){
  /* Alttan kayan sheet: ustte ~parmak bosluk (max-height) + uzun icerik KAYAR (body scroll) */
  .modal-dialog{ position:fixed !important; left:0; right:0; bottom:0; top:auto !important; margin:0 !important; max-width:100% !important; width:100% !important; max-height:90vh !important; }
  .modal-content{ border-radius:16px 16px 0 0 !important; max-height:90vh; }
  .modal-body{ overflow-y:auto !important; -webkit-overflow-scrolling:touch; }
  .modal.fade .modal-dialog{ transform:translateY(100%); transition:transform .28s ease; }
  .modal.show .modal-dialog{ transform:translateY(0); }
  #kobicarConfirmOverlay{ align-items:flex-end !important; }
  #kobicarConfirmOverlay .bc-kart{ max-width:100% !important; width:100% !important; max-height:90vh; overflow-y:auto; -webkit-overflow-scrolling:touch; border-radius:16px 16px 0 0 !important; padding-bottom:28px !important; animation:kobicarSheetUp .28s ease; }
}
/* Masaustu: onay karti hafif acilis (tak diye degil) */
@media (min-width: 577px){
  #kobicarConfirmOverlay.acik .bc-kart{ animation:kobicarPop .18s ease; }
}
@keyframes kobicarSheetUp{ from{ transform:translateY(100%); } to{ transform:translateY(0); } }
@keyframes kobicarPop{ from{ opacity:0; transform:scale(.96); } to{ opacity:1; transform:scale(1); } }

/* ============ GLOBAL KART BASLIGI (panel geneli tutarli) ============ */
.ss-bolum-baslik{ font-size:1rem; font-weight:600; color:#0855a3; border-bottom:1px solid #e9ecf3; padding-bottom:.5rem; margin-bottom:1rem; }
.ss-bolum-baslik i{ font-size:1.15rem; vertical-align:-2px; margin-right:.35rem; }



/* ====== Masaustu: modallar DIKEY ORTALI. modal[style*=display:block] -> ACILIRKEN ve KAPANIRKEN flex kalir (kapatinca yer atlamaz/zicramaz). min-height YOK (stretch/golge yok). Mobil max-576 bottom-sheet etkilenmez. ====== */
@media (min-width: 577px){
  .modal[style*="display: block"], .modal[style*="display:block"]{ display:flex !important; align-items:center; align-items:safe center; }
}

/* ============ Topbar bildirim + kullanici dropdown: mobilde alttan SHEET ============ */
/* Onceki davranis: Popper kucuk kutuyu ekran ortasinda ucuruyordu. Artik modallarla ayni
   alttan kayan sheet (tam genislik, ust kose yuvarlak, slide-up). Sadece app-header-right
   dropdownlari (bildirim + kullanici); arama zaten yok. */
@media (max-width: 576px){
  .app-header-right .dropdown-menu{
    position:fixed !important;
    left:0 !important; right:0 !important; bottom:0 !important; top:auto !important;
    transform:none !important;                 /* Popper inline transform iptal */
    margin:0 !important;
    width:100% !important; max-width:100% !important; min-width:0 !important;
    border:0 !important; border-radius:16px 16px 0 0 !important;
    max-height:82vh !important; overflow-y:auto !important; -webkit-overflow-scrolling:touch;
    box-shadow:0 -10px 34px rgba(4,9,20,.22) !important;
    padding-bottom:22px !important;            /* alt parmak boslugu */
    z-index:1060 !important;
  }
  .app-header-right .dropdown-menu.show{ animation:kobicarSheetUp .26s ease; }
}
