/* ==========================================================================
   responsive.css — cross-module breakpoint adjustments.
   Component/module CSS files hold the base (desktop) rules; this file only
   holds the @media overrides needed to keep those screens usable on
   narrower laptop resolutions (1366x768 and below).
   ========================================================================== */

@media (max-width:1366px) {
    .list-kpi-grid {
        grid-template-columns: repeat(4,1fr)
    }
}

@media (max-width:576px) {
    .list-kpi-grid {
        grid-template-columns: 1fr
    }

    .list-filter-bar {
        flex-direction: column;
        align-items: stretch
    }

    .list-daterange-btn {
        justify-content: center
    }
}