/*
Theme Name:   Evolutiva
Theme URI:    https://evolutivanegociosdigitais.com.br
Description:  Child theme de blocos (FSE) da Evolutiva Negócios Digitais. Todos os design tokens (cor, tipografia, espaçamento, sombra, motion) vivem no theme.json e são derivados do Evolutiva Design System. Estende o Twenty Twenty-Five.
Author:       Evolutiva Negócios Digitais
Template:     twentytwentyfive
Version:      1.2.6
Requires at least: 6.7
Tested up to: 7.0
Requires PHP: 7.4
Text Domain:  evolutiva
*/

/* Regras de estilo do site vivem no theme.json (Global Styles). Adicione aqui
   apenas overrides que o theme.json não cobre — mantenha ao mínimo. */

/* ═══ Modo escuro — [data-theme="dark"] ═══
   Redefine as MESMAS custom properties que o theme.json gera a partir da
   paleta clara (mesmos slugs) — nenhum pattern precisa saber que existe modo
   escuro, eles já leem var(--wp--preset--color--*) e var(--wp--custom--*).
   Valores extraídos 1:1 de styles/dark.json (mesma fonte usada pelo Design
   System pra essa variação de estilo). */
html[data-theme="dark"] {
  --wp--preset--color--primary: #3450A8;
  --wp--preset--color--secondary: #2E7DDC;
  --wp--preset--color--pink: #FF95B0;
  --wp--preset--color--purple: #C79BFF;
  --wp--preset--color--orange: #FFAA5C;
  --wp--preset--color--gold: #FFD666;
  --wp--preset--color--green: #5CE0B0;
  --wp--preset--color--text: #F4F5FA;
  --wp--preset--color--text-muted: rgba(244,245,250,0.72);
  --wp--preset--color--text-faint: rgba(244,245,250,0.5);
  --wp--preset--color--background: #0D1117;
  --wp--preset--color--white: #161C2E;
  --wp--preset--color--dark: #0D1117;
  --wp--preset--color--surface-pink: rgba(183,28,63,0.16);
  --wp--preset--color--surface-purple: rgba(92,31,153,0.2);
  --wp--preset--color--surface-orange: rgba(196,101,0,0.18);
  --wp--preset--color--surface-blue: rgba(21,101,192,0.22);

  --wp--custom--shadow--sm: 0 1px 4px rgba(0,0,0,0.35);
  --wp--custom--shadow--md: 0 4px 20px rgba(0,0,0,0.45), 0 0 24px rgba(48,118,188,0.15);
  --wp--custom--shadow--lg: 0 16px 48px rgba(0,0,0,0.55), 0 0 40px rgba(48,118,188,0.12);
  --wp--custom--shadow--xl: 0 24px 72px rgba(0,0,0,0.6), 0 0 60px rgba(245,194,10,0.1);
  --wp--custom--border--subtle: rgba(255,255,255,0.1);
  --wp--custom--border--medium: rgba(255,255,255,0.16);
  --wp--custom--text-variant--orange: #FFAA5C;
  --wp--custom--text-variant--orange-strong: #C46500;
  --wp--custom--text-variant--gold: #FFD666;
  --wp--custom--text-variant--pink: #FF95B0;
  --wp--custom--text-variant--purple: #C79BFF;
  --wp--custom--text-variant--blue: #7EB6FF;
  --wp--custom--text-variant--green: #5CE0B0;
  --wp--custom--state--primary-hover: #3450A8;
  --wp--custom--state--secondary-hover: #2E7DDC;
  --wp--custom--state--ghost-border: rgba(255,255,255,0.2);
  --wp--custom--state--ghost-border-hover: #FFFFFF;
  --wp--custom--state--link: #6FA8FF;
  --wp--custom--state--link-hover: #FFFFFF;
  --wp--custom--surface--elevated: #161C2E;
  --wp--custom--surface--elevated-border: rgba(255,255,255,0.12);

  background: var(--wp--preset--color--background);
  color: var(--wp--preset--color--text);
}
html[data-theme="dark"] a:not(.wp-element-button) {
  color: var(--wp--custom--state--link);
}
html[data-theme="dark"] a:not(.wp-element-button):hover {
  color: var(--wp--custom--state--link-hover);
}
/* Transição suave ao alternar (exceto pra quem prefere menos movimento) */
@media (prefers-reduced-motion: no-preference) {
  html { transition: background-color 200ms ease; }
  body, header.wp-block-template-part { transition: background-color 200ms ease, color 200ms ease; }
}

/* ═══ Header — toggle de tema, busca, seletor de idioma ═══ */
.ev-header-actions {
  display: flex;
  align-items: center;
  gap: 0.65rem;
}
.ev-theme-toggle,
.ev-search-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 9999px;
  border: none;
  background: transparent;
  color: var(--wp--preset--color--text, #111827);
  cursor: pointer;
  transition: background-color 140ms ease;
}
.ev-theme-toggle:hover,
.ev-search-toggle:hover {
  background: var(--wp--custom--border--subtle, rgba(0,0,0,0.08));
}
.ev-theme-toggle .ev-icon-moon { display: none; }
html[data-theme="dark"] .ev-theme-toggle .ev-icon-sun { display: none; }
html[data-theme="dark"] .ev-theme-toggle .ev-icon-moon { display: block; }

.ev-search-wrap {
  max-width: 0;
  overflow: hidden;
  opacity: 0;
  transition: max-width 240ms ease, opacity 160ms ease;
}
.ev-search-wrap.is-open {
  max-width: 200px;
  opacity: 1;
}
.ev-search-wrap .wp-block-search__input {
  height: 34px;
  border-radius: 9999px;
  border: 1px solid var(--wp--custom--border--subtle, rgba(0,0,0,0.08));
  padding-inline: 0.85rem;
  font-size: 0.85rem;
}
.ev-search-wrap .wp-block-search__button {
  display: none;
}

.ev-locale-pill {
  display: flex;
  align-items: center;
  gap: 0.15rem;
  background: var(--wp--custom--border--subtle, rgba(0,0,0,0.06));
  border-radius: 9999px;
  padding: 0.2rem;
}
.ev-locale-pill button {
  border: none;
  background: transparent;
  padding: 0.2rem 0.5rem;
  border-radius: 9999px;
  font-family: var(--wp--preset--font-family--display);
  font-size: 0.7rem;
  font-weight: 700;
  cursor: pointer;
  color: var(--wp--preset--color--text-faint, #6B7280);
}
.ev-locale-pill button.is-active {
  background: var(--wp--preset--color--white, #fff);
  color: var(--wp--preset--color--primary, #1E2E6E);
  box-shadow: var(--wp--custom--shadow--sm);
}

@media (max-width: 780px) {
  .ev-header-actions .ev-search-toggle,
  .ev-header-actions .ev-locale-pill {
    display: none;
  }
}

/* Fix: menu mobile nativo (core/navigation) abre com altura colapsada
   (~68px) em vez de tela cheia, mesmo com position:fixed + inset:0 do WP
   core — nenhuma regra deste tema toca nesse elemento, então é defensivo:
   força a altura explicitamente quando o modal está aberto. */
.wp-block-navigation__responsive-container.is-menu-open {
  height: 100vh;
  height: 100dvh;
}

/* Fix: h3 dos cards de fundo tintado (Pilares) não trocava de cor no modo
   escuro — não tem classe/atributo de cor própria, então dependia de
   herdar `color` do <body>, que tem `transition: color` (regra acima) e
   não repropaga a var atualizada pro h3 de forma confiável. Declarar a
   cor direto no h3 remove essa dependência de herança; em modo claro
   resolve pro mesmo valor de sempre (nenhuma mudança visual lá). */
#pilares h3 {
  color: var(--wp--preset--color--text);
}