/**
 * responsive.css
 * Media queries Radio Control — Mobile First
 */

/* ══════════════════════════════
   TABLETTE (< 992px)
══════════════════════════════ */
@media (max-width: 991.98px) {

  :root {
    --sidebar-width: 0px;
    --content-padding: 16px 20px;
  }

  /* Sidebar masquée par défaut, accessible via toggle */
  .rts-sidebar {
    position: fixed;
    left: -220px;
    top: var(--topbar-height);
    width: 220px;
    height: calc(100vh - var(--topbar-height));
    z-index: 900;
    transition: left 0.25s ease;
    overflow-y: auto;
    min-height: unset;
  }
  .rts-sidebar--open { left: 0; }

  /* Overlay quand sidebar ouverte */
  .rts-sidebar-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.4);
    z-index: 850;
  }
  .rts-sidebar-overlay--active { display: block; }

  /* Bouton hamburger */
  .rts-topbar__hamburger {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: transparent;
    border: 0.5px solid rgba(255,255,255,0.2);
    border-radius: 4px;
    cursor: pointer;
    flex-direction: column;
    gap: 4px;
    padding: 6px;
  }
  .rts-topbar__hamburger span {
    display: block;
    width: 16px;
    height: 1.5px;
    background: #ccc;
    border-radius: 1px;
  }

  /* Navigation topbar compacte */
  .rts-topbar__nav { display: none; }

  /* KPI grids en 2 colonnes */
  .rts-kpi-grid--4,
  .rts-kpi-grid--5 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  /* Action cards en 1 colonne */
  .rts-action-grid { grid-template-columns: 1fr; }

  /* Page login en colonne */
  .rts-login-panel-left { display: none; }
  .rts-login-panel-right { width: 100%; }

  /* Campagne header en colonne */
  .rts-campagne-header { flex-direction: column; align-items: flex-start; gap: 10px; }
  .rts-campagne-header__period { margin-left: 0; }
}

/* ══════════════════════════════
   MOBILE (< 768px)
══════════════════════════════ */
@media (max-width: 767.98px) {

  :root { --content-padding: 12px 14px; }

  /* KPI en 2 colonnes même sur mobile */
  .rts-kpi-grid--4,
  .rts-kpi-grid--5 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  /* Topbar — masquer le nom d'utilisateur */
  .rts-topbar__username { display: none; }

  /* Calendrier — scroll horizontal */
  .rts-calendar-grid,
  .rts-week-grid { overflow-x: auto; }
  .rts-calendar-days-header,
  .rts-calendar-row {
    min-width: 480px;
  }

  /* Welcome banner en colonne */
  .rts-welcome-banner {
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
  }
  .rts-welcome-banner::after { display: none; }

  /* Form card plein écran */
  .rts-form-card { max-width: 100%; padding: 20px 16px; }
  .rts-login-card { padding: 28px 20px; }

  /* Audio bar compacte */
  .rts-audio-bar { flex-wrap: wrap; }
  .rts-audio-bar__time { width: 100%; text-align: right; }

  /* Zone tabs scroll */
  .rts-zone-tabs { overflow-x: auto; flex-wrap: nowrap; }

  /* Footer en colonne */
  .rts-footer { flex-direction: column; gap: 4px; text-align: center; height: auto; padding: 10px; }
}

/* ══════════════════════════════
   GRANDS ÉCRANS (> 1400px)
══════════════════════════════ */
@media (min-width: 1400px) {
  .rts-main-content { padding: 32px 48px; }
}

/* ══════════════════════════════
   HAMBURGER VISIBLE SEULEMENT MOBILE
══════════════════════════════ */
@media (min-width: 992px) {
  .rts-topbar__hamburger { display: none; }
}