/*==========================
Quick Order Modal
==========================*/

.mz-order-modal{
position:fixed;
inset:0;
background:rgba(0,0,0,.75);
backdrop-filter:blur(8px);
display:none;
align-items:center;
justify-content:center;
z-index:99999;
padding:20px;
}

.mz-order-modal.active{
display:flex;
}

.mz-order-box{

width:100%;
max-width:520px;
max-height:88vh;

overflow-y:auto;

background:#121212;

border-radius:22px;

padding:30px;

border:1px solid rgba(212,175,55,.25);

box-shadow:0 20px 60px rgba(0,0,0,.55);

position:relative;

}

.mz-order-box h2{

text-align:center;

color:#D4AF37;

margin-bottom:20px;

font-size:30px;

}

.mz-order-summary{

text-align:center;

margin-bottom:25px;

}

.mz-order-summary h3{

font-size:32px;

color:#fff;

margin-bottom:8px;

}

.mz-order-summary p{

font-size:24px;

color:#D4AF37;

font-weight:700;

}

.mz-order-form label{

display:block;

margin:15px 0 8px;

font-weight:600;

color:#ddd;

}

.mz-order-form input,
.mz-order-form textarea,
.mz-order-form select{

width:100%;

padding:14px 16px;

background:#1b1b1b;

border:1px solid #333;

border-radius:12px;

color:#fff;

font-size:15px;

}

.mz-order-form textarea{

resize:none;

}

.qty-box{

display:flex;

justify-content:center;

align-items:center;

gap:12px;

margin-top:10px;

margin-bottom:15px;

}

.qty-box button{

width:52px;

height:52px;

border:none;

border-radius:50%;

background:#D4AF37;

font-size:22px;

font-weight:700;

cursor:pointer;

transition:.3s;

}

.qty-box button:hover{

transform:scale(1.08);

}

.qty-box input{

width:70px !important;

text-align:center;

font-size:22px;

font-weight:700;

padding:10px;

}

.order-total{

margin-top:25px;

display:flex;

justify-content:space-between;

align-items:center;

padding:18px;

background:#1b1b1b;

border-radius:14px;

font-size:22px;

font-weight:700;

color:#fff;

}

.order-total strong{

color:#D4AF37;

font-size:30px;

}

.mz-order-submit{

width:100%;

margin-top:20px;

padding:16px;

background:#25D366;

color:#fff;

font-size:18px;

font-weight:700;

border:none;

border-radius:14px;

cursor:pointer;

transition:.3s;

}

.mz-order-submit:hover{

transform:translateY(-3px);

}

.mz-order-close{

position:absolute;

top:15px;

right:15px;

width:44px;

height:44px;

border:none;

border-radius:50%;

background:#D4AF37;

cursor:pointer;

font-size:18px;

}
/*==========================
Quick Order Header
==========================*/

.quick-title{

font-family:'Playfair Display',serif;

font-size:42px;

font-weight:700;

color:#fff;

margin-bottom:10px;

line-height:1.2;

}

.quick-subtitle{

font-size:15px;

color:#9b9b9b;

line-height:1.7;

margin-bottom:25px;

}

.quick-dish{

font-family:'Playfair Display',serif;

font-size:32px;

font-weight:700;

color:#D4AF37;

margin-bottom:10px;

line-height:1.2;

}

.quick-rating{

display:flex;

align-items:center;

gap:8px;

font-size:20px;

color:#f5b942;

margin-bottom:15px;

}

.quick-rating span{

font-size:18px;

font-weight:600;

color:#fff;

}

.quick-price{

font-size:34px;

font-weight:700;

color:#D4AF37;

margin-bottom:30px;

}
/*======================================
      PREMIUM QUICK ORDER V2
======================================*/

#quickOrderForm{
    animation:mzFade .35s ease;
}

/* Title */

.quick-title{

    font-family:'Playfair Display',serif;

    font-size:46px;

    color:#fff;

    line-height:1.1;

    margin-bottom:10px;

}

.quick-subtitle{

    color:#9d9d9d;

    line-height:1.7;

    margin-bottom:30px;

}

.quick-dish{

    font-size:34px;

    color:#D4AF37;

    font-family:'Playfair Display',serif;

    margin-bottom:12px;

}

.quick-rating{

    display:flex;

    align-items:center;

    gap:10px;

    margin-bottom:20px;

    color:#D4AF37;

}

.quick-rating span{

    color:#fff;

    font-weight:700;

}

.quick-price{

    font-size:42px;

    color:#D4AF37;

    font-weight:800;

    margin-bottom:30px;

}

/* Labels */

#quickOrderForm label{

    display:block;

    margin:18px 0 10px;

    color:#E8E8E8;

    font-weight:600;

}

/* Inputs */

#quickOrderForm input,
#quickOrderForm textarea{

    width:100%;

    background:#191919;

    border:1px solid #2f2f2f;

    border-radius:16px;

    padding:16px 18px;

    color:#fff;

    font-size:15px;

    transition:.35s;

}

#quickOrderForm input:focus,
#quickOrderForm textarea:focus{

    outline:none;

    border-color:#D4AF37;

    box-shadow:0 0 0 4px rgba(212,175,55,.15);

}

#quickOrderForm textarea{

    min-height:120px;

    resize:none;

}

/* Quantity */

.qty-box{

    display:flex;

    justify-content:center;

    align-items:center;

    gap:14px;

    margin-top:12px;

}

.qty-box button{

    width:54px;

    height:54px;

    border:none;

    border-radius:50%;

    background:linear-gradient(135deg,#E7C85A,#C89C25);

    color:#111;

    font-size:24px;

    font-weight:700;

    cursor:pointer;

    transition:.3s;

}

.qty-box button:hover{

    transform:translateY(-3px) scale(1.05);

}

.qty-box input{

    width:90px !important;

    text-align:center;

    font-size:24px;

    font-weight:700;

    background:#111;

}
/* Total Card */

#quickOrderForm .mz-price{

    background:#1a1a1a;

    border:1px solid rgba(212,175,55,.12);

    border-radius:18px;

    padding:20px 24px;

    margin-top:30px;

}

#quickOrderForm .mz-price span{

    color:#BDBDBD;

}

#quickOrderForm .mz-price strong{

    font-size:42px;

    color:#D4AF37;

}
.mz-order-submit{

    width:100%;

    margin-top:25px;

    height:62px;

    border:none;

    border-radius:18px;

    background:linear-gradient(135deg,#25D366,#18B954);

    color:#fff;

    font-size:18px;

    font-weight:700;

    cursor:pointer;

    transition:.35s;

    box-shadow:0 18px 35px rgba(37,211,102,.28);

}

.mz-order-submit:hover{

    transform:translateY(-4px);

    box-shadow:0 22px 45px rgba(37,211,102,.38);

}
@keyframes mzFade{

from{

opacity:0;

transform:translateY(20px);

}

to{

opacity:1;

transform:none;

}

}
/*======================================
        RESPONSIVE V2
======================================*/

@media (max-width:1100px){

    .mz-modal-grid{
    display:grid;
    grid-template-columns:55% 45%;
    height:100%;
}

    .mz-modal-grid{

        grid-template-columns:1fr;

    }

    .mz-modal-image{

        border-right:none;
        border-bottom:1px solid rgba(255,255,255,.06);

    }

}

@media (max-width:768px){

    .mz-modal{

        padding:12px;

    }

    .mz-modal-content{

    padding:45px;

    overflow-y:auto;

    display:flex;

    flex-direction:column;

}

    .mz-modal-content h2{

        font-size:36px;

    }

    .quick-title{

        font-size:34px;

    }

    .quick-price{

        font-size:34px;

    }

    .mz-modal-buttons{

        flex-direction:column;

    }

    .qty-box{

        gap:10px;

    }

    .qty-box button{

        width:48px;
        height:48px;

    }

}
.mz-modal.active .mz-modal-box{

    animation:mzPopup .45s cubic-bezier(.22,1,.36,1);

}

@keyframes mzPopup{

    from{

        opacity:0;
        transform:translateY(40px) scale(.96);

    }

    to{

        opacity:1;
        transform:none;

    }

}
.mz-close{

    position:absolute;

    top:22px;

    right:22px;

    width:52px;

    height:52px;

    border:none;

    border-radius:50%;

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

    backdrop-filter:blur(10px);

    color:#fff;

    cursor:pointer;

    transition:.35s;

    z-index:100;

}

.mz-close:hover{

    background:#D4AF37;

    color:#111;

    transform:rotate(90deg);

}
.mz-modal-box::-webkit-scrollbar{

    width:8px;

}

.mz-modal-box::-webkit-scrollbar-track{

    background:#181818;

}

.mz-modal-box::-webkit-scrollbar-thumb{

    background:#D4AF37;

    border-radius:20px;

}
.mz-image-btn i{

    transition:.35s;

}

.mz-image-btn:hover i{

    transform:scale(1.2);

}