/* ── RESPONSIVE — Móvil / Tablet / Desktop ── */

/* MÓVIL (default) — ya definido en layout.css */

/* TABLET / DESKTOP — 768px+ */
@media (min-width: 768px) {
  .app-body {
    flex-direction: row !important;
    align-items: stretch;
  }
  #nav-wrap {
    height: 100% !important;
    width: var(--nav-desk-w) !important;
    min-width: 130px;
    max-width: 200px;
  }
  .nav-botnav  { display: none !important; }
  .nav-sidebar { display: flex !important; }
}

/* LARGE DESKTOP — 1200px+ */
@media (min-width: 1200px) {
  :root {
    --nav-desk-w: 15dvw;
  }
}