/**
 * Compatibility layer: page CSS was written for legacy per-page layouts
 * with their own fixed headers. The unified site-header replaces those headers,
 * so we reset top padding, content width, and sticky offsets here.
 *
 * Reference width: /medicines, /manufacturers (.sr-grid-inner) and /salt-directory → 72rem.
 */

:root {
  --site-content-max: 72rem;
  --site-gutter: 1.5rem;
  --site-header-height: 4rem;
  --site-header-search-row-height: 3.25rem;
  --site-header-offset: var(--site-header-height);
}

/* Fixed header — offset main content (sticky fails on flex-body children) */
.site-header + .site-main {
  padding-top: var(--site-header-offset);
}

.site-header.site-header--has-search + .site-main {
  --site-header-offset: calc(var(--site-header-height) + var(--site-header-search-row-height));
}

/* Catalog pages (/medicines, /manufacturers): hero + A–Z stick together below site header */
.site-main .catalog-sticky-top {
  position: sticky;
  top: var(--site-header-height);
  z-index: 40;
}

.site-main .catalog-sticky-top .sr-az-wrap {
  position: static;
  top: auto;
}

/* ---- Full-width shell (catalog pages keep heroes/sections edge-to-edge) ---- */
.site-main {
  width: 100%;
  max-width: none;
  box-sizing: border-box;
}

/* Shared content column — matches medicines/manufacturers inner grids */
.site-container,
.site-main .container {
  max-width: var(--site-content-max);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--site-gutter);
  padding-right: var(--site-gutter);
  width: 100%;
  box-sizing: border-box;
}

/* Legacy page modifiers on <main>: drop old header offset */
main.site-main.sd-main,
main.site-main.bl-main,
main.site-main.bd-main {
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-top: calc(var(--site-header-offset) + 1.25rem) !important;
  box-sizing: border-box;
}

/* Search results — prototype layout: 80rem centered column */
main.site-main.sr-main {
  max-width: 80rem !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: calc(var(--site-header-offset) + 1.25rem) var(--site-gutter) 5rem !important;
  box-sizing: border-box;
}

main.site-main.sd-main,
main.site-main.bl-main,
main.site-main.bd-main {
  padding-bottom: 4rem !important;
}

.site-main.sr-main .sr-summary,
.site-main.sr-main .sr-layout {
  max-width: none;
  margin-left: 0;
  margin-right: 0;
  padding-left: 0;
  padding-right: 0;
  width: 100%;
}

.site-main.sr-main .pd-breadcrumb,
.site-main.sr-main .pd-layout,
.site-main.sr-main .mp-mfr-header,
.site-main.sr-main .mp-layout {
  max-width: var(--site-content-max);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--site-gutter);
  padding-right: var(--site-gutter);
  width: 100%;
  box-sizing: border-box;
}

/* Salt detail — single-column page, constrain the whole main block */
main.site-main.sd-main {
  max-width: var(--site-content-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--site-gutter) !important;
  padding-right: var(--site-gutter) !important;
  padding-bottom: 4rem !important;
}

.site-main.sd-main .sd-overview-layout,
.site-main.sd-main .sd-brands-section,
.site-main.sd-main .sd-faq-section,
.site-main.sd-main .sd-refs-section {
  width: 100%;
  max-width: none;
}

.site-main.sd-main .sd-ad-banner {
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}

/* Blog article — constrain main content column */
main.site-main.bd-main {
  max-width: var(--site-content-max) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: var(--site-gutter) !important;
  padding-right: var(--site-gutter) !important;
}

.site-main.bd-main .bd-article-header,
.site-main.bd-main .bd-body {
  max-width: 56rem;
}

/* Auth / B2B form pages */
.site-header + .site-main.si-main {
  min-height: calc(100vh - 8rem);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: calc(var(--site-header-offset) + 2rem) var(--site-gutter) 2rem;
}

.site-main .rg-layout {
  max-width: var(--site-content-max);
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  box-sizing: border-box;
}

.site-main.si-main .si-layout {
  width: 100%;
}

/* Manufacturer application wizard */
.site-header + .site-main.rg-main {
  min-height: calc(100vh - 8rem);
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: calc(var(--site-header-offset) + 2.5rem) var(--site-gutter) 4rem;
  box-sizing: border-box;
}

.site-header + .site-main.ty-main {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: calc(var(--site-header-offset) + 2rem) var(--site-gutter) 4rem;
  box-sizing: border-box;
}

/* Journal listing: center content column (bl-main width moved to .bl-container) */
.site-main.bl-main .bl-container {
  width: 100%;
  max-width: var(--site-content-max);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--site-gutter);
  padding-right: var(--site-gutter);
  box-sizing: border-box;
}

/* Search results knowledge panel sticky offset (two-row header on search-results) */
.site-header--has-search ~ .site-main .sr-knowledge-panel {
  top: var(--site-header-offset);
}

@media (min-width: 1024px) {
  .site-header--has-search ~ .site-main .sr-knowledge-panel {
    top: var(--site-header-offset);
    max-height: calc(100vh - var(--site-header-offset) - 1rem);
  }
}

/* Blog detail: sticky breadcrumb bar below unified header */
.site-main.bd-main .bd-breadcrumb-bar {
  top: var(--site-header-offset);
  margin: 0 calc(-1 * var(--site-gutter)) 1.5rem;
}

/* Mfr profile: breadcrumb width */
.site-main .pd-breadcrumb[style*="max-width"] {
  max-width: var(--site-content-max) !important;
  margin: 0 auto !important;
  padding: 0.5rem var(--site-gutter) 0 !important;
}

.site-main .mfp-hero {
  margin-top: 0;
}

/* Compare tray aligned to search-results width (prototype: 80rem) */
.sr-compare-tray-inner {
  max-width: 80rem;
  padding-left: var(--site-gutter);
  padding-right: var(--site-gutter);
  box-sizing: border-box;
}

/* Sign-in tabs */
.tab-pane.hidden {
  display: none !important;
}
