/* ГАЛЕРЕЯ Кастомный курсор для галереи T603 (zoomable изображения) */
.t603__blockimg[data-zoomable="yes"] {
  cursor: url('https://static.tildacdn.com/tild6361-3433-4763-b361-373839303636/photo.png') 12 12, pointer !important;
}




/* ГАРМОШКА Скрываем оригинальные линии крестика*/
#rec1841814671 .t668__lines {
  display: none;
}

/* Добавляем свою иконку как фон кнопки */
#rec1841814671 .t668__trigger-button {
  position: relative;
}

#rec1841814671 .t668__trigger-button::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 30px; /* отступ от правого края */
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  background-image: url("https://static.tildacdn.com/tild3464-3665-4834-a135-376636353964/zz.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  transition: transform 0.3s ease;
  pointer-events: none; /* чтобы не мешал клику */
}

/* Поворот при раскрытии */
#rec1841814671 .t668__header.t668__opened .t668__trigger-button::after {
  transform: translateY(-50%) rotate(45deg);
}




/* ГАЛЕРЕЯ - ОБЩИЕ НАСТРОЙКИ СТРЕЛОК И КРЕСТИКА */

/* Убираем стандартное позиционирование стрелок и задаем общие свойства */
.t-carousel__zoomer__control_left,
.t-carousel__zoomer__control_right {
  position: fixed !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  opacity: 0.6 !important; /* Начальная полупрозрачность для стрелок */
  pointer-events: auto !important;
  z-index: 99999 !important;
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  width: 50px !important;
  height: 50px !important;
  transition: opacity 0.3s ease, transform 0.3s ease !important; /* Плавный переход */
}

/* Определяем ширину изображения и отступаем от центра */
:root {
  --gallery-img-width: 900px; /* ← УКАЖИТЕ ШИРИНУ ВАШИХ ИЗОБРАЖЕНИЙ */
  --gallery-img-height: 650px; /* ← УКАЖИТЕ ВЫСОТУ ВАШИХ ИЗОБРАЖЕНИЙ */
}

.t-carousel__zoomer__control_left {
  left: calc(50% - var(--gallery-img-width) / 2 - 30px) !important;
}

.t-carousel__zoomer__control_right {
  right: calc(50% - var(--gallery-img-width) / 2 - 60px) !important;
}

/* Показ при наведении на область просмотра (стрелки становятся непрозрачными) */
.t-zoomer__wrapper:hover .t-carousel__zoomer__control_left,
.t-zoomer__wrapper:hover .t-carousel__zoomer__control_right {
  opacity: 1 !important;
}

/* Очищаем все внутренние элементы стандартных стрелок */
.t-carousel__zoomer__control_left *,
.t-carousel__zoomer__control_left::before,
.t-carousel__zoomer__control_left::after,
.t-carousel__zoomer__control_right *,
.t-carousel__zoomer__control_right::before,
.t-carousel__zoomer__control_right::after {
  display: none !important;
}


/* --- Кастомная левая стрелка (по умолчанию и при наведении) --- */
.t-carousel__zoomer__control_left {
  background-image: url('https://static.tildacdn.com/tild3862-6534-4431-b331-313065323464/left-arrow_2.png') !important; /* Исходная картинка левой стрелки */
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-color: transparent !important;
}

.t-carousel__zoomer__control_left:hover {
  opacity: 1 !important;
  transform: scale(1.1) translateY(-45%) !important; /* Масштабирование при наведении */
  background-image: url('https://static.tildacdn.com/tild3862-6534-4431-b331-313065323464/left-arrow_2.png') !important; /* <-- СЮДА ВСТАВЬТЕ URL НОВОЙ КАРТИНКИ ЛЕВОЙ СТРЕЛКИ */
}


/* --- Кастомная правая стрелка (по умолчанию и при наведении) --- */
.t-carousel__zoomer__control_right {
  background-image: url('https://static.tildacdn.com/tild3362-3330-4038-b033-633639623030/right-arrow_2.png') !important; /* Исходная картинка правой стрелки */
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-color: transparent !important;
}

.t-carousel__zoomer__control_right:hover {
  opacity: 1 !important;
  transform: scale(1.1) translateY(-45%) !important; /* Масштабирование при наведении */
  background-image: url('https://static.tildacdn.com/tild3362-3330-4038-b033-633639623030/right-arrow_2.png') !important; /* <-- СЮДА ВСТАВЬТЕ URL НОВОЙ КАРТИНКИ ПРАВОЙ СТРЕЛКИ */
}


/* --- КРЕСТИК ЗАКРЫТИЯ ГАЛЕРЕИ (по умолчанию и при наведении) --- */

/* Очищаем стандартные элементы внутри крестика */
.t-zoomer__close *,
.t-zoomer__close::before,
.t-zoomer__close::after {
  display: none !important;
}

/* Позиционирование и кастомная картинка */
.t-zoomer__close {
  display: block !important;
  position: fixed !important;
  top: 20px !important; /* Отступ сверху */
  right: 25px !important; /* Отступ справа */
  left: auto !important;
  bottom: auto !important;
  transform: none !important;
  opacity: 0.9 !important; /* Начальная полупрозрачность */
  pointer-events: auto !important;
  z-index: 2147483647 !important;
  background: none !important;
  background-image: url('https://static.tildacdn.com/tild3765-6465-4338-b632-643565383730/krest.png') !important; /* Исходная картинка крестика */
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  width: 19px !important; /* Подставьте реальный размер вашей картинки krest.png */
  height: 19px !important; /* Подставьте реальный размер вашей картинки krest.png */
  border-radius: 0 !important;
  transition: opacity 0.2s, transform 0.3s ease !important; /* Плавный переход */
}

/* При наведении на обертку галереи, крестик становится полностью непрозрачным */
.t-zoomer__wrapper:hover .t-zoomer__close {
  opacity: 1 !important;
}

/* Эффект при наведении на сам крестик */
.t-zoomer__close:hover {
  opacity: 1 !important;
  transform: scale(1.1) !important; /* Масштабирование при наведении */
  background-image: url('https://static.tildacdn.com/tild3765-6465-4338-b632-643565383730/krest.png') !important; /* <-- СЮДА ВСТАВЬТЕ URL НОВОЙ КАРТИНКИ КРЕСТИКА */
}


/* --- НАСТРОЙКИ ФОНА И ИЗОБРАЖЕНИЯ ГАЛЕРЕИ --- */

/* Черный полупрозрачный фон - было 0.5, стало 0.7 */
.t-zoomer__bg {
  background: rgba(0, 0, 0, 0.7) !important;
  cursor: pointer !important; /* Делаем фон кликабельным для закрытия */
}

/* Добавляем подсказку на фон */
.t-zoomer__bg::after {
  content: "Кликните по фону для закрытия";
  position: fixed;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  color: #ccc; /* Сделал цвет светлее, чтобы было видно на темном фоне */
  font-size: 14px;
  z-index: 999999;
  pointer-events: none;
  opacity: 0.7;
  transition: opacity 0.3s;
}

.t-zoomer__bg:hover::after {
  opacity: 1;
}

/* Прозрачный контейнер (чтобы фон был виден) */
.t-zoomer__container {
  background: transparent !important;
  color: #000 !important; /* текст — чёрный на белом фоне */
}

/* Закругляем само изображение (альтернатива) */
.t-carousel__zoomer__img {
  border-radius: 25px !important; /* если не используете плашку */
  display: block !important;
}