@import"https://fonts.googleapis.com/css2?family=Cairo:wght@400;500;600;700;800&display=swap";:root{--color-primary: #C62828;--color-primary-dark: #8E0000;--color-primary-light: #FF6B6B;--color-gold: #B8860B;--color-gold-light: #F5D76E;--color-navy: #0D1B2A;--color-navy-mid: #1A2E42;--color-bg: #F7F8FA;--color-surface: #FFFFFF;--color-border: #E2E6EA;--color-border-light: #F0F2F4;--color-text-primary: #1A1A2E;--color-text-secondary:#5A6472;--color-text-hint: #9AA3AE;--color-text-inverse: #FFFFFF;--color-paid: #2E7D32;--color-paid-bg: #E8F5E9;--color-partial: #E65100;--color-partial-bg: #FFF3E0;--color-unpaid: #C62828;--color-unpaid-bg: #FFEBEE;--color-pending: #1565C0;--color-pending-bg: #E3F2FD;--color-approved: #2E7D32;--color-approved-bg: #E8F5E9;--color-rejected: #C62828;--color-rejected-bg: #FFEBEE;--color-alert-info: #1565C0;--color-alert-info-bg: #E3F2FD;--color-alert-warn: #E65100;--color-alert-warn-bg: #FFF3E0;--color-alert-urgent: #C62828;--color-alert-urgent-bg:#FFEBEE;--shadow-sm: 0 1px 3px rgba(0,0,0,.08);--shadow-md: 0 4px 12px rgba(0,0,0,.1);--shadow-lg: 0 8px 24px rgba(0,0,0,.14);--radius-sm: 6px;--radius-md: 12px;--radius-lg: 18px;--radius-full: 999px;--space-xs: 4px;--space-sm: 8px;--space-md: 16px;--space-lg: 24px;--space-xl: 32px;--space-2xl: 48px;--font-body: "Segoe UI", "Arial", sans-serif;--font-arabic: "Cairo", "Tajawal", "Arial", sans-serif;--text-xs: 11px;--text-sm: 13px;--text-base: 15px;--text-md: 17px;--text-lg: 20px;--text-xl: 24px;--text-2xl: 30px;--transition-fast: .15s ease;--transition-base: .25s ease;--transition-slow: .4s ease;--max-width: 480px;--nav-height: 64px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{direction:rtl;lang:ar;font-size:16px;-webkit-text-size-adjust:100%}body{font-family:var(--font-arabic);background-color:var(--color-bg);color:var(--color-text-primary);line-height:1.6;min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased}#root{min-height:100vh;display:flex;flex-direction:column}button,a,[role=button]{-webkit-tap-highlight-color:transparent;touch-action:manipulation}a{color:var(--color-primary);text-decoration:none}img{max-width:100%;height:auto;display:block}input,textarea,select{font-family:var(--font-arabic);font-size:var(--text-base);direction:rtl;text-align:right}::selection{background:#c6282826}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:var(--color-border-light)}::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:2px}.page-wrapper{max-width:var(--max-width);margin:0 auto;width:100%;min-height:100vh;background:var(--color-surface);position:relative;box-shadow:var(--shadow-lg)}.page-content{padding-bottom:calc(var(--nav-height) + 16px)}.page-header{background:var(--color-primary);color:var(--color-text-inverse);padding:var(--space-md) var(--space-md) var(--space-sm);position:sticky;top:0;z-index:100}.page-header h1{font-size:var(--text-lg);font-weight:700}.card{background:var(--color-surface);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:var(--space-md);border:1px solid var(--color-border-light)}.btn-primary{background:var(--color-primary);color:var(--color-text-inverse);border:none;border-radius:var(--radius-md);padding:12px var(--space-lg);font-family:var(--font-arabic);font-size:var(--text-base);font-weight:600;cursor:pointer;width:100%;transition:background var(--transition-fast),transform var(--transition-fast);display:flex;align-items:center;justify-content:center;gap:var(--space-sm)}.btn-primary:active{transform:scale(.98)}.btn-primary:disabled{background:var(--color-text-hint);cursor:not-allowed;transform:none}.btn-secondary{background:transparent;color:var(--color-primary);border:1.5px solid var(--color-primary);border-radius:var(--radius-md);padding:10px var(--space-lg);font-family:var(--font-arabic);font-size:var(--text-base);font-weight:600;cursor:pointer;width:100%;transition:all var(--transition-fast)}.btn-secondary:active{background:var(--color-unpaid-bg)}.section{padding:var(--space-md)}.divider{height:1px;background:var(--color-border-light);margin:var(--space-sm) 0}.text-hint{font-size:var(--text-sm);color:var(--color-text-hint)}.text-error{color:var(--color-rejected);font-size:var(--text-sm);margin-top:var(--space-xs)}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.fade-in{animation:fadeIn var(--transition-base) ease both}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
