/* 0) Настрой ширину окна тут */
:root { --popupW: 1100px; }

/* 1) Затемнение фона */
.t-popup,
.t-popup.t-store__prod-popup {
  background: rgba(0,0,0,.60) !important;
}

/* 2) Белое окно попапа: ограничение размера + скролл внутри */
.t-popup.t-store__prod-popup .t-popup__container,
.t-popup.t-store__prod-popup .t-popup__content,
.t-store__prod-popup .t-popup__container,
.t-store__prod-popup .t-popup__content {
  width: min(var(--popupW), 92vw) !important;
  max-height: 88vh !important;
  margin: 0 auto !important;
  overflow: auto !important;
  border-radius: 16px !important;
}

/* Снимаем инлайн-гигантскую высоту (типа height:813px) */
.t-store__prod-popup__slider .t-slds__items-wrapper {
  height: auto !important;
  max-height: 62vh !important;
}

/* Контейнер слайдера — ограничиваем */
.t-store__prod-popup__slider .t-slds__container,
.t-store__prod-popup__slider .t-slds__main {
  max-height: 62vh !important;
}

/* Квадрат делаем меньше и картинку contain */
.t-store__prod-popup__slider .t-slds__bgimg {
  padding-bottom: 70% !important;         /* вместо 100% */
  max-height: 62vh !important;
  background-size: contain !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

/* Левая колонка не расползается */
.t-store__prod-popup__col-left {
  max-width: 520px !important;
}

/* 6) Кнопка "Назад" (если есть) — чтобы было видно */
.t-popup__back,
.t-store__prod-popup__back {
  color: #ffffff !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.6) !important;
  background: rgba(0,0,0,.35) !important;
  padding: 6px 10px !important;
  border-radius: 999px !important;
}


/* 2) Задаём “геометрию” попапа (должно совпадать с твоим попапом) */
:root{
  --popupW: min(1100px, 92vw);  /* ширина белого окна */
  --popupTop: 60px;            /* верхний отступ белого окна (у тебя было margin: 60px auto) */
  --closePad: 16px;            /* отступ крестика от края окна */
  --closeSize: 44px;
}

  /* правый край окна = (100vw - ширина_окна)/2 */
  right: calc((100vw - var(--popupW)) / 2 + var(--closePad)) !important;
  left: auto !important;
  bottom: auto !important;

  width: var(--closeSize) !important;
  height: var(--closeSize) !important;
  border-radius: 999px !important;

  background: #8c000c !important;
  background-color: #8c000c !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  padding: 0 !important;
  margin: 0 !important;
  line-height: 0 !important;
  box-shadow: none !important;
  z-index: 10000000 !important;
}

/* 0) Настрой ширину окна тут */
:root { --popupW: 1100px; }

/* 1) Затемнение фона */
.t-popup,
.t-popup.t-store__prod-popup {
  background: rgba(0,0,0,.60) !important;
}

/* 2) Белое окно попапа: ограничение размера + скролл внутри */
.t-popup.t-store__prod-popup .t-popup__container,
.t-popup.t-store__prod-popup .t-popup__content,
.t-store__prod-popup .t-popup__container,
.t-store__prod-popup .t-popup__content {
  width: min(var(--popupW), 92vw) !important;
  max-height: 88vh !important;
  margin: 0 auto !important;
  overflow: auto !important;
  border-radius: 16px !important;
}

/* Снимаем инлайн-гигантскую высоту (типа height:813px) */
.t-store__prod-popup__slider .t-slds__items-wrapper {
  height: auto !important;
  max-height: 62vh !important;
}

/* Контейнер слайдера — ограничиваем */
.t-store__prod-popup__slider .t-slds__container,
.t-store__prod-popup__slider .t-slds__main {
  max-height: 62vh !important;
}

/* Квадрат делаем меньше и картинку contain */
.t-store__prod-popup__slider .t-slds__bgimg {
  padding-bottom: 70% !important;         /* вместо 100% */
  max-height: 62vh !important;
  background-size: contain !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

/* Левая колонка не расползается */
.t-store__prod-popup__col-left {
  max-width: 520px !important;
}

/* 6) Кнопка "Назад" (если есть) — чтобы было видно */
.t-popup__back,
.t-store__prod-popup__back {
  color: #ffffff !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.6) !important;
  background: rgba(0,0,0,.35) !important;
  padding: 6px 10px !important;
  border-radius: 999px !important;
}


/* 2) Задаём “геометрию” попапа (должно совпадать с твоим попапом) */
:root{
  --popupW: min(1100px, 92vw);  /* ширина белого окна */
  --popupTop: 60px;            /* верхний отступ белого окна (у тебя было margin: 60px auto) */
  --closePad: 16px;            /* отступ крестика от края окна */
  --closeSize: 44px;
}

  /* правый край окна = (100vw - ширина_окна)/2 */
  right: calc((100vw - var(--popupW)) / 2 + var(--closePad)) !important;
  left: auto !important;
  bottom: auto !important;

  width: var(--closeSize) !important;
  height: var(--closeSize) !important;
  border-radius: 999px !important;

  background: #8c000c !important;
  background-color: #8c000c !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  padding: 0 !important;
  margin: 0 !important;
  line-height: 0 !important;
  box-shadow: none !important;
  z-index: 10000000 !important;
}

/* === FORCE: всегда крестик, никогда стрелка === */
body .t-popup__close-icon_arrow{
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  width: 0 !important;
  height: 0 !important;
  pointer-events: none !important;
}

body .t-popup__close-icon_cross{
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* === Кнопка закрытия: белый круг, меньше === */
body .t-popup__close{
  background: #fff !important;
  border: 1px solid rgba(0,0,0,.25) !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 999px !important;
  box-shadow: none !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  padding: 0 !important;
  line-height: 0 !important;
}

/* Центруем внутренности */
body .t-popup__close-wrapper{
  width: 100% !important;
  height: 100% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  line-height:0 !important;
}

/* === Крест: черный, меньше === */
body .t-popup__close-icon_cross{
  width: 14px !important;
  height: 14px !important;
  display:block !important;
}
body .t-popup__close-icon_cross *,
body .t-popup__close-icon_cross rect{
  fill: #111 !important;
  stroke: #111 !important;
}

/* Hover: “чуть жирнее” = слегка больше, фон НЕ меняем */
@media (hover:hover){
  body .t-popup__close:hover{ background:#fff !important; }
  body .t-popup__close:hover .t-popup__close-icon_cross{
    transform: scale(1.15) !important;
    transform-origin: 50% 50% !important;
  }
}

body{ outline: 5px solid lime !important; }