/* =============================================================
   SwasthSetu - Patient 360 in-record additions (W4)
   All classes prefixed `p360-`. Light-theme tokens from
   app.css :root (incl. the print flip). Numerals in --mono.
   ============================================================= */

/* ---------- shared micro-type ---------- */
.p360-dim  { color: var(--faint); font-weight: 500; }
.p360-sub  { font: 500 10.5px var(--mono); color: var(--faint); margin-top: 2px; }
.p360-num  { font-family: var(--mono); }
.p360-attn-none { font-size: 12.5px; color: var(--faint); }
.p360-basisline { margin: 12px 0 0; font-size: 11.5px; line-height: 1.6; color: var(--faint); }
.p360-warnn { color: var(--warn-ink) !important; }

/* ---------- F-09 needs-attention strip ---------- */
.p360-attn {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
  margin-top: 14px; padding: 12px 16px;
  background: var(--panel); border: 1px solid color-mix(in oklab, var(--warn) 40%, transparent); border-radius: 12px;
}
.p360-attn.p360-attn-crit { border-color: color-mix(in oklab, var(--crit) 45%, transparent); }
.p360-attn.p360-attn-info { border-color: color-mix(in oklab, var(--cy) 40%, transparent); }
.p360-attn-empty { border-color: var(--line-soft); }
.p360-attn-label {
  font: 700 10.5px var(--mono); letter-spacing: 0.1em; text-transform: uppercase;
  color: var(--faint); margin-right: 4px;
}
.p360-attn-label b { font-family: var(--mono); color: var(--warn-ink); }
.p360-achip {
  font: 600 11.5px var(--mono); text-decoration: none; white-space: nowrap;
  border: 1px solid; border-radius: 999px; padding: 3px 12px;
  transition: border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
}
.p360-achip:hover { text-decoration: none; }
.p360-achip-go { opacity: 0.75; }
.p360-sev-crit { color: var(--crit-ink); background: var(--crit-bg); border-color: color-mix(in oklab, var(--crit) 45%, transparent); }
.p360-sev-warn { color: var(--warn-ink); background: var(--warn-bg); border-color: color-mix(in oklab, var(--warn) 40%, transparent); }
.p360-sev-info { color: var(--cy); background: color-mix(in oklab, var(--cy) 10%, transparent); border-color: color-mix(in oklab, var(--cy) 35%, transparent); }
.p360-achip.p360-sev-crit:hover { border-color: var(--crit); }
.p360-achip.p360-sev-warn:hover { border-color: var(--warn); }
.p360-achip.p360-sev-info:hover { border-color: var(--cy); }

/* ---------- F-10 summary freshness badge (inside .ai-label) ---------- */
.p360-badge {
  display: inline-block; margin-left: 6px; padding: 1.5px 8px;
  border: 1px solid; border-radius: 5px;
  font: 700 10px var(--mono); letter-spacing: 0.05em; vertical-align: 1px;
}
.p360-aged     { color: var(--warn-ink); background: var(--warn-bg); border-color: color-mix(in oklab, var(--warn) 40%, transparent); }
.p360-outdated { color: var(--crit-ink); background: var(--crit-bg); border-color: color-mix(in oklab, var(--crit) 45%, transparent); }
/* no .p360-fresh: staleBadge() returns '' for fresh - the plain generated-date
   text is the honest indicator (AC-10.2) */

/* ---------- F-11 summary basis ---------- */
.p360-basis { margin-top: 12px; }
.p360-basis > summary {
  cursor: pointer; list-style: none;
  font: 600 11.5px var(--mono); letter-spacing: 0.04em; color: var(--acc-dim);
  transition: color 180ms ease;
}
.p360-basis > summary::-webkit-details-marker { display: none; }
.p360-basis > summary::before { content: "› "; color: var(--faint); }
.p360-basis[open] > summary::before { content: "▾ "; color: var(--acc-hi); }
.p360-basis > summary:hover { color: var(--acc-hi); }
.p360-basis-body {
  margin-top: 8px; padding: 10px 14px;
  background: var(--panel-2); border: 1px solid var(--line-soft); border-radius: 10px;
}
.p360-basis-line { padding: 3px 0; font-size: 12.5px; color: var(--dim); }
.p360-etag { font: 700 11px var(--mono); color: var(--acc-hi); margin-right: 6px; }
.p360-bdim { color: var(--faint); }

/* ---------- F-12 ask this record ---------- */
.p360-askwrap { margin-top: 14px; }
.p360-ask { display: flex; gap: 8px; }
.p360-ask-in {
  flex: 1; min-width: 0; font: 13.5px var(--sans); color: var(--ink);
  background: var(--panel-2); border: 1px solid var(--line-soft); border-radius: 10px;
  padding: 8px 14px;
  transition: border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
}
.p360-ask-in::placeholder { color: var(--faint); }
.p360-ask-in:focus {
  outline: none; background: var(--panel); border-color: var(--acc-hi);
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--acc) 30%, transparent);
}
.p360-ask-btn {
  flex: none; font: 650 12.5px var(--sans); color: var(--acc-hi); cursor: pointer;
  background: color-mix(in oklab, var(--acc) 10%, transparent);
  border: 1px solid color-mix(in oklab, var(--acc) 35%, transparent);
  border-radius: 10px; padding: 8px 16px;
  transition: background 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}
.p360-ask-btn:hover {
  background: color-mix(in oklab, var(--acc) 18%, transparent);
  border-color: var(--acc-hi);
}
.p360-ask-note { margin: 8px 0 0; font-size: 11.5px; color: var(--faint); }
.p360-askres { margin-top: 4px; }
.p360-ask-reshead {
  display: flex; align-items: center; gap: 10px; margin-top: 10px;
  font: 650 12px var(--mono); color: var(--dim);
}
.p360-ask-clear {
  font: 600 11px var(--sans); color: var(--dim); cursor: pointer;
  background: var(--panel-2); border: 1px solid var(--line-soft); border-radius: 7px;
  padding: 3px 10px;
  transition: color 180ms ease, border-color 180ms ease;
}
.p360-ask-clear:hover { color: var(--ink); border-color: var(--line); }
.p360-ask-group { margin-top: 10px; }
.p360-ask-gt {
  font: 700 10.5px var(--mono); letter-spacing: 0.09em; text-transform: uppercase;
  color: var(--faint); margin-bottom: 4px;
}
.p360-ask-gt .cnt { font-weight: 600; }
.p360-ask-hit {
  display: flex; align-items: baseline; gap: 10px;
  margin: 4px 0; padding: 8px 12px;
  font-size: 12.5px; color: var(--dim); text-decoration: none;
  background: var(--panel-2); border: 1px solid var(--line-soft); border-radius: 9px;
  transition: border-color 180ms ease, background 180ms ease;
}
.p360-ask-hit:hover {
  border-color: color-mix(in oklab, var(--acc) 50%, transparent);
  background: var(--hover); text-decoration: none;
}
.p360-ask-snip { flex: 1; min-width: 0; }
.p360-ask-go { flex: none; font: 650 11.5px var(--sans); color: var(--acc-hi); }
.p360-ask-hint, .p360-ask-none { margin: 10px 0 0; font-size: 12.5px; color: var(--faint); }

/* ---------- F-08 journey type filters ---------- */
.p360-jbar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0 0 16px; }
.p360-jlabel {
  font: 650 10.5px var(--mono); letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--faint); margin-right: 4px;
}
.p360-jchip {
  font: 600 11.5px var(--mono); color: var(--dim); cursor: pointer;
  background: var(--panel); border: 1px solid var(--line-soft); border-radius: 999px;
  padding: 4px 13px;
  transition: color 180ms ease, border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
}
.p360-jchip:hover { color: var(--ink); border-color: var(--line); }
.p360-jchip.on, .p360-jchip[aria-pressed="true"] {
  color: var(--acc-hi); border-color: var(--acc);
  background: color-mix(in oklab, var(--acc) 12%, transparent);
}

/* ---------- F-07 lab trends ---------- */
.p360-trends {
  margin: 0 0 16px; padding: 14px 16px 10px;
  background: var(--panel); border: 1px solid var(--line-soft); border-radius: 12px;
}
.p360-tr-head {
  font: 700 10.5px var(--mono); letter-spacing: 0.09em; text-transform: uppercase;
  color: var(--faint); margin-bottom: 6px;
}
.p360-tr-row {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px;
  margin: 0 -10px; padding: 8px 10px; border-radius: 9px;
  color: var(--dim); text-decoration: none;
  transition: background 180ms ease;
}
.p360-tr-row:hover { background: var(--hover); text-decoration: none; }
.p360-tr-name { flex: none; min-width: 130px; font-size: 13px; font-weight: 650; color: var(--ink); }
.p360-spark { flex: none; width: 120px; height: 28px; }
.p360-sp-line { stroke: var(--acc-dim); stroke-width: 1.6; stroke-linejoin: round; stroke-linecap: round; }
.p360-sp-dot { fill: var(--acc-dim); }
.p360-sp-dot-w { fill: var(--warn); }
.p360-sp-dot-c { fill: var(--crit); }
.p360-tr-vals { font: 650 12.5px var(--mono); color: var(--ink); white-space: nowrap; }
.p360-tr-ref { font: 500 11px var(--mono); color: var(--faint); white-space: nowrap; }
.p360-tr-none { color: var(--faint); font-family: var(--mono); }
.p360-tr-seq { font-size: 12px; color: var(--dim); }
.p360-tr-seqpt { white-space: nowrap; }
.p360-tr-seqpt i { font-style: normal; font: 500 10.5px var(--mono); color: var(--faint); }

/* ---------- current-medications panel ---------- */
.p360-meds {
  margin-top: 14px; padding: 14px 16px 8px;
  background: var(--panel); border: 1px solid var(--line-soft); border-radius: 12px;
}
.p360-med {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px;
  padding: 9px 0; border-top: 1px solid var(--line-soft);
}
.p360-med-main { flex: 1 1 240px; min-width: 0; }
.p360-med-main b { font-size: 13.5px; font-weight: 650; color: var(--ink); }
.p360-med-side {
  margin-left: auto; display: flex; align-items: center; gap: 10px;
  text-align: right;
}

/* ---------- F-06 medication reconciliation ---------- */
.p360-recon-sum { margin: 0 0 14px; font-size: 13px; color: var(--dim); }
.p360-recon-sum b { font: 700 15px var(--mono); color: var(--acc-hi); }
.p360-rxlinks { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
details.p360-gap { border-color: color-mix(in oklab, var(--warn) 45%, transparent); }
.p360-gapmark {
  font: 700 9.5px var(--mono); letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--warn-ink); background: var(--warn-bg);
  border: 1px solid color-mix(in oklab, var(--warn) 40%, transparent);
  border-radius: 5px; padding: 2px 7px;
}
.p360-st {
  display: inline-block; font: 650 11px var(--mono); letter-spacing: 0.03em;
  white-space: nowrap; border: 1px solid; border-radius: 5px; padding: 2px 9px;
}
.p360-st-filled    { color: var(--ok-ink);   background: var(--ok-bg);   border-color: color-mix(in oklab, var(--ok) 40%, transparent); }
.p360-st-partial   { color: var(--warn-ink); background: var(--warn-bg); border-color: color-mix(in oklab, var(--warn) 40%, transparent); }
.p360-st-none      { color: var(--warn-ink); background: var(--warn-bg); border-color: color-mix(in oklab, var(--warn) 40%, transparent); }
.p360-st-refused   { color: var(--crit-ink); background: var(--crit-bg); border-color: color-mix(in oklab, var(--crit) 45%, transparent); }
.p360-st-untracked { color: var(--cy);       background: color-mix(in oklab, var(--cy) 10%, transparent); border-color: color-mix(in oklab, var(--cy) 35%, transparent); }
.p360-st-unknown   { color: var(--faint);    background: var(--panel-2); border-color: var(--line-soft); }

/* ---------- F-14 document index ---------- */
.p360-index > summary .cnt { font-weight: 500; font-size: 12px; color: var(--faint); }
.p360-ix-line {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px;
  padding: 6px 0; border-bottom: 1px solid var(--line-soft);
  font-size: 12.5px; break-inside: avoid;
}
.p360-ix-line:last-of-type { border-bottom: 0; }
.p360-ix-kind {
  flex: none; min-width: 58px; text-align: center;
  font: 650 9.5px var(--mono); letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--dim); background: var(--panel-2);
  border: 1px solid var(--line-soft); border-radius: 5px; padding: 1.5px 7px;
}
.p360-k-enc { color: var(--dim); }
.p360-k-rx  { color: var(--acc-dim); }
.p360-k-rpt { color: var(--cy); }
.p360-k-phr { color: var(--ok-ink); }
.p360-ix-date { font: 500 11.5px var(--mono); color: var(--faint); white-space: nowrap; }
.p360-ix-fac { color: var(--dim); }

/* ---------- responsive ---------- */
@media (max-width: 760px) {
  .p360-tr-name { min-width: 100px; }
  .p360-spark { width: 96px; }
  .p360-ask { flex-direction: column; }
  .p360-ask-btn { align-self: flex-start; }
}

/* ---------- print ----------
   details open via the existing beforeprint handler; only interactive
   chrome (ask form, journey chips) is hidden. Tokens flip to the light
   sheet via app.css :root print block automatically. */
@media print {
  .p360-askwrap, .p360-jbar { display: none !important; }
  .p360-attn, .p360-trends, .p360-basis-body { box-shadow: none; break-inside: avoid; }
  .p360-tr-row, .p360-ix-line { break-inside: avoid; }  /* rows never split mid-line (AC-14.2) */
}