/* WeightLossPrice additions on top of the shared design system */
.dtabs{display:flex;gap:6px;flex-wrap:wrap;margin:12px 0}
.dtab{font:600 14px/20px var(--f);padding:6px 14px;border:1px solid var(--border);border-radius:2em;background:var(--canvas);color:var(--fg);cursor:pointer}
.dtab:hover{background:var(--subtle)}
.dtab[aria-selected="true"]{background:var(--fg);border-color:var(--fg);color:#fff}
.dose-panel+.dose-panel{margin-top:16px}
.js .dose-panel[hidden]{display:none}
.best{display:inline-block;margin-left:6px;font-size:11px;font-weight:600;color:var(--green);background:var(--green-bg);border:1px solid var(--green-bd);border-radius:2em;padding:0 6px;line-height:16px;vertical-align:1px}
.addcode{font-size:12px;color:var(--muted);text-decoration:underline dotted;text-underline-offset:3px}
.addcode:hover{color:var(--accent)}
.code{font-family:var(--fm);font-size:13px;border:1px dashed var(--green);border-radius:6px;padding:2px 8px;background:var(--green-bg);color:var(--green)}
table.mini{width:100%;border-collapse:collapse;font-size:13px}
.mini th,.mini td{padding:7px 16px;text-align:left;border-top:1px solid var(--border2)}
.mini thead th{font-size:12px;color:var(--muted);font-weight:600;background:var(--subtle);border-top:0}
.mini .sub{display:block}
table.mini2{width:100%}
.matrix{overflow-x:auto}
table.mtx th,table.mtx td{white-space:nowrap}
table.mtx th[scope=row]{white-space:normal;min-width:220px}
@media (max-width:960px){
  .cmp.wl td[data-label="Price per pen"]{grid-column:1/-1;background:var(--subtle);border:1px solid var(--border2);border-radius:var(--r);padding:8px 10px}
  .cmp.wl td[data-label="Price per pen"] .num{font-size:18px}
  .cmp.mtx tbody th{grid-column:1/-1}
  .matrix{overflow:visible}
  table.mtx th[scope=row]{min-width:0}
  .mini th,.mini td{padding:7px 12px}
}
.codes-note{font-size:13px;color:var(--muted);margin:0 0 12px}
/* interactive price list */
.pl-bar{position:sticky;top:62px;z-index:4;background:var(--canvas);padding:10px 0;display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;border-bottom:1px solid var(--border2);margin-bottom:12px}
.seg{display:inline-flex;border:1px solid var(--border);border-radius:var(--r);overflow:hidden;background:var(--subtle)}
.segb{font:500 13px/20px var(--f);padding:5px 12px;border:0;background:none;color:var(--fg);cursor:pointer;border-right:1px solid var(--border)}
.segb:last-child{border-right:0}
.segb[aria-checked="true"]{background:var(--canvas);font-weight:600;box-shadow:inset 0 -2px 0 var(--green-btn)}
.dchips{display:flex;gap:6px;flex-wrap:wrap}
.dchip{font:600 13px/18px var(--f);padding:5px 11px;border:1px solid var(--border);border-radius:2em;background:var(--canvas);color:var(--fg);cursor:pointer}
.dchip[aria-pressed="true"]{background:var(--fg);border-color:var(--fg);color:#fff}
.pl-tools{display:flex;gap:12px;align-items:center;margin-left:auto}
.pl-tools input[type=search]{font:inherit;font-size:14px;padding:5px 10px;border:1px solid var(--border);border-radius:var(--r);min-width:180px}
.pl-tools .count{margin:0;padding:0}
.matrix{position:relative;overflow-x:auto;border:1px solid var(--border);border-radius:var(--r)}
.matrix.more{box-shadow:inset -18px 0 14px -14px rgba(31,35,40,.25)}
table.mtx{width:100%;border-collapse:separate;border-spacing:0;font-size:14px;background:var(--canvas)}
.mtx-cap{margin:0 0 8px;font-size:12px;color:var(--muted)}
.mtx th,.mtx td{padding:10px 12px;border-bottom:1px solid var(--border2);text-align:left;vertical-align:top;background:var(--canvas)}
.mtx thead th{background:var(--subtle);font-size:12px;font-weight:600;color:var(--muted);white-space:nowrap;border-bottom:1px solid var(--border)}
.mtx .pcol{position:sticky;left:0;z-index:2;min-width:210px;border-right:1px solid var(--border2)}
.mtx thead .pcol{z-index:3}
.mtx .pcol .chip{display:inline-flex;margin-top:4px}
.mtx .pcol .cn{display:block}
.mtx td.pc{white-space:nowrap;min-width:84px}
.mtx td.pc.na .pv-v{color:var(--muted);font-size:12px;white-space:normal}
.mtx td.pc.low{background:var(--green-bg)}
.mtx td.pc.low .pv-v{color:var(--green);font-weight:600}
.mtx td.pc.low .pv-v::after{content:"Lowest";display:block;font:600 10px/1.4 var(--f);letter-spacing:.02em;color:var(--green)}
.mtx .dcol.sel{box-shadow:inset 0 0 0 9999px rgba(9,105,218,.04)}
.mtx thead .dcol.sel{color:var(--fg)}
.sortb{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;text-decoration:underline dotted;text-underline-offset:3px}
.mtx .ocol{min-width:180px;font-size:13px}
.mtx tr:last-child>*{border-bottom:0}
@media (max-width:960px){
  .pl-bar{position:static;gap:8px}
  .seg{width:100%}.segb{flex:1;padding:6px 4px;font-size:12px}
  .pl-tools{margin-left:0;width:100%}.pl-tools input[type=search]{flex:1;min-width:0}
  .mtx .pcol{min-width:130px;max-width:150px}
  .mtx .pcol .lg{display:none}
  /* one dose selected: compact cards, nothing to scroll */
  table.mtx.one thead{display:none}
  table.mtx.one,table.mtx.one tbody{display:block}
  table.mtx.one tbody tr{display:grid;grid-template-columns:1fr auto;gap:6px 12px;padding:12px 14px;border-bottom:1px solid var(--border2)}
  table.mtx.one tbody tr[hidden]{display:none}
  table.mtx.one th,table.mtx.one td{border:0;padding:0;position:static;min-width:0;max-width:none;background:none}
  table.mtx.one td.pc{display:none}
  table.mtx.one td.pc.sel{display:block;grid-column:2;grid-row:1;text-align:right;align-self:start}
  table.mtx.one td.pc.sel .pv-v{font-size:18px}
  table.mtx.one td.pc.low{background:none}
  table.mtx.one .pcol{grid-column:1;grid-row:1;border:0}
  table.mtx.one .pcol .lg{display:block}
  table.mtx.one .pcol .lg-ph{display:grid}
  table.mtx.one .dcol.sel{box-shadow:none}
  table.mtx.one .ocol{grid-column:1/-1;white-space:normal}
  table.mtx.one td.cta{grid-column:1/-1;text-align:left}
}
.codebox{border:1px dashed var(--green-bd);background:var(--green-bg);border-radius:var(--r);padding:14px 16px}
.codebox.empty{border-color:var(--border);background:var(--subtle)}
.codebox .code{font-size:18px}
ul.alt{list-style:none;padding:0;margin:0;display:grid;gap:8px}ul.alt li{display:flex;align-items:center;gap:8px}
.calc{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin:12px 0}
.calc label{display:grid;gap:4px;font-size:13px;font-weight:600}.calc select{font:inherit;padding:7px 10px;border:1px solid var(--border);border-radius:var(--r);background:var(--canvas)}
.calc .tog{display:flex;align-items:center;gap:8px;font-weight:400;grid-column:1/-1}
.calc-out{border:1px solid var(--border);border-radius:var(--r);padding:14px 16px;background:var(--subtle)}
.calc-big b{font-size:24px}
/* treatment category cards */
.tcs{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.tc{display:flex;align-items:center;gap:14px;padding:16px;border-radius:14px;border:1px solid transparent;color:var(--fg);transition:transform .12s ease,box-shadow .12s ease}
.tc:hover{text-decoration:none;transform:translateY(-1px);box-shadow:0 6px 18px rgba(31,35,40,.08)}
.tc-i{flex:0 0 52px;height:52px;border-radius:12px;background:rgba(255,255,255,.75);display:grid;place-items:center}
.tc-i svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.tc-b{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.tc-e{font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;opacity:.75}
.tc-t{font-size:17px;font-weight:650;letter-spacing:-.01em}
.tc-d{font-size:13px;color:var(--muted)}
.tc-from{font-size:12px;margin-top:2px}.tc-from b{font-size:13px}
.tc-a{flex:0 0 34px;height:34px;border-radius:50%;background:#fff;display:grid;place-items:center;font-size:16px}
.tc-mint{background:#E7F6EE;border-color:#CDEBD9}.tc-mint .tc-i{color:#1A6B43}
.tc-amber{background:#FDF3D7;border-color:#F4E2A8}.tc-amber .tc-i{color:#8A5A00}
.tc-peach{background:#FCEBE3;border-color:#F5D3C2}.tc-peach .tc-i{color:#A3461F}
.tc-sand{background:#F5F1E8;border-color:#E6DECB}.tc-sand .tc-i{color:#6B5A2E}
.tc-sky{background:#E6F0FB;border-color:#C9DDF4}.tc-sky .tc-i{color:#1F5FA8}
.tc-lav{background:#EFEAFB;border-color:#DCD2F4}.tc-lav .tc-i{color:#6440B8}
.tc-teal{background:#E2F5F3;border-color:#BFE7E1}.tc-teal .tc-i{color:#0E6D63}
.tc-rose{background:#FCEAF1;border-color:#F5CFDE}.tc-rose .tc-i{color:#A3305F}
.split2{display:grid;grid-template-columns:1fr 1fr;gap:20px}@media (max-width:960px){.split2{grid-template-columns:1fr}}
.vs-links a{white-space:nowrap}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin:14px 0}
.kpi{border:1px solid var(--border);border-radius:var(--r);padding:10px 12px}.kpi b{display:block;font-size:20px}.kpi span{font-size:12px;color:var(--muted)}
