/* Tema Compasso (premium, 4a onda): loja de instrumentos com cara de palco - preto quente, dourado de metal e madeira,
   Playfair Display nos titulos e Lato no texto, pagina toda escura. Menu grande com as fotos dos produtos de cada categoria,
   categorias em cartoes de palco, produtos por categoria em trilhos, servicos da oficina como um setlist e rodape com a pauta.
   Carregado depois do CSS do Vitrine e do premium.css. */

.tema-compasso { --cp-preto: #14110f; --cp-palco: #1a1715; --cp-cartao: #221e1b; --cp-ouro: var(--loja, #d4a24c); --cp-creme: #f3ead9; --cp-sub: #a89c8a; --cp-fio: #352f2a; }
body.tema-compasso { background: var(--cp-palco); color: #d9cfc0; }

/* ---------- topo de palco */
.cp-topo .vt-aviso { font-weight: 700; letter-spacing: .04em; }
.cp-topo .vt-barra, .cp-topo .vt-menu { background: var(--cp-preto); }
.cp-topo .vt-barra { border-bottom: 1px solid var(--cp-fio); }
.cp-topo .vt-marca img { width: auto; height: var(--logo-altura, 46px); max-width: 240px; border: 0; border-radius: 0; background: none; object-fit: contain; }
body.vitrine .cp-topo .vt-busca input { height: 46px; border: 1px solid var(--cp-fio); border-radius: 6px; background: var(--cp-cartao); color: var(--cp-creme); }
body.vitrine .cp-topo .vt-busca input::placeholder { color: #7d7266; }
body.vitrine .cp-topo .vt-busca button { background: var(--cp-ouro) !important; color: var(--cp-preto) !important; border-radius: 4px !important; }
.cp-topo .vt-acao:hover { background: rgba(212, 162, 76, .12); }
.cp-topo .vt-sacola .counter { background: var(--cp-ouro); color: var(--cp-preto); }
.cp-topo .vt-menu .container { justify-content: center; }
.cp-topo .vt-menu a { border-radius: 4px; color: #d9cfc0 !important; font-weight: 700; font-size: 14px; }
.cp-topo .vt-menu a:hover { background: transparent; color: var(--cp-ouro) !important; }
body.vitrine .cp-topo .vt-menu-cat-lista, body.vitrine .cp-topo .vt-mega-painel, body.vitrine .cp-topo .vt-menu-dep-lista { background: var(--cp-cartao); border-color: var(--cp-fio); }
body.vitrine .cp-topo .vt-menu-cat-lista a, body.vitrine .cp-topo .vt-menu-dep-lista a { color: #d9cfc0 !important; }
.cp-topo .vt-mega-prod span { color: #d9cfc0; } .cp-topo .vt-mega-prod b { color: var(--cp-ouro); }

/* ---------- textos e titulos na pagina escura */
.tema-compasso .vt-secao-cab h2 { font-size: 36px; font-weight: 600 !important; color: var(--cp-creme); }
.tema-compasso .vt-secao-cab h2::after { content: ""; display: inline-block; width: 46px; height: 2px; margin-left: 16px; vertical-align: middle; background: var(--cp-ouro); }
.tema-compasso .vt-secao-cab a { color: var(--cp-ouro) !important; font-weight: 700; }
body.vitrine.tema-compasso h1, body.vitrine.tema-compasso h2, body.vitrine.tema-compasso h3 { color: var(--cp-creme); }
body.vitrine.tema-compasso .hdl-car h2, body.vitrine.tema-compasso .hdl-car-titulo { font-size: clamp(42px, 5.5vw, 80px); font-weight: 600; letter-spacing: -.01em; }

/* ---------- categorias em cartoes de palco */
.tema-compasso .hdl-cats a { padding: 26px 22px; border: 1px solid var(--cp-fio); border-radius: 8px; background: linear-gradient(160deg, #2a2420 0, var(--cp-cartao) 70%); color: var(--cp-creme) !important; }
.tema-compasso .hdl-cats a:hover { border-color: var(--cp-ouro); }
.tema-compasso .hdl-cats b { font-family: var(--fonte-titulos), serif; font-size: 20px; color: var(--cp-creme); }
.tema-compasso .hdl-cats small { color: var(--cp-sub); }

/* ---------- cartao: instrumento no escuro com luz de palco */
.tema-compasso .vt-card { border: 1px solid var(--cp-fio); border-radius: 8px; background: var(--cp-cartao); box-shadow: none !important; overflow: hidden; }
.tema-compasso .vt-card:hover { border-color: var(--cp-ouro); }
.tema-compasso .vt-card-img { border-radius: 0; background: radial-gradient(circle at 50% 30%, #3a332d 0, #2a2623 70%); }
.tema-compasso .vt-card-info { padding: 14px 16px 6px; }
.tema-compasso .ppc-marca { display: none; }
.tema-compasso .vt-card-nome { font-size: 15px; font-weight: 700; color: var(--cp-creme); }
.tema-compasso .vt-card-nota { color: var(--cp-sub); }
.tema-compasso .vt-card-preco s { color: #7d7266; }
.tema-compasso .vt-card-preco strong { font-size: 20px; font-weight: 800; color: var(--cp-ouro); }
.tema-compasso .ppc-parc { color: var(--cp-sub); }
.tema-compasso .vt-card-botao { margin: 6px 16px 16px; border-radius: 4px; background: transparent; border: 1px solid var(--cp-ouro); color: var(--cp-ouro); font-weight: 800; }
.tema-compasso .vt-card:hover .vt-card-botao { background: var(--cp-ouro); color: var(--cp-preto); }
.tema-compasso .ppc .ppc-ver { display: none; }
.tema-compasso .vt-selo { border-radius: 4px; background: var(--cp-ouro); color: var(--cp-preto); font-weight: 800; }
.tema-compasso .hdl-prods-seta { background: var(--cp-cartao); color: var(--cp-creme); border-color: var(--cp-fio); }

/* ---------- setlist de servicos (bloco Destaques) */
.cp-setlist { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 50px; align-items: center; padding: 54px; border: 1px solid var(--cp-fio); border-radius: 10px; background: repeating-linear-gradient(0deg, transparent 0 22px, rgba(212, 162, 76, .05) 22px 23px), #1e1a17; }
.cp-setlist-cab small { color: var(--cp-ouro); font-size: 12.5px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; }
body.vitrine .cp-setlist-cab h2 { margin: 10px 0 10px; font-family: var(--fonte-titulos), serif; font-size: 48px; font-style: italic; font-weight: 600; color: var(--cp-creme); }
.cp-setlist-cab p { margin: 0 0 22px; color: var(--cp-sub); }
.cp-setlist-botao { display: inline-flex; padding: 14px 26px; border-radius: 4px; background: var(--cp-ouro); color: var(--cp-preto) !important; font-weight: 800; text-decoration: none !important; }
.cp-faixas { margin: 0; padding: 0; list-style: none; counter-reset: cp; }
.cp-faixa { display: grid; grid-template-columns: 54px 1fr auto; align-items: baseline; gap: 12px; padding: 18px 0; border-bottom: 1px dashed var(--cp-fio); color: inherit; text-decoration: none; }
.cp-faixa b { font-family: var(--fonte-titulos), serif; font-size: 26px; font-style: italic; color: var(--cp-ouro); }
.cp-faixa strong { font-size: 18px; color: var(--cp-creme); }
.cp-faixa span { color: var(--cp-sub); font-size: 14px; text-align: right; }
@media (max-width: 767px) { .cp-setlist { grid-template-columns: 1fr; gap: 26px; padding: 34px 20px; } .cp-faixa { grid-template-columns: 40px 1fr; } .cp-faixa span { grid-column: 2; text-align: left; } body.vitrine .cp-setlist-cab h2 { font-size: 36px; } }

/* ---------- depoimentos e blog no escuro */
.tema-compasso .hdl-depo > * { border: 1px solid var(--cp-fio); background: var(--cp-cartao); box-shadow: none; }
.tema-compasso .hdl-depo p { color: #d9cfc0; font-style: italic; }
.tema-compasso .hdl-depo-nota { color: var(--cp-ouro); }
.tema-compasso .vt-blog a, .tema-compasso .vt-blog article { background: var(--cp-cartao); border-color: var(--cp-fio); color: #d9cfc0; }

/* ---------- carrinho: notas na pauta */
.cp-frete { display: flex; align-items: center; gap: 18px; padding: 14px 20px; border: 1px solid var(--cp-fio); border-radius: 8px; background: var(--cp-cartao); }
.cp-frete p { margin: 0; color: var(--cp-creme); } .cp-frete b { color: var(--cp-ouro); }
.cp-pauta { position: relative; display: flex; align-items: center; gap: 6px; height: 34px; padding: 0 6px; background: repeating-linear-gradient(180deg, transparent 0 6px, rgba(243, 234, 217, .25) 6px 7px); }
.cp-pauta i { width: 9px; height: 7px; border-radius: 50%; background: transparent; border: 1.5px solid rgba(243, 234, 217, .3); transform: rotate(-20deg); }
.cp-pauta i:nth-child(odd) { margin-top: -10px; } .cp-pauta i:nth-child(3n) { margin-top: 8px; }
.cp-pauta i.on { background: var(--cp-ouro); border-color: var(--cp-ouro); }

/* ---------- rodape com a pauta */
.cp-pauta-rodape { display: grid; gap: 18px; padding-top: 60px; padding-bottom: 30px; }
.cp-frase { margin: 0; padding: 0 0 6px; font-family: var(--fonte-titulos), serif; font-size: clamp(30px, 4vw, 52px); font-style: italic; color: var(--cp-creme); }
.cp-notas { display: flex; flex-wrap: wrap; gap: 12px 40px; margin: 0; padding: 18px 0 14px; list-style: none; background: repeating-linear-gradient(180deg, rgba(212, 162, 76, .28) 0 1px, transparent 1px 8px); background-size: 100% 41px; background-repeat: no-repeat; background-position: 0 6px; }
.cp-notas li { position: relative; padding-left: 20px; color: #d9cfc0; font-size: 14px; font-weight: 700; }
.cp-notas li::before { content: "\266A"; position: absolute; left: 0; top: -2px; color: var(--cp-ouro); font-size: 16px; }
.cp-rodape .vt-rodape-grade h3 { color: var(--cp-creme); }

/* ---------- pagina do produto premium no escuro (as caixas claras do premium.css viram cartoes de palco) */
.tema-compasso .pp, .tema-compasso .ppa { --pp-titulo: var(--cp-creme); --pp-texto: #d9cfc0; --pp-sub: var(--cp-sub); --pp-borda: var(--cp-fio); --pp-card: var(--cp-cartao); --pp-suave: #2a2420; --pp-acento: var(--cp-ouro); --pp-raio: 10px; --pp-op-fundo: var(--cp-cartao); --pp-op-borda: var(--cp-fio); --pp-op-cor: #d9cfc0; }
.tema-compasso .pp-marca { color: var(--cp-ouro); }
.tema-compasso .pp-foto, .tema-compasso .pp-mini { background: #221e1b; }
.tema-compasso .pp-palco { border: 1px solid var(--cp-fio); }
.tema-compasso .pp-preco { border: 1px solid var(--cp-fio); background: linear-gradient(135deg, #2c2620, #1f1b18); }
.tema-compasso .pp-preco-valor, .tema-compasso .pp-preco-por { color: var(--cp-creme); }
.tema-compasso .pp-parcelas, .tema-compasso .pp-preco-de { color: var(--cp-sub); }
.tema-compasso .pp-parcelas b { color: var(--cp-ouro); }
.tema-compasso .pp-economia { color: #7fd18b; }
.tema-compasso .pp .opcao.pp-op.active { --pp-op-borda: var(--cp-ouro); --pp-op-fundo: rgba(212, 162, 76, .14); --pp-op-cor: var(--cp-creme); }
.tema-compasso .pp .pp-botao { background: var(--cp-ouro); color: var(--cp-preto); --pp-b-sombra: 0 10px 30px rgba(212, 162, 76, .25); }
.tema-compasso .pp .pp-agora { border-color: var(--cp-ouro); background: transparent; color: var(--cp-ouro); }
.tema-compasso .pp .pp-agora:hover { background: var(--cp-ouro); color: var(--cp-preto); }
.tema-compasso .pp .pp-qtd button, .tema-compasso .pp .pp-qtd input { background: transparent !important; color: var(--cp-creme) !important; }
.tema-compasso .pp-fav, .tema-compasso .pp-seta, .tema-compasso .pp-lupa { background: rgba(20, 17, 15, .9); color: var(--cp-creme); }
body.vitrine.tema-compasso .pp .pp-frete-campo button { background: var(--cp-ouro) !important; color: var(--cp-preto) !important; }
.tema-compasso .pp-frete-campo input { background: #1a1715; color: var(--cp-creme); }
.tema-compasso .pp-frete label { color: var(--cp-creme); }
.tema-compasso .pp-garantias svg { background: #2a2420; color: var(--cp-ouro); }
.tema-compasso .pp-compartilhar > a, .tema-compasso .pp-compartilhar > button, .tema-compasso .pp-compartilhar [class*="comparar"] { background: var(--cp-cartao) !important; color: var(--cp-creme) !important; border-color: var(--cp-fio) !important; }
.tema-compasso .pp-fixa { background: rgba(20, 17, 15, .95); border-top-color: var(--cp-fio); }
.tema-compasso .pp-fixa-txt, .tema-compasso .pp-fixa-txt b, .tema-compasso .pp-fixa-txt strong { color: var(--cp-creme); }
.tema-compasso .ppa .ppa-abas button.ativa { --ppa-b-fundo: rgba(212, 162, 76, .12); --ppa-b-cor: var(--cp-ouro); }
body.vitrine.tema-compasso .ppa .ppa-abas button.ativa { color: var(--cp-ouro) !important; }
.tema-compasso .ppa-pag > *, .tema-compasso .ppa-spec, .tema-compasso .ppa-destaques li { border-color: var(--cp-fio); background: var(--cp-cartao); }
.tema-compasso .ppa-spec th, .tema-compasso .ppa-titulo { color: var(--cp-creme); }
.tema-compasso .ppa-parcelas td { border-color: var(--cp-fio); color: #d9cfc0; }
.tema-compasso .ppa-parcelas td:last-child { color: #7fd18b; }
.tema-compasso .ppa-destaques li::before { background-color: var(--cp-ouro); }
.tema-compasso .vt-bread a, .tema-compasso .vt-bread span { color: var(--cp-sub); }

/* ---------- carrinho e conta no escuro */
body.vitrine.tema-compasso .ck h1, body.vitrine.tema-compasso .co h1 { color: var(--cp-creme); }
body.vitrine.tema-compasso .ck-item, body.vitrine.tema-compasso .co-bloco, body.vitrine.tema-compasso .ck-resumo { border: 1px solid var(--cp-fio); border-radius: 10px; background: var(--cp-cartao); color: #d9cfc0; }
body.vitrine.tema-compasso .ck-finalizar { border-radius: 6px !important; background: var(--cp-ouro) !important; color: var(--cp-preto) !important; }
body.vitrine.tema-compasso .vl-filtros, body.vitrine.tema-compasso .vl-lateral { background: var(--cp-cartao); border-color: var(--cp-fio); color: #d9cfc0; }

/* ---------- textos do carrinho e do checkout no escuro (o base pinta de escuro) */
body.vitrine.tema-compasso .ck, body.vitrine.tema-compasso .co { color: #d9cfc0; }
body.vitrine.tema-compasso .ck-nome, body.vitrine.tema-compasso .ck-total, body.vitrine.tema-compasso .ck-valores dt, body.vitrine.tema-compasso .ck-valores dd,
body.vitrine.tema-compasso .co-campos label, body.vitrine.tema-compasso .co-opcao b, body.vitrine.tema-compasso .co-opcao em, body.vitrine.tema-compasso .co-termos span,
body.vitrine.tema-compasso .co-bloco h2, body.vitrine.tema-compasso .co-bloco h3, body.vitrine.tema-compasso .ck-resumo h2, body.vitrine.tema-compasso .ck-resumo h3 { color: var(--cp-creme) !important; }
body.vitrine.tema-compasso .ck-valores .ck-tot { color: var(--cp-ouro) !important; }
body.vitrine.tema-compasso .co-passos li { color: var(--cp-sub); }
body.vitrine.tema-compasso .co-passos li.atual { color: var(--cp-ouro); }
body.vitrine.tema-compasso .co-passos li.feito, body.vitrine.tema-compasso .co-passos li.feito a { color: #7fd18b; }
body.vitrine.tema-compasso .ck-qtd { border-color: var(--cp-fio); background: #1a1715; }
body.vitrine.tema-compasso .ck-qtd button { background: transparent !important; color: var(--cp-creme) !important; }
body.vitrine.tema-compasso .ck input, body.vitrine.tema-compasso .co input, body.vitrine.tema-compasso .co select, body.vitrine.tema-compasso .co textarea { border-color: var(--cp-fio) !important; background: #1a1715 !important; color: var(--cp-creme) !important; }
body.vitrine.tema-compasso .ck input::placeholder, body.vitrine.tema-compasso .co input::placeholder { color: #7d7266; }
body.vitrine.tema-compasso .ck input:focus, body.vitrine.tema-compasso .co input:focus, body.vitrine.tema-compasso .co select:focus { border-color: var(--cp-ouro) !important; box-shadow: 0 0 0 3px rgba(212, 162, 76, .18) !important; }
body.vitrine.tema-compasso .co-opcao { border-color: var(--cp-fio); background: #1a1715; color: #d9cfc0; }
body.vitrine.tema-compasso .co-opcao:has(input:checked) { border-color: var(--cp-ouro); background: rgba(212, 162, 76, .1); }
body.vitrine.tema-compasso .ck-item img, body.vitrine.tema-compasso .co-resumo img { background: #1a1715; }

/* ---------- aviso lateral "Adicionado ao carrinho" */
body.vitrine.tema-compasso .vt-mini { border: 1px solid var(--cp-fio); background: var(--cp-cartao); color: #d9cfc0; box-shadow: 0 24px 60px rgba(0, 0, 0, .55); }
body.vitrine.tema-compasso .vt-mini-cab b { color: #7fd18b; }
body.vitrine.tema-compasso .vt-mini-x { background: transparent; color: var(--cp-creme); }
body.vitrine.tema-compasso .vt-mini-item { background: #1a1715; border-color: var(--cp-fio); }
body.vitrine.tema-compasso .vt-mini-item b, body.vitrine.tema-compasso .vt-mini-item strong, body.vitrine.tema-compasso .vt-mini b { color: var(--cp-creme); }
body.vitrine.tema-compasso .vt-mini-item img { background: #1a1715; }
body.vitrine.tema-compasso .vt-mini a:not([class*="botao"]):not(.vt-mini-ver) { color: var(--cp-sub) !important; }
body.vitrine.tema-compasso .vt-mini-item span, body.vitrine.tema-compasso .vt-mini-sub b { color: var(--cp-ouro); }
body.vitrine.tema-compasso .vt-mini-sub, body.vitrine.tema-compasso .vt-mini-item small { color: var(--cp-sub); }
body.vitrine.tema-compasso .vt-mini-continuar { color: #d9cfc0; }
body.vitrine.tema-compasso .vt-mini-continuar:hover, body.vitrine.tema-compasso .vt-mini-x:hover { background: #2a2420; color: var(--cp-creme); }
body.vitrine.tema-compasso .vt-mini .vt-mini-ver { background: var(--cp-ouro) !important; color: var(--cp-preto) !important; }
body.vitrine.tema-compasso .ck-resumo form button, body.vitrine.tema-compasso .ck-resumo .ck-cupom button, body.vitrine.tema-compasso .ck-resumo .ck-cep button { border: 1px solid var(--cp-ouro) !important; background: transparent !important; color: var(--cp-ouro) !important; }
body.vitrine.tema-compasso .ck-resumo form button:hover { background: var(--cp-ouro) !important; color: var(--cp-preto) !important; }
