:root{
  --brand:#1a1a1a;
  --accent:#ff004d;
  --mut:#6b7280;
  --card:#fff;
  --bg:#f7f7f8;
}

*{box-sizing:border-box}
html,body{margin:0}
body{
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial;
  background:var(--bg);
  color:#111;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{max-width:1120px;margin:0 auto;padding:0 16px}

/* ===== TOPO ===== */
header#topo .cover{
  background:var(--brand);
  background-size:cover;background-position:center;
  color:#fff;padding:24px 0;position:relative;
}
header#topo .borda{height:6px;background:linear-gradient(90deg,#fff,rgba(255,255,255,.25));opacity:.5;margin-top:12px}
header .info{padding:16px 0}
header .info h1{margin:8px 0 6px;font-size:28px;display:flex;gap:10px;align-items:center}
header .info h1 img{height:40px}
header .info .detalhe{
  background:#111;color:#fff;border-radius:12px;padding:6px 10px;
  display:flex;gap:12px;align-items:center;width:max-content
}
.aberto{color:#10b981;font-weight:700;margin-top:6px}

#menuCategorias{background:#111;color:#fff}
#menuCategorias .categorias{display:flex;gap:12px;overflow:auto}
#menuCategorias a{color:#fff;padding:10px 14px;display:inline-block;font-weight:600}

/* ===== LISTA HOME ===== */
.alert{padding:10px 14px;border-radius:12px;margin:12px 0}
.alert-success{background:#e8f6ed;color:#0b7a3a}

.categoria h2{font-size:22px;margin:18px 0}
.produtos{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
.item{
  background:var(--card);border:1px solid #eee;border-radius:16px;overflow:hidden;transition:.2s
}
.item:hover{box-shadow:0 10px 30px rgba(0,0,0,.08);transform:translateY(-2px)}
.item a{display:flex;gap:8px;align-items:center;justify-content:space-between;padding:12px}
.item .texto h3{margin:0 0 4px;font-size:17px}
.item .texto span{display:block;color:var(--mut);font-size:13px}
.preco{font-weight:800;color:#111}
.precoPromocao{text-decoration:line-through;color:#9b1c1c}

/* ===== PÁGINA DE PRODUTO ===== */
.containerFinalizar{padding:16px}
#detalhesProduto .info1{display:grid;grid-template-columns:1fr 1.4fr;gap:18px}
#detalhesProduto .descricao h3{margin:0 0 8px}

.tipo{border:1px solid #eee;border-radius:12px;margin-top:14px;overflow:hidden;background:var(--card)}
.tipo .topo{background:#fafafa;padding:10px 12px;display:flex;align-items:center;justify-content:space-between}
.tipo .opcoes{padding:10px 12px;border-top:1px solid #f1f1f1}
.tipo .nome{display:flex;align-items:center;gap:8px}

.opcoes input[type=checkbox]{display:none}

/* >>> ESTILO DOS “QUADRADINHOS” APENAS NO BLOCO DE SABORES <<< */
#escolha-seu-sabor .opcoes input[type=checkbox] + label{
  display:inline-block;width:18px;height:18px;border:2px solid #ccc;border-radius:6px;cursor:pointer
}
#escolha-seu-sabor .opcoes input[type=checkbox]:checked + label{
  background:var(--accent);border-color:var(--accent)
}

.escolhidos{font-weight:700}

/* BOTÕES */
a.btn,button.btn{
  display:inline-block;background:var(--accent);color:#fff;
  padding:10px 14px;border-radius:10px;margin:12px 0;border:0;cursor:pointer
}
a.voltar{display:inline-block;background:#111;color:#fff;padding:8px 12px;border-radius:10px;margin:8px 0}

/* GRID RESPONSIVO NA PÁGINA DE PRODUTO */
@media(max-width:860px){
  #detalhesProduto .info1{grid-template-columns:1fr}
}

/* ===== NOTIFIER ===== */
.notifier{
  position:fixed;left:16px;bottom:16px;background:#111;color:#fff;
  padding:10px 14px;border-radius:12px;box-shadow:0 8px 30px rgba(0,0,0,.25)
}
.notifier b{color:#10b981}
