/* ════════════════════════════════════════
   variables.css — متغيرات CSS العالمية
   ════════════════════════════════════════ */
:root {
    /* Brand Colors */
    --primary:       #0a2463;
    --primary-light: #1e3a8a;
    --primary-dark:  #061845;
    --accent:        #d4af37;
    --accent-dark:   #b8960c;

    /* Semantic Colors */
    --success:       #059669;
    --success-bg:    #d1fae5;
    --success-text:  #065f46;
    --danger:        #dc2626;
    --danger-bg:     #fee2e2;
    --danger-text:   #991b1b;
    --warning:       #d97706;
    --warning-bg:    #fef3c7;
    --warning-text:  #92400e;
    --info:          #0891b2;
    --info-bg:       #e0f2fe;
    --info-text:     #0c4a6e;
    --purple:        #7c3aed;

    /* Neutrals */
    --white:    #ffffff;
    --gray-50:  #f8fafc;
    --gray-100: #f1f5f9;
    --gray-200: #e2e8f0;
    --gray-300: #cbd5e1;
    --gray-400: #94a3b8;
    --gray-500: #64748b;
    --gray-600: #475569;
    --gray-700: #334155;
    --gray-800: #1e293b;
    --gray-900: #0f172a;

    /* Layout */
    --topbar-h:  64px;
    --sidebar-w: 240px;
    --radius-sm: 8px;
    --radius:    14px;
    --radius-lg: 20px;
    --radius-xl: 28px;

    /* Shadows */
    --shadow-sm: 0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.06);
    --shadow:    0 4px 16px rgba(10,36,99,.10);
    --shadow-lg: 0 8px 32px rgba(10,36,99,.16);
    --shadow-xl: 0 20px 60px rgba(0,0,0,.20);

    /* Transitions */
    --tr: all 0.25s ease;
}