/* Modo dia para as páginas feitas com Tailwind (ex.: /oferta).
   O Tailwind v4 gera as classes de cor a partir de variáveis (--color-*); aqui só trocamos a paleta.
   "white" passa a ser o tom de texto forte e "ink" o fundo, então text-white, bg-white/5,
   border-white/10, bg-ink-900 etc. se ajustam sozinhos. Sem escolha salva, segue o aparelho. */

@media (prefers-color-scheme: light) {
  :root:not([data-theme='dark']) {
    --color-white: #0b0e1a;
    --color-ink-950: #f4f6fb;
    --color-ink-900: #ffffff;
    --color-ink-800: #eef1f7;
    --color-ink-700: #e2e6ef;
    --color-slate-200: #1f2433;
    --color-slate-300: #2f3547;
    --color-slate-400: #4b546a;
    --color-slate-500: #5c6479;
    --color-brand-300: #5b3fd6;
    --color-brand-400: #6841f5;
    --color-pix: #08806e;
    --color-emerald-300: #047857;
    --color-emerald-400: #059669;
    --color-amber-300: #a85800;
    --color-amber-400: #a85800;
    --color-rose-400: #d62846;
    --color-cta-400: #19c2a6;
    --color-cta-500: #10a88f;
    color-scheme: light;
  }
}
:root[data-theme='light'] {
  --color-white: #0b0e1a;
  --color-ink-950: #f4f6fb;
  --color-ink-900: #ffffff;
  --color-ink-800: #eef1f7;
  --color-ink-700: #e2e6ef;
  --color-slate-200: #1f2433;
  --color-slate-300: #2f3547;
  --color-slate-400: #4b546a;
  --color-slate-500: #5c6479;
  --color-brand-300: #5b3fd6;
  --color-brand-400: #6841f5;
  --color-pix: #08806e;
  --color-emerald-300: #047857;
  --color-emerald-400: #059669;
  --color-amber-300: #a85800;
  --color-amber-400: #a85800;
  --color-rose-400: #d62846;
  --color-cta-400: #19c2a6;
  --color-cta-500: #10a88f;
  color-scheme: light;
}
:root[data-theme='dark'] { color-scheme: dark; }

.theme-anim body { transition: background-color 0.4s, color 0.4s; }

/* Botão dia/noite */
.theme-toggle {
  display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; cursor: pointer;
  color: var(--color-white); border: 1px solid color-mix(in srgb, var(--color-white) 15%, transparent);
  transition: background-color 0.2s, transform 0.3s;
}
.theme-toggle:hover { background: color-mix(in srgb, var(--color-white) 6%, transparent); transform: rotate(-15deg); }
.theme-toggle svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.theme-toggle .icon-moon { display: none; fill: currentColor; stroke: none; }
@media (prefers-color-scheme: light) {
  :root:not([data-theme='dark']) .theme-toggle .icon-sun { display: none; }
  :root:not([data-theme='dark']) .theme-toggle .icon-moon { display: block; }
}
:root[data-theme='light'] .theme-toggle .icon-sun { display: none; }
:root[data-theme='light'] .theme-toggle .icon-moon { display: block; }
:root[data-theme='dark'] .theme-toggle .icon-sun { display: block; }
:root[data-theme='dark'] .theme-toggle .icon-moon { display: none; }

/* No modo dia, sombras pretas pesadas viram sombras suaves */
@media (prefers-color-scheme: light) {
  :root:not([data-theme='dark']) .card { box-shadow: 0 10px 30px -18px rgb(11 14 26 / 0.25); }
}
:root[data-theme='light'] .card { box-shadow: 0 10px 30px -18px rgb(11 14 26 / 0.25); }

/* Seletor de idioma (rodapé) */
.lang-switch { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.lang-switch a {
  display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 6px 14px; border-radius: 99px;
  border: 1px solid color-mix(in srgb, var(--color-white) 12%, transparent); color: var(--color-slate-400);
}
.lang-switch a:hover, .lang-switch a[aria-current] { color: var(--color-white); border-color: var(--color-cta-400); }
.flag { width: 22px; height: 16px; flex: none; clip-path: inset(0 round 3px); }