/* ==========================================================================
   responsive.css — Cross-page responsive behavior
   (Sidebar breakpoints live in sidebar.css; this file covers content.)
   ========================================================================== */

/* Tablet: tighten page gutters */
@media (max-width: 991.98px) {
    .main-content > .container-fluid {
        padding-left: 1.25rem !important;
        padding-right: 1.25rem !important;
    }

    /* Page headers that place actions beside the title wrap gracefully */
    .main-content .d-flex.justify-content-between.align-items-center.mb-4,
    .main-content .d-flex.justify-content-between.align-items-start.mb-4 {
        flex-wrap: wrap;
        gap: 0.75rem;
    }
}

/* Mobile */
@media (max-width: 767.98px) {
    body { font-size: 0.875rem; }

    .main-content h1.h2 { font-size: 1.1875rem; }

    .card-body { padding: 1rem; }

    /* Tables scroll horizontally inside their card instead of breaking layout */
    .table-responsive { -webkit-overflow-scrolling: touch; }

    /* Segmented nav scrolls if it can't fit */
    .nav-pills {
        max-width: 100%;
        overflow-x: auto;
        flex-wrap: nowrap !important;
    }
    .nav-pills .nav-link { white-space: nowrap; }

    .modal-dialog { margin: 0.75rem; }
}