/* Controles Quick. O --accent pode ser ajustado em Configurações. */
:root {
  --accent: #b9a47b;
  --accent-hover: #b9a47b;
  --border-focus: var(--accent);
  --gradient-primary: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent) 82%, #14243b));
  --shadow-glow: 0 0 20px color-mix(in srgb, var(--accent) 22%, transparent);
  --quick-action-bg: #b9a47b;
  --quick-action-hover: #b9a47b;
  --quick-switch-off: #64748b;
  --quick-switch-border: #475569;
}

html[data-theme="dark"] {
  --quick-switch-off: #64748b;
  --quick-switch-border: #94a3b8;
}

/* O botão básico usa flex; text-align sozinho não centraliza seu conteúdo
   quando o botão ocupa a largura do formulário ou da coluna. */
html body .btn {
  justify-content: center;
  text-align: center;
}

/* Mensagens de confirmação e erro usam o mesmo bloco em todas as páginas. */
html body :is([role="status"], [role="alert"])[data-state="success"],
html body :is([role="status"], [role="alert"])[data-state="error"],
html body :is([role="status"], [role="alert"])[data-state="warning"] {
  display: block !important;
  max-width: 100%;
  margin: 12px 0;
  padding: 12px 16px;
  border: 1px solid;
  border-radius: 10px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.45;
}
html body [hidden][data-state] { display: none !important; }
html body :is([role="status"], [role="alert"])[data-state="success"] {
  border-color: #86efac;
  background: #dcfce7;
  color: #14532d !important;
}
html body :is([role="status"], [role="alert"])[data-state="error"] {
  border-color: #fca5a5;
  background: #fee2e2;
  color: #7f1d1d !important;
}
html body :is([role="status"], [role="alert"])[data-state="warning"] {
  border-color: #e6ca84;
  background: #fff4dd;
  color: #6c4d12 !important;
}
html body :is([role="status"], [role="alert"])[data-state="success"]:empty,
html body :is([role="status"], [role="alert"])[data-state="error"]:empty,
html body :is([role="status"], [role="alert"])[data-state="warning"]:empty {
  display: none !important;
}
html[data-theme="dark"] body :is([role="status"], [role="alert"])[data-state="success"] {
  border-color: #2f8056;
  background: #153b2a;
  color: #bcf7d4 !important;
}
html[data-theme="dark"] body :is([role="status"], [role="alert"])[data-state="error"] {
  border-color: #9f4a50;
  background: #452428;
  color: #ffd1d1 !important;
}
html[data-theme="dark"] body :is([role="status"], [role="alert"])[data-state="warning"] {
  border-color: #82621f;
  background: #3b2d12;
  color: #ffda8a !important;
}

/* Estados funcionais (erro, alerta, pagamento, disponibilidade) mantêm suas cores. */
html body .cfg-toggle input:not(:checked) + .cfg-toggle-slider,
html body .toggle-switch input:not(:checked) + .toggle-slider,
html body .mes-sw input:not(:checked) + span,
html body .osp-sw input:not(:checked) + span,
html body .dpg-sw input:not(:checked) + span,
html body .dpx-sw input:not(:checked) + span {
  background: var(--quick-switch-off) !important;
  border: 1px solid var(--quick-switch-border) !important;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--quick-switch-border) 50%, transparent) !important;
}

html body .cfg-toggle input:checked + .cfg-toggle-slider,
html body .toggle-switch input:checked + .toggle-slider,
html body .mes-sw input:checked + span,
html body .osp-sw input:checked + span,
html body .dpg-sw input:checked + span,
html body .dpx-sw input:checked + span {
  background: var(--accent) !important;
  border: 1px solid color-mix(in srgb, var(--accent) 76%, #17263a) !important;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 60%, transparent) !important;
}

html body .cfg-toggle input:focus-visible + .cfg-toggle-slider,
html body .toggle-switch input:focus-visible + .toggle-slider,
html body .mes-sw input:focus-visible + span,
html body .osp-sw input:focus-visible + span,
html body .dpg-sw input:focus-visible + span,
html body .dpx-sw input:focus-visible + span {
  outline: 3px solid var(--accent) !important;
  outline-offset: 3px;
}

/* Preenchimentos de ação: variação escura da marca com texto branco. */
html[data-theme] body .btn-primary,
html[data-theme] body .period-btn.active,
html[data-theme] body .btn-secondary.active,
html[data-theme] body .btn-outline.active,
html[data-theme] body .pagination-buttons button.active,
html[data-theme] body .pagination-btn.active,
html[data-theme] body .dp-pg-btns button.on,
html[data-theme] body .period-btn[style*="background: var(--accent)"],
html[data-theme] body .period-btn[style*="background:var(--accent)"],
html[data-theme] body .st-tabs > button.st-tab-on,
html[data-theme] body .cat-btn.active,
html[data-theme] body .pdv-mobile-toggle,
html[data-theme] body .osp-ck .osp-tabs > button.on,
html[data-theme] body .dpu-tabs button.on,
html[data-theme] body .mes-seg button.on,
html[data-theme] body .mes-tabsw button.on,
html[data-theme] body .ag-mini.pri,
html[data-theme] body .cli-act.pri,
html[data-theme] body .cli-pg.on,
html[data-theme] body .cli-chip.on,
html[data-theme] body .pdk-seg button.on,
html[data-theme] body .dpe-seg button.on,
html[data-theme] body .dpe-btn.pri,
html[data-theme] body .dpv-toggle button.on,
html[data-theme] body .dpi-tab.on,
html[data-theme] body .dpad-tabs button.on,
html[data-theme] body .dpet-seg button.on,
html[data-theme] body .dpit-b.pri,
html[data-theme] body .dpit-chip.on,
html[data-theme] body .vld-tabs button.on,
html[data-theme] body .vld-chips button.on,
html[data-theme] body .dpg-tabs button.on,
html[data-theme] body .dpg-seg button.on,
html[data-theme] body .cpro-days button.on,
html[data-theme] body .sn-tabs button.on,
html[data-theme] body .dpe-days input:checked + span,
html[data-theme] body .dpcd-chip:hover,
html[data-theme] body .dpq-add:hover,
html[data-theme] body .dpa-btn:hover,
html[data-theme] body .st-theme-go,
html[data-theme] body .st-tour-nav .st-next,
html[data-theme] body .st-side-cta a,
html[data-theme] body .st-nudge .st-go {
  background: var(--quick-action-bg) !important;
  border-color: var(--quick-action-bg) !important;
  color: #fff !important;
}

html[data-theme] body .btn-primary:hover,
html[data-theme] body .st-tabs > button.st-tab-on:hover,
html[data-theme] body .cat-btn.active:hover,
html[data-theme] body .cli-act.pri:hover,
html[data-theme] body .st-theme-go:hover {
  background: var(--quick-action-hover) !important;
}

html[data-theme] body .st-tabs > button.st-tab-on i,
html[data-theme] body .btn-primary i,
html[data-theme] body .cat-btn.active i {
  color: inherit !important;
}

html body input[type="checkbox"],
html body input[type="radio"] {
  accent-color: var(--accent);
}

/* Todo campo preserva respiro para texto, calendário, seta ou ícone nativo. */
html body input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
html body textarea,
html body select {
  box-sizing: border-box;
  padding-left: 13px !important;
  padding-right: 13px !important;
}
html body input[type="date"],
html body select:not([multiple]) {
  padding-right: 46px !important;
}
/* O login usa ícones dentro dos campos; a regra global acima não pode ocupar
   o espaço reservado a eles. Também vale para cadastro e recuperação de senha. */
html body.ln-body .ln .ln-in input:not([type="checkbox"]):not([type="radio"]) {
  padding-left: 46px !important;
}

/* A seta nativa ignora padding-right: desenhá-la aqui permite o mesmo
   afastamento em filtros, formulários e selects criados por JavaScript. */
html body select:not([multiple]):not([size]) {
  -webkit-appearance: none !important;
  appearance: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m3.5 6 4.5 4.5L12.5 6' fill='none' stroke='%235b6577' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  background-size: 14px 14px !important;
}
html[data-theme="dark"] body select:not([multiple]):not([size]) {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m3.5 6 4.5 4.5L12.5 6' fill='none' stroke='%23c4c9d4' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
}

/* Identidade pessoal consistente no cabeçalho, cartões e cadastros. */
html body .header-avatar,
html body .user-avatar,
html body .avatar-preview,
html body .user-card-avatar,
html body .quick-user-card-avatar,
html body .quick-user-photo-preview {
  border-radius: 50% !important;
  overflow: hidden;
  border: 0 !important;
  box-shadow: none !important;
}
html body .header-avatar img,
html body .user-avatar img,
html body .avatar-preview img,
html body .user-card-avatar img,
html body .quick-user-card-avatar img,
html body .quick-user-photo-preview img { border-radius: inherit; }

html body .quick-whatsapp-link { color: inherit; text-decoration: none; }
html body .quick-whatsapp-link:hover,
html body .quick-whatsapp-link:focus-visible { color: #087d55; text-decoration: underline; }

/* Contas bancárias: a largura disponível é da tabela e dos cartões, não de uma coluna estreita. */
html[data-theme] body #cbRoot .cb-cards { grid-template-columns:repeat(auto-fit,minmax(300px,1fr)) !important; }
html[data-theme] body #cbRoot .cb-card h4,
html[data-theme] body #cbRoot .cb-card .cb-bal { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
/* O extrato tem uma sexta coluna de ações, muitas vezes vazia. Sem larguras
   definidas ela absorve o espaço que deveria mostrar a descrição e o valor. */
@media (min-width: 761px) {
  html[data-theme] body #cbRoot .cb-ext-top + div > table.data-table {
    width: 100%;
    min-width: 960px;
    table-layout: fixed;
  }
  html[data-theme] body #cbRoot .cb-ext-top + div > table.data-table thead th:nth-child(1) { width: 11%; }
  html[data-theme] body #cbRoot .cb-ext-top + div > table.data-table thead th:nth-child(2) { width: 10%; text-align: left !important; }
  html[data-theme] body #cbRoot .cb-ext-top + div > table.data-table thead th:nth-child(3) { width: 44%; }
  html[data-theme] body #cbRoot .cb-ext-top + div > table.data-table thead th:nth-child(4) { width: 20%; }
  html[data-theme] body #cbRoot .cb-ext-top + div > table.data-table thead th:nth-child(5) { width: 12%; text-align: right !important; }
  html[data-theme] body #cbRoot .cb-ext-top + div > table.data-table thead th:nth-child(6) { width: 3%; }
  html[data-theme] body #cbRoot .cb-ext-top + div > table.data-table tbody td:nth-child(2) { text-align: left !important; }
  html[data-theme] body #cbRoot .cb-ext-top + div > table.data-table tbody td:nth-child(3),
  html[data-theme] body #cbRoot .cb-ext-top + div > table.data-table tbody td:nth-child(4) {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  html[data-theme] body #cbRoot .cb-ext-top + div > table.data-table :is(thead th, tbody td, tfoot td):last-child {
    padding-inline: 6px !important;
  }
}
html[data-theme] body .quick-bank-summary { display:flex; align-items:center; gap:10px 18px; padding-block:15px!important; font-size:14px; }
html[data-theme] body .quick-bank-summary strong { color:var(--text-primary); }

/* Totais financeiros precisam comunicar perda sem depender do tema ativo. */
html body .quick-negative-value {
  color: #c62828 !important;
}
html[data-theme="dark"] body .quick-negative-value {
  color: #ff8a8a !important;
}

/* Toasts são avisos de leitura imediata: nunca podem herdar transparência. */
html body .toast {
  opacity: 1 !important;
  backdrop-filter: none !important;
  background: var(--bg-card, #fff) !important;
  color: var(--text-primary, #18202b) !important;
}
html body .toast.toast-success,
html body .toast.success { background: #e7f7ed !important; border-color: #16834f !important; color: #075b37 !important; }
html body .toast.toast-error,
html body .toast.error,
html body .toast.toast-danger,
html body .toast.danger { background: #fde9e9 !important; border-color: #d92d2d !important; color: #8e2020 !important; }
html body .toast.toast-warning,
html body .toast.warning { background: #fff4db !important; border-color: #b86b00 !important; color: #704000 !important; }
html body .toast.toast-info,
html body .toast.info { background: #e8f2ff !important; border-color: #256fbe !important; color: #174d87 !important; }
html body .toast :is(i,svg) { opacity: 1 !important; }

/* A marca nativa pode ficar preta sobre o dourado. Desenhe a marca branca
   nos checkboxes comuns, preservando os interruptores e o controle do login. */
html body input[type="checkbox"]:not(:is(
  .cfg-toggle input, .toggle-switch input, .mes-sw input,
  .osp-sw input, .dpg-sw input, .dpx-sw input,
  .st-hm-item input, .ln-remember input
)) {
  -webkit-appearance: none;
  appearance: none;
  box-sizing: border-box;
  border: 2px solid var(--quick-switch-border);
  border-radius: 5px;
  background-color: var(--bg-card, #fff);
  background-repeat: no-repeat;
  background-position: center;
  cursor: pointer;
  vertical-align: middle;
}

html body input[type="checkbox"]:not(:is(
  .cfg-toggle input, .toggle-switch input, .mes-sw input,
  .osp-sw input, .dpg-sw input, .dpx-sw input,
  .st-hm-item input, .ln-remember input
)):checked {
  border-color: var(--quick-action-bg);
  background-color: var(--quick-action-bg);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m3 8 3.2 3.2L13 4.5' fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size: 13px 13px;
}

html body input[type="checkbox"]:not(:is(
  .cfg-toggle input, .toggle-switch input, .mes-sw input,
  .osp-sw input, .dpg-sw input, .dpx-sw input,
  .st-hm-item input, .ln-remember input
)):indeterminate {
  border-color: var(--quick-action-bg);
  background-color: var(--quick-action-bg);
  background-image: linear-gradient(#fff, #fff);
  background-size: 9px 2px;
}

html body input[type="checkbox"]:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

html body input[type="checkbox"]:disabled { cursor: not-allowed; }

/* Os filtros de extrato precisam acomodar a data completa e o calendário. */
html[data-theme] body .cb-ext-top { gap: 12px !important; }
html[data-theme] body .cb-ext-top input[type="date"] {
  box-sizing: border-box; flex: 0 0 170px; min-width: 170px !important;
  min-height: 44px; padding-inline: 12px !important;
}
html[data-theme] body .cb-ext-top select { min-height: 44px; }
html[data-theme] body .cb-ext-top select[data-f="acc"] {
  width: 190px !important; min-width: 190px !important; max-width: 100%;
}
@media (max-width: 620px) {
  html[data-theme] body .cb-ext-top input[type="date"] { flex: 1 1 160px; }
}

/* Última coluna de controles encostada ao lado direito da tabela. */
@media (min-width: 761px) {
  html body[data-quick-action-columns] .data-table thead th:last-child,
  html body[data-quick-action-columns] .data-table tbody td:last-child:not([colspan]) {
    text-align: right !important;
    padding-right: 18px !important;
  }
  html body[data-quick-action-columns] .data-table tbody td:last-child:not([colspan]) {
    overflow: visible !important;
    max-width: none !important;
  }
  html body[data-quick-action-columns] .data-table tbody td:last-child .qc-row-actions {
    justify-content: flex-end;
  }
}
@media (max-width: 760px) {
  html body[data-quick-action-columns] table.st-cards td.st-actions {
    justify-content: flex-end !important;
    text-align: right !important;
  }
  html body[data-quick-action-columns] table.st-cards td.st-actions .qc-row-actions {
    justify-content: flex-end;
  }
}

/* Dados e cabeçalhos das tabelas usam peso regular em todo o painel.
   Os ícones mantêm o peso necessário à sua fonte. */
html body table[class] :is(th, td),
html body table[class] :is(th, td) :is(a, b, button, code, div, em, h1, h2, h3, h4, input, label, output, p, select, small, span, strong, textarea, time) {
  font-weight: 400 !important;
}

/* Campos com lupa interna reservam espaço para o ícone e o texto. */
html body .page-content .search-box:has(> i) > input:is([type="text"], [type="search"]) {
  padding-left: 40px !important;
}
html body .page-content #cashSearch {
  padding-left: 34px !important;
}
html body .page-content .search-box > i,
html body .page-content #cashSearch + i {
  pointer-events: none;
}
@media (max-width: 760px) {
  html body table.st-cards td[data-label]:not([data-label=""])::before {
    font-weight: 400 !important;
  }
}

/* Exportação da Auditoria acompanha a altura e os cantos dos filtros. */
html body .page-content .toolbar button[onclick*="exportAudit"] {
  box-sizing: border-box;
  height: 40px !important;
  min-height: 40px !important;
  border-radius: 10px !important;
  align-items: center;
  justify-content: center;
}
@media (min-width: 960px) {
  html body .page-content .toolbar:has(#auditSearch) {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end !important;
  }
  html body .page-content .toolbar:has(#auditSearch) .toolbar-left { min-width: 0; }
  html body .page-content .toolbar:has(#auditSearch) .toolbar-right { align-self: end; }
}
