/* Tema claro opcional do Painel Master. O tema escuro continua sendo o padrão. */
:root[data-theme="light"] {
  --bg: #f4f7fb;
  --surface: #ffffff;
  --surface-2: #f8fafc;
  --surface-3: #e9eef5;
  --line: #d4dce8;
  --white: #10203a;
  --text: #172238;
  --muted: #52637a;
  --blue: #086be8;
  --blue-bright: #075fc9;
  --blue-soft: #086be81c;
  --danger: #c52f48;
  --gold: #9b6500;
}

/* O link de atendimento fica fixo antes do seletor de tema no rodapé da barra lateral. */
.sidebar > .sidebar-fixed-area { order: 3; }
.sidebar > #theme-toggle { order: 4; }
.sidebar > .logout { order: 5; }
.sidebar-fixed-area + .theme-toggle { margin-top: 8px; }
.theme-toggle + .logout { margin-top: 8px; }

:root[data-theme="light"] body,
:root[data-theme="light"] .app-main {
  background: #f4f7fb !important;
  color: #172238 !important;
}

:root[data-theme="light"] .auth-main {
  background: radial-gradient(650px 420px at 50% 8%, #d9edff, transparent 72%), #f4f7fb !important;
}

:root[data-theme="light"] .sidebar {
  background: linear-gradient(180deg, #ffffff, #f2f5f9) !important;
  border-right-color: #d4dce8 !important;
}

/* Barra superior e avisos: contraste reforçado no tema claro. */
:root[data-theme="light"] .panel-topbar {
  background: color-mix(in srgb, #ffffff 94%, transparent) !important;
  border-bottom-color: #cbd6e3 !important;
}

:root[data-theme="light"] .panel-topbar-brand,
:root[data-theme="light"] .topbar-action,
:root[data-theme="light"] .topbar-icon-action,
:root[data-theme="light"] .topbar-profile-toggle,
:root[data-theme="light"] .topbar-profile-menu,
:root[data-theme="light"] .topbar-profile-menu nav a,
:root[data-theme="light"] .topbar-profile-menu form button {
  color: #172238 !important;
}

:root[data-theme="light"] .topbar-action,
:root[data-theme="light"] .topbar-icon-action,
:root[data-theme="light"] .topbar-profile-toggle,
:root[data-theme="light"] .panel-topbar #theme-toggle {
  border-color: #aebdce !important;
  background: #ffffff !important;
}

:root[data-theme="light"] .topbar-partners {
  border-color: #8860d9 !important;
  background: #f0eaff !important;
  color: #51309b !important;
}

:root[data-theme="light"] .topbar-mentorship {
  border-color: #cf7a27 !important;
  background: #fff0de !important;
  color: #8a4305 !important;
}

:root[data-theme="light"] .topbar-news {
  border-color: #438fda !important;
  background: #edf6ff !important;
  color: #075fc9 !important;
}

:root[data-theme="light"] .topbar-suggestion {
  border-color: #399972 !important;
  background: #e8f8ef !important;
  color: #17633c !important;
}

:root[data-theme="light"] .topbar-profile-menu {
  border-color: #aebdce !important;
  background: #ffffff !important;
  box-shadow: 0 18px 42px #19365e28 !important;
}

:root[data-theme="light"] .topbar-profile-summary,
:root[data-theme="light"] .topbar-profile-menu form {
  border-color: #d4dce8 !important;
}

:root[data-theme="light"] [data-tooltip]::after {
  border-color: #91a7bf !important;
  background: #172238 !important;
  color: #ffffff !important;
}

:root[data-theme="light"] .brand,
:root[data-theme="light"] .sidebar a,
:root[data-theme="light"] .sidebar .nav-group-toggle,
:root[data-theme="light"] .sidebar-fixed-link,
:root[data-theme="light"] .logout button {
  color: #172238 !important;
}

:root[data-theme="light"] .brand b,
:root[data-theme="light"] .sidebar .active i,
:root[data-theme="light"] .sidebar-fixed-link i {
  color: #075fc9 !important;
}

:root[data-theme="light"] .nav-group-toggle,
:root[data-theme="light"] .sidebar-fixed-link {
  border-color: #d4dce8 !important;
  background: linear-gradient(135deg, #ffffff, #edf2f8) !important;
}

:root[data-theme="light"] .nav-group-toggle:hover,
:root[data-theme="light"] .sidebar-fixed-link:hover {
  background: #e8f1fc !important;
  color: #0b4c9b !important;
}

:root[data-theme="light"] .nav-group-toggle[aria-expanded="true"],
:root[data-theme="light"] .sidebar-fixed-link.active,
:root[data-theme="light"] .sidebar .active {
  border-color: #1683ed99 !important;
  background: linear-gradient(110deg, #dcecff, #edf5ff) !important;
  color: #0b3e7c !important;
  box-shadow: inset 3px 0 #087cff !important;
}

:root[data-theme="light"] .nav-label,
:root[data-theme="light"] .nav-subcategory-label,
:root[data-theme="light"] th {
  color: #5b6b80 !important;
}

:root[data-theme="light"] .account a strong {
  color: #172238 !important;
}

:root[data-theme="light"] .account a span,
:root[data-theme="light"] .muted,
:root[data-theme="light"] .status,
:root[data-theme="light"] .module-grid article p {
  color: #52637a !important;
}

:root[data-theme="light"] h1,
:root[data-theme="light"] h2,
:root[data-theme="light"] h3,
:root[data-theme="light"] .tool-card h2,
:root[data-theme="light"] .module-grid article h2,
:root[data-theme="light"] .module-grid article h3 {
  color: #10203a !important;
}

:root[data-theme="light"] .tool-card,
:root[data-theme="light"] .module-grid article,
:root[data-theme="light"] .login-card,
:root[data-theme="light"] .admin-grid .tool-card,
:root[data-theme="light"] .support-card,
:root[data-theme="light"] .ticket-card,
:root[data-theme="light"] .history-card,
:root[data-theme="light"] .funnel-card,
:root[data-theme="light"] .creative-card {
  border-color: #d4dce8 !important;
  background: linear-gradient(145deg, #ffffff, #f7f9fc) !important;
  color: #172238 !important;
  box-shadow: 0 10px 30px #19365e12 !important;
}

:root[data-theme="light"] .welcome-card {
  border-color: #bdd8f4 !important;
  background: linear-gradient(110deg, #ffffff, #eaf4ff 58%, #dbeeff) !important;
  box-shadow: 0 20px 50px #19365e18 !important;
}

:root[data-theme="light"] .welcome-card p:not(.eyebrow) {
  color: #405775 !important;
}

:root[data-theme="light"] input,
:root[data-theme="light"] textarea,
:root[data-theme="light"] select {
  border-color: #bdc9d8 !important;
  background: #ffffff !important;
  color: #172238 !important;
}

:root[data-theme="light"] input::placeholder,
:root[data-theme="light"] textarea::placeholder {
  color: #6b7b90 !important;
}

:root[data-theme="light"] .secondary,
:root[data-theme="light"] button.secondary {
  border-color: #9aabc0 !important;
  background: #e9eef5 !important;
  color: #173253 !important;
}

:root[data-theme="light"] td {
  border-color: #d4dce8 !important;
  background: #ffffff !important;
  color: #203450 !important;
}

:root[data-theme="light"] .tag {
  border-color: #aebdce !important;
  color: #38516d !important;
  background: #f1f5fa !important;
}

:root[data-theme="light"] .flash.success {
  background: #e4f8ed !important;
  border-color: #42aa79 !important;
  color: #176943 !important;
}

:root[data-theme="light"] .flash.error {
  background: #fff0f2 !important;
  border-color: #d55a70 !important;
  color: #8d2338 !important;
}

/* Controle de tema */
.theme-toggle {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 10px;
  margin: 8px 0 2px;
  padding: 9px 11px;
  border: 1px solid #2b3441;
  border-radius: 11px;
  background: transparent;
  box-shadow: none;
  color: #cbd5e2;
  font: 650 13px "Segoe UI Variable", "Segoe UI", sans-serif;
  text-align: left;
}

.theme-toggle:hover {
  background: #ffffff0b;
  filter: none;
  transform: none;
}

.theme-toggle-icon {
  width: 17px;
  color: #9ebcf2;
  font-size: 17px;
  line-height: 1;
  text-align: center;
}

.theme-toggle-label {
  white-space: nowrap;
}

.theme-toggle-switch {
  position: relative;
  width: 42px;
  height: 24px;
  margin-left: auto;
  border-radius: 999px;
  background: #687386;
  box-shadow: inset 0 0 0 1px #ffffff22;
  transition: background .2s ease;
}

.theme-toggle-switch > span {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #ffffff;
  box-shadow: 0 1px 4px #0006;
  transition: transform .2s ease;
}

:root[data-theme="dark"] .theme-toggle-switch {
  background: #8055ef;
}

:root[data-theme="dark"] .theme-toggle-switch > span {
  transform: translateX(18px);
}

:root[data-theme="light"] .theme-toggle {
  border-color: #d4dce8;
  background: #ffffff;
  color: #172238;
}

:root[data-theme="light"] .theme-toggle:hover {
  background: #eaf3ff;
}

:root[data-theme="light"] .theme-toggle-icon {
  color: #31577f;
}

:root[data-theme="light"] .theme-toggle-switch {
  background: #e3e8ef;
}

@media (max-width: 840px) {
  .theme-toggle {
    max-width: 360px;
    margin: 8px auto;
  }
}

/*
 * Contraste e responsividade do modo claro
 *
 * Algumas telas foram construídas com estilos próprios para o tema escuro.
 * Estes overrides mantêm o tema escuro intacto e convertem essas superfícies
 * para o mesmo padrão claro, com texto legível e bordas visíveis.
 */
:root[data-theme="light"] .app-main,
:root[data-theme="light"] .app-main p,
:root[data-theme="light"] .app-main label,
:root[data-theme="light"] .app-main legend,
:root[data-theme="light"] .app-main small,
:root[data-theme="light"] .app-main li {
  color: #294463 !important;
}

:root[data-theme="light"] .app-main h1,
:root[data-theme="light"] .app-main h2,
:root[data-theme="light"] .app-main h3,
:root[data-theme="light"] .app-main strong,
:root[data-theme="light"] .app-main b {
  color: #102844 !important;
}

:root[data-theme="light"] .app-main .eyebrow,
:root[data-theme="light"] .app-main h1 em,
:root[data-theme="light"] .app-main .palette-title,
:root[data-theme="light"] .app-main .node-kind,
:root[data-theme="light"] .app-main .page .node-kind,
:root[data-theme="light"] .app-main .action .node-kind {
  color: #075fc9 !important;
}

:root[data-theme="light"] .app-main .muted,
:root[data-theme="light"] .app-main .status,
:root[data-theme="light"] .app-main .retention-note,
:root[data-theme="light"] .app-main .creative-empty,
:root[data-theme="light"] .app-main .palette-help,
:root[data-theme="light"] .app-main .funnel-status {
  color: #425a73 !important;
}

:root[data-theme="light"] input,
:root[data-theme="light"] textarea,
:root[data-theme="light"] select,
:root[data-theme="light"] option {
  border-color: #9cacc0 !important;
  background: #ffffff !important;
  color: #142d4b !important;
}

:root[data-theme="light"] input::placeholder,
:root[data-theme="light"] textarea::placeholder {
  color: #526b86 !important;
  opacity: 1 !important;
}

:root[data-theme="light"] .card,
:root[data-theme="light"] .tool-card,
:root[data-theme="light"] .support-card,
:root[data-theme="light"] .ticket-card,
:root[data-theme="light"] .history-card,
:root[data-theme="light"] .creative-panel,
:root[data-theme="light"] .saved-panel,
:root[data-theme="light"] .headline-create,
:root[data-theme="light"] .headline-list,
:root[data-theme="light"] .snippet-card,
:root[data-theme="light"] .delete-card {
  border-color: #b2bfce !important;
  background: #ffffff !important;
  color: #142d4b !important;
  box-shadow: 0 12px 30px #18385c18 !important;
}

/* Extratores sociais */
:root[data-theme="light"] .social-tool .credit-box,
:root[data-theme="light"] .credit-box {
  border-color: #8da7c3 !important;
  background: #e7f0fa !important;
  color: #234363 !important;
}

:root[data-theme="light"] .social-tool .credit-box strong,
:root[data-theme="light"] .social-tool .credit-box small {
  color: #142d4b !important;
}

:root[data-theme="light"] .limit-choice select {
  border-color: #2b9564 !important;
  background: #e9f7ef !important;
  color: #154d35 !important;
  box-shadow: 0 0 0 3px #2b956422 !important;
}

:root[data-theme="light"] .price-example {
  color: #395a78 !important;
}

/* Teste de headlines */
:root[data-theme="light"] .headline-variation,
:root[data-theme="light"] .stat-card {
  border-color: #a9b8c9 !important;
  background: #eef3f8 !important;
  color: #142d4b !important;
  box-shadow: 0 8px 24px #18385c12 !important;
}

:root[data-theme="light"] .headline-variation legend,
:root[data-theme="light"] .headline-variation label {
  color: #1f456d !important;
}

:root[data-theme="light"] .metrics {
  border-top-color: #bac6d3 !important;
}

:root[data-theme="light"] .metrics strong {
  color: #102844 !important;
}

:root[data-theme="light"] .metrics span,
:root[data-theme="light"] .headline-table .creator,
:root[data-theme="light"] .admin-note {
  color: #275783 !important;
}

:root[data-theme="light"] .headline-table tr:hover td {
  background: #e8f2ff !important;
}

/* Créditos */
:root[data-theme="light"] .credit-balance,
:root[data-theme="light"] .credit-pack,
:root[data-theme="light"] .credit-pack.featured {
  border-color: #8fa8c2 !important;
  background: #edf3f9 !important;
  color: #142d4b !important;
  box-shadow: 0 10px 25px #18385c16 !important;
}

:root[data-theme="light"] .credit-balance small,
:root[data-theme="light"] .credit-balance strong,
:root[data-theme="light"] .credit-pack .amount {
  color: #102844 !important;
}

:root[data-theme="light"] .credit-pack p,
:root[data-theme="light"] .payment-status,
:root[data-theme="light"] .credit-row small {
  color: #425a73 !important;
}

:root[data-theme="light"] .credit-help {
  border-color: #48a77c !important;
  background: #e7f8ee !important;
  color: #1c5b3c !important;
}

/* Garimpar e criativos salvos */
:root[data-theme="light"] .creative-pricing div,
:root[data-theme="light"] .creative-context-chip,
:root[data-theme="light"] .creative-card,
:root[data-theme="light"] .creative-copy,
:root[data-theme="light"] .creative-media {
  border-color: #a8b7c8 !important;
  background: #ffffff !important;
  color: #142d4b !important;
  box-shadow: 0 8px 22px #18385c12 !important;
}

:root[data-theme="light"] .creative-pricing div,
:root[data-theme="light"] .creative-context-chip {
  background: #edf3f9 !important;
}

:root[data-theme="light"] .creative-pricing strong,
:root[data-theme="light"] .creative-context-chip strong,
:root[data-theme="light"] .creative-copy-heading strong,
:root[data-theme="light"] .creative-details strong {
  color: #102844 !important;
}

:root[data-theme="light"] .creative-pricing div,
:root[data-theme="light"] .creative-meta,
:root[data-theme="light"] .creative-validation-reason,
:root[data-theme="light"] .creative-details,
:root[data-theme="light"] .creative-copy,
:root[data-theme="light"] .creative-context-chip small {
  color: #395a78 !important;
}

:root[data-theme="light"] .creative-limit span,
:root[data-theme="light"] .creative-balance {
  border-color: #6d93bc !important;
  background: #e7f1fb !important;
  color: #1e4b75 !important;
}

:root[data-theme="light"] .creative-limit span {
  color: #174a78 !important;
}

:root[data-theme="light"] .creative-balance strong {
  color: #102844 !important;
}

:root[data-theme="light"] .creative-note {
  border-color: #b07c29 !important;
  background: #fff5df !important;
  color: #65400e !important;
}

:root[data-theme="light"] .creative-badge {
  border-color: #6d93bc !important;
  background: #e7f1fb !important;
  color: #174a78 !important;
}

:root[data-theme="light"] .creative-badge.new {
  border-color: #b07c29 !important;
  background: #fff2cf !important;
  color: #704b0c !important;
}

:root[data-theme="light"] .creative-badge.observation {
  border-color: #bf5969 !important;
  background: #ffedf0 !important;
  color: #8a2537 !important;
}

:root[data-theme="light"] .creative-badge.validated {
  border-color: #3b9b69 !important;
  background: #e6f8ed !important;
  color: #17633c !important;
}

/* Construtor de funil */
:root[data-theme="light"] .funnel-workspace {
  border-color: #aab8c8 !important;
  background: #ffffff !important;
  box-shadow: 0 16px 40px #18385c18 !important;
}

:root[data-theme="light"] .funnel-palette {
  border-color: #c0ccd8 !important;
  background: #eef3f8 !important;
}

:root[data-theme="light"] .funnel-tabs {
  background: #dfe7ef !important;
}

:root[data-theme="light"] .funnel-tabs button {
  color: #3c5772 !important;
}

:root[data-theme="light"] .funnel-tabs button.active {
  background: #ffffff !important;
  color: #102844 !important;
  box-shadow: 0 2px 7px #18385c1c !important;
}

:root[data-theme="light"] .palette-item {
  border-color: #acbbc9 !important;
  background: #ffffff !important;
  color: #193754 !important;
  box-shadow: 0 4px 12px #18385c0d !important;
}

:root[data-theme="light"] .palette-item:hover {
  border-color: #228fff !important;
  background: #e9f3ff !important;
}

:root[data-theme="light"] .funnel-stage {
  background-color: #f8fafc !important;
  background-image: radial-gradient(#31547726 1px, transparent 1px) !important;
}

:root[data-theme="light"] .funnel-node {
  border-color: #9eafc1 !important;
  background: #ffffff !important;
  box-shadow: 0 12px 24px #18385c24 !important;
}

:root[data-theme="light"] .funnel-node.selected {
  border-color: #1685f4 !important;
  box-shadow: 0 0 0 3px #1685f433, 0 14px 28px #18385c22 !important;
}

:root[data-theme="light"] .node-head {
  border-bottom-color: #c4ced9 !important;
}

:root[data-theme="light"] .node-label {
  color: #102844 !important;
}

:root[data-theme="light"] .node-note-editor,
:root[data-theme="light"] .funnel-saved {
  border-color: #9eafc1 !important;
  background: #ffffff !important;
  color: #142d4b !important;
  box-shadow: 0 14px 28px #18385c24 !important;
}

:root[data-theme="light"] .funnel-saved button {
  border-color: #aab8c8 !important;
  background: #eef3f8 !important;
  color: #193754 !important;
}

:root[data-theme="light"] .funnel-limit {
  border-color: #6d93bc !important;
  background: #e7f1fb !important;
  color: #174a78 !important;
}

/* Tabelas, alertas e campos compartilhados */
:root[data-theme="light"] th {
  color: #395a78 !important;
}

:root[data-theme="light"] td {
  border-color: #b9c6d3 !important;
  background: #ffffff !important;
  color: #203e5d !important;
}

:root[data-theme="light"] .tag {
  border-color: #8fa8c2 !important;
  background: #edf3f9 !important;
  color: #275783 !important;
}

:root[data-theme="light"] .flash,
:root[data-theme="light"] .status.error,
:root[data-theme="light"] .status.warning {
  color: #203e5d !important;
}

/* Ajuste fluido para desktop, tablet e celular */
@media (max-width: 1100px) {
  :root[data-theme="light"] .app-main {
    max-width: none;
  }

  :root[data-theme="light"] .creative-form-grid,
  :root[data-theme="light"] .headline-basics {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 840px) {
  .app-main {
    min-width: 0;
    width: 100%;
    padding: 30px clamp(16px, 4vw, 28px) !important;
  }

  .page-header,
  .result-heading,
  .section-heading,
  .creative-copy-heading,
  .owner-heading {
    flex-wrap: wrap;
  }

  .headline-basics,
  .headline-variations,
  .creative-form-grid,
  .creative-search-context,
  .credit-grid,
  .credit-history,
  .stat-grid {
    grid-template-columns: 1fr !important;
  }

  .headline-create,
  .headline-list,
  .creative-panel,
  .saved-panel,
  .tool-card,
  .credit-pack,
  .support-card,
  .ticket-card {
    width: 100% !important;
    max-width: none !important;
  }

  .table-wrap {
    max-width: 100%;
    overflow-x: auto;
  }

  .headline-table {
    min-width: 660px;
  }

  .creative-results {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 290px), 1fr)) !important;
  }

  .funnel-workspace {
    grid-template-columns: 1fr !important;
    height: auto !important;
    min-height: 0 !important;
  }

  .funnel-stage {
    min-height: 520px;
    height: min(68vh, 700px) !important;
  }
}

@media (max-width: 560px) {
  .app-main {
    padding: 24px 14px !important;
  }

  .page-header {
    display: block;
  }

  .page-header h1 {
    font-size: clamp(30px, 10vw, 42px) !important;
  }

  .button,
  .app-main button,
  .app-main select,
  .app-main input,
  .app-main textarea {
    max-width: 100%;
  }

  .page-actions,
  .funnel-toolbar,
  .funnel-inspector,
  .funnel-name-group,
  .funnel-selected-group {
    width: 100%;
  }

  .page-actions .button,
  .page-actions button,
  .funnel-toolbar button,
  .funnel-name-group button,
  .funnel-selected-group button {
    width: 100%;
  }

  .creative-pricing {
    grid-template-columns: 1fr !important;
  }

  .creative-card-body {
    padding: 15px !important;
  }

  .funnel-node {
    width: min(180px, calc(100vw - 56px));
  }
}

/* Componentes que possuem estilos locais escuros: conversão completa para claro */
:root[data-theme="light"] .app-main a:not(.button):not(.nav-group-toggle):not(.sidebar-fixed-link) {
  color: #075fc9;
}

:root[data-theme="light"] .social-tool .credit-box,
:root[data-theme="light"] .social-tool .credit-box small,
:root[data-theme="light"] .social-tool .price-example,
:root[data-theme="light"] .social-tool .status {
  color: #234363 !important;
}

:root[data-theme="light"] .social-tool .status.error {
  color: #8d2338 !important;
  background: #fff0f2 !important;
  border-color: #d55a70 !important;
}

:root[data-theme="light"] .social-tool .status.success {
  color: #17633c !important;
}

:root[data-theme="light"] .social-tool .status.warning {
  color: #704b0c !important;
  background: #fff5df !important;
  border-color: #b07c29 !important;
}

:root[data-theme="light"] .social-tool form label,
:root[data-theme="light"] .social-tool form label > span,
:root[data-theme="light"] .social-tool .result-heading,
:root[data-theme="light"] .social-tool #social-total {
  color: #294463 !important;
}

:root[data-theme="light"] .creative-form-grid label,
:root[data-theme="light"] .creative-form-grid input,
:root[data-theme="light"] .creative-form-grid select,
:root[data-theme="light"] .creative-search-context,
:root[data-theme="light"] .creative-search-context label {
  color: #1f456d !important;
}

:root[data-theme="light"] .creative-form-grid input,
:root[data-theme="light"] .creative-form-grid select {
  background: #ffffff !important;
  border-color: #9cacc0 !important;
}

:root[data-theme="light"] .creative-form-grid input::placeholder {
  color: #526b86 !important;
}

:root[data-theme="light"] .creative-card h3,
:root[data-theme="light"] .creative-card-body,
:root[data-theme="light"] .creative-card-body p,
:root[data-theme="light"] .creative-meta,
:root[data-theme="light"] .creative-validation-reason,
:root[data-theme="light"] .creative-details,
:root[data-theme="light"] .creative-copy,
:root[data-theme="light"] .creative-empty,
:root[data-theme="light"] .creative-status,
:root[data-theme="light"] .retention-note {
  color: #294463 !important;
}

:root[data-theme="light"] .creative-card h3,
:root[data-theme="light"] .creative-copy-heading strong,
:root[data-theme="light"] .creative-details strong,
:root[data-theme="light"] .creative-pricing strong,
:root[data-theme="light"] .creative-balance strong {
  color: #102844 !important;
}

:root[data-theme="light"] .creative-card,
:root[data-theme="light"] .creative-media,
:root[data-theme="light"] .creative-copy {
  background: #ffffff !important;
  border-color: #a8b7c8 !important;
}

:root[data-theme="light"] .creative-media {
  background: #eaf0f6 !important;
}

:root[data-theme="light"] .creative-media span {
  color: #526b86 !important;
}

:root[data-theme="light"] .creative-limit span {
  background: #eaf3ff !important;
  border-color: #7ea9d5 !important;
  color: #124f91 !important;
}

:root[data-theme="light"] .creative-pricing div {
  background: #ffffff !important;
  border-color: #a8b7c8 !important;
  color: #294463 !important;
}

:root[data-theme="light"] .creative-pricing strong {
  color: #102844 !important;
}

:root[data-theme="light"] .creative-balance {
  background: #edf6ff !important;
  border-color: #7ea9d5 !important;
  color: #1b466f !important;
}

:root[data-theme="light"] .creative-balance strong {
  color: #102844 !important;
}

:root[data-theme="light"] .creative-note {
  background: #fff4dc !important;
  border-color: #bd8425 !important;
  color: #5c400c !important;
}

:root[data-theme="light"] .creative-note strong {
  color: #4b3308 !important;
}

/* Biblioteca de criativos salvos */
:root[data-theme="light"] .saved-card,
:root[data-theme="light"] .saved-media,
:root[data-theme="light"] .saved-copy,
:root[data-theme="light"] .saved-details,
:root[data-theme="light"] .creative-legend {
  border-color: #a8b7c8 !important;
  background: #ffffff !important;
  color: #294463 !important;
}

:root[data-theme="light"] .saved-media {
  background: #eaf0f6 !important;
}

:root[data-theme="light"] .saved-media span,
:root[data-theme="light"] .saved-meta,
:root[data-theme="light"] .saved-validation-reason,
:root[data-theme="light"] .saved-empty,
:root[data-theme="light"] .creative-legend-intro,
:root[data-theme="light"] .creative-legend-item {
  color: #425a73 !important;
}

:root[data-theme="light"] .saved-body h2,
:root[data-theme="light"] .saved-copy-heading strong,
:root[data-theme="light"] .saved-details strong,
:root[data-theme="light"] .creative-legend h3,
:root[data-theme="light"] .creative-legend-item strong {
  color: #102844 !important;
}

:root[data-theme="light"] .saved-copy {
  background: #f7f9fc !important;
}

:root[data-theme="light"] .saved-badge {
  background: #eaf3ff !important;
  border-color: #7ea9d5 !important;
  color: #124f91 !important;
}

:root[data-theme="light"] .saved-badge.validated {
  background: #e4f8ed !important;
  border-color: #48a77c !important;
  color: #17633c !important;
}

:root[data-theme="light"] .saved-badge.observation {
  background: #fff4dc !important;
  border-color: #bd8425 !important;
  color: #704b0c !important;
}

:root[data-theme="light"] .saved-badge.new {
  background: #fff0f2 !important;
  border-color: #d55a70 !important;
  color: #8d2338 !important;
}

/* HistÃ³rico de extraÃ§Ãµes: os cards possuem fundo escuro definido localmente. */
:root[data-theme="light"] .history-row {
  background: #ffffff !important;
  border-color: #a8b7c8 !important;
  color: #193754 !important;
  box-shadow: 0 8px 22px #19365e12 !important;
}

:root[data-theme="light"] .history-row strong {
  color: #102844 !important;
}

:root[data-theme="light"] .history-row small,
:root[data-theme="light"] .history-row .muted {
  color: #425a73 !important;
}

:root[data-theme="light"] .history-row.expired {
  background: #f1f4f8 !important;
  color: #52637a !important;
}

:root[data-theme="light"] .history-actions a {
  background: #f1f5fa !important;
  border-color: #8fa8c2 !important;
  color: #124f91 !important;
}

:root[data-theme="light"] .history-actions a.primary {
  background: #087cf0 !important;
  border-color: #087cf0 !important;
  color: #ffffff !important;
}

/* Tickets: links da caixa de entrada tambÃ©m carregam uma superfÃ­cie escura prÃ³pria. */
:root[data-theme="light"] .ticket-list a {
  background: #ffffff !important;
  border-color: #a8b7c8 !important;
  color: #193754 !important;
  box-shadow: 0 7px 18px #19365e12 !important;
}

:root[data-theme="light"] .ticket-list a.active {
  background: #edf5ff !important;
  border-color: #1683ed !important;
  color: #102844 !important;
  box-shadow: inset 3px 0 #087cff, 0 7px 18px #19365e12 !important;
}

:root[data-theme="light"] .ticket-list small {
  color: #425a73 !important;
}

/* Conversas no suporte: a mensagem recebida também precisa acompanhar o tema claro. */
:root[data-theme="light"] .message {
  background: #ffffff !important;
  border-color: #a8b7c8 !important;
  color: #193754 !important;
  box-shadow: 0 7px 18px #19365e12 !important;
}

:root[data-theme="light"] .message p {
  color: #193754 !important;
}

:root[data-theme="light"] .message small {
  color: #425a73 !important;
}

:root[data-theme="light"] .message.staff {
  background: #e6f1ff !important;
  border-color: #6eaef0 !important;
  color: #193754 !important;
}

:root[data-theme="light"] .ticket-attachments a {
  background: #eef6ff !important;
  border-color: #4d9be6 !important;
  color: #075fc9 !important;
}

/* Banner de atendimento/mentoria: selo e aviso precisam de contraste AA. */
:root[data-theme="light"] .support-promo {
  background: linear-gradient(155deg, #ffffff, #edf6ff 52%, #e5f1fb) !important;
  border-color: #8fb5d9 !important;
  color: #193754 !important;
  box-shadow: 0 12px 30px #19365e18 !important;
}

:root[data-theme="light"] .support-promo:before {
  background: radial-gradient(circle at 100% 0, #1683ed26, transparent 36%) !important;
}

:root[data-theme="light"] .promo-kicker {
  background: #eaf3ff !important;
  border-color: #65a9e8 !important;
  color: #075fc9 !important;
}

:root[data-theme="light"] .support-promo h2,
:root[data-theme="light"] .support-promo h2 span {
  color: #102844 !important;
}

:root[data-theme="light"] .promo-lead,
:root[data-theme="light"] .promo-list li {
  color: #294463 !important;
}

:root[data-theme="light"] .promo-price small {
  color: #31577f !important;
}

:root[data-theme="light"] .promo-price b {
  color: #102844 !important;
}

:root[data-theme="light"] .promo-price b span {
  color: #1683ed !important;
}

:root[data-theme="light"] .whatsapp-lock {
  background: #e7f8ee !important;
  border-color: #48a77c !important;
  color: #1c5b3c !important;
}

:root[data-theme="light"] .whatsapp-lock b {
  color: #17633c !important;
}

/* Detalhe do teste de headlines */
:root[data-theme="light"] .stat-card,
:root[data-theme="light"] .snippet-card,
:root[data-theme="light"] .delete-card {
  color: #142d4b !important;
}

:root[data-theme="light"] .stat-card {
  background: #eef3f8 !important;
  border-color: #a9b8c9 !important;
}

:root[data-theme="light"] .stat-card h2,
:root[data-theme="light"] .stat-card .metrics strong,
:root[data-theme="light"] .snippet-card h2 {
  color: #102844 !important;
}

:root[data-theme="light"] .stat-card .muted,
:root[data-theme="light"] .stat-card .metrics span,
:root[data-theme="light"] .snippet-card .muted {
  color: #425a73 !important;
}

:root[data-theme="light"] .snippet-card .code-output {
  background: #f7f9fc !important;
  border-color: #9cacc0 !important;
  color: #1b3554 !important;
}

:root[data-theme="light"] .delete-card {
  background: #fff4f5 !important;
  border-color: #d55a70 !important;
}

:root[data-theme="light"] .delete-card h2,
:root[data-theme="light"] .delete-card .muted {
  color: #7e2637 !important;
}

/* Formulário de criação: os fieldsets tinham fundo escuro próprio. */
:root[data-theme="light"] .headline-variation {
  background: #ffffff !important;
  border-color: #9cacc0 !important;
  color: #294463 !important;
  box-shadow: 0 8px 22px #19365e12 !important;
}

:root[data-theme="light"] .headline-variation legend {
  color: #075fc9 !important;
}

:root[data-theme="light"] .headline-variation label {
  color: #294463 !important;
}

/* Créditos e pagamentos */
:root[data-theme="light"] .credit-balance,
:root[data-theme="light"] .credit-pack,
:root[data-theme="light"] .credit-pack.featured {
  background: #ffffff !important;
  border-color: #8fa8c2 !important;
  color: #142d4b !important;
}

:root[data-theme="light"] .credit-pack p,
:root[data-theme="light"] .credit-row small,
:root[data-theme="light"] .payment-status {
  color: #425a73 !important;
}

:root[data-theme="light"] .credit-help {
  background: #e7f8ee !important;
  border-color: #48a77c !important;
  color: #1c5b3c !important;
}

:root[data-theme="light"] .credit-balance small {
  color: #31577f !important;
}

:root[data-theme="light"] .credit-balance strong,
:root[data-theme="light"] .credit-pack .amount {
  color: #102844 !important;
}

:root[data-theme="light"] .credit-pack .tag {
  background: #eaf3ff !important;
  border-color: #7ea9d5 !important;
  color: #124f91 !important;
}

/* Funil: nenhuma superfície preta permanece no tema claro */
:root[data-theme="light"] .funnel-workspace,
:root[data-theme="light"] .funnel-palette,
:root[data-theme="light"] .funnel-stage,
:root[data-theme="light"] .funnel-node,
:root[data-theme="light"] .funnel-saved,
:root[data-theme="light"] .node-note-editor {
  color: #193754 !important;
}

:root[data-theme="light"] .funnel-workspace {
  background: #ffffff !important;
  border-color: #9cacc0 !important;
  box-shadow: 0 18px 45px #19365e18 !important;
}

:root[data-theme="light"] .funnel-palette {
  background: linear-gradient(180deg, #ffffff, #f4f7fb) !important;
  border-color: #c4cfdd !important;
}

:root[data-theme="light"] .funnel-tabs {
  background: #e9eef5 !important;
}

:root[data-theme="light"] .funnel-tabs button {
  color: #37536f !important;
}

:root[data-theme="light"] .funnel-tabs button.active {
  background: #ffffff !important;
  color: #102844 !important;
  box-shadow: 0 1px 4px #19365e22 !important;
}

:root[data-theme="light"] .palette-title {
  color: #526b86 !important;
}

:root[data-theme="light"] .palette-item {
  background: #ffffff !important;
  border-color: #b2c0d0 !important;
  color: #1b3554 !important;
}

:root[data-theme="light"] .palette-item:hover {
  background: #edf5ff !important;
  border-color: #1683ed !important;
}

:root[data-theme="light"] .palette-help,
:root[data-theme="light"] .empty-canvas {
  color: #526b86 !important;
}

:root[data-theme="light"] .funnel-stage {
  background-color: #f8fafc !important;
  background-image: radial-gradient(#aab8c8 1px, transparent 1px) !important;
}

:root[data-theme="light"] .funnel-node {
  background: linear-gradient(145deg, #ffffff, #f4f7fb) !important;
  border-color: #9cacc0 !important;
  box-shadow: 0 12px 26px #19365e22 !important;
}

:root[data-theme="light"] .funnel-node.selected {
  border-color: #1683ed !important;
  box-shadow: 0 0 0 3px #1683ed2b, 0 14px 30px #19365e25 !important;
}

:root[data-theme="light"] .node-head {
  border-bottom-color: #c4cfdd !important;
}

:root[data-theme="light"] .node-label {
  color: #102844 !important;
}

:root[data-theme="light"] .node-remove {
  background: #fff0f2 !important;
  color: #8d2338 !important;
}

:root[data-theme="light"] .node-note {
  background: #eaf3ff !important;
  color: #124f91 !important;
}

:root[data-theme="light"] .funnel-saved {
  background: #ffffff !important;
  border-color: #a8b7c8 !important;
}

:root[data-theme="light"] .funnel-saved button {
  background: #f1f5fa !important;
  border-color: #a8b7c8 !important;
  color: #1b3554 !important;
}

:root[data-theme="light"] .funnel-saved button.active {
  background: #eaf3ff !important;
  border-color: #1683ed !important;
  color: #0b4c9b !important;
}

:root[data-theme="light"] .funnel-inspector label {
  color: #294463 !important;
}

:root[data-theme="light"] .funnel-status {
  color: #425a73 !important;
}

:root[data-theme="light"] .funnel-status.error {
  color: #8d2338 !important;
}

:root[data-theme="light"] .funnel-status.success {
  color: #17633c !important;
}

:root[data-theme="light"] .funnel-node .node-label,
:root[data-theme="light"] .funnel-node .node-kind,
:root[data-theme="light"] .funnel-inspector label,
:root[data-theme="light"] .node-note-editor,
:root[data-theme="light"] .note-editor-title {
  color: #193754 !important;
}

:root[data-theme="light"] .funnel-inspector input,
:root[data-theme="light"] .node-note-editor input,
:root[data-theme="light"] .node-note-editor textarea {
  background: #ffffff !important;
  color: #193754 !important;
  border-color: #9eafc1 !important;
}

/* Tabelas e estados com contraste AA */
:root[data-theme="light"] .headline-table td,
:root[data-theme="light"] .headline-table th,
:root[data-theme="light"] .headline-table .creator,
:root[data-theme="light"] .admin-note {
  color: #275783 !important;
}

:root[data-theme="light"] .headline-table td strong,
:root[data-theme="light"] .owner-heading h3 {
  color: #102844 !important;
}

/* Layout fluido: evita cortes e rolagem horizontal acidental */
:root[data-theme="light"] .app-main,
:root[data-theme="light"] .app-main > *,
:root[data-theme="light"] .page,
:root[data-theme="light"] .tool-card,
:root[data-theme="light"] .card {
  min-width: 0;
  box-sizing: border-box;
}

:root[data-theme="light"] img,
:root[data-theme="light"] video,
:root[data-theme="light"] iframe {
  max-width: 100%;
}

:root[data-theme="light"] .installer-card select,
:root[data-theme="light"] .installer-card textarea,
:root[data-theme="light"] .installer-card label {
  color: #294463 !important;
}

:root[data-theme="light"] .installer-card select,
:root[data-theme="light"] .installer-card textarea {
  background: #ffffff !important;
  border-color: #9cacc0 !important;
}

/* Extrator YouTube: quota e rótulos precisam manter leitura no fundo claro. */
:root[data-theme="light"] .youtube-tool .youtube-limit-box,
:root[data-theme="light"] .youtube-limit-box {
  background: #edf6ff !important;
  border-color: #7ea9d5 !important;
  color: #294463 !important;
}

:root[data-theme="light"] .youtube-limit-box strong {
  color: #075fc9 !important;
}

:root[data-theme="light"] .youtube-limit-box b,
:root[data-theme="light"] .youtube-tool label,
:root[data-theme="light"] .youtube-tool .status {
  color: #294463 !important;
}

/* Os extratores sociais usam um bloco de estilo próprio no PHP. */
:root[data-theme="light"] .social-tool .credit-box {
  background: #edf6ff !important;
  border-color: #7ea9d5 !important;
  color: #294463 !important;
}

:root[data-theme="light"] .social-tool .credit-box strong {
  color: #102844 !important;
}

:root[data-theme="light"] .social-tool .credit-box small,
:root[data-theme="light"] .social-tool .limit-choice,
:root[data-theme="light"] .social-tool .price-example,
:root[data-theme="light"] .social-tool form > label:not(.limit-choice) {
  color: #294463 !important;
}

/* Rótulos dos filtros e da pesquisa de criativos. */
:root[data-theme="light"] .creative-panel label,
:root[data-theme="light"] .creative-panel .creative-form-grid label {
  color: #294463 !important;
}

/* Avisos e ajuda de créditos: texto secundário continua escuro no tema claro. */
:root[data-theme="light"] .credit-help,
:root[data-theme="light"] .credit-help b,
:root[data-theme="light"] .credit-help strong {
  color: #17633c !important;
}

/* Campos do inspetor do funil e o editor de anotações. */
:root[data-theme="light"] .funnel-inspector input,
:root[data-theme="light"] .node-note-editor input,
:root[data-theme="light"] .node-note-editor textarea {
  background: #ffffff !important;
  color: #193754 !important;
  border-color: #9eafc1 !important;
}

/* Evita que títulos, links e cartões estourem em telas estreitas. */
:root[data-theme="light"] .app-main h1,
:root[data-theme="light"] .app-main h2,
:root[data-theme="light"] .app-main h3,
:root[data-theme="light"] .app-main p,
:root[data-theme="light"] .app-main label,
:root[data-theme="light"] .app-main .button,
:root[data-theme="light"] .app-main button {
  overflow-wrap: anywhere;
}

:root[data-theme="light"] .app-main .button,
:root[data-theme="light"] .app-main button {
  max-width: 100%;
}

@media (max-width: 840px) {
  .creative-form-grid,
  .headline-basics,
  .headline-variations,
  .credit-grid,
  .credit-history,
  .creative-search-context,
  .stat-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .creative-form-grid button,
  .creative-actions .button,
  .saved-actions .button {
    width: 100%;
  }

  .funnel-stage {
    min-width: 0;
    overflow: auto;
  }
}

@media (max-width: 560px) {
  .app-main {
    overflow-x: hidden;
  }

  .page-header h1,
  .creative-hero h1,
  .saved-hero h1 {
    max-width: 100%;
    overflow-wrap: anywhere;
  }

  .headline-table {
    min-width: 620px;
  }

  .creative-results,
  .saved-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}
