/* ==========================================================================
   THEME GLOBAL TOKENS — Dark UI (CINZA PURO / GRAYSCALE)
   Regras:
   1) NÃO renomeia, NÃO remove e NÃO cria tokens novos obrigatórios.
   2) Ajusta SOMENTE a paleta neutra/UI para CINZA PURO (R=G=B).
   3) Mantém cores coloridas de alertas e gráficos (ok/warn/critical + series/cats).
   ========================================================================== */

:root {
  /* ------------------------------------------------------------------------
     1) ANCHORS (cores base) — AGORA CINZA PURO
     Observação: aqui a “marca” da UI (accent) vira cinza também.
     ------------------------------------------------------------------------ */
  --c-nav: #1F1F1F;     /* antes: #1D1F1F (tinha viés) */
  --c-bg:  #161616;     /* antes: #161717 */
  --c-accent: #B3B3B3;  /* antes: #21C063 (verde). Agora UI em cinza */
  --c-form: #262626;    /* antes: #242626 */

  /* ------------------------------------------------------------------------
     2) SURFACES (superfícies / camadas) — CINZA PURO + CONTRASTE
     ------------------------------------------------------------------------ */
  --surface-0: var(--c-bg);      /* fundo do app */
  --surface-1: var(--c-form);    /* cards / blocos principais */
  --surface-2: #2E2E2E;          /* dropdowns / modais / elevação */
  --surface-3: #333333;          /* headers internos / toolbars / table head */
  --surface-4: #3A3A3A;          /* hover forte / destaque em seções */

  /* Aliases legados para garantir compatibilidade — MANTIDOS */
  --app-bg: var(--surface-0);
  --header-bg: var(--surface-3);
  --color-primary: var(--tokens-color-primary);
  --color-secondary: var(--tokens-color-secondary);
  --color-background: var(--tokens-color-background);
  --color-surface: var(--tokens-color-surface);
  --color-surface-2: var(--tokens-color-surface-2);
  --color-error: var(--tokens-color-error);
  --color-text-primary: var(--tokens-color-text-primary);
  --color-text-secondary: var(--tokens-color-text-secondary);
  --color-text-tertiary: var(--tokens-color-text-tertiary);
  --color-accent: var(--tokens-color-accent);
  --border-color: var(--tokens-border-color);
  --bg-loader-overlay: var(--tokens-color-background);

  /* ------------------------------------------------------------------------
     LEGACY PALETTES (cores originais centralizadas)
     Ajuste: somente neutros para cinza puro.
     ------------------------------------------------------------------------ */

  /* Tokens base (tokens.css original) — neutros em cinza puro */
  --tokens-color-primary: #B3B3B3;
  --tokens-color-secondary: #1F1F1F;
  --tokens-color-background: #161616;
  --tokens-color-surface: #262626;
  --tokens-color-surface-2: #2E2E2E;
  --tokens-color-error: #DC2725; /* MANTIDO */
  --tokens-color-text-primary: #F2F2F2;
  --tokens-color-text-secondary: #D0D0D0;
  --tokens-color-text-tertiary: #A8A8A8;
  --tokens-color-accent: #B3B3B3; /* UI em cinza */
  --tokens-aurora-1: #B3B3B3;
  --tokens-aurora-2: #C6C6C6;
  --tokens-aurora-3: #DADADA;
  --tokens-border-color: rgba(255,255,255,0.10);

  /* style.css (layout principal) — neutros em cinza puro */
  --style-color-primary: #B3B3B3;
  --style-color-secondary: #999999;
  --style-color-background: #161616;
  --style-color-surface: #262626;
  --style-color-surface-elevated: #2E2E2E;
  --style-color-surface-strong: #333333;
  --style-header-bg: #1F1F1F;
  --style-navbar-bg: #1F1F1F;
  --style-border-color: rgba(255,255,255,0.10);
  --style-color-error: #ff2828; /* MANTIDO */
  --style-color-text-primary: #F2F2F2;
  --style-color-text-secondary: #D0D0D0;
  --style-color-text-tertiary: #A8A8A8;
  --style-bg-loader-overlay: #161616;
  --style-avatar-bg: #B3B3B3;

  --style-menu-bg: rgba(17, 17, 17, 0.92);
  --style-menu-hover-bg: #2E2E2E;
  --style-menu-text: #D0D0D0;
  --style-menu-heading-color: #A8A8A8;
  --style-menu-active-border: #B3B3B3; /* antes: verde */

  /* Status (cores) — MANTIDOS */
  --style-status-up-accent: #22c55e;
  --style-status-up-border: rgba(34, 197, 94, 0.6);
  --style-status-up-chip-bg: rgba(34, 197, 94, 0.45);
  --style-status-up-chip-text: #f0fdf4;
  --style-status-up-metric-bg: rgba(34, 197, 94, 0.35);
  --style-status-up-metric-text: #ecfdf5;

  --style-status-down-accent: #ff1f1f;
  --style-status-down-border: rgba(255, 33, 33, 0.62);
  --style-status-down-chip-bg: rgba(239, 68, 68, 0.46);
  --style-status-down-chip-text: #fee2e2;
  --style-status-down-metric-bg: rgba(239, 68, 68, 0.34);
  --style-status-down-metric-text: #fee2e2;

  --style-status-unknown-accent: #6b7280;
  --style-status-unknown-border: rgba(107, 114, 128, 0.52);
  --style-status-unknown-chip-bg: rgba(107, 114, 128, 0.38);
  --style-status-unknown-chip-text: #e5e7eb;
  --style-status-unknown-metric-bg: rgba(107, 114, 128, 0.28);
  --style-status-unknown-metric-text: #f4f4f5;

  --style-status-unstable-accent: #facc15;
  --style-status-unstable-border: rgba(250, 204, 21, 0.58);
  --style-status-unstable-chip-bg: rgba(250, 204, 21, 0.4);
  --style-status-unstable-chip-text: #fee2e2;
  --style-status-unstable-metric-bg: rgba(250, 204, 21, 0.32);
  --style-status-unstable-metric-text: #fee2e2;

  /* Neutros (bordas/chips/grades) — cinza puro */
  --style-olt-card-shadow: 0 26px 48px -28px rgba(0, 0, 0, 0.80);
  --style-olt-card-shadow-hover: 0 32px 64px -32px rgba(0, 0, 0, 0.88);

  --style-olt-card-border: rgba(255,255,255,0.10);
  --style-olt-card-border-strong: rgba(255,255,255,0.18);

  --style-olt-card-meta-bg: rgba(255,255,255,0.06);
  --style-olt-card-meta-border: rgba(255,255,255,0.12);
  --style-olt-card-meta-highlight-bg: rgba(255,255,255,0.10);

  --style-olt-card-outline-color: rgba(179,179,179,0.55); /* antes: verde */
  --style-olt-card-status-chip-bg: rgba(255,255,255,0.08);
  --style-olt-metric-chip-bg: rgba(255,255,255,0.06);

  --style-status-critical-chip-bg: rgba(251, 146, 60, 0.35); /* MANTIDO */
  --style-status-critical-status-bg: rgba(251, 146, 60, 0.24); /* MANTIDO */

  --style-olt-card-title-shadow: rgba(0, 0, 0, 0.40);

  --style-olt-card-status-ring: rgba(255,255,255,0.14);
  --style-olt-card-status-ring-strong: rgba(255,255,255,0.22);

  --style-olt-card-status-shadow: rgba(0, 0, 0, 0.32);
  --style-olt-card-status-shadow-strong: rgba(0, 0, 0, 0.42);

  --style-metric-chip-gloss: rgba(255, 255, 255, 0.08);
  --style-metric-chip-gloss-strong: rgba(255, 255, 255, 0.16);
  --style-metric-chip-lift-shadow: rgba(0, 0, 0, 0.28);

  --style-page-gridline-color: rgba(255,255,255,0.04);
  --style-page-gradient-start: rgba(255,255,255,0.06);
  --style-page-gradient-end: rgba(255,255,255,0.03);

  --style-text-strong: #FFFFFF;
  --style-text-muted: rgba(255, 255, 255, 0.60);
  --style-text-invert: #FFFFFF;

  --style-divider-default: rgba(255, 255, 255, 0.10);
  --style-divider-weak: rgba(255, 255, 255, 0.05);

  --style-border-default: rgba(255, 255, 255, 0.10);
  --style-border-weak: rgba(255, 255, 255, 0.05);
  --style-border-strong: rgba(255, 255, 255, 0.18);

  --style-hover: rgba(255, 255, 255, 0.04);
  --style-active: rgba(255, 255, 255, 0.10);
  --style-overlay: rgba(0, 0, 0, 0.60);

  --style-shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.30);
  --style-shadow-md: -2px 0 6px rgba(0, 0, 0, 0.40);
  --style-shadow-lg: 0 2px 8px rgba(0, 0, 0, 0.50);

  --style-scroll-thumb: rgba(255, 255, 255, 0.14);
  --style-accent-hover: #C6C6C6; /* antes: verde/azul */
  --style-warning: var(--warning);

  /* style_refactored.css — neutros em cinza puro */
  --ref-bg-color: #161616;
  --ref-text-color: #FFFFFF;
  --ref-header-bg: #1F1F1F;
  --ref-border-color: #333333;
  --ref-accent-color: #666666;
  --ref-link-color: #FFFFFF;
  --ref-link-hover-color: #D0D0D0;
  --ref-focus-outline-color: #FFFFFF;

  --ref-color-primary: #2e7d32;     /* MANTIDO */
  --ref-color-secondary: #3e88f7;   /* MANTIDO */
  --ref-color-error: #DC2725;       /* MANTIDO */

  --ref-color-text-primary: #FFFFFF;
  --ref-color-text-secondary: #D0D0D0;

  --ref-surface-light: #FFFFFF;
  --ref-text-dark: #222222;

  --ref-bg-loader-overlay: #161616;

  --ref-up-bg: #2C8C1D;             /* MANTIDO */
  --ref-unknown-bg: #7f8c8d;        /* MANTIDO */
  --ref-down-bg-start: #fd2424;     /* MANTIDO */
  --ref-down-bg-mid: #7a0101;       /* MANTIDO */
  --ref-unstable-bg: #eca809;       /* MANTIDO */
  --ref-unstable-bg-mid: #1E1E1E;   /* cinza puro */

  --ref-danger-bg-start: rgb(255, 56, 56); /* MANTIDO */
  --ref-danger-bg-mid: #7a0101;            /* MANTIDO */
  --ref-warning-bg: rgb(248, 129, 24);     /* MANTIDO */
  --ref-success-bg: #f5a700;               /* MANTIDO */
  --ref-info-bg: #0074D9;                  /* MANTIDO */

  --ref-card-total: #333333;
  --ref-card-online: #2e7d32;   /* MANTIDO */
  --ref-card-offline: #8F292A;  /* MANTIDO */
  --ref-card-old: #455a64;      /* MANTIDO */

  --ref-dropdown-bg: #2E2E2E;
  --ref-dropdown-bg-hover: #333333;
  --ref-dropdown-border-hover: #3A3A3A;
  --ref-dropdown-shadow: 0 4px 8px rgba(0, 0, 0, 0.40);

  --ref-search-bg: #262626;
  --ref-placeholder: #A8A8A8;

  --ref-table-zebra: #1F1F1F;

  --ref-link-chip-bg: rgba(255, 255, 255, 0.05);
  --ref-link-chip-bg-hover: rgba(255, 255, 255, 0.10);

  --ref-button-border: rgba(255,255,255,0.16);
  --ref-button-hover-bg: #2E2E2E;
  --ref-button-shadow: 0 2px 4px rgba(0, 0, 0, 0.30);

  --ref-scroll-thumb: rgba(255,255,255,0.14);
  --ref-scroll-thumb-hover: rgba(255,255,255,0.22);
  --ref-scrollbar-track: rgba(255,255,255,0.04);

  /* dashboard_onu_custom.css — neutros em cinza puro */
  --dashboard-color-primary: #2e7d32;       /* MANTIDO */
  --dashboard-color-secondary: #3e88f7;     /* MANTIDO */
  --dashboard-color-background: #161616;
  --dashboard-color-surface: #262626;
  --dashboard-header-bg: #1F1F1F;
  --dashboard-border-color: rgba(255,255,255,0.12);
  --dashboard-color-text-primary: #F2F2F2;
  --dashboard-color-text-secondary: #D0D0D0;
  --dashboard-bg-loader-overlay: #161616;

  --dashboard-light-color-background: #fafafa;
  --dashboard-light-color-surface: #ffffff;
  --dashboard-light-header-bg: #f0f0f0;
  --dashboard-light-border-color: #ddd;
  --dashboard-light-color-text-primary: #000;
  --dashboard-light-color-text-secondary: #555;

  --dashboard-shadow-sm: 0 2px 6px rgba(0,0,0,0.20);
  --dashboard-shadow-md: 0 2px 8px rgba(0,0,0,0.50);
  --dashboard-overlay: rgba(0,0,0,0.30);

  /* monitoring.css — neutros em cinza puro */
  --monitoring-btn-bg-h: #333333;
  --monitoring-success: #16A34A; /* MANTIDO */
  --monitoring-error: #DC2626;   /* MANTIDO */

  /* login.css */
  --login-btn-bg: #2563EB;
  --login-btn-text: #ffffff;
  --login-spinner-border: rgba(255,255,255,.30);
  --login-hint: #AEB2B7;

  /* onu_report.css */
  --report-card-bg-color: #262626;
  --report-shadow-sm: 0 2px 6px rgba(0,0,0,0.50);
  --report-overlay: rgba(0,0,0,0.60);

  /* mapa_optico.css — NÃO alterar highlights (mantidos) */
  --optical-kpi-highlight-1: #38bdf8;
  --optical-kpi-highlight-2: #60a5fa;
  --optical-inner-shadow: rgba(255, 255, 255, 0.06);
  --optical-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.18);
  --optical-shadow-md: 0 8px 24px rgba(0, 0, 0, 0.28);
  --optical-shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.45);
  --optical-overlay: color-mix(in srgb, var(--color-background, #000) 30%, rgba(0, 0, 0, 0.75));

  /* theme-dark.css — neutros em cinza puro (mesmos nomes) */
  --theme-surface-1: #262626;
  --theme-surface-2: #2E2E2E;
  --theme-line-1: #333333;
  --theme-line-2: #3A3A3A;

  --theme-text-1: #F2F2F2;
  --theme-text-2: #D0D0D0;
  --theme-text-3: #A8A8A8;

  --theme-primary: #dd0c0c;
  --theme-success: #BDBDBD; /* neutro */
  --theme-warning: #AFAFAF; /* neutro */
  --theme-danger:  #9F9F9F; /* neutro */
  --theme-info:    #B3B3B3;

  --theme-ctl-bg: #1F1F1F;
  --theme-ctl-bg-hover: #262626;
  --theme-ctl-border: #333333;
  --theme-ctl-border-hover: #3A3A3A;

  --theme-menu-bg: #1F1F1F;
  --theme-menu-border: #2E2E2E;
  --theme-menu-item-hover: #2D2D2D;
  --theme-menu-shadow: 0 10px 26px rgba(0,0,0,.45);

  --theme-table-bg: #262626;
  --theme-table-row-odd: rgba(255,255,255,0.02);
  --theme-table-row-even: #262626;
  --theme-table-border: #333333;
  --theme-table-hover: #2E2E2E;

  --theme-tbl-head-bg: #333333;
  --theme-tbl-head-text: #F2F2F2;
  --theme-tbl-head-sep: #3A3A3A;
  --theme-tbl-head-hover: #3A3A3A;
  --theme-tbl-head-active: #3A3A3A;

  --theme-chart-bg: #262626;
  --theme-chart-gridline: #333333;
  --theme-chart-axis: #BDBDBD;
  --theme-chart-label: #D9D9D9;
  --theme-chart-toolbar-bg: #2E2E2E;
  --theme-chart-toolbar-bdr: #333333;

  /* séries e categorias — MANTIDAS */
  --theme-series-1: #EDEDED;
  --theme-series-2: #DADADA;
  --theme-series-3: #C6C6C6;
  --theme-series-4: #B3B3B3;
  --theme-series-5: #9F9F9F;
  --theme-series-6: #8C8C8C;
  --theme-series-7: #787878;
  --theme-series-8: #656565;
  --theme-series-9: #525252;
  --theme-series-10: #414141;

  --theme-cat-1: #4F46E5;
  --theme-cat-2: #0EA5E9;
  --theme-cat-3: #8B5CF6;
  --theme-cat-4: #14B8A6;
  --theme-cat-5: #EC4899;
  --theme-cat-6: #2563EB;
  --theme-cat-7: #A855F7;
  --theme-cat-8: #22D3EE;
  --theme-cat-9: #F97316;
  --theme-cat-10: #10B981;

  /* KPIs — MANTIDOS */
  --theme-kpi-total: #5A5A5F;
  --theme-kpi-online: #16A34A;
  --theme-kpi-offline: #D32F2F;
  --theme-kpi-offline30: #6F7278;
  --theme-kpi-total-text: #ECECF1;
  --theme-kpi-online-text: #ECECF1;
  --theme-kpi-offline-text: #ECECF1;
  --theme-kpi-offline30-text: #ECECF1;
  --theme-kpi-total-rgb: 90,90,95;
  --theme-kpi-online-rgb: 22,163,74;
  --theme-kpi-offline-rgb: 211,47,47;
  --theme-kpi-offline30-rgb: 111,114,120;

  --theme-shadow-1: 0 2px 8px rgba(0,0,0,.22);
  --theme-shadow-2: 0 10px 26px rgba(0,0,0,.35);
  --theme-inner-1: inset 0 1px 0 rgba(255,255,255,.03);
  --theme-focus: #BDBDBD;

  --theme-skel-1: rgba(255,255,255,0.06);
  --theme-skel-2: rgba(255,255,255,0.10);

  --theme-scroll-thumb: rgba(255,255,255,0.14);
  --theme-error-text: #FFC5C5;
  --theme-modal-overlay: rgba(0,0,0,.5);
  --theme-toast-bg: #1b1b1b;
  --theme-gradient-edge: rgba(0,0,0,.22);
  --theme-focus-shadow: 0 2px 12px rgba(0,0,0,.15);

  /* Superfície “input” — cinza puro (um nível abaixo do card) */
  --field-bg: #1F1F1F;

  /* ------------------------------------------------------------------------
     3) BORDERS / DIVIDERS
     ------------------------------------------------------------------------ */
  --border-weak: rgba(255,255,255,0.06);
  --border-default: rgba(255,255,255,0.10);
  --border-strong: rgba(255,255,255,0.16);

  --divider-weak: rgba(255,255,255,0.06);
  --divider-default: rgba(255,255,255,0.10);

  /* ------------------------------------------------------------------------
     4) TYPOGRAPHY (texto) — hierarquia e contraste
     ------------------------------------------------------------------------ */
  --text-1: rgba(255,255,255,0.92);
  --text-2: rgba(255,255,255,0.72);
  --text-3: rgba(255,255,255,0.52);
  --text-4: rgba(255,255,255,0.35);
  --text-invert: #0B0B0B;

  /* Links — agora CINZA PURO (sem verde) */
  --link: #D0D0D0;
  --link-hover: #E6E6E6;

  /* ------------------------------------------------------------------------
     5) SHADOWS / OVERLAYS
     ------------------------------------------------------------------------ */
  --shadow-sm: 0 6px 18px rgba(0,0,0,0.28);
  --shadow-md: 0 10px 30px rgba(0,0,0,0.35);
  --shadow-lg: 0 18px 50px rgba(0,0,0,0.45);

  --overlay: rgba(0,0,0,0.55);
  --backdrop-blur: 0px;

  /* ------------------------------------------------------------------------
     6) FOCUS RING (cinza puro)
     ------------------------------------------------------------------------ */
  --focus-ring: rgba(179,179,179,0.35);
  --focus-border: rgba(179,179,179,0.65);

  /* ------------------------------------------------------------------------
     7) STATES (neutros)
     ------------------------------------------------------------------------ */
  --hover: rgba(255,255,255,0.05);
  --active: rgba(255,255,255,0.09);
  --selected: rgba(179,179,179,0.12);

  /* ------------------------------------------------------------------------
     8) BRAND / ACCENT (AGORA CINZA PURO)
     ------------------------------------------------------------------------ */
  --accent: var(--c-accent);
  --accent-hover: #C6C6C6;
  --accent-active: #999999;
  --accent-soft: rgba(179,179,179,0.16);
  --accent-border: rgba(179,179,179,0.35);
  --logo-accent: #F08A3C; /* Logo NIMS: letra "I" laranja */

  /* ------------------------------------------------------------------------
     9) STATUS / SEVERITIES (ALERTAS)
     - TEMP ALTA: LARANJA
     - TEMP CRÍTICA: VERMELHO
     ------------------------------------------------------------------------ */
  --ok: #21C063;
  --ok-soft: rgba(33,192,99,0.16);
  --ok-border: rgba(33,192,99,0.35);

  --info: #4FA3FF;
  --info-soft: rgba(79,163,255,0.16);
  --info-border: rgba(79,163,255,0.35);

  --warning: #F08A3C;
  --warning-soft: rgba(240,138,60,0.16);
  --warning-border: rgba(240,138,60,0.35);

  --major: #F08A3C;
  --major-soft: rgba(240,138,60,0.16);
  --major-border: rgba(240,138,60,0.35);

  --critical: #E34B4B;
  --critical-soft: rgba(227,75,75,0.16);
  --critical-border: rgba(227,75,75,0.35);

  --unknown: rgba(255,255,255,0.45);
  --unknown-soft: rgba(255,255,255,0.10);
  --unknown-border: rgba(255,255,255,0.18);

  --state-active: var(--ok);
  --state-inactive: rgba(255,255,255,0.38);
  --state-paused: var(--info);
  --state-degraded: var(--warning);
  --state-offline: var(--critical);

  /* ------------------------------------------------------------------------
     10) NAVBAR
     ------------------------------------------------------------------------ */
  --navbar-bg: var(--c-nav);
  --navbar-border: rgba(255,255,255,0.08);
  --navbar-text: rgba(255,255,255,0.88);
  --navbar-text-muted: rgba(255,255,255,0.62);
  --navbar-item-hover: rgba(255,255,255,0.06);
  --navbar-item-active: rgba(179,179,179,0.14); /* cinza */
  --navbar-icon: rgba(255,255,255,0.74);

  /* ------------------------------------------------------------------------
     11) SIDEBAR / MENUS
     ------------------------------------------------------------------------ */
  --menu-bg: var(--surface-2);
  --menu-border: var(--border-default);
  --menu-item-hover: rgba(255,255,255,0.06);
  --menu-item-active: rgba(179,179,179,0.16);
  --menu-shadow: var(--shadow-md);

  /* ------------------------------------------------------------------------
     12) CARDS / PANELS
     ------------------------------------------------------------------------ */
  --card-bg: var(--surface-1);
  --card-border: var(--border-default);
  --card-title: var(--text-1);
  --card-subtitle: var(--text-2);
  --card-muted: var(--text-3);
  --card-hover-bg: rgba(255,255,255,0.03);
  --card-hover-border: var(--border-strong);

  --card-accentbar-width: 4px;
  --card-accentbar-ok: var(--ok);
  --card-accentbar-info: var(--info);
  --card-accentbar-warning: var(--warning);
  --card-accentbar-major: var(--major);
  --card-accentbar-critical: var(--critical);

  /* ------------------------------------------------------------------------
     13) KPI / STATS CARDS
     ------------------------------------------------------------------------ */
  --kpi-bg: var(--surface-1);
  --kpi-border: var(--border-default);
  --kpi-label: var(--text-2);
  --kpi-value: var(--text-1);
  --kpi-delta-positive: var(--ok);
  --kpi-delta-negative: var(--critical);
  --kpi-delta-neutral: var(--text-3);

  --kpi-highlight-bg: rgba(179,179,179,0.10);
  --kpi-highlight-border: rgba(179,179,179,0.28);
  --kpi-highlight-glow: rgba(179,179,179,0.10);

  /* ------------------------------------------------------------------------
     14) BUTTONS (cinza puro)
     ------------------------------------------------------------------------ */
  --btn-primary-bg: var(--accent);
  --btn-primary-bg-hover: var(--accent-hover);
  --btn-primary-bg-active: var(--accent-active);
  --btn-primary-text: #0B0B0B;
  --btn-primary-border: rgba(0,0,0,0.18);

  --btn-secondary-bg: var(--surface-2);
  --btn-secondary-bg-hover: var(--surface-3);
  --btn-secondary-bg-active: var(--surface-4);
  --btn-secondary-text: rgba(255,255,255,0.88);
  --btn-secondary-border: rgba(255,255,255,0.12);

  --btn-ghost-bg: transparent;
  --btn-ghost-bg-hover: rgba(255,255,255,0.06);
  --btn-ghost-bg-active: rgba(255,255,255,0.10);
  --btn-ghost-text: rgba(255,255,255,0.86);
  --btn-ghost-border: transparent;

  --btn-outline-bg: transparent;
  --btn-outline-bg-hover: rgba(255,255,255,0.04);
  --btn-outline-text: rgba(255,255,255,0.86);
  --btn-outline-border: rgba(255,255,255,0.18);

  --btn-danger-bg: var(--critical); /* MANTIDO (alerta) */
  --btn-danger-bg-hover: #CF3F3F;
  --btn-danger-bg-active: #B93535;
  --btn-danger-text: rgba(255,255,255,0.94);
  --btn-danger-border: rgba(0,0,0,0.18);

  --btn-disabled-bg: rgba(255,255,255,0.08);
  --btn-disabled-text: rgba(255,255,255,0.35);
  --btn-disabled-border: rgba(255,255,255,0.08);

  /* ------------------------------------------------------------------------
     15) FORMS
     ------------------------------------------------------------------------ */
  --label: var(--text-2);
  --placeholder: rgba(255,255,255,0.45);

  --input-bg: var(--field-bg);
  --input-text: rgba(255,255,255,0.90);
  --input-border: rgba(255,255,255,0.12);
  --input-border-hover: rgba(255,255,255,0.18);
  --input-border-focus: var(--focus-border);
  --input-shadow-focus: 0 0 0 3px rgba(179,179,179,0.18);

  --input-addon-bg: rgba(255,255,255,0.06);
  --input-addon-border: rgba(255,255,255,0.10);

  --field-success: var(--ok);
  --field-warning: var(--warning);
  --field-error: var(--critical);

  --field-success-soft: rgba(33,192,99,0.12);
  --field-warning-soft: rgba(240,138,60,0.12);
  --field-error-soft: rgba(227,75,75,0.12);

  --control-track: rgba(255,255,255,0.14);
  --control-thumb: rgba(255,255,255,0.85);
  --control-checked-track: rgba(179,179,179,0.35); /* cinza */
  --control-checked-thumb: #F2F2F2;

  /* ------------------------------------------------------------------------
     16) TABLES
     ------------------------------------------------------------------------ */
  --table-bg: var(--surface-1);
  --table-border: var(--border-default);

  --table-head-bg: var(--surface-3);
  --table-head-text: rgba(255,255,255,0.86);
  --table-head-border: rgba(255,255,255,0.10);

  --table-row-bg: transparent;
  --table-row-text: rgba(255,255,255,0.86);
  --table-row-text-muted: rgba(255,255,255,0.62);

  --table-row-hover-bg: rgba(255,255,255,0.05);
  --table-row-selected-bg: rgba(179,179,179,0.12);

  --table-cell-border: rgba(255,255,255,0.06);
  --table-zebra-bg: rgba(255,255,255,0.02);

  --table-sort-active: rgba(255,255,255,0.80);
  --table-sort-inactive: rgba(255,255,255,0.40);

  --table-status-ok: var(--ok);
  --table-status-warning: var(--warning);
  --table-status-critical: var(--critical);
  --table-status-unknown: var(--unknown);

  /* ------------------------------------------------------------------------
     17) BADGES / CHIPS
     ------------------------------------------------------------------------ */
  --badge-bg: rgba(255,255,255,0.08);
  --badge-text: rgba(255,255,255,0.80);
  --badge-border: rgba(255,255,255,0.14);

  --badge-ok-bg: var(--ok-soft);
  --badge-ok-text: var(--ok);
  --badge-ok-border: var(--ok-border);

  --badge-info-bg: var(--info-soft);
  --badge-info-text: var(--info);
  --badge-info-border: var(--info-border);

  --badge-warning-bg: var(--warning-soft);
  --badge-warning-text: var(--warning);
  --badge-warning-border: var(--warning-border);

  --badge-major-bg: var(--major-soft);
  --badge-major-text: var(--major);
  --badge-major-border: var(--major-border);

  --badge-critical-bg: var(--critical-soft);
  --badge-critical-text: var(--critical);
  --badge-critical-border: var(--critical-border);

  --badge-unknown-bg: var(--unknown-soft);
  --badge-unknown-text: var(--unknown);
  --badge-unknown-border: var(--unknown-border);

  /* ------------------------------------------------------------------------
     18) ALERTS / TOASTS
     ------------------------------------------------------------------------ */
  --toast-bg: var(--surface-2);
  --toast-border: var(--border-default);
  --toast-text: var(--text-1);
  --toast-muted: var(--text-2);
  --toast-shadow: var(--shadow-md);

  --alert-ok-accent: var(--ok);
  --alert-info-accent: var(--info);
  --alert-warning-accent: var(--warning);
  --alert-major-accent: var(--major);
  --alert-critical-accent: var(--critical);

  /* ------------------------------------------------------------------------
     ALERTAS / BADGES (PILL)
     Padrão: bg (escuro), bgSoft (claro), text, border
     ------------------------------------------------------------------------ */

  /* UNKNOWN (cinza + branco) */
  --alert-unknown-bg: #2A2B2B; /* chip */
  --alert-unknown-bgSoft: #3A3C3C; /* hover/realce */
  --alert-unknown-text: #F2F2F2; /* texto */
  --alert-unknown-border: #4A4D4D; /* contorno */

  /* UP (verde + verde claro) */
  --alert-up-bg: #0F2A1E; /* chip */
  --alert-up-bgSoft: #1B3E2C; /* hover/realce */
  --alert-up-text: #21C063; /* sua cor destaque */
  --alert-up-border: #1F7A52; /* contorno */

  /* DOWN (vermelho + vermelho claro) */
  --alert-down-bg: #2A1212; /* chip */
  --alert-down-bgSoft: #3B1717; /* hover/realce */
  --alert-down-text: #FF4D4D; /* texto */
  --alert-down-border: #B83232; /* contorno */

  /* TEMP ALTA (laranja + laranja claro) */
  --alert-temp-high-bg: #2A1D0E; /* chip */
  --alert-temp-high-bgSoft: #3A2814; /* hover/realce */
  --alert-temp-high-text: #FF9A3D; /* texto */
  --alert-temp-high-border: #C66A1F; /* contorno */

  /* TEMP CRÍTICA (vermelho + vermelho claro) */
  --alert-temp-crit-bg: #2A1212; /* igual DOWN p/ consistência */
  --alert-temp-crit-bgSoft: #3B1717;
  --alert-temp-crit-text: #FF4D4D;
  --alert-temp-crit-border: #B83232;

  /* ------------------------------------------------------------------------
     19) MODALS / DROPDOWNS
     ------------------------------------------------------------------------ */
  --modal-bg: var(--surface-2);
  --modal-border: var(--border-default);
  --modal-title: var(--text-1);
  --modal-text: var(--text-2);
  --modal-shadow: var(--shadow-lg);

  --dropdown-bg: var(--surface-2);
  --dropdown-border: var(--border-default);
  --dropdown-item-hover: rgba(255,255,255,0.06);

  /* ------------------------------------------------------------------------
     20) SCROLLBAR
     ------------------------------------------------------------------------ */
  --scroll-track: rgba(255,255,255,0.04);
  --scroll-thumb: rgba(255,255,255,0.14);
  --scroll-thumb-hover: rgba(255,255,255,0.22);

  /* ------------------------------------------------------------------------
     21) CHARTS — neutros em cinza puro (séries MANTIDAS)
     ------------------------------------------------------------------------ */
  --chart-bg: var(--surface-1);
  --chart-grid: rgba(255,255,255,0.06);
  --chart-axis: rgba(255,255,255,0.22);
  --chart-axis-label: rgba(255,255,255,0.70);
  --chart-title: rgba(255,255,255,0.90);

  --chart-tooltip-bg: var(--surface-2);
  --chart-tooltip-border: rgba(255,255,255,0.12);
  --chart-tooltip-text: rgba(255,255,255,0.88);
  --chart-tooltip-muted: rgba(255,255,255,0.62);

  /* Séries — MANTIDAS (não são paleta neutra) */
  --series-1: #21C063;
  --series-2: #4FA3FF;
  --series-3: #F0C44C;
  --series-4: #E34B4B;
  --series-5: #9B7BFF;
  --series-6: #35D0C8;
  --series-7: #F08A3C;
  --series-8: #B7BDC2;

  /* ------------------------------------------------------------------------
     22) PROGRESS / LOADING / SKELETON (cinza puro)
     ------------------------------------------------------------------------ */
  --progress-track: rgba(255,255,255,0.08);
  --progress-bar: rgba(179,179,179,0.85);

  --skeleton-base: rgba(255,255,255,0.06);
  --skeleton-shine: rgba(255,255,255,0.10);

  /* ------------------------------------------------------------------------
     23) ICONS
     ------------------------------------------------------------------------ */
  --icon: rgba(255,255,255,0.74);
  --icon-muted: rgba(255,255,255,0.52);
  --icon-disabled: rgba(255,255,255,0.32);

  /* ------------------------------------------------------------------------
     24) LED STATUS — MANTIDOS (alerta/health)
     ------------------------------------------------------------------------ */
  --led-ok: #21C063;
  --led-warning: var(--warning);
  --led-critical: #E34B4B;
  --led-unknown: rgba(255,255,255,0.45);

  --led-glow-ok: rgba(33,192,99,0.35);
  --led-glow-warning: rgba(240,138,60,0.35);
  --led-glow-critical: rgba(227,75,75,0.35);
  --led-glow-unknown: rgba(255,255,255,0.20);
}

/* ==========================================================================
   Contraste garantido:
   - bg (#161616) < card (#262626) < elevated (#2E2E2E) < header (#333333)
   - text: #F2F2F2 > #D0D0D0 > #A8A8A8
   - “ação principal” (UI) agora é cinza #B3B3B3 (sem verde)
   ========================================================================== */