/**
 * catalog__center — стабильные 2 колонки + sticky scroll фильтра (desktop).
 * Эталон: Figma Frame 619 (384 + 32 + listing), поведение как DNS-shop.
 */
:root {
  --catalog-columns-gap: 32px;
  --catalog-sidebar-width-vue: 384px;
  --catalog-sidebar-width-legacy: 342px;
  --catalog-sticky-top: 180px;
  --catalog-sticky-bottom: 24px;
  --catalog-sidebar-scroll-pad-top: 8px;
  --catalog-sidebar-scroll-pad-bottom: 16px;
}

@media (max-width: 1000px) and (min-width: 901px) {
  :root {
    --catalog-sticky-top: 100px;
  }
}

@media (min-width: 901px) {
  .catalog__center--sticky-sidebar .catalog__wrapper:has(> .catalog__sidebar) {
    display: grid !important;
    grid-template-columns: var(--catalog-sidebar-width, var(--catalog-sidebar-width-legacy)) minmax(0, 1fr);
    gap: var(--catalog-columns-gap) !important;
    align-items: start;
  }

  .catalog__center--sticky-sidebar .catalog__wrapper--vue-filter,
  .catalog__center--sticky-sidebar .catalog__wrapper:has(.bx-filter--vue) {
    --catalog-sidebar-width: var(--catalog-sidebar-width-vue);
  }

  .catalog__center--sticky-sidebar .catalog__wrapper > .mob-block,
  .catalog__center--sticky-sidebar .catalog__wrapper > .mob-block .spoller-title.cf-spoller-hidden {
    display: none !important;
  }

  .catalog__center--sticky-sidebar .catalog__wrapper > .catalog__sidebar {
    grid-column: 1;
    grid-row: 1;
    position: sticky;
    top: var(--catalog-sticky-top);
    align-self: start;
    flex: none !important;
    width: var(--catalog-sidebar-width, var(--catalog-sidebar-width-legacy)) !important;
    max-width: var(--catalog-sidebar-width, var(--catalog-sidebar-width-legacy)) !important;
    min-width: 0;
    box-sizing: border-box;
    z-index: 5;
    padding-left: 0 !important;
    padding-top: var(--catalog-sidebar-scroll-pad-top);
    padding-bottom: var(--catalog-sidebar-scroll-pad-bottom);
    scroll-padding-top: var(--catalog-sidebar-scroll-pad-top);
    scroll-padding-bottom: var(--catalog-sidebar-scroll-pad-bottom);
    scrollbar-width: thin;
    scrollbar-color: #c9cfd6 rgba(228, 233, 240, 0.6);
  }

  .catalog__center--sticky-sidebar .catalog__wrapper > .catalog__sidebar:not(:has(.bx-filter--vue)) {
    max-height: calc(100vh - var(--catalog-sticky-top) - var(--catalog-sticky-bottom));
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior-y: auto;
  }

  .catalog__center--sticky-sidebar .catalog__wrapper > .catalog__sidebar:has(.bx-filter--vue) {
    overflow: visible;
    padding-top: 0;
    padding-bottom: 0;
  }

  .catalog__center--sticky-sidebar .catalog__wrapper > .catalog__sidebar:has(.bx-filter--vue) .catalog__filter,
  .catalog__center--sticky-sidebar .catalog__wrapper > .catalog__sidebar:has(.bx-filter--vue) .bx-filter--vue,
  .catalog__center--sticky-sidebar .catalog__wrapper > .catalog__sidebar:has(.bx-filter--vue) .catalog-filter-vue-root,
  .catalog__center--sticky-sidebar .catalog__wrapper > .catalog__sidebar:has(.bx-filter--vue) .cf-shell {
    display: block;
    flex: none;
    min-height: 0;
    max-height: none;
  }

  .catalog__center--sticky-sidebar .catalog__wrapper > .catalog__sidebar:has(.bx-filter--vue) .cf-sidebar {
    max-height: calc(100vh - var(--catalog-sticky-top) - var(--catalog-sticky-bottom));
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior-y: auto;
    padding-top: var(--catalog-sidebar-scroll-pad-top);
    padding-bottom: var(--catalog-sidebar-scroll-pad-bottom);
    scroll-padding-top: var(--catalog-sidebar-scroll-pad-top);
    scroll-padding-bottom: var(--catalog-sidebar-scroll-pad-bottom);
    scrollbar-width: thin;
    scrollbar-color: #c9cfd6 rgba(228, 233, 240, 0.6);
  }

  .catalog__center--sticky-sidebar .catalog__wrapper > .catalog__sidebar:has(.cf-modef--side) {
    overflow-x: visible;
  }

  .catalog__center--sticky-sidebar .catalog__wrapper > .catalog__sidebar:has(.bx-filter--vue):has(.cf-modef--side) {
    overflow-x: visible;
  }

  .catalog__center--sticky-sidebar .catalog__wrapper > .catalog__sidebar:has(.bx-filter--vue) .cf-sidebar:has(.cf-modef--side) {
    overflow-x: visible;
  }

  .catalog__center--sticky-sidebar .catalog__wrapper > .catalog__sidebar::-webkit-scrollbar,
  .catalog__center--sticky-sidebar .catalog__wrapper > .catalog__sidebar:has(.bx-filter--vue) .cf-sidebar::-webkit-scrollbar {
    width: 8px;
    height: 8px;
  }

  .catalog__center--sticky-sidebar .catalog__wrapper > .catalog__sidebar::-webkit-scrollbar-thumb,
  .catalog__center--sticky-sidebar .catalog__wrapper > .catalog__sidebar:has(.bx-filter--vue) .cf-sidebar::-webkit-scrollbar-thumb {
    background-color: #c9cfd6;
    border-radius: 25px;
  }

  .catalog__center--sticky-sidebar .catalog__wrapper > .catalog__sidebar::-webkit-scrollbar-track,
  .catalog__center--sticky-sidebar .catalog__wrapper > .catalog__sidebar:has(.bx-filter--vue) .cf-sidebar::-webkit-scrollbar-track {
    background: rgba(228, 233, 240, 0.46);
  }

  .catalog__center--sticky-sidebar .catalog__wrapper > .catalog__body {
    grid-column: 2;
    grid-row: 1;
    flex: none !important;
    width: auto !important;
    min-width: 0;
    max-width: none;
  }

  /* Сброс legacy fixed-sidebar из header.php */
  .catalog__center--sticky-sidebar .catalog__sidebar.sheensay_fixed,
  .catalog__center--sticky-sidebar .catalog__sidebar.end_sidebar {
    position: sticky !important;
    top: var(--catalog-sticky-top) !important;
    width: var(--catalog-sidebar-width, var(--catalog-sidebar-width-legacy)) !important;
    margin-top: 0 !important;
    align-self: start !important;
  }

  .catalog__center--sticky-sidebar .catalog__body.catalog_fixed {
    display: block !important;
    width: auto !important;
    margin-left: 0 !important;
  }

  .catalog__center--sticky-sidebar .catalog__filter--vue,
  .catalog__center--sticky-sidebar .catalog__filter:has(.bx-filter--vue) {
    padding: 0 !important;
    background: transparent !important;
    border-radius: 0 !important;
  }
}

@media (max-width: 900px) {
  .catalog__center--sticky-sidebar .catalog__wrapper {
    display: flex !important;
    flex-direction: column;
  }

  .catalog__center--sticky-sidebar .catalog__wrapper > .catalog__sidebar {
    position: static;
    max-height: none;
    overflow: visible;
    width: 100% !important;
    max-width: none !important;
  }
}

/* Frame 618 — описание раздела внизу выдачи */
.catalog-section-desc {
  margin-top: 20px;
  padding: 40px;
  background: #fff;
  border: none;
  border-radius: 15px;
  box-sizing: border-box;
}

.catalog-section-desc h2 {
  margin: 0;
  font-family: var(--cf-font-family);
  font-size: 25px;
  font-weight: 600;
  line-height: 25px;
  color: #1a1a1a;
}

.catalog-section-desc__content {
  font-family: var(--cf-font-family, Montserrat, "Open Sans", system-ui, sans-serif);
  font-size: 15px;
  line-height: 25px;
  font-weight: 400;
  color: #666;
}

.catalog-section-desc__content p,
.catalog-section-desc__content ul {
  margin: 0;
  padding: 0;
}

.catalog-section-desc__content strong,
.catalog-section-desc__content b {
  font-weight: 600;
  color: #1a1a1a;
}

.catalog-section-desc__content a {
  color: var(--cf-link, #006da0);
  text-decoration: underline;
}

.catalog-section-desc__content ul {
  list-style: none;
}

.catalog-section-desc__content li {
  margin: 0;
  padding: 0;
}

.catalog-section-desc__content li::before {
  content: "- ";
}

@media (max-width: 900px) {
  .catalog-section-desc {
    margin-top: 16px;
    padding: 24px 20px;
    border-radius: 12px;
  }
}
