/* Edulite Design System - Generated CSS Custom Properties */
/* Generated on: 2025-10-04T22:37:04.052Z */
/* From: Edulite Professional Fintech Design System v1.0.0 */

:root {
  /* ===== COLORS ===== */
  /* Light Theme Colors */
  --edulite-color-primary: #8B7BF7;
  --edulite-color-on-primary: #FFFFFF;
  --edulite-color-primary-container: #B4A9FF;
  --edulite-color-on-primary-container: #2B2D42;
  --edulite-color-secondary: #FF8FA3;
  --edulite-color-on-secondary: #FFFFFF;
  --edulite-color-secondary-container: #FFB5A7;
  --edulite-color-on-secondary-container: #2B2D42;
  --edulite-color-tertiary: #4ECDC4;
  --edulite-color-on-tertiary: #FFFFFF;
  --edulite-color-tertiary-container: #95E1D3;
  --edulite-color-on-tertiary-container: #2B2D42;
  --edulite-color-info: #0091e7;
  --edulite-color-on-info: #FFFFFF;
  --edulite-color-info-container: #7dc2ff;
  --edulite-color-on-info-container: #2B2D42;
  --edulite-color-success: #00a261;
  --edulite-color-on-success: #FFFFFF;
  --edulite-color-success-container: #55dc94;
  --edulite-color-on-success-container: #2B2D42;
  --edulite-color-warning: #b58600;
  --edulite-color-on-warning: #FFFFFF;
  --edulite-color-warning-container: #f1ba48;
  --edulite-color-on-warning-container: #2B2D42;
  --edulite-color-background: #FAFAFA;
  --edulite-color-on-background: #2B2D42;
  --edulite-color-surface: #FFFFFF;
  --edulite-color-on-surface: #2B2D42;
  --edulite-color-surface-variant: #F0F0F3;

  /* Reference Palette */
  --edulite-color-primary-purple: #8B7BF7;
  --edulite-color-primary-purple-light: #B4A9FF;
  --edulite-color-primary-purple-dark: #6B5BD6;
  --edulite-color-secondary-pink: #FF8FA3;
  --edulite-color-secondary-coral: #FFB5A7;
  --edulite-color-secondary-peach: #FEC89A;
  --edulite-color-tertiary-yellow: #FFD166;
  --edulite-color-tertiary-blue: #4ECDC4;
  --edulite-color-tertiary-green: #95E1D3;
  --edulite-color-neutral-dark: #2B2D42;
  --edulite-color-neutral-dark-gray: #3D3F52;
  --edulite-color-neutral-medium-gray: #8D8F9A;
  --edulite-color-neutral-light-gray: #F0F0F3;
  --edulite-color-neutral-white: #FFFFFF;
  --edulite-color-neutral-off-white: #FAFAFA;
  --edulite-color-gradients-primary-gradient: linear-gradient(135deg, #8B7BF7 0%, #B4A9FF 100%);
  --edulite-color-gradients-card-gradient: linear-gradient(180deg, #F0F0F3 0%, #FFFFFF 100%);
  --edulite-color-gradients-hero-gradient: linear-gradient(135deg, #FFB5A7 0%, #FEC89A 100%);
  --edulite-color-gradients-surface-gradient: linear-gradient(135deg, #FAFAFA 0%, #F0F0F3 100%);
  --edulite-color-gradients-page-hero-gradient-light: linear-gradient(110deg, #8B7BF7 0%, #FF8FA3 50%, #4ECDC4 100%);
  --edulite-color-gradients-page-hero-gradient-dark: linear-gradient(110deg, #6B5BD6 0%, #D63A5A 50%, #16a085 100%);

  /* ===== TYPOGRAPHY ===== */
  /* Font Families */
  --edulite-font-primary: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --edulite-font-display: 'Roboto', 'Inter', sans-serif;
  --edulite-font-brand: 'Roboto', 'Inter', sans-serif;

  /* Typography Scale */
  --edulite-text-hero-font-size: 56px;
  --edulite-text-hero-line-height: 1.1;
  --edulite-text-hero-font-weight: 700;
  --edulite-text-hero-letter-spacing: -0.02em;
  --edulite-text-display-large-font-size: 40px;
  --edulite-text-display-large-line-height: 1.2;
  --edulite-text-display-large-font-weight: 600;
  --edulite-text-display-large-letter-spacing: -0.01em;
  --edulite-text-display-medium-font-size: 32px;
  --edulite-text-display-medium-line-height: 1.3;
  --edulite-text-display-medium-font-weight: 600;
  --edulite-text-display-medium-letter-spacing: 0;
  --edulite-text-headline-large-font-size: 24px;
  --edulite-text-headline-large-line-height: 1.4;
  --edulite-text-headline-large-font-weight: 600;
  --edulite-text-headline-large-letter-spacing: 0;
  --edulite-text-headline-medium-font-size: 20px;
  --edulite-text-headline-medium-line-height: 1.4;
  --edulite-text-headline-medium-font-weight: 600;
  --edulite-text-headline-medium-letter-spacing: 0;
  --edulite-text-title-large-font-size: 18px;
  --edulite-text-title-large-line-height: 1.4;
  --edulite-text-title-large-font-weight: 600;
  --edulite-text-title-large-letter-spacing: 0;
  --edulite-text-title-medium-font-size: 16px;
  --edulite-text-title-medium-line-height: 1.5;
  --edulite-text-title-medium-font-weight: 500;
  --edulite-text-title-medium-letter-spacing: 0;
  --edulite-text-body-large-font-size: 16px;
  --edulite-text-body-large-line-height: 1.6;
  --edulite-text-body-large-font-weight: 400;
  --edulite-text-body-large-letter-spacing: 0;
  --edulite-text-body-medium-font-size: 14px;
  --edulite-text-body-medium-line-height: 1.5;
  --edulite-text-body-medium-font-weight: 400;
  --edulite-text-body-medium-letter-spacing: 0;
  --edulite-text-body-small-font-size: 12px;
  --edulite-text-body-small-line-height: 1.4;
  --edulite-text-body-small-font-weight: 400;
  --edulite-text-body-small-letter-spacing: 0;
  --edulite-text-label-large-font-size: 14px;
  --edulite-text-label-large-line-height: 1.4;
  --edulite-text-label-large-font-weight: 500;
  --edulite-text-label-large-letter-spacing: 0;
  --edulite-text-label-medium-font-size: 12px;
  --edulite-text-label-medium-line-height: 1.4;
  --edulite-text-label-medium-font-weight: 400;
  --edulite-text-label-medium-letter-spacing: 0;
  --edulite-text-label-small-font-size: 10px;
  --edulite-text-label-small-line-height: 1.4;
  --edulite-text-label-small-font-weight: 400;
  --edulite-text-label-small-letter-spacing: 0;
  --edulite-text-section-title-font-size: 48px;
  --edulite-text-section-title-line-height: 1.2;
  --edulite-text-section-title-font-weight: 700;
  --edulite-text-section-title-letter-spacing: 0;
  --edulite-text-section-subtitle-font-size: 20px;
  --edulite-text-section-subtitle-line-height: 1.6;
  --edulite-text-section-subtitle-font-weight: 600;
  --edulite-text-section-subtitle-letter-spacing: 0;

  /* ===== SPACING ===== */
  --edulite-spacing-xs: 4px;
  --edulite-spacing-sm: 8px;
  --edulite-spacing-md: 16px;
  --edulite-spacing-lg: 24px;
  --edulite-spacing-xl: 32px;
  --edulite-spacing-2xl: 48px;
  --edulite-spacing-3xl: 64px;
  --edulite-spacing-4xl: 96px;

  /* Container Padding */
  --edulite-spacing-container-padding-mobile: 16px;
  --edulite-spacing-container-padding-tablet: 24px;
  --edulite-spacing-container-padding-desktop: 32px;

  /* ===== SHAPES ===== */
  --edulite-shape-none: 0px;
  --edulite-shape-small: 8px;
  --edulite-shape-medium: 12px;
  --edulite-shape-large: 16px;
  --edulite-shape-extraLarge: 24px;
  --edulite-shape-card: 20px;
  --edulite-shape-button: 12px;
  --edulite-shape-full: 9999px;

  /* ===== ELEVATION ===== */
  --edulite-elevation-0: none;
  --edulite-elevation-1: 0 2px 4px rgba(0, 0, 0, 0.06);
  --edulite-elevation-2: 0 4px 12px rgba(0, 0, 0, 0.08);
  --edulite-elevation-3: 0 8px 24px rgba(0, 0, 0, 0.12);
  --edulite-elevation-4: 0 16px 48px rgba(0, 0, 0, 0.16);
  --edulite-elevation-5: 0 16px 48px rgba(0, 0, 0, 0.16);
  --edulite-elevation-colored: 0 8px 32px rgba(139, 123, 247, 0.25);
  --edulite-elevation-card: 0 4px 20px rgba(0, 0, 0, 0.08);
  --edulite-elevation-button: 0 4px 16px rgba(139, 123, 247, 0.3);

  /* ===== MOTION ===== */
  /* Durations */
  --edulite-duration-fast: 150ms;
  --edulite-duration-normal: 250ms;
  --edulite-duration-slow: 350ms;
  --edulite-duration-spring: 400ms;
  /* Easing Functions */
  --edulite-easing-linear: linear;
  --edulite-easing-ease: ease;
  --edulite-easing-easeIn: ease-in;
  --edulite-easing-easeOut: ease-out;
  --edulite-easing-easeInOut: ease-in-out;
  --edulite-easing-spring: cubic-bezier(0.68, -0.55, 0.265, 1.55);

  /* ===== LAYOUT ===== */
  --edulite-layout-grid-columns-mobile: 4;
  --edulite-layout-grid-columns-tablet: 8;
  --edulite-layout-grid-columns-desktop: 12;
  --edulite-layout-grid-gap-mobile: 16px;
  --edulite-layout-grid-gap-tablet: 24px;
  --edulite-layout-grid-gap-desktop: 32px;
  --edulite-layout-grid-max-width: 1200px;
  --edulite-layout-grid-readable-max-width: 1024px;
  --edulite-layout-sections-base-padding-y-desktop: 96px;
  --edulite-layout-sections-base-padding-y-tablet: 64px;
  --edulite-layout-sections-base-padding-y-mobile: 48px;
  --edulite-layout-sections-base-header-margin-bottom-desktop: 64px;
  --edulite-layout-sections-base-header-margin-bottom-tablet: 48px;
  --edulite-layout-sections-base-header-margin-bottom-mobile: 32px;
  --edulite-layout-sections-base-title-margin-bottom: 24px;
  --edulite-layout-sections-hero-min-height: 600px;
  --edulite-layout-sections-hero-padding: 64px 0;
  --edulite-layout-sections-hero-background: gradient or solid color;
  --edulite-layout-sections-hero-content-alignment: center or left;
  --edulite-layout-sections-features-padding: 64px 0;
  --edulite-layout-sections-features-card-grid: 3 columns on desktop, 1 on mobile;
  --edulite-layout-sections-features-gap: 32px;
  --edulite-layout-sections-cta-padding: 48px 0;
  --edulite-layout-sections-cta-background: gradient or colored;
  --edulite-layout-sections-cta-border-radius: 24px;
  --edulite-layout-sections-cta-text-align: center;
}

/* Dark Theme */
[data-theme="dark"] {
  --edulite-color-primary: #B4A9FF;
  --edulite-color-on-primary: #2B2D42;
  --edulite-color-primary-container: #6B5BD6;
  --edulite-color-on-primary-container: #FFFFFF;
  --edulite-color-secondary: #FFB5A7;
  --edulite-color-on-secondary: #2B2D42;
  --edulite-color-secondary-container: #FF8FA3;
  --edulite-color-on-secondary-container: #FFFFFF;
  --edulite-color-tertiary: #95E1D3;
  --edulite-color-on-tertiary: #2B2D42;
  --edulite-color-tertiary-container: #4ECDC4;
  --edulite-color-on-tertiary-container: #FFFFFF;
  --edulite-color-info: #7dc2ff;
  --edulite-color-on-info: #2B2D42;
  --edulite-color-info-container: #0091e7;
  --edulite-color-on-info-container: #FFFFFF;
  --edulite-color-success: #55dc94;
  --edulite-color-on-success: #2B2D42;
  --edulite-color-success-container: #00a261;
  --edulite-color-on-success-container: #FFFFFF;
  --edulite-color-warning: #f1ba48;
  --edulite-color-on-warning: #2B2D42;
  --edulite-color-warning-container: #b58600;
  --edulite-color-on-warning-container: #FFFFFF;
  --edulite-color-background: #2B2D42;
  --edulite-color-on-background: #FAFAFA;
  --edulite-color-surface: #3D3F52;
  --edulite-color-on-surface: #FAFAFA;
  --edulite-color-surface-variant: #3D3F52;
}