/* ══════ Кнопки в описании товара (t744) ══════ */
.t744__info a {
  display: inline-block;
  padding: 14px 28px;
  margin-right: 12px;
  margin-top: 24px;
  margin-bottom: 16px;
  font-weight: 600;
  font-size: 15px !important;
  line-height: 1.2;
  text-align: center;
  text-decoration: none !important;
  border: 2px solid transparent;
  clip-path: polygon(
    16px 0%,
    100% 0%,
    100% calc(100% - 16px),
    calc(100% - 16px) 100%,
    0% 100%,
    0% 16px
  );
  transition: filter .3s ease, transform .3s ease;
}

.t744__info a:hover {
  filter: brightness(1.15);
  transform: translateY(-2px);
}

/* 1-я кнопка — оранжевая */
.t744__info a:first-of-type {
  background-color: #FF3E05;
  color: #fff !important;
}

/* 2-я кнопка — тёмная (ВСЕГДА, даже если она последняя при 2 кнопках) */
.t744__info a:nth-of-type(2) {
  background-color: #313130 !important;
  color: #fff !important;
}

/* 3-я кнопка — белая с рамкой (только когда кнопок 3 и больше) */
.t744__info a:last-of-type:nth-of-type(n+3) {
  background-color: #fff;
  color: #000 !important;
  border-color: #313130;
}

.t706__cartwin_showed {
  z-index: 9999999;
}

/* ══════ 1. Преимущества — чипы (первый список) ══════ */
.js-store-prod-text ul,
.t744__info ul {
  box-sizing: border-box;
  padding: 0;
  margin: 8px 0 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.js-store-prod-text ul li,
.t744__info ul li {
  box-sizing: border-box;
  background-color: #FFF1EA;
  border: 1px solid #FFD9C9;
  color: #a33014;
  padding: 5px 12px;
  margin: 0 !important;
  font-family: var(--t-text-font);
  font-size: 12px !important;
  line-height: 1.3;
  border-radius: 6px;
}


/* ══════ 2. Номенклатура из прайса — карточки строками ══════ */
/* Любой ul после другого ul (второй и последующие списки) */
.js-store-prod-text ul ~ ul,
.t744__info ul ~ ul {
  box-sizing: border-box;
  display: block;
  gap: 0;
  margin: 14px 0 0 !important;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 0;
}

/* Каждая строка — отдельная карточка */
.js-store-prod-text ul ~ ul li,
.t744__info ul ~ ul li {
  box-sizing: border-box;
  display: grid !important;
  grid-template-columns: 148px minmax(0, 1fr);
  align-items: start;
  gap: 4px 14px;
  margin: 0 0 6px !important;
  padding: 10px 14px !important;
  background: #FFFFFF;
  border: 1px solid #E5E5E5;
  border-radius: 6px;
  color: #333333;
  font-family: var(--t-text-font);
  font-size: 13px !important;
  line-height: 1.35;
  overflow-wrap: break-word;
  word-break: normal;
  transition: none;
}

/* Артикул — первая колонка (span, strong или b первым ребёнком) */
.js-store-prod-text ul ~ ul li > span:first-child,
.js-store-prod-text ul ~ ul li > strong:first-child,
.js-store-prod-text ul ~ ul li > b:first-child,
.t744__info ul ~ ul li > span:first-child,
.t744__info ul ~ ul li > strong:first-child,
.t744__info ul ~ ul li > b:first-child {
  display: block;
  min-width: 0;
  color: #E4400F;
  font-weight: 700;
  font-size: 12px !important;
  line-height: 1.3;
  overflow-wrap: break-word;
}

/* Мобильные: две колонки остаются, левая ещё уже */
@media (max-width: 640px) {
  .js-store-prod-text ul ~ ul li,
  .t744__info ul ~ ul li {
    grid-template-columns: 128px minmax(0, 1fr);
    gap: 4px 10px;
    padding: 9px 10px !important;
    font-size: 12px !important;
  }

  .js-store-prod-text ul ~ ul li > span:first-child,
  .js-store-prod-text ul ~ ul li > strong:first-child,
  .js-store-prod-text ul ~ ul li > b:first-child,
  .t744__info ul ~ ul li > span:first-child,
  .t744__info ul ~ ul li > strong:first-child,
  .t744__info ul ~ ul li > b:first-child {
    font-size: 12px !important;
  }
}


/* ══════ Кнопка в меню (t228) — срез углов 16 ══════ */
/* Срез применяем к кнопкам-ссылкам ВНУТРИ контейнера .t228__right_buttons */
.t228__right_buttons:is(a, button),
.t228__right_buttons :is(a, button):not([class*="__text"]):not([class*="icon"]):not([class*="Icon"]):not([class*="btnflex__icon"]),
.menu-cta {
  clip-path: polygon(
    16px 0%,
    100% 0%,
    100% calc(100% - 16px),
    calc(100% - 16px) 100%,
    0% 100%,
    0% 16px
  ) !important;
  border-radius: 0 !important;
  transition: filter .3s ease, transform .3s ease !important;
}

.t228__right_buttons:is(a, button):hover,
.t228__right_buttons :is(a, button):hover,
.menu-cta:hover {
  filter: brightness(1.15) !important;
  transform: translateY(-2px) !important;
}




/* ============================================================
   Липкая галерея + прокручиваемое описание
   для стандартной карточки товара Тильды, блок TE-744
   (классы: .t744, .t-container.js-product, .t744__col_first, .t-slds)

   Правила активны только на десктопе (>= 981px).
   На мобильных и планшетах работает штатная вёрстка Тильды.

 
   ============================================================ */

@media screen and (min-width: 981px) {

	/* убираем overflow:hidden, который «убивает» sticky */
	.t744,
	.t744 .t-container.js-product,
	.t744 .t744__container {
		overflow: visible !important;
	}

	/* контейнер карточки: одна строка из двух колонок.
	   nowrap — колонки НИКОГДА не переносятся на новую строку:
	   при любом масштабе они сжимаются, но остаются рядом */
	.t744 .t-container.js-product,
	.t744 .t744__container {
		display: flex !important;
		flex-direction: row !important;
		flex-wrap: nowrap !important;
		align-items: flex-start !important; /* колонка слева не растягивается по высоте */
	}

	/* колонки: снимаем float, задаём гибкую сетку 50/50 */
	.t744 .t-container.js-product > .t-col,
	.t744 .t-container.js-product > .t744__col,
	.t744 .t744__container > .t-col,
	.t744 .t744__container > .t744__col {
		float: none !important;
		min-width: 0 !important;
		box-sizing: border-box !important;
		/* база 50%, при необходимости сжимается — но не переносится */
		flex: 0 1 50% !important;
	}

	/* колонка со слайдером «залипает» на экране */
	.t744 .t744__col_first {
		align-self: flex-start !important;
		position: -webkit-sticky;
		position: sticky !important;
		top: 100px !important; /* фиксированная шапка? поставьте: высота шапки + 16px */
		z-index: 20 !important;
		/* непрозрачный фон — текст не просвечивает под галереей */
		background-color: #fff;
		padding-bottom: 8px;
		flex: 0 1 50% !important;
		/* кадр-квадрат не выше экрана: ширина колонки ограничена
		   высотой экрана минус место на миниатюры и отступы.
		   Квадрат сохраняется — Тильда подставит свою высоту,
		   равную ширине кадра */
		max-width: calc(100vh - 160px) !important;
	}

	/* текстовая колонка: забирает остаток строки —
	   при любом масштабе остаётся справа от галереи,
	   под неё никогда не переносится */
	.t744 .t-container.js-product > .t-col:not(.t744__col_first),
	.t744 .t-container.js-product > .t744__col:not(.t744__col_first),
	.t744 .t744__container > .t-col:not(.t744__col_first),
	.t744 .t744__container > .t744__col:not(.t744__col_first) {
		flex: 1 1 50% !important;
		min-width: 0 !important;
	}

	/* слайдер: вертикальная раскладка (кадр сверху, миниатюры снизу),
	   но высоты НЕ задаём — их считает Тильда по настройкам блока */
	.t744 .t-slds {
		display: flex !important;
		flex-direction: column !important;
	}

	/* основная часть слайдера (кадр + стрелки) идёт первой,
	   миниатюры — вторым flex-элементом, сразу под кадром */
	.t744 .t-slds__main {
		position: relative !important;
		display: flex !important;
		flex-direction: column !important;
		flex: 0 1 auto !important;
		min-width: 0 !important;
	}

	.t744 .t-slds__container {
		display: flex !important;
		flex-direction: column !important;
		flex: 0 1 auto !important;
		min-width: 0 !important;
	}

	/* высоты кадра и обёртки слайдов оставляем Тильде —
	   она ставит их инлайном по настройкам блока (квадрат 1:1 и т.д.).
	   Никаких height/min-height поверх — иначе кадр «растягивается»
	   на всю высоту экрана и внизу образуется пустой отступ */

	.t744 .t-slds__item,
	.t744 .t-slds__wrapper {
		min-width: 0 !important;
		vertical-align: top !important;
	}

	/* картинка слайда: ширина и высота 100% внутри кадра Тильды,
	   без искажений — Тильда сама задаёт квадратную (или иную)
	   высоту обёртки по настройкам блока */
	.t744 .t-slds__img {
		display: block !important;
		width: 100% !important;
		height: 100% !important;
		object-fit: cover !important;
		object-position: center center !important;
	}

	.t744 .t-slds__bgimg {
		height: 100% !important;
		background-size: cover !important;
		background-position: center center !important;
		background-repeat: no-repeat !important;
	}

	/* миниатюры: фиксированный ряд — не растягивается, всегда
	   прижат сразу под кадром (не «уезжает» вниз) */
	.t744 .t-slds__thumbs,
	.t744 .t-slds__thumbs-wrapper {
		flex: 0 0 auto !important;
	}
}
</style>

