@import url('https://fonts.cdnfonts.com/css/glacial-indifference');

html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Glacial Indifference', 'Segoe UI', Arial, sans-serif;
    font-weight: 400;
}

h1,
h2,
h3,
h4,
h5,
h6,
.font-glacial {
    font-family: 'Glacial Indifference', 'Segoe UI', Arial, sans-serif;
    font-weight: 700;
}

.font-poppins {
    font-family: 'Glacial Indifference', 'Segoe UI', Arial, sans-serif;
}

.card-title-clamp,
.card-desc-clamp {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.card-title-clamp {
    line-clamp: 2;
    -webkit-line-clamp: 2;
}

.card-desc-clamp {
    line-clamp: 3;
    -webkit-line-clamp: 3;
}

.weekly-desc-clamp {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    line-clamp: 3;
    -webkit-line-clamp: 3;
    overflow: hidden;
}

@media (max-width: 639px) {
    .weekly-desc-clamp {
        display: none;
    }
}

.hero-slide {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.hero-slide--1-cardapio {
    background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)),url('../assets/heroIMG1.jpg');
    background-position: 70% 30%;
}

.hero-slide--1 {
    background-image: url('../assets/heroIMG1.jpg');
    background-position: 70% 30%;
}

.hero-slide--2 {
    background-image: url('../assets/heroIMG2.jpg');
}

.hero-slide--3 {
    background-image: url('../assets/heroIMG3.jpg');
}

.hero-slide--4 {
    background-image: url('../assets/local4.jpg');
    background-size: cover;
    background-position: center;
}

/* Custom scrollbar for desktop (WebKit + Firefox) */
@media (min-width: 640px) {
    html::-webkit-scrollbar,
    body::-webkit-scrollbar,
    .overflow-auto::-webkit-scrollbar,
    .overflow-scroll::-webkit-scrollbar,
    .overflow-y-auto::-webkit-scrollbar,
    .overflow-x-auto::-webkit-scrollbar {
        width: 10px;
        height: 10px;
    }

    html::-webkit-scrollbar-track,
    body::-webkit-scrollbar-track,
    .overflow-auto::-webkit-scrollbar-track,
    .overflow-scroll::-webkit-scrollbar-track,
    .overflow-y-auto::-webkit-scrollbar-track,
    .overflow-x-auto::-webkit-scrollbar-track {
        background: transparent;
    }

    html::-webkit-scrollbar-thumb,
    body::-webkit-scrollbar-thumb,
    .overflow-auto::-webkit-scrollbar-thumb,
    .overflow-scroll::-webkit-scrollbar-thumb,
    .overflow-y-auto::-webkit-scrollbar-thumb,
    .overflow-x-auto::-webkit-scrollbar-thumb {
        background-color: rgba(249,178,51,0.16);
        border-radius: 9999px;
        border: 2px solid transparent;
        background-clip: padding-box;
    }

    html::-webkit-scrollbar-thumb:hover,
    body::-webkit-scrollbar-thumb:hover,
    .overflow-auto::-webkit-scrollbar-thumb:hover,
    .overflow-scroll::-webkit-scrollbar-thumb:hover,
    .overflow-y-auto::-webkit-scrollbar-thumb:hover,
    .overflow-x-auto::-webkit-scrollbar-thumb:hover {
        background-color: rgba(249,178,51,0.28);
    }

    /* Firefox */
    html,
    body,
    .overflow-auto,
    .overflow-scroll,
    .overflow-y-auto,
    .overflow-x-auto {
        scrollbar-width: thin;
        scrollbar-color: rgba(249,178,51,0.24) transparent;
    }
}

/* Modal-specific scrollbar (desktop) */
@media (min-width: 640px) {
    #product-modal .modal-content::-webkit-scrollbar {
        width: 8px;
    }

    #product-modal .modal-content::-webkit-scrollbar-track {
        background: rgba(11,8,40,0.35);
        border-radius: 9999px;
    }

    #product-modal .modal-content::-webkit-scrollbar-thumb {
        background: linear-gradient(180deg, rgba(249,178,51,0.9), rgba(249,178,51,0.7));
        border-radius: 9999px;
        border: 2px solid rgba(11,8,40,0.35);
    }

    #product-modal .modal-content::-webkit-scrollbar-thumb:hover {
        filter: brightness(1.05);
    }

    /* Firefox */
    #product-modal .modal-content {
        scrollbar-width: thin;
        scrollbar-color: rgba(249,178,51,0.9) rgba(11,8,40,0.35);
    }
}