:root {
    --brand:#2563eb; --brand-2:#1e40af; --brand-soft:#eff6ff; --ink:#0f172a; --ink-2:#334155; --muted:#64748b;
    --line:#e2e8f0; --bg:#f4f6fa; --paper:#fff; --danger:#dc2626; --ok:#059669;
}
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--ink); font-family:'Cairo',sans-serif; }
.wrap { max-width:1500px; margin:0 auto; padding:26px 20px 60px; }
.num { font-family:'Segoe UI', Tahoma, sans-serif; font-variant-numeric:tabular-nums; }

/* الشريط العلوي */
.topnav { position:sticky; top:0; z-index:40; display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
    padding:12px 28px; background:rgba(255,255,255,.92); backdrop-filter:blur(8px); border-bottom:1px solid var(--line); }
.topnav .brand { display:flex; align-items:center; gap:10px; font-size:1.1rem; font-weight:900; color:var(--brand-2); }
.topnav .tabs { display:flex; gap:6px; padding:5px; background:#eef2f7; border-radius:14px; }
.topnav .tabs a { display:flex; align-items:center; gap:8px; padding:9px 20px; color:var(--ink-2); font-weight:800; font-size:.92rem; text-decoration:none; border-radius:10px; transition:.15s; }
.topnav .tabs a:hover { color:var(--brand); }
.topnav .tabs a.on { color:#fff; background:linear-gradient(135deg,var(--brand),var(--brand-2)); box-shadow:0 6px 16px -6px rgba(37,99,235,.6); }

.page-header { text-align:center; margin-bottom:22px; }
.page-title { display:inline-flex; align-items:center; gap:14px; margin:0; font-size:1.7rem; font-weight:900; }
.title-icon { display:inline-grid; place-items:center; width:50px; height:50px; color:#fff; font-size:1.2rem; background:linear-gradient(135deg,var(--brand),var(--brand-2)); border-radius:16px; box-shadow:0 8px 20px -6px rgba(37,99,235,.5); }
.page-sub { margin:8px 0 0; color:var(--muted); font-size:.9rem; font-weight:600; }

/* الكروت والفورم */
.card { background:var(--paper); border:1px solid var(--line); border-radius:20px; box-shadow:0 6px 24px -12px rgba(15,23,42,.14); }
.card-h { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:16px 24px; font-weight:900; border-bottom:1px solid var(--line); }
.card-h .tag { padding:4px 12px; color:var(--brand); font-size:.78rem; background:var(--brand-soft); border-radius:99px; }
.card-b { padding:22px 24px; }
.sec-t { display:flex; align-items:center; gap:8px; margin:0 0 12px; color:var(--muted); font-size:.82rem; font-weight:900; }
.sec-t::after { content:''; flex:1; height:1px; background:var(--line); }
.grid { display:grid; gap:16px; margin-bottom:22px; }
.g3 { grid-template-columns:repeat(3, minmax(0,1fr)); }
.g5 { grid-template-columns:repeat(5, minmax(0,1fr)); }
@media (max-width:1100px) { .g5 { grid-template-columns:repeat(3, minmax(0,1fr)); } }
@media (max-width:760px) { .g3, .g5 { grid-template-columns:1fr; } }
.fld { display:grid; gap:6px; }
.fld label { color:#475569; font-size:.84rem; font-weight:800; }
.fld label .req { color:var(--danger); }
.fld input, .fld select, .fld textarea, .f-col select, .f-col input {
    width:100%; height:44px; padding:0 14px; color:var(--ink); font:inherit; font-size:.93rem; font-weight:700;
    background:#fff; border:1.5px solid #cbd5e1; border-radius:12px; transition:border-color .15s, box-shadow .15s;
}
.fld textarea { height:70px; padding:10px 14px; resize:vertical; }
.fld input:focus, .fld select:focus, .fld textarea:focus, .f-col select:focus, .f-col input:focus { outline:0; border-color:var(--brand); box-shadow:0 0 0 4px var(--brand-soft); }
.fld input[readonly] { color:var(--ink-2); background:#f8fafc; border-style:dashed; cursor:default; }
.fld .hint { color:var(--muted); font-size:.74rem; font-weight:600; }
.fld.total input { color:#065f46; background:#ecfdf5; border:1.5px solid #6ee7b7; font-size:1.02rem; font-weight:900; }

/* اختيار هيئة / جهاز */
.seg { display:flex; gap:6px; height:44px; padding:4px; background:#eef2f7; border-radius:12px; }
.seg label { flex:1; display:grid; place-items:center; margin:0; color:var(--ink-2); font-size:.9rem; font-weight:800; border-radius:9px; cursor:pointer; transition:.15s; }
.seg input { display:none; }
.seg input:checked + span { color:#fff; }
.seg label:has(input:checked) { background:var(--brand); box-shadow:0 4px 12px -4px rgba(37,99,235,.6); }
.seg label:has(input:checked) span { color:#fff; }

.form-foot { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; padding-top:6px; }
.form-foot .note { color:var(--muted); font-size:.84rem; font-weight:700; }
.form-foot .note b { padding:3px 10px; color:#3b2316; background:#f8cbad; border-radius:99px; }
.btns { display:flex; gap:10px; }
.btn { display:inline-flex; align-items:center; gap:8px; height:42px; padding:0 22px; color:#fff; font:inherit; font-size:.9rem; font-weight:800; background:var(--brand); border:0; border-radius:12px; cursor:pointer; transition:.15s; }
.btn:hover:not(:disabled) { background:var(--brand-2); }
.btn:disabled { opacity:.45; cursor:not-allowed; }
.btn.ghost { color:var(--ink-2); background:#fff; border:1.5px solid var(--line); }
.btn.ghost:hover { color:var(--brand); border-color:var(--brand); background:#fff; }

/* فلاتر */
.filters { display:flex; flex-wrap:wrap; justify-content:center; gap:14px; max-width:1100px; margin:0 auto 22px; padding:18px 22px; background:var(--paper); border:1px solid var(--line); border-radius:18px; box-shadow:0 6px 24px -10px rgba(15,23,42,.1); }
.f-col { display:grid; flex:1 1 220px; gap:6px; text-align:center; }
.f-col label { color:#475569; font-size:.84rem; font-weight:800; }
.f-col select, .f-col input { height:42px; text-align:center; font-size:.9rem; }

/* جداول */
.tw { overflow-x:auto; }
table { width:100%; border-collapse:collapse; font-size:.86rem; }
th, td { padding:12px 10px; text-align:center; vertical-align:middle; border-bottom:1px solid #eef2f7; white-space:nowrap; }
thead th { color:#fff; font-size:.78rem; font-weight:800; background:var(--ink); }
tbody tr:hover td { background:#f8fbff; }
tbody tr.sel td { background:#eef4ff; }
.ex-no { color:var(--brand); font-weight:900; }
.type-b { display:inline-block; padding:3px 10px; font-size:.74rem; font-weight:800; border-radius:99px; }
.type-b.t1 { color:#1e40af; background:#dbeafe; }
.type-b.t2 { color:#9a3412; background:#ffedd5; }
.pill { display:inline-block; padding:4px 12px; color:var(--ink-s); font-size:.78rem; font-weight:800; background:var(--c); border-radius:99px; white-space:nowrap; }
.acts { display:flex; justify-content:center; gap:6px; }
.act { display:grid; place-items:center; width:34px; height:34px; color:var(--ink-2); background:#fff; border:1.5px solid var(--line); border-radius:9px; cursor:pointer; }
.act:hover:not(:disabled) { color:var(--brand); border-color:var(--brand); }
.act.del:hover { color:var(--danger); border-color:var(--danger); }
.act.next { color:#fff; background:var(--ok); border-color:var(--ok); }
.act:disabled { opacity:.35; cursor:not-allowed; }
.empty { padding:46px 20px; color:var(--muted); font-weight:700; text-align:center; white-space:normal; }
.money-pos { color:#047857; font-weight:800; }
.money-neg { color:var(--danger); font-weight:800; }

.msg { position:fixed; bottom:22px; left:50%; z-index:100; padding:12px 22px; color:#fff; font-weight:800; background:var(--ink); border-radius:12px; box-shadow:0 12px 30px rgba(0,0,0,.25); transform:translateX(-50%); }
.msg.err { background:var(--danger); }
.msg.ok { background:var(--ok); }

dialog { width:min(460px, calc(100% - 32px)); padding:0; border:0; border-radius:18px; box-shadow:0 30px 70px -20px rgba(0,0,0,.45); }
dialog::backdrop { background:rgba(15,23,42,.45); }
.dlg-h { display:flex; align-items:center; justify-content:space-between; padding:16px 20px; font-weight:900; border-bottom:1px solid var(--line); }
.dlg-b { max-height:60vh; padding:12px 20px 18px; overflow:auto; }
.dlg-f { display:flex; justify-content:center; gap:10px; padding:14px 20px; border-top:1px solid var(--line); }
.log-row { padding:10px 0; font-size:.86rem; font-weight:700; border-bottom:1px dashed var(--line); }
.log-row small { display:block; margin-top:3px; color:var(--muted); font-weight:600; }