/* Main inventory only. Shared markup, result replacement, observers and image
   variants remain authoritative; storefront/detail never load this stylesheet. */
body.club-stock-page.club-stock-compact {
  --club-ink: var(--cmb-text);
  --club-muted: var(--cmb-text-muted);
  --club-orange: var(--cmb-orange);
  --club-orange-dark: var(--cmb-orange-hover);
  margin: 0;
  color: var(--cmb-text);
  background: var(--cmb-warm-background);
  font: 400 var(--cmb-font-body)/var(--cmb-leading) var(--cmb-font);
  -webkit-font-smoothing: antialiased;
}

body.club-stock-page *,
body.club-stock-page *::before,
body.club-stock-page *::after { box-sizing: border-box; }

body.club-stock-page :is(button, input, select, textarea) { font-family: var(--cmb-font); }
body.club-stock-page :is(a, button, summary, input, select, textarea):focus-visible {
  outline: var(--cmb-focus-ring);
  outline-offset: 3px;
}
body.club-stock-page [id] { scroll-margin-block: calc(var(--cmb-header-height) + 16px) 112px; }

/* Catalog variant: wide enough for five cards, with the landing's gutters. */
body.club-stock-page.club-stock-compact .club-stock-main {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0 0 var(--cmb-space-7);
}
body.club-stock-page.club-stock-compact .club-stock-main > .container {
  width: min(var(--cmb-container-catalog), calc(100% - var(--cmb-gutter) * 2));
  max-width: none;
  margin-inline: auto;
  padding-inline: 0;
}

/* Editorial title + compact operational toolbar. */
body.club-stock-page.club-stock-compact .club-stock-page-heading {
  gap: var(--cmb-space-6);
  padding-block: var(--cmb-space-7) var(--cmb-space-6);
}
body.club-stock-page.club-stock-compact .club-stock-intro { gap: var(--cmb-space-2); }
body.club-stock-page.club-stock-compact .club-stock-intro h1 {
  color: var(--cmb-text);
  font: 700 clamp(32px, 3.1vw, 44px)/var(--cmb-heading-leading) var(--cmb-font);
  letter-spacing: var(--cmb-heading-tracking);
}
body.club-stock-page.club-stock-compact .club-stock-intro .public-ai-discovery,
body.club-stock-page.club-stock-compact .club-stock-intro p {
  margin: 0;
  color: var(--cmb-text-muted);
  font-size: var(--cmb-font-body);
  line-height: var(--cmb-leading);
}
body.club-stock-page .public-ai-discovery > .material-symbols-outlined { color: var(--cmb-orange); font-size: 20px; }
body.club-stock-page .public-stock-ai-help { border-radius: var(--cmb-radius-control); }
body.club-stock-page.club-stock-compact .club-stock-heading-actions {
  gap: var(--cmb-space-4);
  padding: var(--cmb-space-2) var(--cmb-space-3);
  border: 1px solid var(--cmb-border);
  border-radius: var(--cmb-radius-card);
  background: var(--cmb-surface);
}
body.club-stock-page .club-stock-result-count {
  color: var(--cmb-text-muted);
  font-size: 13px;
  font-weight: 500;
}
body.club-stock-page .club-stock-sort-form { gap: var(--cmb-space-2); }
body.club-stock-page .club-stock-sort-form label { color: var(--cmb-text); font-size: 13px; font-weight: 600; }
body.club-stock-page .club-stock-sort-form select {
  max-width: none;
  min-height: var(--cmb-control-height);
  padding-inline: var(--cmb-space-3) var(--cmb-space-6);
  border-color: var(--cmb-border);
  border-radius: var(--cmb-radius-control);
  color: var(--cmb-text);
  font-size: 13px;
  font-weight: 600;
}

/* Keep the existing measured rail and original nodes, including overflow. */
body.club-stock-page .club-public-stock-filters { margin-bottom: var(--cmb-space-5); }
body.club-stock-page .club-public-stock-filters__form { gap: var(--cmb-space-2); }
body.club-stock-page .club-public-stock-filter { flex: 0 0 auto; color: var(--cmb-text); font-size: 13px; font-weight: 600; }
body.club-stock-page .club-public-stock-filter > summary,
body.club-stock-page .club-public-stock-filter--select {
  min-height: var(--cmb-control-height);
  gap: var(--cmb-space-2);
  padding-inline: var(--cmb-space-3);
  border-color: var(--cmb-border);
  border-radius: var(--cmb-radius-control);
  background: #fff;
  font-size: 13px;
}
body.club-stock-page .club-public-stock-filter > summary .material-symbols-outlined,
body.club-stock-page .club-public-stock-filter--select > .material-symbols-outlined {
  flex: 0 0 auto;
  color: var(--cmb-text-muted);
  font-size: 18px;
  line-height: 1;
}
body.club-stock-page .club-public-stock-filter--select select { color: var(--cmb-text-muted); }
body.club-stock-page .club-public-stock-filter__value { color: var(--cmb-orange-hover); font-weight: 600; }
body.club-stock-page .club-public-stock-filter[open] > summary,
body.club-stock-page .club-public-stock-filter.has-active-filter > summary,
body.club-stock-page .club-public-stock-filter--select.has-active-filter,
body.club-stock-page .club-public-stock-filter--more.has-active-overflow-filter > summary {
  border-color: var(--cmb-orange);
  background: var(--cmb-orange-soft);
  box-shadow: none;
}
body.club-stock-page .club-public-stock-filter--more.has-overflow-filters > summary::after {
  display: none;
}
/* The existing script stores the count on details, not on summary. */
body.club-stock-page .club-public-stock-filter--more.has-overflow-filters::before {
  position: absolute;
  top: 14px;
  right: 12px;
  display: grid;
  min-width: 16px;
  height: 16px;
  place-items: center;
  pointer-events: none;
  content: attr(data-stock-overflow-count);
  border-radius: var(--cmb-radius-small);
  color: var(--cmb-orange-hover);
  background: var(--cmb-orange-soft);
  font-size: 10px;
}
body.club-stock-page .club-public-stock-filter--more.has-overflow-filters > summary { padding-right: 36px; }
body.club-stock-page .club-public-stock-filter__popover,
body.club-stock-page .club-public-stock-filter__popover.is-two-columns,
body.club-stock-page .club-public-stock-filter__popover--more {
  gap: var(--cmb-space-4);
  padding: var(--cmb-space-4);
  border-color: var(--cmb-border);
  border-radius: var(--cmb-radius-card);
  background: var(--cmb-surface);
  box-shadow: var(--cmb-shadow-overlay);
}
body.club-stock-page .club-public-stock-filter__popover label { gap: var(--cmb-space-2); color: var(--cmb-text); font-size: 13px; font-weight: 600; }
body.club-stock-page .club-public-stock-filter__popover input,
body.club-stock-page .club-public-stock-filter__popover select {
  min-height: var(--cmb-control-height);
  border-color: var(--cmb-border);
  border-radius: var(--cmb-radius-control);
  color: var(--cmb-text);
  font-size: 14px;
  font-weight: 400;
}
body.club-stock-page .club-public-stock-filter__popover :is(input, select):focus { border-color: var(--cmb-orange); }
body.club-stock-page .club-public-stock-filter__popover input::placeholder { color: var(--cmb-text-muted); opacity: 1; }
body.club-stock-page .club-public-stock-filter__popover input:disabled { color: var(--cmb-text-muted); background: var(--cmb-warm-background); }
body.club-stock-page .club-public-stock-filter__popover .club-public-stock-filter__check { border-color: var(--cmb-border); border-radius: var(--cmb-radius-control); }
body.club-stock-page .club-public-stock-filter__check input { width: 18px; min-height: 18px; accent-color: var(--cmb-orange); }
body.club-stock-page .club-stock-combobox__results { padding: var(--cmb-space-1); border-color: var(--cmb-border); border-radius: var(--cmb-radius-control); box-shadow: var(--cmb-shadow-overlay); }
body.club-stock-page .club-stock-combobox__results [role="option"] { min-height: var(--cmb-control-height); color: var(--cmb-text); font-size: 14px; font-weight: 400; }
body.club-stock-page .club-stock-combobox__results [role="option"]:is(:hover, :focus) { background: var(--cmb-orange-soft); }
body.club-stock-page .club-public-stock-filters__applied { gap: var(--cmb-space-2); color: var(--cmb-text-muted); font-size: 13px; font-weight: 500; flex-wrap: wrap; }
body.club-stock-page .club-stock-filter-chip { min-height: 32px; border-color: var(--cmb-border); border-radius: var(--cmb-radius-small); color: var(--cmb-orange-hover); background: var(--cmb-orange-soft); font: 500 12px/1.4 var(--cmb-font); }
body.club-stock-page .club-public-stock-filters__clear-link { min-height: var(--cmb-control-height); color: var(--cmb-orange-hover); }

/* Approved grid breakpoints remain in club-ui-system.css: 5/4/3/2/1. */
body.club-stock-page.club-stock-compact .club-stock-grid.club-public-vehicle-grid { gap: var(--cmb-space-5) var(--cmb-space-4); align-items: stretch; }
body.club-stock-page .club-stock-pagination { margin-top: var(--cmb-space-6); color: var(--cmb-text-muted); }
body.club-stock-page .club-stock-pagination :is(a, span) { min-height: var(--cmb-control-height); min-width: var(--cmb-control-height); border-radius: var(--cmb-radius-control); border-color: var(--cmb-border); }
body.club-stock-page .club-empty-state { border-color: var(--cmb-border); border-radius: var(--cmb-radius-card); color: var(--cmb-text); background: var(--cmb-surface); box-shadow: none; }

@media (max-width: 899px) {
  body.club-stock-page.club-stock-compact .club-stock-page-heading { grid-template-columns: minmax(0, 1fr); gap: var(--cmb-space-5); }
  body.club-stock-page.club-stock-compact .club-stock-heading-actions { width: 100%; justify-content: space-between; }
}

@media (min-width: 900px) and (max-width: 1099px) {
  body.club-stock-page.club-stock-compact .club-stock-page-heading { padding-block: var(--cmb-space-6) var(--cmb-space-5); }
}

@media (max-width: 699px) {
  /* The stock needs the same compact safe-area gutter across header, filters,
     cards and the assistant; card internals retain their existing spacing. */
  body.club-stock-page.club-stock-compact { --cmb-gutter: 8px; }
  body.club-stock-page.club-stock-compact .club-stock-page-heading { padding-block: var(--cmb-space-4); gap: var(--cmb-space-4); }
  body.club-stock-page.club-stock-compact .club-stock-intro { gap: var(--cmb-space-1); }
  body.club-stock-page.club-stock-compact .club-stock-intro .public-ai-discovery { font-size: 14px; }
  body.club-stock-page.club-stock-compact .club-stock-heading-actions { align-items: center; flex-direction: row; gap: var(--cmb-space-2); padding: var(--cmb-space-2); }
  body.club-stock-page .club-stock-result-count { font-size: 12px; }
  body.club-stock-page .club-stock-sort-form label { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); }
  body.club-stock-page .club-stock-sort-form select { width: 164px; max-width: 100%; padding-left: var(--cmb-space-2); }
  body.club-stock-page .club-public-stock-filters { margin-bottom: var(--cmb-space-4); }
  body.club-stock-page .club-public-stock-filter > summary,
  body.club-stock-page .club-public-stock-filter--select { gap: 6px; padding-inline: 10px; font-size: 12px; }
  body.club-stock-page .club-public-stock-filter--more.has-overflow-filters > summary { padding-right: 32px; }
  body.club-stock-page .club-public-stock-filter__popover,
  body.club-stock-page .club-public-stock-filter__popover.is-two-columns,
  body.club-stock-page .club-public-stock-filter__popover--more { width: min(400px, calc(100vw - var(--cmb-gutter) * 2)); max-height: 55dvh; overflow-y: auto; }
  body.club-stock-page .club-public-stock-filter__popover :is(input, select) { font-size: 16px; }
  body.club-stock-page .club-stock-combobox__results { position: static; margin-top: var(--cmb-space-2); max-height: 180px; box-shadow: none; }
  body.club-stock-page .club-public-stock-filter__overflow .club-public-stock-filter__popover { max-height: none; overflow: visible; }
  body.club-stock-page:has(.club-public-stock-filters__form.has-open-filter) .public-ai-chat:not(.is-expanded) { visibility: hidden; }
}

@media (max-width: 359px) {
  body.club-stock-page.club-stock-compact .club-stock-heading-actions { flex-direction: column; align-items: stretch; }
  body.club-stock-page .club-stock-sort-form select { width: 100%; }
  body.club-stock-page .club-public-stock-filter > summary { gap: 4px; padding-inline: 8px; font-size: 11px; }
  body.club-stock-page .club-public-stock-filter--more.has-overflow-filters > summary { padding-right: 8px; }
  body.club-stock-page .club-public-stock-filter--more.has-overflow-filters::before { display: none; }
}
