/* CSS Variables - Design System */

:root {
  /* Basic Colors */
  --color-white: #FFFFFF;
  --colors-base-white: #FFFFFF;
  --link-text-color: #0079C3;

  /* Primary Colors - Grey */
  --primary-colors-primary-grey-20: #D8D8D7;
  --primary-colors-primary-grey-40: #B2B0B0;
  --primary-colors-primary-grey-60: #8B8988;
  --primary-colors-primary-grey-100: #3E3A39;
  --primary-colors-primary-grey-hover: rgba(0, 0, 0, 0.2);

  /* Primary Colors - Blue */
  --primary-colors-primary-blue-100: #004077;

  /* Primary Colors - Green */
  --primary-colors-primary-green-100: #549B35;

  /* Brand Colors - Grey */
  --primary-colors-brand-grey-20: #F2F2F2;
  --primary-colors-brand-grey-40: #E5E6E6;
  --primary-colors-brand-grey-80: #CCCDCD;

  /* Font Families */
  --en-text-xs-font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --en-text-lg-font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --en-text-2xl-font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --display-lg-font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* Font Sizes */
  --en-text-xs-font-size: 10px;
  --en-text-sm-font-size: 11px;
  --en-text-lg-font-size: 16px;
  --en-text-2xl-font-size: 24px;
  --display-lg-font-size: 48px;

  /* Line Heights */
  --en-text-xs-line-height: 14px;
  --en-text-sm-line-height: 18px;
  --en-text-lg-line-height: 28px;
  --en-text-2xl-line-height: 40px;
  --display-lg-line-height: 60px;

  /* Font Weights */
  --en-text-xs-font-weight: 500;
  --en-text-sm-font-weight: 500;
  --en-text-lg-font-weight: 500;
  --en-text-2xl-font-weight: 700;
  --display-lg-font-weight: 500;

  /* Border Radius */
  --border-radius-sm: 10px;
  --border-radius-md: 16px;
  --border-radius-full: 999px;

  /* Spacing */
  --spacing-xs: 2px;
  --spacing-sm: 6px;
  --spacing-md: 8px;
  --spacing-lg: 12px;
  --spacing-xl: 16px;
  --spacing-2xl: 24px;
  --spacing-3xl: 32px;
  --spacing-4xl: 40px;

  /* Shadows */
  --shadow-xs: 0px 1px 2px 0px rgba(10, 13, 18, 0.05);
  --shadow-card: 1px 4px 14px 0px rgba(0, 0, 0, 0.15);

  /* Glass Effect */
  --glass-bg: rgba(255, 255, 255, 0.6);
  --glass-border: #FFFFFF;
}