/* ═══════════════════════════════════════════════════════════════════════
   MTDCore — ajustes do tema claro sobre a interface herdada do ZHEUS.
   Carregado DEPOIS do CSS de cada página. Só vale quando o fundo é claro
   (classe .mtd-claro no <html>, posta por mtdcore.js), então trocar o tema
   para escuro no painel devolve o visual original sem mexer aqui.
   ═══════════════════════════════════════════════════════════════════════ */
html.mtd-claro { color-scheme: light; }
html.mtd-claro body { background: var(--zh-bg); }

/* Caixa do pedido (home) */
html.mtd-claro .prompt-wrapper {
  background: var(--zh-surface);
  border: 1px solid rgba(var(--zh-text-rgb), .12);
  border-radius: 18px;
  box-shadow: 0 10px 30px rgba(var(--zh-text-rgb), .08), 0 1px 2px rgba(var(--zh-text-rgb), .06);
}
html.mtd-claro .prompt-wrapper:focus-within {
  border-color: rgba(var(--zh-accent-rgb), .55);
  box-shadow: 0 0 0 4px rgba(var(--zh-accent-rgb), .10), 0 10px 30px rgba(var(--zh-text-rgb), .08);
}
html.mtd-claro .prompt-border-wrap { display: none; }
html.mtd-claro #hero-prompt::placeholder { color: rgba(var(--zh-text-rgb), .42); }

/* Botão principal: gradiente da marca, texto branco */
html.mtd-claro .btn-primary { color: var(--zh-on-accent); background: linear-gradient(90deg, var(--zh-accent), var(--zh-grad2)); box-shadow: 0 6px 16px rgba(var(--zh-accent-rgb), .25); }
html.mtd-claro .btn-primary::before, html.mtd-claro .btn-primary::after, html.mtd-claro .btn-primary-border { display: none; }
html.mtd-claro .btn-primary:hover { filter: brightness(1.06); }

/* Textos que eram "branco a 25–35%" ficam ilegíveis no claro: piso de contraste */
html.mtd-claro .tab-link { color: rgba(var(--zh-text-rgb), .55); }
html.mtd-claro .tab-link.active { color: var(--zh-text); border-color: var(--zh-grad2); }
html.mtd-claro #plan-mode-btn { color: rgba(var(--zh-text-rgb), .6) !important; border-color: rgba(var(--zh-text-rgb), .15) !important; }

/* Tailwind text-white herdado → texto do tema */
html.mtd-claro .text-white { color: var(--zh-text) !important; }
html.mtd-claro .hover\:text-white:hover { color: var(--zh-accent) !important; }

/* Barras de rolagem visíveis no claro */
html.mtd-claro ::-webkit-scrollbar-thumb { background: rgba(var(--zh-text-rgb), .18); }

/* Utilitários Tailwind pensados para fundo escuro → equivalentes no claro.
   "white/N" = tinta clara sobre escuro; aqui vira marinho na mesma opacidade. */
html.mtd-claro .bg-white\/5, html.mtd-claro .hover\:bg-white\/5:hover,
html.mtd-claro .bg-white\/\[\.05\], html.mtd-claro .hover\:bg-white\/\[\.05\]:hover { background-color: rgba(var(--zh-text-rgb), .05) !important; }
html.mtd-claro .bg-white\/\[\.03\] { background-color: rgba(var(--zh-text-rgb), .03) !important; }
html.mtd-claro .bg-white\/\[\.08\], html.mtd-claro .hover\:bg-white\/\[\.08\]:hover { background-color: rgba(var(--zh-text-rgb), .08) !important; }
html.mtd-claro .bg-white\/10 { background-color: rgba(var(--zh-accent-rgb), .10) !important; }
html.mtd-claro .border-white\/10 { border-color: rgba(var(--zh-text-rgb), .12) !important; }
html.mtd-claro .text-white\/80 { color: rgba(var(--zh-text-rgb), .8) !important; }
html.mtd-claro .text-white\/70 { color: rgba(var(--zh-text-rgb), .7) !important; }
html.mtd-claro .text-neutral-300 { color: rgba(var(--zh-text-rgb), .8) !important; }
html.mtd-claro .text-neutral-400 { color: rgba(var(--zh-text-rgb), .65) !important; }
html.mtd-claro .text-neutral-500 { color: rgba(var(--zh-text-rgb), .55) !important; }
html.mtd-claro .text-neutral-600 { color: rgba(var(--zh-text-rgb), .5) !important; }
html.mtd-claro .bg-neutral-800\/90 { background-color: rgba(var(--zh-surface-rgb), .95) !important; }
html.mtd-claro .border-neutral-700 { border-color: rgba(var(--zh-text-rgb), .15) !important; }
/* Botão ativo do seletor Vista previa / Código */
html.mtd-claro #view-switcher .bg-white\/10 { background-color: var(--zh-surface) !important; color: var(--zh-accent) !important; box-shadow: 0 1px 3px rgba(var(--zh-text-rgb), .12); }