/* =====================================================================
   OMS — responsive breakpoints
   Desktop: sidebar + header + main.  Tablet/mobile: off-canvas sidebar,
   compact header, scrollable tables.
   ===================================================================== */

@media (max-width: 1399.98px) {
    .header-user-text { max-width: 140px; }
}

@media (max-width: 1199.98px) {
    .stat-grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .profile-layout { grid-template-columns: 260px minmax(0, 1fr); }
    .header-secure span { display: none; }
}

/* Tablet and below: sidebar becomes an off-canvas drawer */
@media (max-width: 991.98px) {
    .app-wrapper, .sidebar-collapse .app-wrapper {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas: "header" "main" "footer";
    }
    .app-sidebar {
        position: fixed; left: 0; top: var(--oms-header-h); bottom: 0; width: min(280px, 86vw); height: auto;
        transform: translateX(-102%); transition: transform .2s ease; box-shadow: 8px 0 24px rgba(13, 23, 34, .3);
    }
    .sidebar-open .app-sidebar { transform: none; }
    /* The icon-only mode is a desktop feature: always show full labels in the drawer. */
    .sidebar-collapse .app-sidebar .nav-text,
    .sidebar-collapse .app-sidebar .nav-arrow,
    .sidebar-collapse .app-sidebar .nav-soon { display: revert; }
    .sidebar-collapse .app-sidebar .menu-open > .nav-treeview { display: block; }
    .sidebar-collapse .app-sidebar .nav-link { justify-content: flex-start; padding: 6px 14px 6px 16px; }
    .sidebar-collapse .app-sidebar .nav-treeview .nav-link { padding-left: 44px; }
    .sidebar-collapse .sidebar-foot { display: block; }
    .app-sidebar .nav-link { min-height: 40px; }
    .nav-treeview .nav-link { min-height: 36px; }

    .chart-grid { grid-template-columns: minmax(0, 1fr); }
    .profile-layout { grid-template-columns: minmax(0, 1fr); }
    .header-search { margin-left: 6px; }
    .header-search-key { display: none; }
}

@media (max-width: 767.98px) {
    .app-main { padding: 12px 10px 18px; }
    .app-footer { padding: 9px 10px; }
    .brand-text { display: none; }
    .header-user-text, .header-user > .bi, .header-secure { display: none; }
    .header-user { padding: 0 4px; }
    .stat-grid-3 { grid-template-columns: minmax(0, 1fr); }
    .form-grid { grid-template-columns: minmax(0, 1fr); }
    .refresh-text { min-width: 0; text-align: left; flex-basis: 100%; order: 3; }
    .search-table th:nth-child(3), .search-table td:nth-child(3) { display: none; }
    .oms-table { white-space: nowrap; }   /* tables scroll horizontally inside .table-responsive */
    .footer-version { margin-left: 0; flex-basis: 100%; }
    .toast-stack { right: 8px; bottom: 8px; width: calc(100vw - 16px); }
}

@media (max-width: 479.98px) {
    /* Two compact columns keep the eight infrastructure figures on one screen. */
    .stat-grid-4 .stat-icon { display: none; }
    .stat-grid-4 .stat-label { white-space: normal; }
    .header-search-input { padding-right: 8px; }
    .header-search-input::placeholder { color: transparent; }
    .login-card { padding: 20px 18px 16px; }
    .page-title { font-size: 1.125rem; }
}

@media print {
    .app-header, .app-sidebar, .app-footer, .page-actions, .toast-stack, .session-banner { display: none !important; }
    .app-wrapper { display: block; }
    .app-main { padding: 0; }
    body { background: #fff; }
    .oms-card, .stat-card { box-shadow: none; break-inside: avoid; }
}

@media (max-width: 1199.98px) {
    .form-grid-3, .form-grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767.98px) {
    .form-grid-3, .form-grid-4 { grid-template-columns: minmax(0, 1fr); }
    .row-actions .btn-text { display: none; }
    .filter-item, .filter-search { flex: 1 1 46%; max-width: none; }
    .filter-bar .form-control, .filter-bar .form-select { width: 100%; min-width: 0; }
    .view-list { grid-template-columns: minmax(0, 1fr); }
    .view-list dt { border-bottom: 0; padding-bottom: 0; }
    .settings-row { grid-template-columns: minmax(0, 1fr); }
    .stat-grid-auto { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media print {
    .filter-bar, .table-foot nav, .col-actions, .card-tools, .crud-form-card, #crudStats, .app-content-header, .page-intro { display: none !important; }
    .print-head { display: flex; justify-content: space-between; padding: 0 0 8px; font-size: 11pt; }
    .oms-card { border: 0; }
    .oms-card > .card-header { display: none; }
    .oms-table { font-size: 8.5pt; }
    .oms-table thead th { background: #eee !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
    .table-responsive { overflow: visible !important; }
    @page { size: A4 landscape; margin: 12mm; }
}

@media (max-width: 1199.98px) {
    .top-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 991.98px) {
    .settings-columns { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 575.98px) {
    .top-grid { grid-template-columns: minmax(0, 1fr); }
    .tfa-codes pre { columns: 1; }
}
@media (max-width: 767.98px) { .oms-table.table-wrap { white-space: normal; } }