/* ===================================================================
   HuliOS beta (v2) — tema v3 «dashboard escuro e limpo»
   Carregado DEPOIS de todo o CSS da página (fim do <head> do base.html).
   Só troca valor de variável e aparência: nenhuma classe, id ou atributo
   que o JavaScript usa é tocado — filtros, ordenação, presets e
   redimensionamento de coluna seguem o código de produção.
   Referência: OUTBOX/hulios-design-system-v3/index.html
   =================================================================== */

/* ---------- Tokens (escuro) ---------- */
:root,
:root[data-theme="dark"],
.dachos[data-theme="dark"] {
  /* variables.css */
  --bg-primary:   #09090B;
  --bg-secondary: #111113;
  --bg-tertiary:  #18181B;
  --bg-input:     #0E0E10;
  --bg-hover:     #1C1C20;
  --bg-active:    #232328;
  --bg-overlay:   rgba(0, 0, 0, .72);

  --border:       #232328;
  --border-light: #1A1A1E;
  --border-focus: #A1A1AA;

  --text-primary:   #FAFAFA;
  --text-secondary: #A1A1AA;
  --text-muted:     #71717A;
  --text-link:      #FAFAFA;

  --accent:        #FAFAFA;
  --accent-hover:  #E4E4E7;
  --accent-subtle: rgba(250, 250, 250, .08);

  --success: #34D399;  --success-hover: #6EE7B7;  --success-bg: rgba(52, 211, 153, .12);
  --warning: #FBBF24;  --warning-hover: #FCD34D;  --warning-bg: rgba(251, 191, 36, .12);
  --error:   #F87171;  --error-hover:   #FCA5A5;  --error-bg:   rgba(248, 113, 113, .12);
  --running: #60A5FA;  --running-bg: rgba(96, 165, 250, .12);
  --purple:  #A78BFA;  --purple-bg:  rgba(167, 139, 250, .12);

  --execute:        #FAFAFA;
  --execute-hover:  #E4E4E7;
  --execute-border: #FAFAFA;
  --execute-glow:   rgba(250, 250, 250, .10);

  --font-ui:    'Geist', -apple-system, 'Segoe UI', system-ui, sans-serif;
  --font-serif: 'Geist', -apple-system, 'Segoe UI', system-ui, sans-serif;
  --font-mono:  'Geist Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .35);
  --shadow-md: 0 8px 24px rgba(0, 0, 0, .40);
  --shadow-lg: 0 18px 50px rgba(0, 0, 0, .50);
  --shadow-glow-blue:  none;
  --shadow-glow-green: none;
  --shadow-glow-red:   none;

  /* dachos.css (--d-*) */
  --d-ink-0: #09090B;
  --d-ink-1: #09090B;
  --d-ink-2: #0E0E10;
  --d-ink-3: #111113;
  --d-ink-4: #18181B;
  --d-ink-5: #232328;

  --d-fg-0: #FAFAFA;
  --d-fg-1: #D4D4D8;
  --d-fg-2: #A1A1AA;
  --d-fg-3: #71717A;
  --d-fg-4: #52525B;

  --d-border-subtle:  #1A1A1E;
  --d-border-default: #232328;
  --d-border-strong:  #2E2E35;
  --d-border-neon:    #3F3F46;

  /* «neon» virou cor com significado: verde = bom, vermelho = ruim */
  --d-neon-green:       #34D399;
  --d-neon-green-dim:   #10B981;
  --d-neon-green-glow:  transparent;
  --d-neon-cyan:        #FAFAFA;   /* era o acento: vira o branco de ação */
  --d-neon-cyan-dim:    #D4D4D8;
  --d-neon-cyan-glow:   transparent;
  --d-neon-magenta:     #F87171;
  --d-neon-magenta-dim: #EF4444;
  --d-neon-magenta-glow: transparent;
  --d-neon-amber:       #FBBF24;
  --d-neon-amber-dim:   #F59E0B;
  --d-neon-amber-glow:  transparent;
  --d-neon-violet:      #A78BFA;
  --d-neon-violet-glow: transparent;

  --d-status-queued:    #71717A;
  --d-status-running:   #60A5FA;
  --d-status-success:   #34D399;
  --d-status-failed:    #F87171;
  --d-status-timeout:   #FBBF24;
  --d-status-cancelled: #71717A;

  --d-money-positive: #34D399;
  --d-money-negative: #F87171;
  --d-money-neutral:  #D4D4D8;

  --d-glass-1: #111113;
  --d-glass-2: #111113;
  --d-glass-3: #18181B;
  --d-glass-border: #1A1A1E;
  --d-glass-blur: none;

  --d-shadow-sm: 0 1px 2px rgba(0, 0, 0, .35);
  --d-shadow-md: 0 8px 24px rgba(0, 0, 0, .40);
  --d-shadow-lg: 0 18px 50px rgba(0, 0, 0, .50);
  --d-shadow-xl: 0 28px 70px rgba(0, 0, 0, .60);

  --d-glow-green: none;  --d-glow-magenta: none;  --d-glow-amber: none;  --d-glow-cyan: none;
  --d-inset-highlight: inset 0 1px 0 rgba(255, 255, 255, .03);
  --d-inset-highlight-strong: inset 0 1px 0 rgba(255, 255, 255, .05);
  --d-gradient-vignette: none;

  --d-font-display: 'Geist', -apple-system, 'Segoe UI', system-ui, sans-serif;
  --d-font-body:    'Geist', -apple-system, 'Segoe UI', system-ui, sans-serif;
  --d-font-mono:    'Geist Mono', ui-monospace, 'SF Mono', Menlo, monospace;
}

/* ---------- Base ---------- */
html, body { background: #09090B; }
body {
  font-family: var(--font-ui);
  -webkit-font-smoothing: antialiased;
  font-feature-settings: "tnum" 1;      /* números alinhados por coluna */
}
::selection { background: rgba(250, 250, 250, .18); }

/* Texto sobre fundo de acento (agora branco) precisa ser escuro */
.chip.active,
.weekday-chip:has(input:checked),
.cron-preset.active,
.fp-view-toggle .chip.active,
.fp-toolbar-btn.active,
.fp-stage-toggle.expanded,
.fp-unconfigured-btn,
.fp-multi-tag,
.fp-multi-option.selected,
.dachos .btn-primary,
.btn-primary,
.btn-execute {
  color: #09090B !important;
}
.fp-multi-tag *, .fp-multi-option.selected * { color: #09090B !important; }

/* ---------- Cabeçalho ---------- */
.app-header {
  background: rgba(9, 9, 11, .82) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid #1A1A1E !important;
  box-shadow: none !important;
}
.app-header .logo-text { font-family: var(--font-ui) !important; font-weight: 600; letter-spacing: -.01em; }
.app-header .nav-group-btn { border-radius: 8px; }
.app-header .nav-group.active .nav-group-btn { background: #232328 !important; color: #FAFAFA !important; box-shadow: inset 0 0 0 1px #2E2E35 !important; }
.app-header .nav-dropdown {
  background: #111113 !important;
  border: 1px solid #232328 !important;
  box-shadow: 0 18px 50px rgba(0, 0, 0, .55) !important;
  border-radius: 12px !important;
}
.app-header .nav-dropdown-link.active { background: #232328 !important; color: #FAFAFA !important; }
.app-header .nav-dropdown-link.active svg { color: #FAFAFA !important; }
.app-header .user-avatar { background: linear-gradient(135deg, #3F3F46, #27272A) !important; color: #FAFAFA !important; }

/* Selo «Beta» ao lado do logo */
.app-header .logo::after {
  content: "Beta";
  margin-left: 8px; padding: 2px 7px; border-radius: 9999px;
  font: 500 10.5px/1.4 var(--font-ui); letter-spacing: .02em;
  color: #FBBF24; background: rgba(251, 191, 36, .12);
}

/* ---------- Botões ---------- */
.btn, .dachos .btn { border-radius: 8px; font-family: var(--font-ui); font-weight: 500; box-shadow: none !important; }
.btn-primary, .dachos .btn-primary, .btn-execute {
  background: #FAFAFA !important;
  border: 1px solid #FAFAFA !important;
  box-shadow: none !important;
  filter: none !important;
}
.btn-primary:hover, .dachos .btn-primary:hover, .btn-execute:hover { background: #E4E4E7 !important; border-color: #E4E4E7 !important; }
.btn-secondary, .dachos .btn-secondary { background: #18181B !important; border: 1px solid #232328 !important; color: #FAFAFA !important; }
.btn-secondary:hover, .dachos .btn-secondary:hover { background: #1C1C20 !important; }
.btn-ghost:hover, .dachos .btn-ghost:hover { background: #1C1C20 !important; }
.btn-danger, .dachos .btn-danger { background: rgba(248, 113, 113, .12) !important; color: #F87171 !important; border: 1px solid rgba(248, 113, 113, .25) !important; }

/* ---------- Campos ---------- */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
select, textarea {
  font-family: var(--font-ui);
}
input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: none;
  border-color: #3F3F46 !important;
  box-shadow: 0 0 0 3px rgba(250, 250, 250, .08) !important;
}

/* ---------- Cards, painéis, números ---------- */
.card, .panel, .stat-card, .dachos .stat-card, .kpi, .table-container, .dachos .table-container {
  background: #111113 !important;
  border: 1px solid #1A1A1E !important;
  border-radius: 12px !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, .03) inset, 0 8px 24px rgba(0, 0, 0, .35) !important;
  backdrop-filter: none !important;
}
.stat-card::before, .dachos .stat-card::before { display: none !important; }
.stat-icon, .dachos .stat-icon,
.dachos .stat-icon-total, .dachos .stat-icon-running, .dachos .stat-icon-success, .dachos .stat-icon-failed {
  background: #18181B !important;
  border: 1px solid #232328;
  color: #A1A1AA !important;
  border-radius: 8px !important;
}
.stat-value, .dachos .stat-value, .kpi-v {
  font-family: var(--font-ui) !important;
  font-weight: 600 !important;
  letter-spacing: -.03em !important;
  font-variant-numeric: tabular-nums;
}
.stat-label, .dachos .stat-label, .kpi-l { color: #A1A1AA !important; letter-spacing: 0 !important; text-transform: none !important; }

/* ---------- Tabelas (só aparência) ---------- */
table { font-variant-numeric: tabular-nums; }
table thead th {
  background: #111113;
  color: #71717A;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
  border-bottom: 1px solid #1A1A1E;
}
table tbody td { border-bottom-color: #1A1A1E; }
table tbody tr:hover > td { background: #1C1C20; }

/* ---------- Badges ---------- */
.badge, .status-badge { border-radius: 9999px; font-weight: 500; letter-spacing: 0; }

/* ---------- Modal, toast, dropdown ---------- */
.modal, .modal-content, .dropdown-menu, .toast {
  background: #111113 !important;
  border: 1px solid #232328 !important;
  border-radius: 14px !important;
  box-shadow: 0 24px 80px rgba(0, 0, 0, .6) !important;
  backdrop-filter: none !important;
}

/* ---------- Barra de rolagem discreta ---------- */
* { scrollbar-color: #2E2E35 transparent; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: #2E2E35; border-radius: 10px; border: 2px solid #09090B; }
::-webkit-scrollbar-track { background: transparent; }

/* ---------- Títulos e abas ---------- */
h1, .page-title, .dachos .page-title { letter-spacing: -.025em !important; font-weight: 600 !important; }
.trafego-tab.active, .tab.active, .dachos .tab-bar .tab.active { color: #FAFAFA !important; border-bottom-color: #FAFAFA !important; }
.dachos .tab-bar .tab.active::after { background: #FAFAFA !important; box-shadow: none !important; }

/* ---------- Botão primário das páginas DachOS e chips ativos ---------- */
.dachos-btn-primary, .dachos .dachos-btn-primary {
  background: #FAFAFA !important;
  color: #09090B !important;
  border: 1px solid #FAFAFA !important;
  box-shadow: none !important;
  filter: none !important;
}
.dachos-btn-primary:hover { background: #E4E4E7 !important; border-color: #E4E4E7 !important; }
.dachos-btn-primary svg { fill: currentColor; }
.dachos .chip.active, .chip.active {
  background: #FAFAFA !important;
  border-color: #FAFAFA !important;
  color: #09090B !important;
  box-shadow: none !important;
}
[class*="toast"] { border-color: #232328 !important; }

/* Tabelas das páginas DachOS: corpo em Geist (a mono fica só no que é código) */
.dachos .table td, .dachos .table th { font-family: var(--font-ui) !important; }

/* ── Sem japonês (pedido do Vellani, 13/10/2026) ───────────────────────── */
.jp, .dachos-jp-accent, .ltv-jp { display: none !important; }
.dachos .fp-canvas-title::before { content: "FUNIL  " !important; }
