/*NOTE: This file is intended for programmers. Aspro technical support is not advised to work with him.*/

/* Единые боковые отступы контента (как у шапки p-block--18) + сброс mobile-offset для колоночных сеток */
@media screen and (max-width: 991px) {
	#main {
		--theme-page-width-padding: 18px;
	}

	/* Тизеры / MIDDLE_ADV: убрать «вылет» на всю ширину от .mobile-offset */
	.rscable-tizers-intro-wrap .tizers-list__items-wrapper.mobile-offset,
	.banners-with-text-bg-template .grid-list.mobile-offset {
		margin-left: 0 !important;
		margin-right: 0 !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
}

/* Иконки в шапке — только пиктограммы, без подписей (Войти, Сравнение, …) */
#mobileheader .header__icon-name {
	display: none !important;
}

#mobileheader .header-cabinet__link {
	font-size: 0 !important;
	line-height: 0 !important;
	color: transparent !important;
}

#mobileheader .header-cabinet__link svg,
#mobileheader .header-cabinet__link .header__icon,
#mobileheader .header-cabinet__link i.svg {
	font-size: initial;
	line-height: normal;
	color: inherit;
}

#mobileheader .header-compare .compare-link.flexbox--direction-column,
#mobileheader .header-favorite a.header-icon.flexbox--direction-column {
	flex-direction: row !important;
	align-items: center !important;
	justify-content: center !important;
}

/* Examples (uncomment to use):*/

/* Expand site width */
/* body .wrapper { max-width: 1400px !important;  } */

/* Set site background image */
/* body {  background: url(image_source) top no-repeat; }

/* Hide compare button */
/* a.compare_item { display: none !important;  }*/

.collapse {
    display: none;
}

/* Убрать пунктирное подчеркивание в подборках */
.landings-list__name span {
  border-bottom: none !important;
}

/* Убрать все подчеркивания в chip элементах */
.chip, 
.chip *, 
.chip__label,
.chip span {
  text-decoration: none !important;
  text-decoration-line: none !important;
  border-bottom: none !important;
}

/* Убрать рамки у элементов подборок и изменить на grid */
.landings-list__name,
.chip {
  border: none !important;
}

.landings-list__info-wrapper .line-block.line-block--gap-8 {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
}

/* Оптимизация расстояний в chip элементах */
.landings-list__info-wrapper .chip {
  --item-pl: 10px !important;
  --item-pr: 10px !important;
  --item-height: 32px !important;
  padding: 0 !important;
  width: auto !important;
  max-width: none !important;
}

.landings-list__info-wrapper .chip__label {
  padding-left: 10px !important;
  padding-right: 10px !important;
  font-size: 14px;
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
}

.landings-list__name {
  padding: 4px 8px 5px !important;
  margin-right: 0 !important;
  line-height: 1.4 !important;
}

.landings-list__item {
  padding-bottom: 0 !important;
}

/* Масштабирование изображений в карточках поставщиков */
.vertical-card__inner .ui-card__image,
.sale-list-card .ui-card__image {
  width: 100%;
  height: auto;
  min-height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.vertical-card__inner .ui-card__img,
.sale-list-card .ui-card__img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
}

.vertical-card__inner img,
.sale-list-card img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
}

/* Исправление отображения алфавита на странице марок */
.head-block.head-block-letter {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px 16px !important;
  padding: 20px 35px !important;
}

.head-block.head-block-letter .item-link {
  flex: 0 0 auto !important;
  display: inline-flex !important;
}

/* Убрать обводку у элементов */
.head-block.bordered-block,
.box-shadow.bordered,
.bordered-block,
.item.bordered {
  border: none !important;
  box-shadow: none !important;
}

/* ===================================================================
   MOBILE: Hello-bar (TOP_HEADER)
   Синхронизировано с desktop custom.css; SVG-декор скрыт на мобилке.
   =================================================================== */
.banner.TOP_HEADER {
  background-color: #f8f8fc;
  color: #257de3;
  display: flex !important;
  align-items: center;
  justify-content: center;
  min-height: 28px;
  height: auto;
  overflow: hidden;
  position: relative;
  font-size: 13px;
  line-height: 1.2;
  padding: 4px 12px;
  box-sizing: border-box;
}

.banner.TOP_HEADER .banner-main,
.banner.TOP_HEADER > div,
.banner.TOP_HEADER > a {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  color: #257de3;
  text-decoration: none;
  font-size: 13px;
  position: relative;
  z-index: 1;
  text-align: center;
  padding: 0;
}

.banner.TOP_HEADER > a .banner-main {
  padding-left: 0;
  padding-right: 0;
  max-width: 100%;
}

.banner.TOP_HEADER p,
.banner.TOP_HEADER span {
  color: #257de3;
  font-size: 13px;
}

.banner.TOP_HEADER b,
.banner.TOP_HEADER strong {
  font-weight: 700;
  color: #257de3;
  font-size: 13px;
}

.banner.TOP_HEADER a {
  color: inherit;
  text-decoration: none;
}

.banner.TOP_HEADER::before,
.banner.TOP_HEADER::after {
  display: none;
}

/* ===================================================================
   MOBILE HEADER — fit all icons without zoom
   Синхронизировано с desktop custom.css
   =================================================================== */
@media screen and (max-width: 480px) {
  .mobileheader .mobileheader__inner .mobileheader__inner-part {
    --gap: 14px;
  }
  .mobileheader .logo {
    max-width: 100px;
  }
  .mobileheader .maxwidth-theme {
    --theme-page-width-padding: 12px;
  }
}

@media screen and (max-width: 390px) {
  .mobileheader .mobileheader__inner .mobileheader__inner-part {
    --gap: 10px;
  }
  .mobileheader .logo {
    max-width: 90px;
  }
}

/* ===================================================================
   MOBILE: MIDDLE_ADV (banners-with-text-bg)
   Синхронизировано с desktop custom.css
   =================================================================== */
.banners-with-text-bg-template .ui-card.grid-list__item.ui-card__image--ratio-1 {
  --aspect-ratio: 480 / 150;
}

.banners-with-text-bg-template .ui-card.grid-list__item .ui-card__image.ui-card__image--banner-ratio-full-width.ui-card__image--banner-ratio-full-width-rectangle {
  --ratio: 44.6%;
  min-height: 0 !important;
}

.banners-with-text-bg-template .ui-card.grid-list__item.outer-rounded-x {
  border-radius: var(--theme-outer-border-radius, 12px);
}

.banners-with-text-bg-template .ui-card.grid-list__item.outer-rounded-x .ui-card__image {
  border-radius: var(--theme-outer-border-radius, 12px);
}

.banners-with-text-bg-template .ui-card.grid-list__item.outer-rounded-x .ui-card__img {
  border-radius: var(--theme-outer-border-radius, 12px);
}

.banners-with-text-bg-template .ui-card__img {
  width: 70%;
  object-fit: cover;
  object-position: center top;
}

.banners-with-text-bg-template .ui-card__img.rscable-middle-adv-img--focus-stores {
  object-fit: cover;
  object-position: 50%;
  height: 100%;
  left: 0;
  top: 0;
  max-width: 70%;
  max-height: 100%;
  transform: none;
}

.banners-with-text-bg-template .ui-card > .ui-card__link {
  inset: 0;
  width: 100%;
  height: 100%;
}

/* ===================================================================
   MOBILE: Тизеры (rscable-tizers-intro-wrap) — сетка, не слайдер
   Синхронизировано с desktop custom.css
   =================================================================== */
.rscable-tizers-intro-wrap {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.rscable-tizers-intro-wrap__lead {
  flex-basis: auto;
  max-width: 100%;
}

.rscable-tizers-intro-wrap__title {
  font-size: clamp(1rem, 1.3vw + 0.7rem, 1.25rem);
  line-height: 1.35;
  font-weight: 600;
}

.rscable-tizers-intro-wrap__items {
  flex: 1 1 0;
  min-width: 0;
}

.rscable-tizers-intro-wrap__items .tizers-list__items-wrapper {
  width: 100%;
}

@media screen and (max-width: 991px) {
  .rscable-tizers-intro-wrap .tizers-list__items-wrapper.grid-list.mobile-scrolled {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: visible !important;
  }

  .rscable-tizers-intro-wrap .tizers-list__items-wrapper .grid-list__item {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 auto !important;
  }

  /* ui-cards + grid-list: без grid-list--items тоже матчится */
  .banners-with-text-bg-template .grid-list.mobile-scrolled {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: visible !important;
  }

  .banners-with-text-bg-template .grid-list.mobile-scrolled > .grid-list__item {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 auto !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  .banners-with-text-bg-template .grid-list.mobile-scrolled > .grid-list__item .ui-card__link {
    width: 100% !important;
    box-sizing: border-box !important;
  }
}

/* Мобильное меню: корзина — иконка слева, подпись справа */
.mobilemenu__menu--cart .mobilemenu__menu-item {
  line-height: normal;
}

.mobilemenu__menu--cart .link-wrapper > a.icon-block.dark_link,
.mobilemenu__menu--cart .link-wrapper.basket > a.icon-block {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 8px;
  width: 100%;
}

.mobilemenu__menu--cart .link-wrapper > a.icon-block .font_15,
.mobilemenu__menu--cart .link-wrapper.basket > a .font_15 {
  display: none !important;
}

.mobilemenu__menu--cart .link-wrapper > a.icon-block::after,
.mobilemenu__menu--cart .link-wrapper.basket > a.icon-block::after {
  content: "Корзина";
  font-size: 0.9375rem;
  line-height: calc(1em + 7px);
  flex: 1 1 auto;
  min-width: 0;
  color: inherit;
}