
/* Partner portal, shared by provider.html, patient.html and report.html. Milestones only, no sidebar. */
body { margin: 0; }
.pbar { background: var(--side); color: var(--side-fg); }
.pbar .in { max-width: 960px; margin: 0 auto; min-height: 56px; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); }
.pbar .brand { padding: 0; border: 0; }
.pbar .brand .wm { color: #fff; }
.pbar .brand small { display: block; font-size: 11.5px; color: var(--side-fg-2); }
.pbar .me { font-size: 12.5px; display: flex; align-items: center; gap: 12px; text-align: right; }
.pbar .me b { color: #fff; font-weight: 600; }
.pbar .me a { color: var(--side-fg-2); }
.wrap { max-width: 960px; margin: 0 auto; padding-block: 28px 60px; padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); display: flex; flex-direction: column; gap: 16px; }
.wrap h1 { margin: 0; font-size: 22px; font-weight: 700; letter-spacing: -0.02em; }
.sec { padding: 0; }
.sec .hd { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 14px 18px 10px; flex-wrap: wrap; }
.sec .hd h2 { margin: 0; font-size: 15px; font-weight: 700; display: flex; align-items: center; gap: 8px; }
.sec .hd h2 .n { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 22px; padding: 0 7px; border-radius: 999px; background: var(--rose-bg); color: var(--rose-fg); font-size: 12px; font-weight: 700; }
.sec .hd h2 .n.calm { background: var(--slate-bg); color: var(--slate-fg); }
.sec .hd .sub { font-size: 12.5px; color: var(--fg-3); }
.sec .sub2 { padding: 12px 18px 6px; font-size: 12px; font-weight: 600; color: var(--fg-3); text-transform: uppercase; letter-spacing: .05em; border-top: 1px solid var(--line); }
.need-it { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 16px; align-items: center; padding: 12px 18px; border-top: 1px solid var(--line); }
.need-it.rose { background: var(--tint-rose); } .need-it.amber { background: var(--tint-amber); }
.need-it b { font-size: 14px; }
.need-it .why { font-size: 13px; color: var(--fg-2); line-height: 1.5; max-width: 70ch; }
.need-it .why b { font-size: inherit; color: var(--fg); }
.need-it .act { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
.need-it .reply { grid-column: 1 / -1; display: none; gap: 8px; flex-wrap: wrap; align-items: center; }
.need-it .reply.on { display: flex; }
.need-it .reply button.c { font: inherit; font-size: 12.5px; font-weight: 600; border: 1px solid var(--line-strong); background: var(--card); color: var(--fg-2); border-radius: 999px; padding: 5px 11px; cursor: pointer; }
.need-it .reply button.c.active { background: var(--accent-soft); border-color: var(--accent); color: var(--accent-fg); }
.need-it.is-done { opacity: .75; }
.empty { padding: 14px 18px; font-size: 13px; color: var(--fg-3); border-top: 1px solid var(--line); }
.arr { display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 4px 16px; padding: 12px 18px; border-top: 1px solid var(--line); align-items: baseline; }
.arr .when { font-family: var(--mono); font-size: 12.5px; color: var(--fg-3); }
.arr b { font-size: 14px; }
.arr .ln { font-size: 13px; color: var(--fg-2); line-height: 1.5; }
.arr .ln .landed { color: var(--green-fg); font-weight: 600; }
.ftabs { display: flex; gap: 2px; background: var(--slate-bg); border-radius: 8px; padding: 2px; }
.ftabs button { font: inherit; font-size: 12.5px; font-weight: 600; border: 0; background: transparent; color: var(--fg-2); border-radius: 6px; padding: 5px 10px; cursor: pointer; }
.ftabs button.active { background: var(--card); color: var(--fg); box-shadow: 0 1px 2px rgba(15, 23, 42, .12); }
table.refs th:nth-child(3), table.refs td:nth-child(3) { min-width: 200px; }
table.refs td { vertical-align: middle; }
table.refs td.pt b { font-size: 13.5px; display: block; }
table.refs td.pt span { font-size: 12px; color: var(--fg-3); }
table.refs td.ap { white-space: nowrap; font-size: 12.5px; color: var(--fg-2); }
table.refs td.ap small { display: block; color: var(--fg-3); font-family: var(--mono); font-size: 11.5px; }
.mini { display: flex; align-items: center; gap: 8px; }
.mini .dots { display: flex; align-items: center; }
.mini .dots i { width: 9px; height: 9px; border-radius: 50%; background: var(--card); border: 2px solid var(--line-strong); box-sizing: border-box; }
.mini .dots i + i { margin-left: 8px; position: relative; }
.mini .dots i + i::before { content: ""; position: absolute; right: 100%; top: 50%; width: 8px; height: 2px; margin-top: -1px; background: var(--line); }
.mini .dots i.d { background: var(--ok); border-color: var(--ok); }
.mini .dots i.d + i::before { background: var(--ok); }
.mini .dots i.c { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.mini .w { font-size: 12.5px; font-weight: 600; white-space: nowrap; }
.mini .w.c { color: var(--accent-fg); } .mini .w.ok { color: var(--green-fg); } .mini .w.no { color: var(--fg-3); }
table.refs td.nt { font-size: 12.5px; color: var(--fg-2); line-height: 1.45; max-width: 36ch; }
table.refs td.nt .hold { color: var(--rose-fg); font-weight: 600; }
table.refs td.nt .help { color: var(--amber-fg); font-weight: 600; }
table.refs tr[hidden] { display: none; }
.quarter { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; padding: 14px 18px; font-size: 13px; color: var(--fg-2); line-height: 1.5; }
.quarter b { color: var(--fg); }
.quarter .sp { flex: 1 1 auto; }
.what { padding: 14px 18px; display: grid; gap: 6px; font-size: 12.5px; color: var(--fg-3); line-height: 1.5; }
.what b { color: var(--fg-2); }
.ref { padding: 16px 18px; display: grid; gap: 10px; }
.ref .top { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 14px; }
.ref .top b { font-size: 15px; }
.ref .top .mono { font-size: 12px; color: var(--fg-3); }
.form { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.form .f { display: grid; gap: 4px; min-width: 0; }
.form .wide { grid-column: 1 / -1; }
.form label { font-size: 11.5px; font-weight: 600; color: var(--fg-3); text-transform: uppercase; letter-spacing: .05em; }
.form input, .form select, .form textarea { min-height: 40px; padding: 8px 12px; border-radius: 8px; border: 1px solid var(--line-strong); background: var(--input); color: var(--fg); font: inherit; font-size: 14px; }
.form textarea { min-height: 72px; resize: vertical; }
.form label.att { text-transform: none; letter-spacing: 0; font-weight: 400; font-size: 13px; display: flex; align-items: flex-start; gap: 8px; color: var(--fg-2); }
.form .att input { min-height: 0; margin-top: 3px; }
.form .rad { display: grid; gap: 6px; }
.form .rad label { text-transform: none; letter-spacing: 0; font-weight: 400; font-size: 13px; display: flex; align-items: flex-start; gap: 8px; color: var(--fg-2); line-height: 1.45; }
.form .rad input { min-height: 0; margin-top: 3px; }
.retbox { display: inline-flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.retbox input { min-height: 32px; padding: 4px 8px; border-radius: 8px; border: 1px solid var(--line-strong); background: var(--input); color: var(--fg); font: inherit; font-size: 13px; }
.fine { font-size: 12.5px; color: var(--fg-3); line-height: 1.5; margin: 0; }
@media (max-width: 640px) {
  .need-it { grid-template-columns: 1fr; } .need-it .act { justify-content: flex-start; }
  .arr { grid-template-columns: 1fr; }
  .pbar .me span span { display: none; }
}

/* Bar: bell and account menu */
.pbar .right { display: flex; align-items: center; gap: 10px; position: relative; }
.pbar .ib { width: 34px; height: 34px; border-radius: 8px; border: 0; background: transparent; color: var(--side-fg); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; position: relative; }
.pbar .ib:hover { background: var(--side-hover); color: #fff; }
.pbar .ib .n { position: absolute; top: 5px; right: 5px; width: 8px; height: 8px; border-radius: 50%; background: #ff7a90; }
.pbar .acct { display: flex; align-items: center; gap: 8px; border: 0; background: transparent; color: var(--side-fg); cursor: pointer; font: inherit; font-size: 12.5px; text-align: right; padding: 4px 6px; border-radius: 8px; }
.pbar .acct:hover { background: var(--side-hover); }
.pbar .acct b { color: #fff; font-weight: 600; display: block; }
.pbar .acct .av { width: 30px; height: 30px; border-radius: 50%; background: var(--side-bar); color: #0e1530; font-weight: 700; font-size: 12px; display: inline-flex; align-items: center; justify-content: center; }
.pop { position: absolute; top: calc(100% + 6px); right: 0; width: min(360px, calc(100vw - 32px)); background: var(--card); color: var(--fg); border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 16px 40px rgba(15, 23, 42, .18); z-index: 20; font-size: 13px; text-align: left; }
.pop[hidden] { display: none; }
.pop .ph2 { padding: 10px 14px; border-bottom: 1px solid var(--line); font-weight: 700; font-size: 13px; display: flex; justify-content: space-between; align-items: center; }
.pop .ph2 a { font-weight: 500; font-size: 12px; color: var(--fg-2); }
.pop a.it { display: grid; gap: 2px; padding: 10px 14px; border-bottom: 1px solid var(--line); text-decoration: none; color: var(--fg); }
.pop a.it:last-child { border-bottom: 0; }
.pop a.it:hover { background: var(--hover); }
.pop a.it small { color: var(--fg-3); font-family: var(--mono); font-size: 11px; }
.pop .kv2 { padding: 10px 14px; display: grid; gap: 8px; color: var(--fg-2); line-height: 1.45; }
.pop .kv2 b { color: var(--fg); }
.pop .kv2 .mono { font-size: 12px; }
@media (max-width: 640px) { .pbar .acct span { display: none; } }
.pt a, .need-it b a, .arr b a { color: inherit; text-decoration: none; } .pt a:hover, .need-it b a:hover, .arr b a:hover { text-decoration: underline; }
