:root{
  --manga:#F7A21B; --manga-2:#FFC93C; --laranja:#E8650E; --verde:#2E9E44; --verde-esc:#1F7A33;
  --creme:#FFF7E6; --creme-2:#FFEFD0; --tinta:#3B2412; --tinta-2:#6B4E36; --linha:#F0DEC0;
  --branco:#fff; --erro:#C8341B; --raio:18px; --sombra:0 6px 24px rgba(91,52,11,.12);
  --fonte:"Nunito","Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--fonte);color:var(--tinta);background:var(--creme);line-height:1.4}
img{max-width:100%;display:block}
button{font:inherit;color:inherit;cursor:pointer}
a{color:var(--laranja)}
.wrap{max-width:720px;margin:0 auto;padding:0 16px}

/* Topo */
.topo{background:radial-gradient(120% 90% at 50% 0%,#FFE7A3 0%,#FFD36B 45%,#F7A21B 100%);padding:22px 0 54px;position:relative;overflow:hidden}
.topo:after{content:"";position:absolute;left:-10%;right:-10%;bottom:-40px;height:80px;background:var(--creme);border-radius:50% 50% 0 0}
.topo .wrap{position:relative;z-index:1;text-align:center}
.logo{width:min(300px,78vw);margin:0 auto 6px;filter:drop-shadow(0 6px 10px rgba(120,60,0,.25))}
.slogan{margin:0 0 12px;font-weight:700;color:#5A3010;font-size:15px}
.pilula{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;border-radius:999px;font-weight:800;font-size:14px;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.08)}
.pilula i{width:9px;height:9px;border-radius:50%;background:var(--verde);box-shadow:0 0 0 4px rgba(46,158,68,.18)}
.pilula.fechado i{background:var(--erro);box-shadow:0 0 0 4px rgba(200,52,27,.15)}
.infos{display:flex;justify-content:center;flex-wrap:wrap;gap:6px 14px;margin-top:12px;font-size:13px;color:#5A3010;font-weight:700}
.infos span{display:inline-flex;align-items:center;gap:5px}
.infos svg{width:15px;height:15px}

.avisos{margin-top:-30px;position:relative;z-index:2;display:grid;gap:8px}
.aviso{background:#fff;border-radius:14px;padding:12px 14px;box-shadow:var(--sombra);font-size:14px;font-weight:700;display:flex;gap:10px;align-items:center}
.aviso.verde{background:var(--verde);color:#fff}
.aviso.fechado{background:#FFE3DC;color:#7A1F0E}
.aviso a{color:inherit}

/* Abas */
.abas{position:sticky;top:0;z-index:20;background:var(--creme);border-bottom:1px solid var(--linha);margin-top:14px}
.abas .wrap{display:flex;gap:8px;overflow-x:auto;padding:10px 16px;scrollbar-width:none}
.abas .wrap::-webkit-scrollbar{display:none}
.aba{white-space:nowrap;border:0;background:#fff;padding:8px 14px;border-radius:999px;font-weight:800;font-size:14px;box-shadow:0 1px 4px rgba(0,0,0,.06)}
.aba.ativa{background:var(--tinta);color:#fff}

/* Destaques */
.sec-titulo{font-size:20px;font-weight:900;margin:22px 0 10px;letter-spacing:-.2px}
.destaques{display:flex;gap:12px;overflow-x:auto;padding:2px 2px 8px;scroll-snap-type:x mandatory;scrollbar-width:none}
.destaques::-webkit-scrollbar{display:none}
.dest{flex:0 0 150px;scroll-snap-align:start;background:#fff;border-radius:16px;overflow:hidden;box-shadow:var(--sombra);border:0;padding:0;text-align:left}
.dest .ft{aspect-ratio:1/1;background:var(--creme-2);position:relative}
.dest .ft img{width:100%;height:100%;object-fit:cover}
.dest .tx{padding:9px 10px 11px}
.dest b{display:block;font-size:14px;line-height:1.2;min-height:34px}
.dest .pr{font-weight:900;color:var(--verde-esc);margin-top:4px}
.selo{position:absolute;left:8px;top:8px;background:var(--tinta);color:#fff;font-size:11px;font-weight:800;padding:3px 8px;border-radius:999px}

/* Produtos */
.cat{scroll-margin-top:64px}
.prod{display:flex;gap:12px;width:100%;text-align:left;background:#fff;border:0;border-radius:var(--raio);padding:12px;margin-bottom:10px;box-shadow:0 2px 10px rgba(91,52,11,.07);align-items:stretch}
.prod .tx{flex:1;min-width:0;display:flex;flex-direction:column}
.prod h3{margin:0 0 4px;font-size:16px;font-weight:900}
.prod p{margin:0;color:var(--tinta-2);font-size:13.5px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.prod .pr{margin-top:auto;padding-top:8px;font-weight:900;font-size:16px;color:var(--verde-esc)}
.prod .ft{width:104px;height:104px;flex:0 0 104px;border-radius:14px;overflow:hidden;background:var(--creme-2);position:relative}
.prod .ft img{width:100%;height:100%;object-fit:cover}
.prod.esgotado{opacity:.55}
.tag-esg{display:inline-block;background:#EEE;color:#555;font-size:11px;font-weight:800;padding:2px 8px;border-radius:999px;margin-left:6px;vertical-align:middle}
.sem-foto{width:100%;height:100%;display:grid;place-items:center;font-weight:900;font-size:30px;color:#fff;background:linear-gradient(135deg,var(--manga-2),var(--laranja))}

/* Rodapé */
.rodape{margin:30px 0 120px;padding:18px;background:#fff;border-radius:var(--raio);font-size:14px;color:var(--tinta-2)}
.rodape h4{margin:0 0 8px;color:var(--tinta)}
.rodape table{border-collapse:collapse;width:100%}
.rodape td{padding:3px 0}
.rodape td:last-child{text-align:right;font-weight:700}
.rodape .hoje td{color:var(--laranja)}
.links{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}

/* Botões */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:14px;padding:14px 18px;font-weight:900;font-size:16px;text-decoration:none;background:var(--tinta);color:#fff;min-height:50px}
.btn.verde{background:var(--verde)}
.btn.laranja{background:var(--laranja)}
.btn.claro{background:#fff;color:var(--tinta);border:2px solid var(--linha)}
.btn.bloco{width:100%}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn svg{width:20px;height:20px}

/* Barra da sacola */
.barra{position:fixed;left:0;right:0;bottom:0;z-index:30;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:linear-gradient(transparent,rgba(255,247,230,.95) 30%)}
.barra .btn{max-width:696px;margin:0 auto;display:flex;width:100%;justify-content:space-between;box-shadow:0 8px 24px rgba(30,90,40,.35)}
.barra .qt{background:rgba(255,255,255,.22);border-radius:8px;padding:2px 9px;font-size:14px}

/* Folhas (modais de baixo) */
.fundo{position:fixed;inset:0;background:rgba(40,20,5,.45);z-index:40;opacity:0;pointer-events:none;transition:opacity .2s}
.fundo.on{opacity:1;pointer-events:auto}
.folha{position:fixed;left:0;right:0;bottom:0;z-index:50;background:var(--creme);border-radius:22px 22px 0 0;max-height:92vh;overflow:auto;transform:translateY(105%);visibility:hidden;transition:transform .25s ease,visibility 0s linear .25s;box-shadow:0 -10px 40px rgba(0,0,0,.2)}
.folha.on{transform:none;visibility:visible;transition:transform .25s ease,visibility 0s}
@media(min-width:760px){.folha{left:50%;width:720px;margin-left:-360px}}
.folha .cab{position:sticky;top:0;background:var(--creme);display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--linha);z-index:2}
.folha .cab h2{margin:0;font-size:18px;font-weight:900}
.fechar{border:0;background:#fff;width:38px;height:38px;border-radius:50%;font-size:22px;line-height:1;box-shadow:0 1px 4px rgba(0,0,0,.1)}
.folha .corpo{padding:16px}
.folha .pe{position:sticky;bottom:0;background:var(--creme);padding:12px 16px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--linha)}
.prod-ft-grande{aspect-ratio:4/3;max-height:300px;width:100%;object-fit:cover;border-radius:16px;background:var(--creme-2)}
.qtd{display:inline-flex;align-items:center;background:#fff;border-radius:12px;border:2px solid var(--linha)}
.qtd button{border:0;background:none;width:42px;height:42px;font-size:22px;font-weight:900;color:var(--laranja)}
.qtd span{min-width:26px;text-align:center;font-weight:900}
.linha-add{display:flex;gap:10px;align-items:center}
.linha-add .btn{flex:1;justify-content:space-between}

/* Formulários */
label.rot{display:block;font-weight:800;font-size:14px;margin:14px 0 6px}
.campo{width:100%;border:2px solid var(--linha);border-radius:12px;padding:12px 13px;font:inherit;font-size:16px;background:#fff;color:var(--tinta)}
.campo:focus{outline:none;border-color:var(--manga)}
textarea.campo{min-height:64px;resize:vertical}
.ajuda{font-size:12.5px;color:var(--tinta-2);margin-top:4px}
.duplo{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.seg{display:grid;grid-template-columns:1fr 1fr;background:#fff;border-radius:14px;padding:4px;border:2px solid var(--linha)}
.seg button{border:0;background:none;padding:11px;border-radius:10px;font-weight:900}
.seg button.on{background:var(--tinta);color:#fff}
.opcao{display:flex;gap:12px;align-items:center;background:#fff;border:2px solid var(--linha);border-radius:14px;padding:12px 14px;margin-bottom:8px;cursor:pointer}
.opcao input{width:20px;height:20px;accent-color:var(--verde)}
.opcao b{display:block}
.opcao small{color:var(--tinta-2)}
.opcao.on{border-color:var(--verde);background:#F2FBF3}

.item-sacola{display:flex;gap:10px;align-items:center;background:#fff;border-radius:14px;padding:10px;margin-bottom:8px}
.item-sacola .tx{flex:1;min-width:0}
.item-sacola b{display:block;font-size:14.5px}
.item-sacola small{color:var(--tinta-2);display:block}
.item-sacola .qtd button{width:34px;height:34px;font-size:18px}
.resumo{background:#fff;border-radius:14px;padding:12px 14px;margin-top:14px}
.resumo div{display:flex;justify-content:space-between;padding:3px 0;font-size:15px}
.resumo .tot{font-weight:900;font-size:18px;border-top:1px dashed var(--linha);margin-top:6px;padding-top:8px}
.resumo .desc{color:var(--verde-esc);font-weight:800}
.erro{background:#FFE3DC;color:#7A1F0E;border-radius:12px;padding:10px 12px;font-weight:700;font-size:14px;margin-top:12px}
.vazio{text-align:center;color:var(--tinta-2);padding:30px 0}
.oculto{display:none!important}

/* Página do pedido */
.mini-topo{background:linear-gradient(135deg,#FFD36B,#F7A21B);padding:12px 0}
.mini-topo .wrap{display:flex;align-items:center;justify-content:space-between}
.mini-topo img{height:48px;width:auto}
.mini-topo a{font-weight:800;color:var(--tinta);text-decoration:none;font-size:14px}
.cartao{background:#fff;border-radius:var(--raio);padding:16px;margin-top:14px;box-shadow:0 2px 10px rgba(91,52,11,.07)}
.cartao h2{margin:0 0 10px;font-size:18px}
.num{font-size:13px;font-weight:800;color:var(--tinta-2);text-transform:uppercase;letter-spacing:.5px}
.status-grande{font-size:24px;font-weight:900;margin:4px 0 2px}
.linha-tempo{list-style:none;padding:0;margin:14px 0 0}
.linha-tempo li{position:relative;padding:0 0 16px 30px;color:#B59B7E;font-weight:700}
.linha-tempo li:before{content:"";position:absolute;left:6px;top:3px;width:14px;height:14px;border-radius:50%;background:#EADBC4}
.linha-tempo li:after{content:"";position:absolute;left:12px;top:19px;bottom:0;width:2px;background:#EADBC4}
.linha-tempo li:last-child:after{display:none}
.linha-tempo li.feito{color:var(--tinta)}
.linha-tempo li.feito:before{background:var(--verde)}
.linha-tempo li.agora{color:var(--tinta)}
.linha-tempo li.agora:before{background:var(--manga);box-shadow:0 0 0 5px rgba(247,162,27,.25);animation:pulso 1.4s infinite}
@keyframes pulso{50%{box-shadow:0 0 0 9px rgba(247,162,27,.08)}}
.codigo-ent{display:flex;align-items:center;gap:14px;background:var(--tinta);color:#fff;border-radius:16px;padding:14px 16px;margin-top:14px}
.codigo-ent strong{font-size:32px;letter-spacing:6px;font-variant-numeric:tabular-nums}
.codigo-ent small{display:block;opacity:.85;font-size:13px}
.qr{display:grid;place-items:center;background:#fff;border-radius:16px;padding:14px;border:2px dashed var(--linha)}
.qr svg,.qr img{width:220px;height:220px}
.copia{display:flex;gap:8px;margin-top:10px}
.copia input{flex:1;min-width:0;font-size:13px}
.contador{font-weight:900;color:var(--laranja)}
.itens-ped{margin:0;padding:0;list-style:none}
.itens-ped li{display:flex;justify-content:space-between;gap:10px;padding:5px 0;border-bottom:1px dashed var(--linha);font-size:15px}
.itens-ped li>span:last-child{white-space:nowrap}
.itens-ped small{display:block;color:var(--tinta-2)}
.ok-pago{background:#E6F6E9;color:var(--verde-esc);border-radius:12px;padding:10px 12px;font-weight:800}
.toast{position:fixed;left:50%;bottom:90px;transform:translateX(-50%) translateY(20px);background:var(--tinta);color:#fff;padding:10px 16px;border-radius:12px;font-weight:800;opacity:0;transition:.2s;z-index:60;pointer-events:none}
.toast.on{opacity:1;transform:translateX(-50%)}
.codigo-ent>div{flex:0 0 auto;white-space:nowrap}