@import"https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700&display=swap";:root{color-scheme:light;font-family:Cairo,system-ui,sans-serif;--color-bg: #f5f7fb;--color-surface: #ffffff;--color-muted: #eef2f7;--color-border: #e2e8f0;--color-text: #0f172a;--color-text-muted: #64748b;--color-primary: #2563eb;--color-primary-dark: #1d4ed8;--color-primary-soft: rgba(37, 99, 235, .12);--color-success: #16a34a;--color-warning: #d97706;--color-danger: #dc2626;--radius-lg: 18px;--radius-md: 12px;--radius-sm: 10px;--shadow-sm: 0 10px 25px rgba(15, 23, 42, .06);--shadow-md: 0 20px 45px rgba(15, 23, 42, .12);--space-xs: 6px;--space-sm: 12px;--space-md: 18px;--space-lg: 24px;--space-xl: 32px}*{box-sizing:border-box}body{margin:0;background:var(--color-bg);color:var(--color-text)}a{color:inherit;text-decoration:none}#app{min-height:100vh}.app-shell{display:grid;grid-template-columns:240px 1fr;min-height:100vh}.app-shell.login-shell{grid-template-columns:1fr;background:linear-gradient(135deg,#eff6ff,#f8fafc 55%,#f1f5f9)}.sidebar{background:linear-gradient(180deg,#0f172a,#111827);color:#e2e8f0;padding:20px var(--space-md);display:flex;flex-direction:column;gap:var(--space-lg)}.sidebar .logo{display:flex;align-items:center;gap:var(--space-sm);font-size:18px;font-weight:700}.logo-mark{width:40px;height:40px;border-radius:14px;display:grid;place-items:center;background:#94a3b833;font-size:18px}.logo-title{font-size:16px;font-weight:700}.sidebar .helper{color:#e2e8f0b3}.nav{display:flex;flex-direction:column;gap:var(--space-xs)}.nav-link{padding:8px 12px;border-radius:var(--radius-sm);transition:background .2s ease;display:flex;align-items:center;gap:var(--space-sm)}.nav-link:hover,.nav-link.is-active{background:#94a3b82e}.sidebar-card{margin-top:auto;padding:12px;border-radius:var(--radius-md);background:#0f172a99;border:1px solid rgba(148,163,184,.2);display:flex;flex-direction:column;gap:8px}.sidebar-meta{display:flex;flex-wrap:wrap;gap:8px}.main{display:flex;flex-direction:column}.topbar{background:var(--color-surface);padding:12px var(--space-lg);border-bottom:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);box-shadow:var(--shadow-sm);position:sticky;top:0;z-index:3}.content{padding:var(--space-lg);display:flex;flex-direction:column;gap:var(--space-lg)}.card{background:var(--color-surface);border-radius:var(--radius-lg);padding:20px;box-shadow:var(--shadow-sm)}.card.hero{background:linear-gradient(135deg,#eff6ff,#f8fafc 55%,#fff);border:1px solid rgba(148,163,184,.2)}.card.outline{border:1px solid var(--color-border);box-shadow:none}.card.muted{background:var(--color-muted)}.card.danger{border:1px solid rgba(220,38,38,.35);color:var(--color-danger);background:#fee2e273}.grid{display:grid;gap:var(--space-md)}.grid.cols-4{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.grid.cols-2{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}.section-header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-md);flex-wrap:wrap;margin-bottom:var(--space-md)}.section-actions{text-align:left}.badge{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;font-size:12px;background:#e2e8f0}.badge.success{background:#16a34a26;color:#166534}.badge.warning{background:#d9770626;color:#92400e}.badge.danger{background:#dc262626;color:#991b1b}.button{border:none;border-radius:var(--radius-sm);padding:10px 16px;font-weight:600;cursor:pointer;font-size:14px;transition:background .2s ease}.button:disabled{opacity:.7;cursor:not-allowed}.button.primary{background:var(--color-primary);color:#fff}.button.primary:hover{background:var(--color-primary-dark)}.button.secondary{background:var(--color-muted);color:var(--color-text)}.button.ghost{background:transparent;color:var(--color-primary);border:1px solid rgba(37,99,235,.2)}.button.danger{background:var(--color-danger);color:#fff}.button.block{width:100%}.table-wrapper{overflow-x:auto}.table{width:100%;border-collapse:collapse;min-width:780px}.table th,.table td{padding:12px 14px;border-bottom:1px solid var(--color-border);text-align:right}.table tbody tr:hover{background:#f8fafc}.table th{font-size:13px;text-transform:uppercase;letter-spacing:.3px;color:var(--color-text-muted)}.helper{color:var(--color-text-muted);font-size:13px}.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--space-md)}.field{display:flex;flex-direction:column;gap:8px}.field.full{grid-column:1 / -1}input,select{width:100%;padding:10px 12px;border-radius:var(--radius-sm);border:1px solid var(--color-border);font:inherit;background:#fff}input:focus,select:focus{outline:2px solid rgba(37,99,235,.2);border-color:var(--color-primary)}.action-buttons{display:flex;flex-direction:column;gap:8px}.reminders-list{display:flex;flex-direction:column;gap:12px}.reminder-item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-radius:14px;background:#f8fafc;border:1px solid #e2e8f0}.reminder-date{font-weight:600;color:var(--color-primary)}.stats-grid{display:grid;gap:var(--space-md);grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.stat-card{padding:var(--space-lg);border-radius:var(--radius-lg);background:var(--color-surface);border:1px solid rgba(148,163,184,.2);display:flex;flex-direction:column;gap:6px}.stat-value{font-size:28px;font-weight:700}.split-layout{display:grid;gap:var(--space-lg);grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr)}.info-grid{display:grid;gap:var(--space-md);grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.info-item{display:flex;flex-direction:column;gap:6px}.avatar{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;background:var(--color-primary-soft);color:var(--color-primary);font-weight:700;font-size:18px}.list-tile{padding:14px 16px;border-radius:14px;border:1px solid var(--color-border);background:#fff;display:flex;align-items:center;justify-content:space-between;gap:12px}.tile-stack{display:flex;flex-direction:column;gap:12px}.chips{display:flex;flex-wrap:wrap;gap:8px}.chip{padding:6px 12px;border-radius:999px;background:var(--color-muted);font-size:12px}.info-panel{background:#f8fafc;border-radius:var(--radius-lg);padding:var(--space-lg);border:1px dashed rgba(148,163,184,.5)}.header-actions{display:flex;gap:8px;flex-wrap:wrap}.table .link{color:var(--color-primary);font-weight:600}.login-card{max-width:520px}.login-layout{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:var(--space-xl)}.login-header{display:flex;align-items:center;gap:var(--space-md);margin-bottom:var(--space-lg)}.login-badge{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;background:#2563eb1f;font-size:28px}.password-field{position:relative;display:flex;align-items:center}.password-field input{padding-inline-end:90px}.toggle-password{position:absolute;inset-inline-end:8px;border:none;background:transparent;color:var(--color-primary);font-weight:600;cursor:pointer;padding:4px 8px}.toggle-password:focus-visible{outline:2px solid var(--color-primary);border-radius:8px}.error-text{color:var(--color-danger)}@media(min-width:1024px){.action-buttons{flex-direction:row}}@media(max-width:1024px){.app-shell{grid-template-columns:1fr}.topbar{padding:10px var(--space-md);flex-direction:column;align-items:flex-start}.content{padding:var(--space-md)}.split-layout{grid-template-columns:1fr}.sidebar{position:sticky;top:0;z-index:5;padding:var(--space-md)}}@media(max-width:768px){.section-header{flex-direction:column;align-items:flex-start}.header-actions,.header-actions .button{width:100%}.nav-link{justify-content:space-between}.table{min-width:640px}.stats-grid{grid-template-columns:1fr}}
