/*
 * Páginas de leitura do portal: Ajuda (/eventos/ajuda) e as legais
 * (termos, privacidade, cancelamento). Depende de tokens.css e casca.css.
 * A ajuda do /admin usa o mesmo partial no estilo "painel" (só Bootstrap) e
 * não carrega este arquivo.
 */

/* ---------- Ajuda: busca ---------- */
.vv-ajuda { padding-bottom: var(--vv-e7); }
.vv-ajuda__busca { position: relative; max-width: 720px; }
.vv-ajuda__busca > .bi { position: absolute; left: var(--vv-e4); top: 50%; transform: translateY(-50%); color: var(--vv-tinta-2); font-size: var(--vv-t-l); pointer-events: none; }
.vv-ajuda__campo {
    width: 100%; min-height: 56px; padding: 0 var(--vv-e4) 0 48px;
    font: 500 var(--vv-t-m) var(--vv-fonte); color: var(--vv-tinta);
    background: var(--vv-figura); border: var(--vv-fio-larg) solid var(--vv-fio); border-radius: var(--vv-raio-ctl);
    caret-color: var(--vv-azul);
}
.vv-ajuda__campo::placeholder { color: var(--vv-tinta-2); opacity: 1; }
.vv-ajuda__campo:focus-visible { outline: 3px solid var(--vv-foco) !important; outline-offset: 1px; }
.vv-ajuda__vazio { margin: var(--vv-e4) 0 0; font-weight: 700; }
.vv-ajuda__vazio a { color: var(--vv-azul); }

/* abas: escolha segmentada, a aberta em chapa de tinta (como o tema) */
.vv-ajuda__abas {
    display: inline-flex; flex-wrap: wrap; margin: var(--vv-e6) 0 0; padding: 0;
    border: var(--vv-fio-larg) solid var(--vv-fio); border-radius: var(--vv-raio-ctl); overflow: hidden;
}
.vv-ajuda__abas li + li { border-left: var(--vv-fio-larg) solid var(--vv-fio); }
.vv-ajuda__abas .nav-link {
    display: inline-flex; align-items: center; gap: var(--vv-e2);
    min-height: 48px; padding: 0 var(--vv-e5); border: 0; border-radius: 0;
    background: transparent; color: var(--vv-tinta); font: 700 var(--vv-t-s)/1 var(--vv-fonte);
}
.vv-ajuda__abas .nav-link:hover { background: var(--vv-folha-2); color: var(--vv-tinta); }
.vv-ajuda__abas .nav-link.active { background: var(--vv-especial); color: var(--vv-especial-tinta); }
.vv-ajuda__abas .nav-link:focus-visible { outline-offset: -3px; }
.vv-ajuda__qtde { font-size: var(--vv-t-xs); font-weight: 900; opacity: 0.75; }
@media (max-width: 519.98px) {
    .vv-ajuda__abas { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; width: 100%; }
    .vv-ajuda__abas li { min-width: 0; }
    .vv-ajuda__abas .nav-link { width: 100%; justify-content: center; padding: 0 var(--vv-e1); font-size: var(--vv-t-xs); }
    .vv-ajuda__qtde { display: none; }
}

/* tópico e perguntas: linhas separadas por fio, a pergunta em Archivo */
.vv-ajuda__conteudo { margin-top: var(--vv-e6); }
/* buscando, os tópicos aparecem juntos: um respiro entre eles */
.vv-ajuda__conteudo > .tab-pane.active + .tab-pane.active { margin-top: var(--vv-e6); }
.vv-ajuda__topico { max-width: 860px; }
.vv-ajuda__tit {
    display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--vv-e1) var(--vv-e3);
    margin: 0 0 var(--vv-e3);
    font: 800 var(--vv-t-xl)/1.08 var(--vv-fonte-titulo); font-stretch: var(--vv-largo); letter-spacing: -0.02em;
}
.vv-ajuda__sub { font: 400 var(--vv-t-s)/1.3 var(--vv-fonte); color: var(--vv-tinta-2); letter-spacing: 0; }
.vv-ajuda__lista {
    --bs-accordion-bg: transparent; --bs-accordion-color: var(--vv-tinta);
    --bs-accordion-border-width: 0; --bs-accordion-border-radius: 0; --bs-accordion-inner-border-radius: 0;
    --bs-accordion-btn-bg: transparent; --bs-accordion-active-bg: transparent; --bs-accordion-active-color: var(--vv-tinta);
    --bs-accordion-btn-color: var(--vv-tinta); --bs-accordion-btn-focus-box-shadow: none;
    --bs-accordion-btn-padding-x: 0; --bs-accordion-btn-padding-y: var(--vv-e4);
    --bs-accordion-body-padding-x: 0; --bs-accordion-body-padding-y: 0;
    border-top: var(--vv-fio-larg) solid var(--vv-fio);
}
.vv-ajuda__lista .accordion-item { border-bottom: 1px solid var(--vv-fio-leve); background: transparent; }
.vv-ajuda__lista .accordion-header { margin: 0; }
.vv-ajuda__lista .accordion-button {
    gap: var(--vv-e4); min-height: 60px;
    font: 800 var(--vv-t-l)/1.25 var(--vv-fonte-titulo); font-stretch: var(--vv-largo); letter-spacing: -0.01em;
    color: var(--vv-tinta); box-shadow: none !important;
}
.vv-ajuda__lista .accordion-button:hover { color: var(--vv-azul); }
.vv-ajuda__lista .accordion-button:focus-visible { outline-offset: 2px; }
/* a seta do Bootstrap vira o "mais" do Bootstrap Icons (bi-plus-lg), que gira em "x" ao abrir */
.vv-ajuda__lista .accordion-button::after {
    flex: none; width: 28px; height: 28px; margin-left: auto;
    background: none; content: "\f64d"; display: grid; place-items: center;
    font: 400 1.125rem/1 "bootstrap-icons"; color: var(--vv-azul);
    transition: transform var(--vv-rapido) var(--vv-ease);
}
.vv-ajuda__lista .accordion-button:not(.collapsed)::after { transform: rotate(45deg); background: none; }
.vv-ajuda__lista .accordion-body { padding-bottom: var(--vv-e5); color: var(--vv-tinta); }
.vv-ajuda__lista .accordion-body ol, .vv-ajuda__lista .accordion-body ul { padding-left: 1.4em; }
.vv-ajuda__lista .accordion-body li + li { margin-top: var(--vv-e1); }
/* pergunta aberta pelo link /eventos/ajuda#<id>: o alvo da âncora */
.vv-ajuda__lista .accordion-item:target .accordion-button { color: var(--vv-azul); }
@media (max-width: 639.98px) {
    .vv-ajuda__lista .accordion-button { font-size: var(--vv-t-m); min-height: 56px; }
}

/* ---------- Fale com a gente ---------- */
.vv-fale {
    display: grid; gap: var(--vv-e6) var(--vv-e8); grid-template-columns: minmax(0, 1fr);
    padding-block: var(--vv-e2) 0;
}
/* o fio de cima só na largura do conteúdo (a seção tem o respiro lateral) */
.vv-fale::before { content: ""; grid-column: 1 / -1; border-top: var(--vv-fio-larg) solid var(--vv-fio); }
@media (min-width: 992px) {
    .vv-fale { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); align-items: start; }
}
.vv-fale__lado .vv-sec-sub + .vv-sec-sub { margin-top: var(--vv-e3); }
.vv-fale__email { display: flex; align-items: center; gap: var(--vv-e2); margin: var(--vv-e5) 0 0; font-weight: 700; overflow-wrap: anywhere; }
.vv-fale__email .bi { color: var(--vv-azul); }
.vv-fale__email a { display: inline-flex; align-items: center; min-height: 44px; }
.vv-fale__email a { color: var(--vv-azul); }
.vv-fale__email a:hover { color: var(--vv-tinta); }
.vv-fale__fig {
    background: var(--vv-figura);
    border: var(--vv-borda-larg) solid var(--vv-borda-fig); outline: 1px solid var(--vv-fio-leve);
    border-radius: var(--vv-raio-fig); padding: var(--vv-e6);
}
.vv-fale__fig .vv-nota { margin-bottom: var(--vv-e5); }
.vv-fale__fig .vv-campo { margin-bottom: var(--vv-e5); }
.vv-fale__grade { display: grid; gap: 0 var(--vv-e4); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 640px) { .vv-fale__grade { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.vv-fale__fim { display: flex; flex-wrap: wrap; align-items: center; gap: var(--vv-e3) var(--vv-e5); margin-top: var(--vv-e5); }
.vv-fale__fim .vv-btn { min-height: 52px; padding-inline: var(--vv-e6); }
.vv-fale__nota { margin: 0; font-size: var(--vv-t-xs); color: var(--vv-tinta-2); }
.vv-fale__nota a { color: var(--vv-azul); }
@media (max-width: 639.98px) {
    .vv-fale__fig { padding: var(--vv-e5) var(--vv-e4); }
    .vv-fale__fim .vv-btn { width: 100%; }
}

/* ---------- páginas legais ---------- */
.vv-legal { display: grid; gap: var(--vv-e6) var(--vv-e8); grid-template-columns: minmax(0, 1fr); padding-bottom: var(--vv-e7); }
@media (min-width: 992px) {
    .vv-legal { grid-template-columns: minmax(0, 1fr) 260px; align-items: start; }
    .vv-legal__lado { position: sticky; top: 112px; grid-column: 2; grid-row: 1; }
}
/* os três documentos: escolha segmentada, como as abas da ajuda */
.vv-legal__docs {
    display: inline-flex; flex-wrap: wrap; margin: 0; padding: 0; list-style: none;
    border: var(--vv-fio-larg) solid var(--vv-fio); border-radius: var(--vv-raio-ctl); overflow: hidden;
}
.vv-legal__docs li + li { border-left: var(--vv-fio-larg) solid var(--vv-fio); }
.vv-legal__docs a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 var(--vv-e4); color: var(--vv-tinta); font-weight: 700; font-size: var(--vv-t-s); }
.vv-legal__docs a:hover { background: var(--vv-folha-2); color: var(--vv-tinta); }
.vv-legal__docs a[aria-current="page"] { background: var(--vv-especial); color: var(--vv-especial-tinta); }
.vv-legal__barra { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--vv-e3); margin-top: var(--vv-e5); }
.vv-legal__vigencia { margin: 0; font-size: var(--vv-t-s); color: var(--vv-tinta-2); }
.vv-legal__vigencia--cab { margin-top: var(--vv-e3); }
@media (max-width: 639.98px) {
    .vv-legal__barra > nav { flex: 1 1 100%; }
    .vv-legal__docs { display: grid; width: 100%; }
    .vv-legal__docs li + li { border-left: 0; border-top: var(--vv-fio-larg) solid var(--vv-fio); }
}

/* "nesta página": índice das seções (no celular, recolhido) */
.vv-legal__indice { font-size: var(--vv-t-s); }
.vv-legal__indice summary { display: flex; align-items: center; min-height: 44px; font-weight: 700; cursor: pointer; }
.vv-legal__indice ol { list-style: none; margin: var(--vv-e2) 0 0; padding: 0; border-top: 1px solid var(--vv-fio-leve); }
.vv-legal__indice li { border-bottom: 1px solid var(--vv-fio-leve); }
.vv-legal__indice a { display: flex; gap: var(--vv-e2); padding: var(--vv-e2) 0; min-height: 40px; align-items: center; color: var(--vv-tinta); line-height: 1.3; }
.vv-legal__indice a:hover { color: var(--vv-azul); }
@media (min-width: 992px) {
    .vv-legal__indice summary { pointer-events: none; list-style: none; }
    .vv-legal__indice summary::-webkit-details-marker { display: none; }
}

/* o documento */
.vv-legal__doc { max-width: 72ch; line-height: 1.65; }
.vv-legal__doc > p:first-child { font-size: var(--vv-t-l); line-height: 1.5; color: var(--vv-tinta); }
.vv-legal__doc h2 {
    margin: var(--vv-e7) 0 var(--vv-e3); padding-top: var(--vv-e3); border-top: 1px solid var(--vv-fio-leve);
    font: 800 var(--vv-t-l)/1.2 var(--vv-fonte-titulo); font-stretch: var(--vv-largo); letter-spacing: -0.01em;
}
.vv-legal__doc p, .vv-legal__doc ul, .vv-legal__doc ol { margin: 0 0 var(--vv-e3); }
.vv-legal__doc ul, .vv-legal__doc ol { padding-left: 1.3em; }
.vv-legal__doc li + li { margin-top: var(--vv-e2); }
.vv-legal__doc a { color: var(--vv-azul); font-weight: 700; }
.vv-legal__doc a:hover { color: var(--vv-tinta); }
.vv-legal__doc code { padding: 1px 6px; background: var(--vv-folha-2); color: var(--vv-tinta); border-radius: var(--vv-raio-fig); font-size: 0.875em; overflow-wrap: anywhere; }
.vv-legal__doc .table-responsive { margin: var(--vv-e4) 0 var(--vv-e5); }
.vv-legal__doc table { width: 100%; border-collapse: collapse; font-size: var(--vv-t-s); line-height: 1.4; }
.vv-legal__doc th { text-align: left; font-size: var(--vv-t-xs); color: var(--vv-tinta-2); font-weight: 700; padding: var(--vv-e2) var(--vv-e3) var(--vv-e2) 0; border-bottom: var(--vv-fio-larg) solid var(--vv-fio); }
.vv-legal__doc td { padding: var(--vv-e3) var(--vv-e3) var(--vv-e3) 0; border-bottom: 1px solid var(--vv-fio-leve); vertical-align: top; }
.vv-legal__doc td small { color: var(--vv-tinta-2); }
.vv-legal__rodape { margin: var(--vv-e7) 0 0; padding-top: var(--vv-e4); border-top: var(--vv-fio-larg) solid var(--vv-fio); font-size: var(--vv-t-s); color: var(--vv-tinta-2); }
.vv-legal__rodape a { color: var(--vv-azul); }
@media (max-width: 639.98px) {
    .vv-legal__doc table, .vv-legal__doc thead, .vv-legal__doc tbody, .vv-legal__doc tr, .vv-legal__doc td { display: block; }
    .vv-legal__doc thead { display: none; }
    .vv-legal__doc tr { padding: var(--vv-e3) 0; border-bottom: 1px solid var(--vv-fio-leve); }
    .vv-legal__doc td { padding: 2px 0; border: 0; }
    .vv-legal__doc td:first-child { font-weight: 700; }
}
/* impressão: quem imprime é o printThis (legal.phtml), que copia o #print_legal para um
   iframe e carrega este CSS; o documento ocupa a folha e os links viram texto */
@media print {
    .vv-legal__doc { max-width: none; }
    .vv-legal__doc a { color: inherit; font-weight: 400; }
}
