body{font-family:var(--fontFamily)}:root{--bg-primary: #0a0e1a;--bg-secondary: #111827;--bg-card: rgba(17, 24, 39, .8);--bg-card-hover: rgba(17, 24, 39, .95);--bg-input: rgba(30, 41, 59, .7);--bg-input-focus: rgba(30, 41, 59, .9);--border-subtle: rgba(99, 102, 241, .15);--border-focus: rgba(99, 102, 241, .5);--border-card: rgba(99, 102, 241, .1);--text-primary: #f1f5f9;--text-secondary: #94a3b8;--text-muted: #64748b;--text-accent: #818cf8;--accent-primary: #6366f1;--accent-primary-hover: #818cf8;--accent-gradient: linear-gradient(135deg, #6366f1, #8b5cf6, #a78bfa);--accent-glow: 0 0 20px rgba(99, 102, 241, .3);--success: #10b981;--success-bg: rgba(16, 185, 129, .1);--success-glow: 0 0 40px rgba(16, 185, 129, .3);--error: #ef4444;--error-bg: rgba(239, 68, 68, .1);--warning: #f59e0b;--font-latin: "Inter", system-ui, -apple-system, sans-serif;--font-arabic: "Noto Sans Arabic", "Inter", system-ui, sans-serif;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 24px;--transition-fast: .15s ease;--transition-base: .25s ease;--transition-slow: .4s ease;--shadow-sm: 0 1px 3px rgba(0, 0, 0, .3);--shadow-md: 0 4px 12px rgba(0, 0, 0, .3);--shadow-lg: 0 8px 32px rgba(0, 0, 0, .4);--shadow-card: 0 4px 24px rgba(0, 0, 0, .2), 0 0 0 1px var(--border-card)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;scroll-behavior:smooth;-webkit-text-size-adjust:100%}body{font-family:var(--font-latin);background:var(--bg-primary);color:var(--text-primary);line-height:1.6;min-height:100vh;overflow-x:hidden}[dir=rtl] body,[lang=ar] body{font-family:var(--font-arabic)}body:before{content:"";position:fixed;inset:0;background:radial-gradient(ellipse at 20% 0%,rgba(99,102,241,.08) 0%,transparent 50%),radial-gradient(ellipse at 80% 100%,rgba(139,92,246,.06) 0%,transparent 50%);pointer-events:none;z-index:0}.page-wrapper{position:relative;z-index:1;min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:2rem 1rem}.page-center{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:80vh;width:100%;max-width:480px}.page-wide{width:100%;max-width:1000px;margin-top:2rem}.lang-switcher{position:fixed;top:1.5rem;display:flex;gap:.5rem;z-index:100}[dir=ltr] .lang-switcher{right:1.5rem}[dir=rtl] .lang-switcher{left:1.5rem}.lang-btn{padding:.4rem .8rem;border-radius:var(--radius-sm);border:1px solid var(--border-subtle);background:var(--bg-card);color:var(--text-secondary);font-size:.8rem;cursor:pointer;transition:all var(--transition-fast);text-decoration:none;backdrop-filter:blur(10px)}.lang-btn:hover{border-color:var(--accent-primary);color:var(--text-primary);background:var(--bg-card-hover)}.lang-btn.active{border-color:var(--accent-primary);color:var(--accent-primary);background:#6366f11a}.card{background:var(--bg-card);border:1px solid var(--border-card);border-radius:var(--radius-lg);padding:2.5rem;backdrop-filter:blur(20px);box-shadow:var(--shadow-card);width:100%;transition:all var(--transition-base)}.card:hover{border-color:var(--border-subtle)}.card-header{text-align:center;margin-bottom:2rem}.card-header h1{font-size:1.8rem;font-weight:700;background:var(--accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.5rem}.card-header p{color:var(--text-secondary);font-size:.95rem}.app-logo{width:64px;height:64px;border-radius:var(--radius-md);background:var(--accent-gradient);display:flex;align-items:center;justify-content:center;margin:0 auto 1.5rem;font-size:1.8rem;box-shadow:var(--accent-glow)}.form-group{margin-bottom:1.25rem}.form-label{display:block;font-size:.875rem;font-weight:500;color:var(--text-secondary);margin-bottom:.5rem}.form-input,.form-textarea{width:100%;padding:.85rem 1rem;border-radius:var(--radius-md);border:1px solid var(--border-subtle);background:var(--bg-input);color:var(--text-primary);font-size:1rem;font-family:inherit;transition:all var(--transition-fast);outline:none}.form-input::placeholder,.form-textarea::placeholder{color:var(--text-muted)}.form-input:focus,.form-textarea:focus{border-color:var(--border-focus);background:var(--bg-input-focus);box-shadow:0 0 0 3px #6366f11a}.form-input.error{border-color:var(--error)}.form-input[readonly]{background:#6366f10d;color:var(--text-accent);cursor:default;font-weight:600}.form-textarea{min-height:80px;resize:vertical}.form-hint{font-size:.78rem;color:var(--text-muted);margin-top:.3rem}.form-error{font-size:.78rem;color:var(--error);margin-top:.3rem;display:none}.form-error.visible{display:block}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.85rem 1.5rem;border-radius:var(--radius-md);border:none;font-size:1rem;font-weight:600;font-family:inherit;cursor:pointer;transition:all var(--transition-fast);text-decoration:none;width:100%}.btn-primary{background:var(--accent-gradient);color:#fff;box-shadow:var(--accent-glow)}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 0 30px #6366f166}.btn-primary:active{transform:translateY(0)}.btn-success{background:linear-gradient(135deg,#10b981,#059669);color:#fff;box-shadow:0 0 20px #10b9814d}.btn-success:hover{transform:translateY(-1px);box-shadow:0 0 30px #10b98166}.btn-outline{background:transparent;color:var(--text-secondary);border:1px solid var(--border-subtle)}.btn-outline:hover{border-color:var(--accent-primary);color:var(--text-primary);background:#6366f10d}.btn-ghost{background:transparent;color:var(--text-accent);border:none;font-size:.9rem;width:auto;padding:.5rem 1rem}.btn-ghost:hover{color:var(--accent-primary-hover);background:#6366f10d}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important}.btn .spinner{width:18px;height:18px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .6s linear infinite}.success-container{text-align:center;padding:3rem 2rem}.checkmark-circle{width:120px;height:120px;border-radius:50%;background:var(--success-bg);display:flex;align-items:center;justify-content:center;margin:0 auto 2rem;box-shadow:var(--success-glow);animation:scaleIn .5s ease forwards}.checkmark-svg{width:60px;height:60px}.checkmark-path{stroke:var(--success);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;fill:none;stroke-dasharray:50;stroke-dashoffset:50;animation:drawCheck .6s .3s ease forwards}.success-title{font-size:2rem;font-weight:700;color:var(--success);margin-bottom:1rem}.success-message{color:var(--text-secondary);font-size:1.1rem;margin-bottom:2.5rem;line-height:1.7}.table-container{overflow-x:auto;border-radius:var(--radius-md);border:1px solid var(--border-card);margin-top:1.5rem}.data-table{width:100%;border-collapse:collapse;font-size:.9rem}.data-table thead{background:#6366f114}.data-table th{padding:.85rem 1rem;text-align:start;font-weight:600;color:var(--text-accent);font-size:.8rem;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap}.data-table td{padding:.75rem 1rem;border-top:1px solid var(--border-card);color:var(--text-primary)}.data-table tbody tr{transition:background var(--transition-fast)}.data-table tbody tr:hover{background:#6366f10a}.table-footer{background:#6366f10f}.table-footer td{font-weight:700;color:var(--text-accent)}.admin-toolbar{display:flex;gap:.75rem;flex-wrap:wrap;margin-bottom:1.5rem}.admin-toolbar .btn{width:auto;flex:0 0 auto}.alert{padding:.75rem 1rem;border-radius:var(--radius-sm);font-size:.9rem;margin-bottom:1rem;display:none}.alert.visible{display:block}.alert-error{background:var(--error-bg);color:var(--error);border:1px solid rgba(239,68,68,.2)}@keyframes spin{to{transform:rotate(360deg)}}@keyframes scaleIn{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}@keyframes drawCheck{to{stroke-dashoffset:0}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:fadeInUp .5s ease forwards}.animate-fade-in-delay{opacity:0;animation:fadeInUp .5s .2s ease forwards}.animate-fade-in-delay-2{opacity:0;animation:fadeInUp .5s .4s ease forwards}.footer-link{margin-top:1.5rem;text-align:center}.footer-link a{color:var(--text-muted);font-size:.85rem;text-decoration:none;transition:color var(--transition-fast)}.footer-link a:hover{color:var(--text-accent)}@media(max-width:640px){.card{padding:1.5rem;border-radius:var(--radius-md)}.card-header h1{font-size:1.5rem}.page-wrapper{padding:1rem .75rem}.admin-toolbar{flex-direction:column}.admin-toolbar .btn{width:100%}.data-table{font-size:.8rem}.data-table th,.data-table td{padding:.6rem .5rem}}
