/*
 * Global responsive fixes for small screens.
 * Scope: layout stability only; no feature or page-content changes.
 */

*,
*::before,
*::after {
    box-sizing: border-box;
}

html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

main.main {
    min-width: 0;
}

img,
svg,
canvas,
video,
iframe {
    max-width: 100%;
}

iframe {
    width: 100%;
}

.table-responsive {
    -webkit-overflow-scrolling: touch;
}

@media (max-width: 991px) {
    .container,
    .container-fluid {
        max-width: 100%;
    }

    .header-area {
        top: 0 !important;
        overflow: visible !important;
    }

    .header-area .main-nav {
        display: flex;
        min-width: 0;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
    }

    .header-area .main-nav .logo {
        min-width: 0;
        max-width: calc(100% - 70px);
        flex: 1 1 auto;
        overflow: hidden;
    }

    .header-area .main-nav .logo h1 {
        max-width: 100%;
        margin: 0;
        overflow: hidden;
        font-size: 1.45rem;
        line-height: 1.1;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .header-area .logo-image {
        display: none !important;
    }

    .header-area .main-nav .menu-trigger {
        flex: 0 0 auto;
        margin-left: auto !important;
    }

    .header-area .main-nav > ul.nav {
        max-height: calc(100vh - 82px);
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    .header-area .main-nav > ul.nav > li,
    .header-area .main-nav > ul.nav > li > a {
        width: 100%;
    }

    .footer-columns {
        gap: 24px !important;
    }

    .footer-column {
        flex: 1 1 100% !important;
        min-width: 0 !important;
    }

    .quick-links-list {
        grid-template-columns: 1fr !important;
    }

    body.admin-sidebar-active main.main {
        margin-left: 0 !important;
        padding-top: 56px !important;
    }

    body.admin-sidebar-active #sidebar {
        width: min(82vw, 280px);
        transform: translateX(-100%);
        transition: transform 0.3s ease;
    }

    body.admin-sidebar-active.nav-open #sidebar {
        transform: translateX(0);
    }

    body.admin-sidebar-active.nav-collapsed #sidebar {
        transform: translateX(-100%);
    }

    body.admin-sidebar-active .admin-sidebar-toggle {
        top: 14px;
        left: 14px !important;
    }

    body.admin-sidebar-active .backdrop {
        position: fixed;
        inset: 0;
        display: none;
        background: rgba(17, 16, 24, 0.42);
        z-index: 900;
    }

    body.admin-sidebar-active.nav-open .backdrop {
        display: block;
    }

    .admin-dashboard-page,
    .my-fixed-width {
        width: 100%;
        max-width: 100%;
        padding-right: 16px !important;
        padding-left: 16px !important;
    }

    .dashboard-title {
        transform: none !important;
        font-size: 2rem !important;
        text-align: left;
    }

    .dashboard-heading,
    .panel-heading,
    .dashboard-header {
        flex-direction: column;
        align-items: stretch !important;
    }

    .dashboard-metrics,
    .dashboard-content-grid {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 768px) {
    body {
        font-size: 15px;
    }

    .container,
    .container-fluid {
        padding-right: 16px !important;
        padding-left: 16px !important;
    }

    h1,
    .h1 {
        font-size: 2rem !important;
        line-height: 1.15;
    }

    h2,
    .h2 {
        font-size: 1.75rem !important;
        line-height: 1.2;
    }

    h3,
    .h3 {
        font-size: 1.35rem !important;
        line-height: 1.25;
    }

    .row {
        min-width: 0;
    }

    [class*="col-"] {
        min-width: 0;
    }

    .form-row {
        margin-right: 0;
        margin-left: 0;
    }

    input,
    select,
    textarea,
    .form-control,
    .form-select {
        max-width: 100%;
    }

    .form-inline,
    .btn-toolbar,
    .btn-group,
    .actions,
    .page-compact,
    .pagination {
        flex-wrap: wrap;
        gap: 8px;
    }

    .form-inline .form-control,
    .form-inline .btn,
    .btn-group .btn {
        flex: 1 1 auto;
    }

    .btn,
    button,
    input[type="submit"],
    input[type="button"] {
        max-width: 100%;
        white-space: normal;
    }

    .modal-dialog {
        max-width: calc(100% - 24px);
        margin: 12px auto;
    }

    main.main table {
        display: block;
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
    }

    main.main table th,
    main.main table td {
        vertical-align: top;
    }

    .orders .orders-scale-wrap {
        width: 100% !important;
        overflow-x: auto !important;
        --z: 1 !important;
    }

    .orders .orders-scale-wrap .orders-tablebox {
        min-width: 760px;
        transform: none !important;
    }

    .orders-tablebox {
        min-height: 0 !important;
        overflow: visible !important;
    }

    .orders .orders-search .form-inline input.form-control {
        min-width: 0 !important;
        width: 100%;
    }

    .contact-us .row,
    .fun-facts .row {
        row-gap: 28px;
    }

    .contact-us-content {
        padding: 30px 20px !important;
    }

    .map-wrapper,
    .fun-facts {
        padding-top: 84px !important;
    }

    .award-item,
    .award-item.flex-row-reverse {
        flex-direction: column !important;
        gap: 18px;
    }

    .award-item img,
    .award-image,
    .award-content {
        width: 100% !important;
        max-width: 100% !important;
    }

    .chart-container {
        max-width: 100% !important;
        overflow-x: auto;
    }
}

@media (max-width: 575px) {
    .container,
    .container-fluid {
        padding-right: 14px !important;
        padding-left: 14px !important;
    }

    .section {
        margin-top: 48px;
    }

    footer {
        margin-top: 72px !important;
        border-radius: 44px 44px 0 0 !important;
    }

    .footer-bottom {
        line-height: 1.5;
    }

    .dashboard-primary-action,
    .award-primary-button,
    .btn-view-report {
        width: 100%;
        justify-content: center;
    }

    .metric-card,
    .dashboard-panel,
    .dash-card,
    .section-box {
        padding: 18px !important;
    }
}