/* procure.css — فحص ملفات المشتريات: calm, readable, print-ready. */
:root { --bg: #F3F5F8; --card: #FFFFFF; --ink: #1E2733; --soft: #5B6676; --line: #DCE2EA; --brand: #1F4E79; --brand-w: #E6EEF6;
  --ok: #2F7D4F; --ok-w: #E7F4EC; --warn: #9A6216; --warn-w: #FCF1DE; --bad: #B23A2B; --bad-w: #FBE7E4; --r: 16px; }
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--ink); font: 15px/1.7 Tajawal, system-ui, sans-serif; }
a { color: var(--brand); }
bdi { unicode-bidi: isolate; }
.pc-wrap { width: min(1180px, 100% - 28px); margin-inline: auto; }
.pc-top { background: #14324F; color: #fff; }
.pc-top-in { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; flex-wrap: wrap; }
.pc-brand { display: flex; align-items: center; gap: 10px; color: #fff; text-decoration: none; }
.pc-brand b { display: block; font-size: 17px; } .pc-brand small { display: block; font-size: 12px; opacity: .75; line-height: 1.3; }
.pc-logo { width: 38px; height: 38px; border-radius: 11px; background: #F0B429; color: #14324F; display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 20px; }
.pc-nav { display: flex; gap: 4px; flex-wrap: wrap; }
.pc-nav a { color: #DCE8F4; text-decoration: none; padding: 7px 12px; border-radius: 10px; font-weight: 700; font-size: 14px; }
.pc-nav a:hover, .pc-nav a[aria-current="page"] { background: rgba(255, 255, 255, .12); color: #fff; }
.pc-main { padding: 20px 0 48px; display: flex; flex-direction: column; gap: 16px; }
.pc-card { background: var(--card); border: 1px solid var(--line); border-radius: var(--r); padding: 18px 20px; box-shadow: 0 1px 2px rgba(20, 50, 79, .04); }
.pc-card-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.pc-card-head h2 { margin: 0; font-size: 18px; color: #14324F; }
.pc-hero { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; flex-wrap: wrap; }
.pc-hero h1, .pc-head-card h1 { margin: 0; font-size: 24px; line-height: 1.4; color: #14324F; }
.pc-muted { color: var(--soft); margin: 0; }
.pc-empty { text-align: center; } .pc-empty h1 { font-size: 20px; }
.pc-back { font-weight: 700; text-decoration: none; }
.pc-note { margin: 0; padding: 10px 14px; border-radius: 12px; background: var(--warn-w); color: var(--warn); font-weight: 600; }
.pc-flash { padding: 10px 14px; border-radius: 12px; font-weight: 700; margin: 0; }
.pc-flash.ok { background: var(--ok-w); color: var(--ok); } .pc-flash.warn { background: var(--warn-w); color: var(--warn); } .pc-flash.bad { background: var(--bad-w); color: var(--bad); }

.pc-btn { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--brand); background: var(--brand); color: #fff; border-radius: 11px; padding: 9px 16px; font: 700 14px Tajawal, sans-serif; cursor: pointer; text-decoration: none; min-height: 42px; }
.pc-btn:hover { background: #163D60; }
.pc-btn.ghost { background: #fff; color: var(--brand); } .pc-btn.ghost:hover { background: var(--brand-w); }
.pc-btn.sm { min-height: 34px; padding: 5px 12px; font-size: 13px; }
.pc-btn.danger { background: #fff; color: var(--bad); border-color: #E7B4AD; }
.pc-in { width: 100%; border: 1px solid #C9D2DE; border-radius: 10px; padding: 8px 11px; font: 15px Tajawal, sans-serif; color: var(--ink); background: #fff; min-height: 42px; }
.pc-in:focus { outline: 2px solid #9CC0E3; border-color: var(--brand); }
textarea.pc-in { resize: vertical; }
.pc-actions { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-start; }

.pc-kpis { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.pc-kpi { background: var(--card); border: 1px solid var(--line); border-radius: 14px; padding: 12px 14px; border-inline-start: 4px solid var(--brand); }
.pc-kpi small { color: var(--soft); font-weight: 700; display: block; } .pc-kpi b { font-size: 26px; }
.pc-kpi.ok { border-inline-start-color: var(--ok); } .pc-kpi.ok b { color: var(--ok); }
.pc-kpi.warn { border-inline-start-color: #E3A24A; } .pc-kpi.warn b { color: var(--warn); }
.pc-kpi.bad { border-inline-start-color: var(--bad); } .pc-kpi.bad b { color: var(--bad); }
.pc-filter { display: grid; grid-template-columns: minmax(0, 1fr) 200px 140px auto; gap: 8px; padding: 12px; }

.pc-list { display: flex; flex-direction: column; gap: 10px; }
.pc-row { display: grid; grid-template-columns: minmax(0, 1fr) 230px; gap: 14px; text-decoration: none; color: inherit; align-items: center; transition: border-color .2s, box-shadow .2s; }
.pc-row:hover { border-color: #9CC0E3; box-shadow: 0 6px 18px rgba(20, 50, 79, .08); }
.pc-row-main { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.pc-row-title { font-size: 16px; }
.pc-row-side { display: flex; flex-direction: column; gap: 5px; align-items: stretch; }
.pc-tags { display: flex; gap: 5px; flex-wrap: wrap; }
.pc-tag { background: var(--brand-w); color: var(--brand); border-radius: 999px; padding: 1px 10px; font-size: 12.5px; font-weight: 700; }
.pc-tag.soft { background: #EEF1F5; color: var(--soft); }
.pc-verdict { text-align: center; border-radius: 10px; padding: 3px 10px; font-weight: 800; font-size: 13px; }
.pc-verdict.ok { background: var(--ok-w); color: var(--ok); } .pc-verdict.warn { background: var(--warn-w); color: var(--warn); } .pc-verdict.bad { background: var(--bad-w); color: var(--bad); }
.pc-bar { display: block; height: 8px; border-radius: 999px; background: #E6EAF0; overflow: hidden; }
.pc-bar i { display: block; height: 100%; border-radius: 999px; background: var(--ok); }
.pc-bar.warn i { background: #E3A24A; } .pc-bar.bad i { background: var(--bad); }
.pc-money { font-weight: 800; text-align: start; }

.pc-head-card { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 14px 18px; }
.pc-head-txt { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.pc-verdict-box { border-radius: 14px; padding: 12px 14px; display: flex; flex-direction: column; justify-content: center; gap: 2px; }
.pc-verdict-box b { font-size: 16px; } .pc-verdict-box small { font-weight: 600; }
.pc-verdict-box.ok { background: var(--ok-w); color: var(--ok); } .pc-verdict-box.warn { background: var(--warn-w); color: var(--warn); } .pc-verdict-box.bad { background: var(--bad-w); color: var(--bad); }
.pc-facts { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 8px; margin: 0; }
.pc-facts div { background: #F6F8FB; border-radius: 12px; padding: 8px 12px; }
.pc-facts dt { font-size: 12.5px; color: var(--soft); font-weight: 700; } .pc-facts dd { margin: 0; font-weight: 800; }
.pc-fact-wide { grid-column: 1 / -1; } .pc-fact-wide dd { display: flex; flex-direction: column; gap: 4px; } .pc-fact-wide small { font-weight: 600; color: var(--soft); }
.pc-jump { grid-column: 1 / -1; display: flex; gap: 6px; flex-wrap: wrap; border-top: 1px solid var(--line); padding-top: 10px; }
.pc-jump a { text-decoration: none; font-weight: 700; padding: 4px 12px; border-radius: 999px; background: #EEF1F5; color: var(--ink); }
.pc-jump a:hover { background: var(--brand-w); color: var(--brand); }

.pc-checks { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.pc-check { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 8px; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--line); }
.pc-check.blocker { background: var(--bad-w); border-color: #F1C4BD; } .pc-check.warning { background: var(--warn-w); border-color: #F2DDB6; }
.pc-check.pass { background: #FAFCFB; } .pc-check.info { background: #F4F8FC; }
.pc-check-i { font-size: 18px; text-align: center; } .pc-check.pass .pc-check-i { color: var(--ok); font-weight: 800; }
.pc-check-t { display: flex; flex-direction: column; min-width: 0; } .pc-check-t small { color: var(--soft); font-weight: 700; font-size: 12px; } .pc-check-t span { color: #3B4554; font-size: 14px; }
.pc-log { margin-top: 10px; } .pc-log summary { cursor: pointer; font-weight: 700; color: var(--brand); } .pc-log ul { margin: 6px 0 0; padding-inline-start: 20px; color: var(--soft); }

.pc-docs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.pc-docs .pc-actions { grid-column: 1 / -1; }
.pc-doc { border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px; margin: 0; display: flex; flex-direction: column; gap: 8px; min-width: 0; border-inline-start: 4px solid #C9D2DE; }
.pc-doc.yes { border-inline-start-color: var(--ok); } .pc-doc.no { border-inline-start-color: var(--bad); } .pc-doc.na { border-inline-start-color: #8A94A3; }
.pc-doc legend { font-weight: 800; padding: 0 4px; font-size: 14.5px; }
.pc-req { font-size: 11px; font-weight: 800; color: var(--bad); background: var(--bad-w); border-radius: 999px; padding: 0 7px; }
.pc-seg { display: inline-flex; background: #EEF1F5; border-radius: 10px; padding: 3px; gap: 2px; width: max-content; max-width: 100%; }
.pc-seg label { cursor: pointer; } .pc-seg input { position: absolute; opacity: 0; }
.pc-seg span { display: block; padding: 4px 12px; border-radius: 8px; font-weight: 700; font-size: 13.5px; color: var(--soft); }
.pc-seg input:checked + span { background: #fff; color: var(--ink); box-shadow: 0 1px 4px rgba(0, 0, 0, .1); }
.pc-seg input:focus-visible + span { outline: 2px solid #9CC0E3; }
.pc-doc-note { min-height: 36px; font-size: 14px; }
.pc-file { font-size: 13.5px; font-weight: 600; overflow-wrap: anywhere; }
.pc-upload { display: grid; grid-template-columns: 260px minmax(0, 1fr) auto; gap: 8px; align-items: end; margin-top: 14px; padding-top: 14px; border-top: 1px dashed var(--line); }
.pc-upload label { display: flex; flex-direction: column; gap: 4px; font-weight: 700; font-size: 13.5px; }
.pc-upload small { grid-column: 1 / -1; }
.pc-files { display: flex; flex-direction: column; gap: 4px; margin-top: 8px; }

.pc-stages { display: flex; flex-direction: column; gap: 8px; }
.pc-stage { display: grid; grid-template-columns: 34px minmax(0, 1fr) 190px; gap: 10px; align-items: center; padding: 8px 10px; border-radius: 12px; border: 1px solid var(--line); }
.pc-stage.now { border-color: #9CC0E3; background: var(--brand-w); } .pc-stage.over { border-color: #F1C4BD; }
.pc-stage.over .pc-stage-t small { color: var(--bad); font-weight: 700; }
.pc-stage-n { width: 30px; height: 30px; border-radius: 50%; background: #EEF1F5; display: flex; align-items: center; justify-content: center; font-weight: 800; }
.pc-stage.now .pc-stage-n { background: var(--brand); color: #fff; }
.pc-stage-t { display: flex; flex-direction: column; } .pc-stage-t small { color: var(--soft); }

.pc-form { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.pc-form label { display: flex; flex-direction: column; gap: 4px; font-weight: 700; font-size: 13.5px; min-width: 0; }
.pc-form label small { font-weight: 500; color: var(--soft); }
.pc-form .w2 { grid-column: span 2; }
.pc-flags { border: 1px solid var(--line); border-radius: 12px; display: flex; flex-wrap: wrap; gap: 6px 18px; padding: 8px 12px; margin: 0; }
.pc-flags legend { font-weight: 800; font-size: 13.5px; }
.pc-check-in { display: inline-flex !important; flex-direction: row !important; align-items: center; gap: 6px; font-weight: 600 !important; cursor: pointer; }
.pc-check-in input { width: 18px; height: 18px; }

.pc-memo-pick { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-bottom: 12px; }
.pc-memo-opt { border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px; text-decoration: none; color: inherit; display: flex; flex-direction: column; }
.pc-memo-opt small { color: var(--soft); font-size: 12.5px; }
.pc-memo-opt.on { border-color: var(--brand); background: var(--brand-w); }
.pc-memo-opt.off { opacity: .6; } .pc-memo-opt.off small { color: var(--bad); }
.pc-paper { margin-top: 12px; border: 1px solid #C9D2DE; border-radius: 6px; padding: 28px 32px; background: #fff; max-width: 820px; }
.pc-paper header { display: flex; justify-content: space-between; border-bottom: 2px solid var(--ink); padding-bottom: 8px; margin-bottom: 14px; font-size: 14px; }
.pc-paper h3 { text-align: center; margin: 0 0 12px; }
.pc-paper pre { white-space: pre-wrap; font: 15.5px/2 Tajawal, sans-serif; margin: 0; unicode-bidi: plaintext; }
.pc-danger { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; justify-content: flex-start; padding: 10px 0; }

.pc-rules { display: flex; flex-direction: column; gap: 6px; }
.pc-rule { display: grid; grid-template-columns: minmax(0, 1fr) 160px 160px 70px; gap: 10px; align-items: center; padding: 6px 8px; border-radius: 10px; }
.pc-rule.unv { background: var(--warn-w); }
.pc-rule > span { display: flex; flex-direction: column; } .pc-rule-head { font-weight: 800; color: var(--soft); font-size: 13px; background: none !important; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

@media (max-width: 900px) {
  .pc-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pc-head-card, .pc-row { grid-template-columns: 1fr; }
  .pc-docs, .pc-memo-pick { grid-template-columns: 1fr; }
  .pc-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pc-filter { grid-template-columns: 1fr 1fr; } .pc-filter input[type=search] { grid-column: 1 / -1; }
  .pc-upload { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .pc-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pc-form { grid-template-columns: 1fr; } .pc-form .w2 { grid-column: auto; }
  .pc-stage { grid-template-columns: 30px minmax(0, 1fr); } .pc-stage .pc-in { grid-column: 1 / -1; }
  .pc-rule { grid-template-columns: 1fr 1fr; } .pc-rule > span { grid-column: 1 / -1; } .pc-rule-head { display: none; }
  .pc-fact-wide { grid-column: auto; }
  .pc-paper { padding: 18px; }
}
@media print {
  body.pc-printing { background: #fff; }
  body.pc-printing * { visibility: hidden; }
  body.pc-printing #memoPaper, body.pc-printing #memoPaper * { visibility: visible; }
  body.pc-printing #memoPaper { position: absolute; inset: 0 0 auto 0; border: 0; max-width: none; padding: 0; }
}

@media (max-width: 560px) { .pc-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* sign-in + users */
.pc-auth { max-width: 460px; margin: 30px auto; width: 100%; display: flex; flex-direction: column; gap: 10px; }
.pc-auth h1 { margin: 0; font-size: 22px; color: #14324F; }
.pc-form1 { display: flex; flex-direction: column; gap: 12px; }
.pc-form1 label { display: flex; flex-direction: column; gap: 4px; font-weight: 700; font-size: 13.5px; }
.pc-form1 label small { font-weight: 500; color: var(--soft); }
.pc-out { display: inline-flex; align-items: center; gap: 6px; margin: 0; padding-inline-start: 8px; border-inline-start: 1px solid rgba(255,255,255,.2); }
.pc-out span { color: #DCE8F4; font-size: 13.5px; font-weight: 700; }
.pc-out button { background: transparent; border: 1px solid rgba(255,255,255,.35); color: #fff; border-radius: 9px; padding: 4px 10px; font: 700 13px Tajawal, sans-serif; cursor: pointer; }
.pc-users { display: flex; flex-direction: column; gap: 8px; }
.pc-user { display: grid; grid-template-columns: minmax(0, 1fr) 160px 90px 220px auto; gap: 10px; align-items: center; padding: 10px 12px; border: 1px solid var(--line); border-radius: 12px; }
.pc-user.off { opacity: .6; }
.pc-user-t { display: flex; flex-direction: column; min-width: 0; } .pc-user-t small { overflow-wrap: anywhere; }
@media (max-width: 900px) { .pc-user { grid-template-columns: 1fr 1fr; } .pc-user-t { grid-column: 1 / -1; } }
.pc-form .pc-actions { align-self: end; } .pc-form .pc-actions .pc-btn { min-height: 42px; height: auto; }
.pc-jump a.pc-jump-up { background: var(--brand); color: #fff; } .pc-jump a.pc-jump-up:hover { background: #163D60; color: #fff; }
.pc-upload { scroll-margin-top: 20px; }

.pc-import { display: flex; flex-direction: column; gap: 12px; } .pc-import h1 { margin: 0; font-size: 22px; color: #14324F; }
.pc-drop { border: 2px dashed #9CC0E3; border-radius: 14px; padding: 18px; background: var(--brand-w); text-align: center; cursor: pointer; }
.pc-drop input { margin-top: 8px; }
.pc-import-review { display: flex; flex-direction: column; gap: 16px; } .pc-import-review h1 { margin: 0; font-size: 20px; color: #14324F; }
.pc-ai-notes { background: var(--warn-w); border-radius: 12px; padding: 10px 14px; color: #5A3B0C; } .pc-ai-notes ul { margin: 6px 0 0; padding-inline-start: 20px; }
.pc-ifile { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 10px; align-items: center; padding: 8px 0; border-bottom: 1px dashed var(--line); }
.pc-ifile span { overflow-wrap: anywhere; }
@media (max-width: 700px) { .pc-ifile { grid-template-columns: 1fr; } }