/* Histo Vault — HPI branding (colors sampled from the Histology Partners logo) */
@font-face { font-family: 'IBM Plex Sans'; font-weight: 400; font-display: swap;
  src: url('../fonts/ibm-plex-sans-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family: 'IBM Plex Sans'; font-weight: 600; font-display: swap;
  src: url('../fonts/ibm-plex-sans-latin-600-normal.woff2') format('woff2'); }

:root {
  --hv-blue: #2f86c6;
  --hv-blue-dark: #1f6aa3;
  --hv-sky: #48b0e0;
  --hv-lime: #80b820;
  --hv-lime-soft: #eef6dd;
  --hv-ink: #111827;
  --hv-muted: #5b6472;
  --hv-line: #e3e8ef;
  --hv-bg: #f6f8fb;
  --bs-primary: #2f86c6;
  --bs-primary-rgb: 47, 134, 198;
  --bs-link-color: #1f6aa3;
  --bs-link-color-rgb: 31, 106, 163;
  --bs-link-hover-color: #174f7a;
  --bs-body-font-family: 'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --bs-body-color: #111827;
}
body { background: #fff; color: var(--hv-ink); }
body.hv-app { background: var(--hv-bg); }
h1, h2, h3, h4, h5 { font-weight: 600; letter-spacing: -0.01em; }
.text-muted { color: var(--hv-muted) !important; }

.btn-primary { --bs-btn-bg: var(--hv-blue); --bs-btn-border-color: var(--hv-blue);
  --bs-btn-hover-bg: var(--hv-blue-dark); --bs-btn-hover-border-color: var(--hv-blue-dark);
  --bs-btn-active-bg: var(--hv-blue-dark); --bs-btn-disabled-bg: var(--hv-blue); }
.btn-outline-primary { --bs-btn-color: var(--hv-blue); --bs-btn-border-color: var(--hv-blue);
  --bs-btn-hover-bg: var(--hv-blue); --bs-btn-hover-border-color: var(--hv-blue); --bs-btn-active-bg: var(--hv-blue-dark); }
.btn-lime { background: var(--hv-lime); border-color: var(--hv-lime); color: #fff; font-weight: 600; }
.btn-lime:hover { background: #6c9e19; border-color: #6c9e19; color: #fff; }

/* Header */
.hv-header { background: #fff; border-bottom: 1px solid var(--hv-line); }
.hv-header .navbar-brand img { height: 34px; width: auto; }
.hv-brand-name { font-weight: 600; font-size: 1.05rem; color: var(--hv-ink); margin-left: .6rem;
  padding-left: .6rem; border-left: 2px solid var(--hv-line); }
.hv-header .nav-link { color: var(--hv-ink); font-weight: 500; }
.hv-header .nav-link:hover, .hv-header .nav-link.active { color: var(--hv-blue); }

/* Hero */
.hv-hero { background: linear-gradient(135deg, #0f2b45 0%, #17476e 55%, #1f6aa3 100%); color: #fff; }
.hv-hero h1 { font-size: clamp(2rem, 4vw, 3.1rem); line-height: 1.12; }
.hv-hero .lead { color: #d6e6f4; max-width: 40rem; }
.hv-hero .badge-lime { background: var(--hv-lime); color: #fff; font-weight: 600; }
.hv-dots { display: inline-flex; gap: 6px; }
.hv-dots span { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }

.hv-section { padding: 4.5rem 0; }
.hv-section-alt { background: var(--hv-bg); }
.hv-eyebrow { color: var(--hv-blue); font-weight: 600; text-transform: uppercase; letter-spacing: .08em; font-size: .8rem; }

.hv-card { background: #fff; border: 1px solid var(--hv-line); border-radius: 14px; padding: 1.5rem; height: 100%; }
.hv-card .hv-icon { width: 44px; height: 44px; border-radius: 12px; display: inline-flex; align-items: center;
  justify-content: center; background: #e8f2fa; color: var(--hv-blue); font-size: 1.35rem; margin-bottom: .9rem; }
.hv-card .hv-icon.lime { background: var(--hv-lime-soft); color: #5e8c12; }
.hv-card h3 { font-size: 1.1rem; }
.hv-card p { color: var(--hv-muted); margin-bottom: 0; }

.hv-price { border: 1px solid var(--hv-line); border-radius: 16px; padding: 2rem; background: #fff; height: 100%; }
.hv-price.highlight { border: 2px solid var(--hv-blue); box-shadow: 0 10px 30px rgba(31, 106, 163, .12); }
.hv-price .amount { font-size: 2.2rem; font-weight: 600; }
.hv-price ul { padding-left: 0; list-style: none; }
.hv-price li { padding: .3rem 0; }
.hv-price li::before { content: '\2713'; color: var(--hv-lime); font-weight: 700; margin-right: .5rem; }

/* Forms and auth pages */
.hv-auth { max-width: 460px; margin: 3rem auto; }
.hv-auth-wide { max-width: 820px; margin: 2.5rem auto; }
.hv-panel { background: #fff; border: 1px solid var(--hv-line); border-radius: 16px; padding: 2rem;
  box-shadow: 0 6px 24px rgba(17, 24, 39, .05); }
.form-label { font-weight: 500; }
.hv-honeypot { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.hv-fieldset-title { font-size: .85rem; font-weight: 600; text-transform: uppercase; letter-spacing: .06em;
  color: var(--hv-muted); border-bottom: 1px solid var(--hv-line); padding-bottom: .4rem; margin: 1.5rem 0 1rem; }

/* Review banner on placeholder legal text */
.hv-review-banner { background: #fff4e5; border: 1px solid #f5c27a; color: #7a4b00; border-radius: 10px;
  padding: .85rem 1rem; font-weight: 500; }

/* App shell */
.hv-appbar { background: #fff; border-bottom: 1px solid var(--hv-line); }
.hv-trial { background: var(--hv-lime-soft); border-bottom: 1px solid #d7e9b4; color: #3f5e0c; font-size: .92rem; }
.hv-stat { background: #fff; border: 1px solid var(--hv-line); border-radius: 14px; padding: 1.25rem; height: 100%; }
.hv-stat .label { color: var(--hv-muted); font-size: .82rem; text-transform: uppercase; letter-spacing: .05em; }
.hv-stat .value { font-size: 1.6rem; font-weight: 600; }

.hv-footer { background: #0f2b45; color: #b9cde0; font-size: .92rem; }
.hv-footer a { color: #e5eef6; text-decoration: none; }
.hv-footer a:hover { text-decoration: underline; }
.hv-footer img { height: 30px; }

@media (max-width: 575.98px) {
  .hv-panel { padding: 1.25rem; border-radius: 12px; }
  .hv-section { padding: 3rem 0; }
  .hv-brand-name { display: none; }
}

/* Inventory */
.hv-ghs { width: 34px; height: 34px; }
.hv-ghs-sm { width: 24px; height: 24px; }
.hv-tree-indent { display: inline-block; width: 1.25rem; }
.hv-exp-expired { color: #b42318; font-weight: 600; }
.hv-exp-soon { color: #b54708; font-weight: 600; }
.hv-badge-review { background: #fff4e5; color: #7a4b00; border: 1px solid #f5c27a; }
.hv-timeline { list-style: none; padding-left: 0; margin: 0; }
.hv-timeline li { border-left: 2px solid var(--hv-line); padding: 0 0 .9rem 1rem; position: relative; }
.hv-timeline li::before { content: ''; position: absolute; left: -6px; top: .35rem; width: 10px; height: 10px;
  border-radius: 50%; background: var(--hv-blue); }
.hv-meter { height: 10px; border-radius: 6px; background: #e9eef4; overflow: hidden; }
.hv-meter > span { display: block; height: 100%; background: var(--hv-lime); }
.hv-meter.near > span { background: #f79009; }
.hv-meter.over > span { background: #d92d20; }
.hv-w-0 { width: 0; } .hv-w-10 { width: 10%; } .hv-w-20 { width: 20%; } .hv-w-30 { width: 30%; } .hv-w-40 { width: 40%; }
.hv-w-50 { width: 50%; } .hv-w-60 { width: 60%; } .hv-w-70 { width: 70%; } .hv-w-80 { width: 80%; } .hv-w-90 { width: 90%; }
.hv-w-100 { width: 100%; }
.hv-app-icon { width: 240px; max-width: 70%; height: auto; border-radius: 22%; box-shadow: 0 12px 32px rgba(3, 40, 80, .25); }
.hv-plan-option { display: block; border: 1px solid var(--hv-line); border-radius: 12px; padding: .75rem 1rem; cursor: pointer; background: #fff; }
.hv-plan-option:has(input:checked) { border: 2px solid var(--hv-blue); box-shadow: 0 6px 18px rgba(31, 106, 163, .12); }

/* Printing (the user manual, reports): only the page content, black on white. */
@media print {
  .hv-appbar, .hv-trial, .hv-footer, .navbar, .d-print-none, .visually-hidden-focusable { display: none !important; }
  body, .hv-app { background: #fff !important; color: #000 !important; }
  .hv-panel { box-shadow: none !important; border: 1px solid #bbb !important; }
  a { color: #000 !important; text-decoration: none !important; }
  .hv-manual h2 { break-before: page; }
  .hv-manual h2.hv-first, .hv-manual h3, .hv-manual table, .hv-manual .hv-tip { break-inside: avoid; break-after: avoid-page; }
  .hv-manual table, .hv-manual .hv-tip { break-after: auto; }
}
.hv-manual { max-width: 920px; }
.hv-manual h2 { margin-top: 2.5rem; padding-bottom: .35rem; border-bottom: 3px solid var(--hv-lime, #c8d400); }
.hv-manual h3 { margin-top: 1.5rem; font-size: 1.1rem; }
.hv-manual .hv-tip { border-left: 4px solid var(--hv-blue, #023260); background: rgba(2, 50, 96, .06); padding: .6rem .9rem; margin: 1rem 0; }
.hv-manual .hv-toc { columns: 2; column-gap: 2rem; }
@media (max-width: 575px) { .hv-manual .hv-toc { columns: 1; } }