/*
 * User Typography Preferences
 * ================================
 * Override default typography based on user preferences.
 * Preferences are applied via data attributes on the html element.
 */

/* ========================================
 * FONT SIZE OVERRIDES
 * Using html element selector for higher specificity than :root
 * ======================================== */

html[data-font-size="small"] {
  --font-size-xs: 9px;
  --font-size-sm: 10px;
  --font-size-base: 11px;
  --font-size-md: 12px;
  --font-size-lg: 14px;
  --font-size-xl: 16px;
  --font-size-2xl: 18px;
}

/* Medium is default - no override needed */

html[data-font-size="large"] {
  --font-size-xs: 11px;
  --font-size-sm: 12px;
  --font-size-base: 15px;
  --font-size-md: 16px;
  --font-size-lg: 18px;
  --font-size-xl: 20px;
  --font-size-2xl: 22px;
}

html[data-font-size="extra-large"] {
  --font-size-xs: 12px;
  --font-size-sm: 14px;
  --font-size-base: 17px;
  --font-size-md: 18px;
  --font-size-lg: 20px;
  --font-size-xl: 22px;
  --font-size-2xl: 24px;
}

/* ========================================
 * FONT FAMILY OVERRIDES
 * Using html element selector for higher specificity than :root
 * ======================================== */

/* System is default - no override needed */

html[data-font-family="fira-code"] {
  --font-mono: 'Fira Code', 'SF Mono', 'Consolas', monospace;
}

html[data-font-family="jetbrains-mono"] {
  --font-mono: 'JetBrains Mono', 'SF Mono', 'Consolas', monospace;
}

html[data-font-family="sf-mono"] {
  --font-mono: 'SF Mono', 'Monaco', 'Consolas', monospace;
}

html[data-font-family="consolas"] {
  --font-mono: 'Consolas', 'Monaco', 'SF Mono', monospace;
}

/* ========================================
 * LINE SPACING OVERRIDES
 * Using html element selector for higher specificity than :root
 * ======================================== */

html[data-line-spacing="compact"] {
  --line-height-tight: 1.15;
  --line-height-normal: 1.3;
  --line-height-relaxed: 1.5;
}

/* Normal is default - no override needed */

html[data-line-spacing="relaxed"] {
  --line-height-tight: 1.4;
  --line-height-normal: 1.65;
  --line-height-relaxed: 1.9;
}