/* Google Fonts: @import url('https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600&display=swap'); */

:root {
  /* Dark Theme — Colors */
  --surface: #131313;
  --surface-alt: #080808;
  --surface-container-low: #1c1b1b;
  --surface-container: #201f1f;
  --surface-container-high: #2a2a2a;
  --on-surface: #e5e2e1;
  --on-surface-variant: #c4c7c9;
  --primary-action: #f2f2f3;
  --on-primary-action: #080808;
  --border: #1F1F1F;
  --approved: #22C55E;
  --secondary: #4ae176;
  --rejected: #FF4D4D;
  --danger: #FF4D4D;
  --pending: #F59E0B;
  --error: #ffb4ab;
  --pill-bg: #141414;

  /* Spacing Scale — 4px base unit */
  --unit: 4px;
  --stack-gap: 8px;
  --panel-padding: 16px;
  --container-margin: 24px;

  /* Typography — Geist */
  /* headline-lg: 24px / 500 / 32px / -0.02em */
  --text-headline-lg-size: 24px;
  --text-headline-lg-weight: 500;
  --text-headline-lg-line: 32px;
  --text-headline-lg-tracking: -0.02em;

  /* headline-md: 18px / 500 / 24px / -0.02em */
  --text-headline-md-size: 18px;
  --text-headline-md-weight: 500;
  --text-headline-md-line: 24px;
  --text-headline-md-tracking: -0.02em;

  /* body-lg: 14px / 400 / 20px / -0.01em */
  --text-body-lg-size: 14px;
  --text-body-lg-weight: 400;
  --text-body-lg-line: 20px;
  --text-body-lg-tracking: -0.01em;

  /* body-sm: 13px / 400 / 18px / -0.01em */
  --text-body-sm-size: 13px;
  --text-body-sm-weight: 400;
  --text-body-sm-line: 18px;
  --text-body-sm-tracking: -0.01em;

  /* label-caps: 11px / 600 / 16px / 0.05em uppercase */
  --text-label-caps-size: 11px;
  --text-label-caps-weight: 600;
  --text-label-caps-line: 16px;
  --text-label-caps-tracking: 0.05em;
}