/* ══ ADMIN RESPONSIVE — compartido por todas las páginas admin (excepto dashboard) ══
   module-nav es hijo DIRECTO del topbar → usa order:10 + flex:0 0 100% en móvil
   para aparecer como segunda fila a ancho completo.
*/

/* ── TABLET ── */
@media(max-width:900px){
  .module-tab{padding:.3rem .65rem;font-size:.73rem;}
  .page-body{padding:1.5rem 1.5rem;}
}

/* ── MOBILE ── */
@media(max-width:767px){
  /* ─ Topbar: fila 1 = logo + acciones, fila 2 = module-nav ─ */
  .topbar{
    height:auto !important;
    flex-wrap:wrap;
    align-items:center;
    padding:.4rem .75rem 0 !important;
    gap:0;
    column-gap:.5rem;
    position:sticky;
    top:0;
    z-index:30;
  }

  /* tb-left: solo logo, ancho natural */
  .tb-left{
    flex:none !important;
    gap:.35rem;
    align-items:center;
  }
  .tb-logo-img{height:36px !important;}
  .tb-divider{display:none !important;}

  /* module-nav: segunda fila, ancho completo */
  .module-nav{
    order:10;
    flex:0 0 100%;
    display:flex;
    overflow-x:auto;
    overflow-y:hidden;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    gap:1px;
    padding:.35rem 0 .4rem;
    border-top:1px solid var(--border);
    margin-top:.35rem;
  }
  .module-nav::-webkit-scrollbar{display:none;}
  .module-tab{
    white-space:nowrap;
    padding:.32rem .75rem;
    font-size:.74rem;
    flex-shrink:0;
  }

  /* tb-right: alineado a la derecha */
  .tb-right{
    flex-shrink:0;
    gap:.3rem;
    display:flex;
    align-items:center;
    margin-left:auto;
  }
  .tb-avatar-btn{width:28px;height:28px;font-size:.7rem;}
  .btn-theme{width:28px;height:28px;}

  /* Botones de acción del topbar: compactos */
  .btn-mgmt, .btn-icon{
    font-size:.66rem !important;
    padding:.28rem .55rem !important;
    white-space:nowrap;
  }

  /* ─ Contenido ─ */
  .page-body{padding:1.25rem 1rem !important;}

  .page-header{
    flex-direction:column;
    align-items:flex-start;
    gap:.75rem;
  }

  /* Tablas: scroll horizontal */
  .table-wrap,
  .stats-table-wrap,
  .content-card{
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }

  /* Grids en 1 columna */
  .stats-grid{grid-template-columns:1fr !important;}
  .form-grid{grid-template-columns:1fr !important;}
  .ff.full{grid-column:1 !important;}
  .cards-row,
  .card-grid{
    grid-template-columns:1fr !important;
    flex-direction:column;
  }

  /* Modales → bottom sheet */
  .modal-bg{align-items:flex-end;}
  .modal-card{
    border-radius:16px 16px 0 0;
    max-height:92dvh;
    max-width:100%;
    width:100%;
  }

  /* Toast */
  .toast{
    right:.75rem;
    left:.75rem;
    bottom:1rem;
    max-width:none;
  }

  /* Filtros de período */
  .period-btns{flex-wrap:wrap;}
}

@media(max-width:400px){
  .page-body{padding:1rem .75rem !important;}
  .module-tab{padding:.28rem .58rem;font-size:.7rem;}
}