/* ==========================================================================
   HRZ OPS — calm.css  (30/10/2026, Onda 0 + Ondas 1-2)
   Camada global de cores calmas. Carregada POR ULTIMO em templates/index.html.
   REVERTER (1 linha, sem deploy de codigo):   <html data-calm="off">
   (ou no console:  document.documentElement.dataset.calm='off'; localStorage 'hrz-calm'='off')
   Toda regra abaixo vive sob  :root:not([data-calm="off"])  — desligado = visual anterior intacto.

   Principios
   1. Neutros escuros calmos (grafite, sem preto absoluto, sem azul-indigo saturado).
   2. UM acento (azul, familia #2f5fd0). Verde/ciano/violeta/laranja deixam de ser "marca".
   3. Estados semanticos dessaturados (vermelho/ambar/verde/azul) — cor so em texto, ponto,
      icone e borda fina; fundo quase invisivel. Estado SEMPRE com rotulo/icone alem da cor.
   4. Zero valor = neutro. Sem gradiente chamativo, glow, pulso/piscar, sombra colorida.
   Contraste: calculado por scripts/contraste (tabela no relatorio), AA nos dois temas.
   ========================================================================== */

/* ---------- 1. TOKENS — ESCURO (padrao; tambem quando nao ha data-theme) ---------- */
:root:not([data-calm="off"]):not([data-theme="light"]) {
  color-scheme: dark;
  --surface-page:   #101216;      /* NAO e preto puro */
  --surface:        #171a20;      /* cards */
  --surface-2:      #1c2027;      /* campos, linhas internas */
  --surface-raised: #1f232b;      /* modais, menus */
  --surface-hover:  #272c35;
  --text-1: #e6e8ec;  --text-2: #a3a9b4;  --text-3: #959ca8;  --text-disabled: #5d6470;
  --line-subtle: #20242c;  --line: #2a2f38;  --line-strong: #3a404b;
  --control-border: #6a717d;                         /* borda de campo >= 3:1 */
  --accent:        #8fa8f0;   --accent-strong: #aabcf5;
  --accent-solid:  #3f67d4;   --on-accent: #ffffff;  /* preenchimento do botao primario */
  --accent-bg:     #172036;   --accent-border: #2c3c66;
  --on-solid: #0d1018;                                /* texto sobre preenchimento claro legado */

  --sem-success-text: #7fc9a0; --sem-success-border: #2e5a45; --sem-success-bg: #15241d;
  --sem-warning-text: #d9b36a; --sem-warning-border: #5c4a22; --sem-warning-bg: #231d10;
  --sem-danger-text:  #e5948b; --sem-danger-border:  #6a2f2a; --sem-danger-bg:  #2a1715;
  --sem-info-text:    #8fb2e6; --sem-info-border:    #2c4768; --sem-info-bg:    #14202f;

  --scrim: rgba(8, 10, 13, .62);
  --shadow-sm: 0 1px 2px rgba(0,0,0,.30);
  --shadow-md: 0 2px 8px rgba(0,0,0,.32);
  --shadow-lg: 0 6px 20px rgba(0,0,0,.36);
  --shadow-xl: 0 12px 32px rgba(0,0,0,.40);
  --shadow-focus: 0 0 0 2px var(--surface-page), 0 0 0 4px var(--accent);
}

/* ---------- 2. TOKENS — CLARO ---------- */
:root:not([data-calm="off"])[data-theme="light"] {
  color-scheme: light;
  --surface-page:   #f7f8fa;
  --surface:        #ffffff;
  --surface-2:      #f1f3f6;
  --surface-raised: #ffffff;
  --surface-hover:  #eceff3;
  --text-1: #171a20;  --text-2: #4f5662;  --text-3: #5f6672;  --text-disabled: #9aa1ad;
  --line-subtle: #eef0f3;  --line: #e1e4e9;  --line-strong: #cdd1d9;
  --control-border: #868d99;
  --accent:        #2f5fd0;   --accent-strong: #2449a8;
  --accent-solid:  #2f5fd0;   --on-accent: #ffffff;
  --accent-bg:     #edf1fb;   --accent-border: #b5c5ee;
  --on-solid: #ffffff;

  --sem-success-text: #1f7a4d; --sem-success-border: #9fd3b6; --sem-success-bg: #eef7f1;
  --sem-warning-text: #8a5a00; --sem-warning-border: #e6c77a; --sem-warning-bg: #fbf4e3;
  --sem-danger-text:  #b3382c; --sem-danger-border:  #eeb0a8; --sem-danger-bg:  #fcefed;
  --sem-info-text:    #2b5fa8; --sem-info-border:    #a9c3e6; --sem-info-bg:    #edf3fb;

  --scrim: rgba(16, 18, 22, .45);
  --shadow-sm: 0 1px 2px rgba(16,18,22,.06);
  --shadow-md: 0 2px 8px rgba(16,18,22,.08);
  --shadow-lg: 0 6px 20px rgba(16,18,22,.10);
  --shadow-xl: 0 12px 32px rgba(16,18,22,.12);
  --shadow-focus: 0 0 0 2px var(--surface), 0 0 0 4px var(--accent);
}

/* ---------- 3. REAPONTAMENTO DAS VARIAVEIS LEGADAS (recolore ~8.000 usos de var()) ---------- */
:root:not([data-calm="off"]) {
  --bg-primary:   var(--surface-page);  --bg-secondary: var(--surface);
  --bg-tertiary:  var(--surface-2);     --bg-elevated:  var(--surface-raised);
  --bg-card: var(--surface); --bg-hover: var(--surface-hover);
  --bg: var(--surface-page); --bg2: var(--surface); --bg3: var(--surface-2);
  --text-primary: var(--text-1); --text-secondary: var(--text-2); --text-tertiary: var(--text-3);
  --text-muted: var(--text-3);
  --t1: var(--text-1); --t2: var(--text-2); --t3: var(--text-3);
  --border-subtle: var(--line-subtle); --border-default: var(--line); --border-strong: var(--line-strong);
  --border-hover: var(--line-strong);
  --bd: var(--line); --bd2: var(--line-strong);

  /* paleta neon de 6 cores -> 1 acento + 4 semanticos */
  --emerald: var(--sem-success-text); --emerald-hover: var(--sem-success-text); --emerald-muted: var(--sem-success-bg);
  --amber:   var(--sem-warning-text); --amber-hover:   var(--sem-warning-text); --amber-muted:   var(--sem-warning-bg);
  --orange:  var(--sem-warning-text); --orange-hover:  var(--sem-warning-text); --orange-muted:  var(--sem-warning-bg);
  --rose:    var(--sem-danger-text);  --rose-hover:    var(--sem-danger-text);  --rose-muted:    var(--sem-danger-bg);
  --sky:     var(--accent);           --sky-hover:     var(--accent-strong);    --sky-muted:     var(--accent-bg);
  --violet:  var(--accent);           --violet-hover:  var(--accent-strong);    --violet-muted:  var(--accent-bg);
  --red: var(--sem-danger-text); --green: var(--sem-success-text); --blue: var(--accent);
  --accent-primary: var(--accent); --accent-primary-strong: var(--accent-strong);
  --accent-hover: var(--accent-strong); --accent-muted: var(--accent-bg); --accent-soft: var(--accent-bg);
  --brand-primary: var(--accent); --brand-primary-bg: var(--accent-bg); --brand-primary-dark: var(--accent-strong);
  --border: var(--line); --text: var(--text-1);

  --success: var(--sem-success-text); --success-bg: var(--sem-success-bg); --success-border: var(--sem-success-border);
  --warning: var(--sem-warning-text); --warning-bg: var(--sem-warning-bg); --warning-border: var(--sem-warning-border);
  --error:   var(--sem-danger-text);  --error-bg:   var(--sem-danger-bg);  --error-border:   var(--sem-danger-border);
  --info:    var(--sem-info-text);    --info-bg:    var(--sem-info-bg);    --info-border:    var(--sem-info-border);

  --shadow-glow: none;

  /* familia --color-* (design-tokens-v1; decidia pelo SO) */
  --color-danger-500: var(--sem-danger-text);   --color-danger-bg:  var(--sem-danger-bg);   --color-danger-700: var(--sem-danger-text);
  --color-warning-500: var(--sem-warning-text); --color-warning-bg: var(--sem-warning-bg);  --color-warning-700: var(--sem-warning-text);
  --color-success-500: var(--sem-success-text); --color-success-bg: var(--sem-success-bg);  --color-success-700: var(--sem-success-text);
  --color-info-500: var(--sem-info-text);       --color-info-bg:    var(--sem-info-bg);     --color-info-700: var(--sem-info-text);
  --color-neutral-50: var(--surface-page); --color-neutral-100: var(--surface); --color-neutral-200: var(--line);
  --color-neutral-400: var(--text-3); --color-neutral-500: var(--text-3); --color-neutral-700: var(--text-2); --color-neutral-900: var(--text-1);
  --color-gamification-diamond: var(--accent); --color-gamification-gold: var(--sem-warning-text);
  --color-gamification-silver: var(--text-3);  --color-gamification-bronze: var(--sem-warning-text); --color-gamification-iron: var(--text-3);

  /* familia --hrz-* (design-tokens.css) */
  --hrz-surface-1: var(--surface); --hrz-surface-2: var(--surface-page); --hrz-surface-3: var(--surface-2);
  --hrz-surface-overlay: var(--scrim);
  --hrz-text-primary: var(--text-1); --hrz-text-secondary: var(--text-2); --hrz-text-tertiary: var(--text-3);
  --hrz-text-inverse: var(--surface); --hrz-text-link: var(--accent);
  --hrz-border-subtle: var(--line-subtle); --hrz-border-default: var(--line); --hrz-border-emphasis: var(--line-strong);
  --hrz-border-focus: var(--accent);
  --hrz-status-success-bg: var(--sem-success-bg); --hrz-status-success-fg: var(--sem-success-text); --hrz-status-success-border: var(--sem-success-border);
  --hrz-status-warning-bg: var(--sem-warning-bg); --hrz-status-warning-fg: var(--sem-warning-text); --hrz-status-warning-border: var(--sem-warning-border);
  --hrz-status-error-bg:   var(--sem-danger-bg);  --hrz-status-error-fg:   var(--sem-danger-text);  --hrz-status-error-border:   var(--sem-danger-border);
  --hrz-status-info-bg:    var(--sem-info-bg);    --hrz-status-info-fg:    var(--sem-info-text);    --hrz-status-info-border:    var(--sem-info-border);
  --hrz-status-premium-bg: var(--accent-bg);      --hrz-status-premium-fg: var(--accent);
  --hrz-brand-primary: var(--accent); --hrz-brand-primary-hover: var(--accent-strong); --hrz-brand-primary-bg: var(--accent-bg);
  --hrz-brand-secondary: var(--accent); --hrz-brand-secondary-hover: var(--accent-strong);
  --hrz-nav-item-bg-hover: var(--surface-hover); --hrz-nav-item-bg-active: var(--accent-bg);
  --hrz-nav-item-fg-active: var(--text-1); --hrz-nav-item-bar-active: var(--accent); --hrz-nav-section-fg: var(--text-3);
  --hrz-notif-dot-bg: var(--sem-danger-text); --hrz-notif-dot-ring: transparent;
  --hrz-elev-sm: var(--shadow-sm); --hrz-elev-md: var(--shadow-md); --hrz-elev-lg: var(--shadow-lg); --hrz-elev-xl: var(--shadow-xl);
  --hrz-elev-focus: var(--shadow-focus); --shadow-focus: var(--shadow-focus);

  /* wave11 / wave12 (aprovacoes, tarefas) */
  --freshness-fresh: var(--sem-success-text); --freshness-recent: var(--accent);
  --freshness-stale: var(--sem-warning-text); --freshness-old: var(--sem-danger-text);
  --sync-synced: var(--sem-success-text); --sync-pending: var(--sem-warning-text);
  --sync-error: var(--sem-danger-text); --sync-ghost: var(--text-3);
  --outcome-cliente: var(--accent); --outcome-gestor: var(--sem-warning-text); --outcome-arquivo: var(--text-3);
  --age-aging-bg: var(--sem-warning-bg); --age-old-bg: var(--sem-danger-bg); --age-ghost-bg: var(--surface-2);
  --scope-personal-bg: var(--accent-bg); --scope-personal-border: var(--accent-border); --scope-personal-text: var(--accent);
  --scope-global-bg: var(--surface-2);   --scope-global-border: var(--line-strong);      --scope-global-text: var(--text-2);
  --tv1-kpi-critical: var(--sem-danger-text); --tv1-kpi-warn: var(--sem-warning-text); --tv1-kpi-ok: var(--sem-success-text);
  --tv1-tab-active: var(--accent); --tv1-tab-active-bg: var(--accent-bg);
  --tv1-tab-count-bg: var(--surface-2); --tv1-tab-count-fg: var(--text-2);
  --tv1-chip-bg: var(--surface); --tv1-chip-border: var(--line); --tv1-chip-active-bg: var(--accent-solid); --tv1-chip-active-fg: var(--on-accent);
  --tv1-chip-hover-border: var(--accent);
  --tv1-row-hover: var(--surface-hover); --tv1-row-aging: var(--sem-warning-bg); --tv1-row-old: var(--sem-danger-bg);
  --tv1-status-bg: var(--surface-2); --tv1-status-fg: var(--text-2);
  --tv1-resp-cliente-bg: var(--sem-info-bg);   --tv1-resp-cliente-fg: var(--sem-info-text);
  --tv1-resp-agencia-bg: var(--surface-2);     --tv1-resp-agencia-fg: var(--text-2);
  --tv1-resp-ambos-bg: var(--accent-bg);       --tv1-resp-ambos-fg: var(--accent);
  --tv1-activity-time: var(--text-3);
}

/* ---------- 4. BASE: sem brilho em texto, foco unico, movimento calmo ---------- */
:root:not([data-calm="off"]) * { text-shadow: none !important; }
:root:not([data-calm="off"]) :focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
:root:not([data-calm="off"]) ::selection { background: var(--accent-bg); color: var(--text-1); }
:root:not([data-calm="off"]) body { background: var(--surface-page); color: var(--text-1); }
:root:not([data-calm="off"]) ::-webkit-scrollbar-thumb { background: var(--line-strong); }
:root:not([data-calm="off"]) ::-webkit-scrollbar-thumb:hover { background: var(--text-3); }

/* Pulso/piscar infinito (assinatura de alarme) — so os seletores medidos no codigo; spinner/skeleton ficam */
:root:not([data-calm="off"]) .freshness__dot, :root:not([data-calm="off"]) .sidebar .nav-item.has-pending::after, :root:not([data-calm="off"]) .health-banner-icon, :root:not([data-calm="off"]) .ch-fab,
:root:not([data-calm="off"]) .apv2-tab-sla-dot, :root:not([data-calm="off"]) .apv2-sla-breach, :root:not([data-calm="off"]) .apv2-refresh-btn.has-new, :root:not([data-calm="off"]) .notif-sla-pill-breach,
:root:not([data-calm="off"]) .telem-live-dot, :root:not([data-calm="off"]) .telem-pulse, :root:not([data-calm="off"]) .beta-upvote-badge.hot, :root:not([data-calm="off"]) #coord-last-update[data-stale="1"],
:root:not([data-calm="off"]) .sidebar .nav-item.critical-pending .nav-counter, :root:not([data-calm="off"]) .sidebar .nav-item.critical-pending::after,
:root:not([data-calm="off"]) .card.err .title::before, :root:not([data-calm="off"]) .tag-erro, :root:not([data-calm="off"]) .hrz-frt-halo.is-pulse, :root:not([data-calm="off"]) .smj-pill[data-state="active"]::after,
:root:not([data-calm="off"]) .pp-stage-row[data-state="active"] .pp-stage-icon::after, :root:not([data-calm="off"]) .pa-countdown-urgent,
:root:not([data-calm="off"]) .hrz-empty-icon, :root:not([data-calm="off"]) .empty-state-premium .empty-icon, :root:not([data-calm="off"]) [style*="pulse-border"],
:root:not([data-calm="off"]) .ba-pulse, :root:not([data-calm="off"]) [class*="Pulse"], :root:not([data-calm="off"]) [class*="-pulse"] { animation: none !important; }

/* ---------- 5. CASCA: barra lateral, topo, logo, menu ---------- */
:root:not([data-calm="off"]) .sidebar { background: var(--surface) !important; background-image: none !important; box-shadow: inset -1px 0 0 var(--line) !important; border-right-color: var(--line); }
:root:not([data-calm="off"]) .topbar, :root:not([data-calm="off"]) .header, :root:not([data-calm="off"]) .app-header { background: var(--surface) !important; background-image: none !important; box-shadow: none !important; }
:root:not([data-calm="off"]) .logo-text { background: none !important; -webkit-background-clip: border-box !important; background-clip: border-box !important;
  -webkit-text-fill-color: var(--text-1) !important; color: var(--text-1) !important; }
:root:not([data-calm="off"]) .logo-icon, :root:not([data-calm="off"]) .sidebar-logo svg { color: var(--accent) !important; }
:root:not([data-calm="off"]) .nav-item:hover { background: var(--surface-hover); color: var(--text-1); }
:root:not([data-calm="off"]) .nav-item.active, :root:not([data-calm="off"]) .sidebar .nav-item.active { background: var(--accent-bg) !important; color: var(--text-1) !important; }
:root:not([data-calm="off"]) .nav-item.active::before, :root:not([data-calm="off"]) .sidebar .nav-item.active::before { background: var(--accent) !important; box-shadow: none !important; }
:root:not([data-calm="off"]) .nav-item.active .nav-icon, :root:not([data-calm="off"]) .nav-item.active svg { color: var(--accent); }
/* contadores e selos do menu: neutros (AI/Live/CRM nao sao estado) */
:root:not([data-calm="off"]) .nav-counter, :root:not([data-calm="off"]) .nav-badge, :root:not([data-calm="off"]) .nav-badge.badge-info, :root:not([data-calm="off"]) .nav-badge.badge-success, :root:not([data-calm="off"]) .nav-badge.badge-warning {
  background: var(--surface-2) !important; color: var(--text-2) !important; border-color: var(--line); outline: 1px solid var(--line); outline-offset: -1px; box-shadow: none !important; }
:root:not([data-calm="off"]) .nav-item .nav-counter { color: var(--text-1) !important; }
:root:not([data-calm="off"]) .notification-badge { background: var(--sem-danger-bg) !important; color: var(--sem-danger-text) !important;
  border-color: var(--sem-danger-border); outline: 1px solid var(--sem-danger-border); outline-offset: -1px; box-shadow: none !important; }
:root:not([data-calm="off"]) .sidebar .nav-item.has-pending::after, :root:not([data-calm="off"]) .sidebar .nav-item.critical-pending::after { background: var(--sem-danger-text) !important; box-shadow: none !important; }
:root:not([data-calm="off"]) .sidebar .nav-item.critical-pending .nav-counter { background: var(--sem-danger-bg) !important; color: var(--sem-danger-text) !important; border-color: var(--sem-danger-border); }
:root:not([data-calm="off"]) .nav-section-title, :root:not([data-calm="off"]) .nav-section-label { color: var(--text-3); }

/* banner de saude (topo): era gradiente vermelho + pulso -> superficie neutra, barra e texto de estado */
:root:not([data-calm="off"]) .health-banner { background: var(--surface-raised) !important; background-image: none !important; color: var(--text-1) !important;
  border-bottom-color: var(--sem-danger-border) !important; box-shadow: inset 4px 0 0 var(--sem-danger-text), inset 0 -1px 0 var(--sem-danger-border) !important; }
:root:not([data-calm="off"]) .health-banner.warning { border-bottom-color: var(--sem-warning-border) !important; box-shadow: inset 4px 0 0 var(--sem-warning-text), inset 0 -1px 0 var(--sem-warning-border) !important; }
:root:not([data-calm="off"]) .health-banner-link { color: var(--accent) !important; border-color: var(--accent-border) !important; }

/* botao flutuante de ajuda (era gradiente roxo/rosa com brilho) */
:root:not([data-calm="off"]) #hrz-help-fab { background: var(--surface-raised) !important; background-image: none !important; color: var(--accent) !important;
  border-color: var(--line-strong) !important; outline: 1px solid var(--line-strong) !important; outline-offset: -1px !important; box-shadow: var(--shadow-md) !important; }
:root:not([data-calm="off"]) #hrz-help-fab:hover { background: var(--surface-hover) !important; box-shadow: var(--shadow-lg) !important; transform: none !important; }
:root:not([data-calm="off"]) .hrz-hh-panel [style*="linear-gradient"], :root:not([data-calm="off"]) .hrz-hh-head, :root:not([data-calm="off"]) .hrz-hh-avatar { background-image: none !important; }

/* toasts do shell (app.js usa cor chapada inline + texto branco) */
:root:not([data-calm="off"]) #toast-container > div { background: var(--surface-raised) !important; color: var(--text-1) !important; border-color: var(--line-strong); outline: 1px solid var(--line-strong); outline-offset: -1px;
  --cm-toast: var(--line-strong); box-shadow: inset 4px 0 0 var(--cm-toast), var(--shadow-lg) !important; }
:root:not([data-calm="off"]) #toast-container > div[style*="#10b981"] { --cm-toast: var(--sem-success-text); }
:root:not([data-calm="off"]) #toast-container > div[style*="#f43f5e"] { --cm-toast: var(--sem-danger-text); }
:root:not([data-calm="off"]) #toast-container > div[style*="#f59e0b"] { --cm-toast: var(--sem-warning-text); }
:root:not([data-calm="off"]) #toast-container > div[style*="#6366f1"] { --cm-toast: var(--accent); }

/* ---------- 6. BOTOES ---------- */
:root:not([data-calm="off"]) .btn-primary, :root:not([data-calm="off"]) .btn-ds--primary { background: var(--accent-solid) !important; background-image: none !important; color: var(--on-accent) !important;
  border-color: var(--accent-solid) !important; box-shadow: none !important; }
:root:not([data-calm="off"]) .btn-primary:hover:not(:disabled), :root:not([data-calm="off"]) .btn-ds--primary:hover:not(:disabled) { background: var(--accent-strong) !important; filter: none !important; transform: none !important; box-shadow: none !important; }
:root:not([data-calm="off"]) .btn-success, :root:not([data-calm="off"]) .btn-danger, :root:not([data-calm="off"]) .btn-warning, :root:not([data-calm="off"]) .btn-error { background: transparent !important; background-image: none !important; box-shadow: none !important; transform: none !important; }
:root:not([data-calm="off"]) .btn-success { color: var(--sem-success-text) !important; border-color: var(--sem-success-border) !important; outline: 1px solid var(--sem-success-border) !important; outline-offset: -1px !important; }
:root:not([data-calm="off"]) .btn-danger, :root:not([data-calm="off"]) .btn-error { color: var(--sem-danger-text) !important; border-color: var(--sem-danger-border) !important; outline: 1px solid var(--sem-danger-border) !important; outline-offset: -1px !important; }
:root:not([data-calm="off"]) .btn-warning { color: var(--sem-warning-text) !important; border-color: var(--sem-warning-border) !important; outline: 1px solid var(--sem-warning-border) !important; outline-offset: -1px !important; }
:root:not([data-calm="off"]) .btn-success:hover:not(:disabled) { background: var(--sem-success-bg) !important; }
:root:not([data-calm="off"]) .btn-danger:hover:not(:disabled), :root:not([data-calm="off"]) .btn-error:hover:not(:disabled) { background: var(--sem-danger-bg) !important; }
:root:not([data-calm="off"]) .btn-warning:hover:not(:disabled) { background: var(--sem-warning-bg) !important; }
:root:not([data-calm="off"]) .btn-ghost:hover:not(:disabled) { background: var(--surface-hover); }
:root:not([data-calm="off"]) .btn, :root:not([data-calm="off"]) button { text-shadow: none; }

/* ---------- 7. BADGES, CHIPS, PILULAS: neutro + contorno; cor so quando ha estado ---------- */
:root:not([data-calm="off"]) .badge, :root:not([data-calm="off"]) .chip, :root:not([data-calm="off"]) .pill, :root:not([data-calm="off"]) .tag { box-shadow: none !important; background-image: none !important; }
:root:not([data-calm="off"]) .badge-neutral { background: var(--surface-2); color: var(--text-2); border-color: var(--line); outline: 1px solid var(--line); outline-offset: -1px; }
:root:not([data-calm="off"]) .badge-success, :root:not([data-calm="off"]) .tag-success, :root:not([data-calm="off"]) .pill-success { background: var(--sem-success-bg) !important; color: var(--sem-success-text) !important; border-color: var(--sem-success-border) !important; outline: 1px solid var(--sem-success-border) !important; outline-offset: -1px !important; }
:root:not([data-calm="off"]) .badge-warning, :root:not([data-calm="off"]) .tag-warning, :root:not([data-calm="off"]) .pill-warning { background: var(--sem-warning-bg) !important; color: var(--sem-warning-text) !important; border-color: var(--sem-warning-border) !important; outline: 1px solid var(--sem-warning-border) !important; outline-offset: -1px !important; }
:root:not([data-calm="off"]) .badge-error, :root:not([data-calm="off"]) .badge-danger, :root:not([data-calm="off"]) .tag-danger, :root:not([data-calm="off"]) .pill-danger { background: var(--sem-danger-bg) !important; color: var(--sem-danger-text) !important; border-color: var(--sem-danger-border) !important; outline: 1px solid var(--sem-danger-border) !important; outline-offset: -1px !important; }
:root:not([data-calm="off"]) .badge-info, :root:not([data-calm="off"]) .tag-info, :root:not([data-calm="off"]) .pill-info { background: var(--sem-info-bg) !important; color: var(--sem-info-text) !important; border-color: var(--sem-info-border) !important; outline: 1px solid var(--sem-info-border) !important; outline-offset: -1px !important; }

/* ---------- 8. CARTOES, KPIs, ENTRADAS, MODAIS ---------- */
:root:not([data-calm="off"]) .card, :root:not([data-calm="off"]) .glass-card, :root:not([data-calm="off"]) .glass, :root:not([data-calm="off"]) .panel, :root:not([data-calm="off"]) .kpi-card, :root:not([data-calm="off"]) .stat-card, :root:not([data-calm="off"]) .metric-card {
  background-image: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; box-shadow: var(--shadow-sm) !important; }
:root:not([data-calm="off"]) .card:hover, :root:not([data-calm="off"]) .glass-card:hover, :root:not([data-calm="off"]) .kpi-card:hover { box-shadow: var(--shadow-md) !important; transform: none !important; }
:root:not([data-calm="off"]) .kpi-card-v2 { background-image: none !important; box-shadow: none !important; }
:root:not([data-calm="off"]) .kpi-card-v2__value, :root:not([data-calm="off"]) .kpi-value, :root:not([data-calm="off"]) .kpi-val { color: var(--text-1) !important; }
:root:not([data-calm="off"]) .kpi-icon, :root:not([data-calm="off"]) .stat-icon, :root:not([data-calm="off"]) .kpi-card-v2__icon { background: var(--surface-2) !important; color: var(--text-2) !important; box-shadow: none !important; }
:root:not([data-calm="off"]) .input, :root:not([data-calm="off"]) .select, :root:not([data-calm="off"]) input[type="text"], :root:not([data-calm="off"]) input[type="search"], :root:not([data-calm="off"]) input[type="number"], :root:not([data-calm="off"]) input[type="email"], :root:not([data-calm="off"]) input[type="password"],
:root:not([data-calm="off"]) input[type="date"], :root:not([data-calm="off"]) select, :root:not([data-calm="off"]) textarea { border-color: var(--control-border); }
:root:not([data-calm="off"]) .input:focus, :root:not([data-calm="off"]) .select:focus, :root:not([data-calm="off"]) input:focus, :root:not([data-calm="off"]) select:focus, :root:not([data-calm="off"]) textarea:focus { border-color: var(--accent) !important; box-shadow: var(--shadow-focus) !important; outline: none; }
:root:not([data-calm="off"]) input[type="checkbox"], :root:not([data-calm="off"]) input[type="radio"], :root:not([data-calm="off"]) input[type="range"] { accent-color: var(--accent-solid); }
:root:not([data-calm="off"]) .modal-backdrop, :root:not([data-calm="off"]) .modal-overlay, :root:not([data-calm="off"]) [class*="-overlay"][style*="position:fixed"] { background: var(--scrim) !important; backdrop-filter: none !important; }
:root:not([data-calm="off"]) .modal-content, :root:not([data-calm="off"]) .modal { box-shadow: var(--shadow-xl) !important; }
:root:not([data-calm="off"]) a { text-decoration-color: var(--accent-border); }

/* ---------- 9. INLINE STYLE DAS VIEWS (strings de JS): neutraliza so padroes medidos ---------- */
:root:not([data-calm="off"]) [style*="linear-gradient(135deg"]:not([style*="background-clip"]):not([class*="avatar"]):not(img):not(video) {
  background-image: none !important; background-color: var(--surface) !important; border-color: var(--line) !important; }
:root:not([data-calm="off"]) [style*="linear-gradient(90deg"]:not([class*="skel"]):not([class*="shimmer"]):not([class*="avatar"]):not([style*="background-clip"]) { background-image: none !important; background-color: var(--accent-solid) !important; box-shadow: none !important; }
/* botao/selo com degrade + texto branco fixo inline: sem isso o degrade virava superficie e o texto branco sumia no tema claro */
:root:not([data-calm="off"]) [style*="linear-gradient(135deg"]:is([style*="color:#fff"], [style*="color: #fff"], [style*="color:white"], [style*="color: white"], [style*="color:#FFF"]):not([style*="background-clip"]):not([class*="avatar"]):not(img):not(video) {
  background-color: var(--accent-solid) !important; border-color: var(--accent-solid) !important; color: var(--on-accent) !important; }
:root:not([data-calm="off"]) :is([style*="135deg,#22c55e"], [style*="135deg, #22c55e"], [style*="135deg,#10b981"], [style*="135deg, #10b981"], [style*="135deg, var(--emerald"], [style*="135deg,var(--emerald"]):is([style*="color:#fff"], [style*="color: #fff"], [style*="color:white"], [style*="color: white"]):not(img):not(video):not([style*="background-clip"]) {
  background-color: var(--sem-success-bg) !important; border-color: var(--sem-success-border) !important; color: var(--sem-success-text) !important; outline: 1px solid var(--sem-success-border); outline-offset: -1px; }
:root:not([data-calm="off"]) [style*="background-clip:text"], :root:not([data-calm="off"]) [style*="background-clip: text"], :root:not([data-calm="off"]) [style*="-webkit-background-clip:text"] {
  background: none !important; -webkit-text-fill-color: var(--text-1) !important; color: var(--text-1) !important; }
:root:not([data-calm="off"]) [style*="box-shadow:0 0 "], :root:not([data-calm="off"]) [style*="box-shadow: 0 0 "], :root:not([data-calm="off"]) [style*="box-shadow:0 4px 24px"], :root:not([data-calm="off"]) [style*="box-shadow:0 8px 32px"],
:root:not([data-calm="off"]) [style*="box-shadow:0 2px 8px rgba(124"], :root:not([data-calm="off"]) [style*="box-shadow:0 4px 12px rgba(56"] { box-shadow: var(--shadow-sm) !important; }
/* contador/selo com fundo chapado inline + texto branco */
:root:not([data-calm="off"]) span[style*="color:#fff"][style*="border-radius:10px"], :root:not([data-calm="off"]) span[style*="color:white"][style*="border-radius:10px"] {
  background: var(--surface-2) !important; color: var(--text-1) !important; border-color: var(--line-strong); outline: 1px solid var(--line-strong); outline-offset: -1px; }
/* fundo cheio do tema legado + texto branco/preto fixo: texto vira o contraste do tema */
:root:not([data-calm="off"]) [style*="background:var(--emerald)"][style*="color:#fff"], :root:not([data-calm="off"]) [style*="background:var(--rose)"][style*="color:#fff"],
:root:not([data-calm="off"]) [style*="background:var(--amber)"][style*="color:#fff"], :root:not([data-calm="off"]) [style*="background:var(--sky)"][style*="color:#fff"],
:root:not([data-calm="off"]) [style*="background:var(--violet)"][style*="color:#fff"], :root:not([data-calm="off"]) [style*="background:var(--orange)"][style*="color:#fff"] { color: var(--on-solid) !important; }

/* ---------- 10. EMOJI: nao ha token que controle; rebaixa saturacao so em titulos/abas/menu/chips ---------- */
/* filter so em elementos-folha: em quem tem filhos, filter criava contexto de empilhamento/bloco de contencao
   (tooltip/menu dentro de aba ou titulo saia do lugar) e apagava a cor de estado de contadores e pontos filhos */
:root:not([data-calm="off"]) :is(.page-title, .card-title, .tab, [role="tab"], .chip, .nav-label, .apv2-tab):not(:has(*)) { filter: saturate(.3); }

/* ==========================================================================
   ONDA 1 — TELAS (ordem: Bloco A, Alertas, SLA, Notificacoes/Aprovacoes, Dashboard)
   ========================================================================== */

/* ---------- 11. BLOCO A: harmoniza os tokens --ba-* com os globais (sem editar bloco-a-calm.css) ---------- */
:root:not([data-calm="off"]) .ba-root, :root:not([data-calm="off"]) #ba-modal .box, :root:not([data-calm="off"]) .ba-toast, :root:not([data-calm="off"]) #ba-tip {
  --ba-surface: var(--surface-2); --ba-surface-hi: var(--surface-hover); --ba-line: var(--line-strong);
  --ba-text-1: var(--text-1); --ba-text-2: var(--text-2); --ba-text-3: var(--text-3);
  --ba-risk: var(--sem-danger-text); --ba-risk-t: var(--sem-danger-text); --ba-risk-bg: var(--sem-danger-bg);
  --ba-warn: var(--sem-warning-text); --ba-warn-t: var(--sem-warning-text); --ba-warn-bg: var(--sem-warning-bg);
  --ba-ok: var(--sem-success-text); --ba-ok-t: var(--sem-success-text); --ba-ok-bg: var(--sem-success-bg);
  --ba-accent: var(--accent); --ba-accent-bg: var(--accent-bg); --ba-on-accent: var(--on-accent);
  --ba-data-1: var(--accent); --ba-data-2: var(--text-3); --ba-data-hot: var(--sem-danger-text);
  --ba-pop-bg: var(--surface-raised);
}
:root:not([data-calm="off"]) .ba-btn.primary { background: var(--accent-solid); border-color: var(--accent-solid); color: var(--on-accent); }
:root:not([data-calm="off"]) .ba-btn.primary:hover:not(:disabled) { background: var(--accent-strong); filter: none; }
:root:not([data-calm="off"]) .ba-btn.link { color: var(--accent); }
:root:not([data-calm="off"]) #ba-modal .box, :root:not([data-calm="off"]) #ba-tip, :root:not([data-calm="off"]) .ba-toast { background: var(--surface-raised); color: var(--text-1); }
:root:not([data-calm="off"]) .ba-score { background: var(--surface-2); color: var(--text-1); border-color: var(--line-strong); }
:root:not([data-calm="off"]) .ba-q-item.is-next .ba-score { border-color: var(--accent); }
:root:not([data-calm="off"]) .ba-card, :root:not([data-calm="off"]) .ba-kpi { background: var(--surface); box-shadow: none; }

/* ---------- 14. NOTIFICACOES E APROVACOES (classes .apv2-* e .notif-*) ---------- */
/* abas / chips ativos: acento unico */
:root:not([data-calm="off"]) .apv2-tab.is-active { color: var(--text-1); border-bottom-color: var(--accent); }
:root:not([data-calm="off"]) .apv2-tab.is-active .apv2-tab-count, :root:not([data-calm="off"]) .apv2-grouping-btn.is-active { background: var(--accent-solid); border-color: var(--accent-solid); color: var(--on-accent); box-shadow: none; }
:root:not([data-calm="off"]) .apv2-tab-sla-dot { background: var(--sem-danger-text); box-shadow: none !important; }
:root:not([data-calm="off"]) .apv2-btn-primary { background: var(--accent-solid); color: var(--on-accent); }
:root:not([data-calm="off"]) .apv2-btn-primary:hover:not(:disabled) { background: var(--accent-strong); box-shadow: none; transform: none; }
:root:not([data-calm="off"]) .apv2-btn-approve { background: var(--sem-success-bg); color: var(--sem-success-text); border-color: var(--sem-success-border); outline: 1px solid var(--sem-success-border); outline-offset: -1px; }
:root:not([data-calm="off"]) .apv2-btn-approve:hover { background: var(--sem-success-bg); color: var(--sem-success-text); box-shadow: none; transform: none; filter: brightness(1.15); }
:root:not([data-calm="off"]) .apv2-btn-reject { background: transparent; border-color: var(--sem-danger-border); outline: 1px solid var(--sem-danger-border); outline-offset: -1px; color: var(--sem-danger-text); }
:root:not([data-calm="off"]) .apv2-btn-reject:hover { background: var(--sem-danger-bg); color: var(--sem-danger-text); }
:root:not([data-calm="off"]) .apv2-btn-danger { background: var(--sem-danger-bg); color: var(--sem-danger-text); border-color: var(--sem-danger-border); outline: 1px solid var(--sem-danger-border); outline-offset: -1px; }
:root:not([data-calm="off"]) .apv2-btn-danger:hover:not(:disabled) { background: var(--sem-danger-bg); box-shadow: none; transform: none; filter: brightness(1.15); }
:root:not([data-calm="off"]) .apv2-notif-quick-btn.is-approve { background: var(--sem-success-bg); color: var(--sem-success-text); border-color: var(--sem-success-border); }
:root:not([data-calm="off"]) .apv2-notif-quick-btn.is-reject { color: var(--sem-danger-text); border-color: var(--sem-danger-border); }
:root:not([data-calm="off"]) .apv2-notif-quick-btn.is-reject:hover { background: var(--sem-danger-bg); color: var(--sem-danger-text); }
/* hover/selecao de linha: neutro */
:root:not([data-calm="off"]) .apv2-row:hover, :root:not([data-calm="off"]) .apv2-notif-card:hover { background: var(--surface-hover); }
:root:not([data-calm="off"]) .apv2-row.is-selected, :root:not([data-calm="off"]) .apv2-notif-card.is-selected { background: var(--accent-bg); border-color: var(--accent-border); }
:root:not([data-calm="off"]) .apv2-row.is-ai { background: transparent; border-left-color: var(--accent) !important; }
:root:not([data-calm="off"]) .apv2-row.is-ai:hover { background: var(--surface-hover) !important; }
:root:not([data-calm="off"]) .apv2-row:hover .apv2-row-arrow { color: var(--accent); background: var(--accent-bg); }
:root:not([data-calm="off"]) .apv2-info-btn:hover, :root:not([data-calm="off"]) .apv2-expand-btn:hover, :root:not([data-calm="off"]) .apv2-admin-selector-team:hover { border-color: var(--accent); color: var(--accent); background: var(--accent-bg); }
:root:not([data-calm="off"]) .apv2-admin-selector-team.is-active { border-color: var(--accent); color: var(--accent); background: var(--accent-bg); }
:root:not([data-calm="off"]) .apv2-admin-selector-label svg, :root:not([data-calm="off"]) .apv2-safety-sub a { color: var(--accent); }
:root:not([data-calm="off"]) .apv2-search:focus, :root:not([data-calm="off"]) .apv2-filter:focus, :root:not([data-calm="off"]) .apv2-select:focus, :root:not([data-calm="off"]) .apv2-textarea:focus, :root:not([data-calm="off"]) .apv2-admin-selector-select:focus { border-color: var(--accent); box-shadow: var(--shadow-focus); }
:root:not([data-calm="off"]) .apv2-bulk-bar { border-color: var(--accent-border); outline: 1px solid var(--accent-border); outline-offset: -1px; } :root:not([data-calm="off"]) .apv2-bulk-info strong { color: var(--text-1); }
:root:not([data-calm="off"]) .apv2-group-header { background: var(--surface-2); }
/* pontuacao: neutra por padrao; cor so alta/critica; numero + faixa continuam visiveis */
:root:not([data-calm="off"]) .apv2-score-high { background: var(--sem-danger-bg); color: var(--sem-danger-text); border-color: var(--sem-danger-border); outline: 1px solid var(--sem-danger-border); outline-offset: -1px; }
:root:not([data-calm="off"]) .apv2-score-mid { background: var(--sem-warning-bg); color: var(--sem-warning-text); border-color: var(--sem-warning-border); outline: 1px solid var(--sem-warning-border); outline-offset: -1px; }
:root:not([data-calm="off"]) .apv2-score-low { background: var(--surface-2); color: var(--text-2); border-color: var(--line); outline: 1px solid var(--line); outline-offset: -1px; }
:root:not([data-calm="off"]) .apv2-row-score.apv2-score-critico { background: var(--sem-danger-bg) !important; border-color: var(--sem-danger-border) !important; outline: 1px solid var(--sem-danger-border) !important; outline-offset: -1px !important; color: var(--sem-danger-text) !important; }
:root:not([data-calm="off"]) .apv2-row-score.apv2-score-alta { background: var(--sem-warning-bg) !important; border-color: var(--sem-warning-border) !important; outline: 1px solid var(--sem-warning-border) !important; outline-offset: -1px !important; color: var(--sem-warning-text) !important; }
:root:not([data-calm="off"]) .apv2-row-score.apv2-score-media { background: var(--surface-2) !important; border-color: var(--line-strong) !important; outline: 1px solid var(--line-strong) !important; outline-offset: -1px !important; color: var(--text-1) !important; }
:root:not([data-calm="off"]) .apv2-row-score.apv2-score-baixa { background: var(--surface-2) !important; border-color: var(--line) !important; outline: 1px solid var(--line) !important; outline-offset: -1px !important; color: var(--text-2) !important; }
:root:not([data-calm="off"]) .apv2-row-score:hover, :root:not([data-calm="off"]) .apv2-row-score:focus-visible { box-shadow: none; transform: none; }
/* idade / SLA da linha */
:root:not([data-calm="off"]) .apv2-age-fresh, :root:not([data-calm="off"]) .apv2-sla-fresh { background: var(--surface-2); color: var(--text-2); border-color: var(--line); outline: 1px solid var(--line); outline-offset: -1px; }
:root:not([data-calm="off"]) .apv2-age-warn, :root:not([data-calm="off"]) .apv2-sla-warn { background: var(--sem-warning-bg); color: var(--sem-warning-text); border-color: var(--sem-warning-border); outline: 1px solid var(--sem-warning-border); outline-offset: -1px; }
:root:not([data-calm="off"]) .apv2-age-crit, :root:not([data-calm="off"]) .apv2-sla-crit { background: var(--sem-danger-bg); color: var(--sem-danger-text); border-color: var(--sem-danger-border); outline: 1px solid var(--sem-danger-border); outline-offset: -1px; }
:root:not([data-calm="off"]) .apv2-sla-breach { background: var(--sem-danger-bg); color: var(--sem-danger-text); border-color: var(--sem-danger-border); }
:root:not([data-calm="off"]) .apv2-cu-pill.is-sent { background: var(--surface-2); color: var(--text-2); border-color: var(--line); }
:root:not([data-calm="off"]) .apv2-cu-pill.is-failed, :root:not([data-calm="off"]) .apv2-cu-pill.is-error { background: var(--sem-danger-bg); color: var(--sem-danger-text); border-color: var(--sem-danger-border); }
:root:not([data-calm="off"]) .apv2-row-reversal-badge { background: var(--sem-warning-bg) !important; color: var(--sem-warning-text) !important; border-color: var(--sem-warning-border); outline: 1px solid var(--sem-warning-border); outline-offset: -1px; }
/* categorias: um unico estilo neutro (eram 6 matizes) */
:root:not([data-calm="off"]) .apv2-row-cat-pill, :root:not([data-calm="off"]) .apv2-row-cat-pill[data-cat] { background: var(--surface-2) !important; color: var(--text-2) !important; border-color: var(--line) !important; outline: 1px solid var(--line) !important; outline-offset: -1px !important; }
:root:not([data-calm="off"]) .apv2-row-cat-pill[data-cat="urgente"], :root:not([data-calm="off"]) .apv2-row-cat-pill[data-cat="reclamacao"], :root:not([data-calm="off"]) .apv2-row-cat-pill[data-cat="reclamação"] {
  color: var(--sem-danger-text) !important; border-color: var(--sem-danger-border) !important; }
/* banners (seguranca, somente leitura, ambiente) */
:root:not([data-calm="off"]) .apv2-safety-banner, :root:not([data-calm="off"]) .apv2-banner-warn { background: var(--sem-warning-bg); border-color: var(--sem-warning-border); outline: 1px solid var(--sem-warning-border); outline-offset: -1px; }
:root:not([data-calm="off"]) .apv2-banner-info { background: var(--sem-info-bg); border-color: var(--sem-info-border); outline: 1px solid var(--sem-info-border); outline-offset: -1px; color: var(--sem-info-text); }
:root:not([data-calm="off"]) .apv2-safety-title strong { color: var(--sem-warning-text); } :root:not([data-calm="off"]) .apv2-readonly-hint { background: var(--sem-warning-bg); border-color: var(--sem-warning-border); color: var(--sem-warning-text); }
:root:not([data-calm="off"]) .apv2-assign-btn { border-color: var(--sem-warning-border) !important; color: var(--sem-warning-text) !important; background: var(--sem-warning-bg) !important; }
:root:not([data-calm="off"]) .apv2-amb-banner, :root:not([data-calm="off"]) [class*="apv2-amb"] { background-image: none !important; }
:root:not([data-calm="off"]) .apv2-amb-banner { background: var(--sem-warning-bg) !important; color: var(--text-1) !important; border-bottom-color: var(--sem-warning-border) !important; box-shadow: inset 0 -1px 0 var(--sem-warning-border) !important; }
/* KPIs de notificacao: numero neutro (cor so no ponto do rotulo seria nova marcacao; aqui: neutro) */
:root:not([data-calm="off"]) #apvNotifKpiPending .apv2-notif-kpi-val, :root:not([data-calm="off"]) #apvNotifKpiC2 .apv2-notif-kpi-val, :root:not([data-calm="off"]) #apvNotifKpiSent .apv2-notif-kpi-val { color: var(--text-1); }
:root:not([data-calm="off"]) .apv2-kpi-clickable:hover { border-color: var(--accent-border); box-shadow: none; transform: none; }
:root:not([data-calm="off"]) .apv2-kpi-clickable:focus-visible { border-color: var(--accent); box-shadow: var(--shadow-focus); }
:root:not([data-calm="off"]) .apv2-kpi-clickable:hover .apv2-kpi-arrow { color: var(--accent); }
:root:not([data-calm="off"]) .apv2-month-bonus-fill, :root:not([data-calm="off"]) [class*="bonus-bar"] > div { background: var(--accent) !important; background-image: none !important; }
:root:not([data-calm="off"]) .apv2-month-bonus-val, :root:not([data-calm="off"]) .apv2-ok, :root:not([data-calm="off"]) .apv2-text-emerald { color: var(--text-1); }
:root:not([data-calm="off"]) .apv2-tier-bronze, :root:not([data-calm="off"]) .apv2-tier-prata, :root:not([data-calm="off"]) .apv2-tier-ouro, :root:not([data-calm="off"]) .apv2-tier-diamante { color: var(--text-1); }
:root:not([data-calm="off"]) .apv2-tier-critico { color: var(--sem-danger-text); }
:root:not([data-calm="off"]) .apv2-toast { box-shadow: var(--shadow-lg); } :root:not([data-calm="off"]) .apv2-toast.is-success { border-color: var(--sem-success-border); color: var(--sem-success-text); }
:root:not([data-calm="off"]) .apv2-toast.is-error { border-color: var(--sem-danger-border); color: var(--sem-danger-text); } :root:not([data-calm="off"]) .apv2-toast.is-info { border-color: var(--accent-border); color: var(--accent); }
:root:not([data-calm="off"]) .apv2-modal-overlay, :root:not([data-calm="off"]) .apv2-reversals-overlay { background: var(--scrim); backdrop-filter: none; }
:root:not([data-calm="off"]) .apv2-modal, :root:not([data-calm="off"]) .apv2-reversals-panel { box-shadow: var(--shadow-xl); }
:root:not([data-calm="off"]) .apv2-radio input:checked + .apv2-radio-approve { border-color: var(--sem-success-border); background: var(--sem-success-bg); }
:root:not([data-calm="off"]) .apv2-radio input:checked + .apv2-radio-reject { border-color: var(--sem-danger-border); background: var(--sem-danger-bg); }
:root:not([data-calm="off"]) .apv2-reversals-item { border-left-color: var(--sem-danger-border); } :root:not([data-calm="off"]) .apv2-reversals-item:hover { border-left-color: var(--sem-warning-text); transform: none; }
:root:not([data-calm="off"]) .apv2-reversals-empty { color: var(--text-2); }
:root:not([data-calm="off"]) .apv2-confirm-phrase { background: var(--sem-danger-bg); border-color: var(--sem-danger-border); }
/* barras/trilhos que usavam a trinca vermelho-amarelo-verde (nota 0-10) -> trilho neutro; o valor ja e numerico */
:root:not([data-calm="off"]) #apvDmRating { background: var(--surface-2) !important; background-image: none !important; }
:root:not([data-calm="off"]) #apvDmRatingValue { color: var(--text-1) !important; }
/* notificacoes (tela propria) */
:root:not([data-calm="off"]) [class^="notif-"], :root:not([data-calm="off"]) [class*=" notif-"] { background-image: none; }
:root:not([data-calm="off"]) .notif-sla-pill-breach { background: var(--sem-danger-bg); color: var(--sem-danger-text); border-color: var(--sem-danger-border); }
:root:not([data-calm="off"]) .apv-coaching-action.sinalizou { background: var(--sem-warning-bg); color: var(--sem-warning-text); }
:root:not([data-calm="off"]) .apv-coaching-action.reverteu { background: var(--sem-danger-bg); color: var(--sem-danger-text); }


/* ---------- 14b. APROVACOES: itens que sobraram (abas de origem, selo IA, avatar, banner de evidencia) ---------- */
:root:not([data-calm="off"]) .apv-origin-tab.is-active { background: var(--accent-solid); border-color: var(--accent-solid); color: var(--on-accent); box-shadow: none; }
:root:not([data-calm="off"]) .apv2-row-ai-badge, :root:not([data-calm="off"]) .apv2-ai-badge { background: var(--accent-bg) !important; color: var(--accent) !important; border-color: var(--accent-border) !important; outline: 1px solid var(--accent-border) !important; outline-offset: -1px !important; box-shadow: none !important; }
:root:not([data-calm="off"]) .apv2-client-avatar { background: var(--surface-2) !important; color: var(--text-1) !important; border-color: var(--line); outline: 1px solid var(--line); outline-offset: -1px; }
:root:not([data-calm="off"]) .hrz-eb-item { box-shadow: none !important; transform: none !important; border-color: var(--line); }
:root:not([data-calm="off"]) .hrz-eb-item.is-critical, :root:not([data-calm="off"]) .hrz-eb-item.is-warning, :root:not([data-calm="off"]) .hrz-eb-item.is-info, :root:not([data-calm="off"]) .hrz-eb-item.is-success { background: var(--surface) !important; background-image: none !important; }
:root:not([data-calm="off"]) .hrz-eb-item.is-critical { border-left-color: var(--sem-danger-text); } :root:not([data-calm="off"]) .hrz-eb-item.is-warning { border-left-color: var(--sem-warning-text); }
:root:not([data-calm="off"]) .hrz-eb-item.is-info { border-left-color: var(--accent); } :root:not([data-calm="off"]) .hrz-eb-item.is-success { border-left-color: var(--sem-success-text); }
:root:not([data-calm="off"]) .hrz-eb-icon { background: var(--surface-2) !important; }
:root:not([data-calm="off"]) .hrz-eb-item.is-critical .hrz-eb-icon, :root:not([data-calm="off"]) .hrz-eb-item.is-critical .hrz-eb-cta { color: var(--sem-danger-text) !important; }
:root:not([data-calm="off"]) .hrz-eb-item.is-warning .hrz-eb-icon, :root:not([data-calm="off"]) .hrz-eb-item.is-warning .hrz-eb-cta { color: var(--sem-warning-text) !important; }
:root:not([data-calm="off"]) .hrz-eb-badge { background: var(--surface-2) !important; border-color: var(--line); outline: 1px solid var(--line); outline-offset: -1px; box-shadow: none !important; }
:root:not([data-calm="off"]) .hrz-eb-item:focus-visible { box-shadow: var(--shadow-focus) !important; }

/* ---------- 14c. NOTIFICACOES (tela propria: classes .notif-*, .batch-*, .slide-*) e trilho de pipeline ---------- */
:root:not([data-calm="off"]) .notif-tab.is-active { color: var(--text-1); border-bottom-color: var(--accent); }
:root:not([data-calm="off"]) .notif-tab.is-active .notif-tab-count { background: var(--accent-solid); color: var(--on-accent); }
:root:not([data-calm="off"]) .notif-tab-count-warn { background: var(--sem-warning-bg); color: var(--sem-warning-text); }
:root:not([data-calm="off"]) .notif-tab.is-active .notif-tab-count-warn { background: var(--sem-warning-bg); color: var(--sem-warning-text); border-color: var(--sem-warning-border); outline: 1px solid var(--sem-warning-border); outline-offset: -1px; }
:root:not([data-calm="off"]) .notif-badge { background: var(--surface-2); color: var(--text-2); border-color: var(--line); outline: 1px solid var(--line); outline-offset: -1px; }
:root:not([data-calm="off"]) .notif-sla-pill { background: var(--surface-2); color: var(--text-2); border-color: var(--line); }
:root:not([data-calm="off"]) .notif-sla-pill-fresh { background: var(--surface-2); color: var(--text-2); border-color: var(--line); }
:root:not([data-calm="off"]) .notif-sla-pill-warn { background: var(--sem-warning-bg); color: var(--sem-warning-text); border-color: var(--sem-warning-border); }
:root:not([data-calm="off"]) .notif-sla-pill-crit, :root:not([data-calm="off"]) .notif-sla-pill-breach { background: var(--sem-danger-bg); color: var(--sem-danger-text); border-color: var(--sem-danger-border); }
/* faixa de SLA: emoji vira ponto de estado; numero neutro; estado continua no rotulo + borda esquerda */
:root:not([data-calm="off"]) .notif-sla-item { background: var(--surface); border-color: var(--line); }
:root:not([data-calm="off"]) .notif-sla-item .notif-sla-icon { filter: grayscale(1); }  /* emoji sem cor, mesmo tamanho; estado fica na faixa esquerda + rotulo */
:root:not([data-calm="off"]) .notif-sla-item .notif-sla-num { color: var(--text-1); font-variant-numeric: tabular-nums; }
:root:not([data-calm="off"]) .notif-sla-breach { border-color: var(--sem-danger-border); box-shadow: inset 3px 0 0 var(--sem-danger-text); }
:root:not([data-calm="off"]) .notif-sla-critical { border-color: var(--sem-warning-border); box-shadow: inset 3px 0 0 var(--sem-warning-text); }
:root:not([data-calm="off"]) .notif-sla-camada2 { border-color: var(--line); box-shadow: inset 3px 0 0 var(--accent); }
:root:not([data-calm="off"]) .notif-act-btn.notif-act-approve, :root:not([data-calm="off"]) .batch-btn, :root:not([data-calm="off"]) .slide-btn.primary { background: var(--sem-success-bg); color: var(--sem-success-text); border-color: var(--sem-success-border); outline: 1px solid var(--sem-success-border); outline-offset: -1px; }
:root:not([data-calm="off"]) .notif-act-btn.notif-act-approve:hover { background: var(--sem-success-bg); filter: brightness(1.2); }
:root:not([data-calm="off"]) .notif-act-btn.notif-act-reject, :root:not([data-calm="off"]) .notif-act-btn.notif-act-reject:hover { color: var(--sem-danger-text); border-color: var(--sem-danger-border); }
:root:not([data-calm="off"]) .notif-act-btn.notif-act-reject:hover, :root:not([data-calm="off"]) .slide-btn.danger, :root:not([data-calm="off"]) .batch-reject-btn, :root:not([data-calm="off"]) .notif-act-btn.notif-act-icaro-revert { background: var(--sem-danger-bg) !important; color: var(--sem-danger-text) !important; border-color: var(--sem-danger-border) !important; outline: 1px solid var(--sem-danger-border) !important; outline-offset: -1px !important; }
:root:not([data-calm="off"]) .notif-act-btn.notif-act-icaro-validate, :root:not([data-calm="off"]) .slide-btn.sky { background: var(--accent-solid); color: var(--on-accent); border-color: var(--accent-solid); }
:root:not([data-calm="off"]) .notif-act-btn.notif-act-icaro-flag, :root:not([data-calm="off"]) .slide-btn.warn { background: var(--sem-warning-bg); color: var(--sem-warning-text); border-color: var(--sem-warning-border); outline: 1px solid var(--sem-warning-border); outline-offset: -1px; }
:root:not([data-calm="off"]) .pp-compact-stage[data-state="active"] { background: var(--accent-bg); color: var(--accent); }
:root:not([data-calm="off"]) .pp-compact-stage[data-state="done"], :root:not([data-calm="off"]) .pp-compact-arrow[data-state="done"] { color: var(--text-2); }
:root:not([data-calm="off"]) .pp-compact-stage[data-state="rejected"], :root:not([data-calm="off"]) .pp-compact-arrow[data-state="rejected"] { color: var(--sem-danger-text); }
:root:not([data-calm="off"]) .pp-compact-stage[data-state="skipped"], :root:not([data-calm="off"]) .pp-compact-arrow[data-state="skipped"] { color: var(--sem-warning-text); }
:root:not([data-calm="off"]) .pp-compact-arrow[data-state="active"] { color: var(--accent); }

/* ---------- 15. DASHBOARD PRINCIPAL (so CSS: o HTML/JS da tela ficam intactos) ---------- */
:root:not([data-calm="off"]) #kpi-clientes, :root:not([data-calm="off"]) #kpi-invest, :root:not([data-calm="off"]) #kpi-camps, :root:not([data-calm="off"]) #kpi-results { color: var(--text-1) !important; font-variant-numeric: tabular-nums; }
:root:not([data-calm="off"]) [style*="width:28px;height:28px;border-radius:7px"] { background: var(--surface-2) !important; }
:root:not([data-calm="off"]) [style*="width:28px;height:28px;border-radius:7px"] svg, :root:not([data-calm="off"]) #dash-urgente ~ * svg[stroke^="var(--"] { stroke: var(--text-2) !important; }
:root:not([data-calm="off"]) #dash-gestores > div { background: var(--surface-2) !important; border-color: var(--line) !important; }
:root:not([data-calm="off"]) #dash-gestores span[style*="border-radius:50%"] { background: var(--text-3) !important; }
:root:not([data-calm="off"]) #dash-gestores span[style*="border-radius:4px"] { background: var(--surface) !important; border-color: var(--line); outline: 1px solid var(--line); outline-offset: -1px; color: var(--text-2) !important; }
:root:not([data-calm="off"]) #dash-urgente > div[style*="rgba(251,191,36"] { background: var(--sem-warning-bg) !important; border-color: var(--sem-warning-border) !important; }
:root:not([data-calm="off"]) #dash-urgente > div[style*="rgba(251,113,133"] { background: var(--sem-danger-bg) !important; border-color: var(--sem-danger-border) !important; }
:root:not([data-calm="off"]) #dash-urgente span[style*="rgba(251,191,36,0.15)"] { background: var(--sem-warning-bg) !important; border-color: var(--sem-warning-border); outline: 1px solid var(--sem-warning-border); outline-offset: -1px; }
:root:not([data-calm="off"]) #dash-urgente span[style*="rgba(251,113,133,0.15)"] { background: var(--sem-danger-bg) !important; border-color: var(--sem-danger-border); outline: 1px solid var(--sem-danger-border); outline-offset: -1px; }
:root:not([data-calm="off"]) #dash-whatsapp div[style*="rgba("] { background: var(--surface-2) !important; }
:root:not([data-calm="off"]) #dash-whatsapp div[style*="font-size:18px"] { color: var(--text-1) !important; font-variant-numeric: tabular-nums; }
:root:not([data-calm="off"]) [style*="rgba(52, 211, 153, 0.08)"][style*="border-left: 3px solid var(--emerald)"] { background: var(--surface-2) !important; border-left-color: var(--line-strong) !important; }
:root:not([data-calm="off"]) [style*="rgba(52, 211, 153, 0.08)"] [style*="color: var(--emerald)"] { color: var(--text-1) !important; }
:root:not([data-calm="off"]) .status-dot.status-online { background: var(--sem-success-text) !important; box-shadow: none !important; }

/* ---------- 16. GARANTIAS DE OPERABILIDADE (auditoria 30/10) ---------- */
/* preenchimento legado (var --accent-primary/--sky/--violet/--emerald) + texto fixo #fff/#000: no escuro o acento e claro
   (texto branco some, 2,3:1) e no claro e escuro (texto preto some, 3,7:1). Controles medidos na auditoria: */
:root:not([data-calm="off"]) :is(.cl-status-btn.active, .p-btn.active, .digest-date-btn.active, .beta-btn-primary, .beta-btn-primary:hover, .ss-tab.active, .tldv-tab.active, .ch-tab.active, .hrz-empty-btn-primary, .hrz-empty-btn-primary:hover, .btn-save, .chat-send) {
  background: var(--accent-solid) !important; border-color: var(--accent-solid) !important; color: var(--on-accent) !important; }
:root:not([data-calm="off"]) :is(.digest-filter-btn.active) {
  background: var(--sem-success-bg) !important; border-color: var(--sem-success-border) !important; color: var(--sem-success-text) !important; outline: 1px solid var(--sem-success-border); outline-offset: -1px; }
:root:not([data-calm="off"]) .freshness__refresh { color: var(--text-2); }
:root:not([data-calm="off"]) .ch-tab:not(.active) { color: var(--accent) !important; }
:root:not([data-calm="off"]) .cmrc-stale-jump { background: var(--sem-warning-bg) !important; color: var(--sem-warning-text) !important; border-color: var(--sem-warning-border) !important; outline: 1px solid var(--sem-warning-border); outline-offset: -1px; }
:root:not([data-calm="off"]) button[style*="color:#ef4444"], :root:not([data-calm="off"]) button[style*="color: #ef4444"] { color: var(--sem-danger-text) !important; }

/* bordas da camada sao desenhadas com outline (nao somam tamanho); o foco de teclado precisa vencer esse outline */
:root:not([data-calm="off"]) :is(a, button, summary, [role="button"], [role="tab"], [tabindex]:not(input):not(select):not(textarea)):focus-visible { outline: 2px solid var(--accent) !important; outline-offset: 2px !important; }
@media (prefers-reduced-motion: reduce) {
  :root:not([data-calm="off"]) *, :root:not([data-calm="off"]) *::before, :root:not([data-calm="off"]) *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

/* ==========================================================================
   COMPONENTES .cm-* — usados pelos JS reescritos de Alertas, SLA e Dashboard.
   SEM gate de proposito: com data-calm="off" a tela continua com layout correto
   (so usam variaveis legadas, que o calm remapeia e o modo "off" devolve ao original).
   Estado = ponto/icone + palavra; numero zero = neutro.
   ========================================================================== */
.cm-kpis { display: flex; gap: 12px; margin-bottom: 24px; flex-wrap: wrap; }
.cm-kpi { padding: 14px 18px; background: var(--bg-secondary); border: 1px solid var(--border-default); border-radius: 12px; min-width: 140px; text-align: left; }
.cm-kpi-n { font-size: 26px; font-weight: 700; color: var(--text-primary); line-height: 1.15; font-variant-numeric: tabular-nums; }
.cm-kpi-l { display: inline-flex; align-items: center; gap: 6px; margin-top: 4px; font-size: 12px; color: var(--text-secondary); }
.cm-kpi.is-zero .cm-kpi-n { color: var(--text-tertiary); }
.cm-dot { width: 8px; height: 8px; border-radius: 50%; flex: none; background: var(--text-tertiary); display: inline-block; }
.cm-dot.risk { background: var(--error); } .cm-dot.warn { background: var(--warning); }
.cm-dot.ok { background: var(--success); } .cm-dot.info { background: var(--sky); }
.cm-dot.mute { background: transparent; border: 1.5px solid var(--text-tertiary); }
.cm-sev { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: var(--text-secondary); white-space: nowrap; }
.cm-sev svg { width: 14px; height: 14px; flex: none; }
.cm-sev.risk { color: var(--error); } .cm-sev.warn { color: var(--warning); } .cm-sev.ok { color: var(--success); } .cm-sev.info { color: var(--sky); }
.cm-group { margin-bottom: 24px; }
.cm-group-h { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.cm-group-h h3 { margin: 0; font-size: 15px; font-weight: 600; color: var(--text-primary); }
.cm-count { padding: 1px 8px; border-radius: 10px; font-size: 11px; font-weight: 600; background: var(--bg-tertiary); color: var(--text-secondary); border: 1px solid var(--border-default); }
.cm-row { background: var(--bg-secondary); border: 1px solid var(--border-default); border-left: 3px solid var(--border-strong); padding: 11px 16px; border-radius: 8px; margin-bottom: 6px;
  display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.cm-row.risk { border-left-color: var(--error); } .cm-row.warn { border-left-color: var(--warning); }
.cm-row-main { min-width: 0; } .cm-row-t { font-weight: 600; font-size: 13px; color: var(--text-primary); }
.cm-row-d { color: var(--text-secondary); font-size: 12px; margin-left: 8px; }
.cm-row-m { display: flex; align-items: center; gap: 10px; flex-shrink: 0; font-size: 12px; color: var(--text-tertiary); }
.cm-empty { text-align: center; padding: 60px; color: var(--text-secondary); }
.cm-empty svg { width: 36px; height: 36px; color: var(--success); margin-bottom: 8px; }
.cm-err { padding: 40px; text-align: center; color: var(--error); }

.cm-sla-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 12px; margin-bottom: 28px; }
.cm-sla-card { padding: 14px 16px; background: var(--bg-secondary); border: 1px solid var(--border-default); border-radius: 12px; }
.cm-sla-card .n { font-size: 26px; font-weight: 700; color: var(--text-primary); line-height: 1.15; font-variant-numeric: tabular-nums; }
.cm-sla-card.is-zero .n { color: var(--text-tertiary); }
.cm-sla-card .l { margin-top: 4px; display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--text-secondary); }
.cm-gestor { background: var(--bg-secondary); border: 1px solid var(--border-default); border-radius: 12px; padding: 20px; }
.cm-bar { display: flex; gap: 2px; margin-bottom: 12px; height: 8px; border-radius: 4px; overflow: hidden; background: var(--bg-tertiary); }
.cm-bar i { display: block; height: 100%; }
.cm-bar .ok { background: var(--success); } .cm-bar .warn { background: var(--warning); } .cm-bar .risk { background: var(--error); }
.cm-pill { padding: 2px 10px; border-radius: 8px; font-size: 11px; font-weight: 600; background: var(--bg-tertiary); color: var(--text-secondary); border: 1px solid var(--border-default); }
.cm-pill.risk { background: var(--error-bg); color: var(--error); border-color: var(--error-border); }
.cm-pill.warn { background: var(--warning-bg); color: var(--warning); border-color: var(--warning-border); }
.cm-pill.ok { background: var(--success-bg); color: var(--success); border-color: var(--success-border); }
.cm-num-risk { color: var(--error); font-weight: 600; } .cm-num-warn { color: var(--warning); font-weight: 600; }
.cm-num-ok { color: var(--success); font-weight: 600; } .cm-num-zero { color: var(--text-tertiary); font-weight: 600; }
.cm-link { color: var(--sky); }

.cm-dash-tile { padding: 10px; border-radius: 6px; background: var(--bg-tertiary); text-align: center; }
.cm-dash-tile .n { font-size: 18px; font-weight: 700; color: var(--text-primary); font-variant-numeric: tabular-nums; }
.cm-dash-tile .l { font-size: 11px; color: var(--text-tertiary); margin-top: 2px; }
.cm-dash-row { display: flex; align-items: center; justify-content: space-between; padding: 7px 10px; border-radius: 6px; background: var(--bg-tertiary); border: 1px solid var(--border-default); }
.cm-dash-row.risk { border-left: 3px solid var(--error); } .cm-dash-row.warn { border-left: 3px solid var(--warning); }
.cm-dash-h { font-size: 11px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--text-secondary); margin: 8px 0 4px; display: flex; align-items: center; gap: 6px; }
.cm-chip { font-size: 10px; padding: 2px 8px; border-radius: 4px; background: var(--bg-tertiary); color: var(--text-secondary); border: 1px solid var(--border-default); font-weight: 600; }
.cm-chip.risk { background: var(--error-bg); color: var(--error); border-color: var(--error-border); }
.cm-chip.warn { background: var(--warning-bg); color: var(--warning); border-color: var(--warning-border); }
.cm-ok-note { padding: 16px; color: var(--text-secondary); font-size: 12px; display: flex; align-items: center; justify-content: center; gap: 6px; }
.cm-ok-note svg { width: 14px; height: 14px; color: var(--success); }