/* ===================== BASE & VARIABLES ===================== */
:root{
    --radius-card:14px;
    --font-catalogo:"Noto Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

body{
    background:var(--color-bg);
    color:var(--color-text);
}

/* ===================== WRAPPER ===================== */
.wrapper{
    padding-bottom:70px;
}

@media (min-width: 992px){
    .wrapper{
        padding-bottom:0;
    }
}

/* ===================== HERO BASE ===================== */
.moovex-hero{
    position:relative;
}


/* ===================== HERO CAPA ===================== */
.hero-bg{
    height:120px;
    background-size:cover;
    background-position:center;
    position:relative;
}

.hero-bg-theme{
    background:linear-gradient(
        135deg,
        var(--color-primary),
        color-mix(in srgb, var(--color-primary) 70%, #000)
    );
}

.hero-overlay{
    position:absolute;
    inset:0;
    background:linear-gradient(
        180deg,
        rgba(10,35,80,.35) 0%,
        rgba(0,0,0,.55) 100%
    );
    backdrop-filter:blur(2px);
}


/* ===================== HERO CONTEÚDO ===================== */
.hero-content{
    margin-top:-55px;
    position:relative;
    z-index:2;
}

.hero-row{
    display:grid;
    grid-template-columns:70px 1fr auto;
    gap:12px;
    align-items:start;
}


/* ===================== HERO LOGO ===================== */
.hero-logo img{
    width:68px;
    height:68px;
    border-radius:50%;
    object-fit:cover;
    background:#fff;
    border:3px solid #fff;
}


/* ===================== HERO INFO ===================== */
.hero-info{
    color:#fff;
    text-shadow:0 2px 6px rgba(0,0,0,.6);
}

.hero-header{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
}


/* ===================== HERO TIPOGRAFIA ===================== */
.hero-title{
    font-size:1rem;
    font-weight:700;
    margin:0;
}

.hero-description{
    font-size:.75rem;
    opacity:.9;
}


/* ===================== HERO STATUS ===================== */
.hero-status-area{
    display:flex;
    flex-direction:column;
    align-items:flex-end;
    gap:6px;
}

.hero-status{
    font-size:.65rem;
    padding:5px 12px;
    border-radius:20px;
    font-weight:600;
    color:#f1f1f1;
}

.hero-status.open{
    background:rgba(46,125,50,.9);
    box-shadow:0 4px 12px rgba(46,125,50,.35);
}

.hero-status.closed{
    background:rgba(211,47,47,.9);
}


/* ===================== HERO TEMPOS ===================== */
.hero-times{
    display:flex;
    gap:6px;
    margin-top:2px;
}

.hero-chip{
    background:rgba(255,255,255,.20);
    padding:3px 7px;
    border-radius:10px;
    font-size:.65rem;
    font-weight:500;
    color:#f1f1f1;
}


/* ===================== HERO PEDIDO MÍNIMO ===================== */
.hero-minimo{
    margin-top:2px;
}

.hero-chip-warning{
    background-color:rgba(255,193,7,.15);
    color:#856404;
}


/* ===================== HERO ENDEREÇO ===================== */
.hero-address{
    background:#fff;
    text-align:center;
    padding:10px;
    font-size:.75rem;
    color:#555;
}


/* ===================== HERO RESPONSIVO ===================== */
@media (min-width: 992px){

    .hero-row{
        grid-template-columns:90px 1fr auto;
        gap:16px;
    }

    .hero-logo img{
        width:80px;
        height:80px;
    }

}


/* ===================== CARDÁPIO ===================== */
.public-cardapio{
    background:var(--color-bg);
    padding:.75rem;
    border-radius:1rem;
}


/* ===================== CATEGORIAS ===================== */
.categoria-bloco h2{
    font-size:1rem;
}


/* ===================== DESTAQUES ===================== */
.destaques-section{
    margin-bottom:14px;
}

.destaques-title{
    font-size:1.4rem;
    font-weight:800;
    margin:0 0 10px;
}

.destaques-carousel{
    display:flex;
    gap:12px;
    overflow-x:auto;
    padding-bottom:6px;
    scroll-behavior:auto;
    scroll-snap-type:none;
    scrollbar-width:none;
    -ms-overflow-style:none;
}

.destaques-carousel::-webkit-scrollbar{
    display:none;
    width:0;
    height:0;
}

.destaques-carousel::-webkit-scrollbar-thumb{
    background:rgba(0,0,0,.2);
    border-radius:999px;
}

.destaque-card{
    flex:0 0 calc((100% - 12px) / 1.5);
    min-width:220px;
    max-width:360px;
}

.destaque-card .catalogo-thumb{
    min-height:170px;
    aspect-ratio:16 / 10;
    overflow:hidden;
}

.destaque-card .catalogo-thumb img{
    width:100%;
    height:100%;
    max-width:none;
    max-height:none;
    object-fit:cover;
    transform:scale(1.06);
}

.public-cardapio.catalogo-mode > .destaques-section{
    grid-column:1 / -1;
}


/* ===================== PRODUTO CARD ===================== */
.produto-card{
    background:#fff;
    border-radius:1.25rem;
    margin-bottom:.75rem;
    padding:.75rem;
}

.produto-card:active{
    background:#fafafa;
}

.produto-card-inner{
    display:flex;
    align-items:center;
    gap:.75rem;
}

.produto-clickable{
    cursor:pointer;
}

.produto-clickable:active{
    transform:scale(.995);
}


/* ===================== PRODUTO IMAGEM ===================== */
.produto-thumb{
    width:80px;
    height:80px;
    border-radius:1rem;
    overflow:hidden;
    background:#f1f1f1;
}

.produto-thumb img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.produto-thumb-placeholder{
    width:100%;
    height:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#bbb;
}


/* ===================== PRODUTO TEXTO ===================== */
.produto-nome{
    font-size:.95rem;
    font-weight:600;
}

/* ===================== CATALOGO GRID (MOBILE) ===================== */
.public-cardapio.catalogo-mode{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:10px;
    font-family:var(--font-catalogo);
}

.public-cardapio.catalogo-mode .categoria-bloco,
.public-cardapio.catalogo-mode > .text-center,
.public-cardapio.catalogo-mode > p{
    grid-column:1 / -1;
}

.catalogo-card{
    margin:0;
    font-family:var(--font-catalogo);
}

.catalogo-card-inner{
    padding:10px;
}

.catalogo-badge-promo{
    z-index:1;
    font-size:11px;
    background:#d84a63;
}

.catalogo-thumb{
    background:#f4f4f4;
    min-height:120px;
}

.catalogo-thumb img{
    max-height:110px;
    max-width:100%;
    object-fit:contain;
}

.catalogo-titulo{
    font-size:.93rem;
    line-height:1.25;
    min-height:2.4em;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
}

.catalogo-descricao{
    color:#6c757d;
    font-size:.8rem;
    line-height:1.25;
    min-height:2.5em;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
}

.catalogo-preco-antigo{
    color:#7d7d7d;
    text-decoration:line-through;
    font-size:.8rem;
    line-height:1;
}

.catalogo-preco{
    font-size:1.08rem;
    font-weight:700;
    line-height:1.1;
}

.catalogo-btn-add{
    width:32px;
    height:32px;
    border:none;
    border-radius:999px;
    background:var(--color-action);
    color:#fff;
    font-size:1.2rem;
    font-weight:700;
    line-height:1;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 4px 12px rgba(0,0,0,.18);
}

.catalogo-btn-add:active{
    transform:scale(.96);
}

@media (min-width: 992px){
    .public-cardapio.catalogo-mode{
        grid-template-columns:repeat(3, minmax(0, 1fr));
        gap:12px;
    }
}

#modalProduto .modal-content.catalogo-modal{
    font-family:var(--font-catalogo);
}

.produto-descricao{
    font-size:.8rem;
    color:var(--color-text);
    opacity:.7;
    margin-bottom:.35rem;

    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
}


/* ===================== PRODUTO PREÇO ===================== */
.produto-footer{
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.produto-precos{
    display:flex;
    gap:.4rem;
}

.preco-antigo{
    font-size:.75rem;
    color:#999;
    text-decoration:line-through;
}

.preco-atual{
    font-size:.9rem;
    font-weight:700;
    color:var(--color-action);
}


/* ===================== PRODUTO BOTÃO ===================== */
.produto-btn-add{
    width:36px;
    height:36px;
    border-radius:50%;
    background:var(--color-action);
    box-shadow:0 6px 14px rgba(0,0,0,.15);
    transition:transform .12s ease;
    color:#fff;
    border:none;

    display:flex;
    align-items:center;
    justify-content:center;
}

.produto-btn-add i{
    font-size:1.2rem;
}

.produto-btn-add:active{
    transform:scale(.92);
}


/* ===================== TAG PROMOÇÃO ===================== */
.tag-promo{
    font-size:.65rem;
    font-weight:600;
    padding:2px 6px;
    border-radius:9px;
    border:1.5px solid red;
    color:red;
}


/* ===================== MODAL PRODUTO BASE ===================== */
.modal-content{
    max-height:90vh;
    display:flex;
    flex-direction:column;
    border-radius:16px;
}

.modal-body{
    flex:1;
    overflow-y:auto;
    padding:1.25rem;
}


/* ===================== MODAL IMAGEM ===================== */
.produto-modal-img{
    width:100%;
    height:180px;
    overflow:hidden;
}

.produto-modal-img img{
    width:100%;
    height:100%;
    object-fit:cover;
}


/* ===================== VARIAÇÕES ===================== */
.variacao-bloco{
    padding:14px 0;
}

.variacao-titulo{
    font-size:14px;
    font-weight:600;
}

.variacao-subtitulo{
    font-size:12px;
    opacity:.7;
}

.contador-variacao{
    background:#eef1f4;
    font-size:12px;
    padding:4px 8px;
    border-radius:6px;
}

.badge-obrigatorio{
    background:#6c757d;
    color:#fff;
    font-size:11px;
    padding:4px 8px;
    border-radius:6px;
}


/* ===================== OPÇÕES ===================== */
.opcao-item{
    padding:12px;
    border-bottom:1px solid #f1f1f1;

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

    gap:12px;
    cursor:pointer;
    border-radius:10px;
    transition:all .18s ease;
}

.opcao-item:hover{
    background:rgba(0,0,0,.03);
}

.opcao-item.selected{
    background:rgba(0,0,0,.04);
    border:1px solid var(--color-action);
}

.opcao-nome{
    font-size:13px;
    font-weight:500;
}

.opcao-valor{
    font-size:12px;
    opacity:.7;
}


/* ===================== OPÇÃO IMAGEM ===================== */
.opcao-img{
    width:44px;
    height:44px;
    border-radius:10px;
    overflow:hidden;
    flex-shrink:0;
}

.opcao-img img{
    width:100%;
    height:100%;
    object-fit:cover;
}


/* ===================== CONTROLE OPÇÕES ===================== */
.controle-opcao-qtd{
    background:#f4f6f8;
    border-radius:999px;
    padding:4px;
    display:flex;
    align-items:center;
    gap:6px;
}

.btn-opcao-mais,
.btn-opcao-menos{
    width:28px;
    height:28px;
    border-radius:50%;
    border:none;
}

.btn-opcao-mais{
    background:var(--color-action);
    color:#fff;
}

.btn-opcao-menos{
    background:#fff;
}


/* ===================== FOOTER MODAL ===================== */
.produto-footer-fixo{
    border-top:1px solid #eee;
    padding:12px 16px;
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
    align-items:center;
    background:#fff;
}

.produto-footer-fixo #produto-modal-error{
    flex:0 0 100%;
}

.controle-qtd{
    background:#f1f1f1;
    border-radius:8px;
    padding:4px 12px;
    display:flex;
    gap:14px;
}

.btn-adicionar-produto{
    background:var(--color-action);
    color:#fff;
    border:none;
    padding:10px 18px;
    border-radius:8px;
}


/* ===================== MODAL PRODUTO DESKTOP ===================== */

@media (min-width: 992px){

    /* modal maior e mais confortável */
    .modal-dialog{
        max-width:720px;
    }

    /* imagem mais alta */
    .produto-modal-img{
        height:220px;
    }

    /* mais respiro */
    .modal-body{
        padding:1.5rem;
    }

    /* opções com mais espaçamento */
    .opcao-item{
        padding:14px;
    }

    /* footer mais confortável */
    .produto-footer-fixo{
        padding:16px 20px;
    }

    /* botão maior (melhor UX desktop) */
    .btn-adicionar-produto{
        padding:12px 22px;
        font-size:15px;
    }

}


/* ===================== CARRINHO ===================== */

.carrinho-wrapper{
    height:calc(100vh - 64px);
    display:flex;
    flex-direction:column;
}

/* área que rola */

.carrinho-scroll{
    flex:1;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    padding-bottom:140px;
}

/* botão voltar */

.btn-voltar{
    width:36px;
    height:36px;
    border:none;
    border-radius:10px;
    background:var(--color-bg);
    display:flex;
    align-items:center;
    justify-content:center;
}

/* lista */

.carrinho-lista{
    display:flex;
    flex-direction:column;
    gap:12px;
}

/* card item */

.carrinho-item{
    background:#fff;
    border:1px solid rgba(0,0,0,.04);
    border-radius:var(--radius-card);
    padding:14px;
    box-shadow:0 2px 6px rgba(0,0,0,.05);
}

/* header item */

.carrinho-item-header{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:10px;
}

.carrinho-item-info{
    display:flex;
    align-items:center;
    gap:10px;
    min-width:0;
}

.carrinho-thumb{
    width:44px;
    height:44px;
    border-radius:10px;
    overflow:hidden;
    background:#f1f1f1;
    flex-shrink:0;
}

.carrinho-thumb img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.carrinho-produto{
    font-size:14px;
    font-weight:600;
    line-height:1.2;
}

.carrinho-preco{
    font-weight:700;
    color:var(--color-action);
}

/* variações */

.carrinho-variacao{
    margin-top:6px;
}

.carrinho-variacao-nome{
    font-size:12px;
    font-weight:600;
    opacity:.8;
}

/* opções */

.carrinho-opcao{
    font-size:12px;
    display:flex;
    justify-content:space-between;
}

.carrinho-opcao-preco{
    opacity:.8;
}

/* ações do item */

.carrinho-item-acoes{
    display:flex;
    justify-content:flex-end;
    gap:8px;
    margin-top:10px;
}

.btn-carrinho-editar,
.btn-carrinho-remover{
    border:none;
    font-size:12px;
    font-weight:600;
    padding:6px 10px;
    border-radius:8px;
    display:flex;
    align-items:center;
    gap:4px;
}

.btn-carrinho-editar{
    background:#f1f3f5;
}

.btn-carrinho-remover{
    background:#ffe5e5;
    color:#d64545;
}

/* subtotal */

.carrinho-subtotal{
    margin-top:16px;
    padding:12px 4px;
    display:flex;
    justify-content:space-between;
    border-top:1px solid #eee;
}


/* ===================== BOTÃO FINALIZAR CARRINHO ===================== */

.carrinho-finalizar{
    position:fixed;
    bottom:70px;
    left:0;
    right:0;
    padding:12px;
    background:#fff;
    border-top:1px solid #eee;
    box-shadow:0 -4px 16px rgba(0,0,0,0.08);
    z-index:1050;
}

.btn-finalizar-pedido{
    width:100%;
    border:none;
    border-radius:12px;
    padding:14px;
    font-weight:600;
    background:var(--color-action);
    color:#fff;
    display:flex;
    justify-content:space-between;
    align-items:center;
    text-decoration: none;
}

.btn-finalizar-pedido.is-disabled{
    opacity:.5;
    cursor:not-allowed;
    pointer-events:none;
    filter:grayscale(0.35);
}

.carrinho-minimo-alert{
    background:#fff3cd;
    color:#856404;
    border:1px solid #ffeeba;
    border-radius:10px;
    padding:10px 12px;
    font-size:12px;
    margin-bottom:10px;
}


/* ===================== CARRINHO VAZIO ===================== */

.carrinho-vazio{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    margin-top:60px;
    padding:20px;
}

.carrinho-vazio-icon{
    width:70px;
    height:70px;
    border-radius:20px;
    background:#f4f6f8;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:30px;
    margin-bottom:14px;
}

.carrinho-vazio h6{
    font-weight:700;
    margin-bottom:4px;
}

.carrinho-vazio p{
    font-size:13px;
    opacity:.7;
    margin-bottom:16px;
}

.btn-voltar-cardapio{
    background:var(--color-action);
    color:#fff;
    padding:10px 18px;
    border-radius:10px;
    text-decoration:none;
    font-size:13px;
    font-weight:600;
}


/* ===================== CARRINHO DESKTOP ===================== */

@media (min-width: 992px){

    /* wrapper não precisa travar altura */
    .carrinho-wrapper{
        height:auto;
    }

    /* scroll interno ajustado */
    .carrinho-scroll{
        padding-bottom:20px;
    }

    /* remove botão fixo */
    .carrinho-finalizar{
        position:static;
        bottom:auto;
        box-shadow:none;
        border-top:1px solid #eee;
        margin-top:auto; /* 🔥 ESSENCIAL */
    }

    /* botão mais confortável */
    .btn-finalizar-pedido{
        padding:16px;
        font-size:15px;
    }

}

/* ===================== CHECKOUT TIPO ===================== */

.checkout-shell{
    max-width:720px;
    margin:0 auto;
    display:flex;
    flex-direction:column;
    gap:14px;
}

.checkout-resumo{
    background:#fff;
    border:1px solid rgba(0,0,0,.05);
    border-radius:16px;
    padding:14px 16px;
    box-shadow:0 8px 20px rgba(0,0,0,.06);
}

.checkout-resumo-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
}

.checkout-resumo-label{
    font-size:13px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.04em;
    color:rgba(0,0,0,.65);
}

.checkout-resumo-total{
    font-size:18px;
    font-weight:800;
    color:var(--color-action);
}

.checkout-resumo-text{
    margin:6px 0 0;
    font-size:12px;
    color:rgba(0,0,0,.6);
}

.checkout-tipo{
    padding:18px 14px 8px;
    display:flex;
    flex-direction:column;
    gap:14px;
}

.checkout-tipo-hero{
    display:flex;
    flex-direction:column;
    gap:6px;
}

.checkout-tipo-eyebrow{
    text-transform:uppercase;
    letter-spacing:.08em;
    font-weight:700;
    font-size:11px;
    color:rgba(0,0,0,.55);
    margin:0;
}

.checkout-tipo-titulo{
    font-size:17px;
    font-weight:800;
    margin:0;
}

.checkout-tipo-sub{
    margin:0;
    font-size:12px;
    color:rgba(0,0,0,.6);
}

.checkout-tipo-grid{
    display:grid;
    gap:12px;
}

.checkout-tipo-card{
    width:100%;
    border:1px solid rgba(0,0,0,.04);
    border-radius:var(--radius-card);
    padding:14px 16px;

    display:flex;
    justify-content:flex-start;
    align-items:center;
    gap:12px;

    transition:all .15s ease;
    background:linear-gradient(135deg, #fff, rgba(255,255,255,.92));
    box-shadow:0 8px 18px rgba(0,0,0,.06);
    position:relative;
    overflow:hidden;
}

.checkout-tipo-card:active{
    transform:scale(.98);
    background:#fafafa;
}

.checkout-tipo-card:focus-visible{
    outline:2px solid var(--color-action);
    outline-offset:3px;
}

.checkout-tipo-card::after{
    content:"";
    position:absolute;
    inset:0;
    background:radial-gradient(circle at 20% 20%, rgba(0,0,0,.04), transparent 55%);
    pointer-events:none;
}

.checkout-tipo-icon{
    width:44px;
    height:44px;
    border-radius:12px;
    background:color-mix(in srgb, var(--color-action) 15%, #fff);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:22px;
    flex-shrink:0;
}

/* CONTEÚDO */

.checkout-tipo-info{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:4px;
    text-align:left;
}

.checkout-tipo-nome{
    font-size:15px;
    font-weight:700;
}

.checkout-tipo-desc{
    font-size:12px;
    opacity:.75;
}

/* SETA */

.checkout-tipo-arrow{
    font-size:16px;
    opacity:.55;
    margin-left:auto;
}

/* ===================== CHECKOUT DADOS ===================== */
.checkout-card{
    background:#fff;
    border:1px solid rgba(0,0,0,.05);
    border-radius:var(--radius-card);
    padding:16px;
    box-shadow:0 10px 22px rgba(0,0,0,.06);
}

.checkout-form{
    display:flex;
    flex-direction:column;
    gap:12px;
    margin-top:12px;
}

.checkout-form-grid{
    display:grid;
    gap:12px;
}

@media (min-width: 720px){
    .checkout-form-grid{
        grid-template-columns:1fr 1fr;
    }
}

.checkout-cep-inline{
    display:grid;
    grid-template-columns:minmax(0, 1fr) auto;
    gap:10px;
    align-items:center;
}

.checkout-cep-inline .checkout-cep-btn{
    width:110px !important;
    margin-top:0;
    padding:12px 10px;
    white-space:nowrap;
    margin-bottom:0;
    display:inline-flex;
    align-items:center;
    justify-content:center;
}

@media (min-width: 720px){
    .checkout-cep-inline .checkout-cep-btn{
        width:120px !important;
        min-width:120px;
    }
}

.checkout-form-group{
    display:flex;
    flex-direction:column;
    gap:6px;
}

.checkout-label{
    font-size:.9rem;
    font-weight:700;
    color:rgba(0,0,0,.75);
}

.checkout-input{
    width:100%;
    border:1px solid rgba(0,0,0,.08);
    border-radius:12px;
    padding:12px 14px;
    font-size:.95rem;
    background:#fafafa;
    transition:border-color .15s ease, box-shadow .15s ease;
}

.checkout-input:focus{
    outline:none;
    border-color:var(--color-action);
    box-shadow:0 0 0 3px color-mix(in srgb, var(--color-action) 25%, transparent);
    background:#fff;
}

.checkout-error{
    color:#d32f2f;
    font-size:.82rem;
}

.checkout-submit{
    width:100%;
    display:block;
    border:none;
    border-radius:14px;
    padding:14px;
    background:var(--color-action);
    color:#fff;
    font-weight:800;
    font-size:1rem;
    text-align:center;
    text-decoration:none;
    box-shadow:0 10px 22px rgba(0,0,0,.12);
    transition:transform .12s ease, box-shadow .12s ease, filter .12s ease;
}

.checkout-back{
    width:100%;
    border:1px solid rgba(0,0,0,.12);
    border-radius:14px;
    padding:12px;
    background:#f3f4f6;
    color:rgba(0,0,0,.78);
    font-weight:700;
    font-size:.95rem;
    text-align:center;
    text-decoration:none;
    display:block;
    margin-top:10px;
}

.checkout-submit:active{
    transform:translateY(1px);
    box-shadow:0 6px 14px rgba(0,0,0,.1);
}

/* ===================== CHECKOUT PAGAMENTO ===================== */
.checkout-resume-block{
    background:color-mix(in srgb, var(--color-bg) 70%, #fff);
    border:1px solid rgba(0,0,0,.04);
    border-radius:12px;
    padding:12px;
    display:flex;
    flex-direction:column;
    gap:10px;
    margin-top:10px;
}

.checkout-resume-line{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:8px;
    font-size:.95rem;
}

.checkout-resume-line span{
    color:rgba(0,0,0,.6);
}

.checkout-payment-options{
    display:flex;
    flex-direction:column;
    gap:10px;
    margin-top:14px;
}

.checkout-section{
    margin-top:16px;
}

.checkout-section-title{
    margin:0 0 8px;
    font-size:14px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.04em;
    color:rgba(0,0,0,.7);
}

.checkout-item-line{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:10px;
    font-size:.95rem;
}

.checkout-item-variacoes{
    margin-top:4px;
    font-size:.82rem;
    color:rgba(0,0,0,.62);
}

.checkout-empty-line{
    font-size:.9rem;
    color:rgba(0,0,0,.62);
}

.checkout-cupom{
    margin-top:10px;
}

.checkout-carrinho-lista{
    border-radius:12px;
    overflow:hidden;
}

.checkout-carrinho-subtotal{
    margin-top:0;
    padding:12px;
    border:1px solid rgba(0,0,0,.04);
    border-top:none;
    border-bottom-left-radius:12px;
    border-bottom-right-radius:12px;
    background:color-mix(in srgb, var(--color-bg) 70%, #fff);
}

.checkout-cupom-row{
    display:grid;
    grid-template-columns:1fr auto;
    gap:8px;
}

.checkout-cupom-btn{
    border:none;
    border-radius:12px;
    padding:0 16px;
    font-size:.9rem;
    font-weight:800;
    color:#fff;
    background:var(--color-action);
}

.checkout-resume-line-wrap{
    align-items:flex-start;
}

.checkout-resume-line-wrap strong{
    text-align:right;
}

.checkout-option{
    width:100%;
    border:1px solid rgba(0,0,0,.06);
    background:#fff;
    border-radius:14px;
    padding:14px;
    display:flex;
    justify-content:flex-start;
    align-items:center;
    gap:12px;
    box-shadow:0 10px 18px rgba(0,0,0,.06);
}

.checkout-option-label{
    cursor:pointer;
}

.checkout-option-label input[type="radio"]{
    margin:0;
    accent-color:var(--color-action);
}

.checkout-actions{
    margin-top:14px;
}

.checkout-actions-follow{
    margin-top:10px;
}

.checkout-option.primary{
    border-color:color-mix(in srgb, var(--color-action) 30%, #fff);
    box-shadow:0 12px 22px color-mix(in srgb, var(--color-action) 30%, rgba(0,0,0,.18));
}

.checkout-option.disabled{
    opacity:.55;
}

.checkout-option-title{
    font-weight:800;
    font-size:1rem;
    margin-bottom:2px;
}

.checkout-option-sub{
    margin:0;
    font-size:.9rem;
    color:rgba(0,0,0,.6);
}

.checkout-troco-box{
    margin-top:10px;
    border:1px solid rgba(0,0,0,.06);
    border-radius:14px;
    background:#fff;
    padding:12px 14px;
    box-shadow:0 8px 16px rgba(0,0,0,.05);
}

.checkout-troco-toggle{
    display:flex;
    align-items:center;
    gap:8px;
    font-size:.95rem;
    font-weight:700;
    color:rgba(0,0,0,.78);
}

.checkout-troco-toggle input[type="checkbox"]{
    accent-color:var(--color-action);
}

.checkout-troco-valor{
    margin-top:10px;
}

.checkout-mp-qr{
    margin-top:10px;
    display:flex;
    justify-content:center;
}

.checkout-mp-qr img{
    width:180px;
    height:180px;
    border-radius:12px;
    border:1px solid rgba(0,0,0,.08);
    background:#fff;
    object-fit:contain;
    padding:8px;
}

.pedidos-lista{
    display:flex;
    flex-direction:column;
    gap:10px;
    margin-top:10px;
}

.pedidos-item-conteudo{
    width:100%;
}

.pedidos-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    margin-bottom:4px;
}

.pedido-status-tag{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:999px;
    padding:4px 10px;
    font-size:.75rem;
    font-weight:800;
    line-height:1;
    border:1px solid transparent;
    white-space:nowrap;
}

.pedido-status-tag.status-enviado{
  color:#8a6116;
  background:#fff7e6;
  border-color:#f8dfb3;
}

.pedido-status-tag.status-pagamento_confirmado{
  color:#166534;
  background:#dcfce7;
  border-color:#86efac;
}

.pedido-status-tag.status-pagamento_pendente{
  color:#7a2e0f;
  background:#fff3e8;
  border-color:#fdba74;
}

.pedido-status-tag.status-pagamento_na_entrega{
  color:#1d4ed8;
  background:#dbeafe;
  border-color:#93c5fd;
}

.pedido-status-tag.status-aceito{
  color:#166534;
  background:#dcfce7;
  border-color:#86efac;
}

.pedido-status-tag.status-preparando{
    color:#5b21b6;
    background:#f3e8ff;
    border-color:#d8b4fe;
}

.pedido-status-tag.status-saiu_para_entrega{
  color:#065f46;
  background:#d1fae5;
  border-color:#6ee7b7;
}

.pedido-status-tag.status-aguardando_retirada_cliente{
  color:#5b21b6;
  background:#f3e8ff;
  border-color:#d8b4fe;
}

.pedido-status-tag.status-enviado_para_mesa{
  color:#155e75;
  background:#cffafe;
  border-color:#67e8f9;
}

.pedido-status-tag.status-finalizado{
    color:#1d4ed8;
    background:#dbeafe;
    border-color:#93c5fd;
}

.pedido-status-tag.status-cancelado{
    color:#b42318;
    background:#fdecec;
    border-color:#f8d1d1;
}

.pedido-status-tag.status-confirmado{
    color:#166534;
    background:#dcfce7;
    border-color:#86efac;
}

.cadastro-cta{
    margin-top:12px;
}

.cadastro-cta-text{
    margin-bottom:10px;
}

/* ===================== NAVEGATION ===================== */

.desktop-nav{
    position:fixed;
    top:14px;
    left:50%;
    transform:translateX(-50%);
    width:min(720px, calc(100% - 40px));
    padding:8px;
    background:var(--color-primary);
    border:1px solid rgba(0,0,0,.08);
    border-radius:16px;
    box-shadow:0 10px 30px rgba(0,0,0,.14);
    backdrop-filter:blur(8px);
    z-index:1200;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
}

.desktop-nav-item{
    position:relative;
    text-decoration:none;
    color:rgba(0,0,0,.68);
    border-radius:12px;
    padding:10px 14px;
    display:inline-flex;
    align-items:center;
    gap:8px;
    font-size:.95rem;
    font-weight:700;
    transition:background .15s ease, color .15s ease;
}

.desktop-nav-item:hover{
    background:rgba(0,0,0,.05);
    color:rgba(0,0,0,.86);
}

.desktop-nav-item.active{
    color:var(--color-action);
    background:color-mix(in srgb, var(--color-action) 14%, #fff);
}

.desktop-nav-badge{
    margin-left:4px;
    min-width:20px;
    height:20px;
    border-radius:999px;
    background:#dc3545;
    color:#fff;
    font-size:.72rem;
    font-weight:800;
    line-height:20px;
    text-align:center;
    padding:0 6px;
}

.bottom-nav{
    position:fixed;
    bottom:0;
    left:0;
    right:0;
    background:#fff;
    border-top:1px solid #eee;
    display:flex;
    justify-content:space-around;
    align-items:center;
    height:64px;
    z-index:1050;
}

.bottom-nav-item{
    flex:1;
    text-align:center;
    font-size:12px;
    color:#6c757d;
    text-decoration:none;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
}

.bottom-nav-item i{
    font-size:20px;
}

.bottom-nav-item.active{
    color:var(--color-action);
}

.bottom-nav-item.active i{
    color:var(--color-action);
}

.bottom-badge{
    position:absolute;
    top:6px;
    right:25%;
    background:#dc3545;
    color:#fff;
    font-size:10px;
    padding:2px 6px;
    border-radius:999px;
}

@media (min-width: 768px){
    body{
        padding-top:72px;
    }
}

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

.footer-publico{
    text-align:center;
    padding:15px 16px 25px;
    font-size:12px;
    color:#777;
}

/* texto principal */

.footer-copy{
    margin-bottom:10px;
}

/* bloco powered */

.footer-powered{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:8px;
    font-size:14px;
    opacity:.85;
}

/* link da marca */

.footer-link{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    text-decoration:none;
}

/* logo */

.footer-logo{
    height:40px;   /* 🔥 maior */
    transition:transform .2s ease, opacity .2s ease;
}

/* efeito hover (desktop) */

.footer-link:hover .footer-logo{
    transform:scale(1.05);
    opacity:.9;
}


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

@media (min-width: 992px){

    .footer-publico{
        padding:40px 16px;
    }

    .footer-logo{
        height:30px;
    }

}

/* ===================== LAYOUT DESKTOP ===================== */

.layout-desktop{
    display:block;
}

.col-carrinho{
    display:none;
}

@media (min-width: 992px){

    .layout-desktop{
        display:grid;
        grid-template-columns:1fr 340px;
        gap:24px;
        align-items:start;
    }

    .col-carrinho{
        display:block;
    }

    .carrinho-box{
        position:sticky;
        top:20px;

        background:#fff;
        border-radius:16px;

        height:calc(100vh - 40px);
        display:flex;
        flex-direction:column;

        overflow:hidden;
        box-shadow:0 8px 24px rgba(0,0,0,0.08);
    }

}

@media (min-width: 992px){

    .footer-publico{
        padding:32px 16px;
    }

}