/* ============================================
   RESPONSIVE DASHBOARD — TABLET
   Breakpoint: 768px – 1023px

   Ajustes intermedios del módulo Dashboard.
   ============================================ */

/* --------------------------------------------
   KPI GRIDS
   -------------------------------------------- */
@media screen and (min-width: 768px) and (max-width: 1023px) {

    /* 4 KPIs principales → 2 columnas en tablet */
    .dash-kpi-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 14px;
    }

    /* KPIs secundarias → 2 columnas */
    .dash-kpi2-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 14px;
    }
}

/* --------------------------------------------
   GRID INFERIOR
   -------------------------------------------- */
@media screen and (min-width: 768px) and (max-width: 1023px) {

    /* En tablet el sidebar va debajo de la tabla */
    .dash-bottom-grid--with-sidebar {
        grid-template-columns: 1fr;
    }

    /* Sidebar horizontal en tablet */
    .dash-sidebar-col {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .dash-sidebar-col > * {
        flex: 1 1 280px;
    }
}
