/* Send Rx. */
.rx-layout { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 16px; align-items: start; }
.rx-main { padding: 20px; display: grid; gap: 16px; }
.rx-side { display: grid; gap: 14px; position: sticky; top: calc(var(--topbar-h) + 12px); }
.rx-steps { list-style: none; margin: 0; padding: 0; display: flex; gap: 6px; flex-wrap: wrap; }
.rx-steps button { display: inline-flex; align-items: center; gap: 8px; height: 34px; padding: 0 12px 0 6px; border-radius: 99px; border: 1px solid var(--border); background: var(--card); font-weight: 600; font-size: 13px; color: var(--muted); cursor: pointer; }
.rx-steps button:disabled { opacity: .5; cursor: default; }
.rx-steps .n { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; background: var(--surface); font-size: 11.5px; }
.rx-steps .done button { color: var(--good-ink); }
.rx-steps .done .n { background: var(--good-tint); }
.rx-steps .now button { border-color: var(--brand); color: var(--brand-ink); background: var(--brand-tint); }
.rx-steps .now .n { background: var(--brand); color: var(--brand-on); }
.rx-body { display: grid; gap: 12px; }
.rx-body h2 { font-size: 17px; }
.rx-patient { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 1px solid var(--border); border-radius: var(--r-card); background: var(--surface); }
.rx-patient > div { flex: 1; display: grid; }
.rx-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.rx-grid .span2 { grid-column: 1 / -1; }
.rx-prod { border: 1px solid var(--border); border-radius: var(--r-card); padding: 12px 14px; display: grid; gap: 10px; }
.rx-prod-head { display: flex; align-items: center; justify-content: space-between; }
.input.is-bad { border-color: var(--bad); box-shadow: 0 0 0 3px var(--bad-tint); }
.combo { position: relative; }
.combo-list { position: absolute; z-index: 30; left: 0; right: 0; top: calc(100% + 4px); max-height: 260px; overflow-y: auto; background: var(--card); border: 1px solid var(--border); border-radius: var(--r-ctl); box-shadow: var(--shadow-2); padding: 4px; }
.combo-list button { display: block; width: 100%; text-align: left; padding: 8px 10px; border: 0; background: transparent; border-radius: 6px; font-size: 13px; cursor: pointer; }
.combo-list button:hover { background: var(--brand-tint); }
.combo-list button span { display: block; }
.combo-list button small { display: block; margin-top: 2px; font-size: 11.5px; }
.rx-source { display: flex; align-items: center; gap: 6px; margin: -4px 0 4px; font-size: 12.5px; color: var(--muted); }
.rx-source svg { width: 15px; height: 15px; }
.rx-source.is-live { color: var(--good-ink); }
.rx-facts { display: block; margin-top: 4px; font-size: 12px; color: var(--muted); }
.input.rx-dir { height: auto; min-height: 76px; padding: 10px 12px; resize: vertical; line-height: 1.45; font: inherit; }

/* Find product by dosage */
.dc-box { border: 1px dashed var(--border-strong); border-radius: var(--r-card); background: var(--surface); padding: 12px; display: grid; gap: 10px; }
.dc-title { font-size: 13px; font-weight: 700; }
.dc-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; }
.dc-row .input:only-child { grid-column: 1 / -1; }
.dc-toggles { display: flex; flex-wrap: wrap; gap: 14px; font-size: 12.5px; color: var(--muted); }
.dc-toggles label { display: flex; align-items: center; gap: 6px; }
.dc-toggles .input { height: 32px; width: auto; padding: 0 8px; font-size: 12.5px; }
.dc-out { display: grid; gap: 8px; max-height: 360px; overflow-y: auto; padding-right: 2px; }
.dc-hint { margin: 0; font-size: 12.5px; color: var(--muted); }
.dc-opt { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; text-align: left; padding: 10px 14px; border: 1px solid var(--border); border-radius: 10px; background: var(--card); cursor: pointer; transition: border-color .15s, box-shadow .15s; }
.dc-opt:hover { border-color: var(--brand); box-shadow: var(--shadow-1, 0 1px 3px rgba(0, 0, 0, .08)); }
.dc-opt.is-best { border-color: var(--good); background: linear-gradient(var(--good-tint), var(--good-tint)), var(--card); }
.dc-opt.is-picked { border-color: var(--brand); box-shadow: 0 0 0 2px var(--brand-tint-strong); }
.dc-left { display: grid; gap: 3px; min-width: 0; }
.dc-flag { justify-self: start; font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--good-ink); }
.dc-combo { font-size: 15px; }
.dc-total { font-weight: 500; color: var(--muted); }
.dc-name { font-size: 12px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dc-pills { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 2px; }
.dc-pill { font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--muted); padding: 2px 7px; border-radius: 99px; background: var(--surface); border: 1px solid var(--border); }
.dc-pill.is-exact { color: var(--good-ink); background: var(--good-tint); border-color: transparent; }
.dc-price { flex: none; font-size: 19px; font-weight: 800; }
@media (max-width: 600px) { .dc-row { grid-template-columns: minmax(0, 1fr); } }
.radio-card { display: flex; gap: 12px; align-items: flex-start; padding: 12px 14px; border: 1px solid var(--border); border-radius: var(--r-card); cursor: pointer; }
.radio-card:has(input:checked) { border-color: var(--brand); background: var(--brand-tint); }
.radio-card input { margin-top: 3px; accent-color: var(--brand); }
.radio-card span { display: grid; }
.radio-card small { color: var(--muted); }
.test-panel { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 12px 14px; border-radius: var(--r-card); background: var(--warn-tint); color: var(--warn-ink); font-size: 13px; }
.test-panel b { display: inline-flex; align-items: center; gap: 6px; }
.test-panel svg { width: 15px; height: 15px; }
.test-panel label { display: inline-flex; gap: 6px; align-items: center; color: var(--text); }
.edit-banner { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 12px; border-radius: var(--r-ctl); background: var(--warn-tint); color: var(--warn-ink); font-size: 13px; font-weight: 600; }
.edit-banner svg { width: 16px; height: 16px; }
.rx-foot { display: flex; align-items: center; gap: 8px; border-top: 1px solid var(--border); padding-top: 14px; }
.rx-foot .grow { flex: 1; }
.search-box.big { height: 44px; flex: none; width: 100%; max-width: none; }
.rx-results { display: grid; gap: 4px; }
.rx-hit { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 0; background: transparent; border-radius: var(--r-ctl); cursor: pointer; text-align: left; }
.rx-hit:hover { background: var(--brand-tint); }
.rx-hit span:last-child { display: grid; }
.rx-checks { padding: 14px 16px; }
.rx-checks-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.rx-checks ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; max-height: 52vh; overflow-y: auto; }
.rx-checks li { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 6px; padding: 6px 0; border-bottom: 1px dashed var(--border); font-size: 13px; }
.rx-checks li:last-child { border-bottom: 0; }
.rx-checks li > div { display: grid; gap: 2px; min-width: 0; }
.rx-checks .mark { font-weight: 800; }
.rx-checks li.ok .mark { color: var(--good-ink); }
.rx-checks li.bad .mark { color: var(--bad-ink); }
.fix { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 4px; }
.fix .input { height: 32px; flex: 1 1 120px; min-width: 0; }
.fix-tag { flex-basis: 100%; font-size: 11px; font-weight: 700; color: var(--info-ink); }
.side-tabs { display: flex; border-bottom: 1px solid var(--border); padding: 0 8px; }
.side-tabs button { flex: 1; height: 40px; border: 0; background: transparent; font-weight: 600; font-size: 13px; color: var(--muted); cursor: pointer; border-bottom: 2px solid transparent; }
.side-tabs button[aria-selected="true"] { color: var(--brand-ink); border-bottom-color: var(--accent); }
.side-tabs .count { font-size: 11px; padding: 0 6px; border-radius: 99px; background: var(--brand-tint); color: var(--brand-ink); }
.side-body { padding: 10px 14px; display: grid; gap: 8px; max-height: 50vh; overflow-y: auto; }
.sched { display: grid; gap: 3px; padding: 10px 0; border-bottom: 1px dashed var(--border); font-size: 12.5px; }
.sched:last-child { border-bottom: 0; }
.sched-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.sched-actions { display: flex; flex-wrap: wrap; gap: 2px; margin-top: 4px; }
.sched-actions .btn { height: 26px; padding: 0 8px; font-size: 12px; }
.rx-status { display: grid; gap: 10px; justify-items: start; padding: 10px 0; }
.rx-status .pill { height: 26px; font-size: 13px; padding: 0 12px; }
@media (max-width: 1080px) { .rx-layout { grid-template-columns: minmax(0, 1fr); } .rx-side { position: static; } }
@media (max-width: 600px) { .rx-grid { grid-template-columns: minmax(0, 1fr); } }

/* Quote detail. */
.dialog.wide { width: min(560px, calc(100vw - 32px)); max-height: 88vh; overflow-y: auto; }
.pkg-box { display: grid; gap: 2px; padding: 12px 14px; border-radius: var(--r-card); background: var(--accent-tint); }
.pkg-box small { color: var(--muted); font-size: 11.5px; }

/* Tasks, Docs, Tools, Admin. */
.jboard.tasks .jcol { width: 280px; }
.jcard.task.is-done { opacity: .6; }
.jcard.task.is-new { border-color: color-mix(in srgb, var(--info) 45%, var(--border)); }
.dot-new { width: 8px; height: 8px; border-radius: 50%; background: var(--info); display: inline-block; flex: none; }
.clamp { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; white-space: normal; }
.th-sort { border: 0; background: transparent; font: inherit; color: inherit; text-transform: inherit; letter-spacing: inherit; cursor: pointer; padding: 0; }
.th-sort[aria-pressed="true"] { color: var(--brand-ink); }
.task-dialog .title-in { font: 700 17px/1.2 var(--font-head); height: 44px; }
.crumbs-line { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 12px; font-size: 13.5px; }
button.folder-tile { text-align: left; cursor: pointer; font: inherit; }
.doc-kind { font: 700 10px/18px var(--font-body); color: var(--on-solid); padding: 0 6px; border-radius: 4px; flex: none; }
.list-lines .li a.grow { text-decoration: none; color: var(--text); }
.tz-card { display: flex; flex-wrap: wrap; gap: 24px; align-items: center; justify-content: space-between; padding: 18px; border: 1px solid var(--border); border-radius: var(--r-card); }
.tz-card > div { display: grid; gap: 2px; }
.tz-time { font: 800 40px/1.1 var(--font-head); letter-spacing: -.02em; }
.tz-mine { text-align: right; }
.tz-mine b { font: 700 22px/1.2 var(--font-head); }
.perm-grid { display: grid; gap: 2px; margin-bottom: 10px; }
.perm-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 6px 0; border-bottom: 1px dashed var(--border); font-size: 13px; }
.perm-row b { font-weight: 600; text-transform: capitalize; }
.perm-row span { display: inline-flex; gap: 4px; }
.lv { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; padding: 3px 8px; border: 1px solid var(--border); border-radius: 99px; cursor: pointer; }
.lv:has(input:checked) { background: var(--brand-tint); border-color: transparent; color: var(--brand-ink); font-weight: 600; }
.lv input { display: none; }
.perm-checks { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 6px 14px; margin-bottom: 12px; font-size: 13px; text-transform: capitalize; }
.perm-checks label { display: flex; align-items: center; gap: 6px; }
textarea.code { height: auto; font: 12px/1.5 var(--font-mono); padding: 10px 12px; white-space: pre; }
.brand-preview { display: grid; gap: 8px; }

.rx-checks ul.people li { display: block; padding: 10px 0; }
.person { display: grid; gap: 4px; }
.person-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.person-top .pill { height: 20px; font-size: 11px; }
.person select.input { height: 32px; }
.person .fix { margin-top: 0; }

/* Send Rx result. */
.rx-result { display: grid; justify-items: center; text-align: center; gap: 10px; padding: 28px 12px 8px; }
.rx-result h2 { font-size: 22px; }
.rx-result-icon { width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center; }
.rx-result-icon svg { width: 30px; height: 30px; }
.tone-good { background: var(--good-tint); color: var(--good-ink); }
.tone-bad { background: var(--bad-tint); color: var(--bad-ink); }
.tone-warn { background: var(--warn-tint); color: var(--warn-ink); }
.tone-info { background: var(--info-tint); color: var(--info-ink); }
.rx-result-icon.is-busy { animation: pulse 1.2s var(--ease) infinite; }
.rx-summary { width: min(520px, 100%); text-align: left; border: 1px solid var(--border); border-radius: var(--r-card); padding: 12px 16px; display: grid; gap: 4px; margin-top: 6px; }
.rx-result-actions { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; margin-top: 8px; }

/* Email connection (Admin › Connectors) */
.good-ink { color: var(--good-ink); }
.email-card { margin-top: 14px; padding: 20px; display: grid; grid-template-columns: minmax(0, 560px) minmax(260px, 1fr); gap: 28px; align-items: start; }
.em-main { display: grid; gap: 16px; min-width: 0; }
.email-head { display: flex; align-items: flex-start; gap: 12px; }
.email-head h3 { font-size: 15px; }
.em-form { display: grid; gap: 10px; }
.set-field { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 12px; align-items: start; }
.set-field > label { font-size: 13px; font-weight: 600; padding-top: 9px; }
.set-field > div { display: grid; gap: 4px; min-width: 0; }
.set-field small { font-size: 12px; line-height: 1.45; }
.em-inline { display: flex; gap: 8px; }
.em-inline .em-port { width: 90px; flex: none; }
.em-inline select { flex: 1; }
.em-more { border-top: 1px solid var(--border); padding-top: 10px; display: grid; gap: 10px; }
.em-more[open] { padding-bottom: 2px; }
.em-more > summary { cursor: pointer; font-size: 13px; font-weight: 600; color: var(--brand-ink); width: max-content; margin-bottom: 4px; }
.em-actions { display: flex; align-items: center; gap: 12px; padding-left: 132px; }
.em-side { display: grid; gap: 10px; padding: 16px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); }
.em-side h3 { font-size: 14px; }
.em-side p { margin: 0; }
.em-test { display: flex; gap: 8px; }
.em-test .input { flex: 1; min-width: 0; }
.email-result { border-radius: 10px; padding: 12px 14px; display: grid; gap: 8px; font-size: 13px; border: 1px solid var(--border); }
.email-result p { margin: 0; }
.email-result.is-ok { background: var(--good-tint); }
.email-result.is-bad { background: var(--bad-tint); }
.email-result summary { cursor: pointer; }
.email-steps { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 4px; }
.email-steps li { display: grid; grid-template-columns: 16px 120px minmax(0, 1fr); gap: 8px; align-items: baseline; }
.email-steps li.ok > span { color: var(--good-ink); font-weight: 700; }
.email-steps li.bad > span { color: var(--bad-ink); font-weight: 700; }
.email-steps small { overflow-wrap: anywhere; }
@media (max-width: 1000px) { .email-card { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 600px) {
  .set-field { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .set-field > label { padding-top: 0; }
  .em-actions { padding-left: 0; }
  .email-steps li { grid-template-columns: 16px minmax(0, 1fr); }
  .email-steps small { grid-column: 2; }
}

/* Branding (Admin › Branding) */
.brand-layout { display: grid; grid-template-columns: minmax(0, 600px) minmax(240px, 340px); gap: 20px; align-items: start; }
.brand-main { padding: 20px; display: grid; gap: 18px; }
.brand-main section { display: grid; gap: 10px; }
.brand-main section + section { border-top: 1px solid var(--border); padding-top: 16px; }
.brand-main h3 { font-size: 13px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.brand-actions { display: flex; gap: 8px; padding-left: 132px; }
.colour-pick { display: flex; gap: 8px; align-items: center; }
.colour-pick input[type="color"] { width: 40px; height: 36px; padding: 2px; border: 1px solid var(--border); border-radius: 8px; background: var(--card); cursor: pointer; flex: none; }
.colour-pick .input { width: 110px; font-family: var(--font-mono); text-transform: uppercase; }
.logo-row { display: flex; gap: 8px; align-items: center; }
.logo-row .input { flex: 1; min-width: 0; }
.logo-thumb { height: 36px; max-width: 90px; object-fit: contain; border: 1px solid var(--border); border-radius: 8px; background: #FFFFFF; padding: 3px; flex: none; }
.brand-preview { padding: 18px; display: grid; gap: 10px; position: sticky; top: calc(var(--topbar-h) + 16px); }
.brand-swatches { display: flex; gap: 8px; flex-wrap: wrap; }
@media (max-width: 960px) { .brand-layout { grid-template-columns: minmax(0, 1fr); } .brand-preview { position: static; } }
@media (max-width: 600px) { .brand-actions { padding-left: 0; } }

/* Survey answers card (read-only, from the patient's GHL contact) */
.rx-survey { padding: 14px 16px; }
.rx-survey-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.rx-survey-head h3 { font-size: 13.5px; }
.rx-survey-head .icon-btn { width: 28px; height: 28px; }
.rx-survey-list { margin: 0; display: grid; }
.rx-survey-list > div { display: grid; grid-template-columns: 130px minmax(0, 1fr); gap: 10px; padding: 6px 0; border-bottom: 1px dashed var(--border); font-size: 12.5px; }
.rx-survey-list > div:last-child { border-bottom: 0; }
.rx-survey-list dt { color: var(--muted); }
.rx-survey-list dd { margin: 0; font-weight: 600; overflow-wrap: anywhere; }
.rx-survey-list dd.muted { font-weight: 400; font-style: italic; }
.rx-survey .warn-ink svg { width: 13px; height: 13px; vertical-align: -2px; }
.dc-price.is-none { font-size: 12px; font-weight: 600; color: var(--faint); }
.radio-card.is-disabled { cursor: not-allowed; opacity: .6; }
.rx-total { display: block; margin-top: 4px; font-size: 12.5px; font-weight: 700; color: var(--text); }
.combo-list button .rx-total { margin-top: 2px; font-size: 11.5px; }