/* ============================================================
   MRX News · dark.css (modo escuro)
   Ativado por [data-theme="escuro"] no <html>. O script antiflicker
   (inline no <head>) resolve a preferência (localStorage ou sistema)
   e grava data-theme ANTES da pintura, então aqui só tratamos "escuro".
   Para quem está sem JavaScript, functions.php injeta um <noscript> com
   @media (prefers-color-scheme: dark). Contraste conferido para AA.
   ============================================================ */

[data-theme="escuro"] {
  /* Inverte os neutros de jornal; mantém os azuis da marca, com link mais claro */
  --fn-paper: #0d1626;
  --fn-paper-2: #152034;
  --fn-ink: #e9eef5;
  --fn-ink-2: #c3cdda;
  --fn-muted: #93a0b0;
  --fn-line: #27344a;
  --fn-line-2: #35445e;
  --fn-line-ink: #4a5c76;
  --fn-azul-norte: #7fb4ff;
}

/* Texto que no claro usa Noite (#0D1626) como cor de fonte precisa clarear.
   As faixas escuras (vídeos, rodapé) continuam com fundo Noite de propósito. */
[data-theme="escuro"] .fn-headline,
[data-theme="escuro"] .fn-article__title,
[data-theme="escuro"] .fn-card__title,
[data-theme="escuro"] .fn-card__title a,
[data-theme="escuro"] .fn-section__title,
[data-theme="escuro"] .fn-section__title a,
[data-theme="escuro"] .fn-editoria-head__title,
[data-theme="escuro"] .fn-ultimas__title,
[data-theme="escuro"] .fn-ranking__title,
[data-theme="escuro"] .fn-heroD__title,
[data-theme="escuro"] .fn-heroD__title a,
[data-theme="escuro"] .fn-heroD__related .fn-reli,
[data-theme="escuro"] .fn-mini__title,
[data-theme="escuro"] .fn-hero__colhead,
[data-theme="escuro"] .fn-ultimas__head,
[data-theme="escuro"] .fn-aside__head,
[data-theme="escuro"] .fn-editoria-head__title a,
[data-theme="escuro"] .fn-related__title,
[data-theme="escuro"] .fn-prose h2,
[data-theme="escuro"] .fn-prose h3,
[data-theme="escuro"] .fn-card--lead .fn-card__title,
[data-theme="escuro"] .fn-masthead__menu,
[data-theme="escuro"] .fn-share a,
[data-theme="escuro"] .fn-share button,
[data-theme="escuro"] .fn-nav__link,
[data-theme="escuro"] .fn-iconbtn,
[data-theme="escuro"] .fn-ad__title,
[data-theme="escuro"] .fn-search__input,
[data-theme="escuro"] .fn-search__close,
[data-theme="escuro"] .fn-search__result span:first-child,
[data-theme="escuro"] .fn-pager a,
[data-theme="escuro"] .fn-pager span,
[data-theme="escuro"] .fn-drawer__list a,
[data-theme="escuro"] .fn-byline__author,
[data-theme="escuro"] .fn-drawer__close,
[data-theme="escuro"] .fn-prose,
[data-theme="escuro"] .fn-prose p {
  color: var(--fn-ink);
}

/* Azuis escuros (Azul Fator) ficam ilegíveis sobre fundo escuro: usam o Azul
   Claro/Norte. Vale para etiquetas, selo da faixa Agora, eyebrow de anúncio e
   o link do autor. */
[data-theme="escuro"] .fn-byline__author a,
[data-theme="escuro"] .fn-agora__tag,
[data-theme="escuro"] .fn-ad__eyebrow,
[data-theme="escuro"] .fn-tag,
[data-theme="escuro"] .fn-source__label { color: var(--fn-azul-claro); }
[data-theme="escuro"] .fn-tag { border-color: var(--fn-line-2); }
[data-theme="escuro"] .fn-chip { background: var(--fn-azul-norte); color: #0d1626; }

/* Hovers que usavam Azul Fator (escuro demais sobre fundo escuro) viram Azul Claro */
[data-theme="escuro"] .fn-card__title a:hover,
[data-theme="escuro"] .fn-ultimas__item:hover .fn-ultimas__title,
[data-theme="escuro"] .fn-ranking__item:hover .fn-ranking__title,
[data-theme="escuro"] .fn-heroD__title a:hover,
[data-theme="escuro"] .fn-mini:hover .fn-mini__title,
[data-theme="escuro"] .fn-link:hover {
  color: var(--fn-azul-claro);
}

/* Sombra do masthead/nav mais discreta no escuro */
[data-theme="escuro"] .fn-masthead,
[data-theme="escuro"] .fn-nav { box-shadow: none; }

/* Logo: o azul some no escuro; troca pela versão negativa (branca) do protótipo,
   mantendo a cor do selo "MT". Fallback por filtro para o logo do Site Identity. */
[data-theme="escuro"] .fn-masthead__logo .fn-logo--claro { display: none; }
[data-theme="escuro"] .fn-masthead__logo .fn-logo--escuro { display: block; }
[data-theme="escuro"] .fn-masthead .custom-logo,
[data-theme="escuro"] .wp-block-site-logo img { filter: brightness(0) invert(1); }

/* Botão de modo escuro */
.fn-theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  background: transparent;
  border: 1px solid var(--fn-line);
  border-radius: 999px;
  color: var(--fn-azul);
  transition: background 0.18s var(--fn-ease), color 0.18s var(--fn-ease), border-color 0.18s var(--fn-ease);
}
.fn-theme-toggle:hover { background: var(--fn-paper-2); }
.fn-theme-toggle .fn-theme-toggle__sun { display: none; }
.fn-theme-toggle .fn-theme-toggle__moon { display: block; }
[data-theme="escuro"] .fn-theme-toggle { color: var(--fn-azul-claro); border-color: var(--fn-line-2); }
[data-theme="escuro"] .fn-theme-toggle .fn-theme-toggle__sun { display: block; }
[data-theme="escuro"] .fn-theme-toggle .fn-theme-toggle__moon { display: none; }
.fn-theme-toggle svg { width: 20px; height: 20px; }

/* Titulos de secao: filetes que usavam Noite viram tinta clara no escuro */
[data-theme="escuro"] .fn-ultimas__head,
[data-theme="escuro"] .fn-aside__head,
[data-theme="escuro"] .fn-hero__colhead { border-bottom-color: var(--fn-line-ink); }
[data-theme="escuro"] .fn-share a:hover,
[data-theme="escuro"] .fn-share button:hover { background: var(--fn-ink); color: var(--fn-paper); border-color: var(--fn-ink); }
[data-theme="escuro"] .fn-pager [aria-current="page"] { background: var(--fn-ink); color: var(--fn-paper); border-color: var(--fn-ink); }

/* Cores de editoria (Política, Cultura, Polícia...) são escuras demais sobre o
   fundo Noite: no escuro elas clareiam misturadas com branco, mantendo o tom
   da editoria e passando de 4.5:1. */
[data-theme="escuro"] .fn-kicker,
[data-theme="escuro"] .fn-article__kicker,
[data-theme="escuro"] .fn-editoria-head__kicker {
  color: color-mix(in srgb, var(--mrx-cor-editoria, var(--fn-azul-norte)) 45%, #ffffff);
}
[data-theme="escuro"] .fn-sep { color: var(--fn-muted); }
[data-theme="escuro"] .fn-404__code { color: var(--fn-azul-claro); }
