/* Páginas comuns a todas as verticais (ajuda, avaliar, termos de atendimento,
   cartão fidelidade, formulário público, planos e assinatura, cadastro da
   equipe por link assinado) vestidas com o TEMA e o MODO do site de cada
   vertical.

   As cores, fontes e o botão vêm de paginas-comuns-medidas.css, gerado a partir
   da home de cada vertical x tema x modo (scripts/qa/temas-publicos/
   gerar-paginas-comuns.cjs). Aqui fica só como aplicar essas variáveis no
   miolo das páginas (contêiner .pc), na barra e no rodapé do layout público.
   Os !important existem porque essas páginas trazem estilos próprios (e
   alguns em linha) de quando eram páginas soltas; o desenho que vale é o do
   tema do site. */

/* Barra e rodapé do layout, no tom da home do mesmo tema. */
html body .sp-nav{background:var(--pc-nav-bg,#fff)!important;border-bottom-color:var(--pc-nav-borda,transparent)!important;box-shadow:none!important}
html body .sp-nav :is(.sp-logo,.sp-logo-name,.sp-nav-links a,.sp-nav-mobile,.sp-nav-account){color:var(--pc-nav-cor,inherit)!important}
html body .sp-nav :is(.sp-logo-name,.sp-nav-links a){font-family:var(--pc-nav-fonte,inherit)!important}
html body .sp-nav .sp-nav-cta:not(#_){background:var(--pc-botao-bg,#111)!important;color:var(--pc-botao-tinta,#fff)!important;border-color:var(--pc-botao-bg,#111)!important;border-radius:var(--pc-botao-raio,10px)!important}
html body .sp-nav-mobile{background:transparent!important;border-color:var(--pc-nav-borda,currentColor)!important}
html body .sp-nav-mobile-menu{background:var(--pc-nav-bg,#fff)!important}
html body .sp-nav-mobile-menu a{color:var(--pc-nav-cor,inherit)!important}
html body .sp-footer{background:var(--pc-rodape-bg,#111)!important;color:var(--pc-rodape-cor,#ddd)!important}
html body .sp-footer :is(h3,h4,a,p,span,li){color:var(--pc-rodape-cor,#ddd)!important}
html body:has(.pc){background:var(--pc-bg,#fff)!important}

/* Miolo. */
.pc{background:var(--pc-bg,#fff)!important;color:var(--pc-texto-cor,#111)!important;font-family:var(--pc-texto,inherit)!important;min-height:60vh}
.pc :is(section,.sc-section,.vb-page,.rep-page,.vb-status-wrap,.vb-status-hero,.pp-wrap,.vb-container,.sc-container,.rep-shell,.pc-folha){background-color:transparent!important;background-image:none!important;color:inherit!important}
.pc :is(h1,.pc-h1){font-family:var(--pc-h1,inherit)!important;font-weight:var(--pc-h1-peso,800)!important;text-transform:var(--pc-h1-caixa,none)!important;letter-spacing:var(--pc-h1-espaco,normal)!important;font-style:var(--pc-h1-estilo,normal)!important;color:var(--pc-tinta,inherit)!important}
.pc :is(h2,h3,h4){font-family:var(--pc-h2,inherit)!important;font-weight:var(--pc-h2-peso,700)!important;text-transform:var(--pc-h2-caixa,none)!important;letter-spacing:var(--pc-h2-espaco,normal)!important;font-style:var(--pc-h2-estilo,normal)!important;color:var(--pc-tinta,inherit)!important}
.pc :is(p,li,dd,dt,td,th,label,legend,small,blockquote,figcaption){color:var(--pc-texto-cor,inherit)!important}
.pc :is(.vb-eyebrow,.rep-label,[class*="eyebrow"],[class*="kicker"]){color:var(--pc-suave,inherit)!important}

/* Cartões: a superfície dos cartões da home. */
.pc :is(.sc-card,.vb-card,.vb-terms,.rep-question,.rep-field,.rep-success,.vbk-artigo,.vbf-campo,.pc-cartao,details,[class*="card"]:not([class*="card-icon"]):not(.vb-card-light-icon)){background:var(--pc-papel,#fff)!important;background-image:none!important;border-color:var(--pc-linha,rgba(0,0,0,.12))!important;color:var(--pc-texto-cor,inherit)!important;border-radius:var(--pc-raio,12px)!important}
.pc [style*="background"]:not(img):not([class*="btn"]):not(button):not(.pc-livre):not(.pc-botao):not(.pc-botao-linha){background-color:var(--pc-papel,#fff)!important;background-image:none!important;color:var(--pc-texto-cor,inherit)!important}
.pc [style*="border"]:not(img){border-color:var(--pc-linha,rgba(0,0,0,.12))!important}
.pc [style*="color"]:not(i):not([class*="btn"]):not(button):not(.pc-botao):not(.pc-botao-linha){color:var(--pc-texto-cor,inherit)!important}

/* Botões: o botão principal da home. */
.pc :is(button[type="submit"],.vb-btn-dark,.vb-btn-primary,.rep-submit,.sc-btn,.btn,.btn-primary,.pc-botao,a[class*="btn-primary"],a.vb-btn:not(.vb-btn-outline),input[type="submit"]){background:var(--pc-botao-bg,#111)!important;background-image:none!important;color:var(--pc-botao-tinta,#fff)!important;border-color:var(--pc-botao-bg,#111)!important;border-radius:var(--pc-botao-raio,10px)!important;font-family:var(--pc-botao-fonte,inherit)!important;font-weight:var(--pc-botao-peso,700)!important;text-transform:var(--pc-botao-caixa,none)!important;letter-spacing:var(--pc-botao-espaco,normal)!important}
.pc :is(button[type="submit"],.vb-btn-dark,.vb-btn-primary,.rep-submit,.sc-btn,.btn,.btn-primary,.pc-botao,a.vb-btn) *{color:inherit!important}
.pc :is(.vb-btn-outline,.btn-outline,.pc-botao-linha,a[class*="btn-secondary"],button[type="button"]:not([class*="dot"])){background:transparent!important;color:var(--pc-tinta,inherit)!important;border:1px solid var(--pc-linha,currentColor)!important;border-radius:var(--pc-botao-raio,10px)!important;font-family:var(--pc-botao-fonte,inherit)!important}
.pc :is(a:not([class]),a[class*="link"]:not([class*="btn"])){color:var(--pc-tinta,inherit)!important;text-decoration:underline;text-underline-offset:3px}

/* Campos. */
.pc :is(input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):not([type="hidden"]),select,textarea){background:var(--pc-bg,#fff)!important;color:var(--pc-texto-cor,inherit)!important;border:1px solid var(--pc-linha,rgba(0,0,0,.2))!important;border-radius:min(var(--pc-raio,12px),14px)!important}
.pc :is(input,textarea)::placeholder{color:var(--pc-suave,#777)!important;opacity:.85}

/* Ícones decorativos seguem a cor do texto do tema. */
.pc :is(.vb-icon,.rep-success__icon) i{color:var(--pc-tinta,inherit)!important}
/* rótulo da barra de contato: algumas folhas da vertical o deixam translúcido (contraste 1,7:1) */
html body .sp-contact-bar .sp-section-label:not(#_){color:inherit!important;opacity:.78!important}
/* blocos antigos com fundo branco fixo: no escuro deixavam o texto claro sobre branco */
html body .pc :is(.rep-head,.rep-form,.vb-status-page):not(#_){background:transparent!important}
html body .pc .tp-clausula:not(#_){background:var(--pc-papel)!important;color:var(--pc-texto-cor,inherit)!important;border-color:var(--pc-linha)!important}
html body .pc .rep-head :is(strong,b):not(#_){color:var(--pc-tinta)!important}
html body .pc .rep-head .rep-brand > div > :is(span,small):not(#_){color:var(--pc-suave)!important}
html body .pc .tp-clausula .tp-num:not(#_){color:var(--pc-suave)!important;opacity:1!important}
/* avaliação: cores fixas da folha antiga (pensadas para o claro) seguem o modo */
html body .pc :is(.rep-question,.rep-label,.rep-success h2):not(#_){color:var(--pc-tinta)!important}
html body .pc :is(.rep-ends,.rep-safe,.rep-success p):not(#_){color:var(--pc-suave)!important}
html body .pc .rep-scale input:not(:checked)+span:not(#_){background:var(--pc-papel)!important;color:var(--pc-tinta)!important;border-color:var(--pc-linha)!important}
html body .pc .rep-page :is(input[type=text],textarea):not(#_){background:var(--pc-bg)!important;color:var(--pc-tinta)!important;border-color:var(--pc-linha)!important}
html body .pc .rep-head h1:not(#_){font-size:clamp(1.45rem,7.2vw,2.55rem)!important;overflow-wrap:break-word}
