/* As 5 identidades propostas. HEX medidos nas bolinhas da prancha numerada (materiais/2026-10-20_21-30-15.png).
   A Balcão (recomendada) é o padrão de styles.css; aqui ela se repete só para blocos com data-tema.
   Um tema vale para <html data-tema> (site) ou para qualquer bloco com data-tema (folha de usos, PDF). */

/* 5 — Balcão: garfo, faca e a campânula da logo atual, letra de cartum */
[data-tema="balcao"] {
  --fundo: #FFFFFF; --fundo-alt: #F4EFEB;
  --tinta: #3B2920; --tinta-suave: #6E5A4F;
  --primaria: #B72926; --primaria-escura: #962020; --acento: #B72926;
  --destaque: #FAB12E; --detalhe: #708349;
  --escuro: #3B2920; --sobre-escuro: #FFFFFF; --linha: #E7DFD9;
  --display: "Luckiest Guy", "Arial Black", sans-serif;
  --display-wdth: 100; --display-peso: 400; --letreiro-escala: 0.8; --titulo-escala: 0.92;
  --sombra-letreiro: #FAB12E;
  --l-tinta: #3B2920; --l-papel: #FFFFFF; --l-brilho: #FFFFFF;
  --l-1: #B72926; --l-2: #708349; --l-3: #FAB12E; --l-4: #3B2920; --l-5: #E58E1A; --l-tampa: #FAB12E;
  --l-letra: #3B2920; --l-sombra-letra: #FAB12E; --l-sub: #B72926; --l-fita-texto: #FFFFFF;
}

/* 2 — Forno: tijolo, brasa e marrom, slab pesada */
[data-tema="forno"] {
  --fundo: #FFF6E6; --fundo-alt: #FDE9C4;
  --tinta: #3C291F; --tinta-suave: #7A5A45;
  --primaria: #B4351E; --primaria-escura: #93291A; --acento: #C75728;
  --destaque: #FDE9C4; --detalhe: #C75728;
  --escuro: #3C291F; --sobre-escuro: #FDE9C4; --linha: #EBD8B8;
  --display: "Alfa Slab One", Rockwell, serif;
  --display-wdth: 100; --display-peso: 400; --letreiro-escala: 0.66; --titulo-escala: 0.82;
  --sombra-letreiro: #B4351E;
  --l-tinta: #3C291F; --l-papel: #FFF6E6; --l-brilho: #FFF6E6;
  --l-1: #B4351E; --l-2: #C75728; --l-3: #FDE9C4; --l-4: #3C291F; --l-5: #F2B33D; --l-tampa: #C75728;
  --l-letra: #3C291F; --l-sombra-letra: #C75728; --l-sub: #C75728; --l-fita-texto: #FFF6E6;
}

/* 3 — Fatia: vermelho, amarelo queijo e verde, letra gordinha */
[data-tema="fatia"] {
  --fundo: #FBF6EC; --fundo-alt: #EFE4CE;
  --tinta: #0F3D1F; --tinta-suave: #4F6152;
  --primaria: #B92B2B; --primaria-escura: #962222; --acento: #B92B2B;
  --destaque: #F9B230; --detalhe: #0F3D1F;
  --escuro: #0F3D1F; --sobre-escuro: #FBF6EC; --linha: #E2D6BE;
  --display: "Lilita One", "Arial Black", sans-serif;
  --display-wdth: 100; --display-peso: 400; --letreiro-escala: 0.86; --titulo-escala: 1;
  --sombra-letreiro: #FBF6EC;
  --l-tinta: #0F3D1F; --l-papel: #FBF6EC; --l-brilho: #FFFFFF;
  --l-1: #B92B2B; --l-2: #4F8A3C; --l-3: #F9B230; --l-4: #0F3D1F; --l-5: #D9861B; --l-tampa: #F9B230;
  --l-letra: #0F3D1F; --l-sombra-letra: #F9B230; --l-sub: #B92B2B; --l-fita-texto: #FFFFFF;
}

/* 4 — Azulejo: azul mineiro, laranja e oliva, serifa de letreiro */
[data-tema="azulejo"] {
  --fundo: #FFF8EA; --fundo-alt: #FDEAC5;
  --tinta: #152E4C; --tinta-suave: #4D5F78;
  --primaria: #152E4C; --primaria-escura: #0D1F35; --acento: #C65727;
  --destaque: #FDEAC5; --detalhe: #617740;
  --escuro: #152E4C; --sobre-escuro: #FFF8EA; --linha: #EAD9B5;
  --display: "DM Serif Display", Georgia, serif;
  --display-wdth: 100; --display-peso: 400; --letreiro-escala: 0.8; --titulo-escala: 1;
  --sombra-letreiro: rgba(21, 46, 76, .16);
  --l-tinta: #152E4C; --l-papel: #FFF8EA; --l-brilho: #FFFFFF;
  --l-1: #152E4C; --l-2: #C65727; --l-3: #617740; --l-4: #FDEAC5; --l-5: #9AAE6E; --l-tampa: #FDEAC5;
  --l-letra: #152E4C; --l-sombra-letra: transparent; --l-sub: #C65727; --l-fita-texto: #FFFFFF;
}

/* 1 — Horta: tomate e verde, serifa redonda */
[data-tema="horta"] {
  --fundo: #F7F0E3; --fundo-alt: #EFE4D0;
  --tinta: #103C1F; --tinta-suave: #4B5E4F;
  --primaria: #A50D0C; --primaria-escura: #850A09; --acento: #A50D0C;
  --destaque: #EFE4D0; --detalhe: #313131;
  --escuro: #103C1F; --sobre-escuro: #F7F0E3; --linha: #DCCFB6;
  --display: "Young Serif", Georgia, serif;
  --display-wdth: 100; --display-peso: 400; --letreiro-escala: 0.74; --titulo-escala: 0.88;
  --sombra-letreiro: rgba(16, 60, 31, .16);
  --l-tinta: #103C1F; --l-papel: #F7F0E3; --l-brilho: #FFFFFF;
  --l-1: #A50D0C; --l-2: #2F6B3A; --l-3: #EFE4D0; --l-4: #103C1F; --l-5: #7A0807; --l-tampa: #A50D0C;
  --l-letra: #103C1F; --l-sombra-letra: transparent; --l-sub: #A50D0C; --l-fita-texto: #FFFFFF;
}

/* ---------- Gesto de cada identidade no site ---------- */

/* Forno: topo escuro, como a boca do forno à noite; encaixe em tijolos */
[data-tema="forno"] {
  --borda-altura: 10px;
  --borda-forma: linear-gradient(90deg, #000 50%, #0000 0) 0 0 / 36px 100% repeat-x;
}
[data-tema="forno"] .topo,
[data-tema="forno"] .hero { background: var(--escuro); color: var(--sobre-escuro); --borda: var(--sobre-escuro); }
[data-tema="forno"] .hero .letreiro a:nth-child(odd) { color: var(--sobre-escuro); }
[data-tema="forno"] .hero-nota { color: rgba(253, 233, 196, .75); }
[data-tema="forno"] .hero .botao-linha { background: transparent; color: var(--sobre-escuro); }

/* Fatia: bloco amarelo-queijo atrás do letreiro; encaixe em borda de pizza */
[data-tema="fatia"] {
  --borda-forma: radial-gradient(circle at 50% 100%, #000 11.5px, #0000 12px) 50% 100% / 24px 100% repeat-x;
}
[data-tema="fatia"] .hero { background: var(--destaque); }
[data-tema="fatia"] .hero-nota { color: var(--tinta); }
[data-tema="fatia"] .letreiro a:nth-child(odd) { color: var(--tinta); }

/* Horta: encaixe em dente fino; faixas verdes, tomate só no botão e na marca */
[data-tema="horta"] {
  --borda-altura: 8px;
  --borda-forma: conic-gradient(from 135deg at 50% 0, #000 90deg, #0000 0) 50% 100% / 16px 100% repeat-x;
}
[data-tema="horta"] .faixa { background: var(--escuro); color: var(--sobre-escuro); }
[data-tema="horta"] .marca-faixa { background: var(--primaria); color: var(--branco); }

/* Azulejo: uma faixa de azulejos entre cada seção, no lugar da mordida */
[data-tema="azulejo"] { --borda-altura: 28px; }
[data-tema="azulejo"] .encaixe::after {
  -webkit-mask: none; mask: none;
  background: #152E4C url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 28 28'%3E%3Cpath d='M14 3 25 14 14 25 3 14Z' fill='none' stroke='%23FDEAC5' stroke-width='1.8'/%3E%3Ccircle cx='14' cy='14' r='3.2' fill='%23C65727'/%3E%3Ccircle cx='0' cy='0' r='4' fill='%23C65727'/%3E%3Ccircle cx='28' cy='0' r='4' fill='%23C65727'/%3E%3Ccircle cx='0' cy='28' r='4' fill='%23C65727'/%3E%3Ccircle cx='28' cy='28' r='4' fill='%23C65727'/%3E%3C/svg%3E") repeat-x center / 28px 28px;
}
[data-tema="azulejo"] .encaixe { margin-top: var(--borda-altura); }
