/* =====================================================================
   PulseRx core component library  ·  prx-components.css
   Requires tokens.css. Lift any block straight into the Frappe app.
   ===================================================================== */
.prx, .prx * { box-sizing: border-box; }
.prx { font-family: var(--prx-font-sans); color: var(--prx-text-body); }

/* ============ BUTTONS ============ */
.prx-btn {
  display:inline-flex; align-items:center; justify-content:center; gap:var(--prx-space-2);
  height:var(--prx-control-h); min-height:var(--prx-tap-min); padding:0 var(--prx-space-4);
  font-family:var(--prx-font-sans); font-size:var(--prx-text-body-sz); font-weight:var(--prx-fw-semi);
  line-height:1; border:1px solid transparent; border-radius:var(--prx-radius-sm);
  background:transparent; color:var(--prx-text-body); cursor:pointer; white-space:nowrap;
  transition:background .12s ease, border-color .12s ease, box-shadow .12s ease, color .12s ease;
}
.prx-btn svg { width:16px; height:16px; flex:none; }
.prx-btn:focus-visible { outline:none; box-shadow:var(--prx-focus-ring); }
.prx-btn:disabled, .prx-btn[aria-disabled="true"] { opacity:.45; cursor:not-allowed; pointer-events:none; }

.prx-btn--primary { background:var(--prx-primary); color:#fff; }
.prx-btn--primary:hover { background:var(--prx-primary-hover); }
.prx-btn--primary:active { background:var(--prx-primary-hover); box-shadow:inset 0 1px 2px rgba(0,0,0,.2); }

.prx-btn--accent { background:var(--prx-accent); color:#fff; }
.prx-btn--accent:hover { background:var(--prx-accent-hover); }

.prx-btn--danger { background:var(--prx-danger-fill); color:#fff; }
.prx-btn--danger:hover { background:#9A1D14; }

.prx-btn--ghost { background:transparent; border-color:var(--prx-border-strong); color:var(--prx-text-body); }
.prx-btn--ghost:hover { background:var(--prx-bg-hover); border-color:var(--prx-text-muted); }

/* Override = special caution affordance: amber outline + warning glyph */
.prx-btn--override { background:#fff; border-color:var(--prx-warning-fill); color:var(--prx-warning-text); font-weight:var(--prx-fw-bold); }
.prx-btn--override svg { color:var(--prx-warning-fill); }
.prx-btn--override:hover { background:var(--prx-warning-bg); border-color:var(--prx-warning-text); }

.prx-btn--icon { width:var(--prx-control-h); min-width:var(--prx-tap-min); padding:0; color:var(--prx-text-muted); }
.prx-btn--icon:hover { background:var(--prx-bg-hover); color:var(--prx-text-body); }
.prx-btn--sm { height:26px; min-height:0; padding:0 var(--prx-space-3); font-size:var(--prx-text-small); }

/* On-blue context adaptations */
.prx-onblue .prx-btn--ghost { border-color:rgba(255,255,255,.55); color:#fff; }
.prx-onblue .prx-btn--ghost:hover { background:rgba(255,255,255,.14); border-color:#fff; }
.prx-onblue .prx-btn--icon { color:rgba(255,255,255,.85); }
.prx-onblue .prx-btn--icon:hover { background:rgba(255,255,255,.14); color:#fff; }
.prx-onblue .prx-btn--override { background:rgba(255,255,255,.96); }

/* ============ FORM INPUTS ============ */
.prx-field { display:flex; flex-direction:column; gap:var(--prx-space-1); }
.prx-label { font-size:var(--prx-text-small); font-weight:var(--prx-fw-semi); color:var(--prx-text-subtle); }
.prx-label .req { color:var(--prx-danger-fill); margin-left:2px; }
.prx-hint { font-size:var(--prx-text-small); color:var(--prx-text-muted); }

.prx-input, .prx-select select, .prx-textarea {
  width:100%; height:var(--prx-control-h); min-height:var(--prx-tap-min); padding:0 var(--prx-space-3);
  font-family:var(--prx-font-sans); font-size:var(--prx-text-body-sz); color:var(--prx-text-body);
  background:#fff; border:1px solid var(--prx-border-strong); border-radius:var(--prx-radius-sm);
  transition:border-color .12s ease, box-shadow .12s ease;
}
.prx-textarea { height:auto; min-height:88px; padding:var(--prx-space-2) var(--prx-space-3); line-height:var(--prx-lh-normal); resize:vertical; }
.prx-input::placeholder, .prx-textarea::placeholder { color:#98A0A8; }
.prx-input:focus, .prx-textarea:focus, .prx-select select:focus { outline:none; border-color:var(--prx-primary); box-shadow:var(--prx-focus-glow); }
.prx-input:disabled, .prx-textarea:disabled { background:var(--prx-bg-panel); color:var(--prx-text-muted); cursor:not-allowed; }
.prx-input.is-invalid { border-color:var(--prx-danger-fill); box-shadow:0 0 0 3px rgba(180,35,24,.12); }

/* Number with unit suffix */
.prx-unit { display:flex; align-items:stretch; height:var(--prx-control-h); min-height:var(--prx-tap-min);
  background:#fff; border:1px solid var(--prx-border-strong); border-radius:var(--prx-radius-sm); overflow:hidden; }
.prx-unit:focus-within { border-color:var(--prx-primary); box-shadow:var(--prx-focus-glow); }
.prx-unit input { flex:1; min-width:0; border:none; outline:none; padding:0 var(--prx-space-3); text-align:right;
  font-family:var(--prx-font-data); font-feature-settings:var(--prx-tnum); font-size:var(--prx-text-body-sz); color:var(--prx-text-body); }
.prx-unit .unit { display:flex; align-items:center; padding:0 var(--prx-space-3); background:var(--prx-bg-panel);
  border-left:1px solid var(--prx-border); color:var(--prx-text-muted); font-size:var(--prx-text-small); font-weight:var(--prx-fw-semi); }

/* Date + Select share a trailing affordance */
.prx-select { position:relative; display:block; }
.prx-select select { appearance:none; -webkit-appearance:none; padding-right:34px; cursor:pointer; }
.prx-select .prx-select-chev { position:absolute; right:10px; top:50%; transform:translateY(-50%); width:16px; height:16px; color:var(--prx-text-muted); pointer-events:none; }
.prx-date { position:relative; }
.prx-date .prx-date-ic { position:absolute; right:10px; top:50%; transform:translateY(-50%); width:16px; height:16px; color:var(--prx-text-muted); pointer-events:none; }
.prx-date input { padding-right:34px; font-family:var(--prx-font-data); }

/* Multi-select */
.prx-multiselect { display:flex; flex-wrap:wrap; align-items:center; gap:var(--prx-space-1);
  min-height:var(--prx-control-h); padding:var(--prx-space-1) var(--prx-space-2); background:#fff;
  border:1px solid var(--prx-border-strong); border-radius:var(--prx-radius-sm); cursor:text; }
.prx-multiselect:focus-within { border-color:var(--prx-primary); box-shadow:var(--prx-focus-glow); }
.prx-tag { display:inline-flex; align-items:center; gap:var(--prx-space-1); height:22px; padding:0 var(--prx-space-1) 0 var(--prx-space-2);
  background:var(--prx-info-bg); color:var(--prx-primary); border:1px solid var(--prx-info-border);
  border-radius:var(--prx-radius-sm); font-size:var(--prx-text-small); font-weight:var(--prx-fw-semi); }
.prx-tag button { display:flex; align-items:center; justify-content:center; width:16px; height:16px; padding:0; border:none; background:transparent; color:var(--prx-primary); cursor:pointer; border-radius:2px; }
.prx-tag button:hover { background:rgba(36,68,148,.14); }
.prx-tag button svg { width:11px; height:11px; }
.prx-multiselect .prx-ms-input { flex:1; min-width:80px; border:none; outline:none; height:24px; font-size:var(--prx-text-body-sz); color:var(--prx-text-body); background:transparent; }

/* File upload */
.prx-file { display:flex; align-items:center; gap:var(--prx-space-3); padding:var(--prx-space-3) var(--prx-space-4);
  background:var(--prx-bg-panel); border:1px dashed var(--prx-border-strong); border-radius:var(--prx-radius-md); }
.prx-file:hover { border-color:var(--prx-primary); background:#fff; }
.prx-file .prx-file-ic { display:flex; align-items:center; justify-content:center; width:36px; height:36px; flex:none;
  color:var(--prx-primary); background:var(--prx-info-bg); border-radius:var(--prx-radius-sm); }
.prx-file .prx-file-ic svg { width:18px; height:18px; }
.prx-file .prx-file-main { flex:1; min-width:0; }
.prx-file .prx-file-title { font-size:var(--prx-text-body-sz); font-weight:var(--prx-fw-semi); color:var(--prx-text-body); }
.prx-file .prx-file-sub { font-size:var(--prx-text-small); color:var(--prx-text-muted); }

.prx-onblue .prx-label { color:rgba(255,255,255,.92); }
.prx-onblue .prx-hint { color:rgba(255,255,255,.7); }
.prx-onblue .prx-file { background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.4); }
.prx-onblue .prx-file .prx-file-title { color:#fff; }
.prx-onblue .prx-file .prx-file-sub { color:rgba(255,255,255,.7); }

/* ============ DATA TABLE ============ */
.prx-table-wrap { border:1px solid var(--prx-border); border-radius:var(--prx-radius-md); overflow:hidden; background:#fff; }
.prx-table { width:100%; border-collapse:separate; border-spacing:0; font-family:var(--prx-font-data); font-size:var(--prx-text-data-sz); }
.prx-table thead th { position:sticky; top:0; height:36px; padding:0 var(--prx-space-3); text-align:left;
  background:var(--prx-bg-panel); color:var(--prx-text-subtle); font-size:var(--prx-text-small); font-weight:var(--prx-fw-bold);
  text-transform:uppercase; letter-spacing:.04em; white-space:nowrap; border-bottom:1px solid var(--prx-border-strong); }
.prx-table tbody td { height:var(--prx-row-h); padding:0 var(--prx-space-3); color:var(--prx-text-body);
  border-bottom:1px solid var(--prx-border); white-space:nowrap; }
.prx-table tbody tr:last-child td { border-bottom:none; }
.prx-table td.num, .prx-table th.num { text-align:right; font-feature-settings:var(--prx-tnum); }
.prx-table .col-check { width:36px; text-align:center; }
.prx-table tbody tr:hover td { background:var(--prx-bg-hover); }
.prx-table tbody tr.is-selected td { background:var(--prx-bg-selected); }
.prx-table tbody tr.is-selected td:first-child { box-shadow:inset 3px 0 0 var(--prx-primary); }
.prx-table tbody tr.row-shortfall td { background:var(--prx-warning-bg); }
.prx-table tbody tr.row-shortfall:hover td { background:#F8EBC9; }
.prx-table tbody tr.row-shortfall td:first-child { box-shadow:inset 3px 0 0 var(--prx-warning-fill); }
.prx-table tbody tr.row-override td:first-child { box-shadow:inset 3px 0 0 var(--prx-danger-fill); }
.prx-check { width:16px; height:16px; accent-color:var(--prx-primary); cursor:pointer; }

/* ============ STATUS PILLS ============ */
.prx-pill { display:inline-flex; align-items:center; gap:6px; height:22px; padding:0 var(--prx-space-2);
  font-family:var(--prx-font-sans); font-size:var(--prx-text-small); font-weight:var(--prx-fw-semi); line-height:1;
  border:1px solid transparent; border-radius:var(--prx-radius-full); white-space:nowrap; }
.prx-pill .dot { width:6px; height:6px; border-radius:50%; flex:none; background:currentColor; }
.prx-pill svg { width:12px; height:12px; flex:none; }
.prx-pill--draft     { background:#EEF1F5; color:#56606B; border-color:#D8DEE5; }
.prx-pill--shortfall { background:var(--prx-warning-bg); color:var(--prx-warning-text); border-color:var(--prx-warning-border); }
.prx-pill--complete  { background:var(--prx-success-bg); color:var(--prx-success-text); border-color:var(--prx-success-border); }
.prx-pill--closed    { background:#E5E9EE; color:#3D4A59; border-color:#CCD4DE; }
.prx-pill--cancelled { background:#F2ECEC; color:#7A5450; border-color:#E2D2D0; }
.prx-pill--cancelled .label { text-decoration:line-through; }
.prx-pill--awaiting  { background:var(--prx-info-bg); color:var(--prx-info-text); border-color:var(--prx-info-border); }
.prx-pill--override  { background:var(--prx-gold-100); color:var(--prx-gold-700); border-color:var(--prx-warning-border); }

/* ============ INLINE SHORTFALL CHIP ============ */
.prx-chip-short { display:inline-flex; align-items:center; gap:6px; padding:1px var(--prx-space-2);
  background:var(--prx-warning-bg); color:var(--prx-warning-text); border:1px solid var(--prx-warning-border);
  border-radius:var(--prx-radius-sm); font-family:var(--prx-font-data); font-size:var(--prx-text-small); font-weight:var(--prx-fw-semi); }
.prx-chip-short svg { width:12px; height:12px; flex:none; color:var(--prx-warning-fill); }
.prx-chip-short .sep { opacity:.5; }
.prx-chip-short .exp { font-weight:var(--prx-fw-reg); }

/* ============ AUDIT TRAIL ============ */
.prx-audit { display:flex; flex-direction:column; padding-left:var(--prx-space-1); }
.prx-audit-item { position:relative; padding:0 0 var(--prx-space-4) var(--prx-space-5);
  border-left:2px solid var(--prx-border); margin-left:4px; }
.prx-audit-item:last-child { border-left-color:transparent; padding-bottom:0; }
.prx-audit-item::before { content:""; position:absolute; left:-6px; top:3px; width:9px; height:9px; border-radius:50%;
  background:var(--prx-primary); border:2px solid #fff; box-shadow:0 0 0 1px var(--prx-border); }
.prx-audit-item.is-override::before { background:var(--prx-danger-fill); }
.prx-audit-item.is-success::before { background:var(--prx-success-fill); }
.prx-audit-head { display:flex; align-items:center; gap:var(--prx-space-2); font-size:var(--prx-text-small); }
.prx-audit-head .time { font-family:var(--prx-font-mono); color:var(--prx-text-muted); }
.prx-audit-head .who  { font-weight:var(--prx-fw-bold); color:var(--prx-text-strong); }
.prx-audit-head .sep  { color:var(--prx-border-strong); }
.prx-audit-action { margin-top:2px; font-size:var(--prx-text-body-sz); font-weight:var(--prx-fw-semi); color:var(--prx-text-body); }
.prx-audit-reason { margin-top:var(--prx-space-1); padding:var(--prx-space-2) var(--prx-space-3);
  background:var(--prx-bg-panel); border-left:2px solid var(--prx-border-strong); border-radius:0 var(--prx-radius-sm) var(--prx-radius-sm) 0;
  font-size:var(--prx-text-small); color:var(--prx-text-subtle); }

/* ============ OVERRIDE MODAL ============ */
.prx-backdrop { position:fixed; inset:0; background:rgba(10,15,30,.45); display:flex; align-items:center; justify-content:center; padding:16px; z-index:1000; }
.prx-modal { width:480px; max-width:100%; background:#fff; border-radius:var(--prx-radius-lg);
  box-shadow:var(--prx-shadow-lg); border-top:4px solid var(--prx-warning-fill); overflow:hidden; }
.prx-modal-head { display:flex; align-items:flex-start; gap:var(--prx-space-3); padding:var(--prx-space-5); border-bottom:1px solid var(--prx-border); }
.prx-modal-head .ic { display:flex; align-items:center; justify-content:center; width:36px; height:36px; flex:none;
  background:var(--prx-warning-bg); color:var(--prx-warning-fill); border-radius:var(--prx-radius-sm); }
.prx-modal-head .ic svg { width:20px; height:20px; }
.prx-modal-title { font-size:var(--prx-text-h3); font-weight:var(--prx-fw-bold); color:var(--prx-text-strong); }
.prx-modal-sub { margin-top:2px; font-size:var(--prx-text-small); color:var(--prx-text-muted); }
.prx-modal-body { display:flex; flex-direction:column; gap:var(--prx-space-4); padding:var(--prx-space-5); }
.prx-counter { display:flex; justify-content:space-between; font-size:var(--prx-text-small); color:var(--prx-text-muted); }
.prx-counter.is-ok { color:var(--prx-success-text); font-weight:var(--prx-fw-semi); }
.prx-modal-foot { display:flex; justify-content:flex-end; gap:var(--prx-space-2); padding:var(--prx-space-4) var(--prx-space-5); background:var(--prx-bg-panel); border-top:1px solid var(--prx-border); }

/* ============ NOTIFICATION TOASTS ============ */
.prx-toast { display:flex; align-items:flex-start; gap:var(--prx-space-3); width:360px; max-width:100%;
  padding:var(--prx-space-3); background:#fff; border:1px solid var(--prx-border); border-left:4px solid var(--prx-ch, var(--prx-primary));
  border-radius:var(--prx-radius-md); box-shadow:var(--prx-shadow-md); }
.prx-toast .ch { display:flex; align-items:center; justify-content:center; width:34px; height:34px; flex:none; border-radius:var(--prx-radius-sm);
  background:color-mix(in srgb, var(--prx-ch) 14%, #fff); color:var(--prx-ch); }
.prx-toast .ch svg { width:18px; height:18px; }
.prx-toast .body { flex:1; min-width:0; }
.prx-toast .t-title { font-size:var(--prx-text-body-sz); font-weight:var(--prx-fw-bold); color:var(--prx-text-strong); }
.prx-toast .t-msg { margin-top:1px; font-size:var(--prx-text-small); color:var(--prx-text-subtle); }
.prx-toast .t-time { margin-top:var(--prx-space-1); font-family:var(--prx-font-mono); font-size:var(--prx-text-caption); color:var(--prx-text-muted); }
.prx-toast .t-close { flex:none; width:24px; height:24px; display:flex; align-items:center; justify-content:center; border:none; background:transparent; color:var(--prx-text-muted); cursor:pointer; border-radius:4px; }
.prx-toast .t-close:hover { background:var(--prx-bg-hover); color:var(--prx-text-body); }
.prx-toast--whatsapp { --prx-ch:#25925A; }
.prx-toast--sms { --prx-ch:#244494; }
.prx-toast--email { --prx-ch:#916B00; }

/* ============ APP HEADER (Desk-style) ============ */
.prx-appbar { display:flex; align-items:center; gap:var(--prx-space-4); height:56px; padding:0 var(--prx-space-4);
  background:#fff; border-bottom:1px solid var(--prx-border); }
.prx-logo { display:inline-flex; align-items:center; gap:2px; padding:3px 8px; border:1.5px solid var(--prx-red-logo);
  border-radius:var(--prx-radius-sm); flex:none; }
.prx-logo .name { font-family:var(--prx-font-sans); font-weight:800; font-size:16px; color:var(--prx-primary); letter-spacing:-.01em; }
.prx-logo .plus { color:var(--prx-red-logo); font-weight:800; font-size:13px; line-height:1; align-self:flex-start; margin-top:1px; }
.prx-crumbs { display:flex; align-items:center; gap:var(--prx-space-1); font-size:var(--prx-text-small); color:var(--prx-text-muted); }
.prx-crumbs a { color:var(--prx-text-muted); text-decoration:none; }
.prx-crumbs a:hover { color:var(--prx-primary); }
.prx-crumbs .here { color:var(--prx-text-strong); font-weight:var(--prx-fw-semi); }
.prx-crumbs svg { width:14px; height:14px; color:var(--prx-border-strong); }
.prx-search { position:relative; flex:1; max-width:420px; }
.prx-search svg { position:absolute; left:10px; top:50%; transform:translateY(-50%); width:16px; height:16px; color:var(--prx-text-muted); pointer-events:none; }
.prx-search input { width:100%; height:34px; padding:0 12px 0 32px; background:var(--prx-bg-page); border:1px solid var(--prx-border);
  border-radius:var(--prx-radius-sm); font-size:var(--prx-text-small); color:var(--prx-text-body); }
.prx-search input:focus { outline:none; background:#fff; border-color:var(--prx-primary); box-shadow:var(--prx-focus-glow); }
.prx-appbar-right { display:flex; align-items:center; gap:var(--prx-space-2); margin-left:auto; }
.prx-bell { position:relative; }
.prx-bell .badge { position:absolute; top:2px; right:2px; min-width:15px; height:15px; padding:0 3px; display:flex; align-items:center; justify-content:center;
  background:var(--prx-danger-fill); color:#fff; font-family:var(--prx-font-data); font-size:9px; font-weight:700; border-radius:999px; border:2px solid #fff; }
.prx-usermenu { display:flex; align-items:center; gap:var(--prx-space-2); height:38px; padding:0 var(--prx-space-2); border-radius:var(--prx-radius-sm); cursor:pointer; }
.prx-usermenu:hover { background:var(--prx-bg-hover); }
.prx-avatar { width:28px; height:28px; flex:none; display:flex; align-items:center; justify-content:center; border-radius:50%;
  background:var(--prx-primary); color:#fff; font-size:12px; font-weight:700; }
.prx-usermenu .uname { font-size:var(--prx-text-small); font-weight:var(--prx-fw-semi); color:var(--prx-text-body); }
.prx-usermenu .uchev { width:14px; height:14px; color:var(--prx-text-muted); }