/* ==========================================================================
   Tema D · MODO CLARO (html[data-modo="claro"], escolhido por public/modo.js)
   Mesmo layout do escuro (padrão iFood). Fundo creme/branco quente com um degradê suave de pêssego
   e um toque da chama no topo, cartões brancos com sombra leve, texto escuro e acentos vermelho/laranja.
   Contraste (AA): texto #1d1512 em #fbf3ec ≈ 16:1; secundário #6b5d55 ≈ 5,9:1; acento #c2410c em branco ≈ 5,2:1;
   texto branco nos botões vermelhos (#c4121a → #d63d1a) ≥ 4,6:1. Nórdicos: acento #b45309 (≈ 5:1).
   ========================================================================== */
html[data-tema="D"][data-modo="claro"][data-marca] {
  --bg: #fbf3ec; --surface: #ffffff; --surface-2: #f6ece4; --ink: #1d1512; --muted: #6b5d55; --line: rgba(29, 21, 18, .1);
  --brand: #c4121a; --brand-2: #e2361b; --brand-ink: #ffffff; --brand-soft: rgba(212, 21, 28, .08);
  --accent: #c2410c; --accent-soft: rgba(21, 127, 59, .1); --ok: #157f3b; --danger: #b42318; --danger-soft: rgba(180, 35, 24, .08); --warn: #8a5a00; --warn-soft: #fff1d6;
  --foto-a: #f4e6da; --foto-b: #ecd9c9; --foto-ponto: rgba(196, 18, 26, .05);
  --hero-bg: #fbf3ec; --hero-ink: #1d1512; --hero-muted: #6b5d55;
  --sombra-1: 0 1px 2px rgba(80, 40, 15, .06), 0 10px 26px -14px rgba(80, 40, 15, .22);
  --sombra-2: 0 18px 40px -18px rgba(80, 40, 15, .3);
  --brilho: 0 10px 24px -10px rgba(212, 21, 28, .45);
  --vidro: rgba(255, 255, 255, .82);
  --vidro-claro: #ffffff;
  --borda-vidro: rgba(29, 21, 18, .1);
  --acento-texto: #c2410c;
  color-scheme: light;
}
html[data-tema="D"][data-modo="claro"][data-marca="nordicos"] {
  --brand: #b45309; --brand-soft: rgba(245, 158, 11, .12); --accent: #b45309; --acento-texto: #b45309;
  --brand-ink: #160c00; /* os botões âmbar seguem com texto escuro, como no escuro (≈ 8,9:1) */
  --brilho: 0 10px 24px -10px rgba(217, 119, 6, .45);
}
/* fundo: creme quente, com pêssego/rosado bem leve e um toque da chama no topo
   (tamanhos em px: em % o brilho esticaria pela página inteira, que é longa) */
html[data-tema="D"][data-modo="claro"] body { background:
    radial-gradient(460px 300px at 88% -60px, rgba(242, 107, 29, .17), transparent 70%) no-repeat,
    radial-gradient(360px 240px at 0 -40px, rgba(212, 21, 28, .07), transparent 70%) no-repeat,
    linear-gradient(180deg, #ffe6d8 0, #fff1e8 172px, #fdf4ee 420px, #fbf3ec 760px) no-repeat, var(--bg); }
html[data-tema="D"][data-modo="claro"] a, html[data-tema="D"][data-modo="claro"] .add-mais, html[data-tema="D"][data-modo="claro"] .resumo-linha .ir, html[data-tema="D"][data-modo="claro"] .link, html[data-tema="D"][data-modo="claro"] .qtd-ctrl button, html[data-tema="D"][data-modo="claro"] .mc-preco, html[data-tema="D"][data-modo="claro"] .mc-ico, html[data-tema="D"][data-modo="claro"] .pp-ico, html[data-tema="D"][data-modo="claro"] .pp-linha, html[data-tema="D"][data-modo="claro"] .prev-ico, html[data-tema="D"][data-modo="claro"] .local-ico { color: var(--acento-texto); }
html[data-tema="D"][data-modo="claro"] .aviso-teste:not(.forte) { background: #fff1d6; color: #7a4b00; border-bottom-color: rgba(138, 90, 0, .2); }
html[data-tema="D"][data-modo="claro"] :focus-visible { outline-color: #c2410c; }

/* topo: a foto da capa "acaba" no creme, e não no preto */
html[data-tema="D"][data-modo="claro"] .hero-foto { background: radial-gradient(80% 60% at 50% 40%, #f3d9c6, #fbf3ec); }
html[data-tema="D"][data-modo="claro"] .hero-foto::after { background: linear-gradient(180deg, rgba(29, 21, 18, .28) 0%, rgba(29, 21, 18, 0) 34%, rgba(251, 243, 236, .2) 68%, #fff1e8 100%); }
html[data-tema="D"][data-modo="claro"] .hero-capa { background: transparent; } /* o degradê do fundo continua sem "faixas" */
html[data-tema="D"][data-modo="claro"] .hero-nome { color: var(--ink); }
html[data-tema="D"][data-modo="claro"] .logo { box-shadow: 0 10px 24px -8px rgba(80, 40, 15, .4); }
html[data-tema="D"][data-modo="claro"] .local { box-shadow: var(--sombra-1); }
html[data-tema="D"][data-modo="claro"] .pill-pedido { box-shadow: var(--sombra-1); }

/* barra fixa, cartões e listas */
html[data-tema="D"][data-modo="claro"] .selo-dia { color: #9a3412; } /* ≈ 6:1 no fundo rosado do selo */
html[data-tema="D"][data-modo="claro"][data-marca="nordicos"] .selo-dia { color: #92400e; }
html[data-tema="D"][data-modo="claro"][data-marca="nordicos"] .grupo legend .obrig { background: #f59e0b; }
html[data-tema="D"][data-modo="claro"] .fixo, html[data-tema="D"][data-modo="claro"] .fixo.preso { background: rgba(254, 244, 237, .95); box-shadow: 0 14px 30px -24px rgba(80, 40, 15, .5); }
html[data-tema="D"][data-modo="claro"] .busca { background: #fff; box-shadow: 0 1px 2px rgba(80, 40, 15, .06); }
html[data-tema="D"][data-modo="claro"] .card { background: #fff; }
html[data-tema="D"][data-modo="claro"] .itens .card { background: transparent; }
html[data-tema="D"][data-modo="claro"] .card-foto::after { display: none; }
html[data-tema="D"][data-modo="claro"] .itens .card-foto, html[data-tema="D"][data-modo="claro"] .carrossel .card-foto { box-shadow: 0 6px 16px -8px rgba(80, 40, 15, .35); }
html[data-tema="D"][data-modo="claro"] .card-selo, html[data-tema="D"][data-modo="claro"] .rank { color: var(--ink); }
html[data-tema="D"][data-modo="claro"] .itens .card-selo { color: var(--danger); }
html[data-tema="D"][data-modo="claro"] .card.meio, html[data-tema="D"][data-modo="claro"] .itens .card.meio { background: linear-gradient(90deg, rgba(242, 107, 29, .12), rgba(255, 255, 255, .7)); border-color: rgba(212, 21, 28, .25); }
html[data-tema="D"][data-modo="claro"] .card.meio .card-foto, html[data-tema="D"][data-modo="claro"] .carrossel .card.meio .card-foto { background: radial-gradient(90% 80% at 50% 30%, #fff, #f6e3d4); }
html[data-tema="D"][data-modo="claro"] .itens .card.meio .card-selo { color: #fff; }
html[data-tema="D"][data-modo="claro"] .promo-card { background: #fff; box-shadow: var(--sombra-1); }
html[data-tema="D"][data-modo="claro"] .cat.ativa { color: var(--ink); }

/* barras de baixo */
html[data-tema="D"][data-modo="claro"] .nav-baixo { background: rgba(255, 255, 255, .92); box-shadow: 0 -10px 30px -18px rgba(80, 40, 15, .35); }
html[data-tema="D"][data-modo="claro"] .nav-baixo a { color: #6b5d55; }
html[data-tema="D"][data-modo="claro"] .nav-baixo a.ativo { color: var(--ink); }
html[data-tema="D"][data-modo="claro"] .btn-barra { box-shadow: var(--brilho), 0 14px 30px -14px rgba(80, 40, 15, .5), inset 0 1px 0 rgba(255, 255, 255, .22); }

/* folha (item, meio a meio, endereço) */
html[data-tema="D"][data-modo="claro"] .folha-fundo { background: rgba(29, 21, 18, .45); }
html[data-tema="D"][data-modo="claro"] .folha-corpo { background: #fff; box-shadow: 0 -20px 60px rgba(80, 40, 15, .25); }
html[data-tema="D"][data-modo="claro"] .folha-foto::after { background: linear-gradient(to top, #fff, transparent); }
html[data-tema="D"][data-modo="claro"] .fechar { color: var(--ink); box-shadow: var(--sombra-1); }
html[data-tema="D"][data-modo="claro"] .folha-rodape { background: rgba(255, 255, 255, .94); }
html[data-tema="D"][data-modo="claro"] .opcao input:checked + .op-marca { box-shadow: inset 0 0 0 4px #fff; }
html[data-tema="D"][data-modo="claro"] .segmento { background: var(--surface-2); }
html[data-tema="D"][data-modo="claro"] .segmento button.ativo { background: #fff; box-shadow: 0 6px 16px -8px rgba(80, 40, 15, .4); }
/* contorno das bolinhas de escolha visível no branco (≥ 3:1) */
html[data-tema="D"][data-modo="claro"] .opcao input:not(:checked) + .op-marca, html[data-tema="D"][data-modo="claro"] .sabor:not(.sel) .marc, html[data-tema="D"][data-modo="claro"] .pagto:not(.sel) .radio { border-color: #8f7f75; }
html[data-tema="D"][data-modo="claro"] .sug { background: #fff; }

/* páginas: sacola, checkout, pedido, pedidos, perfil */
html[data-tema="D"][data-modo="claro"] .pg-topo { background: rgba(255, 246, 239, .94); }
html[data-tema="D"][data-modo="claro"] .bloco, html[data-tema="D"][data-modo="claro"] .ped-card { background: #fff; box-shadow: var(--sombra-1); }
html[data-tema="D"][data-modo="claro"] .passo::before { background: rgba(29, 21, 18, .1); }
html[data-tema="D"][data-modo="claro"] .pagto .p-ico { background: var(--surface-2); }
html[data-tema="D"][data-modo="claro"] .tag { background: #f3e9e1; color: var(--muted); }
html[data-tema="D"][data-modo="claro"] .tag.st[data-status="em_preparo"], html[data-tema="D"][data-modo="claro"] .tag.st[data-status="saiu_entrega"] { color: #9a3412; background: rgba(242, 107, 29, .12); }
html[data-tema="D"][data-modo="claro"] .tag.st[data-status="entregue"] { color: var(--ok); background: rgba(21, 127, 59, .1); }
html[data-tema="D"][data-modo="claro"] .etapa .bol { border-color: rgba(29, 21, 18, .18); background: #fff; }
html[data-tema="D"][data-modo="claro"] .etapa::before { background: rgba(29, 21, 18, .12); }
html[data-tema="D"][data-modo="claro"] .etapa.atual .tx strong { color: var(--ink); }
html[data-tema="D"][data-modo="claro"] .resultado-local.ok { background: rgba(21, 127, 59, .07); border-color: rgba(21, 127, 59, .3); }
html[data-tema="D"][data-modo="claro"] .rodape-acao { background: linear-gradient(to top, #fbf3ec 70%, transparent); }
html[data-tema="D"][data-modo="claro"] .toast { background: #1d1512; color: #fff; border-color: transparent; }
html[data-tema="D"][data-modo="claro"] .toast.erro { background: #b42318; color: #fff; }
html[data-tema="D"][data-modo="claro"] .rodape-cardapio { color: var(--muted); }
html[data-tema="D"][data-modo="claro"] .mini-card { background: #fff; box-shadow: var(--sombra-1); }


/* botão sol/lua (no topo e no Perfil) */
.btn-modo { position: absolute; top: 14px; right: 20px; z-index: 4; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center;
  border: 1px solid var(--borda-vidro, rgba(255, 255, 255, .1)); background: var(--vidro, rgba(20, 20, 24, .62)); color: var(--ink);
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); cursor: pointer; }
.btn-modo svg { width: 21px; height: 21px; }
.btn-modo .sol, html[data-modo="claro"] .btn-modo .lua { display: none; }
html[data-modo="claro"] .btn-modo .sol { display: block; }
html:not([data-tema="D"]) .btn-modo, html.sem-modo-claro .btn-modo { display: none; }
html.sem-modo-claro[data-tema="D"] .hero-topo .pill-pedido { right: 20px; }
html[data-tema="D"] .hero-topo .pill-pedido { right: 72px; }
.modo-escolha { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-top: 8px; }
.modo-escolha button { min-height: 44px; border-radius: 12px; border: 1px solid var(--borda-vidro, var(--line)); background: var(--vidro-claro, var(--surface)); color: var(--ink); font: inherit; font-weight: 600; font-size: 14px; display: inline-flex; align-items: center; justify-content: center; gap: 6px; }
.modo-escolha button[aria-pressed="true"] { background: var(--chama-botao, var(--brand)); color: var(--brand-ink); border-color: transparent; }
.modo-escolha svg { width: 18px; height: 18px; }
