/* next-v96-profiles.css (v96, 2026-10-02). Owner: Agent A, see DESIGN-V96.md. Tokens and the v96 kit only.
   Suppliers (cards, table, profile), Network Discover, Your pharmacy's file, and the clinic and telehealth pages, drawn with the kit:
   a flat cover in the firm's own pastel, its avatar, product tiles, the credential grid, document rows and labels. Loads after
   next-v96-kit.css; every rule is scoped to a v96p- class or to the pages these files draw. */

/* ---------- the profile card: a flat cover in the firm's hue, the avatar over it, then sections ---------- */
.v96p-pc { border-color: var(--line-soft); box-shadow: var(--shadow-card); }
.v96p-pc[data-go]:hover { border-color: var(--gray-300); }
.v96p-cover { position: relative; height: 64px; display: flex; align-items: flex-start; justify-content: flex-end; padding: var(--s-3); background: var(--hue-8-bg); }
/* the firm's hue, softened toward the page so a warm hue never reads as a recall or a hold: status is the label pinned on it */
.v96p-cover[data-hue="1"] { --cv: var(--hue-1-bg); } .v96p-cover[data-hue="2"] { --cv: var(--hue-2-bg); } .v96p-cover[data-hue="3"] { --cv: var(--hue-3-bg); } .v96p-cover[data-hue="4"] { --cv: var(--hue-4-bg); }
.v96p-cover[data-hue="5"] { --cv: var(--hue-5-bg); } .v96p-cover[data-hue="6"] { --cv: var(--hue-6-bg); } .v96p-cover[data-hue="7"] { --cv: var(--hue-7-bg); } .v96p-cover[data-hue="8"] { --cv: var(--hue-8-bg); }
.v96p-cover[data-hue] { background: color-mix(in srgb, var(--cv) 62%, var(--gray-25)); }
.v96p-cv-t { display: inline-flex; align-items: center; gap: var(--s-2); padding: 4px 6px 4px 4px; border-radius: 9px; background: var(--gray-0); box-shadow: var(--shadow-card); font-size: var(--t-label-size); line-height: var(--t-label-lh); }
.v96p-cv-t a { color: var(--gray-700); font-weight: var(--w-medium); text-decoration: none; } .v96p-cv-t a:hover { color: var(--accent); }
.v96p-head { display: flex; align-items: flex-end; gap: var(--s-3); padding: 0 var(--s-5); margin-top: -28px; }
.v96p-head > .v96-av { box-shadow: 0 0 0 3px var(--gray-0); }
.v96p-id { flex: 1; min-width: 0; padding-top: 32px; display: flex; flex-direction: column; }
.v96p-id h3 { margin: 0; font-size: 17px; line-height: 24px; font-weight: var(--w-semibold); color: var(--gray-900); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.v96p-id h3 a { color: inherit; text-decoration: none; } .v96p-id h3 a:hover { color: var(--accent); }
.v96p-sec { padding: var(--s-4) var(--s-5) 0; display: flex; flex-direction: column; gap: var(--s-2); min-width: 0; }
.v96p-pc > .v96p-sec:last-of-type { padding-bottom: var(--s-4); }
.v96p-sec h4 { margin: 0; font-size: var(--t-label-size); line-height: var(--t-label-lh); font-weight: var(--w-medium); color: var(--gray-500); }
.v96p-hl { margin: var(--s-3) var(--s-5) 0; font-size: var(--t-body-size); line-height: var(--t-body-lh); color: var(--gray-700); }
.v96p-more { align-self: flex-start; font-size: var(--t-small-size); }
.v96p-rnote { margin: 0; font-size: var(--t-small-size); line-height: var(--t-small-lh); color: var(--gray-500); }
.v96p-rnote .v95p-ln { margin: 0 2px; }

/* what it supplies or compounds: a product tile, the name, its lot, its state */
.v96p-sp { display: flex; flex-direction: column; gap: 2px; }
.v96p-sp-r { display: flex; align-items: center; gap: var(--s-3); min-width: 0; padding: 6px var(--s-2); margin: 0 calc(-1 * var(--s-2)); border-radius: 10px; color: inherit; text-decoration: none; }
a.v96p-sp-r:hover { background: var(--gray-50); }
.v96p-sp-t { display: flex; flex-direction: column; min-width: 0; flex: 1 1 auto; }
.v96p-sp-t b { font-size: var(--t-small-size); line-height: var(--t-small-lh); font-weight: var(--w-semibold); color: var(--gray-900); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.v96p-sp-t em { font-style: normal; font-size: var(--t-label-size); line-height: var(--t-label-lh); color: var(--gray-500); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* a list of document rows inside a card: no second border, only the rows' own lines */
.v96-list.v96p-flat { border: 0; border-radius: 0; background: transparent; }
.v96p-sec .v96-list.v96p-flat { margin: 0 calc(-1 * var(--s-2)); }
.v96p-sec .v96-list.v96p-flat .v96-dr { padding: var(--s-2); }
.v96p-sec .v96-dr-t { font-size: var(--t-small-size); line-height: var(--t-small-lh); }
.v96p-pc .v96-creds { gap: var(--s-2); }
.v96p-pc .v96-cred { padding: var(--s-2) var(--s-3); }

/* ---------- the legend over the list ---------- */
.v96p-legend { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2) var(--s-5); padding: var(--s-3) var(--s-4); border: 1px solid var(--line-soft); border-radius: 12px; background: var(--gray-0); box-shadow: var(--shadow-card); }
.v96p-legend > span { display: inline-flex; align-items: center; gap: var(--s-2); font-size: var(--t-small-size); line-height: var(--t-small-lh); color: var(--gray-500); }
.v96p-legend .v96-doc { width: 18px; height: 22px; }
.v96p-legend .v96p-lg { position: relative; display: inline-block; }
.v96p-legend .v96p-lg .v96-cred-m { right: -6px; top: -4px; width: 13px; height: 13px; } .v96p-legend .v96p-lg .v96-cred-m svg { width: 8px; height: 8px; }
.v96p-legend .v96p-lg.is-missing .v96-doc .pg { stroke-dasharray: 2.5 2; } .v96p-legend .v96p-lg.is-missing .v96-doc :is(.bar, .dot) { fill: var(--gray-300); }
.v96p-legend b { color: var(--gray-900); font-weight: var(--w-medium); }

/* ---------- the three-way visibility control, and the blocks' two-way switch in the same look ---------- */
.v96p-vis, .v95p-file .v95p-vis { display: inline-flex; padding: 2px; border-radius: 9px; background: var(--gray-100); gap: 2px; }
.v96p-vis button, .v95p-file .v95p-vis button { height: 28px; padding: 0 var(--s-3); border: 0; border-radius: 7px; background: transparent; color: var(--gray-600); font: inherit; font-size: var(--t-label-size); line-height: var(--t-label-lh); font-weight: var(--w-medium); cursor: pointer; white-space: nowrap; }
.v96p-vis button:hover:not([disabled]), .v95p-file .v95p-vis button:hover:not([disabled]) { color: var(--gray-900); }
.v96p-vis button[aria-pressed="true"], .v95p-file .v95p-vis button[aria-pressed="true"] { background: var(--gray-0); color: var(--gray-900); box-shadow: 0 1px 2px rgba(16, 24, 40, .08); cursor: default; }
.v96p-vis button[disabled]:not([aria-pressed="true"]) { cursor: default; opacity: .6; }

/* ---------- panels with a kit head ---------- */
.v96p-card > .v96-ph { border-bottom: 1px solid var(--line-soft); }
.v96p-card > .v96-list.v96p-flat .v96-dr { padding: var(--s-3) var(--s-5); }
.v96p-cardnote { margin: 0; padding: var(--s-3) var(--s-5); border-top: 1px solid var(--line-soft); font-size: var(--t-small-size); line-height: var(--t-small-lh); color: var(--gray-500); background: var(--gray-25); }
.v96p-card .card-b > .v96-creds + .v96p-rnote, .v96p-card .card-b > .v96-creds + .v96p-cardline { margin-top: var(--s-3); }
.v96p-docs .v96-dr { flex-wrap: nowrap; }
.v96p-docs .v96-dr-a { flex-wrap: nowrap; justify-content: flex-end; }
.v96p-op { color: var(--gray-700); }
@media (max-width: 1023px) { .v96p-docs .v96-dr { flex-wrap: wrap; row-gap: var(--s-2); } .v96p-docs .v96-dr-a { width: 100%; padding-left: 48px; justify-content: flex-start; flex-wrap: wrap; } }
.v96p-dr-meta { font-size: var(--t-label-size); line-height: var(--t-label-lh); color: var(--gray-500); white-space: nowrap; }

/* ---------- the head of a profile page: cover, avatar, credential grid ---------- */
.v96p-headcreds { padding: var(--s-4) var(--s-5) var(--s-5); border-top: 1px solid var(--line-soft); }
.v96p-headcreds .v96-creds { --cols: 6; }
.v95p-ph .v96p-cover { height: 96px; }
.v95p-ph .v96p-ph-av { position: relative; z-index: 1; flex: none; display: inline-flex; border-radius: 50%; box-shadow: 0 0 0 4px var(--gray-0); }
.v96p-head > .v96-av { position: relative; z-index: 1; }

@media (max-width: 1180px) { .v96p-headcreds .v96-creds { --cols: 3; } }
@media (max-width: 699px) {
  .v96p-head { padding: 0 var(--s-4); }
  .v96p-sec { padding: var(--s-4) var(--s-4) 0; }
  .v96p-headcreds { padding: var(--s-3) var(--s-4) var(--s-4); }
  .v96p-card > .v96-list.v96p-flat .v96-dr { padding: var(--s-3) var(--s-4); }
  .v96p-vis button { padding: 0 var(--s-2); }
}

/* ---------- the suppliers table ---------- */
.v95p-dt .v95p-ts { display: flex; align-items: center; gap: var(--s-3); min-width: 0; }
.v96p-tsup { display: flex; align-items: center; gap: var(--s-2); min-width: 0; }
.v96p-tsup > span:last-child { display: flex; flex-direction: column; min-width: 0; }
.v96p-miss { display: inline-flex; align-items: center; height: 22px; padding: 0 7px; border: 1px dashed var(--gray-300); border-radius: 6px; color: var(--gray-500); font-size: var(--t-label-size); line-height: var(--t-label-lh); font-weight: var(--w-medium); }
.v95p-dt .v95p-tcs .v96-l { max-width: 100%; }

/* ---------- the supplier profile (next-v94.js head, in the kit) ---------- */
#view .v94-prof .v94-cover.v96p-cover[data-hue] { height: 96px; border-bottom: 0; background: color-mix(in srgb, var(--cv) 62%, var(--gray-25)); }
#view .v94-prof .v96p-ph-av { position: relative; z-index: 1; display: inline-flex; flex: none; border-radius: 50%; box-shadow: 0 0 0 4px var(--gray-0); }
#view .v94-shop .v94-sup .chip { margin-left: 48px; }
.v94-prof > .v96p-headcreds { border-top: 1px solid var(--line-soft); }
.v94-prof > .v96p-headcreds .v96p-rnote { margin-top: var(--s-3); }
.v94-sups .v94-sup { align-items: center; }
.v94-sups .v94-sup > .v96-tile { flex: none; }
.v96p-certcard { grid-column: 1 / -1; }
.v96p-certcard .v96p-cardlist .v96-dr { padding: var(--s-3) var(--s-5); }

/* ---------- Network Discover ---------- */
.v96p-dc .v96p-sec .v96-list.v96p-flat .v96-dr { padding: var(--s-2); }
.v96p-dc .v96-dr .btn.sm { height: 30px; }
.v96p-facts { display: flex; flex-wrap: wrap; gap: 2px var(--s-3); margin: 0; font-size: var(--t-small-size); line-height: var(--t-small-lh); color: var(--gray-700); }
.v96p-facts span + span::before { content: "·"; margin-right: var(--s-3); color: var(--gray-400); }
.v96p-dc .v96-creds { --cols: 2; }

/* ---------- Your pharmacy's file, and the clinic and telehealth pages ---------- */
.v96p-ph { border-color: var(--line-soft); box-shadow: var(--shadow-card); }
.v96p-ph > .v96p-cover { border-bottom: 0; }
@media (min-width: 700px) { .v96p-ph .v95p-ph-b { align-items: flex-end; } .v96p-ph .v95p-ph-id { padding-top: 44px; } }
@media (max-width: 699px) { .v96p-ph > .v96p-cover { height: 64px; } .v96p-ph .v95p-ph-b { margin-top: -32px; } }
.v96p-ph .v95p-ph-st .v96-l { vertical-align: 2px; }
.v96p-ph > .v96p-headcreds .v96-cred-t { white-space: normal; }
.v96p-opens { padding: var(--s-3) var(--s-5) var(--s-4); border-top: 1px solid var(--line-soft); background: var(--gray-25); }
.v96p-opens h4 { margin: 0 0 var(--s-2); font-size: var(--t-label-size); line-height: var(--t-label-lh); font-weight: var(--w-medium); color: var(--gray-500); }
.v96p-opens ul { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 4px; }
.v96p-opens li { display: flex; flex-wrap: wrap; gap: 0 var(--s-2); font-size: var(--t-small-size); line-height: var(--t-small-lh); color: var(--gray-700); }
.v96p-opens li b { font-weight: var(--w-medium); color: var(--gray-900); }
.v96p-opens li span { color: var(--gray-500); }
.v96p-opens li time { margin-left: auto; color: var(--gray-500); }
.v95p-rq-v .v96-l { max-width: 100%; }
.v95p-rq-s .v96-l + em, .v95p-rq-s .v96p-miss + em { display: block; margin-top: 2px; }
.v96p-docs .v96-dr-a .btn.ghost { height: 32px; }
.v96p-fp h4 { margin: 0 0 var(--s-2); font-size: var(--t-label-size); line-height: var(--t-label-lh); font-weight: var(--w-medium); color: var(--gray-500); }
.v96p-fp + .v96p-fp, .v96-list + .v96p-fp { border-top: 1px solid var(--line-soft); }
.v96p-states { display: flex; flex-wrap: wrap; gap: var(--s-2); margin-bottom: var(--s-2); }
.v96p-next { margin-top: var(--s-4); }
.v95p-buyer .v96-dr-a .btn.ghost { height: 32px; }
.v96p-gap { color: var(--attention-fg); }
.v96p-card .v96-steps.is-v .v96-st-d { flex: none; }
.v96p-phtabs { margin-bottom: var(--s-4); }

/* ---------- phones: a panel head's action and a row's label and actions take their own line ---------- */
@media (max-width: 699px) {
  .v96p-card > .v96-ph { flex-wrap: wrap; padding: var(--s-4); }
  .v96p-card > .v96-ph .v96-ph-a { width: 100%; padding-left: 44px; }
  .v96p-card .v96-dr, .v96p-pc .v96-dr { flex-wrap: wrap; row-gap: var(--s-2); }
  .v96p-card .v96-dr-main, .v96p-pc .v96-dr-main { flex: 1 1 100%; }
  .v96p-card .v96-dr-l, .v96p-card .v96-dr-a { padding-left: 48px; }
  .v96p-card .v96-dr-l + .v96-dr-a { padding-left: 0; }
  .v96p-card .v96-dr-a { flex-wrap: wrap; }
  .v96p-pc .v96-dr-l, .v96p-pc .v96-dr-a { padding-left: 48px; }
  .v96p-pc .v96-dr-l + .v96-dr-a { padding-left: 0; }
  .v96p-opens li time { margin-left: 0; width: 100%; }
}
/* lead, after the side-by-side: a cover is the firm's own tint, never a status colour. The warm hues (green, amber, rose, orange)
   map onto the cool ones, so a recall or a hold is said only by its label */
.v96p-cover[data-hue="2"] { --cv: var(--hue-6-bg); } .v96p-cover[data-hue="3"] { --cv: var(--hue-1-bg); }
.v96p-cover[data-hue="5"] { --cv: var(--hue-4-bg); } .v96p-cover[data-hue="7"] { --cv: var(--hue-8-bg); }

/* v97 (builder): a document on the file that Veritura could not read: in review, read by a Veritura reviewer, or not usable */
.v97p-rv { display: inline-block; margin-top: 2px; font-size: 12.5px; line-height: 18px; color: var(--gray-700); }
.v97p-rv[data-state="reviewed"] { color: var(--positive-fg); }
.v97p-rv[data-state="declined"] { color: var(--attention-fg); }
.v96p-docs .v96-dr-s { white-space: normal; overflow: visible; text-overflow: clip; }

/* v97 (fixer A, M12): the live preview draws the public page's parts: its credential tiles under the head, documents as rows */
.v95p-pv .v95p-pv-creds { padding: var(--s-4) var(--s-6); border-bottom: 1px solid var(--gray-100); }
.v95p-pv .v95p-pv-creds .v96-creds { --cols: 3; }
.v95p-pv .v95p-pc-id .v95p-pc-r { order: -1; }
.v95p-pv-b .v96-list.v96p-flat { margin: 0 calc(-1 * var(--s-2)); }
.v95p-pv-b .v96-list.v96p-flat .v96-dr { padding: var(--s-2); }
.v95p-pv-b .v96-dr-s { white-space: normal; }
.v95p-pv-g .v96-l, .v95p-cr .v96-l { white-space: normal; height: auto; min-height: 22px; padding: 2px 8px; line-height: 16px; }
.v95p-pvframe.is-phone .v95p-pv-creds { padding: var(--s-3) var(--s-4); }
.v95p-pvframe.is-phone .v95p-pv-creds .v96-creds { --cols: 2; }
@media (max-width: 699px) { .v95p-pv .v95p-pv-creds { padding: var(--s-3) var(--s-4); } .v95p-pv .v95p-pv-creds .v96-creds { --cols: 2; } }

/* v97 (fixer A, audit M16): the suppliers table names every supplier and product in full (two lines, never cut), fits its card, and a
   row with no role says "Nothing on record" in each credential cell; on a phone those repeats fold into the first, and the row menu
   keeps clear of the name */
.v95p-dt table.v95p-stable { min-width: 0; }
.v95p-dt .v95p-ts .l1, .v95p-dt .v96p-tsup .l1 { white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: break-word; }
.v95p-dt .v96p-tsup .l2 { white-space: normal; }
.v95p-dt td .v95p-tcs.l1 { white-space: normal; }
.v95p-dt .v95p-tcs.v95p-unk .v95p-muted { white-space: normal; }
.v95p-dt table.v95p-stable td .l2.v95p-unk-l2 { display: none !important; white-space: normal; }
.v95p-dt .v95p-tstep .btn { white-space: normal; height: auto; min-height: 32px; padding-top: 4px; padding-bottom: 4px; text-align: left; line-height: 18px; }
.v95p-dt table.v95p-stable td.dt-act { width: 40px; }
@media (max-width: 699px) {
  .v95p-dt table.v95p-stable td.v95p-tc:has(.v95p-unk):not(:has(.v95p-unk1)) { display: none !important; }
  .v95p-dt table.v95p-stable td:first-child { padding-right: 44px !important; }
  .v95p-dt table.v95p-stable td.v95p-tc:has(.v95p-unk1)::before { content: "Credentials" !important; }
  .v95p-dt table.v95p-stable td .l2.v95p-unk-l2 { display: block !important; }
}

/* v97 (fixer A): the supply map's side panel says its facts as plain rows, not grey boxes; firms wear their kit avatar */
.page.smap .smkv97 { margin: 0; display: flex; flex-direction: column; }
.page.smap .smkv97 > div { display: flex; justify-content: space-between; gap: var(--s-3); padding: 7px 0; border-top: 1px solid var(--line-soft); font-size: var(--t-small-size); line-height: var(--t-small-lh); }
.page.smap .smkv97 > div:first-child { border-top: 0; }
.page.smap .smkv97 dt { color: var(--gray-500); }
.page.smap .smkv97 dd { margin: 0; font-weight: var(--w-semibold); color: var(--gray-900); text-align: right; min-width: 0; overflow-wrap: anywhere; }
.page.smap .smd-h > .v96-av, .page.smap li button > .v96-av { flex: none; }
.v89s-box .nn .v96-av { flex: none; }
/* v97 (fixer A): a supplier profile's "What they supply" line wraps between its facts, never before a "·" */
.v94-sup-t .v97-nw { white-space: nowrap; }
.v96p-dc .v96-dr-s, .v96p-dc .v96-dr-t { white-space: normal; }
/* v97 (fixer A): Discover cards keep their own height (a short card no longer stands half empty beside a long one), and every card's
   footer reads the same way: its actions, then "Open profile" on the line under them */
.v95p-dgrid { align-items: start; }
.v95p-dc-f { flex-wrap: wrap; row-gap: var(--s-2); }
.v95p-dc-f .v95p-sp1 { flex: 1 0 100%; height: 0; }
.v95p-dc-f .v95p-ext { margin-left: 0; }
