/* ==========================================================================
   SIMS Design System: Design Tokens & Typography
   Branding: Navy Blue Beige Wedding Dark (#FCF1D0 Main)
   Rule F.6 Compliant: Modular stylesheet (<300 lines)
   Rule 2 Compliant: Zero emoji
   ========================================================================== */

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

:root {
  --font-main: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-display: 'Plus Jakarta Sans', sans-serif;
  --font-mono: 'JetBrains Mono', monospace;

  /* Core Canvas & Surfaces (Navy Blue Wedding Dark) */
  --bg-dark: #010736;                 /* Absolute Midnight Blue Base rgb(1, 7, 54) */
  --bg-card: rgba(13, 28, 66, 0.75);  /* Regal Navy Deck Glass rgb(13, 28, 66) */
  --bg-card-hover: rgba(34, 57, 111, 0.85); /* Sapphire Muted Surface rgb(34, 57, 111) */
  --bg-card-solid: #0D1C42;           /* Solid Regal Navy Deck */
  --bg-input: rgba(1, 7, 54, 0.80);   /* Midnight Input Container */

  /* Borders & Dividers */
  --border-subtle: rgba(252, 241, 208, 0.16); /* Champagne Translucent Border */
  --border-hover: rgba(252, 241, 208, 0.40);
  --border-focus: #FCF1D0;

  /* Typography Colors */
  --text-main: #FFFFFF;               /* Crisp Pure White for Headings */
  --text-beige: #FCF1D0;              /* Royal Champagne Cream rgb(252, 241, 208) */
  --text-muted: rgba(252, 241, 208, 0.72); /* Muted Champagne Secondary */
  --text-dim: rgba(252, 241, 208, 0.45);   /* Dimmed Champagne Tertiary */

  /* Brand Accents */
  --accent-primary: #FCF1D0;          /* Royal Champagne Cream */
  --accent-primary-glow: rgba(252, 241, 208, 0.20);
  --accent-gold: #F59E0B;             /* Liquid Reserve Gold */
  --accent-silver: #E2E8F0;           /* Specular Bullion Silver */
  --accent-success: #10B981;          /* Emerald Inflows / Yield */
  --accent-success-glow: rgba(16, 185, 129, 0.20);
  --accent-danger: #F43F5E;           /* Crimson Outflows / Burn */
  --accent-danger-glow: rgba(244, 63, 94, 0.20);
  --accent-warning: #FBBF24;          /* Caution Amber */
  --accent-ai: #06B6D4;               /* Cyan Velocity (AI Intelligence) */
  --accent-ai-glow: rgba(6, 182, 212, 0.22);
  --accent-cyan: #06B6D4;             /* Cyan Velocity */

  /* 12 High-Variance Quantitative Chart Tokens */
  --chart-glow-gold: #F59E0B;
  --chart-glow-champagne: #FCF1D0;
  --chart-cyan-velocity: #06B6D4;
  --chart-sapphire-etf: #3B82F6;
  --chart-emerald-yield: #10B981;
  --chart-crimson-burn: #F43F5E;
  --chart-amethyst-shield: #A855F7;
  --chart-silver-bullion: #E2E8F0;
  --chart-verdict-verdigris: #14B8A6;
  --chart-amber-caution: #FBBF24;
  --chart-coral-risk: #F87171;
  --chart-electric-indigo: #6366F1;

  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-full: 9999px;

  --shadow-card: 0 10px 30px -10px rgba(0, 0, 0, 0.5), inset 0 0 0 1px rgba(252, 241, 208, 0.12);
  --shadow-glow: 0 0 25px -5px var(--accent-primary-glow);
  --transition-fast: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-smooth: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  font-family: var(--font-main);
  background-color: var(--bg-dark);
  color: var(--text-main);
  min-height: 100vh;
  line-height: 1.5;
  background-image: 
    radial-gradient(circle at 15% 10%, rgba(34, 57, 111, 0.35) 0%, transparent 50%),
    radial-gradient(circle at 85% 85%, rgba(13, 28, 66, 0.60) 0%, transparent 60%),
    radial-gradient(circle at 50% 0%, rgba(252, 241, 208, 0.04) 0%, transparent 45%);
  background-attachment: fixed;
  overflow-x: hidden;
  cursor: default;
}

/* UI chrome and static text elements */
h1, h2, h3, h4, h5, h6,
p, span, div, label,
table, th, td,
.glass-card, .kpi-card, .badge-tag,
.page-header-strip, .section-title-bar, .top-header,
.status-dot {
  cursor: default;
}

/* Interactive elements */
a, button, [role="button"], .btn, .filter-pill,
[hx-get], [hx-post], [hx-delete], [onclick],
select, option, .clickable {
  cursor: pointer;
}

/* Form inputs & editable areas */
input, textarea, [contenteditable="true"], .search-input, .form-control {
  cursor: text;
}

/* Prevent accidental text selection on UI controls */
.top-header, .btn, .filter-pill, .badge-tag, .brand-badge, .status-dot, .kpi-header {
  user-select: none;
  -webkit-user-select: none;
}