/* ==========================================
   Restaurant Theme Builder
   Main Stylesheet
========================================== */


/* ==========================
   RESET
========================== */

*{

    margin:0;
    padding:0;
    box-sizing:border-box;

}



:root{

    --primary:#1e8e5a;

    --secondary:#ffffff;

    --background:#f5f5f5;

    --text:#222222;

    --button:#1e8e5a;


    /* compatibility variables */
    --dark:#222222;

    --light:#f5f5f5;


    --border:#e5e5e5;

    --radius:12px;

    --transition:.3s;

    --shadow:0 10px 25px rgba(0,0,0,.08);

}


body{

    font-family:Arial, Helvetica, sans-serif;

    background:var(--background);

    color:var(--text);

}





/* ==========================
   HEADER
========================== */

.header{

    width:100%;
    height:80px;

    background:var(--secondary);

    display:flex;
    align-items:center;
    justify-content:space-between;

    padding:0 50px;

    position:sticky;
    top:0;

    z-index:999;

    box-shadow:var(--shadow);

}


/* LOGO */

.logo{

    font-size:28px;
    font-weight:bold;

    color:var(--primary);

    white-space:nowrap;

    flex-shrink:0;

}



/* NAVIGATION */

.navigation{

    flex:1;

    display:flex;

    justify-content:center;

    align-items:center;

    gap:35px;

}



.navigation a{

    text-decoration:none;

    color:var(--text);

    font-weight:600;

    transition:var(--transition);

}



.navigation a:hover{

    color:var(--primary);

}




/* RIGHT SIDE */

.header-right{

    display:flex;

    align-items:center;

    gap:15px;

    flex-shrink:0;

}




.header-right button{

    cursor:pointer;

    border:none;

    transition:var(--transition);

}



/* SEARCH */

.search-btn{

    width:45px;

    height:45px;

    border-radius:50%;

    background:#f1f1f1;

    font-size:18px;

}



.search-btn:hover{

    background:var(--primary);

    color:#fff;

}



/* CART */

.cart-btn{

    position:relative;

    width:45px;

    height:45px;

    border-radius:50%;

    background:#f1f1f1;

    font-size:18px;

}



.cart-btn:hover{

    background:var(--primary);

    color:#fff;

}



.cart-count{

    position:absolute;

    top:-5px;

    right:-5px;

    width:20px;

    height:20px;

    border-radius:50%;

    background:red;

    color:white;

    font-size:11px;

    display:flex;

    align-items:center;

    justify-content:center;

}



/* LOGIN */

.login-btn{

    background:var(--primary);

    color:white;

    padding:12px 24px;

    border-radius:50px;

    font-weight:bold;

}


.login-btn:hover{

    transform:translateY(-2px);

    box-shadow:var(--shadow);

}





/*==========================================
 HERO SECTION
==========================================*/


.hero{

    width:100%;

    min-height:650px;

    display:flex;

    align-items:center;

    justify-content:space-between;

    padding:80px;

    background:#fff;

}



.hero-left{

    width:50%;

}



.hero-tag{

    display:inline-block;

    background:#e8f7ef;

    color:var(--primary);

    padding:10px 20px;

    border-radius:50px;

    font-weight:bold;

    margin-bottom:20px;

}



.hero-left h1{

    font-size:60px;

    line-height:1.2;

    margin-bottom:20px;

}



.hero-left p{

    font-size:18px;

    color:#666;

    line-height:1.8;

    margin-bottom:35px;

    max-width:550px;

}




.hero-buttons{

    display:flex;

    gap:20px;

}



.primary-btn{

    background:var(--primary);

    color:#fff;

    border:none;

    padding:16px 36px;

    border-radius:50px;

    font-size:16px;

    cursor:pointer;

    transition:.3s;

}



.primary-btn:hover{

    transform:translateY(-3px);

    box-shadow:var(--shadow);

}




.secondary-btn{

    background:#fff;

    color:var(--dark);

    border:2px solid var(--primary);

    padding:16px 36px;

    border-radius:50px;

    font-size:16px;

    cursor:pointer;

    transition:.3s;

}



.secondary-btn:hover{

    background:var(--primary);

    color:#fff;

}




.hero-right{

    width:45%;

    display:flex;

    justify-content:center;

}



.hero-right img{

    width:100%;

    max-width:520px;

    border-radius:25px;

    box-shadow:var(--shadow);

}
/*==========================================
 FEATURED ITEMS
==========================================*/


.featured{

    padding:80px;

    background:#f8f8f8;

}



.section-title{

    text-align:center;

    margin-bottom:50px;

}



.section-title span{

    color:var(--primary);

    font-weight:bold;

    text-transform:uppercase;

    letter-spacing:2px;

}



.section-title h2{

    font-size:42px;

    margin:15px 0;

}



.section-title p{

    color:#777;

    font-size:18px;

}




.featured-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:30px;

}




.product-card{

    background:#fff;

    border-radius:20px;

    overflow:hidden;

    box-shadow:var(--shadow);

    transition:.35s;

}



.product-card:hover{

    transform:translateY(-10px);

}



.product-card img{

    width:100%;

    height:230px;

    object-fit:cover;

}



.product-card h3{

    padding:20px 20px 10px;

    font-size:22px;

}



.rating{

    padding:0 20px;

    color:#ffb400;

}



.price-row{

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:20px;

}



.price{

    font-size:24px;

    font-weight:bold;

    color:var(--primary);

}



.add-cart{

    background:var(--primary);

    color:#fff;

    border:none;

    padding:10px 20px;

    border-radius:50px;

    cursor:pointer;

}





/*==========================================
 CATEGORY ICONS
==========================================*/


.category-icons{

    padding:80px;

    background:#fff;

}



.category-icons-grid{

    display:grid;

    grid-template-columns:repeat(6,1fr);

    gap:25px;

    margin-top:50px;

}



.category-icon-card{

    background:#fff;

    border-radius:18px;

    padding:25px;

    text-align:center;

    box-shadow:var(--shadow);

    transition:var(--transition);

    cursor:pointer;

}



.category-icon-card:hover{

    transform:translateY(-8px);

    background:var(--primary);

    color:#fff;

}



.category-icon-card img{

    width:70px;

    height:70px;

    object-fit:contain;

    margin-bottom:15px;

}



.category-icon-card h4{

    font-size:18px;

}





/*==========================================
 MENU SECTION
==========================================*/


.menu-section{

    padding:80px;

    background:#f7f7f7;

}




.menu-tabs{

    display:flex;

    justify-content:center;

    align-items:center;

    gap:15px;

    margin:50px 0;

    flex-wrap:wrap;

}



.menu-tab{

    background:#fff;

    border:2px solid var(--border);

    padding:12px 28px;

    border-radius:50px;

    cursor:pointer;

    font-weight:600;

}



.menu-tab.active{

    background:var(--primary);

    color:#fff;

    border-color:var(--primary);

}




.view-switch{

    width:50px;

    height:50px;

    border:none;

    border-radius:50%;

    background:var(--primary);

    color:#fff;

    font-size:28px;

}




.menu-products{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:30px;

}



.menu-card{

    background:#fff;

    border-radius:20px;

    overflow:hidden;

    box-shadow:var(--shadow);

}



.menu-card img{

    width:100%;

    height:220px;

    object-fit:cover;

}



.menu-card h3{

    padding:20px 20px 10px;

}



.menu-card p{

    padding:0 20px;

    color:#777;

}



.menu-bottom{

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:20px;

}



.menu-bottom span{

    color:var(--primary);

    font-size:24px;

    font-weight:bold;

}



.menu-bottom button{

    background:var(--primary);

    color:#fff;

    border:none;

    padding:10px 22px;

    border-radius:40px;

}






/*==========================================
 DEALS SECTION
==========================================*/


.deals-section{

    padding:80px;

    background:#fff;

}



.deals-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:35px;

}



.deal-card{

    position:relative;

    background:#fff;

    border-radius:20px;

    overflow:hidden;

    box-shadow:var(--shadow);

    text-align:center;

}



.deal-card img{

    width:100%;

    height:150px;

    object-fit:contain;

}



.deal-badge{

    position:absolute;

    top:20px;

    left:20px;

    background:#ff3b30;

    color:#fff;

    padding:8px 16px;

    border-radius:30px;

    font-weight:bold;

}



.deal-card h3{

    margin-top:14px;

    font-size:16px;

}



.deal-card p{

    color:#666;

    margin:12px;

}



.deal-bottom{

    display:flex;

    justify-content:center;

    gap:15px;

}



.old-price{

    color:#999;

    text-decoration:line-through;

}



.new-price{

    color:var(--primary);

    font-size:17px;

    font-weight:bold;

}



.deal-btn{

    margin:14px;

    background:var(--primary);

    color:#fff;

    border:none;

    padding:9px 20px;

    border-radius:30px;

    cursor:pointer;

}
/*==========================================
 SERVICES / WHY CHOOSE US
==========================================*/


.services-section{

    padding:80px;

    background:#f7f7f7;

}



.services-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:30px;

    margin-top:50px;

}



.service-card{

    background:#ffffff;

    border-radius:20px;

    padding:35px 25px;

    text-align:center;

    box-shadow:var(--shadow);

    transition:var(--transition);

}



.service-card:hover{

    transform:translateY(-10px);

}



.service-icon{

    width:80px;

    height:80px;

    margin:0 auto 20px;

    background:#e8f7ef;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:40px;

}



.service-card h3{

    font-size:24px;

    margin-bottom:15px;

}



.service-card p{

    color:#777;

    line-height:1.7;

}






/*==========================================
 FOOTER
==========================================*/


.footer{

    background:#222;

    color:#fff;

    padding:70px 80px 20px;

}



.footer-container{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:40px;

}



.footer-column h3{

    font-size:28px;

    margin-bottom:20px;

}



.footer-column h4{

    font-size:20px;

    margin-bottom:20px;

}



.footer-column p{

    color:#ccc;

    line-height:1.8;

    margin-bottom:10px;

}



.footer-column a{

    display:block;

    color:#ccc;

    text-decoration:none;

    margin-bottom:12px;

    transition:.3s;

}



.footer-column a:hover{

    color:var(--primary);

}



.social-links a{

    display:inline-block;

    margin-right:15px;

}



.footer-bottom{

    border-top:1px solid rgba(255,255,255,.15);

    margin-top:40px;

    padding-top:20px;

    text-align:center;

}



.footer-bottom p{

    color:#aaa;

}






/*==========================================
 RESPONSIVE DESIGN
==========================================*/


@media(max-width:1200px){


    .featured-grid,
    .menu-products{

        grid-template-columns:repeat(3,1fr);

    }



    .category-icons-grid{

        grid-template-columns:repeat(4,1fr);

    }



    .services-grid{

        grid-template-columns:repeat(2,1fr);

    }


}





@media(max-width:992px){


    .header{

        padding:0 25px;

    }



    .navigation{

        display:none;

    }



    .hero{

        flex-direction:column;

        padding:50px 30px;

        text-align:center;

    }



    .hero-left,
    .hero-right{

        width:100%;

    }



    .hero-left h1{

        font-size:42px;

    }



    .featured,
    .category-icons,
    .menu-section,
    .deals-section,
    .services-section{

        padding:50px 30px;

    }



    .deals-grid{

        grid-template-columns:1fr;

    }



    .footer{

        padding:50px 30px 20px;

    }



    .footer-container{

        grid-template-columns:repeat(2,1fr);

    }


}





@media(max-width:600px){


    .featured-grid,
    .menu-products,
    .category-icons-grid,
    .services-grid,
    .footer-container{

        grid-template-columns:1fr;

    }



    .hero-left h1{

        font-size:34px;

    }



    .hero-buttons{

        flex-direction:column;

    }



    .section-title h2{

        font-size:32px;

    }



}

html{
    scroll-behavior:smooth;
}


.primary-btn,
.secondary-btn{
    text-decoration:none;
    display:inline-block;
}

/*==========================================
 CART DRAWER
==========================================*/


.cart-overlay{

    position:fixed;

    top:0;

    left:0;

    width:100%;

    height:100%;

    background:rgba(0,0,0,.45);

    opacity:0;

    visibility:hidden;

    transition:.3s;

    z-index:9998;

}



.cart-overlay.active{

    opacity:1;

    visibility:visible;

}






.cart-drawer{

    position:fixed;

    top:0;

    right:-420px;

    width:400px;

    height:100vh;

    background:#fff;

    z-index:9999;

    box-shadow:-10px 0 30px rgba(0,0,0,.15);

    transition:.35s ease;

    display:flex;

    flex-direction:column;

}




.cart-drawer.active{

    right:0;

}







/* Cart Header */


.cart-header{

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:25px;

    border-bottom:1px solid var(--border);

}



.cart-header h2{

    font-size:26px;

}



.close-cart{

    width:40px;

    height:40px;

    border:none;

    border-radius:50%;

    background:#f2f2f2;

    cursor:pointer;

    font-size:18px;

}



.close-cart:hover{

    background:var(--primary);

    color:#fff;

}







/* Cart Items Area */


.cart-items{

    flex:1;

    overflow-y:auto;

    padding:20px;

}





.cart-item{

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:15px 0;

    border-bottom:1px solid var(--border);

}





.cart-item h4{

    font-size:16px;

    margin-bottom:5px;

}



.cart-item p{

    color:var(--primary);

    font-weight:bold;

}





.remove-item{

    border:none;

    background:#ff3b30;

    color:#fff;

    padding:6px 12px;

    border-radius:20px;

    cursor:pointer;

}





/* Cart Footer */


.cart-footer{

    padding:25px;

    border-top:1px solid var(--border);

}





.cart-total{

    display:flex;

    justify-content:space-between;

    font-size:20px;

    font-weight:bold;

    margin-bottom:20px;

}





.cart-total-price{

    color:var(--primary);

}





.checkout-btn{

    width:100%;

    padding:15px;

    background:var(--primary);

    color:#fff;

    border:none;

    border-radius:40px;

    font-size:18px;

    cursor:pointer;

    transition:.3s;

}





.checkout-btn:hover{

    background:#111;

}







/* Mobile */


@media(max-width:600px){


    .cart-drawer{

        width:100%;

    }


}

.quantity-box{

    display:flex;

    align-items:center;

    gap:12px;

    margin-top:10px;

}



.quantity-box button{

    width:28px;

    height:28px;

    border:none;

    border-radius:50%;

    background:var(--primary);

    color:white;

    cursor:pointer;

}



.quantity-box span{

    font-weight:bold;

}

/*==========================================
 CHECKOUT PAGE
==========================================*/


.checkout-section{

    padding:80px;

    background:#f7f7f7;

    min-height:100vh;

}



.checkout-container{

    max-width:1200px;

    margin:auto;

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:40px;

}





.checkout-form,
.order-summary{

    background:#fff;

    padding:40px;

    border-radius:20px;

    box-shadow:var(--shadow);

}



.checkout-form h2,
.order-summary h2{

    margin-bottom:30px;

    font-size:28px;

}





.checkout-form label{

    display:block;

    margin-bottom:8px;

    font-weight:bold;

}



.checkout-form input,
.checkout-form textarea,
.checkout-form select{


    width:100%;

    padding:15px;

    margin-bottom:20px;

    border:1px solid var(--border);

    border-radius:10px;

    font-size:16px;


}



.checkout-form textarea{

    height:120px;

    resize:none;

}





#checkout-items p{

    padding:15px 0;

    border-bottom:1px solid var(--border);

    color:#555;

}





.checkout-total{

    display:flex;

    justify-content:space-between;

    font-size:22px;

    font-weight:bold;

    margin-top:30px;

}



#checkout-total-price{

    color:var(--primary);

}




.place-order-btn{


    width:100%;

    margin-top:30px;

    padding:16px;

    background:var(--primary);

    color:#fff;

    border:none;

    border-radius:50px;

    font-size:18px;

    cursor:pointer;


}



.place-order-btn:hover{

    background:#111;

}







/* MOBILE CHECKOUT */


@media(max-width:900px){


.checkout-container{

    grid-template-columns:1fr;

}



.checkout-section{

    padding:40px 20px;

}


}

/*==========================================
 ADMIN LOGIN
==========================================*/


.admin-login{

    min-height:100vh;

    display:flex;

    justify-content:center;

    align-items:center;

    background:#f7f7f7;

}



.login-box{

    width:400px;

    background:#fff;

    padding:40px;

    border-radius:20px;

    box-shadow:var(--shadow);

    text-align:center;

}



.login-box h2{

    margin-bottom:15px;

}



.login-box p{

    color:#777;

    margin-bottom:25px;

}



.login-box input{

    width:100%;

    padding:15px;

    margin-bottom:15px;

    border:1px solid var(--border);

    border-radius:10px;

}



.login-box button{

    width:100%;

    padding:15px;

    border:none;

    border-radius:40px;

    background:var(--primary);

    color:#fff;

    font-size:18px;

    cursor:pointer;

}

/*==========================================
 ADMIN DASHBOARD
==========================================*/


.admin-dashboard{

    display:flex;

    min-height:100vh;

    background:#f7f7f7;

}



.admin-sidebar{

    width:260px;

    background:#222;

    color:#fff;

    padding:30px;

}



.admin-sidebar h2{

    margin-bottom:40px;

}



.admin-sidebar ul{

    list-style:none;

}



.admin-sidebar li{

    padding:15px 0;

    cursor:pointer;

    color:#ddd;

}



.admin-sidebar li:hover{

    color:#fff;

}





.admin-content{

    flex:1;

    padding:40px;

}



.admin-content h1{

    font-size:36px;

    margin-bottom:10px;

}



.admin-content p{

    color:#777;

    margin-bottom:40px;

}




.dashboard-cards{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:25px;

}




.dashboard-card{

    background:#fff;

    padding:30px;

    border-radius:20px;

    box-shadow:var(--shadow);

}



.dashboard-card h3{

    margin-bottom:20px;

}



.dashboard-card span{

    font-size:35px;

    color:var(--primary);

    font-weight:bold;

}





@media(max-width:900px){


.admin-dashboard{

    flex-direction:column;

}



.admin-sidebar{

    width:100%;

}



.dashboard-cards{

    grid-template-columns:1fr;

}


}
/*==========================================
 THEME SETTINGS
==========================================*/


.theme-settings-page{

    padding:50px;

    background:#f7f7f7;

    min-height:100vh;

}



.settings-box{

    background:#fff;

    max-width:500px;

    padding:35px;

    border-radius:20px;

    box-shadow:var(--shadow);

}



.settings-box label{

    display:block;

    padding:15px;

    font-size:18px;

    border-bottom:1px solid var(--border);

}



.settings-box input{

    margin-right:15px;

}



.settings-box button{

    margin-top:25px;

    width:100%;

    padding:15px;

    border:none;

    border-radius:40px;

    background:var(--primary);

    color:#fff;

    font-size:18px;

}

/*==================================================
  THEME 06 PREMIUM UI V2
==================================================*/

:root{

    --container:1400px;

    --section-padding:90px;

    --card-radius:22px;

    --hover-lift:-12px;

    --shadow-sm:0 8px 20px rgba(0,0,0,.06);

    --shadow-md:0 18px 45px rgba(0,0,0,.10);

    --shadow-lg:0 25px 60px rgba(0,0,0,.14);

    --transition-fast:.25s;

    --transition-normal:.35s;

}

/*--------------------------------*/

html{

    scroll-behavior:smooth;

}

/*--------------------------------*/

body{

    background:#fafafa;

    overflow-x:hidden;

}

/*--------------------------------*/

section{

    position:relative;

    padding:var(--section-padding) 0;

}

/*--------------------------------*/

.hero,
.featured,
.category-icons,
.menu-section,
.deals-section,
.services-section,
.footer{

    padding-left:40px;

    padding-right:40px;

}

/*--------------------------------*/

.hero>*,
.featured>*,
.category-icons>*,
.menu-section>*,
.deals-section>*,
.services-section>*,
.footer>*{

    max-width:var(--container);

    margin:auto;

}

/*==================================
HEADER
==================================*/

.header{

    height:90px;

    backdrop-filter:blur(18px);

    background:rgba(255,255,255,.95);

    border-bottom:1px solid rgba(0,0,0,.05);

    box-shadow:0 6px 30px rgba(0,0,0,.05);

    transition:.35s;

}

.header:hover{

    box-shadow:0 12px 35px rgba(0,0,0,.08);

}

/*--------------------------------*/

.navigation{

    gap:42px;

}

/*--------------------------------*/

.navigation a{

    position:relative;

    font-size:15px;

    letter-spacing:.3px;

}

/*--------------------------------*/

.navigation a::after{

    content:"";

    position:absolute;

    left:0;

    bottom:-8px;

    width:0;

    height:2px;

    background:var(--primary);

    transition:.3s;

}

.navigation a:hover::after{

    width:100%;

}

/*==================================
SECTION TITLES
==================================*/

.section-title{

    max-width:760px;

    margin:0 auto 70px;

}

.section-title span{

    display:inline-block;

    margin-bottom:18px;

    font-size:13px;

    letter-spacing:3px;

}

.section-title h2{

    font-size:48px;

    line-height:1.15;

    margin-bottom:20px;

}

.section-title p{

    font-size:18px;

    line-height:1.8;

}

/*==================================
HERO
==================================*/

.hero{

    min-height:760px;

    gap:70px;

}

.hero-left{

    display:flex;

    flex-direction:column;

    justify-content:center;

}

.hero-left h1{

    font-size:72px;

    line-height:1.1;

    margin-bottom:28px;

}

.hero-left p{

    max-width:620px;

    font-size:20px;

    line-height:1.9;

}

.hero-buttons{

    margin-top:18px;

}

.primary-btn,
.secondary-btn{

    min-width:180px;

    text-align:center;

    font-weight:700;

}

.primary-btn{

    box-shadow:var(--shadow-md);

}

.primary-btn:hover{

    transform:translateY(-5px);

}

.secondary-btn:hover{

    transform:translateY(-5px);

}

/*--------------------------------*/

.hero-right{

    align-items:center;

}

.hero-slider{

    width:100%;

}

.hero-slide img{

    width:100%;

    height:520px;

    object-fit:contain;

}

/*==================================
FEATURED
==================================*/

.fav-track{

    align-items:stretch;

}

.fav-card{

    background:transparent!important;

    box-shadow:none!important;

    border:none!important;

    padding:0!important;

}

.fav-card img{

    background:transparent!important;

    box-shadow:none!important;

    object-fit:contain!important;

    transition:.45s;

}

.fav-card:hover img{

    transform:translateY(-10px) scale(1.06);

}

/*==================================================
      PREMIUM MENU CARDS V2
==================================================*/

.menu-products{

    display:grid !important;

    grid-template-columns:repeat(auto-fit,minmax(290px,1fr));

    gap:34px;

    align-items:stretch;

}

/*--------------------------------*/

.fixed-menu-card,
.menu-card{

    position:relative;

    display:flex;

    flex-direction:column;

    justify-content:flex-start;

    height:100%;

    min-height:485px;

    background:#ffffff;

    border:none;

    border-radius:24px;

    overflow:hidden;

    box-shadow:0 18px 45px rgba(0,0,0,.08);

    transition:.35s;

}

.fixed-menu-card:hover,
.menu-card:hover{

    transform:translateY(-10px);

    box-shadow:0 28px 60px rgba(0,0,0,.12);

}

/*--------------------------------*/

.fixed-menu-card img,
.menu-card img{

    width:100%;

    height:240px;

    object-fit:contain !important;

    padding:25px;

    background:transparent !important;

}

/*--------------------------------*/

.fixed-menu-card h3,
.menu-card h3{

    font-size:22px;

    padding:8px 24px;

    min-height:62px;

}

/*--------------------------------*/

.fixed-menu-card p,
.menu-card p{

    color:#777;

    line-height:1.8;

    padding:0 24px;

    min-height:74px;

}

/*--------------------------------*/

.menu-bottom{

    margin-top:auto;

    padding:24px;

    display:flex;

    justify-content:space-between;

    align-items:center;

}

/*--------------------------------*/

.menu-bottom span{

    font-size:28px;

    font-weight:700;

}

/*--------------------------------*/

.menu-bottom button{

    padding:12px 26px;

    border-radius:40px;

    font-weight:700;

}

/*==================================================
      CATEGORY CARDS
==================================================*/

.category-icon-card{

    border:none;

    border-radius:22px;

    box-shadow:0 10px 35px rgba(0,0,0,.06);

    min-height:170px;

    display:flex;

    flex-direction:column;

    justify-content:center;

}

.category-icon-card:hover{

    transform:translateY(-8px);

}

.category-icon-card img{

    width:78px;

    height:78px;

    object-fit:contain;

}

/*==================================================
      FEATURED CARDS
==================================================*/

.fav-card{

    display:flex;

    justify-content:center;

    align-items:center;

}

.fav-card img{

    width:100%;

    height:180px;

    object-fit:contain !important;

    transition:.45s;

}

.fav-card:hover img{

    transform:scale(1.08) translateY(-8px);

}

/*==================================================
      DEAL CARDS
==================================================*/

.deals-grid{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(340px,1fr));

    gap:34px;

}

.deal-card{

    min-height:420px;

    border:none;

    border-radius:24px;

    overflow:hidden;

    box-shadow:0 18px 45px rgba(0,0,0,.08);

}

.deal-card img{

    height:220px;

    object-fit:contain !important;

    padding:22px;

    background:transparent;

}

.deal-card:hover{

    transform:translateY(-10px);

}

/*==================================================
      SERVICE CARDS
==================================================*/

.services-grid{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(280px,1fr));

    gap:34px;

}

.service-card{

    min-height:260px;

    border-radius:24px;

    border:none;

    box-shadow:0 18px 45px rgba(0,0,0,.07);

}

.service-card:hover{

    transform:translateY(-10px);

}

/*==================================================
      BUTTONS
==================================================*/

button,
.add-cart,
.deal-btn{

    transition:.35s;

}

button:hover,
.add-cart:hover,
.deal-btn:hover{

    transform:translateY(-3px);

}

/*==================================================
      IMAGE QUALITY
==================================================*/

img{

    image-rendering:auto;

    user-select:none;

}

/*==================================================
        THEME 06 PREMIUM V3
==================================================*/

/* ---------- Global Containers ---------- */

.hero,
.featured,
.category-icons,
.menu-section,
.deals-section,
.services-section,
.footer{

    max-width:100%;
    overflow:hidden;

}

.hero > *,
.featured > *,
.category-icons > *,
.menu-section > *,
.deals-section > *,
.services-section > *,
.footer > *{

    max-width:1450px;
    margin:auto;

}

/*==================================================
        PREMIUM CARD EFFECT
==================================================*/

.fixed-menu-card,
.menu-card,
.deal-card,
.service-card,
.category-icon-card{

    position:relative;
    isolation:isolate;

}

.fixed-menu-card::before,
.menu-card::before,
.deal-card::before,
.service-card::before,
.category-icon-card::before{

    content:"";

    position:absolute;

    inset:0;

    border-radius:inherit;

    padding:1px;

    background:
    linear-gradient(
        135deg,
        rgba(255,255,255,.8),
        rgba(255,255,255,.05)
    );

    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);

    -webkit-mask-composite:xor;

    mask-composite:exclude;

    opacity:.45;

    pointer-events:none;

}

/*==================================================
        PREMIUM IMAGE ANIMATION
==================================================*/

.fixed-menu-card img,
.menu-card img,
.deal-card img,
.fav-card img,
.category-icon-card img{

    transition:
        transform .45s,
        filter .45s;

}

.fixed-menu-card:hover img,
.menu-card:hover img,
.deal-card:hover img,
.fav-card:hover img,
.category-icon-card:hover img{

    transform:
        scale(1.08)
        translateY(-8px);

    filter:drop-shadow(0 16px 24px rgba(0,0,0,.18));

}

/*==================================================
        PREMIUM BUTTONS
==================================================*/

.primary-btn,
.secondary-btn,
.add-cart,
.deal-btn,
.menu-bottom button{

    position:relative;

    overflow:hidden;

}

.primary-btn::before,
.secondary-btn::before,
.add-cart::before,
.deal-btn::before,
.menu-bottom button::before{

    content:"";

    position:absolute;

    top:0;

    left:-120%;

    width:80%;

    height:100%;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,.45),
            transparent
        );

    transition:.6s;

}

.primary-btn:hover::before,
.secondary-btn:hover::before,
.add-cart:hover::before,
.deal-btn:hover::before,
.menu-bottom button:hover::before{

    left:140%;

}

/*==================================================
        MENU GRID
==================================================*/

.menu-products{

    row-gap:42px;

    column-gap:34px;

}

/*==================================================
        CATEGORY GRID
==================================================*/

.category-icons-grid{

    row-gap:30px;

}

/*==================================================
        DEALS GRID
==================================================*/

.deals-grid{

    align-items:stretch;

}

/*==================================================
        SERVICE GRID
==================================================*/

.services-grid{

    align-items:stretch;

}

/*==================================================
        SECTION DIVIDER
==================================================*/

.featured,
.category-icons,
.menu-section,
.deals-section,
.services-section{

    position:relative;

}

.featured::after,
.category-icons::after,
.menu-section::after,
.deals-section::after{

    content:"";

    position:absolute;

    left:50%;

    bottom:0;

    transform:translateX(-50%);

    width:180px;

    height:1px;

    background:
        linear-gradient(
            to right,
            transparent,
            rgba(0,0,0,.12),
            transparent
        );

}

/*==================================================
        FOOTER
==================================================*/

.footer{

    border-top-left-radius:40px;

    border-top-right-radius:40px;

    overflow:hidden;

}

/*==================================================
        SCROLLBAR
==================================================*/

::-webkit-scrollbar{

    width:10px;

}

::-webkit-scrollbar-thumb{

    background:var(--primary);

    border-radius:50px;

}

::-webkit-scrollbar-track{

    background:#ececec;

}

/*==================================================
        SMOOTH FADE
==================================================*/

section{

    animation:fadeInSection .8s ease;

}

@keyframes fadeInSection{

    from{

        opacity:0;

        transform:translateY(18px);

    }

    to{

        opacity:1;

        transform:none;

    }

}

/*=============================
 PREMIUM MENU CARD V3
==============================*/

.menu-image-area{

    height:240px;

    display:flex;

    align-items:center;

    justify-content:center;

    padding:24px;

}

.menu-image-area.with-bg{

    background:#f8f8f8;

}

.menu-image-area img{

    width:100%;

    height:100%;

    object-fit:contain;

}

.menu-content{

    padding:22px;

    display:flex;

    flex-direction:column;

    flex:1;

}

.menu-content h3{

    font-size:22px;

    margin-bottom:10px;

    line-height:1.3;

    min-height:58px;

}

.menu-description{

    color:#777;

    line-height:1.7;

    margin-bottom:18px;

    flex:1;

}

.menu-price-row{

    display:flex;

    align-items:center;

    gap:12px;

    margin-bottom:18px;

}

.menu-discount-badge{

    position:absolute;

    top:18px;

    right:18px;

    background:#e53935;

    color:#fff;

    padding:7px 14px;

    border-radius:30px;

    font-size:13px;

    font-weight:700;

    z-index:5;

}

.old-price{

    text-decoration:line-through;

    color:#999;

}

.new-price{

    font-size:26px;

    font-weight:700;

    color:var(--primary);

}

.menu-choose-btn{

    width:100%;

    padding:14px;

    border-radius:50px;

    font-weight:700;

}

/*===============================
PREMIUM HEADER
===============================*/

.premium-header{

position:sticky;

top:0;

z-index:9999;

backdrop-filter:blur(18px);

background:rgba(255,255,255,.92);

border-bottom:1px solid rgba(0,0,0,.06);

}

.premium-container{

max-width:1450px;

margin:auto;

padding:18px 30px;

display:flex;

align-items:center;

justify-content:space-between;

}

.premium-logo{

display:flex;

align-items:center;

text-decoration:none;

font-size:30px;

font-weight:700;

color:var(--primary);

}

.premium-logo img{

height:56px;

width:auto;

}

.premium-nav{

display:flex;

gap:38px;

}

.premium-nav a{

text-decoration:none;

font-weight:600;

color:#222;

transition:.3s;

}

.premium-nav a:hover{

color:var(--primary);

}

.premium-actions{

display:flex;

align-items:center;

gap:14px;

}

.premium-search-btn,
.premium-cart-btn{

width:46px;

height:46px;

border:none;

border-radius:50%;

background:#f5f5f5;

cursor:pointer;

transition:.3s;

}

.premium-search-btn:hover,
.premium-cart-btn:hover{

background:var(--primary);

color:#fff;

}

.premium-login-btn{

padding:13px 28px;

background:var(--primary);

color:#fff;

border-radius:50px;

text-decoration:none;

font-weight:700;

}
/* =========================================================
   THEME 06 PREMIUM COMPLETE FRONTEND REPLACEMENT
   Added by Codex. Keeps PHP hooks/IDs intact.
========================================================= */

:root {
    --rtb-container: 1440px;
    --rtb-section-y: 96px;
    --rtb-radius: 24px;
    --rtb-soft: #f7f8fb;
    --rtb-ink: #161616;
    --rtb-muted: #6f7580;
    --rtb-line: rgba(20, 20, 20, .08);
    --rtb-shadow: 0 22px 70px rgba(0, 0, 0, .10);
}

body {
    background:
        radial-gradient(circle at top left, color-mix(in srgb, var(--primary), transparent 88%), transparent 34rem),
        linear-gradient(180deg, #fff 0%, #fafafa 52%, #fff 100%);
    color: var(--text);
}

.header.rtb-premium-header {
    position: sticky;
    top: 0;
    z-index: 900;
    background: color-mix(in srgb, var(--header-bg), white 16%) !important;
    color: var(--header-text) !important;
    border-bottom: 1px solid rgba(255,255,255,.35);
    box-shadow: 0 14px 45px rgba(0,0,0,.08);
    backdrop-filter: blur(18px);
}

.rtb-header-shell {
    max-width: var(--rtb-container);
    min-height: 82px;
    margin: 0 auto;
    padding: 0 clamp(18px, 4vw, 46px);
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 30px;
}

.rtb-brand,
.rtb-brand * {
    color: inherit;
    text-decoration: none;
}

.rtb-nav {
    justify-content: center;
    gap: clamp(20px, 3vw, 40px);
}

.rtb-nav a {
    color: inherit !important;
    opacity: .92;
    font-weight: 700;
}

.rtb-header-tools {
    display: flex;
    align-items: center;
    gap: 14px;
}

.rtb-icon-btn,
.rtb-cart-btn {
    min-width: 48px;
    height: 48px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.45) !important;
    background: rgba(255,255,255,.22) !important;
    color: inherit !important;
    font-weight: 800;
}

.rtb-search .search-input-wrap {
    position: relative;
}

#freshSearchInput {
    width: min(260px, 26vw);
    height: 48px;
    border-radius: 999px;
    border: 1px solid rgba(0,0,0,.08);
    padding: 0 18px;
    box-shadow: 0 10px 30px rgba(0,0,0,.06);
}

#freshSearchResults {
    border-radius: 18px !important;
    box-shadow: var(--rtb-shadow) !important;
}

.rtb-hero {
    max-width: var(--rtb-container);
    margin: 0 auto;
    padding: clamp(80px, 8vw, 126px) clamp(18px, 4vw, 46px);
    min-height: min(820px, calc(100vh - 82px));
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(360px, .95fr);
    gap: clamp(36px, 7vw, 96px);
    align-items: center;
    overflow: visible;
}

.rtb-hero-copy {
    position: relative;
    z-index: 2;
}

.rtb-eyebrow {
    display: inline-flex;
    width: fit-content;
    margin-bottom: 18px;
    padding: 10px 16px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--primary), white 88%);
    color: var(--primary);
    font-size: 13px;
    font-weight: 900;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.rtb-hero h1 {
    max-width: 780px;
    margin: 0;
    color: var(--rtb-ink);
    font-size: clamp(44px, 6vw, 86px);
    line-height: 1.02;
    letter-spacing: 0;
}

.rtb-hero p {
    max-width: 650px;
    margin: 24px 0 0;
    color: var(--rtb-muted);
    font-size: clamp(16px, 1.5vw, 21px);
    line-height: 1.8;
}

.rtb-hero-actions {
    margin-top: 34px;
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
}

.rtb-hero-proof {
    margin-top: 38px;
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
}

.rtb-hero-proof div {
    min-width: 132px;
    padding: 15px 18px;
    border: 1px solid var(--rtb-line);
    border-radius: 18px;
    background: rgba(255,255,255,.75);
    box-shadow: 0 12px 32px rgba(0,0,0,.06);
}

.rtb-hero-proof strong {
    display: block;
    color: var(--primary);
    font-size: 24px;
}

.rtb-hero-proof span {
    display: block;
    color: var(--rtb-muted);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.rtb-hero-media {
    position: relative;
    min-height: 520px;
}

.rtb-hero-media::before {
    content: "";
    position: absolute;
    inset: 10% 2% 8% 10%;
    border-radius: 46px;
    background: color-mix(in srgb, var(--primary), white 82%);
    transform: rotate(-5deg);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.45), var(--rtb-shadow);
}

.rtb-hero-slider {
    position: relative;
    width: 100%;
    min-height: 520px;
    overflow: visible;
    border-radius: 0;
    background: transparent !important;
}

.rtb-hero-slider .hero-slide {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.rtb-hero-slider img {
    width: min(100%, 620px);
    height: 520px;
    object-fit: contain;
    filter: drop-shadow(0 34px 46px rgba(0,0,0,.20));
    animation: rtbFloat 5s ease-in-out infinite;
}

@keyframes rtbFloat {
    0%, 100% { transform: translateY(0) rotate(0deg); }
    50% { transform: translateY(-16px) rotate(1.5deg); }
}

.rtb-floating-viewport {
    overflow: hidden;
    padding: 34px 0 18px;
}

.rtb-floating-track {
    display: flex;
    gap: 26px;
}

.rtb-floating-card {
    flex: 0 0 calc((100% - (var(--fav-visible, 4) - 1) * 26px) / var(--fav-visible, 4));
    min-width: 210px;
    cursor: pointer;
    text-align: center;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 10px 18px !important;
}

.rtb-floating-img {
    height: 210px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.rtb-floating-card img {
    width: 100%;
    height: 100%;
    object-fit: contain !important;
    filter: drop-shadow(0 18px 26px rgba(0,0,0,.18));
}

.rtb-floating-card h3 {
    margin: 10px 0 3px;
    color: var(--rtb-ink);
    font-size: 18px;
    font-weight: 900;
}

.rtb-floating-card p {
    margin: 0;
    color: var(--primary);
    font-weight: 900;
}

/* Featured section compact/customizable height */
.rtb-featured {
    min-height: 0 !important;
    height: auto !important;
    max-height: var(--featured-h, none);
    overflow-y: auto;
    padding-top: clamp(44px, 5vw, 72px) !important;
    padding-bottom: clamp(34px, 4vw, 58px) !important;
}

.rtb-featured .section-title {
    margin-bottom: 22px !important;
}

.rtb-featured .rtb-floating-viewport {
    min-height: 0 !important;
    height: auto !important;
    padding: 8px 0 4px !important;
}

.rtb-featured .rtb-floating-track {
    min-height: calc(var(--featured-img-h, 170px) + 72px);
    align-items: flex-start;
    gap: 22px;
}

.rtb-featured .rtb-floating-card {
    flex-basis: calc((100% - (var(--fav-visible, 4) - 1) * 22px) / var(--fav-visible, 4)) !important;
    min-width: 170px;
    padding-bottom: 8px !important;
}

.rtb-featured .rtb-floating-img {
    height: var(--featured-img-h, 170px) !important;
}

.rtb-featured .rtb-floating-card h3 {
    font-size: 16px;
    line-height: 1.2;
    max-width: 170px;
    margin-left: auto;
    margin-right: auto;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rtb-featured .rtb-floating-card p {
    font-size: 15px;
}

.rtb-featured .fav-anim-stacked,
.rtb-featured .fav-anim-orbit {
    height: auto !important;
}

.rtb-featured .fav-anim-stacked .fav-card,
.rtb-featured .fav-anim-orbit .fav-card,
.rtb-featured .fav-anim-fade-cycle .fav-card {
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
}

.rtb-featured-standard .rtb-floating-img {
    height: calc(var(--featured-img-h, 170px) + 28px) !important;
}

.rtb-featured-large .rtb-floating-img {
    height: calc(var(--featured-img-h, 170px) + 56px) !important;
}

/* Full banner hero option */
.rtb-hero-banner {
    position: relative;
    min-height: var(--hero-h, 620px);
    max-width: 100%;
    padding: 0 !important;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.rtb-hero-banner .rtb-hero-banner-slider {
    position: absolute;
    inset: 0;
    min-height: var(--hero-h, 620px);
    width: 100%;
}

.rtb-hero-banner .hero-slide {
    position: absolute;
    inset: 0;
}

.rtb-hero-banner .hero-slide img {
    width: 100%;
    height: var(--hero-h, 620px);
    object-fit: cover;
    filter: none;
    animation: none;
}

.rtb-hero-banner .rtb-hero-copy,
.rtb-hero-banner-actions {
    position: relative;
    z-index: 2;
    max-width: 960px;
    margin: 0 auto;
    padding: 32px;
    text-align: center;
}

.rtb-hero-banner::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(0,0,0,.45), rgba(0,0,0,.08), rgba(0,0,0,.35));
    pointer-events: none;
}

.rtb-hero-banner .rtb-hero-copy h1,
.rtb-hero-banner .rtb-hero-copy p {
    color: #fff;
}

/* Category/favourite shared card shape controls */
.fav-shape-round,
.card-round {
    border-radius: 999px !important;
}

.fav-shape-cube,
.card-square {
    border-radius: 18px !important;
}

.fav-shape-vertical,
.card-vertical {
    aspect-ratio: 3 / 4;
}

.fav-shape-horizontal,
.card-horizontal {
    aspect-ratio: 16 / 9;
}

.fixed-menu-card.card-vertical,
.menu-card.card-vertical {
    aspect-ratio: 3 / 4;
}

.fixed-menu-card.card-horizontal,
.menu-card.card-horizontal {
    aspect-ratio: auto;
    min-height: 240px !important;
    display: grid !important;
    grid-template-columns: 42% 1fr;
}

.fixed-menu-card.card-horizontal .menu-image-area,
.menu-card.card-horizontal .menu-image-area {
    height: 100% !important;
    min-height: 220px;
}

.fixed-menu-card.card-horizontal .menu-content,
.menu-card.card-horizontal .menu-content {
    justify-content: center;
}

.fixed-menu-card.card-round,
.menu-card.card-round {
    border-radius: 34px !important;
}

.fav-bg-none,
.fav-bg-transparent,
.card-transparent {
    background: transparent !important;
    box-shadow: none !important;
    border-color: transparent !important;
}

.fav-bg-background,
.card-background {
    background: rgba(255,255,255,.86) !important;
}

.rtb-category-viewport {
    overflow: hidden;
    padding: 10px 0 24px;
}

.rtb-category-row {
    display: flex;
    gap: 18px;
    overflow-x: auto;
    scrollbar-width: none;
}

.rtb-category-row::-webkit-scrollbar {
    display: none;
}

.rtb-category-pill {
    flex: 0 0 calc((100% - (var(--cat-visible, 6) - 1) * 18px) / var(--cat-visible, 6));
    min-width: 150px;
    min-height: 154px;
    border: 1px solid var(--rtb-line);
    border-radius: 24px;
    background: rgba(255,255,255,.82);
    box-shadow: 0 18px 45px rgba(0,0,0,.07);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    cursor: pointer;
}

.rtb-category-section {
    min-height: 0 !important;
    max-height: var(--cat-section-h, none);
    overflow-y: auto;
    padding-top: clamp(44px, 5vw, 72px) !important;
    padding-bottom: clamp(34px, 4vw, 58px) !important;
}

.rtb-category-section .section-title {
    margin-bottom: 28px !important;
}

.rtb-category-art {
    width: var(--cat-img, 76px);
    height: var(--cat-img, 76px);
}

.rtb-category-art img {
    width: calc(var(--cat-img, 76px) - 18px);
    height: calc(var(--cat-img, 76px) - 18px);
}

.rtb-category-size-compact .rtb-category-pill {
    min-height: 126px;
}

.rtb-category-size-large .rtb-category-pill {
    min-height: 188px;
}

.rtb-category-art {
    width: 76px;
    height: 76px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--primary), white 88%);
    display: flex;
    align-items: center;
    justify-content: center;
}

.rtb-category-art img {
    width: 58px;
    height: 58px;
    object-fit: contain;
}

.rtb-category-art strong {
    color: var(--primary);
    font-size: 26px;
}

.rtb-category-name {
    max-width: 118px;
    color: var(--rtb-ink);
    font-weight: 900;
    font-size: 14px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.rtb-inline-category-panel {
    display: none;
    max-width: var(--rtb-container);
    margin: 24px auto 0;
}

.rtb-back-link,
.rtb-add-more {
    display: inline-flex;
    color: var(--primary);
    font-weight: 900;
    text-decoration: none;
    margin-bottom: 16px;
}

.rtb-open-category-popup {
    display: block;
    margin: 0 auto 24px;
}

.rtb-category-main-link {
    display: flex;
    justify-content: flex-end;
    margin: 8px 4px 34px;
}

.rtb-category-main-link a {
    color: var(--primary);
    font-size: 13px;
    font-weight: 900;
    text-decoration: none;
}

.rtb-category-popup {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 1300;
    align-items: center;
    justify-content: center;
    padding: 22px;
    background: rgba(0,0,0,.55);
    backdrop-filter: blur(10px);
}

.rtb-category-popup.is-open {
    display: flex;
}

.rtb-category-popup-box {
    width: min(100%, 520px);
    max-height: 80vh;
    overflow-y: auto;
    padding: 26px;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 28px 90px rgba(0,0,0,.25);
}

.rtb-category-popup-box h3 {
    margin: 0 0 16px;
    color: var(--rtb-ink);
    font-size: 24px;
}

.rtb-category-popup-close {
    float: right;
    color: var(--primary);
    font-weight: 900;
    text-decoration: none;
}

.rtb-category-popup-list {
    display: grid;
    gap: 10px;
}

.rtb-category-popup-list button {
    width: 100%;
    padding: 14px 16px;
    border: 1px solid var(--rtb-line);
    border-radius: 14px;
    background: #f8f8f8;
    text-align: left;
    font-weight: 800;
}

.menu-section {
    max-height: var(--menu-section-h, none);
    overflow-y: auto;
}

.deals-section {
    max-height: var(--deals-section-h, none);
    overflow-y: auto;
}

.services-section {
    max-height: var(--services-section-h, none);
    overflow-y: auto;
}

.section-title {
    max-width: 780px;
}

.menu-section h3[id^="cat-"] {
    margin: 48px 0 22px !important;
    color: var(--rtb-ink) !important;
    font-size: clamp(26px, 3vw, 40px);
}

.menu-products {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
}

.rtb-modal-overlay {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 1200;
    align-items: center;
    justify-content: center;
    padding: 22px;
    background: rgba(10, 10, 10, .58);
    backdrop-filter: blur(12px);
}

.rtb-item-modal,
.rtb-cart-modal {
    position: relative;
    width: min(100%, 480px);
    max-height: 90vh;
    overflow-y: auto;
    border-radius: 28px;
    background: #fff;
    box-shadow: 0 28px 90px rgba(0,0,0,.28);
}

.rtb-item-modal-image {
    height: 240px;
    padding: 28px;
    background: color-mix(in srgb, var(--primary), white 91%);
    display: flex;
    align-items: center;
    justify-content: center;
}

.rtb-item-modal-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    filter: drop-shadow(0 18px 28px rgba(0,0,0,.20));
}

.rtb-item-modal-body,
.rtb-cart-modal {
    padding: 28px;
}

.rtb-modal-close {
    position: absolute;
    top: 14px;
    right: 14px;
    z-index: 3;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    border: 0;
    background: #fff;
    box-shadow: 0 10px 24px rgba(0,0,0,.12);
    cursor: pointer;
    font-weight: 900;
}

.rtb-item-modal h2,
.rtb-cart-modal h2 {
    margin: 0 0 12px;
    color: var(--rtb-ink);
    font-size: 24px;
}

.rtb-item-modal p {
    color: var(--rtb-muted);
    line-height: 1.7;
}

.rtb-field select,
.rtb-cart-modal input,
.rtb-cart-modal textarea {
    width: 100%;
    padding: 13px 14px;
    border-radius: 14px;
    border: 1px solid var(--rtb-line);
    box-sizing: border-box;
    font: inherit;
    margin-bottom: 14px;
}

.rtb-popup-price {
    margin: 16px 0;
    color: var(--primary);
    font-size: 28px;
    font-weight: 900;
}

.rtb-qty-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 18px 0;
    font-weight: 900;
}

.rtb-qty-control {
    display: inline-flex;
    overflow: hidden;
    border: 1px solid var(--rtb-line);
    border-radius: 999px;
}

.rtb-qty-control button,
.rtb-qty-control span {
    width: 42px;
    height: 38px;
    border: 0;
    background: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 900;
}

.rtb-full-btn {
    width: 100%;
    padding: 15px 18px !important;
    border-radius: 999px !important;
    font-size: 15px !important;
}

.rtb-checkout-actions {
    display: grid;
    gap: 10px;
    margin-top: 4px;
}

.rtb-whatsapp-order-btn {
    width: 100%;
    padding: 15px 18px !important;
    border: 0;
    border-radius: 999px !important;
    background: #25D366 !important;
    color: #fff !important;
    font-size: 15px !important;
    font-weight: 800;
    cursor: pointer;
    box-shadow: 0 14px 30px rgba(37, 211, 102, .25);
    transition: transform .25s ease, box-shadow .25s ease, filter .25s ease;
}

.rtb-whatsapp-order-btn:hover {
    transform: translateY(-2px);
    filter: brightness(.96);
    box-shadow: 0 18px 34px rgba(37, 211, 102, .32);
}

.rtb-cart-total {
    display: flex;
    justify-content: space-between;
    padding-top: 16px;
    margin: 16px 0;
    border-top: 1px solid var(--rtb-line);
    color: var(--rtb-ink);
    font-size: 18px;
    font-weight: 900;
}

.rtb-empty-cart,
.rtb-checkout-error {
    display: none;
    color: #dc2626;
    font-size: 13px;
    margin: 10px 0;
}

.rtb-empty-cart {
    color: var(--rtb-muted);
    text-align: center;
    padding: 24px 0;
}

.rtb-thankyou {
    text-align: center;
    padding: 28px 0;
}

.rtb-thankyou-icon {
    width: 60px;
    height: 60px;
    margin: 0 auto 14px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--primary), white 84%);
    color: var(--primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 900;
}

.footer {
    margin-top: 40px;
}

/* =========================================================
   GLOBAL COLOR / BACKGROUND CUSTOMIZATION
   Controlled by CSS variables emitted from render.php.
========================================================= */

html,
body {
    color: var(--site-text, var(--text)) !important;
}

body {
    background-color: var(--site-bg, var(--background)) !important;
    background-image: var(--site-bg-image, none) !important;
    background-size: var(--site-bg-size, cover) !important;
    background-repeat: var(--site-bg-repeat, no-repeat) !important;
    background-position: center top !important;
    background-attachment: fixed !important;
}

body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    background: rgba(255, 255, 255, .0);
    pointer-events: none;
}

.section-title h2,
.rtb-hero h1,
.menu-section h3[id^="cat-"],
.footer h3,
.footer h4,
.menu-content h3,
.deal-card h3,
.service-card h3,
.rtb-category-name,
.rtb-floating-card h3 {
    color: var(--heading-text, #161616) !important;
}

.section-title p,
.rtb-hero p,
.menu-description,
.fixed-menu-card p,
.menu-card p,
.deal-card p,
.service-card p,
.rtb-floating-card p,
.rtb-category-popup-list button {
    color: var(--muted-text, #6f7580) !important;
}

.featured,
.category-icons,
.menu-section,
.deals-section,
.services-section {
    background: var(--section-bg, transparent) !important;
}

.fixed-menu-card,
.menu-card,
.deal-card,
.service-card,
.category-icon-card,
.rtb-category-pill,
.rtb-category-popup-box,
.rtb-item-modal,
.rtb-cart-modal {
    background: var(--box-bg, #ffffff) !important;
    color: var(--box-text, #161616) !important;
}

.menu-image-area.with-bg,
.rtb-category-art,
.rtb-item-modal-image {
    background: color-mix(in srgb, var(--box-bg, #ffffff), var(--button-bg, var(--primary)) 10%) !important;
}

.primary-btn,
.add-cart,
.deal-btn,
.menu-choose-btn,
.menu-tab,
.rtb-open-category-popup,
.rtb-category-popup-list button:hover {
    background: var(--button-bg, var(--primary)) !important;
    color: var(--button-text, #ffffff) !important;
    border-color: var(--button-bg, var(--primary)) !important;
}

.secondary-btn {
    background: var(--button-alt-bg, #ffffff) !important;
    color: var(--button-alt-text, var(--primary)) !important;
    border-color: var(--button-alt-text, var(--primary)) !important;
}

.new-price,
.rtb-popup-price,
.rtb-back-link,
.rtb-add-more,
.rtb-category-main-link a,
.section-title span {
    color: var(--button-bg, var(--primary)) !important;
}

.cart-count,
.menu-discount-badge,
.deal-badge {
    background: var(--button-bg, var(--primary)) !important;
    color: var(--button-text, #ffffff) !important;
}

.footer {
    background: var(--footer-bg, #222222) !important;
    color: var(--footer-text, #ffffff) !important;
}

.footer *,
.footer a,
.footer p {
    color: var(--footer-text, #ffffff) !important;
}

/* =========================================================
   MENU CARD DENSITY CONTROLS
   Settings supported by render.php:
   menu_cards_per_row: 2-6
   menu_visible_rows: 0-4, where 0 means show all rows
   menu_image_height: 150-260
   menu_card_size: compact, standard, large
========================================================= */

.menu-section {
    --menu-cols: 4;
    --menu-gap: 22px;
    --menu-image-h: 200px;
    --menu-card-min-h: 370px;
    --menu-grid-max: none;
}

.menu-section .menu-products:not([data-section-scroll]) {
    display: grid !important;
    grid-template-columns: repeat(var(--menu-cols), minmax(0, 1fr)) !important;
    gap: var(--menu-gap) !important;
    align-items: stretch;
    max-height: var(--menu-grid-max);
    overflow-y: auto;
    padding: 4px 4px 14px;
}

.menu-section .menu-products[data-section-scroll] {
    gap: var(--menu-gap) !important;
    padding: 4px 4px 14px;
}

.menu-section .menu-products[data-section-scroll] .fixed-menu-card,
.menu-section .menu-products[data-section-scroll] .menu-card {
    flex: 0 0 calc((100% - (var(--menu-cols) - 1) * var(--menu-gap)) / var(--menu-cols)) !important;
    min-width: 220px;
}

.fixed-menu-card,
.menu-card {
    min-height: var(--menu-card-min-h) !important;
    border-radius: 18px !important;
}

.menu-image-area {
    height: var(--menu-image-h) !important;
    padding: 12px 14px !important;
}

.menu-image-area.with-bg {
    background: linear-gradient(180deg, #fbfbfb, #f5f7f6) !important;
}

.fixed-menu-card img,
.menu-card img,
.menu-image-area img {
    height: 100% !important;
    object-fit: contain !important;
    padding: 0 !important;
}

.menu-content {
    padding: 16px 18px 18px !important;
}

.menu-content h3,
.fixed-menu-card h3,
.menu-card h3 {
    min-height: 44px !important;
    margin: 0 0 6px !important;
    padding: 0 !important;
    font-size: 18px !important;
    line-height: 1.22 !important;
}

.menu-description,
.fixed-menu-card p,
.menu-card p {
    min-height: 42px !important;
    margin-bottom: 12px !important;
    padding: 0 !important;
    font-size: 13px !important;
    line-height: 1.45 !important;
}

.menu-price-row {
    margin-bottom: 12px !important;
}

.new-price {
    font-size: 22px !important;
}

.menu-choose-btn {
    padding: 11px 14px !important;
}

.rtb-menu-size-standard {
    --menu-card-min-h: 420px;
    --menu-image-h: 220px;
}

.rtb-menu-size-large {
    --menu-card-min-h: 470px;
    --menu-image-h: 245px;
}

/* =========================================================
   RESPONSIVE SECTION SPACING CONTROLS
   Values are emitted per section by render.php.
========================================================= */

.rtb-space-section {
    box-sizing: border-box;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    padding-top: var(--rtb-section-pt, 48px) !important;
    padding-bottom: var(--rtb-section-pb, 48px) !important;
    margin-top: var(--rtb-section-mt, 0px) !important;
    margin-bottom: var(--rtb-section-mb, 0px) !important;
}

.rtb-space-section.rtb-height-minimum {
    min-height: var(--rtb-section-h, 0px) !important;
}

.rtb-space-section.rtb-height-fixed {
    height: var(--rtb-section-h, auto) !important;
    overflow-y: auto !important;
}

.rtb-space-section > .section-title {
    margin-top: 0 !important;
    margin-bottom: var(--rtb-section-gap, 24px) !important;
}

.rtb-space-section > .section-title > :first-child {
    margin-top: 0 !important;
}

.rtb-space-section > .section-title > :last-child {
    margin-bottom: 0 !important;
}

/* Remove padding inherited from older full-height section rules. */
.rtb-space-section.rtb-featured,
.rtb-space-section.rtb-category-section,
.rtb-space-section.menu-section,
.rtb-space-section.deals-section,
.rtb-space-section.services-section {
    padding-top: var(--rtb-section-pt, 48px) !important;
    padding-bottom: var(--rtb-section-pb, 48px) !important;
}

@media (max-width: 860px) {
    .rtb-space-section {
        padding-top: var(--rtb-section-pt-mobile, 32px) !important;
        padding-bottom: var(--rtb-section-pb-mobile, 32px) !important;
        margin-top: var(--rtb-section-mt-mobile, 0px) !important;
        margin-bottom: var(--rtb-section-mb-mobile, 0px) !important;
    }

    .rtb-space-section > .section-title {
        margin-bottom: var(--rtb-section-gap-mobile, 18px) !important;
    }

    .rtb-space-section.rtb-height-minimum {
        min-height: var(--rtb-section-h-mobile, 0px) !important;
    }

    .rtb-space-section.rtb-height-fixed {
        height: var(--rtb-section-h-mobile, auto) !important;
    }
}

/* =========================================================
   POPULAR CATEGORIES: AUTHORITATIVE CARD SYSTEM
========================================================= */
.rtb-category-section .rtb-category-pill {
    box-sizing: border-box;
    overflow: hidden;
    padding: 18px;
    gap: 12px;
    color: inherit;
    text-decoration: none;
    appearance: none;
    -webkit-appearance: none;
    transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}

.rtb-category-section .rtb-category-pill:hover,
.rtb-category-section .rtb-category-pill:focus-visible {
    transform: translateY(-5px);
    outline: none;
    box-shadow: 0 20px 46px rgba(0, 0, 0, .12);
}

.rtb-category-section .rtb-category-art {
    width: min(var(--cat-img, 76px), calc(100% - 42px)) !important;
    height: min(var(--cat-img, 76px), calc(100% - 42px)) !important;
    min-width: 36px;
    min-height: 36px;
    flex: 0 0 auto;
    background: transparent !important;
}

.rtb-category-section .rtb-category-art img {
    width: 100% !important;
    height: 100% !important;
    padding: 4px;
    object-fit: contain !important;
}

.rtb-category-section .rtb-category-name {
    width: 100%;
    max-width: 100%;
    color: inherit !important;
    text-align: center;
    white-space: normal;
    overflow-wrap: anywhere;
    line-height: 1.25;
}

.rtb-category-size-compact .rtb-category-pill {
    min-width: 130px;
    padding: 12px;
    gap: 8px;
}

.rtb-category-size-compact .rtb-category-name { font-size: 13px; }

.rtb-category-size-large .rtb-category-pill {
    min-width: 190px;
    padding: 24px;
    gap: 15px;
}

.rtb-category-size-large .rtb-category-name { font-size: 16px; }

.rtb-category-section .rtb-category-pill.fav-shape-cube,
.rtb-category-section .rtb-category-pill.fav-shape-round,
.rtb-category-section .rtb-category-pill.fav-shape-vertical {
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.rtb-category-section .rtb-category-pill.fav-shape-horizontal {
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding-inline: 22px;
}

.rtb-category-section .rtb-category-pill.fav-shape-horizontal .rtb-category-art {
    width: min(var(--cat-img, 76px), 42%) !important;
    height: min(var(--cat-img, 76px), calc(100% - 24px)) !important;
}

.rtb-category-section .rtb-category-pill.fav-shape-horizontal .rtb-category-name {
    text-align: left;
}

.rtb-category-section.rtb-card-bg-auto .rtb-category-pill:not(.rtb-category-custom-color) .rtb-category-name {
    color: var(--box-text, #161616) !important;
}

.rtb-category-section.rtb-card-bg-color .rtb-category-pill:not(.rtb-category-custom-color) .rtb-category-name,
.rtb-category-section.rtb-card-bg-image .rtb-category-pill:not(.rtb-category-custom-color) .rtb-category-name {
    color: var(--rtb-card-custom-text, #161616) !important;
}

.rtb-category-section.rtb-card-bg-transparent .rtb-category-pill:not(.rtb-category-custom-color) .rtb-category-name {
    color: var(--rtb-title-heading-color, var(--heading-text, #161616)) !important;
}

.rtb-category-section .rtb-category-pill.rtb-category-custom-color,
.rtb-category-section .rtb-category-pill.rtb-category-custom-color .rtb-category-name {
    color: var(--category-card-text, #161616) !important;
}

@media (max-width: 860px) {
    .rtb-category-section .rtb-category-pill {
        min-width: 0;
        padding: 14px;
    }

    .rtb-category-section .rtb-category-pill.fav-shape-horizontal {
        padding-inline: 14px;
    }
}

/* Category shape settings must control the card's actual proportions. */
.rtb-category-pill.fav-shape-cube,
.rtb-category-pill.fav-shape-round,
.rtb-category-pill.fav-shape-vertical,
.rtb-category-pill.fav-shape-horizontal {
    height: auto !important;
    min-height: 0 !important;
}

.rtb-category-pill.fav-shape-cube {
    aspect-ratio: 1 / 1;
    border-radius: 18px !important;
}

.rtb-category-pill.fav-shape-round {
    aspect-ratio: 1 / 1;
    border-radius: 50% !important;
}

.rtb-category-pill.fav-shape-vertical {
    aspect-ratio: 3 / 4;
    border-radius: 18px !important;
}

.rtb-category-pill.fav-shape-horizontal {
    aspect-ratio: 16 / 9;
    border-radius: 18px !important;
}

.rtb-category-pill.fav-bg-transparent {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

/* Featured card shape and background controls. */
.rtb-featured .rtb-floating-card.fav-bg-background {
    background: var(--box-bg, #ffffff) !important;
    border: 1px solid var(--rtb-line) !important;
    box-shadow: 0 16px 42px rgba(0, 0, 0, .08) !important;
    padding: 16px !important;
}

.rtb-featured .rtb-floating-card.fav-bg-transparent,
.rtb-featured .rtb-floating-card.fav-bg-none {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

.rtb-featured .rtb-floating-card.fav-shape-cube,
.rtb-featured .rtb-floating-card.fav-shape-round,
.rtb-featured .rtb-floating-card.fav-shape-vertical {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: auto !important;
}

.rtb-featured .rtb-floating-card.fav-shape-cube {
    aspect-ratio: 1 / 1;
    border-radius: 18px !important;
}

.rtb-featured .rtb-floating-card.fav-shape-round {
    aspect-ratio: 1 / 1;
    border-radius: 50% !important;
}

.rtb-featured .rtb-floating-card.fav-shape-vertical {
    aspect-ratio: 3 / 4;
    border-radius: 18px !important;
}

.rtb-featured .rtb-floating-card.fav-shape-horizontal {
    aspect-ratio: 16 / 9;
    border-radius: 18px !important;
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(90px, .65fr);
    grid-template-rows: 1fr auto;
    align-items: center;
    text-align: left;
}

.rtb-featured .rtb-floating-card.fav-shape-horizontal .rtb-floating-img {
    grid-row: 1 / 3;
    min-width: 0;
}

.rtb-featured .rtb-floating-card.fav-shape-horizontal h3,
.rtb-featured .rtb-floating-card.fav-shape-horizontal p {
    width: 100%;
    max-width: none;
    text-align: left;
}

.rtb-category-pill.rtb-category-custom-color {
    background: var(--category-card-bg) !important;
    border-color: color-mix(in srgb, var(--category-card-bg), #000 12%) !important;
    box-shadow: 0 18px 42px color-mix(in srgb, var(--category-card-bg), transparent 68%) !important;
}

.rtb-category-pill.rtb-category-custom-color .rtb-category-name {
    color: var(--category-card-text, #161616) !important;
}

/* Deal and service shape controls use real proportions. */
.deal-card,
.service-card {
    height: auto !important;
    min-height: 0 !important;
    box-sizing: border-box;
}

.deal-card.fav-shape-cube,
.deal-card.fav-shape-round,
.service-card.fav-shape-cube,
.service-card.fav-shape-round {
    aspect-ratio: 1 / 1;
}

.deal-card.fav-shape-round,
.service-card.fav-shape-round {
    border-radius: 50% !important;
}

.deal-card.fav-shape-vertical,
.service-card.fav-shape-vertical {
    aspect-ratio: 3 / 4;
    border-radius: 18px !important;
}

.deal-card.fav-shape-horizontal,
.service-card.fav-shape-horizontal {
    aspect-ratio: 16 / 9;
    border-radius: 18px !important;
}

.deal-card.fav-shape-horizontal {
    display: grid !important;
    grid-template-columns: 42% 1fr;
    grid-template-rows: auto auto 1fr auto auto;
    align-items: center;
    text-align: left;
}

.deal-card.fav-shape-horizontal > img {
    grid-column: 1;
    grid-row: 1 / 6;
    width: 100%;
    height: 100%;
}

.deal-card.fav-shape-horizontal > :not(img):not(.deal-badge) {
    grid-column: 2;
}

.service-card.fav-shape-horizontal {
    display: grid;
    grid-template-columns: 92px 1fr;
    grid-template-rows: auto auto;
    align-content: center;
    text-align: left;
    column-gap: 18px;
}

.service-card.fav-shape-horizontal .service-icon {
    grid-row: 1 / 3;
}

/* Dark presets and custom box colors must reach secondary surfaces too. */
.menu-image-area.with-bg {
    background: color-mix(in srgb, var(--box-bg, #ffffff), var(--button-bg, var(--primary)) 9%) !important;
}

#freshSearchResults,
.search-input-wrap,
.rtb-category-popup-box,
.rtb-item-modal,
.rtb-cart-modal {
    background: var(--box-bg, #ffffff) !important;
    color: var(--box-text, #161616) !important;
}

#freshSearchInput,
.rtb-field select,
.rtb-cart-modal input,
.rtb-cart-modal textarea,
.rtb-category-popup-list button {
    background: color-mix(in srgb, var(--box-bg, #ffffff), var(--site-bg, #ffffff) 28%) !important;
    color: var(--box-text, #161616) !important;
    border-color: color-mix(in srgb, var(--box-text, #161616), transparent 82%) !important;
}

/* Guided hero typography, media and button controls. */
.rtb-hero .rtb-hero-copy {
    text-align: var(--hero-text-align, left);
}

.rtb-hero .rtb-eyebrow {
    color: var(--hero-tag-color, var(--primary)) !important;
    font-size: var(--hero-tag-size, 14px) !important;
}

.rtb-hero .rtb-hero-copy h1 {
    color: var(--hero-heading-color, var(--heading-text)) !important;
    font-size: clamp(24px, var(--hero-heading-size, 64px), 120px) !important;
}

.rtb-hero .rtb-hero-copy > p {
    color: var(--hero-description-color, var(--muted-text)) !important;
    font-size: var(--hero-description-size, 18px) !important;
}

.rtb-hero .rtb-hero-copy .primary-btn,
.rtb-hero .rtb-hero-banner-actions .primary-btn {
    background: var(--hero-button1-bg, var(--button-bg)) !important;
    color: var(--hero-button1-text, var(--button-text)) !important;
    border-color: var(--hero-button1-bg, var(--button-bg)) !important;
}

.rtb-hero .rtb-hero-copy .secondary-btn,
.rtb-hero .rtb-hero-banner-actions .secondary-btn {
    background: var(--hero-button2-bg, var(--button-alt-bg)) !important;
    color: var(--hero-button2-text, var(--button-alt-text)) !important;
    border-color: var(--hero-button2-text, var(--button-alt-text)) !important;
}

.rtb-hero .rtb-hero-slider img,
.rtb-hero-banner .hero-slide img {
    object-fit: var(--hero-image-fit, cover) !important;
}

.rtb-hero-banner::after {
    background: color-mix(in srgb, var(--hero-overlay, #000000) var(--hero-overlay-strength, 35%), transparent) !important;
}

.rtb-hero-banner .rtb-hero-copy h1,
.rtb-hero-banner .rtb-hero-copy > p {
    color: inherit;
}

/* Per-section and per-card background builder. */
.rtb-surface-section.rtb-section-bg-auto {
    background-color: var(--section-bg, transparent) !important;
}

.rtb-surface-section.rtb-section-bg-color {
    background-color: var(--rtb-section-custom-bg) !important;
    background-image: none !important;
}

.rtb-surface-section.rtb-section-bg-image {
    background-color: var(--rtb-section-custom-bg) !important;
    background-image: var(--rtb-section-bg-image) !important;
    background-size: var(--rtb-section-bg-size, cover) !important;
    background-repeat: var(--rtb-section-bg-repeat, no-repeat) !important;
    background-position: center !important;
}

.rtb-surface-section.rtb-section-bg-transparent {
    background-color: transparent !important;
    background-image: none !important;
}

.rtb-card-bg-color :is(.rtb-floating-card, .rtb-category-pill:not(.rtb-category-custom-color), .fixed-menu-card, .menu-card, .deal-card, .service-card) {
    background-color: var(--rtb-card-custom-bg) !important;
    background-image: none !important;
    border-color: color-mix(in srgb, var(--rtb-card-custom-bg), #000 12%) !important;
}

.rtb-card-bg-image :is(.rtb-floating-card, .rtb-category-pill:not(.rtb-category-custom-color), .fixed-menu-card, .menu-card, .deal-card, .service-card) {
    background-color: var(--rtb-card-custom-bg) !important;
    background-image: var(--rtb-card-bg-image) !important;
    background-size: var(--rtb-card-bg-size, cover) !important;
    background-repeat: var(--rtb-card-bg-repeat, no-repeat) !important;
    background-position: center !important;
    border-color: color-mix(in srgb, var(--rtb-card-custom-bg), #000 12%) !important;
}

.rtb-card-bg-image .menu-image-area.with-bg {
    background: transparent !important;
}

.rtb-card-bg-transparent :is(.rtb-floating-card, .rtb-category-pill:not(.rtb-category-custom-color), .fixed-menu-card, .menu-card, .deal-card, .service-card) {
    background-color: transparent !important;
    background-image: none !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

.rtb-space-section > .section-title > span {
    color: var(--rtb-title-tag-color, var(--primary)) !important;
    font-size: var(--rtb-title-tag-size, 13px) !important;
}

.rtb-space-section > .section-title > h2 {
    color: var(--rtb-title-heading-color, var(--heading-text)) !important;
    font-size: var(--rtb-title-heading-size, 42px) !important;
}

.rtb-space-section > .section-title > p {
    color: var(--rtb-title-description-color, var(--muted-text)) !important;
    font-size: var(--rtb-title-description-size, 18px) !important;
}

/* =========================================================
   GUIDED BUILDER: SHARED RESPONSIVE BEHAVIOUR
========================================================= */

.rtb-hero {
    min-height: var(--hero-h, 620px) !important;
    padding-top: var(--hero-pt, 48px) !important;
    padding-bottom: var(--hero-pb, 48px) !important;
    margin-top: var(--hero-mt, 0px) !important;
    margin-bottom: var(--hero-mb, 0px) !important;
    gap: var(--hero-content-gap, 36px) !important;
}

.rtb-hero-actions {
    margin-top: var(--hero-button-gap, 22px) !important;
}

.rtb-hero.hero-bg-auto {
    background-color: var(--section-alt-bg, #ffffff) !important;
    background-image: none !important;
}

.rtb-hero.hero-bg-transparent {
    background-color: transparent !important;
    background-image: none !important;
}

.rtb-hero.hero-bg-color {
    background-color: var(--hero-bg-color, #ffffff) !important;
    background-image: none !important;
}

.rtb-hero.hero-bg-image {
    background-color: var(--hero-bg-color, transparent) !important;
    background-image: var(--hero-bg-image, none) !important;
    background-size: var(--hero-bg-size, cover) !important;
    background-repeat: var(--hero-bg-repeat, no-repeat) !important;
    background-position: center !important;
}

.rtb-hero-banner,
.rtb-hero-banner .rtb-hero-banner-slider,
.rtb-hero-banner .hero-slide img {
    min-height: var(--hero-h, 620px) !important;
    height: var(--hero-h, 620px) !important;
}

.rtb-hero.hero-fit-adaptive.rtb-hero-banner,
.rtb-hero.hero-fit-adaptive.rtb-hero-banner .rtb-hero-banner-slider,
.rtb-hero.hero-fit-adaptive.rtb-hero-banner .hero-slide,
.rtb-hero.hero-fit-adaptive.rtb-hero-banner .hero-slide img {
    height: auto !important;
    min-height: 0 !important;
}

.rtb-hero.hero-fit-adaptive.rtb-hero-banner .rtb-hero-banner-slider {
    position: relative !important;
}

.rtb-hero.hero-fit-adaptive.rtb-hero-banner .hero-slide.active {
    position: relative !important;
}

.rtb-hero.hero-fit-adaptive.rtb-hero-banner .hero-slide img {
    width: 100%;
    max-height: var(--hero-h, 620px);
    object-fit: contain !important;
}

.rtb-hero.hero-fit-adaptive.rtb-hero-banner .rtb-hero-copy,
.rtb-hero.hero-fit-adaptive.rtb-hero-banner .rtb-hero-banner-actions {
    position: absolute;
    inset: 50% auto auto 50%;
    transform: translate(-50%, -50%);
    width: min(960px, 92%);
}

.rtb-featured .rtb-floating-viewport,
.rtb-category-viewport {
    padding-left: 18px !important;
    padding-right: 18px !important;
}

.rtb-featured .rtb-floating-img {
    height: calc(var(--featured-img-h, 170px) + var(--featured-img-pt, 12px) + var(--featured-img-pb, 8px)) !important;
    padding-top: var(--featured-img-pt, 12px) !important;
    padding-bottom: var(--featured-img-pb, 8px) !important;
}

.rtb-featured .rtb-floating-card h3 {
    margin-top: var(--featured-img-gap, 10px) !important;
    text-align: center !important;
}

.rtb-display-static .rtb-floating-track,
.rtb-category-row.rtb-expandable-grid {
    display: flex !important;
    flex-wrap: wrap;
    justify-content: center;
    transform: none !important;
    animation: none !important;
    align-items: stretch;
}

.rtb-display-static .rtb-floating-track > .rtb-floating-card {
    flex: 0 0 calc((100% - (var(--fav-visible, 4) - 1) * 22px) / var(--fav-visible, 4)) !important;
}

.rtb-category-row.rtb-expandable-grid > .category-icon-card {
    flex: 0 0 calc((100% - (var(--cat-visible, 6) - 1) * 20px) / var(--cat-visible, 6)) !important;
}

.fav-track.is-paused,
.fav-track.is-paused .fav-card,
.fav-track.is-paused .category-icon-card,
.fav-track:hover,
.fav-track:hover .fav-card,
.fav-track:hover .category-icon-card {
    animation-play-state: paused !important;
}

.fav-anim-zoom-pulse .fav-card,
.fav-anim-zoom-pulse .category-icon-card {
    animation-duration: var(--rtb-animation-duration, 3s) !important;
}

.rtb-card-hidden {
    display: none !important;
}

.rtb-view-more {
    display: block;
    margin: 18px auto 4px;
    min-width: 132px;
    border: 1px solid var(--button-bg, var(--primary));
    border-radius: 999px;
    padding: 11px 20px;
    background: transparent;
    color: var(--button-bg, var(--primary));
    font-weight: 800;
}

.rtb-view-more[hidden] {
    display: none !important;
}

.rtb-card-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: center;
    margin-top: 10px;
    border: 0;
    border-radius: 999px;
    padding: 9px 16px;
    background: var(--featured-button-bg, var(--service-button-bg, var(--button-bg, var(--primary))));
    color: var(--featured-button-text, var(--service-button-text, var(--button-text, #fff)));
    font-weight: 800;
}

.rtb-card-action:disabled { opacity: .45; cursor: not-allowed; }
.menu-choose-btn { background: var(--menu-button-bg, var(--button-bg)) !important; color: var(--menu-button-text, var(--button-text)) !important; }
.deal-btn { background: var(--deal-button-bg, var(--button-bg)) !important; color: var(--deal-button-text, var(--button-text)) !important; }

.rtb-balanced-grid {
    display: flex !important;
    flex-wrap: wrap;
    justify-content: center;
    align-items: stretch;
    gap: 24px;
}

.rtb-balanced-grid > .deal-card,
.rtb-balanced-grid > .service-card {
    width: calc((100% - (var(--section-card-cols, 3) - 1) * 24px) / var(--section-card-cols, 3));
    max-width: 340px;
    flex: 0 1 340px;
}

.rtb-card-size-compact .deal-card,
.rtb-card-size-compact .service-card { max-width: 260px; flex-basis: 260px; }
.rtb-card-size-large .deal-card,
.rtb-card-size-large .service-card { max-width: 400px; flex-basis: 400px; }

.deal-card > img {
    height: var(--deal-image-h, 190px) !important;
    padding-top: var(--deal-image-pt, 12px) !important;
    padding-bottom: var(--deal-image-pb, 8px) !important;
    object-fit: contain !important;
}

.service-icon {
    width: var(--service-icon-size, 68px) !important;
    height: var(--service-icon-size, 68px) !important;
    font-size: clamp(14px, calc(var(--service-icon-size, 68px) * .34), 30px) !important;
}

.rtb-internal-toggle {
    display: none !important;
}

.menu-section .menu-products:not([data-section-scroll]) {
    display: flex !important;
    flex-wrap: wrap;
    justify-content: center;
    align-items: stretch;
}

.menu-section .menu-products:not([data-section-scroll]) > .fixed-menu-card,
.menu-section .menu-products:not([data-section-scroll]) > .menu-card {
    flex: 0 0 calc((100% - (var(--menu-cols, 4) - 1) * var(--menu-gap, 22px)) / var(--menu-cols, 4));
    max-width: 360px;
}

.menu-content,
.menu-content h3,
.menu-description,
.menu-price-row {
    text-align: center !important;
    justify-content: center;
}

.menu-image-area {
    height: calc(var(--menu-image-h, 200px) + var(--menu-image-pt, 12px) + var(--menu-image-pb, 8px)) !important;
    padding: var(--menu-image-pt, 12px) 14px var(--menu-image-pb, 8px) !important;
    margin-bottom: var(--menu-image-text-gap, 10px);
}

.menu-description.is-empty {
    visibility: hidden;
}

.fixed-menu-card.card-round,
.menu-card.card-round {
    aspect-ratio: 1 / 1 !important;
    min-height: 0 !important;
    border-radius: 50% !important;
    padding: 5% !important;
    overflow: hidden;
}

.fixed-menu-card.card-round .menu-image-area,
.menu-card.card-round .menu-image-area {
    height: 42% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 5% !important;
    background: transparent !important;
}

.fixed-menu-card.card-round .menu-content,
.menu-card.card-round .menu-content {
    min-height: 0;
    padding: 4% 8% 8% !important;
    justify-content: center;
}

.fixed-menu-card.card-round .menu-content h3,
.menu-card.card-round .menu-content h3,
.fixed-menu-card.card-round .menu-description,
.menu-card.card-round .menu-description {
    min-height: 0 !important;
    margin-bottom: 4px !important;
    font-size: 12px !important;
}

.fixed-menu-card.card-round .new-price,
.menu-card.card-round .new-price { font-size: 16px !important; }
.fixed-menu-card.card-round .menu-price-row,
.menu-card.card-round .menu-price-row { margin-bottom: 5px !important; }
.fixed-menu-card.card-round .menu-choose-btn,
.menu-card.card-round .menu-choose-btn { width: 82%; margin: 0 auto; padding: 7px 10px !important; }

.rtb-card-bg-auto :is(.rtb-floating-card, .rtb-category-pill:not(.rtb-category-custom-color), .fixed-menu-card, .menu-card, .deal-card, .service-card) {
    background-color: var(--box-bg, #fff) !important;
    color: var(--box-text, #161616) !important;
}

.rtb-card-bg-color :is(.rtb-floating-card, .rtb-category-pill:not(.rtb-category-custom-color), .fixed-menu-card, .menu-card, .deal-card, .service-card),
.rtb-card-bg-image :is(.rtb-floating-card, .rtb-category-pill:not(.rtb-category-custom-color), .fixed-menu-card, .menu-card, .deal-card, .service-card) {
    color: var(--rtb-card-custom-text, #161616) !important;
}

.rtb-card-bg-auto :is(.fixed-menu-card, .menu-card, .deal-card, .service-card) :is(h3, p),
.rtb-card-bg-color :is(.fixed-menu-card, .menu-card, .deal-card, .service-card) :is(h3, p),
.rtb-card-bg-image :is(.fixed-menu-card, .menu-card, .deal-card, .service-card) :is(h3, p) {
    color: inherit !important;
}

@media (max-width: 860px) {
    .rtb-hero {
        min-height: var(--hero-h-mobile, 520px) !important;
        padding-top: var(--hero-pt-mobile, 32px) !important;
        padding-bottom: var(--hero-pb-mobile, 32px) !important;
        grid-template-columns: 1fr !important;
    }
    .rtb-hero-banner,
    .rtb-hero-banner .rtb-hero-banner-slider,
    .rtb-hero-banner .hero-slide img {
        min-height: var(--hero-h-mobile, 520px) !important;
        height: var(--hero-h-mobile, 520px) !important;
    }
    .rtb-display-static .rtb-floating-track > .rtb-floating-card,
    .rtb-category-row.rtb-expandable-grid > .category-icon-card { flex-basis: calc(50% - 11px) !important; }
    .rtb-balanced-grid > .deal-card,
    .rtb-balanced-grid > .service-card { width: min(100%, 340px); flex-basis: min(100%, 340px); }

    .rtb-space-section {
        overflow-x: hidden !important;
    }

    .rtb-space-section > .section-title {
        width: min(100%, calc(100vw - 32px));
        max-width: calc(100vw - 32px) !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding-inline: 0 !important;
    }

    .rtb-space-section > .section-title > h2 {
        max-width: 100%;
        font-size: clamp(28px, 9vw, var(--rtb-title-heading-size, 42px)) !important;
        line-height: 1.12;
        overflow-wrap: anywhere;
    }

    .rtb-space-section > .section-title > p {
        max-width: 100%;
        font-size: clamp(14px, 4.5vw, var(--rtb-title-description-size, 18px)) !important;
        line-height: 1.55;
        overflow-wrap: anywhere;
    }

    .rtb-featured .rtb-floating-viewport,
    .rtb-category-viewport {
        width: 100%;
        max-width: 100%;
        overflow: hidden !important;
    }
}

/* =========================================================
   POPULAR CATEGORIES: FEATURED-PARITY REBUILD
========================================================= */
.rtb-category-section .rtb-category-viewport {
    width: 100%;
    max-width: var(--rtb-container, 1450px);
    margin-inline: auto;
    padding: 10px 18px 24px !important;
}

.rtb-category-section .rtb-category-row {
    display: flex !important;
    gap: 20px;
    align-items: stretch;
    justify-content: center;
}

.rtb-category-section .rtb-category-row.fav-anim-marquee {
    justify-content: flex-start;
}

.rtb-category-section .rtb-category-row.rtb-expandable-grid {
    flex-wrap: wrap;
    justify-content: center;
    transform: none !important;
    animation: none !important;
}

.rtb-category-section .rtb-category-pill {
    container-type: inline-size;
    flex: 0 0 min(var(--cat-card-w, 240px), calc((100% - (var(--cat-visible, 6) - 1) * 20px) / var(--cat-visible, 6))) !important;
    width: min(var(--cat-card-w, 240px), calc((100% - (var(--cat-visible, 6) - 1) * 20px) / var(--cat-visible, 6))) !important;
    min-width: 0 !important;
    max-width: var(--cat-card-w, 240px) !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 14px !important;
    gap: var(--cat-img-gap, 10px) !important;
    border: 1px solid var(--rtb-line) !important;
    cursor: pointer;
    color: inherit;
    text-decoration: none;
    overflow: hidden;
    isolation: isolate;
}

.rtb-category-section .rtb-category-pill.fav-shape-cube,
.rtb-category-section .rtb-category-pill.fav-shape-round { aspect-ratio: 1 / 1 !important; }
.rtb-category-section .rtb-category-pill.fav-shape-round { border-radius: 50% !important; }
.rtb-category-section .rtb-category-pill.fav-shape-vertical { aspect-ratio: 3 / 4 !important; border-radius: 18px !important; }
.rtb-category-section .rtb-category-pill.fav-shape-horizontal {
    aspect-ratio: 16 / 9 !important;
    border-radius: 18px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 44%) minmax(0, 1fr);
    align-items: center;
}

.rtb-category-section .rtb-category-image-area {
    width: 100%;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--cat-img-pt, 12px) 0 var(--cat-img-pb, 8px);
}

.rtb-category-section .rtb-category-art {
    width: min(var(--cat-img, 76px), 68cqi) !important;
    height: min(var(--cat-img, 76px), 68cqi) !important;
    min-width: 34px;
    min-height: 34px;
    flex: 0 0 auto;
    background: transparent !important;
}

.rtb-category-section .rtb-category-art img {
    width: 100% !important;
    height: 100% !important;
    padding: 0 !important;
    object-fit: contain !important;
}

.rtb-category-section .rtb-category-content {
    width: 100%;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 9px;
}

.rtb-category-section .rtb-category-name {
    width: 100%;
    max-width: 100%;
    color: inherit !important;
    font-size: clamp(12px, 8cqi, 16px) !important;
    line-height: 1.22;
    text-align: center !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    overflow-wrap: anywhere;
}

.rtb-category-section .rtb-category-action {
    width: min(100%, 150px);
    margin-top: 0;
    padding: clamp(7px, 4cqi, 10px) clamp(10px, 7cqi, 16px);
    background: var(--category-button-bg, var(--button-bg, var(--primary))) !important;
    color: var(--category-button-text, var(--button-text, #fff)) !important;
    font-size: clamp(10px, 6.5cqi, 13px);
    line-height: 1.15;
    text-align: center;
}

.rtb-category-section .fav-shape-horizontal .rtb-category-image-area { height: 100%; }
.rtb-category-section .fav-shape-horizontal .rtb-category-art {
    width: min(var(--cat-img, 76px), 92cqi) !important;
    height: min(var(--cat-img, 76px), 92cqi) !important;
}
.rtb-category-section .fav-shape-horizontal .rtb-category-content { align-items: flex-start; }
.rtb-category-section .fav-shape-horizontal .rtb-category-name { text-align: left !important; }

/* Individual override > category card setting > global theme. */
.rtb-category-section.rtb-card-bg-auto .rtb-category-pill:not(.rtb-category-custom-color) {
    background: var(--box-bg, #fff) !important;
    color: var(--box-text, #161616) !important;
}
.rtb-category-section.rtb-card-bg-color .rtb-category-pill:not(.rtb-category-custom-color) {
    background: var(--rtb-card-custom-bg, #fff) !important;
    color: var(--rtb-card-custom-text, #161616) !important;
}
.rtb-category-section.rtb-card-bg-image .rtb-category-pill:not(.rtb-category-custom-color) {
    background-color: var(--rtb-card-custom-bg, #fff) !important;
    background-image: var(--rtb-card-bg-image, none) !important;
    background-size: var(--rtb-card-bg-size, cover) !important;
    background-repeat: var(--rtb-card-bg-repeat, no-repeat) !important;
    background-position: center !important;
    color: var(--rtb-card-custom-text, #161616) !important;
}
.rtb-category-section.rtb-card-bg-transparent .rtb-category-pill:not(.rtb-category-custom-color) {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
    color: var(--rtb-title-heading-color, var(--heading-text, #161616)) !important;
}
.rtb-category-section .rtb-category-pill.rtb-category-custom-color {
    background: var(--category-card-bg) !important;
    color: var(--category-card-text, #161616) !important;
}

.rtb-category-section .rtb-category-pill:hover,
.rtb-category-section .rtb-category-pill:focus-visible {
    transform: translateY(-5px);
    outline: 3px solid color-mix(in srgb, var(--primary), transparent 70%);
    outline-offset: 3px;
}

/* Use the same eight animation states as Featured Items. */
.rtb-category-section .fav-anim-center-focus .category-icon-card { opacity:.6; transform:scale(.85); transition:transform .5s ease,opacity .5s ease; }
.rtb-category-section .fav-anim-center-focus .category-icon-card.fav-center { opacity:1; transform:scale(1.06); }
.rtb-category-section .fav-anim-fade-cycle .category-icon-card { position:absolute; left:50%; opacity:0; transform:translateX(-50%); transition:opacity .8s ease; }
.rtb-category-section .fav-anim-fade-cycle .category-icon-card.active { position:relative; left:auto; opacity:1; transform:none; margin-inline:auto; }
.rtb-category-section .fav-anim-coverflow .category-icon-card,
.rtb-category-section .fav-anim-stacked .category-icon-card,
.rtb-category-section .fav-anim-orbit .category-icon-card { transition:transform .5s ease,opacity .5s ease; }
.rtb-category-section .fav-anim-stacked,
.rtb-category-section .fav-anim-orbit { position:relative; min-height:calc(var(--cat-card-w, 240px) + 40px); }
.rtb-category-section .fav-anim-stacked .category-icon-card,
.rtb-category-section .fav-anim-orbit .category-icon-card { position:absolute; top:0; left:50%; margin-left:calc(var(--cat-card-w, 240px) / -2); }
.rtb-category-section .fav-anim-slide-scale .category-icon-card { opacity:0; transform:scale(.7) translateX(40px); transition:transform .6s ease,opacity .6s ease; }
.rtb-category-section .fav-anim-slide-scale .category-icon-card.fav-in { opacity:1; transform:scale(1) translateX(0); }

@media (max-width: 860px) {
    .rtb-category-section .rtb-category-pill {
        flex-basis: min(calc(50% - 11px), var(--cat-card-w-mobile, 190px)) !important;
        width: min(calc(50% - 11px), var(--cat-card-w-mobile, 190px)) !important;
        max-width: var(--cat-card-w-mobile, 190px) !important;
    }
    .rtb-category-section .fav-anim-stacked,
    .rtb-category-section .fav-anim-orbit { min-height:calc(var(--cat-card-w-mobile, 190px) + 36px); }
    .rtb-category-section .fav-anim-stacked .category-icon-card,
    .rtb-category-section .fav-anim-orbit .category-icon-card { margin-left:calc(var(--cat-card-w-mobile, 190px) / -2); }
}

@media (max-width: 520px) {
    .rtb-category-section .rtb-category-viewport { padding-inline:12px !important; }
    .rtb-category-section .rtb-category-row { gap:14px; }
    .rtb-category-section .rtb-category-pill {
        flex-basis:min(78vw, var(--cat-card-w-mobile, 190px)) !important;
        width:min(78vw, var(--cat-card-w-mobile, 190px)) !important;
    }
}