/* ==========================================================================
   SERTÃO EM DESTAQUE — CSS de marca (child theme do Newspaper)
   ==========================================================================
   Como está organizado:
   1) Tokens (cores/fontes) — vem direto da paleta oficial de vocês
   2) Base — tipografia e elementos genéricos (funciona em qualquer tema)
   3) Newspaper — seletores específicos do tema (melhor esforço; alguns
      podem precisar de ajuste fino depois que a gente ver ao vivo — é
      só me mandar um print ou o "inspecionar elemento" da parte que não
      pegou, que eu corrijo o seletor certinho)
   ========================================================================== */

/* ---------- 1) TOKENS ---------- */
:root{
  --sd-brand: #555673;
  --sd-brand-deep: #3B3C54;
  --sd-brand-darkest: #2B2C3D;
  --sd-accent: #F2A32E;
  --sd-accent-deep: #D6871A;
  --sd-ink: #2C2D3D;
  --sd-ink-soft: #5A5B72;
  --sd-line: #E4E4EC;
  --sd-surface-2: #F4F4F8;

  --sd-font-display: 'Baloo 2', ui-rounded, 'Segoe UI', sans-serif; /* menu, tags, botões */
  --sd-font-head: 'Source Serif 4', Georgia, 'Times New Roman', serif; /* títulos de matéria */
  --sd-font-body: 'Karla', 'Segoe UI', Roboto, sans-serif; /* texto corrido */
}

/* ---------- 2) BASE (genérico — cascade em qualquer tema) ---------- */
body{
  font-family: var(--sd-font-body);
  color: var(--sd-ink);
}

h1, h2, h3, h4,
.entry-title, .td-module-title, .tdb-title-text, .td-post-title,
.widgettitle, .td-block-title{
  font-family: var(--sd-font-head) !important;
}

a{ color: var(--sd-brand); }
a:hover{ color: var(--sd-accent-deep); }

/* botões e "carregar mais" — cobre as classes mais comuns de botão em WordPress/Newspaper */
.td-load-more-wrap a,
.page-nav a,
.td-post-next-prev-content a,
button,
input[type="submit"],
.btn,
.wp-block-button__link{
  font-family: var(--sd-font-display) !important;
  background-color: var(--sd-accent) !important;
  color: #2B2205 !important;
  border-color: var(--sd-accent) !important;
  border-radius: 999px !important;
}
.td-load-more-wrap a:hover,
.page-nav a:hover,
button:hover,
.btn:hover{
  background-color: var(--sd-accent-deep) !important;
}

/* citação em destaque dentro da matéria */
blockquote{
  font-family: var(--sd-font-head);
  font-style: italic;
  color: var(--sd-brand);
  border-left: 3px solid var(--sd-accent);
  padding-left: 18px;
}

/* ---------- 3) NEWSPAPER — cabeçalho / logo / menu ---------- */
#Header, .td-header-wrap, .td-header-sp-top, .tdb-header-align{
  background-color: #ffffff;
}

.sf-menu > li > a,
.td-header-menu-wrap .sf-menu a,
#mainC .sf-menu > li > a,
.tdb-menu-item a{
  font-family: var(--sd-font-display) !important;
  font-weight: 600 !important;
}

/* item de menu ativo / hover — cor de destaque da marca */
.sf-menu > li:hover > a,
.sf-menu > li.current-menu-item > a,
.current-category-ancestor > a,
.tdb-menu-item.current-menu-item a{
  color: var(--sd-accent-deep) !important;
}

/* ---------- 3.1) Tarja/etiqueta de categoria nos cards de matéria ----------
   [rel="category tag"] é gerado pelo próprio WordPress (get_the_category_list),
   então essa parte tem boa chance de pegar em qualquer versão do Newspaper. */
a[rel="category tag"],
.td-post-category,
.entry-category a,
.tdb-tags a{
  font-family: var(--sd-font-display) !important;
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: .03em;
  background-color: var(--sd-accent) !important;
  color: #2B2205 !important;
  border-radius: 5px;
  padding: 3px 10px;
}

/* ---------- 3.2) Sidebar / widgets (.widget é padrão do WordPress) ---------- */
.widget{
  background-color: var(--sd-surface-2);
  border-radius: 10px;
}
.widget-title, .td-block-title span{
  font-family: var(--sd-font-display) !important;
  color: var(--sd-brand);
  text-transform: uppercase;
  font-size: .85rem;
  letter-spacing: .02em;
}

/* ---------- 3.3) Rodapé (confirmado ao vivo: classe real é .td-footer-wrap) ---------- */
#footer, .td-footer-wrap, .td-footer-template-wrap, .td-footer-widget-wrap{
  background-color: var(--sd-brand-darkest) !important;
  color: #CBCBDA !important;
}
#footer a, .td-footer-wrap a, .td-footer-template-wrap a{
  color: #D9D9E6 !important;
}
#footer a:hover, .td-footer-wrap a:hover, .td-footer-template-wrap a:hover{
  color: var(--sd-accent) !important;
}
/* dentro do rodapé, o fundo claro do .widget (regra 3.2) fica errado sobre o
   fundo escuro — aqui a gente desliga esse fundo claro só ali dentro */
.td-footer-wrap .widget, .td-footer-template-wrap .widget{
  background-color: transparent !important;
}

/* ---------- 3.4) Tarja de categoria em cima dos blocos (confirmado ao vivo:
   classe real é .td-pulldown-size — é o que mostra "Política", "Locais",
   "Programas Sociais" etc. no topo de cada bloco da home). Estava com fundo
   vermelho original do tema + texto escuro por cima, daí o contraste ruim. */
.td-pulldown-size{
  background-color: var(--sd-brand) !important;
  color: #ffffff !important;
}

/* ---------- 3.5) Barra utilitária do topo (confirmado ao vivo: os blocos
   .tdb_header_date, .tdb_header_user e .tdb_mobile_horiz_menu vêm com fundo
   branco próprio do Newspaper, mas o texto deles é branco — ficava texto
   branco em cima de fundo branco, por isso "sumia"/ficava ilegível, ex: a
   palavra "Contato" no menu). Aqui só tiramos o fundo branco desses blocos
   pra eles ficarem transparentes sobre a barra escura por trás. */
.tdb_header_date,
.tdb_header_user,
.tdb_mobile_horiz_menu,
.tdb_header_date .tdb-block-inner,
.tdb_header_user .tdb-block-inner,
.tdb_mobile_horiz_menu .td_block_inner{
  background-color: transparent !important;
}

/* ==========================================================================
   Conferido ao vivo no site de vocês (05/09) e ainda pendente:
   - o carrossel "Smart Press Shopping" que aparece entre o menu e as
     Últimas NÃO é um widget do tema nem algo que este CSS alcance — é um
     anúncio (Google Ads/AdSense) carregado dentro de um iframe. CSS não
     consegue estilizar nem reordenar conteúdo de dentro de um iframe.
     Pra mover esse bloco pra baixo das Últimas, é preciso achar onde ele
     foi inserido: ou é uma linha solta no construtor de páginas da Home
     (Páginas > Início > Editar com WPBakery/Elementor) que dá pra
     arrastar de posição, ou é uma "zona de anúncio" do próprio Newspaper
     (procure no admin por algo como "Anúncios"/"Ad management" e veja se
     tem uma zona "Home Below Header" pra trocar por "Antes do rodapé").
     Me manda um print de qualquer uma dessas telas que eu te digo
     exatamente o que mexer.
   ========================================================================== */
