/* Q-058 (gappo-russia-4, -5): то, чего нет в вёрстке Q-059, — сообщения форм, ссылки под формами входа, подсказки, галочки в оформлении.
   Своим файлом, чтобы не править site.css Верстальщика (его копию из _layout/dist); цвета — из палитры вёрстки. */
.card-form__errors,
.card-form__note {
	margin: 0 0 20px;
	padding: 12px 16px;
	border-left: 3px solid #e5484d;
	background: rgba(229, 72, 77, .08);
	line-height: 1.4;
}
.card-form__note {
	border-left-color: #0bafe6;
	background: rgba(11, 175, 230, .08);
}
.card-form__hint {
	margin: -6px 0 18px;
	color: #808080;
	font-size: 14px;
}
.card-form__links {
	display: flex;
	flex-wrap: wrap;
	gap: 12px 24px;
	margin-top: 20px;
}
.card-auth {
	max-width: 640px;
}
.order__consents .site-consent + .site-consent {
	margin-top: 12px;
}
.footer__docs {
	margin-top: 16px;
	color: #808080;
	font-size: 14px;
}
.footer__docs a {
	color: inherit;
}

/* Q-058 (Б1 приёмки 26.10): раздел, фильтр и карточка уезжали вбок на 15 px — шаблоны каталога (section.php, element.php)
   оборачивают страницу в Bootstrap .row > .col-xs-12 вне .container: у .row поля −15 px шире экрана. Обнуляем пару:
   содержимое остаётся на месте (−15 + 15 = 0, как было), прокрутки вбок нет. */
main > .row,
main > .row .row { margin-left: 0; margin-right: 0; }
main > .row > [class*="col-"],
main > .row .row > [class*="col-"] { padding-left: 0; padding-right: 0; }

/* Q-074: без штатного bootstrap.css — поля корзины (купон, поиск по товарам) в виде полей сайта */
.basket .form-control {
  display: block;
  width: 100%;
  height: 40px;
  padding: 0 12px;
  border: 1px solid #d9d9d9;
  border-radius: 0;
  font: inherit;
  color: #333;
  background: #fff;
}
.basket .form-control:focus-visible { outline: 2px solid #0bafe6; outline-offset: 0; }

/* Q-074 п. 6 (Дизайнер, М1): подписи плиток мозаики главной видны всегда, как на живом и в макете, — на телефоне наведения нет.
   Раньше: opacity 0 / visibility hidden до наведения (на ≤ 1024 уже были видны). Наведение — плотнее подложка. */
.main-catalog__text.on-hover {
  opacity: 1;
  visibility: visible;
  background: rgba(0, 0, 0, 0.3);
}
.main-catalog__item:hover .main-catalog__text.on-hover { background: rgba(0, 0, 0, 0.6); }
.main-catalog__text.on-hover,
.main-catalog__item:not(.collection) .main-catalog__text .main-catalog__name { color: #fff; font-weight: 300; text-transform: uppercase; }

/* Q-074 п. 10 (Дизайнер, cb67f04). М1а: подписи всегда видны только у больших плиток (span-6), как на живом и в макете;
   у малых — по наведению, как было в вёрстке. */
.main-catalog__item:not(.span-6) .main-catalog__text.on-hover {
  opacity: 0;
  visibility: hidden;
  background: rgba(0, 0, 0, 0.9);
}
.main-catalog__item:not(.span-6):hover .main-catalog__text.on-hover { opacity: 1; visibility: visible; }
@media screen and (max-width: 767px) {
  /* М1а: на телефоне подпись не крупнее 16 px и без переносов внутри слов */
  .main-catalog__item .main-catalog__text .main-catalog__name {
    font-size: 16px;
    hyphens: manual;
    overflow-wrap: normal;
    word-break: normal;
  }
  /* Б1: заголовок блока главной во всю ширину по центру, «товаров» и «Все …» — строкой под ним (раньше «…ЕСИТЕЛИ») */
  .main-catalog .section__head-inner { flex-wrap: wrap; justify-content: space-between; row-gap: 10px; }
  /* п. 13: в вёрстке заголовок позиционирован абсолютно (по центру, половина ширины) — order/flex на него не действуют; возвращаем в поток */
  .main-catalog .section__head-inner .main-heading { position: static; left: auto; transform: none; width: 100%; order: -1; flex: 0 0 100%; text-align: center; }
}

/* Q-074 п. 11: окно «Нашли дешевле?» на белом фоне — ссылки (телефон, документы в согласии) были белыми по правилу сайта a:not([class]) */
#price-down a,
#price-down a:not([class]) { color: #00528c; text-decoration: underline; }
#price-down a:hover,
#price-down a:focus-visible { color: #0bafe6; }
/* фото карточки — ссылка на крупный просмотр, вид прежний */
.big-slider__item > a { display: block; cursor: zoom-in; }

/* Q-074 п. 12: на 320 подпись мозаики без переносов была шире экрана на 9 px — на ≤360 меньше кегль; длинное слово,
   если всё же не влезет, переносится без дефиса, но не выходит за плитку */
@media screen and (max-width: 360px) {
  .main-catalog__item .main-catalog__text .main-catalog__name {
    font-size: 14px;
    max-width: 100%;
    overflow-wrap: break-word;
  }
}

/* Q-075 п. 3: «Популярные коллекции» на главной — ровная сетка: у картинки коллекции постоянная пропорция 4:3 (фото обрезается,
   без фото — тёмная подложка), плитки одной высоты; раньше без картинки коробка схлопывалась и плитки «прыгали» */
.main-catalog__toggler .main-catalog__item.span-2 .main-catalog__img {
  aspect-ratio: 4 / 3;
  height: auto;
  background: #141414;
  overflow: hidden;
}
.main-catalog__toggler .main-catalog__item.span-2 .main-catalog__img img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.main-catalog__toggler > .main-catalog__item { align-self: stretch; height: auto; }

/* Q-075 Д-2, Д-3 (приёмка XBITT-1399): меню каталога — «Все товары раздела» только в мобильном меню (до 1024), акцент баннера классом */
@media screen and (min-width: 1025px) {
  .header__catalog-list-item--all { display: none; }
}
.header__catalog-banner-accent { color: #0bafe6; }
/* картинка раздела — вырезанный товар на прозрачном фоне: ставим её над текстом на тёмной подложке, а не под текстом */
.header__catalog-banner--section { align-self: flex-start; background: #141414; }
.header__catalog-banner--section .header__catalog-banner-img { padding: 24px 24px 0; }
.header__catalog-banner--section .header__catalog-banner-img > img { display: block; width: 100%; height: 200px; object-fit: contain; }
.header__catalog-banner--section .header__catalog-banner-content { position: static; height: auto; padding: 24px 36px 36px; }

/* Q-077 пп. 1–2 (XBITT-1400): фильтр каталога — свёрнутые свойства, «Показать все свойства», плашка «Показать N товаров» */
.catalog__aside-item.is-extra { display: none; }
.catalog__aside-item.is-collapsed .catalog__aside-checks,
.catalog__aside-item.is-collapsed .range-slider,
.catalog__aside-item.is-collapsed .catalog__aside-calendar,
.catalog__aside-item.is-collapsed .catalog__aside-more,
.catalog__aside-item.is-collapsed .catalog__filter-popup { display: none; }
.catalog__aside-item .jsFilterToggle { position: relative; padding-right: 24px; cursor: pointer; user-select: none; }
.catalog__aside-item .jsFilterToggle::after {
  content: ""; position: absolute; right: 4px; top: 4px; width: 8px; height: 8px;
  border-right: 2px solid #0bafe6; border-bottom: 2px solid #0bafe6; transform: rotate(45deg); transition: transform 0.3s ease-in-out;
}
.catalog__aside-item.is-collapsed .jsFilterToggle::after { transform: rotate(-45deg); }
.catalog__aside-item.is-collapsed .catalog__aside-head { margin-bottom: 0; padding-bottom: 0; border-bottom: none; }
/* «Показать все свойства» и «Развернуть все» — стили Верстальщика в site.css (338f35a) */
.catalog__filter-popup { margin: 15px 0 0 0; }
.catalog__filter-popup[hidden] { display: none; }
.catalog__filter-popup-link {
  display: inline-block; padding: 12px 18px; background: #0bafe6; color: #fff;
  font-size: 13px; line-height: 1; letter-spacing: 0.08em; text-transform: uppercase; transition: background 0.3s ease-in-out;
}
.catalog__filter-popup-link:hover { background: #00528c; color: #fff; }

/* Q-077 п. 4: карточка товара без наличия — пометка вместо «Купить» */
.big-aside__sold { margin: 0 0 15px 0; color: #808080; font-size: 15px; letter-spacing: 0.08em; text-transform: uppercase; }

/* Q-077 Н-1: заголовок свойства фильтра — кнопка (раскрывается с клавиатуры); вид — как прежний div */
button.catalog__aside-head {
  display: block; width: 100%; margin-top: 0; margin-left: 0; margin-right: 0; padding-top: 0; padding-left: 0;
  background: none; border: 0; border-bottom: 1px solid #333; border-radius: 0;
  color: inherit; font: inherit; font-size: 15px; line-height: normal; letter-spacing: 0.08em; text-transform: uppercase; text-align: left;
}
button.catalog__aside-head.no-border { border-bottom: none; }
button.catalog__aside-head:focus-visible { outline: 2px solid #0bafe6; outline-offset: 2px; }
/* Q-077 Н-1: флажки фильтра доступны с клавиатуры — визуально скрыты, но не display: none (было в style.css вёрстки) */
.catalog__aside-label { position: relative; }
.catalog__aside-label input {
  display: block; position: absolute; left: 0; top: 0; width: 1px; height: 1px; margin: 0; opacity: 0; pointer-events: none;
}
.catalog__aside-label input:focus-visible + .catalog__aside-text { outline: 2px solid #0bafe6; outline-offset: 2px; }