:root {
    --dark-primary: #9333ea;
    --dark-secondary: #a855f7;
    --dark-accent: #ec4899;
    --dark-accent-2: #06b6d4;
    --dark-accent-3: #10b981;
    --dark-bg-primary: #0a0118;
    --dark-bg-secondary: #1a0b2e;
    --dark-bg-tertiary: #1a0b2e;
    --dark-bg-quaternary: #1a0b2e;
    --dark-text: #f8fafc;
    --dark-border: rgba(147, 51, 234, 0.2);
    --dark-shadow: rgba(147, 51, 234, 0.1);

    --light-primary: #f59e0b;
    --light-secondary: #fbbf24;
    --light-accent: #ef4444;
    --light-accent-2: #3b82f6;
    --light-accent-3: #10b981;
    --light-bg-primary: #fef3c7;
    --light-bg-secondary: #ffffff;
    --light-bg-tertiary: #f9fafb;
    --light-bg-quaternary: #f1f5f9;
    --light-text: #0f172a;
    --light-border: rgba(245, 158, 11, 0.2);
    --light-shadow: rgba(245, 158, 11, 0.1);
    
    --white: #ffffff;
    --black: #000000;
    --transparent: transparent;

    --primary-blue: #1e3a8a;
    --dark-blue: #1e40af;
    --accent-blue: #3b82f6;
    --primary-gold: #f59e0b;
    --dark-gold: #d97706;
    --accent-gold: #fbbf24;
    
    --text-dark: #1f2937;
    --text-light: #ffffff;
    --text-muted: #6b7280;
    --bg-light: #fef3c7;
    
    --border-radius-sm: 4px;
    --border-radius-md: 8px;
    --border-radius-lg: 12px;
    --border-radius-xl: 16px;
    
    --spacing-xs: 8px;
    --spacing-sm: 12px;
    --spacing-md: 16px;
    --spacing-lg: 24px;
    --spacing-xl: 32px;
    --spacing-2xl: 48px;
    
    --font-sm: 14px;
    --font-base: 16px;
    --font-lg: 18px;
    --font-xl: 20px;
    --font-2xl: 24px;
    --font-3xl: 30px;
    
    --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
    --shadow-gold: 0 4px 16px rgba(197, 157, 95, 0.3);
    
    --transition-normal: all 0.3s ease;
    
    --dark-500: #8b5cf6;
    --dark-600: #7c3aed;
    --dark-700: #6d28d9;
    --dark-800: #5b21b6;
    --dark-900: #4c1d95;
    --dark-400: #a78bfa;
    
    --accent-1-500: #ec4899;
    --accent-1-400: #e879f9;
    --accent-1-600: #db2777;
    --accent-1-700: #be185d;
    --accent-1-800: #9d174d;
    --accent-1-900: #831843;
    
    --warn-2-500: #f97316;
    --warn-2-600: #ea580c;
    --warn-300: #fcd34d;
    --warn-400: #facc15;
    --warn-500: #eab308;
    
    --error-500: #ef4444;
    --error-600: #dc2626;
    
    --info-500: #3b82f6;
    --info-600: #2563eb;
    
    --cyan-500: #06b6d4;
    
    --success-2-500: #10b981;
    --success-2-20: rgba(16, 185, 129, 0.2);
    
    --neutral-slate-200: #e2e8f0;
    --neutral-slate-300: #cbd5e1;
    --neutral-slate-400: #94a3b8;
    --neutral-slate-500: #64748b;
    --neutral-slate-600: #475569;
    --neutral-slate-700: #334155;
    --neutral-slate-800: #1e293b;
    --neutral-slate-900: #0f172a;
    
    --neutral-gray-100: #f3f4f6;
    --neutral-gray-200: #e5e7eb;
    --neutral-gray-300: #d1d5db;
    --neutral-gray-400: #9ca3af;
    --neutral-gray-500: #6b7280;
    --neutral-gray-600: #4b5563;
    --neutral-gray-700: #374151;
    --neutral-gray-800: #1f2937;
    --neutral-gray-900: #111827;
    
    --moon-base: #cbd5e1;
    --moon-shadow: #94a3b8;
    --red-sun: #ff4444;
    --urgent-red: #ef4444;
    --urgent-orange: #f97316;
    --urgent-dark-red: #dc2626;
    --urgent-dark-orange: #ea580c;
    
    --dark-bg-gradient-1: rgba(120, 119, 198, 0.2);
    --dark-bg-gradient-2: rgba(255, 119, 198, 0.15);
    --dark-bg-gradient-3: rgba(120, 219, 255, 0.1);
    --dark-bg-gradient-4: rgba(255, 152, 0, 0.1);
    --dark-bg-gradient-start: #0e0620;
    --dark-bg-gradient-mid-1: #1a0b2e;
    --dark-bg-gradient-mid-2: #1c0e34;
    --dark-bg-gradient-end: #120926;
    
    --white-02: rgba(255, 255, 255, 0.02);
    --white-03: rgba(255, 255, 255, 0.03);
    --white-04: rgba(255, 255, 255, 0.04);
    --white-05: rgba(255, 255, 255, 0.05);
    --white-06: rgba(255, 255, 255, 0.06);
    --white-08: rgba(255, 255, 255, 0.08);
    --white-10: rgba(255, 255, 255, 0.1);
    --white-12: rgba(255, 255, 255, 0.12);
    --white-15: rgba(255, 255, 255, 0.15);
    --white-18: rgba(255, 255, 255, 0.18);
    --white-20: rgba(255, 255, 255, 0.2);
    --white-25: rgba(255, 255, 255, 0.25);
    --white-30: rgba(255, 255, 255, 0.3);
    --white-40: rgba(255, 255, 255, 0.4);
    --white-50: rgba(255, 255, 255, 0.5);
    --white-70: rgba(255, 255, 255, 0.7);
    --white-80: rgba(255, 255, 255, 0.8);
    --white-90: rgba(255, 255, 255, 0.9);
    --white-95: rgba(255, 255, 255, 0.95);
    --white-96: rgba(255, 255, 255, 0.96);
    --white-97: rgba(255, 255, 255, 0.97);

    --black-02: rgba(0, 0, 0, 0.02);
    --black-03: rgba(0, 0, 0, 0.03);
    --black-04: rgba(0, 0, 0, 0.04);
    --black-05: rgba(0, 0, 0, 0.05);
    --black-06: rgba(0, 0, 0, 0.06);
    --black-08: rgba(0, 0, 0, 0.08);
    --black-10: rgba(0, 0, 0, 0.1);
    --black-12: rgba(0, 0, 0, 0.12);
    --black-15: rgba(0, 0, 0, 0.15);
    --black-20: rgba(0, 0, 0, 0.2);
    --black-25: rgba(0, 0, 0, 0.25);
    --black-30: rgba(0, 0, 0, 0.3);
    --black-40: rgba(0, 0, 0, 0.4);
    --black-50: rgba(0, 0, 0, 0.5);
    --black-70: rgba(0, 0, 0, 0.7);
    --black-80: rgba(0, 0, 0, 0.8);
    --black-90: rgba(0, 0, 0, 0.9);
    
    --success-primary: #22c55e;
    --success-secondary: #16a34a;
    --success-light: rgba(34, 197, 94, 0.1);
    --success-05: rgba(34, 197, 94, 0.05);
    --success-medium: rgba(34, 197, 94, 0.2);
    --success-border: rgba(34, 197, 94, 0.3);
    --success-hover: rgba(34, 197, 94, 0.2);
    --success-strong: rgba(34, 197, 94, 0.5);
    --success-shadow: rgba(34, 197, 94, 0.3);
    
    --error-primary: #ef4444;
    --error-secondary: #dc2626;
    --error-light: rgba(239, 68, 68, 0.1);
    --error-border: rgba(239, 68, 68, 0.3);
    --error-hover: rgba(239, 68, 68, 0.2);
    --error-shadow: rgba(239, 68, 68, 0.3);
    
    --warning-primary: #fbbf24;
    --warning-secondary: #f59e0b;
    --warning-light: rgba(251, 191, 36, 0.1);
    --warning-medium: rgba(251, 191, 36, 0.2);
    --warning-border: rgba(251, 191, 36, 0.3);
    --warning-hover: rgba(251, 191, 36, 0.5);
    --warning-strong: rgba(251, 191, 36, 0.4);
    --warning-shadow: rgba(251, 191, 36, 0.3);
    --warning-focus: rgba(251, 191, 36, 0.6);
    
    --info-primary: #3b82f6;
    --info-secondary: #2563eb;
    --info-light: rgba(59, 130, 246, 0.1);
    --info-medium: rgba(59, 130, 246, 0.15);
    --info-border: rgba(59, 130, 246, 0.3);
    --info-hover: rgba(59, 130, 246, 0.2);
    --info-strong: rgba(59, 130, 246, 0.4);
    --info-focus: rgba(59, 130, 246, 0.5);
    --info-shadow: rgba(59, 130, 246, 0.3);
    --info-secondary-10: rgba(37, 99, 235, 0.1);
    
    --neutral-light: #9ca3af;
    --neutral-medium: #6b7280;
    --neutral-dark: #374151;
    --neutral-bg-light: rgba(156, 163, 175, 0.1);
    --neutral-bg-medium: rgba(156, 163, 175, 0.2);
    --neutral-border: rgba(156, 163, 175, 0.3);
    --neutral-medium-bg: rgba(107, 114, 128, 0.1);
    --neutral-medium-border: rgba(107, 114, 128, 0.3);
    
    --brand-green: #10b981;
    --brand-blue: #3b82f6;
    --brand-yellow: #f59e0b;
    --brand-orange: #f97316;
    --brand-red: #ef4444;
    --brand-pink: #ec4899;
    --brand-purple: #8b5cf6;
    --brand-indigo: #6366f1;
    --brand-teal: #14b8a6;
    --brand-cyan: #06b6d4;
    
    --text-primary: #111827;
    --text-secondary: #6b7280;
    --text-tertiary: #9ca3af;
    --border-light: #e5e7eb;
    --border-medium: #d1d5db;
    --border-dark: #374151;
    --bg-primary: #ffffff;
    --bg-secondary: #f9fafb;
    --bg-tertiary: #f3f4f6;

    --dropdown-option-dark-bg: #1a1a2e;
    --dropdown-option-dark-text: #e0e0e0;
    --dropdown-option-dark-hover-bg: #2d2d44;
    --dropdown-option-dark-checked-bg: #3b82f6;
    
    --svg-arrow-dark: %23888;
    --svg-arrow-neutral: %23999;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}

::-webkit-scrollbar-track {
    background: var(--light-bg-secondary);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, var(--light-accent-2) 0%, var(--info-primary) 100%);
    border-radius: 10px;
    border: 2px solid var(--light-bg-secondary);
}

::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, var(--info-primary) 0%, var(--info-secondary) 100%);
}

body[dir="rtl"] ::-webkit-scrollbar {
    direction: ltr;
}

* {
    scrollbar-width: thin;
    scrollbar-color: var(--light-accent-2) var(--light-bg-secondary);
}