@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');

/* ═══════════════════════════════════════════════════
   DESIGN TOKENS — Thermas Pacu · Portal BI
   ═══════════════════════════════════════════════════ */
:root {
  /* ── Backgrounds ── */
  --bg-base:       #090910;
  --bg-surface:    #111119;
  --bg-card:       #18181F;
  --bg-card-hover: #1F1F2C;
  --bg-input:      #0E0E16;
  --bg-modal:      rgba(9, 9, 16, 0.85);

  /* ── Accent Purple ── */
  --accent:             #7C6FF7;
  --accent-hover:       #6A5EF0;
  --accent-light:       #9B8FFF;
  --accent-glow:        rgba(124, 111, 247, 0.18);
  --accent-glow-strong: rgba(124, 111, 247, 0.35);
  --accent-bg:          rgba(124, 111, 247, 0.10);

  /* ── Accent Teal ── */
  --teal:      #00C9A7;
  --teal-glow: rgba(0, 201, 167, 0.15);
  --teal-bg:   rgba(0, 201, 167, 0.10);

  /* ── Text ── */
  --text-primary:   #EEEEFF;
  --text-secondary: #AAAACC;
  --text-muted:     #7777AA;
  --text-faint:     #44445A;

  /* ── Border ── */
  --border:        rgba(255, 255, 255, 0.07);
  --border-hover:  rgba(124, 111, 247, 0.40);
  --border-input:  rgba(255, 255, 255, 0.10);
  --border-focus:  rgba(124, 111, 247, 0.55);

  /* ── Status ── */
  --success:    #22C55E;
  --success-bg: rgba(34, 197,  94, 0.12);
  --danger:     #EF4444;
  --danger-bg:  rgba(239,  68,  68, 0.12);
  --warning:    #F59E0B;
  --warning-bg: rgba(245, 158,  11, 0.12);
  --info:       #38BDF8;
  --info-bg:    rgba( 56, 189, 248, 0.12);

  /* ── Shadows ── */
  --shadow:        0 4px 24px rgba(0, 0, 0, 0.40);
  --shadow-lg:     0 8px 48px rgba(0, 0, 0, 0.60);
  --shadow-accent: 0 4px 24px rgba(124, 111, 247, 0.28);
  --shadow-card:   0 2px 12px rgba(0, 0, 0, 0.30);

  /* ── Radius ── */
  --radius-xs: 6px;
  --radius-sm: 8px;
  --radius:    12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-full: 9999px;

  /* ── Transitions ── */
  --t-fast: 0.15s ease;
  --t:      0.22s ease;
  --t-slow: 0.35s ease;

  /* ── Layout ── */
  --sidebar-w: 240px;
  --header-h:  64px;

  /* ── Font ── */
  --font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}