/* Healthcare cinema — accent overrides + a few extras layered on
   top of styles-finance-cinema.css. Keep .fin-* classes; just swap
   the accent palette via body.hc class. */
@import url("colors_and_type.css");

body.hc {
  --fin-blue: #14B8A6;
  --fin-cyan: #2DD4BF;
  --fin-mint: #6EE7B7;
  --fin-violet: #818CF8;
  --fin-gold: #FCD34D;
  --fin-rose: #FB7185;
}

/* Vital-signs sparkline widget used in healthcare hero / use case */
.hc-vitals {
  background: rgba(10,14,34,0.94);
  backdrop-filter: blur(14px);
  border: 1px solid rgba(255,255,255,0.16);
  border-radius: 14px;
  padding: 14px 16px;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  box-shadow: 0 24px 60px -20px rgba(0,0,0,0.7);
}
.hc-vitals-h { display: flex; justify-content: space-between; align-items: center; font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: rgba(234,242,255,0.5); padding-bottom: 10px; border-bottom: 1px solid rgba(255,255,255,0.06); margin-bottom: 10px; }
.hc-vitals-h .live { color: #6EE7B7; display: inline-flex; gap: 6px; align-items: center; }
.hc-vitals-h .live::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: #6EE7B7; box-shadow: 0 0 8px #6EE7B7; animation: finPulse 1.4s infinite; }
.hc-vitals-row { display: grid; grid-template-columns: 1fr 80px auto; gap: 10px; align-items: center; padding: 7px 0; font-size: 11.5px; border-bottom: 1px dashed rgba(255,255,255,0.05); }
.hc-vitals-row:last-child { border-bottom: none; }
.hc-vitals-row span { color: rgba(234,242,255,0.7); }
.hc-vitals-row b { color: #fff; font-weight: 500; font-variant-numeric: tabular-nums; }
.hc-vitals-row svg { width: 70px; height: 18px; }

/* Triage list (live ED widget) */
.hc-triage {
  background: rgba(8,14,28,0.92);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 16px;
  padding: 24px;
  display: flex; flex-direction: column; gap: 14px;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
}
.hc-triage-h { display: flex; justify-content: space-between; align-items: center; padding-bottom: 14px; border-bottom: 1px solid rgba(255,255,255,0.08); }
.hc-triage-h-t { color: #fff; font-size: 13px; font-weight: 600; letter-spacing: -0.01em; }
.hc-triage-h-l { color: #6EE7B7; font-size: 10.5px; letter-spacing: 0.18em; text-transform: uppercase; display: inline-flex; align-items: center; gap: 6px; }
.hc-triage-h-l::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: #6EE7B7; box-shadow: 0 0 8px #6EE7B7; animation: finPulse 1.4s infinite; }
.hc-triage-row {
  display: grid; grid-template-columns: 56px 1fr 60px 100px; gap: 10px; align-items: center;
  padding: 10px 12px;
  background: rgba(255,255,255,0.02);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 8px;
  font-size: 11.5px;
  animation: finRowIn 0.5s ease;
}
.hc-triage-row.is-new { background: rgba(45,212,191,0.06); border-color: rgba(45,212,191,0.28); }
.hc-triage-row.is-crit { background: rgba(251,113,133,0.06); border-color: rgba(251,113,133,0.28); }
.hc-triage-id { color: rgba(234,242,255,0.5); }
.hc-triage-desc { color: rgba(234,242,255,0.92); font-family: ui-sans-serif, system-ui, sans-serif; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hc-triage-acuity { text-align: center; padding: 2px 6px; border-radius: 4px; font-weight: 600; }
.hc-triage-acuity.l1 { background: rgba(251,113,133,0.14); color: #FB7185; }
.hc-triage-acuity.l2 { background: rgba(252,211,77,0.14); color: #FCD34D; }
.hc-triage-acuity.l3 { background: rgba(110,231,183,0.14); color: #6EE7B7; }
.hc-triage-act { text-align: right; color: #2DD4BF; font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; }