/* Health form questions (form-ui.js), shared by the phone check-in and the front desk */
.nf-q{display:grid;gap:8px}
.nf-q + .nf-q,.nf-heading + .nf-q{margin-top:2px}
.nf-label{font-weight:600;font-size:14.5px;color:var(--ink)}
.nf-follow{border-left:3px solid var(--accent-soft);padding-left:12px;margin-left:2px}
.nf-heading{font:600 16px/1.3 var(--display);color:var(--ink);margin-top:10px;padding-top:12px;border-top:1px solid var(--line)}
.nf-choice{display:flex;flex-wrap:wrap;gap:8px}
.nf-choice button{flex:1 1 auto;min-height:46px;border:1.5px solid var(--line-2);background:var(--surface);border-radius:12px;padding:10px 12px;font-size:15px;font-weight:500;color:var(--ink)}
.nf-choice button[aria-checked=true]{border-color:var(--accent);background:var(--accent-soft);color:var(--accent);font-weight:600}
.nf-choice.two{display:grid;grid-template-columns:1fr 1fr}
.nf-choice.many button{flex:0 0 calc(16.66% - 7px);min-width:44px;padding:10px 0}
.nf-list{display:grid;gap:10px}
.nf-row{display:grid;gap:8px;border:1px solid var(--line);border-radius:14px;padding:12px;background:var(--surface-2);position:relative}
.nf-field{display:grid;gap:4px}
.nf-field span{font-size:12px;font-weight:600;color:var(--ink-2)}
.nf-rm{justify-self:end;border:0;background:none;color:var(--bad);font-weight:600;font-size:13px;padding:2px 0}
.nf-add{border:1.5px dashed var(--accent);background:var(--surface);color:var(--accent);border-radius:12px;padding:12px;font-weight:600;font-size:15px;text-align:center}
.nf-none{display:flex;gap:10px;align-items:center;font-size:14.5px;color:var(--ink-2)}
.nf-none input{width:20px;height:20px;accent-color:var(--accent)}
.nf-list.is-none .nf-none{border:1.5px solid var(--accent);background:var(--accent-soft);color:var(--accent);border-radius:12px;padding:12px;font-weight:600}
.nf-pharm{display:grid;gap:8px}
.nf-pres{display:grid;gap:8px}
.nf-popt{display:flex;align-items:center;gap:10px;border:1px solid var(--line-2);border-radius:12px;padding:10px 12px;background:var(--surface)}
.nf-pick{flex:1;display:grid;gap:2px;text-align:left;border:0;background:none;padding:0;color:var(--ink)}
.nf-pick b{font-size:15px}
.nf-link{border:0;background:none;color:var(--accent);font-weight:600;font-size:13.5px;text-decoration:underline;text-underline-offset:2px;padding:4px 0;white-space:nowrap}
.nf-pempty{padding:2px 2px}
.nf-pharm-picked{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;border:1.5px solid var(--ok);background:var(--ok-soft);border-radius:14px;padding:12px 14px}
.nf-pharm-acts{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.nf-pharm-manual{display:grid;gap:10px;border:1px solid var(--line);border-radius:14px;padding:12px;background:var(--surface-2)}
.nf-pharm-manual .nf-pharm-acts{flex-direction:row;align-items:center;gap:14px}
/* on phones: name on its own line, the short fields side by side */
.nf-row.nf-cols-3{grid-template-columns:1fr 1fr}
.nf-row.nf-cols-3 .nf-field:first-child,.nf-row .nf-rm{grid-column:1 / -1}
.nf-row.nf-cols-2{grid-template-columns:1.6fr 1fr}
@media (min-width:640px){
  .nf-row .nf-rm,.nf-row.nf-cols-3 .nf-field:first-child{grid-column:auto}
  .nf-row.nf-cols-3{grid-template-columns:2fr 1fr 1.4fr auto;align-items:end}
  .nf-row.nf-cols-2{grid-template-columns:2fr 1fr auto;align-items:end}
  .nf-row .nf-rm{align-self:center;padding-top:18px}
}
