/*
 * Service Handoff — feature styles (hf-* prefix). Layered on the .pn-page
 * terminal theme from progress-oneshot.css. Intentionally theme-agnostic:
 * uses currentColor + translucent overlays so it reads on both the dark
 * Dark Roast palette and the roast-ladder light skins without hard-coding
 * a background. Handoff-specific surfaces only; layout comes from pn-*.
 */

.hf-service-row { display: flex; gap: 12px; }
.hf-field-half { flex: 1; min-width: 0; }

.hf-text-input {
  width: 100%;
  box-sizing: border-box;
  padding: 8px 10px;
  font: 400 0.9rem/1.3 'DM Sans', system-ui, sans-serif;
  color: inherit;
  background: rgba(127, 127, 127, 0.08);
  border: 1px solid rgba(127, 127, 127, 0.35);
  border-radius: 6px;
}
.hf-text-input:focus {
  outline: none;
  border-color: currentColor;
  background: rgba(127, 127, 127, 0.14);
}

/* ---- roster header + mini buttons ---- */
.hf-roster-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin: 14px 0 6px;
}
.hf-roster-actions { display: flex; align-items: center; gap: 6px; }
.hf-roster-count { font-size: 0.78rem; opacity: 0.75; }

.hf-mini-btn {
  padding: 3px 9px;
  font: 500 0.76rem/1 'JetBrains Mono', monospace;
  color: inherit;
  background: rgba(127, 127, 127, 0.1);
  border: 1px solid rgba(127, 127, 127, 0.4);
  border-radius: 5px;
  cursor: pointer;
}
.hf-mini-btn:hover { background: rgba(127, 127, 127, 0.22); }

.hf-roster-status { font-size: 0.82rem; opacity: 0.8; padding: 6px 0; }

/* ---- roster list ---- */
.hf-roster-list {
  list-style: none;
  margin: 0;
  padding: 0;
  flex: 1;
  overflow-y: auto;
  min-height: 120px;
}
.hf-row {
  border: 1px solid rgba(127, 127, 127, 0.28);
  border-radius: 7px;
  margin-bottom: 6px;
  transition: border-color 0.12s, background 0.12s;
}
.hf-row-selected {
  border-color: currentColor;
  background: rgba(127, 127, 127, 0.08);
}
.hf-row-main {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  cursor: pointer;
}
.hf-row-check { width: 16px; height: 16px; flex: 0 0 auto; accent-color: currentColor; }
.hf-row-room {
  font: 600 0.86rem/1 'JetBrains Mono', monospace;
  min-width: 62px;
  flex: 0 0 auto;
}
.hf-row-ident { flex: 1; min-width: 0; font-size: 0.86rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hf-row-badge { flex: 0 0 auto; }

.hf-badge {
  display: inline-block;
  padding: 2px 7px;
  font: 500 0.7rem/1.2 'JetBrains Mono', monospace;
  border: 1px solid rgba(127, 127, 127, 0.5);
  border-radius: 999px;
  opacity: 0.85;
  white-space: nowrap;
}
.hf-badge-muted { opacity: 0.5; }
.hf-badge-fresh { border-color: rgba(80, 200, 120, 0.8); color: rgb(80, 200, 120); }
.hf-badge-warn  { border-color: rgba(230, 160, 60, 0.85); color: rgb(230, 160, 60); }

.hf-row-override { padding: 0 10px 8px; }
.hf-override-input {
  width: 100%;
  box-sizing: border-box;
  padding: 6px 8px;
  font: 400 0.82rem/1.35 'DM Sans', system-ui, sans-serif;
  color: inherit;
  background: rgba(127, 127, 127, 0.06);
  border: 1px dashed rgba(127, 127, 127, 0.4);
  border-radius: 5px;
  resize: vertical;
}

/* ---- outside (off-census) patients ---- */
.hf-add-outside {
  width: 100%;
  margin: 4px 0 10px;
  padding: 7px 10px;
  font: 500 0.8rem/1.2 'JetBrains Mono', monospace;
  color: inherit;
  background: transparent;
  border: 1px dashed rgba(127, 127, 127, 0.45);
  border-radius: 7px;
  cursor: pointer;
  text-align: center;
}
.hf-add-outside:hover { background: rgba(127, 127, 127, 0.1); border-color: currentColor; }
.hf-add-outside-sub { font-size: 0.7rem; opacity: 0.6; margin-left: 4px; }

.hf-row-adhoc { border-style: dashed; }
.hf-badge-outside { border-color: rgba(120, 160, 230, 0.8); color: rgb(120, 160, 230); }
.hf-adhoc-fields {
  display: flex;
  gap: 6px;
  padding: 0 10px 6px;
}
.hf-adhoc-fields .hf-adhoc-input { flex: 1; min-width: 0; padding: 5px 8px; font-size: 0.82rem; }
.hf-adhoc-fields .hf-adhoc-narrow { flex: 0 0 58px; }
.hf-adhoc-remove { flex: 0 0 auto; margin-left: auto; opacity: 0.7; }
.hf-adhoc-remove:hover { opacity: 1; }
.hf-char-count {
  text-align: right;
  font: 400 0.68rem/1.4 'JetBrains Mono', monospace;
  opacity: 0.6;
  min-height: 1em;
}
.hf-char-count-over { color: rgb(230, 90, 80); opacity: 1; font-weight: 600; }

/* ---- validation banner (degrade-not-annihilate) ---- */
.hf-banner {
  margin: 8px 0;
  padding: 8px 12px;
  font: 500 0.82rem/1.4 'DM Sans', system-ui, sans-serif;
  color: rgb(230, 160, 60);
  background: rgba(230, 160, 60, 0.1);
  border: 1px solid rgba(230, 160, 60, 0.55);
  border-radius: 6px;
}

/* ---- output ---- */
.hf-output {
  white-space: pre-wrap;
  word-wrap: break-word;
  font: 400 0.9rem/1.55 'DM Sans', system-ui, sans-serif;
}
/* Per-line typography from renderStyled(): patient header gets a rule + air,
   section labels get weight. Spans only — the text itself is untouched. */
.hf-pt-header {
  display: block;
  margin-top: 1.6em;
  padding-top: 0.7em;
  border-top: 1px solid rgba(127, 127, 127, 0.35);
  font-size: 1.08em;
  font-weight: 700;
  letter-spacing: 0.01em;
}
.hf-output > .hf-pt-header:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.hf-pt-section { font-weight: 700; }
.hf-editable { outline: none; }
.hf-editable:focus { box-shadow: inset 0 0 0 1px rgba(127, 127, 127, 0.4); border-radius: 6px; }

/* ---- correction bar ---- */
.hf-correct-bar {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 0;
}
.hf-correct-bar .hf-text-input { flex: 1; }
.hf-mic-btn { font-size: 0.95rem; line-height: 1; padding: 4px 8px; }

/* ---- saved handoffs list ---- */
.hf-saved-open {
  display: block;
  width: 100%;
  text-align: left;
  padding: 7px 9px;
  color: inherit;
  background: rgba(127, 127, 127, 0.06);
  border: 1px solid rgba(127, 127, 127, 0.28);
  border-radius: 6px;
  cursor: pointer;
}
.hf-saved-open:hover { background: rgba(127, 127, 127, 0.16); }
.hf-saved-date { font: 600 0.8rem/1 'JetBrains Mono', monospace; margin-right: 8px; }
.hf-saved-meta { font-size: 0.75rem; opacity: 0.7; }
.hf-saved-preview {
  display: block;
  margin-top: 3px;
  font-size: 0.78rem;
  opacity: 0.7;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ---- source picker (which note compiles into this block) ---- */
.hf-row-picker:empty { display: none; }
.hf-row-picker { padding: 0 10px 6px 34px; }
.hf-source-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font: 500 0.7rem/1.4 'DM Sans', system-ui, sans-serif;
  opacity: 0.75;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.hf-source-select {
  font: 400 0.78rem/1.3 'DM Sans', system-ui, sans-serif;
  padding: 3px 6px;
  border-radius: 5px;
  border: 1px solid rgba(127, 127, 127, 0.4);
  background: transparent;
  color: inherit;
  text-transform: none;
  letter-spacing: 0;
  max-width: 15rem;
}

/* ---- provenance strip: what each block was built from ---- */
.hf-provenance {
  margin: 8px 0 0;
  border-top: 1px solid rgba(127, 127, 127, 0.25);
  padding-top: 8px;
}
.hf-prov-head { display: flex; align-items: baseline; gap: 10px; }
.hf-prov-title {
  font: 600 0.7rem/1.4 'DM Sans', system-ui, sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  opacity: 0.75;
}
.hf-prov-sub { font: 400 0.75rem/1.4 'DM Sans', system-ui, sans-serif; opacity: 0.65; }
.hf-prov-sub.hf-prov-warn { color: rgb(230, 160, 60); opacity: 1; }
.hf-prov-list { list-style: none; margin: 6px 0 0; padding: 0; }
.hf-prov-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 3px 0;
  font: 400 0.78rem/1.4 'DM Sans', system-ui, sans-serif;
  border-left: 2px solid transparent;
  padding-left: 8px;
}
.hf-prov-header { flex: 1 1 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hf-prov-source { flex: 0 0 auto; opacity: 0.7; font-size: 0.74rem; }
.hf-prov-redo { flex: 0 0 auto; }
.hf-prov-fresh { border-left-color: rgba(80, 200, 120, 0.7); }
.hf-prov-pasted { border-left-color: rgba(127, 127, 127, 0.5); }
.hf-prov-stale { border-left-color: rgba(230, 160, 60, 0.85); }
.hf-prov-stale .hf-prov-source { color: rgb(230, 160, 60); opacity: 1; }
.hf-prov-none { border-left-color: rgba(230, 90, 80, 0.9); }
.hf-prov-none .hf-prov-source { color: rgb(230, 90, 80); opacity: 1; font-weight: 600; }

/* ---- saved-handoff delete (two-click, no modal) ---- */
.qd-saved-item { display: flex; align-items: flex-start; gap: 6px; }
.qd-saved-item .hf-saved-open { flex: 1 1 auto; }
.hf-saved-del { flex: 0 0 auto; opacity: 0.55; }
.hf-saved-del:hover { opacity: 1; }
.hf-saved-del-armed {
  opacity: 1;
  color: rgb(230, 90, 80);
  border-color: rgba(230, 90, 80, 0.8);
}