/* =========================================================
   TILDA STORE — единый аккуратный CSS (упорядоченная версия)
   ========================================================= */


/* =========================================================
   0) Карточки товара — растяжение и прижим цены вниз
   ========================================================= */
.store__card__wrap_txt-and-opts,
.store__card__wrap_txt-and-opts > a,
.t-store__card__textwrapper {
  height: 100%;
}

.store__card__wrap_txt-and-opts > a {
  display: inline-block;
}

.t-store__card__textwrapper {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
}

.js-store-price-wrapper.t-store__card__price-wrapper {
  margin-top: auto;
  padding-top: 12px;
}


/* =========================================================
   1) Pop-up товара — отступ сверху
   ========================================================= */
.t-popup.t-popup_show {
  padding-top: 40px !important;
  box-sizing: border-box;
}


/* =========================================================
   2) Pop-up товара — убрать дефолтные "крестик" и "Назад"
   (чтобы не мигало при закрытии)
   ========================================================= */
.t-popup .t-popup__close,
.t-popup .t-store__prod-popup__close-txt-wr {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}


/* =========================================================
   3) Pop-up товара — кастомный крестик справа от карточки (DESKTOP)
   (визуальный, закрытие по клику на фон — штатное)
   ========================================================= */
.t-popup.t-popup_show .t-popup__container {
  position: relative !important;
  overflow: visible !important;
}

/* Кружок */
.t-popup.t-popup_show .t-popup__container::after {
  content: "";
  position: absolute;
  top: 16px;
  right: -64px; /* 44px кнопка + 20px отступ */
  width: 44px;
  height: 44px;
  background: #4d0f11;
  border-radius: 999px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
  z-index: 9999;
  pointer-events: none;
}

/* Крестик */
.t-popup.t-popup_show .t-popup__container::before {
  content: "";
  position: absolute;
  top: 16px;
  right: -64px;
  width: 44px;
  height: 44px;
  z-index: 10000;
  pointer-events: none;
  background:
    linear-gradient(#fece78, #fece78) center/22px 2px no-repeat,
    linear-gradient(#fece78, #fece78) center/2px 22px no-repeat;
  transform: rotate(45deg);
}

/* Hover: инверсия */
.t-popup.t-popup_show .t-popup__container:hover::after {
  background: #eeeeee;
}

.t-popup.t-popup_show .t-popup__container:hover::before {
  background:
    linear-gradient(#4d0f11, #4d0f11) center/22px 2px no-repeat,
    linear-gradient(#4d0f11, #4d0f11) center/2px 22px no-repeat;
}


/* =========================================================
   4) Пагинация магазина — цифры
   ========================================================= */
.t-store__pagination .t-store__pagination__item_page {
  background-color: #4d0f11 !important;
  color: #fece78 !important;

  border: none !important;
  box-shadow: inset 0 0 0 2px #fece78 !important;

  border-radius: 5px !important;
  font-weight: 700 !important;
  line-height: 1 !important;

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

  min-width: 36px;
  height: 36px;
  padding: 0 10px;

  opacity: 1 !important;
}

.t-store__pagination .t-store__pagination__item_page:hover,
.t-store__pagination
  .t-store__pagination__item_page.t-store__pagination__item_active {
  background-color: #fece78 !important;
  color: #4d0f11 !important;
  box-shadow: inset 0 0 0 2px #fece78 !important;
}


/* =========================================================
   5) Пагинация магазина — стрелки prev/next
   ========================================================= */
.t-store__pagination .t-store__pagination__item_next,
.t-store__pagination .t-store__pagination__item_prev {
  background-color: #4d0f11 !important;
  color: #fece78 !important;

  border: none !important;
  box-shadow: inset 0 0 0 2px #fece78 !important;

  border-radius: 5px !important;

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

  min-width: 36px;
  height: 36px;
  padding: 0 10px;

  opacity: 1 !important;
}

/* SVG-стрелка “толще” */
.t-store__pagination .t-store__pagination__item_next svg path,
.t-store__pagination .t-store__pagination__item_prev svg path {
  fill: #fece78 !important;

  stroke: #fece78 !important;
  stroke-width: 1.6px !important;
  stroke-linejoin: round !important;
  stroke-linecap: round !important;
  paint-order: stroke fill !important;
}

/* Hover */
.t-store__pagination .t-store__pagination__item_next:hover,
.t-store__pagination .t-store__pagination__item_prev:hover {
  background-color: #fece78 !important;
  box-shadow: inset 0 0 0 2px #fece78 !important;
}

.t-store__pagination .t-store__pagination__item_next:hover svg path,
.t-store__pagination .t-store__pagination__item_prev:hover svg path {
  fill: #4d0f11 !important;
  stroke: #4d0f11 !important;
}

/* =========================================================
   Пагинация — троеточие (separator) в стиле кнопок
   ========================================================= */
.t-store__pagination .t-store__pagination__item_separator {
  background-color: #4d0f11 !important;
  color: #fece78 !important;

  border: none !important;
  box-shadow: inset 0 0 0 2px #fece78 !important;

  border-radius: 5px !important;
  font-weight: 700 !important;
  line-height: 1 !important;

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

  min-width: 36px !important;
  height: 36px !important;
  padding: 0 10px !important;

  opacity: 1 !important;
}

/* если троеточие внутри вложенными элементами (на всякий) */
.t-store__pagination .t-store__pagination__item_separator,
.t-store__pagination .t-store__pagination__item_separator * {
  color: #fece78 !important;
}

/* Пагинация — троеточие: ширина 34 */
.t-store__pagination .t-store__pagination__item_separator{
  min-width: 34px !important;
  width: 34px !important;
  padding: 0 !important;
}



/* =========================================================
   MOBILE (<=980px)
   ========================================================= */
@media screen and (max-width: 980px) {

  /* Pop-up: вернуть дефолтные элементы закрытия */
  .t-popup .t-popup__close,
  .t-popup .t-store__prod-popup__close-txt-wr {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  /* Pop-up: отключить кастомный крестик */
  .t-popup.t-popup_show .t-popup__container::before,
  .t-popup.t-popup_show .t-popup__container::after {
    content: none !important;
    display: none !important;
  }

  /* Pop-up: на мобиле обычно лучше без верхнего отступа */
  .t-popup.t-popup_show {
    padding-top: 0 !important;
  }

  /* Pop-up: можно вернуть “обычный” overflow */
  .t-popup.t-popup_show .t-popup__container {
    overflow: hidden !important;
  }

  /* Pop-up: оставляем только стрелку "назад", убираем крестик */
  body.t-body_popupshowed .t-store__prod-popup__close-txt-wr {
    display: none !important;
  }

  body.t-body_popupshowed .t-popup__close-icon_arrow {
    display: inline-block !important;
  }

  body.t-body_popupshowed .t-popup__close-icon_cross {
    display: none !important;
  }

  /* Pop-up: цвета иконок/текста */
  body.t-body_popupshowed .t-popup.t-popup_show .t-popup__close {
    background-color: #4d0f11 !important;
  }

  body.t-body_popupshowed .t-popup__close .t-popup__close-icon path,
  body.t-body_popupshowed .t-popup__close .t-popup__close-icon rect,
  body.t-body_popupshowed .t-popup__close .t-popup__close-icon g {
    fill: #fece78 !important;
  }

  .t-store__prod-popup__close-txt,
  .t-store__prod-popup__close-txt * {
    color: #fece78 !important;
  }


  /* Корзина t706 — фон и цвет крестика */
  .t706__cartwin-close,
  .t706__cartwin-close-wrapper {
    background-color: #4d0f11 !important;
  }

  .t706__cartwin-close-icon rect,
  .t706__cartwin-close-icon path,
  .t706__cartwin-close-icon g {
    fill: #fece78 !important;
  }


  /* Product page (не popup) — плашка "назад" + убрать скругления галереи */
  .t-store__prod-snippet__container > .t-popup__close {
    background-color: #4d0f11 !important; /* перебиваем inline */
  }

  .t-store__prod-snippet__container > .t-popup__close .t-popup__close-icon path,
  .t-store__prod-snippet__container > .t-popup__close .t-popup__close-icon rect,
  .t-store__prod-snippet__container > .t-popup__close .t-popup__close-icon g {
    fill: #fece78 !important;
  }

  .t-store__prod-snippet__container .t-store__prod-popup__close-txt,
  .t-store__prod-snippet__container .t-store__prod-popup__close-txt * {
    color: #fece78 !important;
  }

  .t-store__prod-snippet__container .t-popup__container {
    border-radius: 0 !important;
  }

  .t-store__prod-snippet__container .t-slds__main {
    border-radius: 0 !important;
    overflow: visible !important;
  }

  .t-store__prod-snippet__container .t-slds__thumbsbullet,
  .t-store__prod-snippet__container .t-slds__thumbsbullet-border {
    border-radius: 0 !important;
    overflow: visible !important;
  }


  /* Header shadow on mobile (T228 / rec1883352541) */
  #rec1883352541 .tmenu-mobile {
    box-shadow: 0 10px 20px rgba(0, 11, 48, 0.25) !important;
    z-index: 10000 !important;

    /* не фиксируем всегда — только когда Tilda включает fixed-класс */
    position: static !important;
    top: auto !important;
  }

  #rec1883352541 .tmenu-mobile.tmenu-mobile_positionfixed {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    top: 0 !important;
    z-index: 10000 !important;
  }

  #rec1883352541 .t228 {
    box-shadow: 0 10px 20px rgba(0, 11, 48, 0.25) !important;
    z-index: 9999 !important;
    position: relative;
  }
}


/* =========================================================
   DESKTOP (>=981px) — корзина t706: кастомный крестик как в pop-up
   ========================================================= */
@media screen and (min-width: 981px) {

  /* убрать дефолтный крестик (чтобы не мигал) */
  .t706__cartwin .t706__cartwin-close {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
  }

  /* якорь для псевдо-элементов */
  .t706__cartwin.t706__cartwin_showed .t706__cartwin-content {
    position: relative !important;
    overflow: visible !important;
  }

  /* кружок */
  .t706__cartwin.t706__cartwin_showed .t706__cartwin-content::after {
    content: "";
    position: absolute;
    top: 16px;
    right: -64px;
    width: 44px;
    height: 44px;
    background: #4d0f11;
    border-radius: 999px;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
    z-index: 9999;
    pointer-events: none;
  }

  /* крестик */
  .t706__cartwin.t706__cartwin_showed .t706__cartwin-content::before {
    content: "";
    position: absolute;
    top: 16px;
    right: -64px;
    width: 44px;
    height: 44px;
    z-index: 10000;
    pointer-events: none;
    background:
      linear-gradient(#fece78, #fece78) center/22px 2px no-repeat,
      linear-gradient(#fece78, #fece78) center/2px 22px no-repeat;
    transform: rotate(45deg);
  }

  /* hover: инверсия */
  .t706__cartwin.t706__cartwin_showed .t706__cartwin-content:hover::after {
    background: #eeeeee;
  }

  .t706__cartwin.t706__cartwin_showed .t706__cartwin-content:hover::before {
    background:
      linear-gradient(#4d0f11, #4d0f11) center/22px 2px no-repeat,
      linear-gradient(#4d0f11, #4d0f11) center/2px 22px no-repeat;
  }
}