:root{--bg:#f4f6f8;--card:#fff;--ink:#1c2733;--mut:#667685;--pri:#0f6b5c;--pri2:#0b5247;--bad:#b3261e;--ok:#1b7f3b;--line:#dde3e8}*{box-sizing:border-box}body{margin:0;font-family:Tajawal,Tahoma,sans-serif;background:var(--bg);color:var(--ink);direction:rtl}.layout{display:flex;min-height:100vh}.side{width:230px;background:#10312c;color:#fff;padding:16px 10px;flex-shrink:0}.side h2{font-size:17px;margin:4px 8px 16px}.side button{display:block;width:100%;text-align:right;background:none;border:0;color:#cfe3de;padding:10px 12px;border-radius:8px;font:inherit;cursor:pointer}.side button.on,.side button:hover{background:#1d5249;color:#fff}.main{flex:1;padding:20px;min-width:0}.top{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;gap:8px;flex-wrap:wrap}.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px;margin-bottom:16px}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}.kpi b{display:block;font-size:26px;color:var(--pri)}input,select,textarea{font:inherit;padding:8px 10px;border:1px solid var(--line);border-radius:8px;background:#fff;min-width:0}button.btn{font:inherit;background:var(--pri);color:#fff;border:0;border-radius:8px;padding:8px 14px;cursor:pointer}button.btn:hover{background:var(--pri2)}button.btn:disabled{opacity:.5;cursor:default}button.btn.sec{background:#e8eef0;color:var(--ink)}button.btn.bad{background:var(--bad)}.row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:10px}.tbl{width:100%;border-collapse:collapse;font-size:14px}.tbl th,.tbl td{padding:8px 10px;border-bottom:1px solid var(--line);text-align:right;white-space:nowrap}.tbl th{background:#f0f4f6;position:sticky;top:0}.wrap{overflow:auto;max-height:65vh}.msg{padding:10px 12px;border-radius:8px;margin:8px 0}.msg.err{background:#fde7e6;color:var(--bad)}.msg.ok{background:#e3f4e8;color:var(--ok)}.tag{display:inline-block;padding:2px 8px;border-radius:99px;font-size:12px;background:#e8eef0}.tag.g{background:#e3f4e8;color:var(--ok)}.tag.r{background:#fde7e6;color:var(--bad)}.login{max-width:360px;margin:12vh auto}.login input{width:100%;margin-bottom:10px}@media (max-width:760px){.layout{flex-direction:column}.side{width:100%;display:flex;gap:4px;overflow:auto}.side h2{display:none}.side button{width:auto;white-space:nowrap}}@media print{.side,.top,.row button,.row input,.row select,.row label{display:none!important}.main{padding:0}.card{border:0}.wrap{max-height:none;overflow:visible}}