/**
 * Design Tokens — منصة الرحلة التعليمية
 * Clean Architecture & System Tokens
 */

:root {
    /* Brand & Primary Palette */
    --primary-blue: #1E3A8A;   /* Deep royal blue */
    --primary-light: #2563EB;  /* Vibrant blue for active links & buttons */
    --primary-hover: #1D4ED8;
    --primary-indigo: #4F46E5;
    --primary-indigo-dark: #3730A3;

    /* Educational Phases Identity */
    --univ-primary: #1D4ED8;   /* الأزرق — المرحلة الجامعية */
    --univ-dark: #1E3A8A;
    --min-primary: #15803D;    /* الأخضر — المرحلة المدرسية والوزارية */
    --min-dark: #14532D;
    --pro-primary: #7C3AED;    /* البنفسجي — مزاولة واختبارات المهنة */
    --pro-dark: #5B21B6;

    /* Neutral & Background Surfaces */
    --bg-body: #F4F7F9;
    --color-white: #FFFFFF;
    --surface-primary: #FFFFFF;
    --surface-secondary: #F8FAFC;
    --surface-muted: #F1F5F9;
    --text-dark: #1F2937;
    --text-primary: #1F2937;
    --text-muted: #6B7280;
    --text-secondary: #9CA3AF;
    --border-color: #E5E7EB;
    --border-light: #F3F4F6;

    /* Pastel Icon Backgrounds */
    --pastel-green: #D1FAE5;
    --pastel-blue: #DBEAFE;
    --pastel-purple: #F3E8FF;
    --pastel-orange: #FFEDD5;
    --pastel-red: #FEE2E2;

    /* Icon Colors */
    --icon-green: #059669;
    --icon-blue: #2563EB;
    --icon-purple: #7C3AED;
    --icon-orange: #EA580C;
    --icon-red: #DC2626;

    /* Status Colors */
    --color-success: #10B981;
    --color-warning: #F59E0B;
    --color-danger: #EF4444;
    --color-info: #3B82F6;

    /* Elevations & Shadows */
    --shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    --shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
    --shadow-card: 0 4px 15px rgba(0, 0, 0, 0.03);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    --shadow-lg: 0 10px 25px -3px rgba(0, 0, 0, 0.08), 0 4px 6px -2px rgba(0, 0, 0, 0.05);

    /* Border Radii */
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 20px;
    --radius-xl: 28px;
    --radius-full: 9999px;

    /* Transitions */
    --transition-fast: 0.15s ease;
    --transition-base: 0.25s ease;
    --transition-smooth: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}