/* =========================================================================
   RESPONSIVE — Sprint 3 (audit GED 2026-05-05)
   Mobile-first sur les vues principales, breakpoints standardises depuis
   design-tokens.css : sm=640, md=768, lg=1024, xl=1280, 2xl=1536.
   - Sidebar : drawer + overlay sur < 1024px
   - Tables : mode "carte" sur < 640px (preserve l'existant via opt-in)
   - Filtres Documents/Search : layout colonne stack sur mobile
   - Topbar : recherche full-width sur mobile, autres elements caches
   - Hero/cards : grilles auto-fit deja existantes, juste ajustement breakpoints
   - Decision Hero / Hero Card / Smart Folders : layouts verticalises
   ========================================================================= */

/* -----------------------------------------------------------------------
   DESKTOP < 1280px : ajustements mineurs
   ----------------------------------------------------------------------- */
@media (max-width: 1280px) {
  .topbar-search input { width: 240px; }
  .topbar-cmdk-label { display: none; }
}

/* -----------------------------------------------------------------------
   TABLET / SMALL DESKTOP < 1024px : sidebar drawer
   ----------------------------------------------------------------------- */
@media (max-width: 1024px) {
  /* Sidebar passe en drawer fixe avec overlay */
  .sidebar {
    transform: translateX(-100%);
    box-shadow: var(--gd-shadow-2xl, 0 25px 50px -12px rgba(0,0,0,.25));
    transition: transform var(--gd-duration-normal, .22s) var(--gd-ease-emphasized, cubic-bezier(.2,0,0,1));
  }
  .sidebar.open { transform: translateX(0); }
  .main { margin-left: 0; }
  /* Overlay quand sidebar ouverte */
  body.sidebar-open::after {
    content: '';
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, .55);
    z-index: 99;
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    animation: sb-fade-in var(--gd-duration-fast, .15s) ease-out;
  }
  @keyframes sb-fade-in {
    from { opacity: 0; }
    to { opacity: 1; }
  }
  /* Hamburger visible */
  #burger {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 1px solid var(--border);
    border-radius: 8px;
    width: 36px; height: 36px;
    color: var(--text);
    margin-right: 12px;
    cursor: pointer;
  }
  /* Topbar plus serree */
  .topbar { padding: 0 16px; }
  .topbar-status { display: none; }
}

/* -----------------------------------------------------------------------
   TABLET PORTRAIT < 768px : layouts simplifies
   ----------------------------------------------------------------------- */
@media (max-width: 768px) {
  .content { padding: 16px; }
  .topbar-search { display: none; } /* Cmd+K est plus accessible mobile */
  .topbar-cmdk { flex: 1; max-width: 220px; }
  .topbar-user-label { display: none; }

  /* Grilles 2 colonnes -> 1 colonne sur tablette portrait */
  .kpi-grid { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); }

  /* Dashboard grilles auto */
  #page-dashboard > div[style*="grid-template-columns:1fr 1fr"],
  #page-dashboard > div[style*="grid-template-columns:1fr 1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }

  /* Sprint 1 Decision Hero : stacking */
  .dec-hero { padding: 22px 18px; }
  .dec-hero-greet { font-size: 1.4rem; }
  .dec-hero-cards { grid-template-columns: 1fr; }
  .dec-hero-head { flex-direction: column; align-items: flex-start; gap: 12px; }

  /* Sprint 2 Hero Card : full-screen */
  .dhc-overlay { padding: 0; }
  .dhc-card {
    grid-template-columns: 1fr !important;
    width: 100%; max-width: 100%;
    height: 100vh; max-height: 100vh;
    border-radius: 0;
  }
  .dhc-preview { min-height: 200px; max-height: 220px; }
  .dhc-preview img { max-height: 180px; }

  /* Filtres : empilage vertical */
  .filters {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
  }
  .filters input,
  .filters select,
  .filters .form-control {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  /* Modals plus larges */
  .modal { width: 95vw; max-width: 95vw; }

  /* Toggle vue : reduit */
  .view-toggle-btn { padding: 6px 8px; }
}

/* -----------------------------------------------------------------------
   MOBILE < 640px : transformations majeures
   ----------------------------------------------------------------------- */
@media (max-width: 640px) {
  html { font-size: 15px; } /* leger redimensionnement pour eviter zoom safari */

  /* Cards : moins de padding */
  .card-body { padding: 14px; }
  .card-header { padding: 12px 14px; }
  .card-header h2 { font-size: .95rem; }

  /* Tables : mode "card" via class additionnelle .responsive-table-cards
     (opt-in : a appliquer sur le container .table-wrap pour basculer en cards).
     L'existant reste en mode tableau scrollable horizontalement (overflow-x:auto). */
  .table-wrap.responsive-table-cards table,
  .table-wrap.responsive-table-cards thead,
  .table-wrap.responsive-table-cards tbody,
  .table-wrap.responsive-table-cards tr,
  .table-wrap.responsive-table-cards td {
    display: block;
    width: 100%;
  }
  .table-wrap.responsive-table-cards thead { display: none; }
  .table-wrap.responsive-table-cards tr {
    margin-bottom: 12px;
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: var(--gd-radius-lg, 8px);
    padding: 10px 12px;
    box-shadow: var(--gd-shadow-sm, 0 1px 3px rgba(0,0,0,.08));
  }
  .table-wrap.responsive-table-cards td {
    border-bottom: 1px dashed var(--border);
    padding: 6px 0;
    text-align: left;
  }
  .table-wrap.responsive-table-cards td:last-child { border-bottom: none; }
  .table-wrap.responsive-table-cards td::before {
    content: attr(data-label);
    font-size: .68rem;
    font-weight: 700;
    color: var(--text-light);
    text-transform: uppercase;
    letter-spacing: .5px;
    display: block;
    margin-bottom: 2px;
  }

  /* Sprint 1 Saved Views : pile + scroll horizontal */
  .sv-bar {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding: 8px 0;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }
  .sv-bar-actions { margin-left: 12px; }

  /* Sprint 2 Kanban : cards plus etroites */
  .kb-col { flex: 0 0 240px; max-height: calc(100vh - 200px); }

  /* Sprint 2 Timeline : day-head smaller */
  .tl-day { grid-template-columns: 80px 1fr; gap: 10px; }
  .tl-day-num { font-size: 1.25rem; }
  .tl-day-month, .tl-day-weekday { font-size: .65rem; }

  /* Sprint 0 Aujourd'hui sidebar */
  .qw-today-block { margin: 4px 8px; padding: 10px 12px; }

  /* Smart Folders : compacter */
  .sf-section { padding: 0 8px; }
  .sf-item { padding: 7px 8px; font-size: .78rem; }

  /* Completude */
  .cs-card { grid-template-columns: 1fr; padding: 14px 16px; gap: 14px; }
  .cs-gauge { width: 110px; height: 110px; }
  .cs-gauge-pct { font-size: 1.4rem; }

  /* Chips de filtres : plus serres */
  .qw-chip { font-size: .72rem; padding: 3px 5px 3px 9px; max-width: 220px; }

  /* Boutons : taille touch */
  .btn { min-height: 40px; }
  .btn-sm { min-height: 36px; }

  /* Textes longs en titres */
  h1, .topbar-title { font-size: 1rem !important; }
  .sidebar-logo h1 { font-size: 1rem; }

  /* Sidebar drawer width legerement plus etroit */
  .sidebar { width: min(280px, 88vw); }

  /* Onboarding card */
  #gestdoc-onboarding-card,
  .onboarding-card {
    padding: 24px 18px;
    width: 95%;
  }

  /* CMD+K hint flash : plus discret */
  .cmdk-hint-flash {
    bottom: 16px; right: 12px; left: 12px;
    max-width: none;
  }

  /* Masquer les boutons secondaires non essentiels */
  #nav-back-btn, #nav-home-btn { display: none !important; }
}

/* -----------------------------------------------------------------------
   ACCESSIBILITE TOUCH : zones de tap suffisantes
   ----------------------------------------------------------------------- */
@media (pointer: coarse) {
  .nav-item { min-height: 48px; }
  .btn, .btn-icon, .view-toggle-btn { min-height: 44px; }
  .qw-chip, .sv-pill, .sf-item { min-height: 36px; }
  /* Espace inter-clickables minimum 4px */
  .filters > * { margin-bottom: 4px; }
}

/* -----------------------------------------------------------------------
   PRINT : version sobre pour impression de fiches
   ----------------------------------------------------------------------- */
@media print {
  .sidebar, .topbar, .qw-today-block, #gestdoc-help-floating, .cmdk-hint-flash,
  .sv-bar, .qw-chips, .view-toggle, .pagination, .dec-hero,
  .modal-actions, .dhc-foot, .sf-section { display: none !important; }
  .main { margin-left: 0 !important; }
  .content { padding: 0 !important; }
  .card { border: 1px solid #ccc !important; box-shadow: none !important; page-break-inside: avoid; }
  body, .page { background: #fff !important; color: #000 !important; }
}