@media (max-width: 1100px) {
    .page-split,
    .page-split-wide,
    .laf-wrapper,
    .grid-stats {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 991px) {
    .sidebar {
        position: fixed;
        left: -260px;
        top: 0;
        bottom: 0;
        height: 100vh;
        z-index: 1000;
        box-shadow: 4px 0 10px rgba(0,0,0,0.1);
    }
    .sidebar.open {
        left: 0;
        transform: none;
    }
    .hamburger { display: block; }
    .grid-stats { grid-template-columns: 1fr 1fr; }
    .content-area { padding: 22px 16px; }
    .topbar { padding: 0 16px; }
}

@media (max-width: 768px) {
    .form-grid,
    .laf-form-grid,
    .checklist-grid,
    .checklist-grid.cols-3,
    .device-info-grid,
    .staff-dashboard-grid {
        grid-template-columns: 1fr !important;
    }

    .page-title { font-size: 20px; margin-bottom: 16px; }
    .card { padding: 16px; }

    .table-wide { min-width: 820px; }
    .table th,
    .table td {
        padding: 12px 14px;
        white-space: nowrap !important;
        vertical-align: middle;
    }
    .table td.cell-wrap {
        white-space: normal !important;
    }

    .filter-bar {
        display: grid;
        grid-template-columns: 1fr 1fr;
        width: 100%;
        align-items: end;
    }
    .filter-bar .form-group,
    .filter-bar > div {
        width: 100%;
        min-width: 0;
    }
    .filter-bar .btn {
        grid-column: 1 / -1;
        width: 100%;
        height: 42px;
    }

    .form-actions {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
    .form-actions .btn {
        width: 100%;
        min-width: 0;
        text-align: center;
    }

    .modal-content { padding: 18px; }
    .app-alert-card { padding: 20px 16px 16px; }
}

@media (max-width: 576px) {
    .grid-stats { grid-template-columns: 1fr; }
    .content-area { padding: 16px 12px; }
    .btn-logout-desktop { display: none !important; }
    .form-grid { grid-template-columns: 1fr; }
}