/* Upscalers Admin v3 — Design Tokens
   Light mode only. Private banking / Bloomberg Terminal aesthetic. */

:root {
  /* Surfaces */
  --bg-page: #F5F4EE;
  --bg-sidebar: #EFEDE5;
  --bg-surface: #FFFFFF;
  --bg-hover: #FAFAF6;
  --bg-muted: #F0EEE6;

  /* Borders */
  --border-subtle: #E5E3DC;
  --border-strong: #DCDAD2;
  --border-divider: #ECEAE2;

  /* Text */
  --text-primary: #1A1A1A;
  --text-secondary: #6B6B6B;
  --text-tertiary: #9A9A9A;
  --text-disabled: #B5B5B0;

  /* Accent — pale teal */
  --accent: #5A9A9D;
  --accent-hover: #4A8B8E;
  --accent-deep: #3F7C7F;
  --accent-bg: #E8F0F0;
  --accent-border: #C9DCDC;

  /* Status */
  --success: #4F8C5A;
  --success-bg: #E8F0E8;
  --success-border: #CFE0CF;

  --warning: #B8923A;
  --warning-bg: #F5EDD8;
  --warning-border: #E5D8B5;

  --danger: #B05050;
  --danger-bg: #F5E5E5;
  --danger-border: #E5C8C8;

  --neutral: #8A8A8A;
  --neutral-bg: #EDECE5;
  --neutral-border: #DCDAD2;

  /* IRR coloring (perf) */
  --perf-pos: #3F7C42;
  --perf-neg: #A33E3E;
  --perf-flat: #6B6B6B;

  /* Type */
  --font-sans: "Satoshi", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-serif: "Source Serif 4", "Iowan Old Style", "Apple Garamond", Georgia, serif;
  --font-mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, monospace;

  --text-xs: 11px;
  --text-sm: 12px;
  --text-base: 13px;
  --text-md: 14px;
  --text-lg: 16px;
  --text-xl: 20px;
  --text-2xl: 24px;
  --text-3xl: 32px;
  --text-display: 52px;
  --text-kpi: 56px;

  /* Finance overview teal-tinted surface (KPI focus card) */
  --bg-teal-pale: #EFF5F4;
  --border-teal-pale: #D8E4E3;

  /* Spacing scale */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-7: 32px;
  --sp-8: 40px;
  --sp-9: 48px;

  /* Radius */
  --r-xs: 3px;
  --r-sm: 4px;
  --r-md: 6px;
  --r-lg: 8px;

  /* Shadow — subtle only */
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.04);
  --shadow-md: 0 2px 6px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
  --shadow-lg: 0 8px 24px rgba(0,0,0,0.08), 0 2px 4px rgba(0,0,0,0.04);

  /* Layout */
  --sidebar-w: 232px;
  --row-h: 64px;
  --topbar-h: 64px;
}
