:root {
  --paper: #F4F6F5;
  --surface: #FFFFFF;
  --ink: #17302B;
  --ink-2: #4E625D;
  --ink-3: #7D8D89;
  --line: #D5DDDA;
  --line-2: #E6ECEA;
  --primary: #0E5A47;
  --primary-ink: #FFFFFF;
  --primary-soft: #E3EFEB;
  --met: #2F8F5B;
  --partial: #D9A02B;
  --not-met: #C2463D;
  --na: #A9B3B0;
  --warn-bg: #FBF3E1;
  --warn-ink: #7A5410;
  --danger-bg: #F8E6E4;
  --danger-ink: #8E2B23;
  --radius: 6px;
  --font: "IBM Plex Sans Arabic", "Noto Sans Arabic", "Segoe UI", Tahoma, sans-serif;
}

* { box-sizing: border-box; }
html, body { margin: 0; }
body { font-family: var(--font); font-size: 15px; line-height: 1.6; color: var(--ink); background: var(--paper);
       font-variant-numeric: tabular-nums; }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
h1, h2, h3 { margin: 0; font-weight: 600; line-height: 1.3; }
h1 { font-size: 1.5rem; } h2 { font-size: 1.15rem; } h3 { font-size: 1rem; }
p { margin: 0; }
.muted { color: var(--ink-2); }
.faint { color: var(--ink-3); font-size: .875rem; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* شريط علوي */
.topbar { display: flex; align-items: center; gap: 1.25rem; padding: .6rem 1.5rem; background: var(--primary);
          color: var(--primary-ink); flex-wrap: wrap; }
.topbar .brand { display: flex; flex-direction: column; line-height: 1.25; margin-inline-end: auto; }
.topbar .brand strong { font-weight: 600; }
.topbar .brand span { font-size: .8rem; opacity: .8; }
.topbar nav { display: flex; gap: .25rem; }
.topbar nav a { color: inherit; text-decoration: none; padding: .35rem .8rem; border-radius: var(--radius); opacity: .8; }
.topbar nav a[aria-current="page"] { background: rgba(255,255,255,.16); opacity: 1; }
.topbar select { background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.3); color: inherit;
                 border-radius: var(--radius); padding: .3rem .5rem; }
.topbar select option { color: var(--ink); }
.topbar .user { font-size: .85rem; display: flex; gap: .75rem; align-items: center; }
.topbar .user button { background: none; border: 0; color: inherit; text-decoration: underline; cursor: pointer; opacity: .85; }

main { max-width: 1320px; margin: 0 auto; padding: 1.5rem; }

/* أزرار وحقول */
.btn { text-decoration: none; display: inline-block; color: inherit; border: 1px solid var(--line); background: var(--surface); padding: .45rem .95rem; border-radius: var(--radius);
       cursor: pointer; white-space: nowrap; }
.btn:hover { border-color: var(--ink-3); }
.btn.primary { background: var(--primary); border-color: var(--primary); color: var(--primary-ink); }
.btn.danger { color: var(--danger-ink); border-color: #E3B8B3; }
.btn.small { padding: .2rem .6rem; font-size: .85rem; }
.btn:disabled { opacity: .5; cursor: not-allowed; }
.field { display: flex; flex-direction: column; gap: .3rem; }
.field label { font-size: .85rem; color: var(--ink-2); }
input[type=text], input[type=email], input[type=password], textarea, select.input {
  border: 1px solid var(--line); border-radius: var(--radius); padding: .5rem .65rem; background: var(--surface); width: 100%; }
textarea { min-height: 5.5rem; resize: vertical; }

/* محدد التقدير: المقياس الرباعي هو اللغة البصرية للمنصة */
.scale { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border: 1px solid var(--line);
         border-radius: var(--radius); overflow: hidden; }
.scale.three { grid-template-columns: repeat(3, 1fr); }
.scale button { border: 0; border-inline-start: 1px solid var(--line); background: var(--surface); padding: .55rem .4rem;
                cursor: pointer; display: flex; align-items: center; justify-content: center; gap: .4rem; }
.scale button:first-child { border-inline-start: 0; }
.scale button[aria-pressed="true"] { background: var(--sel, var(--primary)); color: #fff; }
.scale button:disabled { cursor: default; }
.scale button:disabled:not([aria-pressed="true"]) { color: var(--ink-3); }

.dot { width: .7rem; height: .7rem; border-radius: 2px; flex: none; display: inline-block; background: var(--c, var(--line)); }
.r-met { --c: var(--met); } .r-partial { --c: var(--partial); } .r-not_met { --c: var(--not-met); } .r-na { --c: var(--na); }
.r-none { --c: transparent; box-shadow: inset 0 0 0 1px var(--ink-3); }

.status { font-size: .8rem; padding: .05rem .5rem; border-radius: 3px; background: var(--line-2); color: var(--ink-2); white-space: nowrap; }
.status.s-returned { background: var(--warn-bg); color: var(--warn-ink); }
.status.s-final { background: var(--primary-soft); color: var(--primary); }
.status.s-submitted, .status.s-hod_approved, .status.s-under_audit, .status.s-audited { background: #E8EEF6; color: #2D4A72; }
.status.a-revision { background: var(--warn-bg); color: var(--warn-ink); }
.status.a-submitted, .status.a-completed { background: #E8EEF6; color: #2D4A72; }
.status.a-approved { background: #EEF3E6; color: #44602A; }
.status.a-verified { background: var(--primary-soft); color: var(--primary); }
.status.a-cancelled { text-decoration: line-through; }
input[type=range] { accent-color: var(--primary); flex: 1; }

/* تسجيل الدخول */
.login { max-width: 25rem; margin: 12vh auto; background: var(--surface); padding: 2rem; border-radius: 10px;
         border: 1px solid var(--line); display: flex; flex-direction: column; gap: 1rem; }
.notice { background: var(--warn-bg); color: var(--warn-ink); padding: .6rem .8rem; border-radius: var(--radius); font-size: .875rem; }
.error-box { background: var(--danger-bg); color: var(--danger-ink); padding: .6rem .8rem; border-radius: var(--radius); }

/* مساحة القسم */
.ws-head { display: flex; align-items: flex-end; gap: 1.5rem; flex-wrap: wrap; margin-bottom: 1rem; }
.ws-head .title { margin-inline-end: auto; display: flex; flex-direction: column; gap: .35rem; }
.progress-line { display: flex; gap: 1.5rem; font-size: .9rem; color: var(--ink-2); }
.progress-line b { color: var(--ink); font-weight: 600; font-size: 1.05rem; }
.filters { display: flex; gap: .35rem; flex-wrap: wrap; margin-bottom: .9rem; }
.filters button { border: 1px solid var(--line); background: var(--surface); border-radius: 999px; padding: .2rem .8rem;
                  cursor: pointer; font-size: .875rem; }
.filters button[aria-pressed="true"] { background: var(--ink); border-color: var(--ink); color: #fff; }

.ws { display: grid; grid-template-columns: minmax(300px, 400px) 1fr; gap: 1.25rem; align-items: start; }
.req-list { background: var(--surface); border: 1px solid var(--line); border-radius: 10px; max-height: calc(100vh - 230px);
            overflow-y: auto; position: sticky; top: 1rem; }
.req-group { padding: .5rem 1rem; background: var(--paper); font-size: .8rem; color: var(--ink-2); position: sticky; top: 0;
             border-bottom: 1px solid var(--line-2); z-index: 1; }
.req-item { display: grid; grid-template-columns: auto 1fr auto; gap: .2rem .7rem; padding: .7rem 1rem; border: 0;
            border-bottom: 1px solid var(--line-2); background: none; width: 100%; text-align: start; cursor: pointer; align-items: start; }
.req-item:hover { background: #FAFBFB; }
.req-item[aria-current="true"] { background: var(--primary-soft); box-shadow: inset -3px 0 0 var(--primary); }
.req-item .dot { margin-top: .45rem; }
.req-item .code { font-size: .8rem; color: var(--ink-3); }
.req-item .text { grid-column: 2 / 4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.req-item .meta { grid-column: 3; grid-row: 1; display: flex; gap: .4rem; align-items: center; }

.detail { background: var(--surface); border: 1px solid var(--line); border-radius: 10px; }
.detail section { padding: 1.25rem 1.5rem; border-bottom: 1px solid var(--line-2); display: flex; flex-direction: column; gap: .85rem; }
.detail section:last-child { border-bottom: 0; }
.detail .req-text { font-size: 1.12rem; font-weight: 500; max-width: 62ch; }
.crumbs { font-size: .85rem; color: var(--ink-3); }
.row { display: flex; gap: .6rem; align-items: center; flex-wrap: wrap; }
.row.end { justify-content: flex-end; }
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.empty { padding: 3rem 1.5rem; text-align: center; color: var(--ink-2); }

.ev-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.ev-list li { display: flex; gap: .75rem; align-items: center; padding: .55rem 0; border-bottom: 1px dashed var(--line-2); }
.ev-list li:last-child { border-bottom: 0; }
.ev-list .grow { flex: 1; min-width: 0; }
.ev-add { display: grid; grid-template-columns: 1fr auto; gap: .6rem; background: var(--paper); padding: .9rem; border-radius: var(--radius); }

.timeline { list-style: none; padding: 0; margin: 0; font-size: .875rem; }
.timeline li { padding: .3rem 0; display: flex; gap: .6rem; color: var(--ink-2); flex-wrap: wrap; }
.timeline li q { color: var(--ink); }
.readonly-val { display: flex; gap: .5rem; align-items: center; }

/* لوحة المؤشرات */
.dash-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.25rem; }
.figures { display: flex; gap: 2.5rem; flex-wrap: wrap; margin: .75rem 0 2rem; }
.figure { display: flex; flex-direction: column; }
.figure .num { font-size: 2.6rem; font-weight: 600; line-height: 1.1; letter-spacing: -.01em; }
.figure .num small { font-size: 1.1rem; font-weight: 500; color: var(--ink-2); }
.figure .lbl { font-size: .85rem; color: var(--ink-2); }
.figure.alert .num { color: var(--not-met); }

.panel { background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: 1.25rem 1.5rem; margin-bottom: 1.25rem; }
.panel > header { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.cols2 { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; }
.cols2 > .panel { margin-bottom: 0; }

/* خريطة الاستيفاء: كل خلية متطلب، وكل صف قسم */
.matrix-wrap { overflow-x: auto; }
.matrix { display: grid; gap: 3px; align-items: center; }
.matrix .rowlabel { font-size: .85rem; padding-inline-end: .75rem; white-space: nowrap; }
.matrix .stdlabel { font-size: .72rem; line-height: 1.3; font-weight: 600; color: var(--ink-2); border-top: 2px solid var(--ink-3); padding: .25rem .15rem 0; overflow: hidden; text-align: center; align-self: end; }
.gap-item { display: flex; flex-direction: column; gap: .15rem; min-width: 0; }
.gap-item a { line-height: 1.5; }
.gap-verdict { white-space: nowrap; }
.cell { width: 100%; aspect-ratio: 1; min-width: 14px; border: 0; border-radius: 2px; background: var(--c); cursor: pointer; padding: 0; }
.cell.r-none { background: repeating-linear-gradient(45deg, #fff 0 3px, #E3E8E6 3px 5px); box-shadow: inset 0 0 0 1px var(--line); }
.cell.gap-mark { box-shadow: inset 0 0 0 2px var(--ink); }
.cell:hover { outline: 2px solid var(--ink); outline-offset: 1px; }
.legend { display: flex; gap: 1rem; flex-wrap: wrap; font-size: .8rem; color: var(--ink-2); margin-top: .9rem; }
.legend span { display: inline-flex; align-items: center; gap: .35rem; }
.legend .cell { width: 12px; min-width: 12px; cursor: default; }
.legend .cell:hover { outline: 0; }

table.data { width: 100%; border-collapse: collapse; font-size: .9rem; }
table.data th { text-align: start; font-weight: 500; color: var(--ink-2); font-size: .8rem; padding: .4rem .6rem; border-bottom: 1px solid var(--line); }
table.data td { padding: .55rem .6rem; border-bottom: 1px solid var(--line-2); vertical-align: middle; }
table.data tr:last-child td { border-bottom: 0; }
.bar { position: relative; height: .7rem; background: var(--line-2); border-radius: 2px; min-width: 120px; }
.bar i { position: absolute; inset-block: 0; inset-inline-start: 0; background: var(--primary); border-radius: 2px; }
.bar b { position: absolute; inset-block: -3px; width: 2px; background: var(--partial); }
.heat { text-align: center; border-radius: 3px; font-size: .85rem; padding: .3rem .2rem; }

.rank { list-style: none; padding: 0; margin: 0; }
.rank li { display: grid; grid-template-columns: 1fr auto; gap: .2rem 1rem; padding: .5rem 0; border-bottom: 1px solid var(--line-2); }
.rank li:last-child { border-bottom: 0; }

/* إشعارات وحوار */
#toasts { position: fixed; inset-block-end: 1rem; inset-inline-start: 1rem; display: flex; flex-direction: column; gap: .5rem; z-index: 50; }
.toast { background: var(--ink); color: #fff; padding: .6rem 1rem; border-radius: var(--radius); max-width: 26rem; }
.toast.error { background: var(--danger-ink); }
dialog { border: 1px solid var(--line); border-radius: 10px; padding: 1.5rem; width: min(30rem, 92vw); }
dialog::backdrop { background: rgba(23, 48, 43, .35); }
dialog form { display: flex; flex-direction: column; gap: 1rem; }

.skeleton { color: var(--ink-3); padding: 2rem 0; }

/* المحاضر */
.min-group { border-bottom: 1px solid var(--line-2); }
.min-tpl { display: grid; grid-template-columns: auto auto 1fr; gap: .2rem .6rem; width: 100%; padding: .75rem 1rem; border: 0;
           background: none; text-align: start; cursor: pointer; align-items: center; }
.min-tpl:hover { background: #FAFBFB; }
.min-tpl[aria-expanded="true"] { background: var(--paper); }
.min-tpl .code { font-weight: 600; } .min-tpl .meta { justify-self: end; font-size: .8rem; }
.min-tpl .text { grid-column: 1 / -1; }
.min-items { background: var(--paper); }
.min-items .req-item { padding-inline-start: 1.6rem; }
.status.s-draft { background: var(--line-2); }
.axis { border: 1px solid var(--line-2); border-radius: var(--radius); padding: .8rem; margin-bottom: .8rem; display: flex; flex-direction: column; gap: .6rem; }
.axis-head { display: flex; gap: .6rem; align-items: center; }
.axis-head input { flex: 1; font-weight: 500; }
.axis-no { font-size: .8rem; color: var(--primary); white-space: nowrap; font-weight: 600; }
.rec-table td { padding: .35rem; vertical-align: top; }
.rec-table textarea, .rec-table input { min-height: 0; padding: .35rem .5rem; }
.rec-table textarea { min-height: 2.6rem; }
.fu-row { display: flex; flex-direction: column; gap: .5rem; padding: .7rem 0; border-top: 1px dashed var(--line-2); }
.fu-fields { display: grid; grid-template-columns: 10rem 1fr 1fr auto; gap: .5rem; align-items: start; }
.fu-fields textarea { min-height: 2.6rem; }
.fu-fields .faint { grid-column: 1 / -1; }
input[type=date].input { width: auto; }
input[type=text]:disabled, textarea:disabled, select:disabled { background: var(--paper); color: var(--ink); }

@media (max-width: 900px) {
  .fu-row, .fu-fields { grid-template-columns: 1fr; }
  .ws, .cols2, .grid2 { grid-template-columns: 1fr; }
  .req-list { position: static; max-height: 45vh; }
  main { padding: 1rem; }
  .figures { gap: 1.5rem; }
  .figure .num { font-size: 2rem; }
}
@media (prefers-reduced-motion: no-preference) {
  .toast { animation: rise .2s ease-out; }
  @keyframes rise { from { transform: translateY(6px); opacity: 0; } }
}

/* جاهزية المحضر والشواهد الداعمة */
.checks { list-style: none; margin: .3rem 0 .6rem; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr)); gap: .35rem; }
.checks li { display: flex; gap: .45rem; align-items: center; font-size: .875rem; padding: .3rem .6rem; border-radius: var(--radius);
             background: var(--danger-bg); color: var(--danger-ink); }
.checks li.ok { background: var(--primary-soft); color: var(--primary); }
.checks li.opt { background: var(--line-2); color: var(--ink-2); }
.linkish { background: none; border: 0; padding: 0; color: var(--primary); font-weight: 600; cursor: pointer; text-align: start; }
.linkish:hover { text-decoration: underline; }

/* الخطط والتقارير (النماذج الإلكترونية) */
.std-head { padding: .55rem 1rem .35rem; font-size: .8rem; color: var(--ink-2); background: var(--paper); border-top: 1px solid var(--line-2); font-weight: 600; }
.std-head:first-child { border-top: 0; }
.table-scroll { overflow-x: auto; margin-inline: -1.5rem; padding-inline: 1.5rem; }
table.form-table { font-size: .82rem; min-width: 100%; }
table.form-table th { white-space: normal; min-width: 4.5rem; vertical-align: bottom; }
table.form-table th.grp { text-align: center; background: var(--primary-soft); color: var(--primary); font-weight: 600; border-bottom: 0; }
table.form-table td { padding: .3rem .35rem; vertical-align: top; }
table.form-table td.num { text-align: center; white-space: nowrap; }
table.form-table .computed { background: #F3F7F6; color: var(--primary); font-weight: 600; }
table.form-table input, table.form-table select, table.form-table textarea { width: 100%; font-size: .82rem; padding: .3rem .4rem;
  border: 1px solid var(--line); border-radius: 4px; background: var(--surface); }
table.form-table textarea { resize: vertical; min-height: 2.2rem; }
td.w-text { min-width: 9rem; } td.w-longtext { min-width: 14rem; } td.w-number { min-width: 5rem; }
td.w-select { min-width: 7.5rem; } td.w-url { min-width: 11rem; }
.fu-done { color: var(--met); font-weight: 600; } .fu-partial { color: #9A6C12; font-weight: 600; } .fu-not { color: var(--not-met); font-weight: 600; }
select.fu-done { background: #EAF5EE; } select.fu-partial { background: var(--warn-bg); } select.fu-not { background: var(--danger-bg); }
.form-sum { flex-wrap: wrap; gap: .4rem 1.4rem; }
.grid3 { display: grid; grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr)); gap: .8rem; }
@media (max-width: 900px) { .table-scroll { margin-inline: -1rem; padding-inline: 1rem; } }
.ws > * { min-width: 0; }   /* الجداول العريضة تتمرر داخل إطارها لا الصفحة كلها */

/* ---------------- التقرير النهائي ---------------- */
.final-report { --g1: #0F5C4A; --g2: #148A6E; --gold: #C9A13B; --soft: #F3F8F6;
  display: flex; flex-direction: column; gap: 1.1rem; padding-bottom: 2rem; position: relative; }
.final-report::before { content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(1200px 500px at 100% -10%, #DCEFE8 0, transparent 60%),
              radial-gradient(900px 500px at -10% 110%, #EEF4E3 0, transparent 60%), #F6FAF8; }
.final-report .table-wrap { overflow-x: auto; }

/* الترويسة */
.hero { color: #fff; border-radius: 18px; padding: 1.6rem 1.8rem 1.3rem; position: relative; overflow: hidden;
  background: linear-gradient(135deg, var(--g1) 0%, var(--g2) 60%, #1FA382 100%);
  box-shadow: 0 18px 40px -18px rgba(15, 92, 74, .55); }
.hero::after { content: ""; position: absolute; inset: 0; opacity: .12; pointer-events: none;
  background-image: radial-gradient(circle at 1px 1px, #fff 1.2px, transparent 1.3px); background-size: 18px 18px;
  mask-image: linear-gradient(to left, #000, transparent 70%); }
.hero-top { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; align-items: flex-start; position: relative; z-index: 1; }
.hero h1 { margin: .15rem 0 .2rem; font-size: 2rem; letter-spacing: -.01em; }
.hero p { margin: 0; opacity: .85; }
.eyebrow { display: inline-block; font-size: .78rem; padding: .15rem .7rem; border-radius: 999px; background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.25); }
.report-controls { gap: .6rem; flex-wrap: wrap; align-items: center; }
.report-controls label { display: flex; gap: .4rem; align-items: center; font-size: .85rem; color: rgba(255,255,255,.9); }
.report-controls select { background: rgba(255,255,255,.95); color: var(--ink); border: 0; border-radius: 8px; padding: .35rem .6rem; }
.report-controls .btn { background: var(--gold); color: #1d1a10; border: 0; font-weight: 700; border-radius: 8px; }
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .7rem; margin-top: 1.3rem; position: relative; z-index: 1; }
.kpi { background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.2); border-radius: 12px; padding: .7rem .9rem;
  display: flex; flex-direction: column; backdrop-filter: blur(4px); }
.kpi b { font-size: 1.7rem; line-height: 1.2; }
.kpi span { font-size: .82rem; opacity: .85; }
.kpi.k-good b { color: #9BF0C8; } .kpi.k-mid b { color: #FFE08A; } .kpi.k-bad b { color: #FFB4AA; } .kpi.k-plan b { color: #fff; }
.kpi.t-good b { color: #9BF0C8; } .kpi.t-mid b { color: #FFE08A; } .kpi.t-bad b { color: #FFB4AA; }

/* عناوين الأقسام */
.sec-title { display: flex; align-items: center; gap: .75rem; margin-top: .6rem; }
.sec-title i { font-style: normal; width: 2.1rem; height: 2.1rem; border-radius: 10px; display: grid; place-items: center; font-weight: 700;
  color: #fff; background: linear-gradient(135deg, var(--g1), var(--g2)); box-shadow: 0 6px 14px -6px rgba(15,92,74,.6); }
.sec-title h2 { margin: 0; font-size: 1.2rem; }
.sec-title p { margin: 0; font-size: .82rem; color: var(--ink-2); }
.card { background: #fff; border-radius: 16px; padding: 1.2rem; border: 1px solid #E3EDE9;
  box-shadow: 0 10px 30px -20px rgba(23, 48, 43, .35); }
.card-h { margin: 0 0 .3rem; font-size: 1rem; }

/* عدادات المعايير الرئيسية */
.gauges { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: .9rem; }
.gcard { background: #fff; border-radius: 16px; padding: 1rem .8rem .9rem; display: flex; flex-direction: column; align-items: center; gap: .2rem;
  text-align: center; border: 1px solid #E3EDE9; border-top: 5px solid var(--na, #9aa); position: relative;
  box-shadow: 0 10px 30px -20px rgba(23, 48, 43, .4); transition: transform .2s, box-shadow .2s; }
.gcard:hover { transform: translateY(-3px); box-shadow: 0 18px 36px -20px rgba(23, 48, 43, .5); }
.gcard.t-good { border-top-color: var(--met); } .gcard.t-mid { border-top-color: var(--partial); } .gcard.t-bad { border-top-color: var(--not-met); }
.gcard h3 { margin: 0; font-size: .95rem; min-height: 2.5em; display: flex; align-items: center; }
.gcard strong { font-size: 1.9rem; line-height: 1; margin-top: -.3rem; }
.gcard.t-good strong { color: var(--met); } .gcard.t-mid strong { color: #B7811A; } .gcard.t-bad strong { color: var(--not-met); }
.gcard .tag { background: var(--soft); color: var(--g1); border-radius: 999px; padding: .1rem .8rem; font-size: .8rem; font-weight: 700; margin-top: .35rem; }
.gauge { width: 100%; max-width: 200px; }
.gauge .z-bad { stroke: var(--not-met); opacity: .18; } .gauge .z-mid { stroke: var(--partial); opacity: .22; }
.gauge .z-good { stroke: var(--met); opacity: .3; }
.gauge .z-val.t-good { stroke: var(--met); } .gauge .z-val.t-mid { stroke: var(--partial); } .gauge .z-val.t-bad { stroke: var(--not-met); }
.gauge .needle { stroke: var(--ink); stroke-width: 3.5; stroke-linecap: round; transform-box: view-box; transform-origin: 100px 100px; transform: rotate(var(--a)); }
.anim-item.play .gauge .needle { animation: needle-sweep 1.3s cubic-bezier(.3, 1.35, .5, 1) both; }
.anim-item.play .gauge .z-val { stroke-dasharray: 100 100; animation: arc-draw 1.2s ease-out both; }
.anim-item.play .ring .val { animation: ring-fill 1.2s ease-out both; }
.anim-item.play .ring { animation: ring-pop .5s ease-out; }
@keyframes needle-sweep { from { transform: rotate(0deg); } to { transform: rotate(var(--a)); } }
@keyframes arc-draw { from { stroke-dashoffset: 100; } to { stroke-dashoffset: 0; } }
@keyframes ring-fill { from { stroke-dasharray: 0 252; } }
@keyframes ring-pop { 50% { transform: scale(1.06); } }
@media print { .anim-item.play * { animation: none !important; } } .gauge .hub { fill: var(--ink); }
.gauge .gl { font-size: 9px; fill: var(--ink-2); text-anchor: middle; }

/* دوائر المعايير الفرعية */
.rings { display: grid; grid-template-columns: repeat(auto-fill, minmax(124px, 1fr)); gap: 1rem .6rem; }
.ringcell { display: flex; flex-direction: column; align-items: center; gap: .4rem; text-align: center; padding: .5rem .3rem;
  border-radius: 12px; transition: background .2s; }
.ringcell:hover { background: var(--soft); }
.ringcell small { font-size: .74rem; line-height: 1.35; min-height: 2.7em; color: var(--ink-2); }
.ring { position: relative; display: grid; place-items: center; }
.ring svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.ring .track { fill: none; stroke: #EDF2F0; stroke-width: 10; }
.ring .val { fill: none; stroke-width: 10; stroke-linecap: round; stroke: #9aa; transition: stroke-dasharray .6s; }
.ring.t-good .val { stroke: var(--met); } .ring.t-mid .val { stroke: var(--partial); } .ring.t-bad .val { stroke: var(--not-met); }
.ring.t-good svg { filter: drop-shadow(0 3px 6px rgba(47,143,91,.3)); } .ring.t-mid svg { filter: drop-shadow(0 3px 6px rgba(217,160,43,.3)); }
.ring.t-bad svg { filter: drop-shadow(0 3px 6px rgba(194,70,61,.28)); }
.ring b { font-size: 1.05rem; }

/* القوة والتحسين */
.summary3 { display: grid; grid-template-columns: 1fr auto 1fr; gap: 1.1rem; align-items: stretch; }
.overall { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .35rem; padding: 1.2rem 1.6rem;
  border-radius: 16px; background: radial-gradient(circle at 50% 35%, #fff 0, var(--soft) 70%); border: 1px solid #E3EDE9;
  box-shadow: 0 10px 30px -20px rgba(23, 48, 43, .4); }
.overall .ring b { font-size: 2.3rem; }
.overall span { font-weight: 600; }
.rankbox { border-radius: 16px; overflow: hidden; background: #fff; border: 1px solid #E3EDE9; box-shadow: 0 10px 30px -20px rgba(23, 48, 43, .4); }
.rankbox h3 { margin: 0; padding: .7rem 1rem; color: #fff; font-size: .95rem; }
.rankbox.good h3 { background: linear-gradient(135deg, #22774A, var(--met)); }
.rankbox.bad h3 { background: linear-gradient(135deg, #9E3029, var(--not-met)); }
.rankbox ol { list-style: none; margin: 0; padding: .5rem 1rem .8rem; display: flex; flex-direction: column; gap: .15rem; counter-reset: r; }
.rankbox li { counter-increment: r; display: flex; align-items: center; gap: .6rem; padding: .45rem 0; border-bottom: 1px dashed #E3EDE9; font-size: .88rem; }
.rankbox li:last-child { border-bottom: 0; }
.rankbox li::before { content: counter(r); width: 1.5rem; height: 1.5rem; border-radius: 50%; display: grid; place-items: center; font-size: .75rem;
  font-weight: 700; flex: none; }
.rankbox.good li::before { background: #E3F4EA; color: var(--met); } .rankbox.bad li::before { background: #FBE6E4; color: var(--not-met); }
.rankbox li span { flex: 1; unicode-bidi: isolate; }
.rankbox li b { unicode-bidi: isolate; direction: ltr; padding: .05rem .55rem; border-radius: 999px; font-size: .82rem; }
.rankbox.good li b { background: #E3F4EA; color: var(--met); } .rankbox.bad li b { background: #FBE6E4; color: var(--not-met); }

/* جداول الأعداد */
table.counts { border-collapse: separate; border-spacing: 0; margin-bottom: 1.2rem; }
table.counts th, table.counts td { text-align: center; white-space: nowrap; padding: .45rem .55rem; }
table.counts thead th { background: var(--soft); font-size: .78rem; border-bottom: 1px solid #E3EDE9; }
table.counts thead th.grp { background: linear-gradient(135deg, var(--g1), var(--g2)); color: #fff; font-size: .85rem;
  border-inline: 2px solid #fff; border-radius: 8px 8px 0 0; }
table.counts thead tr:first-child th:first-child { background: var(--g1); color: #fff; border-radius: 0 8px 0 0; }
table.counts tbody th { text-align: start; font-weight: 600; white-space: normal; min-width: 210px; background: #FAFCFB; }
table.counts tbody tr:nth-child(even) td { background: #FAFCFB; }
table.counts tbody tr:hover td, table.counts tbody tr:hover th { background: #EEF6F2; }
table.counts td:nth-child(3n+2) { color: var(--met); font-weight: 700; }
table.counts td:nth-child(3n+3) { color: var(--not-met); font-weight: 700; }
table.counts td:nth-child(3n+1) { color: #B7811A; font-weight: 700; }
.c-good { color: var(--met); } .c-bad { color: var(--not-met); } .c-mid { color: #B7811A; }

/* خطط التحسين */
.chips { display: flex; flex-wrap: wrap; gap: .25rem; }
.chip { border-radius: 999px; padding: .05rem .6rem; font-size: .76rem; white-space: nowrap; font-weight: 600; }
.chip.c-bad { background: #FBE6E4; color: var(--not-met); } .chip.c-mid { background: #FDF1D8; color: #9A6A0E; }
.clamp { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: .8rem; max-width: 280px; }
.plan-groups details { border: 1px solid #E3EDE9; border-radius: 12px; margin-bottom: .6rem; overflow: hidden; background: #fff; }
.plan-groups details[open] { box-shadow: 0 10px 24px -18px rgba(23,48,43,.45); }
.plan-groups summary { cursor: pointer; padding: .75rem 1rem; display: flex; gap: .6rem; align-items: center; background: var(--soft);
  list-style: none; }
.plan-groups summary::-webkit-details-marker { display: none; }
.plan-groups summary::before { content: "‹"; font-size: 1.2rem; transition: transform .2s; color: var(--g1); }
.plan-groups details[open] summary::before { transform: rotate(-90deg); }
.plan-groups table.data thead th { background: #FAFCFB; font-size: .8rem; }

@media (max-width: 760px) { .summary3 { grid-template-columns: 1fr; } .hero h1 { font-size: 1.5rem; } }
@media print {
  .topbar, .report-controls { display: none !important; }
  .final-report::before { display: none; }
  .hero, .sec-title i, table.counts thead th.grp, .rankbox h3 { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .gcard, .card, .summary3 { break-inside: avoid; }
}

/* ---------------- نطاق المتطلبات ---------------- */
.scope-page { display: flex; flex-direction: column; gap: 1rem; padding-bottom: 5rem; }
.scope-hero { color: #fff; border-radius: 18px; padding: 1.4rem 1.6rem; display: flex; justify-content: space-between; gap: 1rem;
  flex-wrap: wrap; background: linear-gradient(135deg, #0F5C4A, #148A6E 60%, #1FA382); box-shadow: 0 18px 40px -18px rgba(15,92,74,.55); }
.scope-hero h1 { margin: 0 0 .3rem; } .scope-hero p { margin: 0; opacity: .88; max-width: 640px; }
.scope-pick { display: flex; flex-direction: column; gap: .6rem; align-items: flex-start; }
.scope-pick label { display: flex; gap: .4rem; align-items: center; }
.scope-pick select { border: 0; border-radius: 8px; padding: .35rem .6rem; color: var(--ink); }
.scope-stats { display: flex; gap: .6rem; }
.scope-stats span { background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.22); border-radius: 10px; padding: .35rem .7rem; font-size: .85rem; }
.scope-stats b { font-size: 1.2rem; margin-inline-end: .2rem; }
.sstd h2 { margin: 0 0 .7rem; font-size: 1.05rem; display: flex; align-items: center; gap: .5rem; }
.ssub-code { background: #E8F3EF; color: #0F5C4A; border-radius: 6px; padding: 0 .45rem; font-weight: 700; font-size: .85rem; }
.ssub { border: 1px solid #E3EDE9; border-radius: 12px; margin-bottom: .5rem; overflow: hidden; }
.ssub > summary { cursor: pointer; display: flex; gap: .6rem; align-items: center; padding: .6rem .9rem; background: #F7FBF9; list-style: none; flex-wrap: wrap; }
.ssub > summary::-webkit-details-marker { display: none; }
.ssub-title { flex: 1; font-weight: 600; }
.ssub-count { font-size: .8rem; color: var(--ink-2); }
.ssub.all-ex > summary { background: #FDF6E6; } .ssub.all-ex .ssub-title { text-decoration: line-through; color: var(--ink-2); }
.ssub ul { list-style: none; margin: 0; padding: .3rem .9rem .6rem; }
.sreq { display: flex; gap: .7rem; align-items: flex-start; padding: .6rem 0; border-bottom: 1px dashed #E3EDE9; }
.sreq:last-child { border-bottom: 0; }
.sreq input { margin-top: .35rem; width: 1.05rem; height: 1.05rem; accent-color: #0F5C4A; }
.sreq-dot { width: 1.05rem; flex: none; }
.sreq-body { flex: 1; } .sreq-body p { margin: .2rem 0 0; font-size: .9rem; }
.sreq-top { display: flex; gap: .4rem; align-items: center; flex-wrap: wrap; }
.sreq.is-ex .sreq-body > p:not(.sreq-why) { color: var(--ink-2); text-decoration: line-through; text-decoration-color: rgba(0,0,0,.25); }
.sreq-why { font-size: .8rem !important; color: #8A5F0A; background: #FDF6E6; border-radius: 6px; padding: .25rem .5rem; display: inline-block; }
.chip.c-good { background: #E3F4EA; color: var(--met); }
.scope-bar:not(:empty) { position: sticky; bottom: 1rem; align-self: center; display: flex; gap: .7rem; align-items: center; padding: .6rem 1rem;
  background: #17302B; color: #fff; border-radius: 999px; box-shadow: 0 12px 30px -10px rgba(0,0,0,.4); z-index: 5; }
.scope-bar .btn { border-radius: 999px; }
.topbar nav a { padding: .35rem .55rem; font-size: .92rem; }
.ssub-code { direction: ltr; unicode-bidi: isolate; display: inline-block; }
.ringcell small { min-height: 4.7em; display: block; }
.ringcell small .ssub-code { margin-bottom: .15rem; }

/* ---------------- تقويم الإنجاز ---------------- */
.cal-page { display: flex; flex-direction: column; gap: 1rem; padding-bottom: 2rem; }
.cal-actions { margin-top: .9rem; gap: .5rem; flex-wrap: wrap; }
.btn.gold { background: #C9A13B; color: #1d1a10; border: 0; font-weight: 700; }
.btn.ghost { background: rgba(255,255,255,.14); color: #fff; border: 1px solid rgba(255,255,255,.3); }
.scope-stats .st-done b { color: #9BF0C8; } .scope-stats .st-soon b { color: #FFE08A; } .scope-stats .st-overdue b { color: #FFB4AA; }
.cal-layout { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 1rem; align-items: start; }
.cal-nav { display: flex; justify-content: space-between; align-items: center; margin-bottom: .6rem; }
.cal-nav h2 { margin: 0; font-size: 1.1rem; }
.cal-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.cal-dow { text-align: center; font-size: .75rem; color: var(--ink-2); padding: .25rem 0; font-weight: 600; }
.cal-cell { min-height: 74px; border: 1px solid #E3EDE9; border-radius: 8px; padding: .25rem; display: flex; flex-direction: column; gap: 2px; background: #fff; }
.cal-cell.empty { background: transparent; border-style: dashed; opacity: .4; }
.cal-cell.has { background: #F7FBF9; }
.cal-cell.today { outline: 2px solid #0F5C4A; outline-offset: -2px; }
.cal-day { font-size: .78rem; color: var(--ink-2); }
.cal-chip { display: inline-block; font-size: .72rem; font-weight: 700; padding: 0 .35rem; border-radius: 4px; text-decoration: none;
  color: #fff; background: #5B7A73; min-width: 1rem; min-height: .9rem; }
.cal-chip.st-done { background: var(--met); } .cal-chip.st-soon { background: var(--partial); } .cal-chip.st-overdue { background: var(--not-met); }
.cal-chip.st-upcoming { background: #2B6CB0; }
.cal-more { font-size: .7rem; color: var(--ink-2); }
.cal-legend { margin-top: .7rem; }
.cal-group { margin: .4rem 0 .5rem; font-size: .95rem; color: #0F5C4A; border-bottom: 2px solid #E8F3EF; padding-bottom: .3rem; }
.dl { display: flex; gap: .8rem; align-items: flex-start; padding: .75rem; border: 1px solid #E3EDE9; border-inline-start: 5px solid #2B6CB0;
  border-radius: 12px; margin-bottom: .6rem; background: #fff; scroll-margin-top: 80px; }
.dl:target { box-shadow: 0 0 0 3px rgba(15,92,74,.25); }
.dl.st-done { border-inline-start-color: var(--met); } .dl.st-soon { border-inline-start-color: var(--partial); }
.dl.st-overdue { border-inline-start-color: var(--not-met); background: #FFFAF9; }
.dl-date { width: 3.2rem; flex: none; text-align: center; background: #F3F8F6; border-radius: 10px; padding: .35rem 0; display: flex; flex-direction: column; }
.dl-date b { font-size: 1.35rem; line-height: 1.1; color: #0F5C4A; } .dl-date span { font-size: .7rem; color: var(--ink-2); }
.dl-body { flex: 1; min-width: 0; }
.dl-top { display: flex; gap: .4rem; align-items: center; flex-wrap: wrap; }
.dl-kind { font-size: .75rem; color: var(--ink-2); }
.dl h3 { margin: .3rem 0 .15rem; font-size: .95rem; }
.dl p { margin: 0; font-size: .8rem; }
.chip.st-done { background: #E3F4EA; color: var(--met); } .chip.st-soon { background: #FDF1D8; color: #9A6A0E; }
.chip.st-overdue { background: #FBE6E4; color: var(--not-met); } .chip.st-upcoming { background: #E6EFFA; color: #2B6CB0; }
.chip:not([class*="st-"]):not(.c-good):not(.c-bad):not(.c-mid) { background: #EEF2F1; color: var(--ink-2); }
.dl-prog { display: flex; align-items: center; gap: .6rem; margin-top: .45rem; font-size: .78rem; color: var(--ink-2); }
.dl-bar { flex: 1; height: 7px; background: #EDF2F0; border-radius: 99px; overflow: hidden; max-width: 220px; }
.dl-bar i { display: block; height: 100%; background: linear-gradient(90deg, #148A6E, #1FA382); border-radius: 99px; }
.cal-form { min-width: min(460px, 90vw); }
.due { font-size: .72rem; padding: 0 .4rem; border-radius: 4px; background: #E6EFFA; color: #2B6CB0; white-space: nowrap; }
.due.soon { background: #FDF1D8; color: #9A6A0E; } .due.late { background: #FBE6E4; color: var(--not-met); }
@media (max-width: 980px) { .cal-layout { grid-template-columns: 1fr; } }
.cal-month { position: sticky; top: 1rem; }

/* مجلدات الشواهد */
.folder-btn { background: #EEF4FB; border-color: #C9DAF0; color: #1F4E8C; }
.folder-row { gap: .6rem; margin-top: .3rem; }
.fold-table td, .fold-table th { vertical-align: middle; }
.fold-table .fold-std th, .fold-table .fold-root th { text-align: start; font-weight: 700; color: var(--ink); background: #F7FAF9; }
.fold-sub { padding-inline-start: 1.6rem !important; }
.fold-cell { display: flex; gap: .4rem; align-items: center; justify-content: flex-end; flex-wrap: wrap; }
.linkish { background: none; border: 0; padding: 0; color: inherit; text-decoration: underline; cursor: pointer; text-align: start; }

/* الأدلة والمستخدمون */
.topbar a.brand { color: inherit; text-decoration: none; }
.guide-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: .8rem; }
.guide-card { display: flex; gap: .8rem; align-items: flex-start; border: 1px solid var(--line-2); border-radius: 12px; padding: .9rem; background: #fff; }
.guide-card .row { margin-inline-start: auto; flex-wrap: nowrap; }
.guide-body { flex: 1; min-width: 0; } .guide-body h3 { font-size: .98rem; margin-bottom: .2rem; }
.guide-ic { width: 44px; height: 44px; flex: none; border-radius: 12px; display: grid; place-items: center; background: #E8F3EF; font-size: 1.2rem; }
.guide-ic.pdf { background: #FDECEA; color: #B42318; font-weight: 700; font-size: .78rem; }
.guide-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: .6rem; align-items: center; margin-bottom: .4rem; }
.users-table td { vertical-align: top; }
.users-table tr.inactive td { opacity: .55; }
.role-chip { display: inline-flex; align-items: center; gap: .3rem; background: var(--primary-soft); color: var(--primary); border-radius: 999px; padding: .1rem .3rem .1rem .7rem; font-size: .8rem; font-weight: 600; }
.role-chip button { border: 0; background: rgba(0,0,0,.08); border-radius: 50%; width: 1.3rem; height: 1.3rem; cursor: pointer; line-height: 1; color: inherit; }
.panel > header input { max-width: 260px; border: 1px solid var(--line); border-radius: var(--radius); padding: .4rem .6rem; }

/* أعمال الجودة */
.qw-tabs { display: flex; gap: .4rem; margin: 1rem 0; border-bottom: 1px solid var(--line); }
.qw-tabs button { background: none; border: 0; border-bottom: 3px solid transparent; padding: .55rem 1rem; font: inherit; font-weight: 600; color: var(--ink-2); cursor: pointer; }
.qw-tabs button.on { color: #0F5C4A; border-bottom-color: #148A6E; }
.qw-weeks { display: flex; flex-direction: column; gap: 1rem; }
.qw-week { display: grid; grid-template-columns: 4.6rem 1fr; gap: .8rem; align-items: start; }
.qw-wk { position: sticky; top: .5rem; background: linear-gradient(160deg, #0F5C4A, #148A6E); color: #fff; border-radius: 14px; padding: .6rem .3rem; text-align: center; display: flex; flex-direction: column; }
.qw-wk b { font-size: 1.6rem; line-height: 1.1; } .qw-wk span { font-size: .68rem; opacity: .9; }
.qw-list { display: flex; flex-direction: column; gap: .6rem; }
.qw-task { display: flex; gap: .8rem; align-items: flex-start; background: #fff; border: 1px solid #E3EDE9; border-inline-start: 5px solid #9FB8B0; border-radius: 12px; padding: .8rem; }
.qw-task.s-approved, .qw-task.s-na { border-inline-start-color: var(--met); } .qw-task.s-submitted { border-inline-start-color: #2B6CB0; }
.qw-task.s-overdue, .qw-task.s-returned { border-inline-start-color: var(--not-met); } .qw-task.s-pending { border-inline-start-color: var(--partial); }
.qw-due { width: 3.2rem; flex: none; text-align: center; background: #F3F8F6; border-radius: 10px; padding: .35rem 0; display: flex; flex-direction: column; }
.qw-due b { font-size: 1.35rem; line-height: 1.1; color: #0F5C4A; } .qw-due span { font-size: .7rem; color: var(--ink-2); }
.qw-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .35rem; }
.qw-body h3 { margin: 0; font-size: .97rem; line-height: 1.6; } .qw-body p { margin: 0; font-size: .8rem; }
.qw-meta { display: flex; gap: .5rem; flex-wrap: wrap; align-items: center; font-size: .78rem; }
.qw-meta .chip { white-space: normal; }
.qw-links { display: flex; gap: .35rem; flex-wrap: wrap; }
.qw-sub-chip { background: #E8F3EF; color: #0F5C4A; border: 1px solid #CFE5DD; border-radius: 999px; padding: .05rem .6rem; font-size: .75rem; font-weight: 600; }
.qw-mine { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; margin-top: .2rem; }
.qw-return { color: var(--not-met); font-size: .8rem; }
.qw-depts { display: flex; gap: .35rem; flex-wrap: wrap; margin-top: .2rem; }
.qw-dot { border: 1px solid #E3EDE9; background: #F7FAF9; border-radius: 9px; padding: .2rem .5rem; font: inherit; font-size: .74rem; cursor: pointer; display: flex; gap: .35rem; align-items: center; }
.qw-dot i { font-style: normal; font-weight: 700; border-radius: 99px; padding: 0 .4rem; }
.qw-dot.st-done i { background: #E3F4EA; color: var(--met); } .qw-dot.st-upcoming i { background: #E6EFFA; color: #2B6CB0; }
.qw-dot.st-overdue i { background: #FBE6E4; color: var(--not-met); } .qw-dot.st-soon i { background: #FDF1D8; color: #9A6A0E; }
.qw-tools { display: flex; flex-direction: column; gap: .3rem; flex: none; }
dialog:has(.qw-form) { width: min(40rem, 94vw); }
.qw-form { min-width: 0; }
.qw-form .input { width: 100%; box-sizing: border-box; }
.qw-tip { background: #EEF6F3; border-radius: 8px; padding: .5rem .7rem; font-size: .82rem; color: #0F5C4A; margin: 0; }
.qw-na { display: flex; gap: .4rem; align-items: center; font-size: .9rem; } .qw-na small { color: var(--ink-2); }
.qw-tree { max-height: 52vh; overflow: auto; border: 1px solid var(--line); border-radius: 10px; padding: .4rem .7rem; }
.qw-std { margin: .7rem 0 .3rem; font-size: .85rem; color: #0F5C4A; }
.qw-sub summary { cursor: pointer; padding: .25rem 0; font-weight: 600; font-size: .88rem; }
.qw-req { display: flex; gap: .45rem; align-items: flex-start; padding: .2rem 0 .2rem 0; padding-inline-start: 1.4rem; font-size: .83rem; line-height: 1.6; }
.qw-map-sum { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: .8rem; margin-bottom: .8rem; }
.qw-map-sum div { background: #F3F8F6; border-radius: 12px; padding: .7rem 1rem; display: flex; flex-direction: column; }
.qw-map-sum b { font-size: 1.7rem; color: #0F5C4A; } .qw-map-sum span { font-size: .82rem; color: var(--ink-2); }
.qw-map td { vertical-align: top; font-size: .84rem; } .qw-map tr.on td:first-child { font-weight: 700; color: #0F5C4A; }
.qw-map .qw-std-row th { background: #0F5C4A; color: #fff; text-align: start; font-size: .9rem; padding: .5rem .8rem; }
.qw-tlist, .qw-rlist { margin: 0; padding-inline-start: 1rem; } .qw-tlist li, .qw-rlist li { margin: .15rem 0; line-height: 1.6; }
.qw-rlist li.hit { background: #E3F4EA; border-radius: 6px; padding: 0 .3rem; }
.qw-w { color: #0F5C4A; font-weight: 700; font-size: .75rem; white-space: nowrap; }
@media (max-width: 640px) { .qw-week { grid-template-columns: 1fr; } .qw-wk { position: static; flex-direction: row; gap: .5rem; justify-content: center; } .qw-task { flex-wrap: wrap; } .qw-tools { flex-direction: row; } }
.qw-form-link { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; background: #F3F8F6; border: 1px dashed #BFD9CF; border-radius: 9px; padding: .35rem .6rem; font-size: .8rem; }

/* تقارير الكلية */
.cr-layout { display: grid; grid-template-columns: 270px 1fr; gap: 1rem; margin-top: 1rem; align-items: start; }
.cr-side { padding: .6rem; position: sticky; top: .5rem; }
.cr-side h4 { margin: .7rem .4rem .3rem; font-size: .8rem; color: #0F5C4A; }
.cr-side a { display: block; padding: .45rem .6rem; border-radius: 8px; font-size: .84rem; color: var(--ink); text-decoration: none; line-height: 1.5; }
.cr-side a:hover { background: #F3F8F6; } .cr-side a.on { background: #E3F1EC; color: #0F5C4A; font-weight: 700; }
.cr-head { display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start; flex-wrap: wrap; }
.cr-head h2 { margin: 0 0 .25rem; font-size: 1.1rem; } .cr-head p { margin: 0; font-size: .82rem; }
.cr-depts { display: flex; gap: .4rem; flex-wrap: wrap; margin: .8rem 0; }
.cr-dept { border-radius: 999px; padding: .15rem .7rem; font-size: .76rem; font-weight: 600; }
.cr-dept.ok { background: #E3F4EA; color: var(--met); } .cr-dept.no { background: #FDF1D8; color: #9A6A0E; }
.cr-table th { font-size: .74rem; line-height: 1.5; vertical-align: bottom; } .cr-table td { font-size: .82rem; vertical-align: top; }
.cr-total td { font-weight: 700; background: #E8F3EF; }
@media (max-width: 900px) { .cr-layout { grid-template-columns: 1fr; } .cr-side { position: static; } }
.qw-patt { display: flex; justify-content: space-between; align-items: center; gap: .8rem; flex-wrap: wrap; border-radius: 12px; padding: .7rem 1rem; margin-top: 1rem; font-size: .86rem; }
.qw-patt.off { background: #F6F4EE; border: 1px solid #E6DFC8; } .qw-patt.on { background: #E8F4EF; border: 1px solid #BFDCD0; }
.qw-task.is-off { opacity: .6; border-inline-start-color: #C9D3D0; }
.cr-visit { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .5rem; margin: .4rem 0 1rem; padding: .7rem; background: #F3F8F6; border-radius: 10px; }

/* شريط المنصة: الشعار يميناً، القوائم في الوسط على صفين، الدورة والمستخدم يساراً */
.topbar { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .6rem 1.25rem; }
.topbar .brand { margin-inline-end: 0; }
.topbar nav { display: flex; flex-direction: column; align-items: center; gap: .3rem; min-width: 0; }
.topbar .nav-row { display: flex; flex-wrap: wrap; justify-content: center; gap: .2rem; }
.topbar .top-side { display: flex; flex-direction: column; align-items: flex-end; gap: .4rem; }
@media (max-width: 1200px) {
  .topbar { grid-template-columns: 1fr auto; }
  .topbar nav { grid-column: 1 / -1; grid-row: 2; }
}

/* إبراز عناصر القائمة: توهج خفيف عند المرور، وبروز للعنصر المختار */
.topbar nav a { position: relative; opacity: .85; transition: background .2s, box-shadow .25s, transform .2s, opacity .2s; }
.topbar nav a:hover { opacity: 1; background: rgba(255,255,255,.12); box-shadow: 0 0 14px rgba(160, 255, 220, .25); transform: translateY(-1px); }
.topbar nav a[aria-current="page"] { opacity: 1; font-weight: 700; background: rgba(255,255,255,.2);
  box-shadow: 0 0 0 1px rgba(255,255,255,.28), 0 0 18px rgba(120, 240, 200, .45), inset 0 -2px 0 #F2C94C; }
.topbar nav a:active { transform: scale(.97); }

/* سير العملية التدريبية */
.tr-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .7rem; margin: 1rem 0 .6rem; }
.tr-kpi { background: #fff; border: 1px solid #E3EDE9; border-top: 4px solid #B9CBC6; border-radius: 12px; padding: .7rem .9rem; display: flex; flex-direction: column; }
.tr-kpi small { color: var(--ink-2); font-size: .78rem; } .tr-kpi b { font-size: 1.6rem; line-height: 1.25; } .tr-kpi span { font-size: .74rem; color: var(--ink-2); }
.tr-kpi.att { border-top-color: #009C8C; } .tr-kpi.rec { border-top-color: #B7791F; }
.tr-kpi.bad { border-top-color: #C2463D; } .tr-kpi.bad b { color: #C2463D; } .tr-kpi.warn { border-top-color: #B7791F; } .tr-kpi.warn b { color: #9A6A0E; }
.tr-thr { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; font-size: .85rem; margin-bottom: 1rem; }
.tr-thr input { width: 4.2rem; padding: .2rem .4rem; border: 1px solid var(--line); border-radius: 6px; }
.tr-thr .btn:first-of-type { margin-inline-start: auto; }
.tr-chart { width: 100%; height: auto; }
.tr-chart .grid { stroke: #E8EFED; } .tr-chart .target { stroke: #C2463D; stroke-width: 1.5; stroke-dasharray: 5 4; }
.tr-chart .tick { font-size: 11px; fill: #7A8A88; } .tr-chart .lbl { font-size: 12px; fill: #2E3B3A; font-weight: 600; }
.tr-chart .val { font-size: 11px; fill: #3B4544; } .tr-chart rect:hover, .tr-chart circle:hover { opacity: .8; }
.tr-legend { margin: 0 0 .4rem; } .tr-legend .cell { width: 12px; height: 12px; border-radius: 3px; display: inline-block; }
.tr-bad { color: #C2463D; font-weight: 700; }
.tr-follow { max-height: 420px; overflow: auto; }
.tr-mini { display: flex; gap: .6rem; flex-wrap: wrap; } .tr-mini span { background: #F3F8F6; border-radius: 8px; padding: .3rem .6rem; font-size: .85rem; }
dialog:has(.tr-wide) { width: min(56rem, 96vw); }
.tr-map td select { min-width: 12rem; }
.tr-enr h3 { font-size: 1rem; margin: 1rem 0 .4rem; } .tr-prog { max-width: 900px; }
.tr-maptools { display: flex; gap: .5rem; flex-wrap: wrap; margin: .5rem 0; } .tr-maptools .input { flex: 1 1 12rem; width: auto; }
.tr-map { max-height: 55vh; overflow: auto; } .tr-map tr.pending td { background: #FFFBF0; } .tr-map td small { margin-inline-start: .4rem; }

/* هوية المؤسسة: الشعار على بطاقة بيضاء وتحته اسم الكلية */
.topbar .brand { align-items: center; gap: .3rem; }
.topbar .org-logo { display: block; background: #fff; border-radius: 9px; padding: 4px 9px; }
.topbar .org-logo img { display: block; height: 30px; width: auto; }
.topbar .brand > span:last-child { font-size: .78rem; font-weight: 600; opacity: .95; }
.login-brand { display: flex; flex-direction: column; align-items: center; gap: .4rem; padding-bottom: 1rem; margin-bottom: .5rem; border-bottom: 1px solid var(--line, #e3ecea); }
.login-brand img { height: 96px; width: auto; }
.login-brand span { font-weight: 700; color: var(--primary); }
.topbar .brand > .org-logo { opacity: 1; }
.topbar .org-logo img { height: 62px; }
.topbar .org-logo { padding: 3px 7px; }
@media (max-width: 700px) {
  .topbar { grid-template-columns: 1fr; padding: .6rem 1rem; }
  .topbar .brand { align-items: center; }
  .topbar .top-side { flex-direction: row; justify-content: space-between; align-items: center; width: 100%; }
  .topbar .top-side select { max-width: 60vw; }
  .topbar nav { grid-row: auto; }
}

/* الشعار بلا خلفية: نسخة فاتحة على الشريط الأخضر */
.topbar .org-logo { background: none; padding: 0; border-radius: 0; box-shadow: none; }

.fold-names { margin: .5rem 0; } .fold-names summary { cursor: pointer; font-weight: 600; padding: .3rem 0; }
.fold-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr)); gap: .5rem .9rem; margin-top: .5rem; }
.fold-grid label { display: flex; flex-direction: column; gap: .15rem; }

/* نطاق المتطلبات كصفحة انطلاق: المتطلب رابط لإكمال مهمته */
a.sreq-text { display: block; color: var(--ink); text-decoration: none; margin: .2rem 0; border-radius: 6px; }
a.sreq-text:hover { color: var(--primary); text-decoration: underline; }
.sreq-links, .ssub-forms { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .3rem; align-items: center; }
.ssub-forms { padding: .5rem .9rem 0; }
.task-link { font-size: .8rem; padding: .2rem .6rem; border-radius: 999px; border: 1px solid #D6E6E1; background: #F7FBF9; color: var(--primary); text-decoration: none; }
.task-link:hover { background: var(--primary); color: #fff; border-color: var(--primary); }
.task-link.t-form { border-color: #CFE3F0; background: #F3F8FC; color: #2B6A8F; }
.task-link.t-minutes { border-color: #EADFC6; background: #FCF8EF; color: #8A5A12; }

.pdf-btn { border-color: #126C66; color: #126C66; font-weight: 600; }
.xlsx-btn { border-color:#1D6F42; color:#1D6F42; font-weight:600; }

/* الدخول وكلمة المرور */
.auth-form { display: flex; flex-direction: column; gap: .75rem; }
.auth-title { font-size: 1.1rem; margin: 0; }
.auth-link { text-align: center; font-size: .9rem; }
.pw-wrap { position: relative; display: flex; }
.pw-wrap input { flex: 1; min-width: 0; width: 100%; padding-inline-start: 4rem; }
.pw-toggle { position: absolute; inset-inline-start: .35rem; top: 50%; transform: translateY(-50%); border: 0; background: none;
  color: var(--primary); font: inherit; font-size: .8rem; cursor: pointer; padding: .25rem .4rem; }
.ok-box { background: var(--ok-bg, #e6f4ee); color: var(--ok-ink, #1E7F55); padding: .6rem .8rem; border-radius: var(--radius); }
.dev-login { border-top: 1px dashed var(--line, #e3ecea); padding-top: .75rem; font-size: .875rem; }
.dev-login summary { cursor: pointer; color: var(--muted, #5b6b66); }
.dev-login .btn { margin-top: .5rem; }
.topbar .user .pw-link { color: inherit; font-size: .85rem; opacity: .85; }
.pw-card { max-width: 28rem; }
.users-table .row-actions { display: flex; gap: .4rem; flex-wrap: wrap; }
@media (max-width: 480px) { .login { margin: 1.5rem 1rem; padding: 1.25rem; } }