:root{
  --navy:#123456; --navy-d:#0b2440; --navy-l:#1d4d7c;
  --gold:#b8945a; --bg:#f4f6f9; --card:#fff; --line:#e2e8f0;
  --txt:#1a202c; --muted:#64748b;
  --green:#0f7b47; --green-bg:#e6f6ee; --red:#b3261e; --red-bg:#fdeceb;
  --amber:#9a6700; --amber-bg:#fff6e0; --blue:#1a56a0; --blue-bg:#e8f0fb;
  --purple:#6b3fa0; --purple-bg:#f1eafa; --gray:#4a5568; --gray-bg:#edf1f5;
  --radius:10px; --shadow:0 1px 3px rgba(16,32,56,.08),0 1px 2px rgba(16,32,56,.04);
}
*{box-sizing:border-box}
body{margin:0;font-family:"SF Arabic","Segoe UI",Tahoma,"Noto Naskh Arabic",Arial,sans-serif;
  background:var(--bg);color:var(--txt);direction:rtl;font-size:15px;line-height:1.6}
a{color:var(--navy-l);text-decoration:none}
a:hover{text-decoration:underline}

/* ── الشريط العلوي ── */
.topbar{background:var(--navy);color:#fff;padding:0 18px;display:flex;align-items:center;
  gap:8px;flex-wrap:wrap;box-shadow:0 2px 8px rgba(11,36,64,.18);position:sticky;top:0;z-index:50}
.topbar .brand{display:flex;align-items:center;gap:10px;padding:10px 0;margin-left:14px}
.topbar .brand img{height:34px;background:#fff;border-radius:6px;padding:3px}
.topbar .brand b{font-size:15px;font-weight:700;white-space:nowrap}
.topbar nav{display:flex;gap:2px;flex:1;flex-wrap:wrap}
.topbar nav a{color:#cfe0f0;padding:14px 13px;font-size:14.5px;font-weight:500;
  border-bottom:3px solid transparent;transition:.15s}
.topbar nav a:hover{color:#fff;background:rgba(255,255,255,.08);text-decoration:none}
.topbar nav a.on{color:#fff;border-bottom-color:var(--gold);background:rgba(255,255,255,.06)}
.topbar .me{display:flex;align-items:center;gap:10px;font-size:13.5px;color:#cfe0f0}
.topbar .me b{color:#fff}
.topbar .me a{color:#cfe0f0;font-size:13px}

.wrap{max-width:1240px;margin:0 auto;padding:20px 18px 60px}
h1{font-size:22px;margin:0 0 4px}
h2{font-size:17px;margin:0 0 12px}
h3{font-size:15px;margin:0 0 8px}
.sub{color:var(--muted);font-size:13.5px;margin:0 0 18px}
.head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;
  flex-wrap:wrap;margin-bottom:16px}

/* ── البطاقات ── */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:18px;margin-bottom:16px;box-shadow:var(--shadow)}
.card.tight{padding:14px}
.card h2{border-bottom:1px solid var(--line);padding-bottom:10px;margin-bottom:14px}
.grid{display:grid;gap:14px}
.g2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.g4{grid-template-columns:repeat(auto-fit,minmax(175px,1fr))}

.stat{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:16px;box-shadow:var(--shadow);border-top:3px solid var(--navy)}
.stat .n{font-size:26px;font-weight:700;color:var(--navy);line-height:1.2}
.stat .l{color:var(--muted);font-size:13px;margin-top:3px}
.stat.gold{border-top-color:var(--gold)} .stat.gold .n{color:var(--gold)}
.stat.green{border-top-color:var(--green)} .stat.green .n{color:var(--green)}

/* ── الجداول ── */
table{width:100%;border-collapse:collapse;font-size:14px}
th{background:#f7f9fb;text-align:right;padding:10px;font-weight:600;color:var(--navy);
  border-bottom:2px solid var(--line);white-space:nowrap;font-size:13.5px}
td{padding:9px 10px;border-bottom:1px solid #eef2f6;vertical-align:middle}
tbody tr:hover{background:#fafcfe}
.t-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.num{text-align:left;font-variant-numeric:tabular-nums;white-space:nowrap;direction:ltr}
.empty{text-align:center;color:var(--muted);padding:32px 12px;font-size:14px}

/* ── الأزرار ── */
.btn{display:inline-block;background:var(--navy);color:#fff;border:1px solid var(--navy);
  padding:8px 15px;border-radius:8px;cursor:pointer;font-size:14px;font-family:inherit;
  font-weight:500;transition:.15s;white-space:nowrap}
.btn:hover{background:var(--navy-d);text-decoration:none;color:#fff}
.btn.sec{background:#fff;color:var(--navy);border-color:#c9d6e3}
.btn.sec:hover{background:#f0f4f8;color:var(--navy)}
.btn.gold{background:var(--gold);border-color:var(--gold)}
.btn.gold:hover{background:#a37f47}
.btn.ok{background:var(--green);border-color:var(--green)}
.btn.danger{background:#fff;color:var(--red);border-color:#f0c4c1}
.btn.danger:hover{background:var(--red-bg);color:var(--red)}
.btn.sm{padding:5px 10px;font-size:13px;border-radius:6px}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btns{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

/* ── النماذج ── */
label{display:block;font-size:13px;color:var(--muted);margin-bottom:4px;font-weight:500}
input,select,textarea{width:100%;padding:8px 10px;border:1px solid #cbd5e1;border-radius:8px;
  font-family:inherit;font-size:14px;background:#fff;color:var(--txt)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--navy-l);
  box-shadow:0 0 0 3px rgba(29,77,124,.12)}
textarea{min-height:78px;resize:vertical;line-height:1.7}
.field{margin-bottom:13px}
.row{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
input[type=number]{direction:ltr;text-align:right}
.filters{display:flex;gap:8px;flex-wrap:wrap;align-items:end;margin-bottom:14px}
.filters .field{margin:0;min-width:150px}
.filters .grow{flex:1;min-width:220px}

/* ── الشارات ── */
.badge{display:inline-block;padding:3px 9px;border-radius:20px;font-size:12px;font-weight:600;
  white-space:nowrap}
.b-green{background:var(--green-bg);color:var(--green)}
.b-red{background:var(--red-bg);color:var(--red)}
.b-amber{background:var(--amber-bg);color:var(--amber)}
.b-blue{background:var(--blue-bg);color:var(--blue)}
.b-purple{background:var(--purple-bg);color:var(--purple)}
.b-gray{background:var(--gray-bg);color:var(--gray)}

/* ── التنبيهات ── */
.flash{padding:11px 15px;border-radius:8px;margin-bottom:14px;font-size:14px;
  border-right:4px solid;font-weight:500}
.flash.ok{background:var(--green-bg);color:var(--green);border-color:var(--green)}
.flash.error{background:var(--red-bg);color:var(--red);border-color:var(--red)}
.note{background:#f7f9fb;border-right:3px solid var(--gold);padding:11px 14px;
  border-radius:6px;font-size:13.5px;color:var(--muted);margin-bottom:14px}
.muted{color:var(--muted);font-size:13px}
.mini{font-size:12px;color:var(--muted)}

/* ── مربع البحث في الكتالوج ── */
.search-box{position:relative}
#results{position:absolute;top:100%;right:0;left:0;background:#fff;border:1px solid var(--line);
  border-radius:8px;max-height:320px;overflow-y:auto;z-index:40;box-shadow:0 8px 24px rgba(16,32,56,.16);
  display:none}
#results div{padding:9px 12px;cursor:pointer;border-bottom:1px solid #f1f5f9;font-size:13.5px}
#results div:hover{background:#f0f6fc}
#results .rn{font-weight:600;color:var(--txt)}
#results .rm{font-size:12px;color:var(--muted);margin-top:2px}

/* ── الطباعة ── */
.paper{background:#fff;max-width:820px;margin:20px auto;padding:0;box-shadow:0 4px 20px rgba(0,0,0,.1)}
@media print{
  .noprint{display:none!important}
  body{background:#fff;font-size:12px}
  .paper{box-shadow:none;margin:0;max-width:100%}
  .wrap{padding:0;max-width:100%}
  @page{size:A4;margin:12mm 10mm}
  table{page-break-inside:auto} tr{page-break-inside:avoid}
  thead{display:table-header-group}
}

@media(max-width:760px){
  .topbar{padding:0 12px} .topbar .brand b{display:none}
  .topbar nav a{padding:11px 9px;font-size:13.5px}
  .wrap{padding:14px 12px 50px}
  .card{padding:14px} table{font-size:13px} th,td{padding:7px 6px}
}