:root{--navy: #0b1f3a;--navy-2: #13305a;--navy-3: #1d4174;--gold: #d4a63a;--gold-soft: #f8efd9;--bg: #f4f6fa;--panel: #ffffff;--panel-2: #f7f9fc;--text: #16213a;--muted: #67728a;--border: #e1e6ef;--ok: #157347;--ok-soft: #e3f4ea;--danger: #b42318;--danger-soft: #fdecea;--warn: #9a6700;--warn-soft: #fff4d6;--radius: 10px;--shadow: 0 1px 2px rgba(11, 31, 58, .06), 0 2px 8px rgba(11, 31, 58, .05);font-family:Segoe UI,Noto Sans Arabic,Tahoma,Arial,sans-serif;font-size:14.5px;color:var(--text)}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);overflow-x:hidden}button,input,select,textarea{font:inherit;color:inherit}a{color:var(--navy-3)}.shell{display:flex;min-height:100%}.side{width:240px;flex-shrink:0;background:var(--navy);color:#c9d4e6;display:flex;flex-direction:column;position:sticky;top:0;height:100vh}.brand{display:flex;align-items:center;gap:10px;padding:18px 16px}.brand img{width:40px;height:40px}.brand b{color:#fff;font-size:17px;display:block}.brand span{font-size:12px;color:var(--gold)}.nav{flex:1;overflow-y:auto;padding:4px 10px}.nav-group{font-size:11.5px;opacity:.55;margin:14px 8px 6px}.nav a{display:flex;gap:10px;align-items:center;padding:9px 12px;border-radius:8px;color:inherit;text-decoration:none;margin-bottom:2px}.nav a:hover{background:#ffffff0f}.nav a.active{background:var(--navy-3);color:#fff;box-shadow:inset -3px 0 0 var(--gold)}.me{padding:14px 16px;border-top:1px solid rgba(255,255,255,.1);font-size:13px}.me b{color:#fff;display:block}.me .row{margin-top:8px}.side-btn{background:#ffffff14;border:0;color:#dbe3f0;padding:5px 10px;border-radius:6px;cursor:pointer;font-size:12.5px}.side-btn:hover{background:#ffffff29}.main{flex:1;min-width:0;display:flex;flex-direction:column}.top{display:flex;align-items:center;gap:12px;padding:14px 24px;background:var(--panel);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:5}.top h1{font-size:19px;margin:0;flex:1}.menu-btn{display:none;background:none;border:0;font-size:22px;cursor:pointer}.content{padding:20px 24px 48px}.btn{border:1px solid var(--border);background:var(--panel);padding:7px 14px;border-radius:8px;cursor:pointer;white-space:nowrap;display:inline-flex;align-items:center;gap:6px}.btn:hover{background:var(--panel-2)}.btn.primary{background:var(--navy);border-color:var(--navy);color:#fff}.btn.primary:hover{background:var(--navy-2)}.btn.gold{background:var(--gold);border-color:var(--gold);color:var(--navy);font-weight:600}.btn.danger{color:var(--danger);border-color:#f1c4bf}.btn.small{padding:3px 10px;font-size:13px}.btn:disabled{opacity:.55;cursor:default}.card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}.pad{padding:16px}.card h3{margin:0 0 12px;font-size:15.5px}.grid{display:grid;gap:16px}.kpis{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}.two{grid-template-columns:repeat(auto-fit,minmax(360px,1fr))}.kpi{padding:14px 16px}.kpi .l{color:var(--muted);font-size:12.5px}.kpi .v{font-size:23px;font-weight:700;margin-top:4px;direction:ltr;text-align:right}.kpi .s{color:var(--muted);font-size:12px}.muted{color:var(--muted)}.num{direction:ltr;unicode-bidi:plaintext;text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}.neg{color:var(--danger)}.pos{color:var(--ok)}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.spacer{flex:1}.mt{margin-top:16px}.empty{padding:36px;text-align:center;color:var(--muted)}.error-box{background:var(--danger-soft);color:var(--danger);padding:10px 14px;border-radius:8px}.note{background:var(--gold-soft);border:1px solid #ecd9a8;padding:10px 14px;border-radius:8px;font-size:13.5px}.tabs{display:flex;gap:4px;border-bottom:1px solid var(--border);margin-bottom:16px;overflow-x:auto}.tabs button{border:0;background:none;padding:10px 16px;cursor:pointer;color:var(--muted);border-bottom:2px solid transparent;white-space:nowrap}.tabs button.active{color:var(--navy);border-bottom-color:var(--gold);font-weight:600}input,select,textarea{border:1px solid var(--border);border-radius:8px;padding:8px 10px;background:#fff;width:100%;min-width:0}input:focus,select:focus,textarea:focus{outline:2px solid #c9d6ee;border-color:var(--navy-3)}input[type=number]{direction:ltr;text-align:right}input[type=checkbox]{width:17px;height:17px}.form{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}.field{display:flex;flex-direction:column;gap:5px}.field>span{font-size:12.5px;color:var(--muted)}.field.full{grid-column:1 / -1}.field.check{flex-direction:row;align-items:center;gap:8px}.chips{display:flex;flex-wrap:wrap;gap:6px}.chip{border:1px solid var(--border);border-radius:99px;padding:4px 12px;cursor:pointer;background:#fff;font-size:13px}.chip.on{background:var(--navy);color:#fff;border-color:var(--navy)}.table-wrap{overflow-x:auto;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}table{width:100%;border-collapse:collapse}th,td{padding:9px 12px;text-align:right;border-bottom:1px solid var(--border);white-space:nowrap}th{background:var(--panel-2);font-size:12.5px;color:#3b4660;font-weight:600}tbody tr.click{cursor:pointer}tbody tr:hover{background:#fafbfd}tfoot td{font-weight:700;background:var(--panel-2)}.badge{display:inline-block;padding:2px 10px;border-radius:99px;font-size:12px;font-weight:600}.badge.ok{background:var(--ok-soft);color:var(--ok)}.badge.off{background:#eef1f6;color:var(--muted)}.badge.warn{background:var(--warn-soft);color:var(--warn)}.badge.danger{background:var(--danger-soft);color:var(--danger)}.badge.gold{background:var(--gold-soft);color:#7a5a12}.modal-back{position:fixed;top:0;right:0;bottom:0;left:0;background:#0b1f3a73;display:grid;place-items:center;padding:16px;z-index:50}.modal{background:var(--panel);border-radius:12px;width:min(620px,100%);max-height:calc(100vh - 32px);display:flex;flex-direction:column}.modal-head{display:flex;align-items:center;padding:14px 18px;border-bottom:1px solid var(--border)}.modal-head h2{font-size:16px;margin:0;flex:1}.modal-body{padding:16px 18px;overflow-y:auto}.modal-foot{display:flex;gap:8px;padding:12px 18px;border-top:1px solid var(--border)}.x{background:none;border:0;font-size:18px;cursor:pointer;color:var(--muted)}.toasts{position:fixed;bottom:18px;left:18px;display:flex;flex-direction:column;gap:8px;z-index:100}.toast{background:var(--navy);color:#fff;padding:10px 16px;border-radius:8px;max-width:420px;box-shadow:var(--shadow)}.toast.error{background:var(--danger)}.auth{min-height:100%;display:grid;place-items:center;padding:20px;background:radial-gradient(circle at 30% 20%,#1d4174,var(--navy) 60%)}.auth-card{width:min(390px,100%);background:#fff;border-radius:16px;padding:30px 26px;display:flex;flex-direction:column;gap:12px;box-shadow:0 24px 60px #0000004d}.auth-card img{width:64px;height:64px;margin:0 auto}.auth-card h1{margin:0;text-align:center;font-size:22px;color:var(--navy)}.auth-card .sub{text-align:center;color:var(--muted);margin:-6px 0 6px;font-size:13.5px}.auth-card .btn{justify-content:center;padding:10px}.qr{display:block;margin:8px auto;width:190px;height:190px}.secret{direction:ltr;text-align:center;font-family:Consolas,monospace;background:var(--panel-2);padding:8px;border-radius:6px;word-break:break-all;font-size:13px}@media (max-width: 900px){.side{position:fixed;right:0;top:0;z-index:40;transform:translate(110%);transition:transform .2s}.side.open{transform:none;box-shadow:-10px 0 30px #0000004d}.me .row{flex-wrap:wrap}.menu-btn{display:block}.content{padding:14px}.top{padding:12px 14px}.two{grid-template-columns:1fr}}@media (max-width: 600px){.modal-back{padding:0;align-items:stretch}.modal{width:100%;max-height:100vh;height:100%;border-radius:0}.modal-head{padding-top:max(14px,env(safe-area-inset-top))}.modal-foot{padding-bottom:max(12px,env(safe-area-inset-bottom))}.btn{padding:9px 14px}.form{grid-template-columns:1fr}.kpi .v{font-size:20px}th,td{padding:8px 9px}}.only-mobile{display:none}.order-card{padding:12px 14px;cursor:pointer}.order-card:active{background:var(--panel-2)}@media (max-width: 700px){.only-mobile{display:grid}.only-desktop{display:none}}.btn.disabled{opacity:.55;pointer-events:none}
