/* Каталог запчастин — базові стилі. Кольори й заокруглення змінюються змінними нижче або вимикаються в налаштуваннях. */
:root {
  /* Беруть кольори теми сайту (--accent, --main-text, --secind-text, --border), якщо вони є. */
  --parts-accent: var(--accent, #057CEE);
  --parts-accent-contrast: var(--white, #fff);
  --parts-text: var(--main-text, #111317);
  --parts-muted: var(--secind-text, #626876);
  --parts-border: var(--border, #E4E5E9);
  --parts-surface: var(--white, #fff);
  /* Світло-блакитна плитка, як на сайті: панелі категорій, плитки марок, наведення. */
  --parts-panel: #EDF6FD;
  --parts-panel-hover: #DCEDFB;
  --parts-hover: var(--parts-panel);
  --parts-radius: 6px;
  --parts-radius-panel: 14px;
  --parts-radius-card: 18px;
  --parts-gap: 8px;
}

/* Фільтр */
.parts-filter { margin: 0 0 20px; color: var(--parts-text); }
.parts-filter__title { font-weight: 600; font-size: 15px; margin: 0 0 10px; }
.parts-filter__hint { margin: 0; color: var(--parts-muted); font-size: 14px; }
.parts-filter form { margin: 0; }
.parts-filter ul { list-style: none; margin: 0; padding: 0; }
.parts-filter__more {
  margin-top: 8px; padding: 0; border: 0; background: none; color: var(--parts-accent);
  font: inherit; font-size: 14px; cursor: pointer;
}

/* Чекбокси й радіо */
.parts-options--checkbox li + li,
.parts-options--radio li + li { margin-top: 2px; }
.parts-option label,
.parts-tree__row label {
  display: flex; align-items: center; gap: 8px; margin: 0; padding: 5px 6px;
  border-radius: calc(var(--parts-radius) - 2px); cursor: pointer; font-size: 14px; line-height: 1.3;
}
.parts-option label:hover,
.parts-tree__row label:hover { background: var(--parts-hover); }
.parts-option input,
.parts-tree__row input { width: 16px; height: 16px; margin: 0; flex: none; accent-color: var(--parts-accent); }
.parts-option__label { flex: 1; min-width: 0; overflow-wrap: anywhere; color: var(--parts-text); }
.parts-option__count { flex: none; color: var(--parts-muted); font-size: 12px; font-variant-numeric: tabular-nums; }
.parts-option.is-empty label { opacity: .45; cursor: default; }

/* Кнопки */
.parts-options--buttons,
.parts-options--buttons-single { display: flex; flex-wrap: wrap; gap: var(--parts-gap); }
.parts-options--buttons .parts-option label,
.parts-options--buttons-single .parts-option label {
  position: relative; padding: 7px 12px; border: 1px solid var(--parts-border);
  border-radius: 999px; background: var(--parts-surface); gap: 6px;
}
.parts-options--buttons input,
.parts-options--buttons-single input { position: absolute; opacity: 0; pointer-events: none; }
.parts-options--buttons .is-checked label,
.parts-options--buttons-single .is-checked label {
  background: var(--parts-accent); border-color: var(--parts-accent); color: var(--parts-accent-contrast);
}
.parts-options--buttons .is-checked .parts-option__label,
.parts-options--buttons-single .is-checked .parts-option__label { color: inherit; }
.parts-options--buttons .is-checked .parts-option__count,
.parts-options--buttons-single .is-checked .parts-option__count { color: inherit; opacity: .8; }
.parts-options--buttons label:focus-within,
.parts-options--buttons-single label:focus-within { outline: 2px solid var(--parts-accent); outline-offset: 2px; }

/* Категорії: список із переходом усередину групи */
.parts-cats { display: flex; flex-direction: column; }
.parts-cats__list { list-style: none; margin: 0; padding: 0; }
.parts-cats__item,
.parts-cats__heading {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 8px 10px; border-radius: var(--parts-radius); color: var(--parts-text);
  font-size: 14px; line-height: 1.3; text-decoration: none; transition: background-color .15s, color .15s;
}
.parts-cats__item:hover,
.parts-cats__heading:hover { background: var(--parts-hover); color: var(--parts-text); }
/* Кнопки (категорія з підкатегоріями, «додому», «назад») виглядають так само, як посилання. */
.parts-cats button { margin: 0; border: 0; background: none; font: inherit; cursor: pointer; }
.parts-cats button.parts-cats__item { width: 100%; text-align: left; }
.parts-cats button.parts-cats__home { border: 1px solid var(--parts-border); background: var(--parts-surface); }
.parts-cats__panel[hidden] { display: none; }
.parts-cats__heading { font-weight: 600; font-size: 15px; }
.parts-cats__heading + .parts-cats__list { margin-left: 10px; padding-left: 8px; border-left: 2px solid var(--parts-border); }
.parts-cats__name { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.parts-cats__count {
  flex: none; min-width: 28px; padding: 1px 7px; border-radius: 999px; background: var(--parts-hover);
  color: var(--parts-muted); font-size: 12px; text-align: center; font-variant-numeric: tabular-nums;
}
.parts-cats .is-active { background: color-mix(in srgb, var(--parts-accent) 10%, transparent); color: var(--parts-accent); font-weight: 600; }
.parts-cats .is-active .parts-cats__count { background: var(--parts-accent); color: var(--parts-accent-contrast); }
.parts-cats__nav { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; }
.parts-cats__home {
  display: inline-flex; align-items: center; justify-content: center; flex: none; width: 32px; height: 32px;
  border: 1px solid var(--parts-border); border-radius: var(--parts-radius); background: var(--parts-surface); color: var(--parts-muted);
}
.parts-cats__home:hover { border-color: var(--parts-accent); color: var(--parts-accent); }
.parts-cats__back {
  display: inline-flex; align-items: center; gap: 6px; min-width: 0; padding: 4px 6px;
  color: var(--parts-muted); font-size: 13px; text-decoration: none;
}
.parts-cats__back:hover { color: var(--parts-accent); }
.parts-cats__arrow { display: inline-flex; flex: none; width: 14px; color: var(--parts-muted); }
.parts-cats__item:hover .parts-cats__arrow { color: var(--parts-accent); }
.parts-cats__heading .parts-cats__count { margin-right: 26px; }

/* Меню категорій [parts_categories] */
.parts-category-tree ul { list-style: none; margin: 0; padding: 0; }
.parts-category-tree ul ul { margin: 2px 0 6px 14px; padding-left: 10px; border-left: 1px solid var(--parts-border); }
.parts-category-tree li { margin: 2px 0; }
.parts-category-tree .level-1 > li > a { font-weight: 600; }
.parts-category-tree .parts-count { color: var(--parts-muted); font-size: 12px; }
.parts-category-tree .is-current > a { color: var(--parts-accent); }

/* Ціна й пошук */
.parts-price,
.parts-search { display: flex; align-items: center; gap: var(--parts-gap); }
.parts-price label { display: flex; align-items: center; gap: 6px; margin: 0; flex: 1; min-width: 0; font-size: 14px; color: var(--parts-muted); }
.parts-price input,
.parts-search input,
.parts-filter select,
.parts-vehicle select {
  width: 100%; min-width: 0; padding: 8px 10px; border: 1px solid var(--parts-border);
  border-radius: var(--parts-radius); background: var(--parts-surface); font: inherit; font-size: 14px; color: inherit;
}
.parts-search input { flex: 1; }

.parts-button {
  flex: none; padding: 9px 16px; border: 0; border-radius: var(--parts-radius);
  background: var(--parts-accent); color: var(--parts-accent-contrast); font: inherit; font-size: 14px; font-weight: 600; cursor: pointer;
}
.parts-button:hover { filter: brightness(.94); }
.parts-button--small { padding: 8px 12px; }

/* Обрані фільтри */
.parts-active { display: flex; flex-wrap: wrap; gap: var(--parts-gap); margin: 0 0 16px; }
.parts-chip {
  display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px;
  border: 1px solid var(--parts-border); border-radius: 999px; background: var(--parts-surface);
  font-size: 13px; color: inherit; text-decoration: none;
}
.parts-chip span { color: var(--parts-muted); font-size: 15px; line-height: 1; }
.parts-chip:hover { border-color: var(--parts-accent); }
.parts-chip--reset { border-color: transparent; color: var(--parts-accent); }

/* Пагінація */
.parts-pagination { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 28px 0 8px; }
.parts-page {
  display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; padding: 0 10px;
  border: 1px solid var(--parts-border); border-radius: var(--parts-radius); background: var(--parts-surface);
  font-size: 14px; font-variant-numeric: tabular-nums; color: inherit; text-decoration: none;
}
a.parts-page:hover { border-color: var(--parts-accent); color: var(--parts-accent); }
.parts-page.is-current { background: var(--parts-accent); border-color: var(--parts-accent); color: var(--parts-accent-contrast); font-weight: 600; }
.parts-page.is-disabled { opacity: .4; }
.parts-page--gap { border-color: transparent; background: none; min-width: 24px; padding: 0; }

/* Підбір авто */
.parts-vehicle { display: flex; flex-direction: column; align-items: stretch; gap: 12px; }
.parts-vehicle .parts-button { align-self: stretch; }
.parts-vehicle.is-loading { cursor: progress; }
.parts-vehicle__field { display: flex; flex-direction: column; gap: 4px; margin: 0; font-size: 13px; color: var(--parts-muted); }
.parts-vehicle select:disabled { opacity: .55; }
.parts-vehicle__reset { align-self: center; font-size: 14px; color: var(--parts-accent); }
@media (max-width: 767px) {

}

/* Стан */
.parts-total { color: var(--parts-muted); font-size: 14px; }
.parts-error { color: #b42318; }
.parts-img-missing { object-fit: contain; background: var(--parts-panel); }

/* Галерея товару */
.parts-gallery { display: flex; flex-direction: column; gap: 10px; }
.parts-gallery__main { aspect-ratio: 4 / 3; border: 1px solid var(--parts-border); border-radius: var(--parts-radius); background: var(--parts-surface); overflow: hidden; }
.parts-gallery__main a { display: block; width: 100%; height: 100%; }
.parts-gallery__main img { display: block; width: 100%; height: 100%; object-fit: contain; }
.parts-gallery__thumbs { display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: 8px; }
.parts-gallery__thumb { aspect-ratio: 1; padding: 0; border: 1px solid var(--parts-border); border-radius: calc(var(--parts-radius) - 2px); background: var(--parts-surface); overflow: hidden; cursor: pointer; }
.parts-gallery__thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.parts-gallery__thumb.is-active { border-color: var(--parts-accent); box-shadow: 0 0 0 1px var(--parts-accent); }

/* Характеристики [parts_attributes] */
.parts-attributes { margin: 0; }
.parts-attributes__row { display: grid; grid-template-columns: minmax(120px, 40%) 1fr; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--parts-border); }
.parts-attributes__row:last-child { border-bottom: 0; }
.parts-attributes__name { margin: 0; color: var(--parts-muted); }
.parts-attributes__value { margin: 0; color: var(--parts-text); font-weight: 500; }

/* Обране */
[data-parts-favorite] { cursor: pointer; }
.parts-favorite-button {
  display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border: 1px solid var(--parts-border);
  border-radius: var(--parts-radius); background: var(--parts-surface); color: var(--parts-text); font: inherit; font-size: 14px;
}
.parts-favorite-button.is-favorite { border-color: var(--parts-accent); color: var(--parts-accent); }
.parts-favorites-count.is-empty { opacity: .6; }
.parts-favorites.is-loading .parts-favorites__body { opacity: .5; }
.parts-favorites__table {
  width: 100%; border-collapse: separate; border-spacing: 0; background: var(--parts-surface);
  border: 1px solid var(--parts-border); border-radius: var(--parts-radius); overflow: hidden;
}
.parts-favorites__table th {
  text-align: left; font-size: 12px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase;
  color: var(--parts-muted); padding: 12px 14px; border-bottom: 1px solid var(--parts-border); background: var(--parts-surface);
}
.parts-favorites__table td { padding: 14px; border-bottom: 1px solid var(--parts-border); vertical-align: middle; font-size: 15px; color: var(--parts-text); }
.parts-favorites__table tbody tr:last-child td { border-bottom: 0; }
.parts-favorites__table tbody tr { transition: background-color .15s; }
.parts-favorites__table tbody tr:hover { background: var(--parts-hover); }
.parts-favorites__cell--photo { width: 96px; }
.parts-favorites__cell--photo img {
  display: block; width: 80px; height: 80px; object-fit: cover; border: 1px solid var(--parts-border);
  border-radius: var(--parts-radius); background: var(--parts-panel);
}
.parts-favorites__name { color: inherit; font-weight: 600; text-decoration: none; line-height: 1.35; }
.parts-favorites__name:hover { color: var(--parts-accent); }
.parts-favorites__cell--id,
.parts-favorites__cell--part_number { color: var(--parts-muted); white-space: nowrap; }
.parts-favorites__badge {
  display: inline-block; padding: 3px 10px; border: 1px solid var(--parts-border); border-radius: 999px;
  font-size: 13px; line-height: 1.4; white-space: nowrap;
}
.parts-favorites__cell--availability { color: var(--parts-muted); font-size: 14px; }
.parts-favorites__cell--price { white-space: nowrap; font-weight: 700; font-size: 17px; }
.parts-favorites__cell--remove { width: 1%; text-align: right; }
.parts-favorites button.parts-favorites__remove {
  display: inline-flex; align-items: center; gap: 4px; padding: 6px 8px; border: 0; border-radius: var(--parts-radius);
  background: transparent; color: var(--parts-muted); font: inherit; font-size: 14px; white-space: nowrap; cursor: pointer; box-shadow: none;
}
.parts-favorites button.parts-favorites__remove span { font-size: 18px; line-height: 1; }
.parts-favorites button.parts-favorites__remove:hover { color: var(--parts-accent); background: var(--parts-hover); }
.parts-favorites button.parts-favorites__clear {
  margin-top: 16px; padding: 10px 18px; border: 1px solid var(--parts-border); border-radius: var(--parts-radius);
  background: var(--parts-surface); color: var(--parts-text); font: inherit; font-size: 14px; cursor: pointer; box-shadow: none;
}
.parts-favorites button.parts-favorites__clear:hover { border-color: var(--parts-accent); color: var(--parts-accent); }
.parts-favorites__empty {
  margin: 0; padding: 40px 20px; text-align: center; color: var(--parts-muted); background: var(--parts-surface);
  border: 1px dashed var(--parts-border); border-radius: var(--parts-radius);
}
@media (max-width: 767px) {
  .parts-favorites__table { border: 0; background: transparent; overflow: visible; }
  .parts-favorites__table thead { display: none; }
  .parts-favorites__table tbody { display: grid; gap: 10px; }
  .parts-favorites__table tr {
    display: grid; grid-template-columns: 80px 1fr auto; column-gap: 12px; row-gap: 4px; align-items: center; padding: 12px;
    background: var(--parts-surface); border: 1px solid var(--parts-border); border-radius: var(--parts-radius);
  }
  .parts-favorites__table tbody tr:hover { background: var(--parts-surface); }
  .parts-favorites__table td { display: block; grid-column: 2 / -1; padding: 0; border: 0; font-size: 14px; }
  .parts-favorites__table .parts-favorites__cell--photo { grid-column: 1; grid-row: 1 / span 6; align-self: start; width: auto; }
  .parts-favorites__cell--id::before,
  .parts-favorites__cell--part_number::before { content: attr(data-label) ": "; }
  .parts-favorites__table .parts-favorites__cell--price { grid-column: 2; font-size: 16px; }
  .parts-favorites__table .parts-favorites__cell--remove { grid-column: 3; text-align: right; }
}

/* Картки з фото — [parts_vehicles] і [parts_category_cards] */
.parts-cards { display: flex; flex-direction: column; gap: 12px; }
.parts-cards.is-loading { cursor: progress; opacity: .7; }
.parts-cards__head { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.parts-cards__title { font-weight: 600; font-size: 16px; }
.parts-cards__back,
.parts-cards__all {
  display: inline-flex; align-items: center; gap: 6px; padding: 0; border: 0; background: none;
  color: var(--parts-muted); font: inherit; font-size: 14px; text-decoration: none; cursor: pointer;
}
.parts-cards__all { color: var(--parts-accent); }
.parts-cards__back:hover,
.parts-cards__all:hover { color: var(--parts-accent); text-decoration: underline; }
.parts-cards__search {
  margin-left: auto; min-width: 0; max-width: 220px; padding: 7px 10px; border: 1px solid var(--parts-border);
  border-radius: var(--parts-radius); background: var(--parts-surface); color: var(--parts-text); font-size: 14px;
}
.parts-cards__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.parts-cards__more {
  align-self: start; padding: 8px 14px; border: 1px solid var(--parts-border); border-radius: var(--parts-radius);
  background: var(--parts-surface); color: var(--parts-text); font-size: 14px; cursor: pointer;
}
.parts-cards__more:hover,
.parts-cards__less:hover { border-color: var(--parts-accent); color: var(--parts-accent); }
.parts-cards__actions { display: flex; gap: 10px; }
.parts-cards__less {
  padding: 8px 14px; border: 1px solid var(--parts-border); border-radius: var(--parts-radius);
  background: var(--parts-surface); color: var(--parts-text); font-size: 14px; cursor: pointer;
}
.parts-cards__more[hidden], .parts-cards__less[hidden] { display: none; }
.parts-cards__empty { color: var(--parts-muted); }
.parts-card {
  display: flex; flex-direction: column; gap: 6px; min-width: 0; padding: 10px; border: 1px solid var(--parts-border);
  border-radius: var(--parts-radius); background: var(--parts-surface); color: var(--parts-text); text-decoration: none;
  transition: border-color .15s, box-shadow .15s;
}
.parts-card:hover { border-color: var(--parts-accent); box-shadow: 0 4px 14px rgba(0, 0, 0, .06); }
/* Клас картки задає display, тож ховаємо явно: інакше атрибут hidden не діяв би. */
.parts-card[hidden], .parts-cards__more[hidden], .parts-cards__empty[hidden] { display: none; }
.parts-card__photo { display: block; aspect-ratio: 4 / 3; border-radius: calc(var(--parts-radius) - 2px); overflow: hidden; }
.parts-card__photo img { display: block; width: 100%; height: 100%; object-fit: contain; }
.parts-card__photo.is-empty { background: var(--parts-panel); }
.parts-cards--categories .parts-card__photo.is-empty,
.parts-cards--model .parts-card__photo.is-empty,
.parts-cards--generation .parts-card__photo.is-empty { aspect-ratio: 16 / 6; }
.parts-card__name { font-weight: 600; font-size: 14px; line-height: 1.3; overflow-wrap: anywhere; }
.parts-card__count { color: var(--parts-muted); font-size: 12px; }

/* Биті фото в галереї ховаються; клас мініатюри задає display, тож ховаємо явно. */
.parts-gallery__thumb[hidden], .parts-gallery__thumbs[hidden] { display: none; }

/* Лайтбокс фото товару */
.parts-gallery__main a[data-parts-lightbox] { cursor: zoom-in; display: block; }
.parts-lightbox {
  position: fixed; inset: 0; z-index: 10000; display: flex; align-items: center; justify-content: center;
  padding: 48px 16px; background: rgba(16, 18, 20, .92);
}
.parts-lightbox__image { max-width: min(1100px, 92vw); max-height: 86vh; object-fit: contain; border-radius: 4px; background: #fff; }
.parts-lightbox__close,
.parts-lightbox__nav {
  position: absolute; display: flex; align-items: center; justify-content: center; border: 0; background: rgba(255, 255, 255, .12);
  color: #fff; cursor: pointer; border-radius: 50%; line-height: 1; padding: 0;
}
.parts-lightbox__close { top: 14px; right: 16px; width: 42px; height: 42px; font-size: 28px; }
.parts-lightbox__nav { top: 50%; transform: translateY(-50%); width: 50px; height: 50px; font-size: 34px; }
.parts-lightbox__nav--prev { left: 12px; }
.parts-lightbox__nav--next { right: 12px; }
.parts-lightbox__close:hover,
.parts-lightbox__nav:hover { background: rgba(255, 255, 255, .24); }
.parts-lightbox__count { position: absolute; bottom: 16px; left: 0; right: 0; margin: 0; text-align: center; color: #fff; font-size: 14px; }
.parts-lightbox.is-single .parts-lightbox__nav,
.parts-lightbox.is-single .parts-lightbox__count { display: none; }
@media (max-width: 767px) {
  .parts-lightbox { padding: 44px 8px; }
  .parts-lightbox__nav { width: 40px; height: 40px; font-size: 26px; }
}

/* Форма підбору техніки: кнопки типів, вертикальне й горизонтальне розташування */
.parts-vehicle__types { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 4px; }
.parts-vehicle__type {
  display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border: 1px solid var(--parts-border);
  border-radius: var(--parts-radius); background: var(--parts-surface); color: var(--parts-text);
  text-decoration: none; font-size: 14px; line-height: 1.2; white-space: nowrap;
}
.parts-vehicle__type:hover { border-color: var(--parts-accent); color: var(--parts-accent); }
.parts-vehicle__type.is-active { border-color: var(--parts-accent); background: var(--parts-accent); color: var(--parts-accent-contrast); }
.parts-vehicle__icon { width: 20px; height: 20px; flex: none; }
.parts-vehicle__field--empty { opacity: .55; }
.parts-vehicle--horizontal {
  display: grid; grid-template-columns: repeat(var(--parts-vehicle-columns, 6), minmax(0, 1fr));
  gap: 10px; align-items: end;
}
.parts-vehicle--horizontal .parts-vehicle__types { grid-column: 1 / -1; }
.parts-vehicle--horizontal .parts-vehicle__field { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.parts-vehicle--horizontal .parts-vehicle__field select { width: 100%; }
.parts-vehicle--horizontal .parts-button { width: 100%; align-self: end; height: auto; min-height: 42px; }
/* П'ять і більше полів: кнопка окремим рядком на всю ширину. */
.parts-vehicle--horizontal.has-wide-button .parts-button { grid-column: 1 / -1; }
.parts-vehicle--horizontal .parts-vehicle__reset { grid-column: 1 / -1; justify-self: start; }
@media (max-width: 991px) {
  /* На планшеті — два поля в рядок, кнопка завжди знизу на всю ширину. */
  .parts-vehicle--horizontal { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .parts-vehicle--horizontal .parts-button { grid-column: 1 / -1; }
}
@media (max-width: 575px) {
  .parts-vehicle--horizontal { grid-template-columns: 1fr; }
  .parts-vehicle__type { flex: 1 1 calc(50% - 8px); justify-content: center; }
}

/* Плитки категорій: велике фото, під ним сіра панель із назвою і стрілкою */
.parts-cards--categories { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 20px; }
.parts-cards--categories .parts-card {
  padding: 0; gap: 0; border: 0; background: transparent; border-radius: 18px; overflow: hidden;
}
.parts-cards--categories .parts-card:hover { box-shadow: none; }
.parts-cards--categories .parts-card:hover .parts-card__go { transform: translateX(3px); color: var(--parts-accent); }
.parts-cards--categories .parts-card__photo {
  aspect-ratio: 16 / 10; border-radius: var(--parts-radius-card); background: var(--parts-panel);
}
.parts-cards--categories .parts-card__photo img { object-fit: cover; }
.parts-cards--categories .parts-card { height: 100%; }
.parts-cards--categories .parts-card__name {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex: 1;
  margin-top: 10px; padding: 14px 18px; border-radius: var(--parts-radius-panel); background: var(--parts-panel);
  font-size: 17px; font-weight: 600; line-height: 1.25; transition: background-color .15s;
}
.parts-cards--categories .parts-card__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.parts-cards--categories .parts-card__count { padding: 0; font-size: 13px; font-weight: 400; color: var(--parts-muted); }
.parts-cards--categories .parts-card__go { flex: none; font-size: 20px; line-height: 1; transition: transform .15s, color .15s; }

/* Плитки марок: логотип по центру, назва під ним */
.parts-cards--brand { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 14px; }
.parts-cards--brand .parts-card {
  align-items: center; justify-content: center; gap: 10px; padding: 18px 12px 14px; border: 0;
  border-radius: var(--parts-radius-panel); background: var(--parts-panel); text-align: center; font: inherit; cursor: pointer;
}
.parts-cards--brand .parts-card:hover { box-shadow: none; }
/* У назви марки, моделі й покоління власного фону немає ніколи — навіть якщо стилі сторінки задають його всім «span.parts-card__name». */
.parts-cards--brand .parts-card .parts-card__name,
.parts-cards--brand .parts-card .parts-card__count,
.parts-cards--model .parts-card .parts-card__name,
.parts-cards--model .parts-card .parts-card__count,
.parts-cards--generation .parts-card .parts-card__name,
.parts-cards--generation .parts-card .parts-card__count { background: transparent !important; }
.parts-cards--brand .parts-card__photo { aspect-ratio: auto; height: 52px; width: 100%; background: transparent; }
.parts-cards--brand .parts-card__photo img { height: 100%; width: 100%; object-fit: contain; }
.parts-cards--brand .parts-card__photo.is-empty { background: transparent; }
.parts-cards--brand .parts-card__name { font-size: 15px; font-weight: 500; }
.parts-cards--brand .parts-card__count { font-size: 12px; color: var(--parts-muted); }
.parts-card__dots { display: flex; align-items: center; justify-content: center; font-size: 22px; letter-spacing: 2px; color: var(--parts-text); }
@media (max-width: 575px) {
  .parts-cards--categories { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 14px; }
  .parts-cards--categories .parts-card__name { padding: 10px 12px; font-size: 15px; }
  .parts-cards--brand { grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); }
}

/* Спільний вигляд із сайтом: світло-блакитні плитки, заокруглення 14 пікселів */
.parts-chip,
.parts-selected,
.parts-filter__title + .parts-options .parts-option label:hover,
.parts-tree__row label:hover { background: var(--parts-panel); }
.parts-cards__search,
.parts-vehicle select,
.parts-vehicle input[type="text"] { border-radius: var(--parts-radius); }
.parts-cards__more,
.parts-cards__less,
.parts-favorites button.parts-favorites__clear { border-radius: var(--parts-radius-panel); }
.parts-favorites__table { border-radius: var(--parts-radius-panel); }
.parts-favorites__table th { background: var(--parts-panel); }
.parts-vehicle__type { border-radius: var(--parts-radius-panel); background: var(--parts-panel); border-color: transparent; }
.parts-vehicle__type:hover { background: var(--parts-panel-hover); border-color: transparent; color: var(--parts-text); }
.parts-vehicle__type.is-active { background: var(--parts-accent); color: var(--parts-accent-contrast); border-color: transparent; }
.parts-product .parts-gallery__thumb,
.parts-gallery__thumb { border-radius: var(--parts-radius); }
.parts-empty, .parts-cards__empty { color: var(--parts-muted); }

/* Пошук: біле заокруглене поле, усередині — що шукати, де шукати і кнопка */
.parts-search {
  display: flex; align-items: center; gap: 6px; padding: 6px; background: var(--parts-surface);
  border: 1px solid var(--parts-border); border-radius: var(--parts-radius-panel);
}
.parts-search:focus-within { border-color: var(--parts-accent); }
.parts-search input[type="search"] {
  flex: 1; min-width: 0; height: 44px; padding: 0 10px 0 16px; border: 0; background: transparent;
  color: var(--parts-text); font: inherit; font-size: 15px;
}
.parts-search input[type="search"]:focus { outline: none; }
.parts-search select.parts-search__type {
  flex: none; max-width: 190px; height: 44px; padding: 0 30px 0 14px; border: 0;
  border-left: 1px solid var(--parts-border); border-radius: 0; box-shadow: none;
  background: transparent no-repeat right 10px center/14px 14px;
  /* Власна стрілка: типову прибираємо разом із рамкою поля. */
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23626876' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
  -webkit-appearance: none; appearance: none;
  color: var(--parts-text); font: inherit; font-size: 14px; cursor: pointer;
}
.parts-search select.parts-search__type:focus { outline: none; color: var(--parts-accent); }
.parts-search .parts-search__button {
  display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 22px; border: 0;
  border-radius: calc(var(--parts-radius-panel) - 4px); background: var(--parts-accent);
  color: var(--parts-accent-contrast); font: inherit; font-size: 14px; font-weight: 600;
  text-transform: uppercase; letter-spacing: .02em; cursor: pointer;
}
.parts-search .parts-search__button:hover { filter: brightness(1.06); }
.parts-search__icon { width: 18px; height: 18px; flex: none; }
@media (max-width: 575px) {
  /* Усе в один рядок: поле стискається, список вужчий, на кнопці лишається тільки лупа. */
  .parts-search { flex-wrap: nowrap; gap: 4px; padding: 5px; }
  .parts-search input[type="search"] { padding: 0 4px 0 10px; font-size: 14px; }
  .parts-search select.parts-search__type {
    max-width: 116px; padding: 0 22px 0 8px; font-size: 13px;
    background-position: right 4px center; background-size: 12px 12px;
  }
  .parts-search .parts-search__button { padding: 0 14px; }
  .parts-search .parts-search__button span { display: none; }
}
@media (max-width: 360px) {
  .parts-search select.parts-search__type { max-width: 96px; font-size: 12px; }
}

/* Меню категорій: поки довантажується рівень */
.parts-cats.is-loading { cursor: progress; opacity: .6; transition: opacity .15s; }

/* Хлібні крихти ({parts_category_path}, {parts_breadcrumbs}): колір тексту навколо, підкреслення при наведенні. */
.parts-crumbs__link { color: inherit; text-decoration: none; }
.parts-crumbs__link:hover { color: var(--parts-accent, #057CEE); text-decoration: underline; }

/* Наведення на всі картки — марки, моделі, покоління, «и другие», категорії: легкий блакитний відтінок поверх
   власного кольору картки. На білій картці виходить рівно #EDF6FD, на вже блакитній — трохи темніше, тож
   наведення видно всюди. Відтінок кладемо фоновим зображенням з !important і вищим пріоритетом: так його не
   перебивають стилі сторінки на кшталт «a.parts-card { background: … !important }». */
:root { --parts-hover-tint: rgba(5, 124, 238, .072); }
.parts-cards .parts-card { transition: background-color .15s, border-color .15s, box-shadow .15s; }
.parts-cards .parts-card:hover,
.parts-cards .parts-card:focus-visible,
.parts-cards--categories .parts-card:hover .parts-card__name,
.parts-cards--categories .parts-card:focus-visible .parts-card__name {
  background-image: linear-gradient(var(--parts-hover-tint), var(--parts-hover-tint)) !important;
}
.parts-cards .parts-card:hover { box-shadow: none; }

/* Вибране покоління замість повного списку: назва й кнопка «Змінити покоління» */
.parts-cards__chosen-row { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 16px; }
.parts-cards__chosen-row[hidden], .parts-cards__collapsible[hidden] { display: none; }
.parts-cards__chosen { padding: 10px 16px; border-radius: var(--parts-radius-panel); background: var(--parts-panel); font-weight: 600; }
.parts-cards__change { padding: 0; border: 0; background: none; color: var(--parts-accent); font: inherit; cursor: pointer; }
.parts-cards__change:hover { text-decoration: underline; }
.parts-cards__collapsible { display: flex; flex-direction: column; gap: 12px; }