/* Responsive safeguards shared by every GreatFood layout. */
html,
body {
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
}

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

img,
video {
    height: auto;
}

main,
section,
.container,
.container-fluid,
.row,
[class*="grid"],
[class*="wrap"] {
    min-width: 0;
}

input,
select,
textarea,
button {
    max-width: 100%;
}

.table-responsive,
.overflow-x-auto {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
}

.modal-dialog {
    max-width: calc(100vw - 2rem);
}

.leaflet-container,
#map {
    max-width: 100%;
}

.admin-shell,
.admin-content {
    min-width: 0;
}

@media (max-width: 1199.98px) {
    .container {
        max-width: 100%;
        padding-right: 20px;
        padding-left: 20px;
    }

    .menu-container {
        width: 100% !important;
        margin-right: 0 !important;
        margin-left: 0 !important;
        padding: 0 20px;
    }

    .slider {
        flex: 1 1 0;
        width: auto !important;
        max-width: 100% !important;
        min-width: 0;
        height: clamp(360px, 55vw, 600px) !important;
    }

    .th-header .header-button.d-flex.d-lg-none {
        display: flex !important;
    }

    .menu-img-1-1 img,
    .img-box1 img {
        max-width: 100% !important;
        height: auto !important;
        margin-right: 0 !important;
        margin-left: 0 !important;
        object-fit: cover;
    }
}

@media (max-width: 991.98px) {
    .menu-container {
        flex-direction: column;
        gap: 14px !important;
    }

    .specialites-list,
    .slider {
        width: 100% !important;
    }

    .specialites-list ul,
    .specialites-ul {
        display: flex;
        gap: 10px;
        margin: 0;
        padding: 3px 0 10px;
        overflow-x: auto;
        scroll-snap-type: x proximity;
    }

    .specialites-list li,
    .specialites-ul li {
        flex: 0 0 min(230px, 76vw);
        scroll-snap-align: start;
    }

    .slider {
        height: clamp(300px, 58vw, 470px) !important;
    }

    .slide-content {
        width: min(90%, 620px) !important;
        padding: 18px !important;
    }

    .slide-content h2 {
        font-size: clamp(28px, 6vw, 48px) !important;
    }

    .space-top {
        padding-top: 55px !important;
    }

    .space-bottom {
        padding-bottom: 55px !important;
    }

    .title-area {
        margin-bottom: 28px !important;
    }

    .sec-title {
        font-size: clamp(30px, 6vw, 46px) !important;
        line-height: 1.12 !important;
    }

    .menu-img-1-1 {
        margin: 0 auto 20px !important;
        text-align: center;
    }

    .menu-img-1-1 img {
        max-height: 430px;
    }

    .admin-global-header {
        height: 72px !important;
        padding: 8px 14px !important;
    }

    .admin-global-header img {
        width: auto !important;
        height: 54px !important;
    }

    .admin-global-header h4 {
        max-width: 52vw;
        overflow: hidden;
        font-size: 16px !important;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .admin-topbar {
        padding: 12px !important;
    }

    .admin-main {
        padding: 14px !important;
    }
}

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

    .row {
        --bs-gutter-x: 1rem;
    }

    .slider {
        height: 310px !important;
        border-radius: 12px !important;
    }

    .slide {
        background-position: center !important;
    }

    .slide-content h2 {
        font-size: 28px !important;
    }

    .slide-content p {
        font-size: 14px !important;
        line-height: 1.45 !important;
    }

    .slider-btn,
    .prev,
    .next {
        transform: scale(.78);
    }

    .plat-card {
        width: min(78vw, 260px) !important;
    }

    .plats-slider-track {
        gap: 12px !important;
    }

    .menu-grid {
        grid-template-columns: 1fr !important;
    }

    .menu-card,
    .offer-card,
    .subscription-card,
    .gift-card {
        width: 100% !important;
        max-width: 100% !important;
    }

    .nav-tabs {
        flex-wrap: nowrap !important;
        overflow-x: auto;
        white-space: nowrap;
    }

    .nav-tabs .nav-item,
    .nav-tabs .nav-link {
        flex: 0 0 auto;
    }

    .modal-dialog {
        width: auto !important;
        margin: .75rem;
    }

    .modal-content {
        max-height: calc(100vh - 1.5rem);
        overflow-y: auto;
    }

    #map,
    .leaflet-container {
        height: 300px !important;
    }

    .admin-global-header {
        height: 62px !important;
        padding: 6px 10px !important;
    }

    .admin-global-header img {
        height: 46px !important;
    }

    .admin-global-header h4 {
        max-width: 48vw;
        font-size: 13px !important;
    }

    .admin-global-actions {
        border-radius: 10px;
    }

    #sidebarMenu {
        width: min(82vw, 288px) !important;
        overflow-y: auto;
    }

    .admin-topbar > div {
        width: 100%;
    }

    .admin-topbar h2 {
        font-size: 16px !important;
    }

    .admin-main {
        min-height: calc(100vh - 124px);
        padding: 10px !important;
    }

    .admin-main h1,
    .admin-main h2 {
        overflow-wrap: anywhere;
    }

    .admin-main table {
        font-size: 12px;
    }

    .admin-main th,
    .admin-main td {
        padding: 9px 10px !important;
        white-space: nowrap;
    }

    .form-container,
    .login-wrapper,
    .register-wrapper {
        width: 100% !important;
        max-width: 100% !important;
        padding-right: 18px !important;
        padding-left: 18px !important;
    }

    footer .row > div {
        margin-bottom: 22px;
        text-align: center;
    }
}

@media (max-width: 479.98px) {
    .container,
    .container-fluid {
        padding-right: 10px;
        padding-left: 10px;
    }

    .slider {
        height: 270px !important;
    }

    .sec-title {
        font-size: 28px !important;
    }

    .gift-shop-hero,
    .gift-purchase,
    .gift-card-body,
    .gift-card-top {
        border-radius: 10px !important;
    }

    .admin-main {
        padding: 8px !important;
    }
}