@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500;600;700&display=swap');:root{--bg-deep:#070B14;--bg-main:#0B0F19;--bg-card:rgba(18, 24, 38, 0.7);--bg-card-hover:rgba(26, 35, 50, 0.9);--bg-elevated:rgba(30, 41, 59, 0.5);--bg-glass:rgba(255, 255, 255, 0.03);--border-glass:rgba(255, 255, 255, 0.08);--border-glass-hover:rgba(255, 255, 255, 0.15);--border-active:rgba(99, 102, 241, 0.5);--accent-primary:#6366F1;--accent-primary-dim:rgba(99, 102, 241, 0.15);--accent-secondary:#EC4899;--accent-success:#10B981;--accent-warning:#F59E0B;--accent-danger:#EF4444;--accent-info:#06B6D4;--gradient-primary:linear-gradient(135deg, #6366F1, #818CF8);--gradient-secondary:linear-gradient(135deg, #EC4899, #F472B6);--gradient-success:linear-gradient(135deg, #10B981, #34D399);--gradient-warning:linear-gradient(135deg, #F59E0B, #FBBF24);--gradient-danger:linear-gradient(135deg, #EF4444, #F87171);--gradient-hero:linear-gradient(135deg, rgba(99, 102, 241, 0.15), rgba(236, 72, 153, 0.1));--gradient-card-border:linear-gradient(90deg, transparent, rgba(255,255,255,0.12), transparent);--text-main:#F8FAFC;--text-secondary:#E2E8F0;--text-muted:#94A3B8;--text-dim:#64748B;--text-dark:#1E293B;--shadow-sm:0 2px 8px rgba(0, 0, 0, 0.3);--shadow-md:0 8px 24px rgba(0, 0, 0, 0.4);--shadow-lg:0 16px 48px rgba(0, 0, 0, 0.5);--shadow-glow-primary:0 0 20px rgba(99, 102, 241, 0.3);--shadow-glow-success:0 0 20px rgba(16, 185, 129, 0.3);--shadow-glow-danger:0 0 20px rgba(239, 68, 68, 0.3);--font-sans: 'Cairo', 'Tajawal', 'Inter', sans-serif;--font-mono:'JetBrains Mono', 'Fira Code', monospace;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:20px;--radius-2xl:24px;--radius-full:9999px;--transition-fast:0.15s cubic-bezier(0.4, 0, 0.2, 1);--transition-base:0.3s cubic-bezier(0.4, 0, 0.2, 1);--transition-slow:0.5s cubic-bezier(0.16, 1, 0.3, 1);--transition-bounce:0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);--z-dropdown:100;--z-sticky:200;--z-modal-backdrop:300;--z-modal:400;--z-toast:500;--z-tooltip:600;}[data-theme="light"]{--bg-deep:#F1F5F9;--bg-main:#F8FAFC;--bg-card:rgba(255, 255, 255, 0.8);--bg-card-hover:rgba(255, 255, 255, 0.95);--bg-elevated:rgba(226, 232, 240, 0.5);--bg-glass:rgba(0, 0, 0, 0.02);--border-glass:rgba(0, 0, 0, 0.08);--border-glass-hover:rgba(0, 0, 0, 0.15);--text-main:#0F172A;--text-secondary:#1E293B;--text-muted:#64748B;--text-dim:#94A3B8;--shadow-sm:0 2px 8px rgba(0, 0, 0, 0.08);--shadow-md:0 8px 24px rgba(0, 0, 0, 0.1);--shadow-lg:0 16px 48px rgba(0, 0, 0, 0.12);}*, *::before, *::after{margin:0;padding:0;box-sizing:border-box;}html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}body{font-family:var(--font-sans);background-color:var(--bg-main);background-image:radial-gradient(circle at 0% 0%, rgba(99, 102, 241, 0.08) 0%, transparent 50%), radial-gradient(circle at 100% 100%, rgba(236, 72, 153, 0.05) 0%, transparent 50%);background-attachment:fixed;color:var(--text-main);min-height:100vh;line-height:1.6;}@keyframes fadeSlideUp{0%{opacity:0;transform:translateY(20px);}100%{opacity:1;transform:translateY(0);}}@keyframes fadeSlideDown{0%{opacity:0;transform:translateY(-20px);}100%{opacity:1;transform:translateY(0);}}@keyframes fadeSlideLeft{0%{opacity:0;transform:translateX(calc(20px * var(--text-x-direction)));}100%{opacity:1;transform:translateX(0);}}@keyframes fadeSlideRight{0%{opacity:0;transform:translateX(calc(-20px * var(--text-x-direction)));}100%{opacity:1;transform:translateX(0);}}@keyframes scaleIn{0%{opacity:0;transform:scale(0.95);}100%{opacity:1;transform:scale(1);}}@keyframes pulseGlow{0%, 100%{box-shadow:0 0 10px rgba(99, 102, 241, 0.2);}50%{box-shadow:0 0 25px rgba(99, 102, 241, 0.5);}}@keyframes shimmer{0%{background-position:-200% 0;}100%{background-position:200% 0;}}@keyframes spin{to{transform:rotate(360deg);}}@keyframes ping{0%{transform:scale(1);opacity:1;}75%, 100%{transform:scale(2);opacity:0;}}@keyframes float{0%, 100%{transform:translateY(0);}50%{transform:translateY(-10px);}}@keyframes slideInRight{from{transform:translateX(calc(100% * var(--text-x-direction)));opacity:0;}to{transform:translateX(0);opacity:1;}}@keyframes slideOutRight{from{transform:translateX(0);opacity:1;}to{transform:translateX(calc(100% * var(--text-x-direction)));opacity:0;}}@keyframes progressBar{from{width:0%;}to{width:100%;}}@media (prefers-reduced-motion:reduce){*, *::before, *::after{animation-duration:0.01ms !important;animation-iteration-count:1 !important;transition-duration:0.01ms !important;}html{scroll-behavior:auto;}}.reveal{opacity:0;transform:translateY(30px);transition:opacity 0.6s ease, transform 0.6s ease;}.reveal.visible{opacity:1;transform:translateY(0);}.reveal-left{opacity:0;transform:translateX(calc(-30px * var(--text-x-direction)));transition:opacity 0.6s ease, transform 0.6s ease;}.reveal-left.visible{opacity:1;transform:translateX(0);}.reveal-right{opacity:0;transform:translateX(calc(30px * var(--text-x-direction)));transition:opacity 0.6s ease, transform 0.6s ease;}.reveal-right.visible{opacity:1;transform:translateX(0);}.glass-card{background:var(--bg-card);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border:1px solid var(--border-glass);border-radius:var(--radius-xl);padding:32px;box-shadow:var(--shadow-md);transition:all var(--transition-base);position:relative;overflow:hidden;}.glass-card:hover{border-color:var(--border-glass-hover);transform:translateY(-4px);background:var(--bg-card-hover);box-shadow:var(--shadow-lg);}.glass-card::before{content:"";position:absolute;top:0;inset-inline-start: 0;inset-inline-end: 0;height:1px;background:var(--gradient-card-border);opacity:0;transition:opacity var(--transition-base);}.glass-card:hover::before{opacity:1;}.glass-card .card-icon{width:48px;height:48px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;font-size:20px;margin-bottom:16px;}.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:12px 24px;border-radius:var(--radius-md);font-weight:600;font-size:15px;text-decoration:none;cursor:pointer;transition:all var(--transition-base);border:none;font-family:var(--font-sans);position:relative;overflow:hidden;white-space:nowrap;}.btn:active{transform:scale(0.97);}.btn-primary{background:var(--gradient-primary);color:#fff;box-shadow:0 4px 15px rgba(99, 102, 241, 0.4);}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(99, 102, 241, 0.6);}.btn-secondary{background:var(--gradient-secondary);color:#fff;box-shadow:0 4px 15px rgba(236, 72, 153, 0.4);}.btn-secondary:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(236, 72, 153, 0.6);}.btn-success{background:var(--gradient-success);color:#fff;box-shadow:0 4px 15px rgba(16, 185, 129, 0.4);}.btn-success:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(16, 185, 129, 0.6);}.btn-outline{background:transparent;color:var(--text-main);border:1px solid var(--border-glass);}.btn-outline:hover{border-color:var(--accent-primary);background:var(--accent-primary-dim);color:var(--accent-primary);}.btn-ghost{background:transparent;color:var(--text-muted);border:none;}.btn-ghost:hover{background:var(--bg-glass);color:var(--text-main);}.btn-sm{padding:8px 16px;font-size:13px;border-radius:var(--radius-sm);}.btn-lg{padding:16px 32px;font-size:17px;border-radius:var(--radius-lg);}.btn-icon{width:40px;height:40px;padding:0;border-radius:var(--radius-sm);}.btn:disabled{opacity:0.5;cursor:not-allowed;transform:none !important;}.spinner{width:20px;height:20px;border:2px solid var(--border-glass);border-top-color:var(--accent-primary);border-radius:50%;animation:spin 0.6s linear infinite;}.spinner-lg{width:40px;height:40px;border-width:3px;}.skeleton{background:linear-gradient( 90deg, var(--bg-glass) 25%, rgba(99, 102, 241, 0.05) 50%, var(--bg-glass) 75% );background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:var(--radius-sm);}.skeleton-text{height:14px;margin-bottom:8px;width:100%;}.skeleton-text:last-child{width:60%;}.skeleton-title{height:24px;width:40%;margin-bottom:16px;}.skeleton-card{height:200px;border-radius:var(--radius-xl);}.badge{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;border-radius:var(--radius-full);font-size:12px;font-weight:600;white-space:nowrap;}.badge-primary{background:var(--accent-primary-dim);color:var(--accent-primary);border:1px solid rgba(99, 102, 241, 0.3);}.badge-success{background:rgba(16, 185, 129, 0.1);color:var(--accent-success);border:1px solid rgba(16, 185, 129, 0.3);}.badge-warning{background:rgba(245, 158, 11, 0.1);color:var(--accent-warning);border:1px solid rgba(245, 158, 11, 0.3);}.badge-danger{background:rgba(239, 68, 68, 0.1);color:var(--accent-danger);border:1px solid rgba(239, 68, 68, 0.3);}.badge-info{background:rgba(6, 182, 212, 0.1);color:var(--accent-info);border:1px solid rgba(6, 182, 212, 0.3);}.toast-container{position:fixed;top:24px;inset-inline-end:24px;z-index:var(--z-toast);display:flex;flex-direction:column;gap:12px;pointer-events:none;}.toast{pointer-events:auto;display:flex;align-items:center;gap:12px;padding:16px 20px;background:var(--bg-card);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border:1px solid var(--border-glass);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);animation:slideInRight 0.3s ease;max-width:400px;min-width:300px;}.toast.removing{animation:slideOutRight 0.3s ease forwards;}.toast-icon{width:32px;height:32px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;}.toast-icon.success{background:rgba(16, 185, 129, 0.15);color:var(--accent-success);}.toast-icon.error{background:rgba(239, 68, 68, 0.15);color:var(--accent-danger);}.toast-icon.warning{background:rgba(245, 158, 11, 0.15);color:var(--accent-warning);}.toast-icon.info{background:rgba(6, 182, 212, 0.15);color:var(--accent-info);}.toast-content{flex:1;}.toast-title{font-size:14px;font-weight:600;color:var(--text-main);}.toast-message{font-size:12px;color:var(--text-muted);margin-top:2px;}.toast-close{width:24px;height:24px;border:none;background:none;color:var(--text-dim);cursor:pointer;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;font-size:14px;transition:all var(--transition-fast);flex-shrink:0;}.toast-close:hover{background:var(--bg-glass);color:var(--text-main);}.progress-bar{width:100%;height:8px;background:var(--bg-glass);border-radius:var(--radius-full);overflow:hidden;}.progress-bar-fill{height:100%;border-radius:var(--radius-full);transition:width var(--transition-slow);position:relative;}.progress-bar-fill::after{content:'';position:absolute;top:0;inset-inline-start: 0;inset-inline-end: 0;bottom:0;background:linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);animation:shimmer 2s infinite;}.progress-bar-fill.primary{background:var(--gradient-primary);}.progress-bar-fill.success{background:var(--gradient-success);}.progress-bar-fill.warning{background:var(--gradient-warning);}.progress-bar-fill.danger{background:var(--gradient-danger);}[data-tooltip]{position:relative;}[data-tooltip]::after{content:attr(data-tooltip);position:absolute;bottom:calc(100% + 8px);inset-inline-start: 0; inset-inline-end: 0; margin-inline: auto;transform:translateX(-50%) scale(0.9);background:var(--bg-card);color:var(--text-main);padding:6px 12px;border-radius:var(--radius-sm);font-size:12px;font-weight:500;white-space:nowrap;border:1px solid var(--border-glass);box-shadow:var(--shadow-md);opacity:0;pointer-events:none;transition:all var(--transition-fast);z-index:var(--z-tooltip);}[data-tooltip]:hover::after{opacity:1;transform:translateX(-50%) scale(1);}.modal-backdrop{position:fixed;inset:0;background:rgba(0, 0, 0, 0.6);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:var(--z-modal-backdrop);opacity:0;pointer-events:none;transition:opacity var(--transition-base);}.modal-backdrop.active{opacity:1;pointer-events:auto;}.modal{position:fixed;top:50%;inset-inline-start: 0; inset-inline-end: 0; margin-inline: auto;transform:translate(-50%, -50%) scale(0.95);background:var(--bg-card);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border:1px solid var(--border-glass);border-radius:var(--radius-xl);padding:32px;box-shadow:var(--shadow-lg);z-index:var(--z-modal);opacity:0;pointer-events:none;transition:all var(--transition-base);max-width:90vw;max-height:90vh;overflow-y:auto;width:500px;}.modal.active{opacity:1;pointer-events:auto;transform:translate(-50%, -50%) scale(1);}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;}.modal-title{font-size:20px;font-weight:700;}.modal-close{width:32px;height:32px;border:none;background:var(--bg-glass);color:var(--text-muted);border-radius:var(--radius-sm);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:16px;transition:all var(--transition-fast);}.modal-close:hover{background:var(--bg-elevated);color:var(--text-main);}.form-group{margin-bottom:20px;}.form-label{display:block;font-size:13px;font-weight:600;color:var(--text-muted);margin-bottom:8px;text-transform:uppercase;letter-spacing:0.5px;}.form-input{width:100%;padding:14px 18px;background:var(--bg-glass);border:1px solid var(--border-glass);border-radius:var(--radius-md);color:var(--text-main);font-size:15px;font-family:var(--font-sans);transition:all var(--transition-fast);outline:none;}.form-input:focus{border-color:var(--accent-primary);box-shadow:0 0 0 3px var(--accent-primary-dim);background:rgba(99, 102, 241, 0.05);}.form-input::placeholder{color:var(--text-dim);}.form-input.error{border-color:var(--accent-danger);box-shadow:0 0 0 3px rgba(239, 68, 68, 0.1);}.form-error{font-size:12px;color:var(--accent-danger);margin-top:6px;display:none;}.form-error.visible{display:block;}.form-hint{font-size:12px;color:var(--text-dim);margin-top:6px;}.toggle{position:relative;display:inline-flex;align-items:center;gap:12px;cursor:pointer;}.toggle input{position:absolute;opacity:0;width:0;height:0;}.toggle-track{width:44px;height:24px;background:var(--bg-elevated);border-radius:var(--radius-full);transition:all var(--transition-fast);position:relative;flex-shrink:0;}.toggle-track::after{content:'';position:absolute;top:3px;inset-inline-start:3px;width:18px;height:18px;background:var(--text-muted);border-radius:50%;transition:all var(--transition-fast);}.toggle input:checked + .toggle-track{background:var(--accent-primary);}.toggle input:checked + .toggle-track::after{transform:translateX(calc(20px * var(--text-x-direction)));background:#fff;}.toggle-label{font-size:14px;color:var(--text-muted);font-weight:500;}.dropdown{position:relative;display:inline-block;}.dropdown-menu{position:absolute;top:calc(100% + 8px);inset-inline-end: 0;min-width:200px;background:var(--bg-card);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border:1px solid var(--border-glass);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);padding:8px;opacity:0;pointer-events:none;transform:translateY(-8px);transition:all var(--transition-fast);z-index:var(--z-dropdown);}.dropdown.active .dropdown-menu{opacity:1;pointer-events:auto;transform:translateY(0);}.dropdown-item{display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:var(--radius-sm);color:var(--text-muted);font-size:14px;font-weight:500;cursor:pointer;transition:all var(--transition-fast);text-decoration:none;border:none;background:none;width:100%;text-align: start;font-family:var(--font-sans);}.dropdown-item:hover{background:var(--bg-glass);color:var(--text-main);}.dropdown-item.danger{color:var(--accent-danger);}.dropdown-item.danger:hover{background:rgba(239, 68, 68, 0.1);}.dropdown-divider{height:1px;background:var(--border-glass);margin:8px 0;}kbd{display:inline-flex;align-items:center;justify-content:center;padding:2px 8px;font-size:11px;font-weight:600;font-family:var(--font-mono);color:var(--text-muted);background:var(--bg-glass);border:1px solid var(--border-glass);border-radius:4px;min-width:24px;height:22px;}.empty-state{text-align:center;padding:60px 20px;}.empty-state-icon{font-size:48px;margin-bottom:16px;opacity:0.5;}.empty-state-title{font-size:20px;font-weight:700;margin-bottom:8px;}.empty-state-description{color:var(--text-muted);font-size:14px;margin-bottom:24px;max-width:400px;margin-inline-start:auto;margin-inline-end:auto;}.grid-4{display:grid;grid-template-columns:repeat(4, 1fr);gap:24px;}.grid-3{display:grid;grid-template-columns:repeat(3, 1fr);gap:24px;}.grid-2{display:grid;grid-template-columns:2fr 1fr;gap:24px;}.grid-auto{display:grid;grid-template-columns:repeat(auto-fill, minmax(280px, 1fr));gap:24px;}.stat-box{padding:24px;display:flex;flex-direction:column;gap:12px;}.stat-header{display:flex;justify-content:space-between;align-items:center;color:var(--text-muted);font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:0.5px;}.stat-value{font-size:42px;font-weight:800;color:var(--text-main);line-height:1;letter-spacing:-1px;}.stat-trend{font-size:13px;font-weight:600;display:flex;align-items:center;gap:4px;}.stat-trend.up{color:var(--accent-success);}.stat-trend.down{color:var(--accent-danger);}.stat-footer{font-size:13px;color:var(--text-muted);margin-top:8px;}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;flex-wrap:wrap;gap:12px;}.section-title{font-size:20px;font-weight:700;letter-spacing:-0.3px;}.section-subtitle{font-size:14px;color:var(--text-muted);margin-top:4px;}.table-container{overflow-x:auto;border-radius:var(--radius-xl);border:1px solid var(--border-glass);}table{width:100%;border-collapse:collapse;}th{text-align: start;padding:14px 20px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:0.5px;color:var(--text-muted);background:var(--bg-glass);border-bottom:1px solid var(--border-glass);}td{padding:14px 20px;font-size:14px;border-bottom:1px solid var(--border-glass);color:var(--text-secondary);}tr:last-child td{border-bottom:none;}tr:hover td{background:var(--bg-glass);}.tabs{display:flex;gap:4px;background:var(--bg-glass);padding:4px;border-radius:var(--radius-md);overflow-x:auto;}.tab{padding:10px 20px;border:none;background:none;color:var(--text-muted);font-size:14px;font-weight:500;cursor:pointer;border-radius:var(--radius-sm);transition:all var(--transition-fast);font-family:var(--font-sans);white-space:nowrap;}.tab:hover{color:var(--text-main);background:rgba(255,255,255,0.05);}.tab.active{background:var(--bg-card);color:var(--text-main);box-shadow:var(--shadow-sm);}@media (max-width:1200px){.grid-4{grid-template-columns:repeat(2, 1fr);}}@media (max-width:1024px){.grid-2{grid-template-columns:1fr;}.grid-3{grid-template-columns:repeat(2, 1fr);}}@media (max-width:768px){.grid-4, .grid-3{grid-template-columns:1fr;}.glass-card{padding:24px;}.stat-value{font-size:32px;}.section-header{flex-direction:column;align-items:flex-start;}.toast{min-width:auto;max-width:calc(100vw - 48px);}.toast-container{inset-inline-end:12px;inset-inline-start:12px;}.modal{padding:24px;width:calc(100vw - 32px);}}@media (max-width:480px){.glass-card{padding:20px;border-radius:var(--radius-lg);}.stat-value{font-size:28px;}.btn{padding:10px 18px;font-size:14px;}.tabs{overflow-x:auto;}}[dir="rtl"] *,:lang(ar) *,:lang(ar){letter-spacing:normal !important;}
:root {
  --text-x-direction: 1;
  --gradient-dir: to right;
}
[dir="rtl"] {
  --text-x-direction: -1;
  --gradient-dir: to left;
  --font-sans: 'Cairo', 'Tajawal', 'Inter', sans-serif;
  font-size: 16px;
  line-height: 1.8;
}
[dir="rtl"] h1, [dir="rtl"] h2, [dir="rtl"] h3, [dir="rtl"] h4, [dir="rtl"] h5, [dir="rtl"] h6 {
  line-height: 1.6;
}