:root{--bg:#f1f1f1;--card:#fff;--line:#e3e3e3;--line2:#ebebeb;--text:#303030;--muted:#616161;--faint:#8a8a8a;--top:#1a1a1a;--side:#ebebeb;--pri:#303030;--pri-h:#1a1a1a;--accent:#005bd3;--ok-bg:#cdfee1;--ok:#0c5132;--warn-bg:#ffeb78;--warn:#4f4700;--bad-bg:#fedad9;--bad:#8e1f0b;--info-bg:#e0f0ff;--info:#00527c;--purple-bg:#f0e6ff;--purple:#5700d1;--mute-bg:#e3e3e3;--mute:#4a4a4a;--r:12px;--shadow:0 1px 0 rgba(26,26,26,.07),0 0 0 1px rgba(26,26,26,.07)}
*{box-sizing:border-box}
html,body{margin:0}
body{font-family:'IBM Plex Sans Arabic',system-ui,-apple-system,'Segoe UI',sans-serif;font-size:13.5px;color:var(--text);background:var(--bg);line-height:1.5}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3{margin:0;font-weight:650;color:#1a1a1a}
h1{font-size:20px}h2{font-size:14px}h3{font-size:13px}
.ltr{direction:ltr;unicode-bidi:embed;text-align:right}
.top{position:fixed;inset:0 0 auto 0;height:56px;background:var(--top);display:flex;align-items:center;gap:16px;padding:0 16px;z-index:50;color:#e3e3e3}
.top .brand{display:flex;align-items:center;gap:10px;color:#fff;font-weight:600;min-width:200px}
.top .brand .logo{width:30px;height:30px;border-radius:8px;background:linear-gradient(135deg,#a3365c,#e6bdc1);display:grid;place-items:center;font-weight:700;color:#fff;font-size:14px}
.top .search{flex:1;max-width:560px;margin:0 auto;position:relative}
.top .search input{width:100%;background:#303030;border:1px solid #4a4a4a;color:#fff;border-radius:10px;padding:8px 36px 8px 12px;font:inherit}
.top .search svg{position:absolute;right:11px;top:9px;opacity:.6}
.top .search .res{position:absolute;top:42px;inset-inline:0;background:#fff;color:var(--text);border-radius:12px;box-shadow:0 8px 30px rgba(0,0,0,.2);max-height:420px;overflow:auto;display:none}
.top .search .res a{display:flex;gap:10px;padding:9px 14px;color:var(--text);border-bottom:1px solid var(--line2)}
.top .search .res a:hover{background:#f7f7f7;text-decoration:none}
.top .search .res .grp{padding:8px 14px 4px;font-size:11px;color:var(--faint);font-weight:600}
.top .tools{display:flex;align-items:center;gap:8px}
.top .ic-btn{background:#303030;border:0;color:#e3e3e3;border-radius:8px;height:32px;min-width:32px;display:grid;place-items:center;cursor:pointer;position:relative;padding:0 8px}
.top .ic-btn .dot{position:absolute;top:4px;left:5px;background:#e51c00;color:#fff;font-size:10px;border-radius:9px;min-width:16px;height:16px;line-height:16px;text-align:center}
.top .user{display:flex;align-items:center;gap:8px;background:#303030;border-radius:8px;padding:4px 10px 4px 4px;color:#fff;cursor:pointer;position:relative}
.top .user .av{width:26px;height:26px;border-radius:7px;background:#36fba1;color:#0c5132;display:grid;place-items:center;font-weight:700}
.drop{position:absolute;top:40px;left:0;background:#fff;color:var(--text);border-radius:12px;box-shadow:0 8px 30px rgba(0,0,0,.2);min-width:240px;padding:6px;display:none;z-index:60}
.drop.open{display:block}
.drop a,.drop button{display:block;width:100%;text-align:right;padding:8px 10px;border-radius:8px;color:var(--text);background:none;border:0;font:inherit;cursor:pointer}
.drop a:hover,.drop button:hover{background:#f1f1f1;text-decoration:none}
.side{position:fixed;top:56px;bottom:0;right:0;width:240px;background:var(--side);padding:12px 8px;overflow:auto;z-index:40}
.side a{display:flex;align-items:center;gap:10px;padding:6px 10px;border-radius:8px;color:#303030;font-weight:550;margin-bottom:1px}
.side a:hover{background:#f7f7f7;text-decoration:none}
.side a.on{background:#fff;color:#1a1a1a;font-weight:650;box-shadow:var(--shadow)}
.side a svg{width:18px;height:18px;flex:none;color:#4a4a4a}
.side .sub{margin:2px 0 6px;padding-right:28px}
.side .sub a{font-weight:450;padding:4px 10px;color:#4a4a4a}
.side .sub a.on{background:transparent;box-shadow:none;font-weight:650;color:#1a1a1a}
.side .sep{height:1px;background:#d4d4d4;margin:10px 6px}
.side .label{font-size:11.5px;color:var(--faint);padding:6px 10px;font-weight:600}
.side .bottom{margin-top:16px}
.main{margin:56px 240px 0 0;padding:20px 24px 80px;min-height:calc(100vh - 56px)}
.wrap{max-width:1000px;margin:0 auto}
.wrap.wide{max-width:1300px}
.wrap.narrow{max-width:760px}
.ph{display:flex;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.ph h1{flex:1;display:flex;align-items:center;gap:10px}
.ph .back{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;color:#4a4a4a}
.ph .back:hover{background:#e3e3e3}
.ph .acts{display:flex;gap:8px;flex-wrap:wrap}
.card{background:var(--card);border-radius:var(--r);box-shadow:var(--shadow);margin-bottom:16px}
.card>.hd{padding:14px 16px 0;display:flex;align-items:center;gap:8px}
.card>.hd h2{flex:1}
.card>.bd{padding:14px 16px}
.card>.bd+.bd{border-top:1px solid var(--line2)}
.card>.ft{padding:12px 16px;border-top:1px solid var(--line2);display:flex;gap:8px;justify-content:flex-end}
.card.flush>.bd{padding:0}
.grid{display:grid;gap:16px}
.g2{grid-template-columns:1fr 1fr}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:16px;align-items:start}
.muted{color:var(--muted)}.faint{color:var(--faint)}.small{font-size:12px}.bold{font-weight:650}
.right{text-align:left}.center{text-align:center}
.row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.row.between{justify-content:space-between}
.stack>*+*{margin-top:12px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:32px;padding:0 12px;border-radius:8px;border:0;background:#fff;color:#303030;font:inherit;font-weight:600;cursor:pointer;box-shadow:inset 0 -1px 0 #b5b5b5,0 0 0 1px #e3e3e3;white-space:nowrap;text-decoration:none!important}
.btn:hover{background:#f7f7f7}
.btn.pri{background:var(--pri);color:#fff;box-shadow:inset 0 -1px 0 #000,0 1px 0 rgba(0,0,0,.2)}
.btn.pri:hover{background:var(--pri-h)}
.btn.danger{background:#c70a24;color:#fff;box-shadow:none}
.btn.plain{background:none;box-shadow:none;color:var(--accent);padding:0 6px}
.btn.sm{height:26px;padding:0 9px;font-size:12px}
.btn[disabled]{opacity:.5;pointer-events:none}
.badge{display:inline-flex;align-items:center;gap:4px;border-radius:8px;padding:1px 8px;font-size:12px;font-weight:550;background:var(--mute-bg);color:var(--mute);white-space:nowrap}
.badge::before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.7}
.badge.nodot::before{display:none}
.b-ok{background:var(--ok-bg);color:var(--ok)}.b-warn{background:var(--warn-bg);color:var(--warn)}.b-bad{background:var(--bad-bg);color:var(--bad)}.b-info{background:var(--info-bg);color:var(--info)}.b-purple{background:var(--purple-bg);color:var(--purple)}.b-mute{background:var(--mute-bg);color:var(--mute)}
table.t{width:100%;border-collapse:collapse}
table.t th{font-size:12px;color:var(--muted);font-weight:600;text-align:right;padding:8px 12px;background:#f7f7f7;border-bottom:1px solid var(--line);white-space:nowrap}
table.t td{padding:9px 12px;border-bottom:1px solid var(--line2);vertical-align:middle}
table.t tr:last-child td{border-bottom:0}
table.t tbody tr:hover{background:#f7f7f7}
table.t tr.click{cursor:pointer}
table.t .chk{width:36px}
table.t td.num,table.t th.num{text-align:left;direction:ltr}
.thumb{width:40px;height:40px;border-radius:8px;object-fit:cover;background:#f1f1f1;border:1px solid var(--line2);display:block}
.thumb.lg{width:64px;height:64px}
.tabs{display:flex;gap:2px;padding:8px 8px 0;border-bottom:1px solid var(--line2);overflow:auto}
.tabs a{padding:6px 12px;border-radius:8px 8px 0 0;color:var(--muted);font-weight:550;white-space:nowrap}
.tabs a.on{color:#1a1a1a;background:#f1f1f1}
.tabs a:hover{text-decoration:none;color:#1a1a1a}
.filters{display:flex;gap:8px;padding:10px 12px;border-bottom:1px solid var(--line2);flex-wrap:wrap;align-items:center}
.filters input[type=search],.filters input[type=text]{flex:1;min-width:180px}
.bulk{display:none;gap:8px;padding:8px 12px;background:#f7f7f7;border-bottom:1px solid var(--line2);align-items:center}
.bulk.on{display:flex}
label.f{display:block;margin-bottom:12px}
label.f>span{display:block;margin-bottom:4px;font-weight:550}
label.f>small,.help{display:block;color:var(--muted);font-size:12px;margin-top:4px}
input[type=text],input[type=email],input[type=password],input[type=number],input[type=url],input[type=search],input[type=tel],input[type=datetime-local],input[type=date],select,textarea{width:100%;font:inherit;color:inherit;background:#fdfdfd;border:1px solid #8a8a8a;border-radius:8px;padding:6px 10px;min-height:32px}
input:focus,select:focus,textarea:focus{outline:2px solid #005bd3;outline-offset:1px;border-color:transparent}
textarea{min-height:90px;resize:vertical}
select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23616161'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:left 10px center;padding-left:26px}
input[type=color]{width:40px;height:32px;padding:2px;border:1px solid #8a8a8a;border-radius:8px;background:#fff}
input[type=checkbox],input[type=radio]{width:16px;height:16px;accent-color:#303030;vertical-align:middle}
.check{display:flex;align-items:center;gap:8px;margin-bottom:8px;cursor:pointer}
.inp-g{display:flex;align-items:stretch}
.inp-g>span{display:flex;align-items:center;padding:0 10px;background:#f1f1f1;border:1px solid #8a8a8a;border-radius:0 8px 8px 0;border-left:0;color:var(--muted);white-space:nowrap}
.inp-g>input{border-radius:8px 0 0 8px}
.flash{padding:10px 14px;border-radius:10px;margin-bottom:14px;font-weight:550}
.flash.ok{background:var(--ok-bg);color:var(--ok)}.flash.err{background:var(--bad-bg);color:var(--bad)}.flash.info{background:var(--info-bg);color:var(--info)}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#1a1a1a;color:#fff;padding:10px 18px;border-radius:10px;z-index:200;font-weight:550;opacity:0;transition:.25s;pointer-events:none}
.toast.on{opacity:1}
.kpi{padding:14px 16px}
.kpi .l{color:var(--muted);font-weight:550;font-size:12.5px;border-bottom:1px dashed #c4c4c4;display:inline-block}
.kpi .v{font-size:22px;font-weight:700;margin-top:6px;direction:ltr;text-align:right}
.kpi .d{font-size:12px;margin-top:2px}
.up{color:#0c5132}.down{color:#8e1f0b}
.empty{text-align:center;padding:40px 20px;color:var(--muted)}
.empty svg{width:56px;height:56px;opacity:.35;margin-bottom:8px}
.empty h3{color:#303030;margin-bottom:4px;font-size:15px}
.pager{display:flex;justify-content:center;gap:6px;padding:12px}
.timeline{position:relative;padding-right:18px}
.timeline::before{content:'';position:absolute;right:5px;top:6px;bottom:6px;width:2px;background:#e3e3e3}
.timeline .ev{position:relative;padding:0 0 14px}
.timeline .ev::before{content:'';position:absolute;right:-17px;top:6px;width:10px;height:10px;border-radius:50%;background:#8a8a8a;border:2px solid #fff}
.timeline .ev .m{font-weight:500}
.timeline .ev .w{font-size:11.5px;color:var(--faint)}
.sumtbl{width:100%}.sumtbl td{padding:4px 0}.sumtbl td:last-child{text-align:left;direction:ltr}
.sumtbl tr.tot td{font-weight:700;border-top:1px solid var(--line);padding-top:8px}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{background:#e3e3e3;border-radius:8px;padding:2px 8px;font-size:12px;display:inline-flex;gap:4px;align-items:center}
.chip button{border:0;background:none;cursor:pointer;padding:0;color:#616161}
.modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:100;display:none;align-items:center;justify-content:center;padding:20px}
.modal-bg.on{display:flex}
.modal{background:#fff;border-radius:14px;width:100%;max-width:560px;max-height:90vh;overflow:auto;box-shadow:0 20px 50px rgba(0,0,0,.3)}
.modal .hd{padding:14px 16px;border-bottom:1px solid var(--line2);display:flex;align-items:center;font-weight:650}
.modal .hd h2{flex:1}
.modal .bd{padding:16px}
.modal .ft{padding:12px 16px;border-top:1px solid var(--line2);display:flex;justify-content:flex-end;gap:8px}
.x{border:0;background:none;font-size:20px;cursor:pointer;color:#616161;line-height:1}
.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px}
.media-grid .mi{position:relative;border:1px solid var(--line);border-radius:10px;overflow:hidden;aspect-ratio:1;background:#f7f7f7;cursor:grab}
.media-grid .mi img,.media-grid .mi video{width:100%;height:100%;object-fit:cover}
.media-grid .mi .del{position:absolute;top:4px;left:4px;background:rgba(255,255,255,.95);border:0;border-radius:6px;width:24px;height:24px;cursor:pointer;display:none}
.media-grid .mi:hover .del{display:block}
.media-grid .mi.first{grid-column:span 2;grid-row:span 2}
.drop-zone{border:2px dashed #c4c4c4;border-radius:10px;display:grid;place-items:center;text-align:center;color:var(--muted);padding:16px;cursor:pointer;aspect-ratio:1;min-height:110px}
.drop-zone.big{aspect-ratio:auto;padding:28px}
.drop-zone:hover,.drop-zone.over{border-color:#005bd3;color:#005bd3;background:#f4f9ff}
.chart{height:220px;position:relative}
.chart svg{width:100%;height:100%;overflow:visible}
.bar-list .it{display:flex;align-items:center;gap:10px;padding:6px 0}
.bar-list .it .bar{flex:1;height:8px;background:#f1f1f1;border-radius:4px;overflow:hidden}
.bar-list .it .bar i{display:block;height:100%;background:#303030;border-radius:4px}
.prog{height:6px;background:#e3e3e3;border-radius:3px;overflow:hidden}
.prog i{display:block;height:100%;background:#29845a}
.sortable .handle{cursor:grab;color:#8a8a8a;padding:0 4px}
.dragging{opacity:.4}
.code{font-family:ui-monospace,Menlo,monospace;font-size:12px;background:#f7f7f7;border-radius:6px;padding:2px 6px;direction:ltr;display:inline-block}
.alert-list a{display:flex;gap:10px;align-items:center;padding:10px 16px;border-top:1px solid var(--line2);color:var(--text)}
.alert-list a:hover{background:#f7f7f7;text-decoration:none}
.qa{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.qa a{display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:10px;background:#f7f7f7;color:#303030;font-weight:550}
.qa a:hover{background:#ebebeb;text-decoration:none}
.login-wrap{min-height:100vh;display:grid;place-items:center;background:#f1f1f1;padding:20px}
.login{width:100%;max-width:400px;background:#fff;border-radius:16px;box-shadow:var(--shadow);padding:28px}
.login h1{margin-bottom:4px}
.hamb{display:none}
@media (max-width:1000px){
  .layout,.g2,.g3{grid-template-columns:1fr}.g4{grid-template-columns:1fr 1fr}
}
@media (max-width:800px){
  .side{transform:translateX(100%);transition:.2s;box-shadow:-10px 0 30px rgba(0,0,0,.15)}
  .side.open{transform:none}
  .main{margin-right:0;padding:16px 12px 80px}
  .hamb{display:grid}
  .top .brand{min-width:0}.top .brand span{display:none}
  .top .user .nm{display:none}
  table.t .hide-m{display:none}
  .ph .acts{width:100%}
}
@media print{.top,.side,.no-print{display:none!important}.main{margin:0;padding:0}.card{box-shadow:none}}
/* ===== الوضع الإنجليزي (LTR) ===== */
[dir=ltr] .top .search svg{right:auto;left:11px}
[dir=ltr] .top .search input{padding:8px 12px 8px 36px}
[dir=ltr] .drop{left:auto;right:0}
[dir=ltr] .drop a,[dir=ltr] .drop button{text-align:left}
[dir=ltr] .side{right:auto;left:0}
[dir=ltr] .side .sub{padding-right:0;padding-left:28px}
[dir=ltr] .main{margin:56px 0 0 240px}
[dir=ltr] table.t th{text-align:left}
[dir=ltr] table.t td.num,[dir=ltr] table.t th.num{text-align:right}
[dir=ltr] .right{text-align:right}
[dir=ltr] .ltr{text-align:left}
[dir=ltr] select{background-position:right 10px center;padding-left:10px;padding-right:26px}
[dir=ltr] .inp-g>span{border-radius:8px 0 0 8px;border-left:1px solid #8a8a8a;border-right:0}
[dir=ltr] .inp-g>input{border-radius:0 8px 8px 0}
[dir=ltr] .timeline{padding-right:0;padding-left:18px}
[dir=ltr] .timeline::before{right:auto;left:5px}
[dir=ltr] .timeline .ev::before{right:auto;left:-17px}
[dir=ltr] .sumtbl td:last-child{text-align:right}
[dir=ltr] .kpi .v{text-align:left}
[dir=ltr] .media-grid .mi .del{left:auto;right:4px}
[dir=ltr] .ph .back svg{transform:scaleX(-1)}
[dir=ltr] label.f .help,[dir=ltr] .check+small{margin-left:24px;margin-right:0}
@media (max-width:800px){
  [dir=ltr] .side{transform:translateX(-100%);box-shadow:10px 0 30px rgba(0,0,0,.15)}
  [dir=ltr] .side.open{transform:none}
  [dir=ltr] .main{margin-left:0}
}