/* ============================================================
   SKIN ANIME GLOBAL

   O site é escuro de base. Em vez de reescrever cada template, este
   arquivo troca as variáveis de cor que style-common.css já usa
   (definidas no body, para vencer o :root inline do header.php) e
   corrige os pontos com fundo claro fixo: artigo, páginas, sumário,
   formulários, comentários e blocos ACF.
   ============================================================ */

body {
    --sk-ink: #0D0A14;
    --sk-surface: #16111F;
    --sk-raise: #211A2E;
    --sk-line: rgba(243, 239, 250, 0.1);
    --sk-text: #F3EFFA;
    --sk-body-text: #D9D2E6;
    --sk-muted: #A49BB8;
    --sk-accent: var(--color-primary, #FF3E7F);
    --sk-accent-rgb: var(--color-primary-rgb, 255, 62, 127);
    --sk-cyan: #3DE2FF;
    --sk-display: 'Dela Gothic One', 'Inter18pt', 'Arial Black', sans-serif;
    --sk-body: 'Zen Kaku Gothic New', 'Inter18pt', system-ui, sans-serif;

    /* Variáveis do tema base, invertidas para o fundo escuro */
    --color-dark: var(--sk-text);
    --color-gray: var(--sk-body-text);
    --color-gray-light: var(--sk-muted);
    --color-border: var(--sk-line);
    --color-surface-muted: rgba(243, 239, 250, 0.14);
    --color-dark-review-card: var(--sk-text);
    --color-surface-muted-review-card: rgba(243, 239, 250, 0.14);

    background-color: var(--sk-ink);
    color: var(--sk-body-text);
    color-scheme: dark;
}

body,
p,
ul,
ol,
li,
label,
input,
select,
textarea,
button,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--sk-body);
}

::selection {
    background: rgba(var(--sk-accent-rgb), 0.45);
    color: #fff;
}

main {
    background-color: var(--sk-ink);
}

/* Modais com fundo branco (ArtQuiz, Roleta): mantêm as cores originais */
.aq-modal,
.roulette-overlay {
    --color-dark: #1B1B1B;
    --color-gray: #444444;
    --color-gray-light: #999999;
    --color-border: #f0f0f0;
    color-scheme: light;
}

.aq-modal input,
.roulette-overlay input {
    color: #1B1B1B;
    background-color: #fff;
}

/* Botões padrão do tema */
.button {
    border-radius: 0;
    font-family: var(--sk-body);
    font-weight: 700;
    letter-spacing: 0.04em;
    clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px));
}

/* ---------- Breadcrumb (artigo, páginas antigas, CPTs) ---------- */

.breadcrumb {
    font-family: var(--sk-body);
}

.breadcrumb a,
.breadcrumb a span {
    color: var(--sk-text);
}

.breadcrumb a:hover,
.breadcrumb a:hover span {
    color: var(--sk-accent);
}

.breadcrumb span,
.breadcrumb .last {
    color: var(--sk-muted);
}

.breadcrumb svg path {
    stroke: var(--sk-accent) !important;
}

/* ---------- Artigo ---------- */

.single-cats-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.single-cat {
    border-radius: 0;
    padding: 6px 14px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    clip-path: polygon(7px 0, 100% 0, calc(100% - 7px) 100%, 0 100%);
}

.single-article h1,
.single-article .headline .title {
    font-family: var(--sk-display);
    font-weight: 400;
    font-size: clamp(30px, 4vw, 48px);
    line-height: 1.12;
    color: var(--sk-text);
    text-wrap: balance;
}

.single-article .article-meta-row {
    border-color: var(--sk-line);
}

.single-article .article-meta span,
.single-article .article-meta span b,
.single-article .article-meta span i {
    color: var(--sk-muted);
}

.article-meta-share span {
    color: var(--sk-muted);
}

.social-share a {
    color: var(--sk-text);
    transition: color 0.2s ease;
}

.social-share a:hover {
    color: var(--sk-accent);
}

/* Corpo do texto */
.single-article-content,
.single-article-content p,
.single-article-content li {
    color: var(--sk-body-text);
}

.single-article-content p,
.single-article-content li {
    font-size: 18px;
    line-height: 1.8;
}

.single-article-content a:not(.wp-block-button__link):not(.button):not([class*="rm-"]):not([class*="block-"]) {
    color: var(--sk-accent);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
}

.single-article-content a:not(.wp-block-button__link):not(.button):not([class*="rm-"]):not([class*="block-"]):hover {
    color: var(--sk-cyan);
}

.single-article-content strong,
.single-article-content b {
    color: var(--sk-text);
}

/* H2 com marcador inclinado, como um título de capítulo */
.single-article-content h2,
.single-article-content h2.wp-block-heading {
    position: relative;
    padding-left: 22px;
    font-family: var(--sk-display);
    font-weight: 400;
    line-height: 1.2;
    color: var(--sk-text);
}

.single-article-content h2::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.12em;
    bottom: 0.12em;
    width: 7px;
    background: linear-gradient(180deg, var(--sk-accent), var(--sk-cyan));
    transform: skewX(-12deg);
}

.single-article-content h3,
.single-article-content h3.wp-block-heading,
.single-article-content h4,
.single-article-content h5,
.single-article-content h6 {
    color: var(--sk-text);
}

.single-article-content blockquote,
.single-article-content .wp-block-quote {
    border-left: 4px solid var(--sk-accent);
    border-radius: 0;
    background:
        radial-gradient(rgba(243, 239, 250, 0.05) 1px, transparent 1.5px) 0 0 / 7px 7px,
        var(--sk-surface);
    color: var(--sk-text);
}

.single-article-content blockquote p {
    color: var(--sk-text);
}

.single-article-content .wp-block-pullquote {
    border-color: var(--sk-accent);
}

.single-article-content .wp-block-separator {
    border-top-color: var(--sk-accent);
}

.single-article-content figcaption {
    color: var(--sk-muted);
}

.single-article-content code,
.single-article-content pre {
    background: var(--sk-surface);
    color: var(--sk-cyan);
    border: 1px solid var(--sk-line);
}

.single-article-content .wp-block-table th,
.single-article-content .wp-block-table td {
    border-color: var(--sk-line);
    color: var(--sk-body-text);
}

.single-article-content .wp-block-table tbody tr:nth-child(even) td {
    background-color: var(--sk-surface);
}

.single-article-content .wp-block-image,
.single-article-content .wp-block-image img,
.single-article-thumb figure {
    border-radius: 0;
}

.single-article-content .wp-block-button__link {
    border-radius: 0;
    clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px));
}

/* Imagem destacada com canto cortado */
.single-article-thumb figure {
    clip-path: polygon(0 0, calc(100% - 22px) 0, 100% 22px, 100% 100%, 0 100%);
    background: var(--sk-surface);
}

/* Sumário */
.single-article-indice,
.toc-mobile-panel {
    background: var(--sk-surface);
    border: 1px solid var(--sk-line);
    border-radius: 0;
}

.single-article-indice > b,
.toc-mobile-panel-header b {
    font-family: var(--sk-display);
    font-weight: 400;
    color: var(--sk-text);
    letter-spacing: 0.02em;
}

.toc-list::before {
    background: var(--sk-line);
}

.toc-link {
    color: var(--sk-muted);
}

.toc-link:hover,
.toc-link.is-active {
    color: var(--sk-text);
}

.toc-indicator {
    background: var(--sk-accent);
    border-radius: 0;
}

.toc-mobile-panel-header {
    border-color: var(--sk-line);
}

.toc-mobile-close {
    color: var(--sk-text);
}

.toc-mobile-overlay {
    background-color: rgba(13, 10, 20, 0.7);
}

.toc-mobile-toggle {
    border-radius: 0;
    clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px));
}

/* Tags */
.single-tags {
    border-color: var(--sk-line);
}

.single-tags-title {
    color: var(--sk-muted);
}

.single-tag {
    border-radius: 0;
    border-color: var(--sk-line);
    background: var(--sk-surface);
    color: var(--sk-text);
    clip-path: polygon(7px 0, 100% 0, calc(100% - 7px) 100%, 0 100%);
}

.single-tag:hover {
    border-color: var(--sk-accent);
}

/* ---------- Card antigo (onde ainda aparece) ---------- */

.article-thumb figure {
    border-radius: 0;
    clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 0 100%);
}

.article-category a {
    color: var(--sk-cyan);
    letter-spacing: 0.12em;
}

.article-title .article-link {
    color: var(--sk-text);
}

.article-title .article-link:hover {
    color: var(--sk-accent);
}

.articles-header .title,
.articles-header .title a {
    font-family: var(--sk-display);
    font-weight: 400;
    color: var(--sk-text);
}

/* ---------- Formulários e comentários ---------- */

input[type=text],
input[type=email],
input[type=url],
input[type=tel],
input[type=number],
input[type=search],
input[type=password],
select,
textarea {
    color: var(--sk-text);
    background-color: var(--sk-surface);
    border: 1px solid var(--sk-line);
    border-radius: 0;
}

input::placeholder,
textarea::placeholder {
    color: var(--sk-muted);
}

input:focus,
select:focus,
textarea:focus {
    border-color: var(--sk-accent);
    outline: none;
}

.comment-list,
.comment-list li,
.comment-body,
.comment-meta,
.comment-respond {
    color: var(--sk-body-text);
    border-color: var(--sk-line);
}

.comment-author .fn,
.comment-author .fn a,
.comment-reply-title {
    color: var(--sk-text);
}

/* ---------- Página de cartões ---------- */

.cards-table-tabs,
.cards-table-list th,
.cards-table-list td {
    border-color: var(--sk-line);
}

.cards-table-tab,
.cards-table-list th,
.cards-table-count,
.cards-table-loading,
.cards-table-empty {
    color: var(--sk-muted);
}

.cards-table-filter input {
    border-color: var(--sk-line);
}

/* ---------- Blocos ACF dentro do artigo ---------- */

/* Aplicativos */
.block-app {
    border-color: var(--sk-line);
    background: var(--sk-surface);
}

.block-app-headline,
.block-app-infos,
.block-app-item,
.block-app-nota {
    border-color: var(--sk-line);
}

.block-app-nota {
    background: var(--sk-raise);
}

p.block-app-disclaimer {
    color: var(--sk-muted);
    background-color: var(--sk-raise);
    border-color: var(--sk-line);
}

/* Texto, imagem e CTA */
.block-content,
.block-content-fixed-wrap {
    background-color: var(--sk-surface);
    border-color: var(--sk-line);
}

.block-content-img a {
    background-color: var(--sk-raise);
}

.block-content .block-content-small,
.block-content-fixed-wrap .block-content-small,
.block-content-fixed-wrap svg {
    color: var(--sk-muted);
}

.block-content-fixed {
    border-color: var(--sk-line);
}

/* CTA cards */
.rm-quiz-outer {
    color: var(--sk-text);
}

.rm-quiz-foot {
    color: var(--sk-muted);
}

/* FAQ */
.list-accordion li button,
.block-faq ul li button {
    color: var(--sk-text);
    background-color: var(--sk-surface);
}

.list-accordion li button:hover,
.list-accordion li button.active {
    background-color: var(--sk-raise);
}

.list-accordion-content {
    background-color: var(--sk-surface);
}

/* Vagas */
.job-vacancies-block {
    background-color: var(--sk-surface);
    color: var(--sk-body-text);
    border-color: var(--sk-line);
}

.job-vacancies-block .jv-title {
    color: var(--sk-text);
}

.job-vacancies-block .jv-cta-subtitle {
    color: var(--sk-muted);
}

.job-vacancies-block .jv-benefit-item {
    background-color: var(--sk-raise);
    border-color: var(--sk-line);
    color: var(--sk-body-text);
}

.job-vacancies-block .jv-check {
    color: var(--sk-cyan);
}

/* Quiz (rewarded) */
.rm-rq,
.rm-rq--texto {
    background: var(--sk-surface);
    border-color: var(--sk-line);
    box-shadow: none;
}

.rm-rq .rm-rq-h {
    color: var(--sk-accent);
}

.rm-rq .rm-rq-q,
.rm-rq .rm-rq-q--loading,
.rm-rq .rm-rq-q--opcoes,
.rm-rq.rm-rq--texto .rm-rq-q,
.rm-rq.rm-rq--texto .rm-rq-q--opcoes {
    color: var(--sk-text);
}

.rm-rq .rm-rq-note {
    color: var(--sk-muted);
}

.rm-rq-card {
    background: var(--sk-raise);
    border-color: var(--sk-line);
}

.rm-rq--texto .rm-rq-progress {
    background: var(--sk-raise);
}

/* Review de cartão */
.review-credit-card {
    background: var(--sk-surface);
}

.review-credit-card-infos div {
    border-color: rgba(243, 239, 250, 0.14);
}

.review-credit-card-infos span,
.review-credit-card-tags span,
.review-credit-card-cta-security small {
    color: var(--sk-muted);
}

.review-credit-card .list-accordion-title,
.review-credit-card .list-accordion-content {
    background-color: var(--sk-surface);
}

.review-credit-card .list-accordion-title:hover {
    background-color: var(--sk-raise);
}

/* Galeria: setas claras continuam boas sobre o escuro; só os pontos */
.rm-gallery-dot {
    background: rgba(243, 239, 250, 0.25);
}

.rm-gallery-dot-ativo {
    background: var(--sk-accent);
}

/* ---------- Página institucional e 404 (layout novo) ---------- */

.ah-page-body {
    margin-top: 40px;
}

.ah-prose {
    max-width: 760px;
    margin-inline: auto;
}

.ah-prose > *:first-child {
    margin-top: 0;
}

/* 404 */
.ah-404 {
    position: relative;
    padding-block: 56px 48px;
    text-align: center;
    border-bottom: 1px solid var(--sk-line);
    background:
        radial-gradient(50% 80% at 50% 0%, rgba(var(--sk-accent-rgb), 0.22), transparent 70%);
    overflow: hidden;
}

.ah-404 .ah-speedlines {
    background: repeating-conic-gradient(from 0deg at 50% 40%, rgba(243, 239, 250, 0.05) 0deg 0.8deg, transparent 0.8deg 5deg);
    -webkit-mask-image: radial-gradient(closest-side at 50% 40%, transparent 30%, #000 100%);
    mask-image: radial-gradient(closest-side at 50% 40%, transparent 30%, #000 100%);
}

.ah-404-in {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 18px;
}

.ah-404-code {
    position: relative;
    isolation: isolate;
    font-family: var(--sk-display);
    font-size: clamp(120px, 22vw, 240px);
    line-height: 0.85;
    color: transparent;
    -webkit-text-stroke: 2px var(--sk-text);
    letter-spacing: 0.02em;
    user-select: none;
}

/* Eco deslocado em rosa e ciano, efeito de impressão desalinhada */
.ah-404-code::before,
.ah-404-code::after {
    content: attr(data-code);
    position: absolute;
    inset: 0;
    -webkit-text-stroke: 0;
    mix-blend-mode: screen;
}

.ah-404-code::before {
    color: rgba(var(--sk-accent-rgb), 0.85);
    transform: translate(-6px, 4px);
    z-index: -1;
}

.ah-404-code::after {
    color: rgba(61, 226, 255, 0.55);
    transform: translate(6px, -3px);
    z-index: -2;
}

.ah-404-jp {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.4em;
    color: var(--sk-accent);
}

.ah-404-title {
    margin: 0;
    font-family: var(--sk-display);
    font-weight: 400;
    font-size: clamp(26px, 3.4vw, 40px);
    line-height: 1.15;
    color: var(--sk-text);
    text-wrap: balance;
}

.ah-404-desc {
    max-width: 52ch;
    margin: 0;
    font-size: 16px;
    line-height: 1.6;
    color: var(--sk-muted);
}

.ah-404-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    width: 100%;
    max-width: 640px;
    margin-top: 8px;
}

.ah-404-actions .ah-ar-search {
    flex: 1 1 380px;
}

/* Ajustes de largura em telas pequenas */
@media (max-width: 640px) {
    .single-article-content p,
    .single-article-content li {
        font-size: 17px;
    }
    .ah-404 {
        padding-block: 40px 36px;
    }
    .ah-404-code {
        -webkit-text-stroke-width: 1.5px;
    }
}

/* ---------- Contact Form 7 ---------- */

/* O CF7 usa --color-white como fundo dos campos: aqui ele vira a superfície escura */
.wpcf7-form {
    --color-white: var(--sk-surface);
}

.wpcf7-form input[type=text],
.wpcf7-form input[type=email],
.wpcf7-form input[type=tel],
.wpcf7-form input[type=url],
.wpcf7-form input[type=number],
.wpcf7-form input[type=date],
.wpcf7-form select,
.wpcf7-form textarea,
.wpcf7-form input[type=file] {
    color: var(--sk-text);
    border-color: var(--sk-line);
    border-radius: 0;
}

.wpcf7-form input[type=submit],
.wpcf7-form button,
.wpcf7-form .wpcf7-submit {
    color: #fff;
    border-radius: 0;
}

/* ---------- Artigo: relacionados e recentes ---------- */

.ah-single-more {
    margin-top: 24px;
    padding-block: 0 24px;
    background: transparent;
}

.ah-single-more .ah-section:first-child {
    margin-top: 48px;
    padding-top: 48px;
    border-top: 1px solid var(--sk-line);
}