/* ============================================================
   assets/responsive.css — Mobile-first ekler
   Mevcut core.css'e DOKUNMAZ, üstüne biner.
   ============================================================ */

/* ---------- ORTAK ---------- */
html, body { overflow-x: hidden; }
* { -webkit-tap-highlight-color: transparent; }

/* ---------- iPad / TABLET (769px - 1024px) ---------- */
/* Bu aralıkta 1 sütun çok dar, 2 sütun daha doğru — iPad portrait için */
@media (min-width: 769px) and (max-width: 1024px) {
  .content { padding: 16px !important; }
  .page-head h1 { font-size: 22px !important; }

  /* 2 sütun grid'ler — kart sıkışıklığını azaltır */
  .widgets-grid, .card-row-grid, .machines-grid, .pr-grid, .pv-variants {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
  }
  /* KPI bantları küçük tutalım */
  .stk-kpi-grid, .wh-kpi-grid, .alog-stats, .mw-stats, .pr-cat-grid {
    grid-template-columns: repeat(auto-fit, minmax(140px,1fr)) !important;
    gap: 10px !important;
  }
  /* Tablolar yatay kaydır */
  .data-table, .cari-table, .stk-mov-table, .alog-table {
    min-width: 600px;
  }
  .widget, .cari-section, .stk-section, .alog-table, .wh-panel {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .data-table { font-size: 12px; }
  .data-table th, .data-table td { padding: 8px !important; }

  /* Form grid'leri iPad'de iki sütunlu kalır ama daha sıkı */
  .form-grid { gap: 10px !important; }

  /* Üretim takip atama panel - iPad portrait'te tek sütun (sürükleme zor) */
  .assign-layout { grid-template-columns: 280px 1fr !important; }

  /* v75ce — geniş bileşenler taşmasın, yatay kaydırılsın (üst üste binmeyi önler) */
  .gantt-wrap, .gantt, .wh-rack-blocks, .wh-rack-layout {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
  }

  /* Cari, ürün detay modal — geniş gözüksün */
  .pv-grid { grid-template-columns: 1fr 1.2fr !important; }
  .modal { max-width: 92vw !important; }

  /* Topbar arama biraz daralsın */
  .topbar .search { max-width: 280px !important; }

  /* iOS form zoom engeli */
  input, select, textarea { font-size: 14px !important; }
}

/* ---------- iPad LANDSCAPE / küçük masaüstü (1025px - 1280px) ---------- */
@media (min-width: 1025px) and (max-width: 1280px) {
  .machines-grid, .pr-grid { grid-template-columns: repeat(3, 1fr) !important; }
  .stk-kpi-grid, .wh-kpi-grid { grid-template-columns: repeat(auto-fit, minmax(150px,1fr)) !important; }
}

/* ---------- MOBILE (≤ 768px) ---------- */
@media (max-width: 768px) {
  /* TOPBAR — mobilde 56px (sidebar/scrim top:56px ile uyumlu) */
  .topbar {
    height: 56px !important;
    padding: 0 10px !important;
    gap: 6px !important;
    flex-wrap: nowrap;
  }
  .topbar-brand {
    height: 56px !important;
    padding: 6px 10px !important;
    border-right: none !important;
  }
  .topbar-brand .brand-logo-box {
    height: 40px !important;
    max-height: 40px !important;
  }
  .topbar .search { display: none !important; }
  .topbar-clock { display: none !important; }
  .topbar-brand .brand-logo-box img {
    max-height: 32px !important;
    max-width: 120px !important;
  }
  .hamburger-btn { display: inline-flex !important; }
  .user-chip { width: 32px !important; height: 32px !important; font-size: 11px !important; }
  .header-actions .icon-btn { padding: 6px !important; }

  /* BACK BUTTON - küçük ekranda sadece ikon */
  .back-btn span { display: none; }
  .back-btn { padding: 6px !important; }

  /* SIDEBAR - drawer gibi açılır */
  .sidebar {
    position: fixed !important;
    top: 56px !important;
    left: -100% !important;
    width: 80% !important;
    max-width: 300px !important;
    height: calc(100vh - 56px) !important;
    z-index: 100 !important;
    background: var(--card, #fff) !important;
    box-shadow: 2px 0 20px rgba(0,0,0,.15);
    transition: left .25s ease !important;
    overflow-y: auto !important;
    padding: 12px !important;
  }
  .sidebar.open { left: 0 !important; }
  .sidebar-scrim {
    display: none;
    position: fixed;
    inset: 56px 0 0 0;
    background: rgba(0,0,0,.4);
    z-index: 99;
  }
  .sidebar-scrim.open { display: block; }

  /* İÇERİK - sidebar yokken tam genişlik */
  .app-body { display: block !important; }
  .content {
    padding: 14px 12px !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* PAGE HEAD - mobile */
  .page-head {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
    margin-bottom: 14px !important;
  }
  .page-head h1 { font-size: 20px !important; }
  .page-actions {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
  }
  .page-actions .btn,
  .page-actions button {
    flex: 1 1 auto;
    min-width: 0;
    justify-content: center;
    font-size: 12px !important;
    padding: 7px 10px !important;
  }

  /* TABLOLAR - yatay kaydırma */
  .data-table,
  .cari-table,
  .cx-ledger-table {
    font-size: 11px;
    min-width: 500px;
  }
  .widget,
  .cari-section {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* KARTLAR - tek kolon */
  .card-row-grid,
  .widgets-grid,
  .kv-grid {
    grid-template-columns: 1fr !important;
  }

  /* DETAY - başlık */
  .detail-head {
    padding: 10px !important;
  }
  .detail-head h1 {
    font-size: 18px !important;
  }

  /* DRAWER - tam ekran yap */
  .drawer {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* MODAL - full screen */
  .modal-scrim .modal {
    width: 96% !important;
    max-width: 96% !important;
    max-height: 95vh !important;
    margin: 2vh auto;
  }
  .modal-body { padding: 14px !important; }

  /* FORM FIELDS */
  .field label { font-size: 11px !important; }
  .field input, .field select, .field textarea {
    font-size: 14px !important; /* iOS zoom engeli */
    padding: 10px !important;
  }

  /* CARİ MODULÜ - MOBILE */
  .cari-module { padding: 0 !important; }
  .cari-tabs {
    margin-left: -12px;
    margin-right: -12px;
    padding: 0 12px;
  }
  .cari-tab { padding: 8px 12px !important; font-size: 12px !important; }
  .cari-grid { grid-template-columns: 1fr !important; gap: 10px !important; }
  .cari-card { padding: 12px 14px !important; }
  .cari-card-value { font-size: 16px !important; }
  .cari-form { grid-template-columns: 1fr !important; padding: 12px !important; }
  .cari-section { margin-bottom: 16px !important; }

  /* CARİ EXTRAS */
  .cust-extras { margin-top: 14px !important; }
  .cust-extras-tabs { overflow-x: auto; }
  .cx-fields { grid-template-columns: 1fr !important; }
  .cx-ledger-summary { grid-template-columns: 1fr 1fr !important; }

  /* EXPORT MODAL */
  .gx-modal { max-width: 96% !important; }
  .gx-cols { grid-template-columns: 1fr !important; }

  /* TOAST */
  .toast-stack {
    left: 10px !important;
    right: 10px !important;
    max-width: none !important;
  }
}

/* ---------- KÜÇÜK MOBILE (≤ 480px) ---------- */
@media (max-width: 480px) {
  .topbar-brand .brand-logo-box img {
    max-height: 28px !important;
    max-width: 100px !important;
  }
  .page-head h1 { font-size: 18px !important; }
  .cari-tab { font-size: 11px !important; padding: 7px 10px !important; }
  .cari-card-value { font-size: 15px !important; }
  .cari-card-label { font-size: 10px !important; }
  .cx-ledger-summary { grid-template-columns: 1fr !important; }
  .cx-ledger-card .val { font-size: 15px !important; }
}

/* ---------- MASAÜSTÜ iyileştirmeler (≥ 769px) ---------- */
@media (min-width: 769px) {
  .hamburger-btn { display: none !important; }
  .sidebar-scrim { display: none !important; }
}
