/* ═══════════════════════════════════════════════════════════════
   Fortress Cloud — responsive layout
   ═══════════════════════════════════════════════════════════════ */

/* ── Tablet / small laptop: sidebar → drawer ─────────────────── */
@media (max-width: 1024px) {
  .sidebar {
    position: fixed; left: 0; top: 0; bottom: 0;
    transform: translateX(-100%); transition: transform 0.28s cubic-bezier(0.34, 1.3, 0.64, 1);
    box-shadow: var(--shadow-lg);
  }
  body.sidebar-open .sidebar { transform: translateX(0); }
  .sidebar-close { display: inline-flex; }
  .sidebar-backdrop {
    display: block; position: fixed; inset: 0; z-index: 35; background: rgba(3, 5, 10, 0.6);
    backdrop-filter: blur(3px); opacity: 0; pointer-events: none; transition: opacity 0.25s ease;
  }
  body.sidebar-open .sidebar-backdrop { opacity: 1; pointer-events: auto; }
  .hamburger { display: inline-flex; }
  /* The floating menu button is hidden whenever the real top bar is present. */
  .hamburger-float { display: none; }
  /* Pages without the top bar get a floating menu button so the drawer stays reachable. */
  body.no-topbar .hamburger-float {
    display: inline-flex;
    position: fixed; top: 12px; left: 12px; z-index: 40;
    background: var(--surface-2); border: 1px solid var(--border);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
  }
}

/* ── Small tablet / large phone ──────────────────────────────── */
@media (max-width: 820px) {
  .topbar { padding: 0 16px; }
  .content { padding: 22px 18px 80px; }

  .dash-grid { grid-template-columns: 1fr; }
  .settings-grid { grid-template-columns: 1fr; }

  .split { grid-template-columns: 1fr; gap: 36px; }
  .section { padding: 60px 20px; }
  .split > .split-visual { order: -1; }

  .file-row {
    grid-template-columns: 44px minmax(140px, 1fr) 90px 110px 80px;
  }
  .file-row-head { display: none; }
  .file-row .col-type, .file-row .col-size { display: none; }
  .file-row { grid-template-columns: 44px minmax(140px, 1fr) 110px 80px; }
}

/* ── Phones ──────────────────────────────────────────────────── */
@media (max-width: 560px) {
  .landing-nav { flex-wrap: wrap; gap: 14px; padding: 16px; }
  .landing-nav-links { display: none; }
  .landing-nav-cta { margin-left: auto; }
  .hero { padding: 44px 18px 64px; }
  .hero-cta { flex-direction: column; align-items: stretch; max-width: 320px; margin-inline: auto; }
  .hero-sub { font-size: 16px; }
  .feature-grid, .steps { grid-template-columns: 1fr; }

  .sidebar { width: min(84vw, 320px); }

  .content { padding: 18px 14px 90px; }

  .file-grid { grid-template-columns: repeat(auto-fill, minmax(142px, 1fr)); gap: 12px; }
  .file-card { padding: 12px; }

  .file-row {
    grid-template-columns: 40px minmax(120px, 1fr) 72px;
    padding: 9px 10px; gap: 8px;
  }
  .file-row .col-date { display: none; }
  .file-row .col-icon { justify-content: center; }
  .file-row .col-actions { opacity: 1; }
  .file-card-actions { opacity: 1; }

  .toolbar .btn .tb-label { display: none; }
  .toolbar .btn { padding: 10px 13px; }
  .toolbar { gap: 8px; }
  .toolbar-right { gap: 8px; }

  .topbar-search { max-width: none; }
  .topbar { gap: 8px; padding: 0 12px; }

  .modal { max-width: 100%; border-radius: 18px; }
  .modal-backdrop { padding: 12px; }

  .toast-root { left: 14px; right: 14px; bottom: 14px; align-items: stretch; }
  .toast { min-width: 0; max-width: none; }

  .dash-actions { grid-template-columns: 1fr 1fr; }

  .auth-card { padding: 28px 22px; }
}

/* ── Very small phones ───────────────────────────────────────── */
@media (max-width: 380px) {
  .file-grid { grid-template-columns: repeat(auto-fill, minmax(128px, 1fr)); }
  .dash-actions { grid-template-columns: 1fr; }
  .dash-big { font-size: 28px; }
}

/* ── Calendar responsive ────────────────────────────────────── */
@media (max-width: 900px) {
  .cal-month-cell { min-height: 92px; }
  .cal-topbar { gap: 8px; }
  .cal-view-switch { order: 3; width: 100%; }
  .cal-view-btn { flex: 1; }
}
@media (max-width: 640px) {
  .cal-month-cell { min-height: 68px; }
  .cal-event-time { display: none; }
  .cal-form-row { grid-template-columns: 1fr; }
  .cal-agenda-time { min-width: 96px; font-size: 12px; }
  .cal-title { font-size: 18px; }
}

/* ── Vault responsive ──────────────────────────────────────── */
@media (max-width: 900px) {
  .vault-search { flex: 1; min-width: 160px; }
  .vault-search input { width: 100%; }
}
@media (max-width: 560px) {
  .vault-gate { padding: 24px 14px; }
  .vault-gate-card { padding: 26px 20px; }
  .vault-item { flex-wrap: wrap; }
  .vault-item-actions { width: 100%; justify-content: flex-end; border-top: 1px solid var(--border); padding-top: 8px; }
  .vault-format-opt small { display: none; }
  .vault-toolbar .btn .tb-label { display: none; }
}


/* ── Messages responsive ── */
@media (max-width: 820px) {
  .msg-app { flex-direction: column; }
  .msg-side { width: 100%; border-right: none; border-bottom: 1px solid var(--border); max-height: 42vh; flex: none; }
  .msg-thread { min-height: 0; }
  .msg-bubble-wrap { max-width: 88%; }
  .msg-thread-head { padding: 12px 14px; }
  .msg-composer { padding: 10px 12px; }
  .msg-messages { padding: 14px; }
}

/* ── Merlin responsive ── */
@media (max-width: 820px) {
  .merlin-app { flex-direction: column; }
  .merlin-sidebar { width: 100%; border-right: none; border-bottom: 1px solid var(--border); max-height: 40vh; flex: none; }
  .merlin-main { min-height: 0; }
  .merlin-composer { padding: 10px 12px; }
  .merlin-messages { padding: 14px; }
  .merlin-msg-content { max-width: 92%; }
}

/* ── Editor responsive (toolbars + text area on phones) ── */
@media (max-width: 560px) {
  .editor-toolbar { flex-wrap: wrap; gap: 6px; }
  .editor-instrument { position: sticky; top: 0; z-index: 5; }
  .sheet-toolbar { flex-wrap: wrap; }
  .doc-toolbar { flex-wrap: wrap; }
  .pdf-toolbar { flex-wrap: wrap; }
}