:root{--olive: #1b5e43;--olive-deep: #0e3527;--olive-soft: #e7efe9;--saffron: #e0912f;--saffron-soft: #fbf0de;--rose: #b0455a;--rose-soft: #f7e6e9;--paper: #fbf7f0;--surface: #ffffff;--ink: #12241e;--ink-muted: #5a6b62;--ink-faint: #67756e;--hairline: #cdbfa6;--hairline-strong: #a68c62;--saffron-deep: #a26418;--display: "Tajawal", system-ui, sans-serif;--body: "IBM Plex Sans Arabic", system-ui, sans-serif;--r-sm: 6px;--r-md: 10px;--r-lg: 18px}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--paper);color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased}h1,h2,h3{font-family:var(--display);margin:0;line-height:1.3}h1{font-size:26px}h2{font-size:19px}h3{font-size:16px}.num,td.num,.money{font-variant-numeric:tabular-nums lining-nums;font-family:var(--display)}a{color:var(--olive)}.shell{display:grid;grid-template-columns:232px 1fr;min-height:100%}.sidebar{background:var(--olive-deep);color:#f4f8f5;padding:24px 16px;display:flex;flex-direction:column;gap:4px}.sidebar .brand{font-family:var(--display);font-size:18px;margin-bottom:20px;padding:0 10px}.sidebar .brand small{display:block;font-family:var(--body);font-size:12px;opacity:.6}.nav-link{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:10px 12px;border-radius:var(--r-md);color:#cfe0d6;text-decoration:none;font-size:14px}.nav-link:hover{background:#ffffff12}.nav-link.active{background:var(--olive);color:#fff}.nav-link .count{background:var(--saffron);color:#3a2405;border-radius:999px;padding:1px 8px;font-size:12px;font-family:var(--display)}.sidebar .spacer{flex:1}.main{padding:28px 32px 64px;overflow:auto}.page-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:20px}.page-head p{color:var(--ink-muted);margin:4px 0 0}.card{background:var(--surface);border:1px solid var(--hairline);border-radius:var(--r-lg);padding:20px}.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin-bottom:24px}.stat{background:var(--surface);border:1px solid var(--hairline);border-radius:var(--r-md);padding:16px 18px}.stat .label{font-size:13px;color:var(--ink-muted)}.stat .value{font-family:var(--display);font-size:25px;font-variant-numeric:tabular-nums;margin-top:2px}.stat.attention{border-color:var(--saffron);background:var(--saffron-soft)}.stat.alarm{border-color:var(--rose);background:var(--rose-soft)}table{width:100%;border-collapse:collapse;background:var(--surface);border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--hairline)}th,td{padding:12px 14px;text-align:right;border-bottom:1px solid var(--hairline);vertical-align:middle}th{font-size:12px;color:var(--ink-muted);font-weight:500;background:#fcfaf6}tbody tr:last-child td{border-bottom:none}tbody tr:hover{background:#fcfaf6}td.actions{display:flex;gap:6px;justify-content:flex-start}.muted{color:var(--ink-muted);font-size:13px}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;direction:ltr;display:inline-block}button{font-family:var(--body);font-size:14px;border-radius:var(--r-sm);border:1px solid transparent;padding:7px 14px;cursor:pointer;background:var(--olive);color:#fff}button:hover:not(:disabled){filter:brightness(1.08)}button:disabled{opacity:.45;cursor:not-allowed}button.ghost{background:transparent;border-color:var(--hairline);color:var(--ink)}button.danger{background:var(--rose)}button.link{background:none;border:none;color:var(--olive);text-decoration:underline;padding:0}input,select,textarea{font-family:var(--body);font-size:14px;padding:9px 12px;border:1px solid var(--hairline);border-radius:var(--r-sm);background:var(--surface);color:var(--ink);width:100%}label{display:block;font-size:13px;color:var(--ink-muted);margin-bottom:4px}.field{margin-bottom:12px}.row{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end}.row>*{flex:1;min-width:160px}.tag{display:inline-block;padding:2px 9px;border-radius:999px;font-size:12px;background:var(--olive-soft);color:var(--olive)}.tag.warn{background:var(--saffron-soft);color:var(--saffron-deep)}.tag.bad{background:var(--rose-soft);color:var(--rose)}.tag.off{background:#eee;color:var(--ink-faint)}.banner{border-radius:var(--r-md);padding:14px 16px;margin-bottom:18px}.banner.bad{background:var(--rose-soft);border:1px solid var(--rose)}.banner.info{background:var(--olive-soft);border:1px solid var(--olive)}.empty{text-align:center;padding:56px 20px;color:var(--ink-muted)}.empty h3{color:var(--ink);margin-bottom:6px}.login{display:grid;place-items:center;min-height:100%;padding:24px}.login .card{width:100%;max-width:380px}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0e35278c;display:grid;place-items:center;padding:24px;z-index:20}.modal{background:var(--surface);border-radius:var(--r-lg);padding:24px;width:100%;max-width:480px;max-height:86vh;overflow:auto}.modal img{width:100%;border-radius:var(--r-md);border:1px solid var(--hairline)}:focus-visible{outline:2px solid var(--olive);outline-offset:2px}.sidebar :focus-visible,.modal-backdrop :focus-visible{outline-color:var(--saffron)}.toolbar{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:16px}.tabs{display:flex;gap:4px;flex-wrap:wrap}.tab{background:transparent;border:1px solid var(--hairline);color:var(--ink-muted);padding:6px 14px;border-radius:999px;font-size:13px}.tab:hover:not(.active){background:#fcfaf6;filter:none}.tab.active{background:var(--olive);border-color:var(--olive);color:#fff}.search{display:flex;gap:6px;align-items:center}.search input{min-width:260px}.confirm-amount{font-size:34px;line-height:1.2;color:var(--olive);margin:14px 0 4px}.kv{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;margin:0;font-size:14px}.kv dt{color:var(--ink-muted);font-size:13px}.kv dd{margin:0}.modal .row>button{flex:0 0 auto;min-width:0}@media(max-width:860px){.shell{grid-template-columns:1fr}.sidebar{flex-direction:row;overflow-x:auto;padding:12px}.sidebar .brand,.sidebar .spacer{display:none}.main{padding:16px}.toolbar{align-items:stretch}.search{width:100%}.search input{min-width:0}table{display:block;overflow-x:auto;white-space:nowrap}}
