/* =======================================================================
   VALORA CRM | DESIGN SYSTEM GLOBAL v3 | 08/11/2026
   Fonte unica de identidade visual (Light e Dark).
   Carregar POR ULTIMO, apos CSS legado/especifico, em TODAS as paginas.
   Preserva estados semanticos, medidas de layout, JS e regras financeiras.
   Para alterar a marca ou temas, use os tokens abaixo.
   ======================================================================= */

/* TEMA LIGHT - estado padrao, inclusive paginas sem data-theme. */
:root,
html[data-theme="light"] {
  color-scheme: light;
  --valora-ui-accent: #2387E8;
  --valora-ui-cta: #176DC6;
  --valora-ui-cta-hover: #155DA9;
  --valora-ui-accent-hover: #176DC6;
  --valora-ui-accent-soft: rgba(35,135,232,.10);
  --valora-ui-page-bg: #F5F7FA;
  --valora-ui-surface: #FFFFFF;
  --valora-ui-surface-hover: #F8FAFC;
  --valora-ui-input-bg: #FFFFFF;
  --valora-ui-border: #E5EAF0;
  --valora-ui-border-strong: #CBD5E1;
  --valora-ui-text: #172033;
  --valora-ui-text-soft: #334155;
  --valora-ui-muted: #64748B;
  --valora-ui-header: #071827;
  --valora-ui-sidebar: #FAFBFD;
  --valora-ui-radius: 10px;
  --valora-ui-control-height: 36px;
  --valora-ui-focus: 0 0 0 3px rgba(35,135,232,.16);
  --valora-ui-shadow: 0 2px 14px rgba(23,32,51,.045);

  /* Pontes para variaveis historicas, sem refazer componentes. */
  --valora-visual-accent: #2387E8;
  --valora-visual-accent-strong: #176DC6;
  --valora-visual-accent-rgb: 35,135,232;
  --valora-visual-accent-soft: rgba(35,135,232,.10);
  --brand: #2387E8;
  --brand-hover: #176DC6;
  --brand-dark: #176DC6;
  --brand-soft: rgba(35,135,232,.10);
  --blue: #2387E8;
  --blue-hover: #176DC6;
  --blue-soft: rgba(35,135,232,.10);
  --accent: #2387E8;
  --accent-strong: #176DC6;
  --navy: #071827;
  --navy-dark: #071827;
  --navy-soft: #071827;
  --bg: #F5F7FA;
  --bg-soft: #F8FAFC;
  --panel: #FFFFFF;
  --panel-hover: #F8FAFC;
  --border: #E5EAF0;
  --border-hover: #CBD5E1;
  --text: #172033;
  --text-soft: #334155;
  --muted: #64748B;
  --fin-master-blue: #2387E8;
  --fin-master-blue-soft: rgba(35,135,232,.10);
}

html[data-theme="dark"] {
  color-scheme: dark;
  --valora-ui-accent: #2387E8;
  --valora-ui-cta: #176DC6;
  --valora-ui-cta-hover: #155DA9;
  --valora-ui-accent-hover: #59A9F5;
  --valora-ui-accent-soft: rgba(35,135,232,.16);
  --valora-ui-page-bg: #1B1B1B;
  --valora-ui-surface: #1B1B1B;
  --valora-ui-surface-hover: #252525;
  --valora-ui-input-bg: #242424;
  --valora-ui-border: #383838;
  --valora-ui-border-strong: #505050;
  --valora-ui-text: #ECECEC;
  --valora-ui-text-soft: #D7D7D7;
  --valora-ui-muted: #B4B4B4;
  --valora-ui-header: #09080D;
  --valora-ui-sidebar: #09080D;
  --valora-ui-radius: 10px;
  --valora-ui-control-height: 36px;
  --valora-ui-focus: 0 0 0 3px rgba(35,135,232,.24);
  --valora-ui-shadow: none;

  --valora-visual-accent: #2387E8;
  --valora-visual-accent-strong: #2387E8;
  --valora-visual-accent-rgb: 35,135,232;
  --valora-visual-accent-soft: rgba(35,135,232,.16);
  --brand: #2387E8;
  --brand-hover: #59A9F5;
  --brand-dark: #59A9F5;
  --brand-soft: rgba(35,135,232,.16);
  --blue: #2387E8;
  --blue-hover: #59A9F5;
  --blue-soft: rgba(35,135,232,.16);
  --accent: #2387E8;
  --accent-strong: #2387E8;
  --navy: #09080D;
  --navy-dark: #09080D;
  --navy-soft: #09080D;
  --bg: #1B1B1B;
  --bg-soft: #1B1B1B;
  --panel: #1B1B1B;
  --panel-hover: #252525;
  --border: #383838;
  --border-hover: #505050;
  --text: #ECECEC;
  --text-soft: #D7D7D7;
  --muted: #B4B4B4;
  --fin-master-blue: #2387E8;
  --fin-master-blue-soft: rgba(35,135,232,.16);
  --input-bg: #242424;
  --fin-bg: #1B1B1B;
  --fin-card: #1B1B1B;
  --fin-soft: #1B1B1B;
  --surface: #1B1B1B;
  --surface-soft: #1B1B1B;
}

/* Prevencao contra tokens divergentes definidos no proprio body. */
html body {
  --valora-visual-accent: var(--valora-ui-accent) !important;
  --valora-visual-accent-rgb: 35,135,232 !important;
  --brand: var(--valora-ui-accent) !important;
  --brand-hover: var(--valora-ui-accent-hover) !important;
  --blue: var(--valora-ui-accent) !important;
  --blue-hover: var(--valora-ui-accent-hover) !important;
  --accent: var(--valora-ui-accent) !important;
  --fin-master-blue: var(--valora-ui-accent) !important;
}

/* Alias em containers que mantinham definicoes locais.
   Nao aplicar a documentos imprimiveis ou componentes semanticos. */
html body.financeiro-theme-valora {
  --fin-master-blue: var(--valora-ui-accent);
  --fin-master-blue-soft: var(--valora-ui-accent-soft);
}
html body.financeiro-theme-valora main.financeiro-page.valora-lancamentos-compacto,
html[data-theme="dark"] body.financeiro-theme-valora main.financeiro-page.valora-lancamentos-compacto {
  --vfl-surface: var(--valora-ui-surface);
  --vfl-surface-subtle: var(--valora-ui-surface-hover);
  --vfl-border: var(--valora-ui-border);
  --vfl-ink: var(--valora-ui-text);
  --vfl-text: var(--valora-ui-text);
  --vfl-muted: var(--valora-ui-muted);
  --vfl-blue: var(--valora-ui-accent);
  --vfl-blue-soft: var(--valora-ui-accent-soft);
}

/* FUNDO - nao alterar layout ou cores de documentos externos/publicos. */
html body:not(:has(.login-page)):not(:has(.proposal-page-shell)) {
  background-color: var(--valora-ui-page-bg) !important;
  color: var(--valora-ui-text);
}
html body :is(.main, main.financeiro-page, .dashboard-page, .agenda-page, .monitoramento-page,
  .formularios-page, .formularios-vnext, .app-content, .main-content) {
  color: var(--valora-ui-text);
}
html[data-theme="dark"] body :is(.main, main.financeiro-page, .dashboard-page,
  .agenda-page, .monitoramento-page, .formularios-page, .formularios-vnext) {
  background-color: var(--valora-ui-page-bg) !important;
}

/* SUPERFICIES - classes de uso operacional, sem tocar em status/cards especiais. */
html body :is(.panel-card, .section-card, .surface-card, .config-card, .financeiro-card,
  .financeiro-saas-card, .financeiro-panel, .financeiro-filter-panel, .dashboard-panel-card,
  .dashboard-kpi, .dashboard-kpi-box, .kpi-card, .metric-card, .stat-card,
  .filter-card, .filters-card, .table-card, .financeiro-saas-metric,
  .agenda-workspace, .valora-lancamentos-card) {
  background-color: var(--valora-ui-surface) !important;
  color: var(--valora-ui-text);
  border-color: var(--valora-ui-border) !important;
}
html body :is(.panel-card, .section-card, .surface-card, .financeiro-card, .dashboard-panel-card,
  .table-card, .financeiro-panel, .financeiro-saas-card) {
  box-shadow: var(--valora-ui-shadow);
}

/* FORMULARIOS - exclui controles que necessitam cores/navegacao nativas. */
html body :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):not([type="hidden"]), select, textarea) {
  background-color: var(--valora-ui-input-bg) !important;
  color: var(--valora-ui-text) !important;
  border-color: var(--valora-ui-border-strong) !important;
  border-radius: var(--valora-ui-radius);
  font-family: Inter, system-ui, sans-serif;
}
html body :is(input, textarea)::placeholder {
  color: var(--valora-ui-muted);
  opacity: .9;
}
html body :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea):focus-visible {
  border-color: var(--valora-ui-accent) !important;
  outline: 0;
  box-shadow: var(--valora-ui-focus);
}
html body :is(.form-group label, .form-field label, .financeiro-field label) {
  color: var(--valora-ui-text-soft);
}

/* BOTOES - altera SOMENTE acoes explicitamente primarias.
   Cores de status (pago, alerta, perigo, WhatsApp) seguem nos modulos. */
html body :is(.btn-primary, .btn-blue, .agenda-primary-action,
  .proposal-btn-primary, .jcc-primary, .vc-primary,
  .valora-parceiros-toolbar__button--primary):not(:disabled) {
  background-color: var(--valora-ui-cta) !important;
  background-image: none !important;
  border-color: var(--valora-ui-cta) !important;
  color: #FFFFFF !important;
}
html body :is(.btn-primary, .btn-blue, .agenda-primary-action,
  .proposal-btn-primary, .jcc-primary, .vc-primary,
  .valora-parceiros-toolbar__button--primary):not(:disabled):hover {
  background-color: var(--valora-ui-cta-hover) !important;
  border-color: var(--valora-ui-cta-hover) !important;
}
html body :is(.btn, .btn-primary, .btn-secondary, .btn-blue,
  .agenda-primary-action, .agenda-secondary-action, .valora-parceiros-toolbar__button) {
  font-family: Inter, system-ui, sans-serif;
  border-radius: var(--valora-ui-radius);
}
html body :is(.btn-secondary, .agenda-secondary-action):not(:disabled) {
  background-color: var(--valora-ui-surface) !important;
  border-color: var(--valora-ui-border) !important;
  color: var(--valora-ui-text) !important;
}
html body :is(.btn-secondary, .agenda-secondary-action):not(:disabled):hover {
  background-color: var(--valora-ui-surface-hover) !important;
}

/* TABELAS - preserva cores semanticas das celulas e indicadores. */
html body :is(.table-wrapper, .table-container, .table-shell, .financeiro-table-wrap) {
  border-color: var(--valora-ui-border) !important;
}
html body :is(table thead th, .table thead th) {
  background-color: var(--valora-ui-surface-hover) !important;
  color: var(--valora-ui-text-soft) !important;
  border-color: var(--valora-ui-border) !important;
}
html body :is(table tbody td, .table tbody td) {
  border-color: var(--valora-ui-border) !important;
}
html body table tbody tr:hover:not(.is-selected):not(.selected) {
  background-color: var(--valora-ui-surface-hover);
}

/* MODAIS/DRAWERS - apenas painel interno, NUNCA overlay/backdrop. */
html body :is(.modal-content, .modal-content-large, .modal-dialog,
  .modal-card, .confirm-content, .financeiro-modal-content, .drawer-panel) {
  background-color: var(--valora-ui-surface) !important;
  color: var(--valora-ui-text);
  border-color: var(--valora-ui-border) !important;
}
html body :is(.modal-header, .modal-footer, .modal-body) {
  border-color: var(--valora-ui-border) !important;
}
html body :is(.modal-header h2, .modal-header h3, .modal-title) {
  color: var(--valora-ui-text) !important;
}

/* TOPBAR: o mesmo header aparece em paginas com ou sem iframe. */
#valora-menu-root {
  --logo-blue: var(--valora-ui-accent);
  --logo-aqua: var(--valora-ui-accent);
  --logo-aqua-dark: var(--valora-ui-accent-hover);
  --navy: var(--valora-ui-header);
  --navy-dark: var(--valora-ui-header);
  --navy-soft: var(--valora-ui-header);
  --hover-top: var(--valora-ui-accent-soft);
  --drop-bg: var(--valora-ui-surface);
  --drop-text: var(--valora-ui-text);
  --drop-hover: var(--valora-ui-surface-hover);
  --drop-border: var(--valora-ui-border);
}
#valora-menu-root .valora-auvo-topbar,
#valora-menu-root .brand-btn {
  background: var(--valora-ui-header) !important;
}
#valora-menu-root :is(.dropdown, .settings-menu, .user-menu, .mobile-panel) {
  background-color: var(--valora-ui-surface) !important;
  color: var(--valora-ui-text) !important;
  border-color: var(--valora-ui-border) !important;
}
#valora-menu-root :is(.dropdown-item, .theme-option, .settings-link, .mobile-link):hover {
  color: var(--valora-ui-accent) !important;
  background-color: var(--valora-ui-surface-hover) !important;
}

/* Sidebar Financeiro (documento separado, mesma paleta/tokens). */
html {
  --sidebar-bg: var(--valora-ui-sidebar);
  --sidebar-border: var(--valora-ui-border);
  --sidebar-text: var(--valora-ui-text-soft);
  --sidebar-muted: var(--valora-ui-muted);
  --sidebar-hover: var(--valora-ui-surface-hover);
  --sidebar-active: var(--valora-ui-accent-soft);
  --sidebar-active-text: var(--valora-ui-accent);
  --sidebar-accent: var(--valora-ui-accent);
}
html[data-theme="dark"] {
  --sidebar-text: #D7DFE7;
  --sidebar-muted: #8593A1;
  --sidebar-hover: #252525;
  --sidebar-active: #1C3343;
}
.finance-side {
  background-color: var(--valora-ui-sidebar) !important;
  border-color: var(--valora-ui-border) !important;
}
.finance-side__title { color: var(--sidebar-text) !important; }
.finance-side__item.is-active,
.finance-side__item.active { color: var(--valora-ui-accent) !important; }

/* Ajusta a especificidade dos tokens do menu global (modo dark). */
html[data-theme="dark"] #valora-menu-root,
html[data-theme="light"] #valora-menu-root {
  --logo-blue: var(--valora-ui-accent);
  --logo-aqua: var(--valora-ui-accent);
  --logo-aqua-dark: var(--valora-ui-accent-hover);
  --hover-top: var(--valora-ui-accent-soft);
  --drop-hover: var(--valora-ui-surface-hover);
}

/* Sidebar superior em iframe independente: nao alterar sua transparencia. */
body:has(> .valora-auvo-topbar),
html:has(> body > .valora-auvo-topbar) { background: transparent !important; }
html body > .valora-auvo-topbar,
html body > .valora-auvo-topbar .brand-btn {
  background: var(--valora-ui-header) !important;
}
html body > :is(.dropdown, .settings-menu, .user-menu, .mobile-panel) {
  background-color: var(--valora-ui-surface) !important;
  color: var(--valora-ui-text) !important;
  border-color: var(--valora-ui-border) !important;
}

/* LOGIN: mesma identidade, respeitando o formulario proprio. */
html body .login-submit:not(:disabled) {
  background: var(--valora-ui-accent) !important;
  border-color: var(--valora-ui-accent) !important;
  color: #FFFFFF !important;
}
html body .login-submit:not(:disabled):hover {
  background: var(--valora-ui-accent-hover) !important;
}
html body .login-page :is(.input-box input, .input-box select) {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
html[data-theme="dark"] body:has(.login-page) {
  background: #1B1B1B !important;
  color: var(--valora-ui-text);
}
html[data-theme="dark"] body .login-page::before {
  background-image: none !important;
}
html body .login-card,
html body .login-page .input-box,
html body .login-page .provider-button {
  background-color: var(--valora-ui-surface) !important;
  border-color: var(--valora-ui-border) !important;
  color: var(--valora-ui-text);
}
html[data-theme="dark"] body .login-page .input-box,
html[data-theme="dark"] body .login-page .provider-button {
  background-color: var(--valora-ui-input-bg) !important;
}
html body .login-page :is(.login-header h1, .form-field label, .login-header p) {
  color: var(--valora-ui-text) !important;
}
html body .login-page :is(.login-divider span) {
  background-color: var(--valora-ui-border) !important;
}

/* Campos de cadastro - altura minima, sem forcar largura ou alinhamento. */
html body :is(.form-group, .form-field, .financeiro-field)
  :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select) {
  min-height: var(--valora-ui-control-height);
  font-size: 13px;
}

/* Componentes operacionais: sem mudar tamanho/posicao das telas. */
html body :is(.topbar h1, .page-title, .financeiro-saas-title h1,
  .agenda-page-title h1) { color: var(--valora-ui-text) !important; }
html body :is(.topbar-subtitle, .page-subtitle, .financeiro-saas-title p) {
  color: var(--valora-ui-muted) !important;
}
html body :is(a,button,input,textarea,select):focus-visible {
  outline-color: var(--valora-ui-accent);
}

@media print {
  /* A identidade do app nao deve repintar propostas, fichas nem relatorios. */
  html body :is(.proposal-document, .print-document, .print-sheet) {
    background: #FFFFFF !important;
    color: #172033 !important;
  }
}


/* =====================================================================
   v2 | PONTE ENTRE TOKENS LEGADOS E TEMAS
   Em 22 arquivos CSS existem 92 usos de --surface-secondary sem
   definicao; o navegador usa fallback claro #f7f9fc no dark.
   Estes aliases corrigem a raiz do problema inclusive em JS dinamico.
   ===================================================================== */
:root,
html[data-theme="light"] {
  --surface-secondary: #F8FAFC;
  --surface-tertiary: #F1F5F9;
  --surface: #FFFFFF;
  --fin-surface: #FFFFFF;
  --fin-card-soft: #F8FAFC;
  --financeiro-surface-soft: #F8FAFC;
  --panel-soft: #F8FAFC;
  --card: #FFFFFF;
  --border-color: #E5EAF0;
  --text-muted: #64748B;
  --text-secondary: #64748B;
  --text-primary: #172033;
  --text-main: #172033;
  --text-color: #172033;
  --primary: #2387E8;
  --primary-hover: #176DC6;
  --primary-soft: rgba(35,135,232,.10);
  --hover-bg: #F8FAFC;
  --input-bg: #FFFFFF;
  --financeiro-muted: #64748B;
  --fin-muted: #64748B;
  --fin-text: #172033;
  --fin-border: #E5EAF0;
}
html[data-theme="dark"] {
  --surface-secondary: #242424;
  --surface-tertiary: #292929;
  --surface: #1B1B1B;
  --fin-surface: #1B1B1B;
  --fin-card-soft: #242424;
  --financeiro-surface-soft: #242424;
  --panel-soft: #242424;
  --card: #1B1B1B;
  --border-color: #383838;
  --text-muted: #B4B4B4;
  --text-secondary: #B4B4B4;
  --text-primary: #ECECEC;
  --text-main: #ECECEC;
  --text-color: #ECECEC;
  --primary: #2387E8;
  --primary-hover: #59A9F5;
  --primary-soft: rgba(35,135,232,.16);
  --hover-bg: #252525;
  --input-bg: #242424;
  --financeiro-muted: #B4B4B4;
  --fin-muted: #B4B4B4;
  --fin-text: #ECECEC;
  --fin-border: #383838;
}
/* Areas com tokens locais sobrescritos precisam herdar um valor consistente.
   Sem forcar background em status, graficos, badges e documentos. */
html[data-theme="dark"] :is(body,main,.main,.financeiro-page,.financeiro-pagar-page,.financeiro-receber-page) {
  --surface-secondary: #242424 !important;
  --surface-tertiary: #292929 !important;
  --text-muted: #B4B4B4;
  --text-secondary: #B4B4B4;
  --text-primary: #ECECEC;
  --primary: #2387E8;
  --primary-soft: rgba(35,135,232,.16);
}
html[data-theme="light"] :is(body,main,.main,.financeiro-page,.financeiro-pagar-page,.financeiro-receber-page) {
  --surface-secondary: #F8FAFC !important;
  --surface-tertiary: #F1F5F9 !important;
  --text-muted: #64748B;
  --text-secondary: #64748B;
  --text-primary: #172033;
  --primary: #2387E8;
  --primary-soft: rgba(35,135,232,.10);
}

/* Corrige todas as barras de consulta por favorecido, inclusive conteudo
   inserido depois do carregamento da pagina por contas-pagar-conferencia.js. */
html body .financeiro-pagar-page .valora-fav-filtros {
  background: var(--surface-secondary) !important;
  color: var(--valora-ui-text) !important;
  border-color: var(--valora-ui-border) !important;
}
html body .financeiro-pagar-page .valora-fav-filtros__busca,
html body .financeiro-pagar-page .valora-fav-filtros__botao,
html body .financeiro-pagar-page .valora-fav-filtros__menu,
html body .financeiro-pagar-page .valora-fav-filtros__atalhos button {
  background: var(--valora-ui-input-bg) !important;
  border-color: var(--valora-ui-border-strong) !important;
  color: var(--valora-ui-text) !important;
}
html body .financeiro-pagar-page .valora-fav-filtros__busca input {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
html body .financeiro-pagar-page .valora-fav-filtros__ordem,
html body .financeiro-pagar-page .valora-fav-filtros__resultado,
html body .financeiro-pagar-page .valora-fav-filtros__campo label,
html body .financeiro-pagar-page .valora-fav-filtros__atalhos {
  color: var(--valora-ui-muted) !important;
}
html body .financeiro-pagar-page .valora-fav-filtros__botao:hover,
html body .financeiro-pagar-page .valora-fav-filtros__menu button:hover,
html body .financeiro-pagar-page .valora-fav-filtros__atalhos button:hover {
  background: var(--valora-ui-accent-soft) !important;
  color: var(--valora-ui-accent) !important;
  border-color: var(--valora-ui-accent) !important;
}
html body .financeiro-pagar-page .valora-fav-filtros__painel,
html body .financeiro-pagar-page .valora-fav-filtros__menu {
  border-color: var(--valora-ui-border) !important;
}
/* O menu contextual alterna para um portal diretamente no body. */
html body .valora-fav-filtros__menu.is-portal {
  background: var(--valora-ui-surface) !important;
  color: var(--valora-ui-text) !important;
  border-color: var(--valora-ui-border) !important;
}
html body .valora-fav-filtros__menu.is-portal button {
  color: var(--valora-ui-text) !important;
}
html body .valora-fav-filtros__menu.is-portal button:hover {
  background: var(--valora-ui-accent-soft) !important;
  color: var(--valora-ui-accent) !important;
}
/* Foco e acessibilidade: selecionados continuam azuis e com contraste. */
html body .financeiro-pagar-page .valora-fav-filtros__busca:focus-within {
  border-color: var(--valora-ui-accent) !important;
  box-shadow: var(--valora-ui-focus);
}
/* Garante que filtros de Contas a Receber usem os mesmos tokens. */
html body .financeiro-receber-page :is(.valora-conferencia-historico-filtros,
  .valora-receber-contas__toolbar,.valora-receber-contas__filters,
  .valora-receber-contas__selection) {
  border-color: var(--valora-ui-border);
}

/* Avisos e status preservam cores semanticas; desabilitados nao viram ativos. */
html body :is(button,input,select,textarea):disabled,
html body button[aria-disabled="true"] {
  cursor: not-allowed;
}

/* Financeiro legado tinha azul pastel hardcoded no BODY, gerando tabs
   claras quando o HTML estava no Dark. Usado em Fluxo, Banco e Caixa. */
html[data-theme="light"] body.financeiro-theme-valora {
  --fin-u-blue: #2387E8 !important;
  --fin-u-blue-soft: rgba(35,135,232,.10) !important;
  --overview-blue-soft: rgba(35,135,232,.10);
  --fin-master-blue-soft: rgba(35,135,232,.10) !important;
}
html[data-theme="dark"] body.financeiro-theme-valora {
  --fin-u-blue: #2387E8 !important;
  --fin-u-blue-soft: rgba(35,135,232,.16) !important;
  --fin-u-green-soft: rgba(10,166,108,.12) !important;
  --fin-u-red-soft: rgba(239,51,64,.14) !important;
  --fin-u-purple-soft: rgba(113,71,241,.15) !important;
  --overview-blue-soft: rgba(35,135,232,.16);
  --fin-master-blue-soft: rgba(35,135,232,.16) !important;
}
/* Estado de carregamento/consulta de automacoes nao deve aparecer
   como um badge branco; as cores de sucesso/erro sao preservadas. */
html[data-theme="dark"] body.financeiro-theme-valora .financeiro-automation-page
 .financeiro-automation-state:not(.is-active):not(.is-disabled):not(.is-error) {
  background: rgba(35,135,232,.16) !important;
  color: #8AC4FF !important;
  border-color: #345879 !important;
}
html[data-theme="dark"] body.financeiro-theme-valora .financeiro-automation-page
 .financeiro-automation-state.is-active {
  background: rgba(10,166,108,.14) !important;
  color: #8CE0AF !important;
}
html[data-theme="dark"] body.financeiro-theme-valora .financeiro-automation-page
 .financeiro-automation-state:is(.is-disabled,.is-error) {
  background: rgba(239,51,64,.15) !important;
  color: #FF9CA3 !important;
}
/* Auditar foco de componentes ativos, sem alterar graficos. */
html[data-theme="dark"] body.financeiro-theme-valora
 :is(.financeiro-fluxo-modebar,.financeiro-bank-tabsbar,.financeiro-caixa-tabs)
 button.is-active {
  background: rgba(35,135,232,.16) !important;
  color: #8AC4FF !important;
  border-color: rgba(35,135,232,.32) !important;
}

/* Campo de pesquisa usa a superficie do contêiner, sem retangulo escuro
   interno causado por regras antigas de input[type=search]. */
html[data-theme="dark"] body.financeiro-theme-valora main.financeiro-page.financeiro-pagar-page
 .valora-fav-filtros__busca input[type="search"],
html[data-theme="light"] body.financeiro-theme-valora main.financeiro-page.financeiro-pagar-page
 .valora-fav-filtros__busca input[type="search"] {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}


/* =============================================================
   AUDITORIA DE CONTRASTE v3 | componentes legados com precedencia
   alta, constatados em browser com as folhas de estilo completas.
   Sem mudar dimensoes, posicoes ou estados de negocio.
   ============================================================= */

/* Botoes primarios: texto branco legivel com AA, azul institucional
   #2387E8 mantido para links, indicadores e foco. */
html body :is(button.btn-primary,a.btn-primary,.btn.btn-primary,.login-submit,
  .vc-primary,.jcc-primary,.agenda-primary-action):not(.btn-danger):not(.btn-danger-soft):not(.danger-action):not(:disabled),
html:not([data-theme="dark"]) body.financeiro-theme-valora .financeiro-page--overview .financeiro-saas-actions .btn-primary:not(:disabled),
html[data-theme="dark"] body.financeiro-theme-valora .financeiro-page--overview .financeiro-saas-actions .btn-primary:not(:disabled) {
  background: var(--valora-ui-cta) !important;
  border-color: var(--valora-ui-cta) !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}
html body :is(button.btn-primary,a.btn-primary,.btn.btn-primary,.login-submit,
  .vc-primary,.jcc-primary,.agenda-primary-action):not(.btn-danger):not(.btn-danger-soft):not(.danger-action):not(:disabled):hover,
html body.financeiro-theme-valora .financeiro-page--overview .financeiro-saas-actions .btn-primary:not(:disabled):hover {
  background: var(--valora-ui-cta-hover) !important;
  border-color: var(--valora-ui-cta-hover) !important;
}

/* Help/WhatsApp: verde original com letras brancas nao atingia 3:1.
   Mantem semantica da marca sem sacrificar legibilidade. */
html body .btn-whatsapp:not(:disabled) {
  background: #137A39 !important;
  color: #fff !important;
  border-color: #137A39 !important;
}
html body .btn-whatsapp:not(:disabled):hover {
  background: #116C34 !important;
  border-color: #116C34 !important;
}

/* Sem fundo branco residual em acoes secundarias no tema escuro. */
html[data-theme="dark"] body :is(.btn.btn-secondary,.valora-parceiros-toolbar__button:not(.valora-parceiros-toolbar__button--primary)):not(.btn-danger):not(.btn-danger-soft):not(.btn-success):not(.btn-warning):not(:disabled) {
  background: var(--valora-ui-input-bg) !important;
  border-color: var(--valora-ui-border) !important;
  color: var(--valora-ui-text) !important;
  -webkit-text-fill-color: var(--valora-ui-text) !important;
}
html[data-theme="dark"] body :is(.btn.btn-secondary,.valora-parceiros-toolbar__button:not(.valora-parceiros-toolbar__button--primary)):not(.btn-danger):not(.btn-danger-soft):not(.btn-success):not(.btn-warning):hover {
  background: var(--valora-ui-surface-hover) !important;
}

/* Painel de entrada antigo, app.html: antes cards claros + texto claro. */
html[data-theme="dark"] body.valora-dashboard-legacy :is(
  .user-badge,.stat-card,.quick-card,.check-item,.panel-card,.plan-card) {
  background: var(--valora-ui-surface) !important;
  background-color: var(--valora-ui-surface) !important;
  border-color: var(--valora-ui-border) !important;
  color: var(--valora-ui-text) !important;
}
html[data-theme="dark"] body.valora-dashboard-legacy :is(
  .user-meta strong,.stat-value,.quick-card strong,.check-text,.panel-head h3) {
  color: var(--valora-ui-text) !important;
  -webkit-text-fill-color: var(--valora-ui-text) !important;
}
html[data-theme="dark"] body.valora-dashboard-legacy :is(
  .user-meta span,.stat-label,.quick-card small,.panel-head p) {
  color: var(--valora-ui-muted) !important;
}
html[data-theme="dark"] body.valora-dashboard-legacy .user-avatar {
  background: var(--valora-ui-cta) !important;
  color: #fff !important;
}
html[data-theme="dark"] body.valora-dashboard-legacy .stat-value.online {
  color: #8CE0AF !important;
}

/* Configuracoes financeiras: cards, titulos e carregamento. */
html[data-theme="dark"] body.financeiro-theme-valora .financeiro-config-hub {
  --config-blue: #8AC4FF;
  --config-border: #383838;
  --config-muted: #B4B4B4;
}
html[data-theme="dark"] body.financeiro-theme-valora :is(
  .financeiro-config-separation,.financeiro-config-index,
  .financeiro-settings-tile,.financeiro-config-separation__cards article) {
  background: #1B1B1B !important;
  border-color: #383838 !important;
  color: #ECECEC !important;
}
html[data-theme="dark"] body.financeiro-theme-valora .financeiro-config-separation__cards article {
  background: #242424 !important;
}
html[data-theme="dark"] body.financeiro-theme-valora :is(
  .financeiro-settings-tile-copy strong,.financeiro-settings-tile-copy > span,
  .financeiro-config-separation__intro strong,.financeiro-config-separation__cards strong) {
  color: #ECECEC !important;
}
html[data-theme="dark"] body.financeiro-theme-valora :is(
  .financeiro-settings-tile-copy small,.financeiro-config-separation__intro p,
  .financeiro-config-separation__cards p,.financeiro-config-separation__cards small,
  .financeiro-config-index > span) {
  color: #B4B4B4 !important;
}
html[data-theme="dark"] body.financeiro-theme-valora :is(
  .financeiro-config-separation__cards article > span,
  .financeiro-settings-tile-icon) {
  background: rgba(35,135,232,.16) !important;
  color: #8AC4FF !important;
}
html[data-theme="dark"] body.financeiro-theme-valora :is(
  .financeiro-config-inline-actions a,.financeiro-config-index a) {
  background: #242424 !important;
  border-color: #383838 !important;
  color: #ECECEC !important;
}
html[data-theme="dark"] body.financeiro-theme-valora .financeiro-config-used-by { color: #8AC4FF !important; }

/* Abas e filtros financeiros: texto de chip claro sobre fundo branco. */
html[data-theme="dark"] body.financeiro-theme-valora .financeiro-page--overview .financeiro-filter-chip {
  background: #242424 !important;
  border-color: #383838 !important;
  color: #ECECEC !important;
}
html[data-theme="dark"] body.financeiro-theme-valora .financeiro-page--overview .financeiro-filter-chip :is(span,i) { color: #ECECEC !important; }
html[data-theme="dark"] body.financeiro-theme-valora .financeiro-bank-workspace .btn-link {
  color: #8AC4FF !important;
}

/* Login: provedores nao podem ser branco/cinza claro com texto claro. */
html[data-theme="dark"] body .login-page .provider-button,
html[data-theme="dark"] body .login-page .provider-button :is(span,strong) {
  color: #ECECEC !important;
  -webkit-text-fill-color: #ECECEC !important;
}
html[data-theme="dark"] body .login-page .provider-button {
  background: #242424 !important;
  border-color: #383838 !important;
}

/* Ajuda: accordion de perguntas com texto visivel nos dois temas. */
html[data-theme="dark"] body :is(.faq-question,.faq-item) {
  background: #242424 !important;
  border-color: #383838 !important;
  color: #ECECEC !important;
}
html[data-theme="dark"] body .faq-question :is(span,i) { color: #ECECEC !important; }

/* Acervo de arquivos: estado desabilitado + aba selecionada. */
html[data-theme="dark"] body .arq-entity-tab.is-active,
html[data-theme="dark"] body .arq-entity-tab[aria-selected="true"] {
  background: rgba(35,135,232,.16) !important;
  color: #8AC4FF !important;
  border-color: rgba(35,135,232,.35) !important;
}
html[data-theme="dark"] body .arq-entity-tab.is-active :is(span,i) { color: #8AC4FF !important; }
html[data-theme="dark"] body .arq-page-actions .btn:disabled {
  background: #242424 !important;
  color: #B4B4B4 !important;
  border-color: #383838 !important;
}

/* Icones de status: preservar a semantica, eliminar o pastel claro no Dark. */
html[data-theme="dark"] body .acomp-overdue-row.is-receive .acomp-overdue-icon {
  background: rgba(10,166,108,.16) !important;
  color: #8CE0AF !important;
}
html[data-theme="dark"] body .acomp-overdue-row.is-pay .acomp-overdue-icon {
  background: rgba(239,51,64,.17) !important;
  color: #FF9CA3 !important;
}
html[data-theme="dark"] body.financeiro-theme-valora .financeiro-automation-page .automation-channel-icon.is-whatsapp {
  background: rgba(10,166,108,.16) !important;
  color: #8CE0AF !important;
}
html[data-theme="dark"] body.financeiro-theme-valora .financeiro-automation-page .automation-channel-icon.is-email {
  background: rgba(35,135,232,.16) !important;
  color: #8AC4FF !important;
}
html[data-theme="dark"] body.financeiro-theme-valora .financeiro-automation-page .automation-channel-icon.is-sms {
  background: rgba(113,71,241,.18) !important;
  color: #C5B0FF !important;
}
html[data-theme="dark"] body.financeiro-theme-valora .financeiro-automation-page .automation-channel-icon.is-clock {
  background: rgba(245,158,11,.16) !important;
  color: #FFCE78 !important;
}
html[data-theme="dark"] body .ev-section-title h2 span,
html[data-theme="dark"] body.financeiro-theme-valora .valora-mensal-ate-icone {
  background: rgba(35,135,232,.16) !important;
  color: #8AC4FF !important;
}

/* Textos de acao em telas financeiras e contraste dos titulos azuis Light. */
html:not([data-theme="dark"]) body.financeiro-theme-valora :is(
  .financeiro-section-kicker,.financeiro-settings-kicker,.eyebrow) {
  color: #176DC6 !important;
}
html[data-theme="dark"] body.financeiro-theme-valora .financeiro-settings-tile-copy > span { color: #ECECEC !important; }


/* Auditoria fina: textos de navegação e abas com AA nos dois temas. */
html:not([data-theme="dark"]) body .eyebrow { color: #176DC6 !important; }
html:not([data-theme="dark"]) body.financeiro-theme-valora :is(
 .valora-pagar-periodo-opcoes button.is-active,
 .valora-receber-periodo-opcoes button.is-active,
 .financeiro-fluxo-modebar button.is-active,
 .financeiro-caixa-tabs button.is-active,
 .financeiro-chart-periods button.is-active) {
 color: #176DC6 !important;
}
html[data-theme="dark"] body.financeiro-theme-valora .financeiro-page--overview button.is-active {
  color: #8AC4FF !important;
}
html[data-theme="dark"] body #btn-enviar-arquivos:disabled {
  background: #242424 !important;
  background-color: #242424 !important;
  border-color: #383838 !important;
  color: #B4B4B4 !important;
}
html[data-theme="dark"] body #btn-enviar-arquivos:disabled :is(span,i) { color: #B4B4B4 !important; }


/* Retoques de acessibilidade verificados em 49 documentos HTML. */
html:not([data-theme="dark"]) body.financeiro-theme-valora main.financeiro-pagar-page .valora-pagar-periodo-opcoes button.is-active,
html:not([data-theme="dark"]) body.financeiro-theme-valora main.financeiro-receber-page .valora-receber-periodo-opcoes button.is-active,
html:not([data-theme="dark"]) body.financeiro-theme-valora main.financeiro-pagar-page .valora-pagar-periodo-opcoes button.is-active span,
html:not([data-theme="dark"]) body.financeiro-theme-valora main.financeiro-receber-page .valora-receber-periodo-opcoes button.is-active span {
  color: #176DC6 !important;
}
html:not([data-theme="dark"]) body .finance-side .finance-side__section-title { color: #64748B !important; }
html[data-theme="dark"] body .valora-auvo-topbar .new-action {
  background: #176DC6 !important;
  border-color: #176DC6 !important;
  color: #FFFFFF !important;
}
html[data-theme="dark"] body .valora-auvo-topbar .new-action :is(.plus,.label) { color: #FFFFFF !important; }
html[data-theme="dark"] body .valora-auvo-topbar .new-action:hover { background: #155DA9 !important; }

/* =====================================================================
   AUDITORIA RESPONSIVA v4 | 08/11/2026
   Correcoes verificadas em 320, 375, 390, 768, 1024 e 1440 px.
   ===================================================================== */

/* Agenda: entre os breakpoints anteriores, 3 colunas minimas somavam
   mais que o viewport de tablet (768px). Busca passa para segunda linha. */
@media (min-width: 761px) and (max-width: 920px) {
  html body .agenda-page-head {
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas: "title actions" "search search" !important;
    gap: 10px 12px !important;
    min-width: 0;
  }
  html body .agenda-page-title { grid-area: title; min-width: 0; }
  html body .agenda-page-head-actions { grid-area: actions; min-width: 0; }
  html body .agenda-page-search { grid-area: search; min-width: 0; }
}

/* Cartao de login da Auditoria: track de grid min-content excedia 320px. */
@media (max-width: 480px) {
  html body .lock-view {
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100%;
    min-width: 0;
  }
  html body .lock-view .lock-card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0;
    overflow-wrap: anywhere;
  }
}

/* Rotulos sobre fundos claros: azul legado #5ba3e7 tem contraste 2.5:1.
   Usar azul institucional escuro em vez de tom pastel no Light. */
html[data-theme="light"] body.financeiro-theme-valora .eyebrow,
html:not([data-theme="dark"]) body.financeiro-theme-valora .acomp-page-title .eyebrow,
html:not([data-theme="dark"]) body.financeiro-theme-valora .financeiro-saas-title .eyebrow,
html:not([data-theme="dark"]) body.financeiro-theme-valora .financeiro-banco-page--v2 .eyebrow {
  color: #176DC6 !important;
}
/* Prioridade alta: headers financeiros antigos usam seletores com ID de
   estrutura e regra !important, acima do alias simples de .eyebrow. */
html[data-theme="light"] body.financeiro-theme-valora main.financeiro-page > .financeiro-saas-header.topbar .financeiro-saas-title > .eyebrow,
html[data-theme="light"] body.financeiro-theme-valora main.financeiro-page .acomp-page-title .eyebrow,
html[data-theme="light"] body.financeiro-theme-valora main.financeiro-page .topbar-title .eyebrow,
html[data-theme="light"] body.financeiro-theme-valora main.financeiro-page .financeiro-saas-title .eyebrow,
html[data-theme="light"] body.financeiro-theme-valora .financeiro-banco-page--v2 .eyebrow {
  color: #176DC6 !important;
}