/* =============================================================================
   TEMA-ESCURO - aparencia pessoal escura do painel do agente (botao claro/escuro na barra lateral).
   O servidor renderiza <html data-theme-mode="dark|light"> (AgentThemeMode, preferencia appearance.theme); este
   arquivo carrega por ULTIMO nos dois layouts e so age com html[data-theme-mode="dark"] (o claro fica intacto).

   Como funciona: 1) redefine os tokens claros (site.css: --app-bg, --surface, --text...; hx.css: --hx-paper,
   --hx-surface, --hx-ink...) para a pele escura, entao toda regra tokenizada ja nasce certa; 2) tokens que so
   existem como fallback em arquivos de outras frentes (var(--hx-ink-2, #5c564f) etc.) passam a existir no escuro;
   3) cor literal em arquivo de outra frente ganha sobrescrita escopada abaixo, por arquivo de origem.
   A barra lateral e a barra do topo ja sao escuras (tokens --hx-rail-*): nao mudam. A marca terracota segue o accent.

   Paleta grafite (16/10, pedido do dono: escuro mais leve e acinzentado; antes era marrom quase preto).
   Contraste medido (WCAG, texto normal >= 4,5:1) sobre a superficie #2E3033 / fundo #26282B:
     tinta #EDECEA 11,2 / 12,5   tinta2 #DEDCD9 9,7   tinta3 #C5C3BF 7,5   mute #ABA8A3 5,6   faint #A09D98 4,9
     link #F3A27D 6,5   verde #7FD3A6 7,4   ambar #E8C46A 7,9   vermelho #FF9A8C 6,5   azul #8DBDE6 6,7
   Selos (texto sobre o proprio fundo): novo #F3A27D/#4C3122 5,8  verde #7FD3A6/#22412E 6,3  ambar #E8C46A/#473A1B 6,6
     vermelho #FF9A8C/#4B2A26 6,2  azul #8DBDE6/#233B51 5,8  neutro #C5C3BF/#3C3E42 6,1
   ============================================================================= */

/* ----- icones do botao (valem nos dois modos: lua no claro, sol no escuro) ----- */
.hx-theme-toggle .hx-theme-icon-moon,
.hx-theme-toggle .hx-theme-icon-sun { display: inline-flex; align-items: center; justify-content: center; }
.hx-theme-toggle .hx-theme-icon-sun { display: none; }
html[data-theme-mode="dark"] .hx-theme-toggle .hx-theme-icon-moon { display: none; }
html[data-theme-mode="dark"] .hx-theme-toggle .hx-theme-icon-sun { display: inline-flex; }

/* Aviso visivel de falha ao salvar o tema (theme-toggle.js; vale nos dois modos). */
.hx-theme-toast { position: fixed; z-index: 1200; left: 50%; bottom: 20px; transform: translateX(-50%); max-width: min(420px, calc(100vw - 32px)); padding: 10px 14px; border: 1px solid var(--hx-red-line); border-left: 3px solid var(--hx-red); border-radius: 8px; background: var(--hx-red-bg); color: var(--hx-red-ink); font-size: 13px; line-height: 1.45; box-shadow: var(--shadow-md); animation: hx-fade .16s ease-out; }
.hx-theme-toast[hidden] { display: none; }

/* ----- 1. tokens ----- */
html[data-theme-mode="dark"] {
    color-scheme: dark;

    /* site.css */
    --app-bg: #26282B;
    --surface: #2E3033;
    --surface-muted: #36383C;
    --surface-hover: #3C3E42;
    --text: #EDECEA;
    --text-soft: #C5C3BF;
    --text-muted: #ABA8A3;
    --border: #4A4C50;
    --border-soft: #3C3E42;
    --border-strong: #5C5E62;
    --accent-soft: rgba(217, 102, 44, .18);
    --focus: #F3A27D;
    --accent-fg: #F3A27D;
    --success-fg: #7FD3A6;
    --warning-fg: #E8C46A;
    --danger-fg: #FF9A8C;
    --info-fg: #8DBDE6;
    --neutral: #ABA8A3;
    --hx-surface-queue: #2A2C2F;
    --hx-surface-queue-hover: #333539;
    --hx-surface-queue-checked: #4A3A30;
    --hx-line-queue: #424448;
    --hx-chip-queue: #3C3E42;
    --hx-link-queue: #F3A27D;
    --hx-surface-main: #2E3033;
    --hx-surface-side: #2A2C2F;
    --hx-line-side: #424448;
    --hx-edge-side: #4F5155;
    --hx-msg-customer: #2E3033;
    --hx-msg-customer-line: #4A4C50;
    --hx-msg-agent: #23364B;
    --hx-msg-agent-line: #2D4A63;
    --hx-msg-note: #3F3519;
    --hx-msg-note-line: #6B5A1E;
    --hx-msg-link: #F3A27D;
    --hx-msg-link-hover: #F8C2A6;
    --status-new: #4C3122;      --status-new-fg: #F3A27D;
    --status-open: #22412E;     --status-open-fg: #7FD3A6;
    --status-pending: #473A1B;  --status-pending-fg: #E8C46A;
    --status-resolved: #22412E; --status-resolved-fg: #7FD3A6;
    --status-closed: #3C3E42;   --status-closed-fg: #C5C3BF;
    --prio-low: #7FD3A6;
    --prio-medium: #E8C46A;
    --prio-high: #F3A27D;
    --prio-urgent: #FF9A8C;
    --shadow-md: 0 10px 30px rgba(0, 0, 0, .45);
    --shadow-lg: 0 24px 64px rgba(0, 0, 0, .6);

    /* hx.css */
    --hx-paper: #26282B;
    --hx-surface: #2E3033;
    --hx-sunken: #36383C;
    --hx-line: #4A4C50;
    --hx-line2: #5C5E62;
    --hx-ink: #EDECEA;
    --hx-ink2: #DEDCD9;
    --hx-ink3: #C5C3BF;
    --hx-mute: #ABA8A3;
    --hx-faint: #A09D98;
    --hx-brand-deep: #F3A27D;
    --hx-brand-wash: #4D3527;
    --hx-brand-ink: #F3A27D;
    --hx-row-line: #3C3E42;
    --hx-red: #E5675A;
    --hx-red-bg: #4B2A26;
    --hx-red-ink: #FF9A8C;
    --hx-red-line: #6B2E26;
    --hx-amber: #D9A93F;
    --hx-amber-bg: #473A1B;
    --hx-amber-ink: #E8C46A;
    --hx-amber-line: #5C4A1E;
    --hx-green: #4FB582;
    --hx-green-bg: #22412E;
    --hx-green-ink: #7FD3A6;
    --hx-green-line: #2D5A40;
    --hx-blue-bg: #233B51;
    --hx-blue-ink: #8DBDE6;
    --hx-blue-line: #2D4A63;
    --hx-new-bg: #4C3122;
    --hx-new-ink: #F3A27D;
    --hx-new-line: #7A4A2E;
    --hx-hairline: #3C3E42;
    --hx-wash: #3C3E42;
    --hx-btn-ink: #C5C3BF;
    --hx-control-off: #686A6E;
    --hx-rule: #4A4C50;
    --hx-amber-wash: #3F3519;
    --hx-skel-a: #36383C;
    --hx-skel-b: #404246;
    --hx-avatar-bg: #4A4C50;
    --hx-prio-neutral: #77797D;
    --hx-error-text: #F2C3BB;
    --hx-error-bg: #432824;
    --hx-error-line: #6B2E26;
    --hx-error-ref: #C99A92;
    --hx-option-on: #36383C;
    --hx-row-checked: #4A3A30;
    --hx-row-line-faint: #393B3F;
    --hx-row-line-soft: #393B3F;
    --hx-tool-sep: #5C5E62;
    --hx-scroll: #5C5E62;
    --hx-link-hover: #F8C2A6;

    /* 2. tokens que hoje so existem como fallback em arquivos de outras frentes */
    --hx-ink-2: #C5C3BF;
    --hx-muted-bg: #36383C;
    --hx-muted: #ABA8A3;
    --hx-border: #4A4C50;
    --hx-surface-muted: #36383C;
    --surface-subtle: #36383C;
    --primary: #F3A27D;
}

/* Foco e texto no accent dos presets azul e verde do workspace (o accent do preset continua). */
html[data-theme-mode="dark"][data-theme="blue"] { --focus: #8FB3F5; --accent-fg: #8FB3F5; }
html[data-theme-mode="dark"][data-theme="green"] { --focus: #6FD39A; --accent-fg: #6FD39A; }

/* Popups da barra do topo (hx-topbar-rail.css os devolve ao claro): no escuro seguem escuros. */
html[data-theme-mode="dark"] .hx-topbar :is(.hx-menu, .hx-ws-menu, .hx-followup-popover, dialog, [role="menu"], [role="dialog"], [popover]) { color-scheme: dark; }

/* Hover global de link (hx.css fixa #8E3F19): mesma especificidade do original, entao regras proprias vencem. */
:where(html[data-theme-mode="dark"]) a:hover { color: var(--hx-link-hover); }

/* ----- 3. botoes e superficies com cor literal (hx.css, hx-painel.css, hx-workspace.css...) ----- */
/* Botao primario terracota: fundo fixo da marca com texto branco, como no claro. */
html[data-theme-mode="dark"] .hx-btn.is-primary { border-color: #B35426; background: #B35426; color: #FFFFFF; }
html[data-theme-mode="dark"] .hx-btn.is-primary:hover { border-color: #8F431E; background: #8F431E; color: #FFFFFF; }
html[data-theme-mode="dark"] .ag-new-actions .hx-save-btn.is-idle { background: #B35426; color: #FFFFFF; }
html[data-theme-mode="dark"] .hx-error-btn,
html[data-theme-mode="dark"] a.hx-error-btn,
html[data-theme-mode="dark"] a.hx-error-btn:hover { color: #231F1C; }
/* Barra de acao em massa: era tinta escura com texto creme; no escuro usa a pele do trilho. */
html[data-theme-mode="dark"] .hx-bulk { background: var(--hx-rail-raised); color: var(--hx-rail-brand); }
html[data-theme-mode="dark"] .hx-bulk-btn:hover { background: var(--hx-rail-chip); }
html[data-theme-mode="dark"] :is(select, input).hx-bulk-select { background: var(--hx-rail-bg); }
html[data-theme-mode="dark"] .hx-side-client-mark { color: #231F1C; }
html[data-theme-mode="dark"] .hx-btn-primary:disabled,
html[data-theme-mode="dark"] .hx-send:disabled,
html[data-theme-mode="dark"] .hx-send-more:disabled,
html[data-theme-mode="dark"] .hx-save-btn:is(.is-idle, :disabled),
html[data-theme-mode="dark"] .hx-send-group > .hx-send.is-note:disabled { background: #4A4C50; color: #ABA8A3; }
html[data-theme-mode="dark"] :is(.hx-send-more, .hx-ws-resolve-more) { border-left-color: #B9B0A5; }
html[data-theme-mode="dark"] .hx-toggle-knob { background: #EDECEA; }
html[data-theme-mode="dark"] .hx-toggle.is-on .hx-toggle-knob { background: #26282B; }
html[data-theme-mode="dark"] :is(.hx-menu, .hx-ws-menu, .hx-dialog, .hx-composer-menu, .hx-rail-foot .lang-menu) {
    box-shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 18px 48px rgba(0, 0, 0, .5);
}
html[data-theme-mode="dark"] :is(.hx-dialog, dialog.hx-drawer, .hx-shortcuts)::backdrop,
html[data-theme-mode="dark"] :is(.hx-modal-overlay, .hx-feedback-backdrop, .hx-c360-backdrop) { background: rgba(0, 0, 0, .6); }

/* hx-inbox.css (dono paralelo): linhas, selecao e aviso ambar. */
html[data-theme-mode="dark"] :is(.hx-menu-foot) { border-top-color: var(--hx-wash); }
html[data-theme-mode="dark"] .hx-menu-search { border-bottom-color: var(--hx-wash); }
html[data-theme-mode="dark"] .hx-row.is-checked { background: var(--hx-row-checked); }
html[data-theme-mode="dark"] .hx-error.is-amber { background: var(--hx-amber-wash); }
html[data-theme-mode="dark"] .hx-error.is-amber .hx-error-text { color: var(--hx-amber-ink); }
html[data-theme-mode="dark"] .hx-inbox .hx-row-select input.hx-row-check { box-shadow: inset 0 0 0 1.5px var(--hx-control-off); }

/* hx-workspace.css: ticket aberto (historico, compositor, propriedades). */
html[data-theme-mode="dark"] .hx-ws-sent-close:hover { background: var(--hx-green-bg); }
html[data-theme-mode="dark"] :is(.hx-bubble :is(th, td) a, .hx-side-link, .hx-side .hx-side-client-meta .hx-c360-open):hover { color: var(--hx-link-hover); }
html[data-theme-mode="dark"] .hx-composer-editor blockquote { border-left-color: var(--hx-rule); }
html[data-theme-mode="dark"] :is(form.hx-composer [data-mentions-panel], .hx-crecipients, .hx-preview-dialog-head) { border-bottom-color: var(--hx-hairline); }
html[data-theme-mode="dark"] :is(form.hx-composer .hx-composer-extra, form.hx-composer .hx-composer-foot, .hx-preview-dialog-foot) { border-top-color: var(--hx-hairline); }
html[data-theme-mode="dark"] .hx-composer-menu-sep { background: var(--hx-wash); }
html[data-theme-mode="dark"] .hx-cf:last-of-type { border-bottom-color: var(--hx-row-line-faint); }
html[data-theme-mode="dark"] :is(.hx-hours-form, .hx-hours-entry, .hx-relation-form) { border-top-color: var(--hx-row-line-faint); }
html[data-theme-mode="dark"] .hx-ai-unavailable { background: var(--hx-amber-wash); }
html[data-theme-mode="dark"] .hx-msg-head .hx-kind-internal { color: var(--hx-amber-ink); }
html[data-theme-mode="dark"] :is(.hx-msg-to:hover, .hx-msg-to[aria-expanded="true"], .hx-msg-menu-toggle:hover, .hx-msg-menu-toggle[aria-expanded="true"]) { background: var(--hx-wash); }
html[data-theme-mode="dark"] .hx-ws-seen-av { background: var(--hx-avatar-bg); }
html[data-theme-mode="dark"] .hx-cseg .hx-ctab.is-active { box-shadow: 0 1px 2px rgba(0, 0, 0, .4); }

/* painel de operacao, tabela de Relatorios, Minha fila, acoes em massa e painel do cliente (Customer 360) */
html[data-theme-mode="dark"] :is(.hx-table tbody tr:hover, .report-table tbody tr:hover) { background: var(--hx-option-on); }
html[data-theme-mode="dark"] .hx-mine-chip-count { background: var(--hx-hairline); }
html[data-theme-mode="dark"] .hx-shortcut { border-bottom-color: var(--hx-wash); }
html[data-theme-mode="dark"] .hx-bulk-result-close:hover { background: rgba(255, 255, 255, .08); }
html[data-theme-mode="dark"] :is(.hx-c360-head, .hx-c360-identity, .hx-c360-facts, .hx-c360-section) { border-bottom-color: var(--hx-hairline); }
html[data-theme-mode="dark"] :is(.hx-c360-tickets > li, .hx-c360-pager) { border-top-color: var(--hx-row-line-faint); }
html[data-theme-mode="dark"] .hx-c360-avatar { background: var(--hx-avatar-bg); }
html[data-theme-mode="dark"] .hx-c360-tags li { background: var(--hx-wash); }

/* hx-followup.css, saved-views.css, ticket-activities.css, pilot-ticket-detail.css, ag-billing.css */
html[data-theme-mode="dark"] :is(.hx-saved-view-dialog .hx-error-text:not([hidden])) { color: var(--hx-red-ink); }
html[data-theme-mode="dark"] .hx-saved-view-save-error { color: var(--hx-red-ink); background: var(--hx-red-bg); border-color: var(--hx-red-line); }
html[data-theme-mode="dark"] :is(.ticket-activities-refresh, .ticket-activities-pager button) { border-color: var(--hx-line2); background: var(--hx-surface); color: var(--hx-ink2); }
html[data-theme-mode="dark"] :is(.ticket-activity-head time, .ticket-activity-actor) { color: var(--hx-mute); }
html[data-theme-mode="dark"] .hx-kb-draft-success { background: var(--hx-green-bg); color: var(--hx-green-ink); }
html[data-theme-mode="dark"] .ag-billing-notice.is-active { background: var(--hx-green-bg); border-color: var(--hx-green-line); color: var(--hx-green-ink); }
html[data-theme-mode="dark"] :is(.ag-billing-notice.is-error, .ag-billing-error) { background: var(--hx-red-bg); border-color: var(--hx-red-line); color: var(--hx-red-ink); }
html[data-theme-mode="dark"] .ag-billing-notice.is-warning { background: var(--hx-amber-bg); color: var(--hx-amber-ink); }

/* kb-editorial.css (dono paralelo; cores literais em linha unica): superficies da Base de conhecimento. */
html[data-theme-mode="dark"] :is(.kb-filters, .kb-article-row, .kb-editor-grid form, .kb-editor-grid aside) { background: var(--hx-surface); border-color: var(--hx-line); }
html[data-theme-mode="dark"] :is(.kb-eyebrow, .kb-article-row small, .kb-revisions time) { color: var(--hx-mute); }
html[data-theme-mode="dark"] .kb-state-pill { background: var(--hx-wash); color: var(--hx-ink2); }
html[data-theme-mode="dark"] .kb-state { border-color: var(--hx-line2); }
html[data-theme-mode="dark"] :is(.kb-editor-grid input, .kb-editor-grid select, .kb-editor-grid textarea) { border-color: var(--hx-line2); background: var(--hx-sunken); color: var(--hx-ink); }
html[data-theme-mode="dark"] .kb-editor-toolbar { background: var(--hx-sunken); border-color: var(--hx-line2); }
html[data-theme-mode="dark"] .kb-editor-toolbar button { border-color: var(--hx-line2); background: var(--hx-surface); color: var(--hx-ink2); }
html[data-theme-mode="dark"] :is(.kb-message.is-error, .kb-state.is-error) { color: var(--hx-red-ink); }
html[data-theme-mode="dark"] .kb-message.is-success { color: var(--hx-green-ink); }

/* hx-navigation.css: menu de Configuracoes e sino seguem os tokens; formularios legados (site.css) tambem. */
html[data-theme-mode="dark"] :is(input, select, textarea)::placeholder { color: #8F857A; }

/* ----- 4. conteudo HTML de terceiros: cartao claro (como Gmail/Outlook) -----
   O corpo HTML de e-mail/mensagem do cliente, o trecho citado em HTML (.hx-quote.is-html) e o corpo de artigo da KB trazem cores fixas (fundo branco, texto
   preto). No escuro SO esse conteudo fica num cartao claro; cabecalho, acoes do balao, texto puro
   (.hx-msg-text) e o aviso de corpo vazio (data-message-body="empty") seguem escuros. Dentro do cartao os tokens
   voltam aos valores claros, entao titulos, citacoes e links internos ficam legiveis. */
/* CARTAO-CLARO */
html[data-theme-mode="dark"] .hx-msg-body[data-message-body="html"],
html[data-theme-mode="dark"] .hx-kb-body,
html[data-theme-mode="dark"] .kb-preview,
html[data-theme-mode="dark"] .kb-rich-editor,
html[data-theme-mode="dark"] .hx-quote.is-html {
    color-scheme: light;
    --hx-ink: #231F1C;
    --hx-ink2: #3B3733;
    --hx-ink3: #5C564F;
    --hx-mute: #6F6860;
    --hx-faint: #6F6860;
    --hx-line: #E2DDD5;
    --hx-rule: #E6E1D9;
    --hx-brand-deep: #9C461C;
    --hx-msg-link: #9C461C;
    --hx-msg-link-hover: #7A3512;
    --text: #231F1C;
    --text-soft: #5C564F;
    --text-muted: #6F6860;
    --border: #E2DDD5;
    --border-soft: #EDE9E2;
    --border-strong: #CFC8BD;
    --surface: #FFFFFF;
    --surface-muted: #F5F2ED;
    --focus: #9C461C;
    /* Apelidos de site.css (--paper = tinta, --ink-3 = superficie...) sao resolvidos na raiz e herdados ja
       calculados: redefinir so --text nao os alcanca (p usa --muted-2, h1-h4 usam --paper, td --paper-2). */
    --paper: #231F1C;
    --paper-2: #231F1C;
    --paper-3: #6F6860;
    --muted: #6F6860;
    --muted-2: #5C564F;
    --ink-2: #F5F2ED;
    --ink-3: #FFFFFF;
    --ink-4: #EFEAE2;
    --line: #E2DDD5;
    --line-soft: #EDE9E2;
    --hx-paper: #FAF8F5;
    --hx-surface: #FFFFFF;
    --hx-sunken: #F5F2ED;
    --hx-line2: #CFC8BD;
    --hx-wash: #F0EBE4;
    scrollbar-color: #B9B0A5 #F5F2ED;
    background: #FFFFFF;
    color: #231F1C;
    border-radius: 6px;
}
html[data-theme-mode="dark"] .hx-msg-body[data-message-body="html"] { padding: 10px 12px; }
html[data-theme-mode="dark"] .hx-kb-body { padding: 16px 18px; }
html[data-theme-mode="dark"] .hx-quote.is-html { padding: 10px 12px; }
html[data-theme-mode="dark"] .hx-msg-body[data-message-body="html"] a,
html[data-theme-mode="dark"] .hx-kb-body a,
html[data-theme-mode="dark"] .kb-preview a,
html[data-theme-mode="dark"] .kb-rich-editor a,
html[data-theme-mode="dark"] .hx-quote.is-html a { color: #9C461C; }
html[data-theme-mode="dark"] .hx-msg-body[data-message-body="html"] a:hover,
html[data-theme-mode="dark"] .hx-kb-body a:hover,
html[data-theme-mode="dark"] .kb-preview a:hover,
html[data-theme-mode="dark"] .kb-rich-editor a:hover,
html[data-theme-mode="dark"] .hx-quote.is-html a:hover { color: #7A3512; }
/* FIM-CARTAO-CLARO */

/* Conteudo de terceiros no cartao claro: codigo, citacao e tabela com borda e fundo claros (nao herdam o escuro). */
html[data-theme-mode="dark"] :is(.hx-msg-body[data-message-body="html"], .hx-kb-body, .kb-preview, .hx-quote.is-html) :is(code, pre) { background: #F5F2ED; color: #231F1C; border-color: #E2DDD5; }
html[data-theme-mode="dark"] :is(.hx-msg-body[data-message-body="html"], .hx-kb-body, .kb-preview, .hx-quote.is-html) blockquote { color: #5C564F; border-left-color: #CFC8BD; }
html[data-theme-mode="dark"] :is(.hx-msg-body[data-message-body="html"], .hx-kb-body, .kb-preview, .hx-quote.is-html) :is(th, td) { border-color: #E2DDD5; }
html[data-theme-mode="dark"] .kb-rich-editor:focus { border-color: #9C461C; box-shadow: 0 0 0 2px rgba(156, 70, 28, .25); }

/* ----- 5. controles nativos e rolagem (seletor de data/hora, select, barras de rolagem) ----- */
html[data-theme-mode="dark"] { scrollbar-color: var(--hx-scroll) var(--hx-paper); }
html[data-theme-mode="dark"] :is(select option, select optgroup) { background: var(--hx-surface); color: var(--hx-ink); }
html[data-theme-mode="dark"] :is(input[type="date"], input[type="time"], input[type="datetime-local"])::-webkit-calendar-picker-indicator { filter: invert(.85); }
/* O cartao claro devolve o esquema claro aos controles de dentro. */
html[data-theme-mode="dark"] :is(.hx-msg-body[data-message-body="html"], .hx-kb-body, .kb-preview, .kb-rich-editor, .hx-quote.is-html) :is(input, select, textarea, button) { color-scheme: light; }

/* ----- 6. varredura de telas: cor literal clara trocada pelos tokens ----- */
/* Follow-up (hx-followup.css usa --paper, que e tinta, como FUNDO): popover e campos na pele escura. */
html[data-theme-mode="dark"] .hx-followup-popover { background: var(--hx-surface); color: var(--hx-ink2); border-color: var(--hx-line); }
html[data-theme-mode="dark"] :is(.hx-followup-presets button, .hx-followup-actions button) { background: var(--hx-sunken); border-color: var(--hx-line2); color: var(--hx-ink2); }
html[data-theme-mode="dark"] :is(.hx-followup-presets button:hover, .hx-followup-presets button:focus-visible) { background: var(--hx-wash); }
html[data-theme-mode="dark"] .hx-followup-form :is(input, textarea) { background: var(--hx-sunken); border-color: var(--hx-line2); color: var(--hx-ink); }
html[data-theme-mode="dark"] :is(.hx-followup-form small, .hx-followup-head p) { color: var(--hx-mute); }
/* Biblioteca de respostas (Detail.cshtml) e Novo ticket (ag-ticket-new.css). */
html[data-theme-mode="dark"] :is(.hx-macro-item:hover, .hx-macro-item:focus-visible) { background: var(--hx-wash); }
html[data-theme-mode="dark"] :is(.ag-new-card-head, .ag-new-toolbar, .ag-new-custom) { border-color: var(--hx-hairline); }
html[data-theme-mode="dark"] .ag-new-footer :is(.ag-new-submit:disabled, .ag-new-submit[aria-disabled="true"]) { background: #3A332D; border-color: #3A332D; color: #ADA398; opacity: 1; }
/* Etiquetas de estado e avisos com par claro/escuro fixo (SLA, Automacao, atividades). */
html[data-theme-mode="dark"] .sla-badge { background: var(--hx-wash); color: var(--hx-ink2); }
html[data-theme-mode="dark"] .sla-badge.on { background: var(--hx-green-bg); color: var(--hx-green-ink); }
html[data-theme-mode="dark"] :is(.sla-badge.off, .sla-error, .auto-error) { background: var(--hx-red-bg); color: var(--hx-red-ink); }
html[data-theme-mode="dark"] :is(.auto-requeue, .auto-import) { background: var(--hx-amber-bg); color: var(--hx-amber-ink); border-color: var(--hx-amber-line); }
html[data-theme-mode="dark"] .ticket-activity { border-left-color: var(--hx-line2); }
html[data-theme-mode="dark"] .email-layout-preview-frame { color-scheme: light; }
html[data-theme-mode="dark"] :is(.sla-field input, .sla-field select, .sla-inline-field input, .sla-basics input, .sla-basics select) { background: var(--hx-sunken); color: var(--hx-ink); }
html[data-theme-mode="dark"] :is(.sla-ticket-result:hover, .sla-ticket-result:focus-visible) { background: var(--hx-wash); }
html[data-theme-mode="dark"] .sla-facts dt { color: var(--hx-mute); }
html[data-theme-mode="dark"] .sla-status.is-error { color: var(--hx-red-ink); }
html[data-theme-mode="dark"] .sla-status.is-success { color: var(--hx-green-ink); }

/* ----- 7. Base de conhecimento (kb-editorial.css, cores literais azuladas/claras) ----- */
html[data-theme-mode="dark"] :is(.kb-metrics > div, .kb-analytics-table-wrap, .kb-workflow, [data-kb-editor] .kb-history) { background: var(--hx-surface); border-color: var(--hx-line); }
html[data-theme-mode="dark"] :is(.kb-metrics span, .kb-coverage, .kb-queue-hint, .kb-field-hint, .kb-workflow-hint, .kb-period) { color: var(--hx-mute); }
html[data-theme-mode="dark"] .kb-analytics-table :is(th, td) { border-bottom-color: var(--hx-row-line); }
html[data-theme-mode="dark"] .kb-queue-count { background: var(--hx-wash); color: var(--hx-ink2); }
html[data-theme-mode="dark"] :is(.kb-state-pill.is-inreview, .kb-state-pill.is-approved) { background: var(--hx-amber-bg); color: var(--hx-amber-ink); }
html[data-theme-mode="dark"] .kb-article-row.is-review { border-left-color: var(--hx-amber); }
html[data-theme-mode="dark"] .kb-danger { border-color: var(--hx-red); color: var(--hx-red-ink); }
html[data-theme-mode="dark"] .kb-section-nav { border-bottom-color: var(--hx-line); }
html[data-theme-mode="dark"] :is([data-kb-index] .kb-filter-field :is(input, select), [data-kb-analytics] .kb-filters input) { background: var(--hx-sunken); border-color: var(--hx-line2); color: var(--hx-ink); }
html[data-theme-mode="dark"] [data-kb-editor] :is(.kb-editor-grid form, .kb-editor-grid aside, .kb-editor-card) { background: var(--hx-surface); border-color: var(--hx-line); }
html[data-theme-mode="dark"] [data-kb-editor] .form-control-row > :is(input, select) { background-color: var(--hx-sunken); border-color: var(--hx-line2); color: var(--hx-ink); }
html[data-theme-mode="dark"] [data-kb-editor] .kb-editor-toolbar { background: var(--hx-sunken); border-color: var(--hx-line2); }
html[data-theme-mode="dark"] [data-kb-editor] .kb-editor-toolbar button { background: var(--hx-surface); border-color: var(--hx-line); color: var(--hx-ink2); }
html[data-theme-mode="dark"] [data-kb-editor] .kb-editor-toolbar button:hover { border-color: var(--hx-ink3); color: var(--hx-ink); }
html[data-theme-mode="dark"] [data-kb-editor] .kb-state-pill { background: var(--hx-wash); color: var(--hx-ink2); }
html[data-theme-mode="dark"] .kb-card-head { border-bottom-color: var(--hx-row-line); }
html[data-theme-mode="dark"] .kb-usage-custom-form { background: var(--hx-surface); color: var(--hx-ink2); border-color: var(--hx-line); color-scheme: dark; }
html[data-theme-mode="dark"] .kb-usage-custom-form label { color: var(--hx-ink3); }
html[data-theme-mode="dark"] .kb-usage-custom-form input { background: var(--hx-sunken); border-color: var(--hx-line2); color: var(--hx-ink); }
html[data-theme-mode="dark"] .hx-topbar .kb-chip-select select option { background: var(--hx-rail-bg); color: var(--hx-rail-strong); }