/* Код сработает только внутри блока, которому задан класс us-foto */
.uc-foto .t-store__load-more-btn-wrap .t-btnflex {
    margin-top: 0px !important;
}




/* Каркасные стили (НЕ ТРОГАЕМ, они держат слайдер в один ряд) */
.slick-slide, .slick-slide a, .slick-slide .t-btn { outline: none }
.cols-for-slick-slider { padding: 0 40px }
.cols-for-slick-slider .t-store__valign-buttons.js-store-grid-cont { flex-wrap: nowrap !important; display: flex !important; }
.cols-for-slick-slider .t-store__card__textwrapper { height: auto !important }
.cols-for-slick-slider .t-store__card__wrap_all { height: 100%; display: flex; flex-direction: column; }
.cols-for-slick-slider .t-store__card__wrap_txt-and-btns { flex-grow: 1 }
.cols-for-slick-slider .t-store__grid-wrap { display: block !important; }
.cols-for-slick-slider .slick-track .t-col { max-width: none !important; }
.cols-for-slick-slider .slick-track { height: 100%; display: flex !important; }
.cols-for-slick-slider .slick-slide { height: auto; margin-bottom: 0 !important; }

/* ОБНОВЛЕННЫЕ СТИЛИ ДЛЯ ВАШИХ КАСТОМНЫХ СТРЕЛОК (60х60px) */
.slick-prev, .slick-next { 
  width: 30px !important; 
  height: 30px !important; 
  background: transparent !important; 
  z-index: 999 !important; 
}
/* Смещение стрелок наружу в боковые белые поля сайта, чтобы не перекрывали шары */
.slick-prev { left: 0px !important; }
.slick-next { right: 0px !important; }

/* Общие правила отображения ваших картинок */
button.slick-arrow:before {
  content: "" !important;
  background-size: contain !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  width: 30px !important; 
  height: 30px !important; 
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  opacity: 0.8 !important; /* Небольшая прозрачность, чтобы смотрелось изящно */
  transition: opacity 0.2s ease, transform 0.1s ease !important;
}

/* Ховер-эффект: при наведении мышки стрелка становится ярче */
button.slick-arrow:hover:before { 
  opacity: 1 !important; 
}

/* Эффект нажатия: стрелочка слегка сжимается при клике */
button.slick-arrow:active:before {
  transform: scale(0.92) !important;
}

/* Прямая ссылка для левой стрелки */
button.slick-prev:before {
  background-image: url('https://static.tildacdn.com/tild3230-3038-4139-b139-663166616432/_.png') !important;
}

/* Прямая ссылка для правой стрелки (без авторазворота, чистая картинка) */
button.slick-next:before {
  background-image: url('https://static.tildacdn.com/tild3932-3861-4136-b166-323161626436/_.png') !important;
}

/* Скрытие пагинации Tilda */
.uc-my-product-slider .t-store__pagination { display: none !important; }

@media screen and (max-width:960px){ 
  .cols-for-slick-slider { padding: 0 10px; } 
}

/* Адаптивные отступы для стрелок на узких экранах, чтобы они не уезжали за дисплей */
@media screen and (max-width: 1024px) {
  /* На вертикальном планшете принудительно задвигаем стрелки внутрь */
  .slick-prev { left: 5px !important; }
  .slick-next { right: 5px !important; }
}

@media screen and (max-width: 480px) {
  /* На мобильных экранах карточки узкие, поэтому сдвигаем стрелки вплотную к краям, но оставляем внутри */
  .slick-prev { left: 0px !important; }
  .slick-next { right: 0px !important; }
  
  /* Немного уменьшаем размер ваших круглых стрелок на смартфонах (до 38px), чтобы они гармонично смотрелись на узком экране */
  .slick-prev, .slick-next, button.slick-arrow:before {
    width: 30px !important;
    height: 30px !important;
  }
}





/* 1. Скрываем стандартные SVG-иконки Тильды - ПОВЫШЕННАЯ СПЕЦИФИЧНОСТЬ */
.t585__header .t585__lines svg,
.t585__trigger .t585__lines svg {
    display: none !important;
}

/* 2. Базовые настройки для контейнера иконки - ПОВЫШЕННАЯ СПЕЦИФИЧНОСТЬ */
.t585__header .t585__lines,
.t585__trigger .t585__lines {
    width: 24px !important;  
    height: 24px !important; 
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    display: block !important;
    transition: transform 0.3s ease-in-out, background-image 0.2s ease-in-out !important; 
}

/* 3. Первая картинка (вместо ПЛЮСА) — когда вопрос ЗАКРЫТ */
.t585__header .t585__lines,
.t585__trigger .t585__lines {
    background-image: url('https://static.tildacdn.com/tild6434-6535-4630-a162-646561326635/_.png') !important;
    transform: rotate(0deg) !important;
}

/* 4. Вторая картинка (вместо КРЕСТИКА) + ПОВОРОТ на 180 градусов — когда вопрос ОТКРЫТ */
.t585__opened .t585__header .t585__lines,
.t585__opened .t585__trigger .t585__lines {
    background-image: url('https://static.tildacdn.com/tild6564-3032-4533-b632-633833323166/__.jpg') !important;
    transform: rotate(180deg) !important;
}

/* 5. Убираем серый круглый фон - ПОВЫШЕННАЯ СПЕЦИФИЧНОСТЬ */
.t585__header .t585__circle,
.t585__trigger .t585__circle,
.t585__header .t585__circle:hover,
.t585__trigger .t585__circle:hover,
.t585__header .t585__trigger:hover .t585__circle,
.t585__trigger .t585__trigger:hover .t585__circle {
    background: transparent !important;
    background-color: transparent !important;
    border-color: transparent !important;
}



/* ЖЕСТКОЕ ВЫРАВНИВАНИЕ ДЛЯ БЛОКА ST300 */

/* 1. Заставляем все карточки в ряду ST300 быть строго одной высоты */
.t-store__grid_flex {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
}

/* 2. Растягиваем внутренний контейнер карточки на всю высоту */
.t-store__grid_flex .t-store__card {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
}

/* 3. Делаем текстовый блок гибким, чтобы он занимал всё оставшееся пространство */
.t-store__card__textwrapper {
  display: flex !important;
  flex-direction: column !important;
  flex-grow: 1 !important;
  height: 100% !important;
  box-sizing: border-box !important;
  padding-bottom: 10px !important;
}

/* 4. Намертво прижимаем наш тройной ряд кнопок к нижнему краю текстового контейнера */
.custom-triple-row {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 10px !important; 
  width: 50% !important; 
  max-width: 150px !important; 
  box-sizing: border-box !important;
  
  /* Главная магия выравнивания по низу */
  margin-top: -20px !important;
  margin-bottom: 5px !important; 
  margin-left: auto !important; 
  margin-right: auto !important;
  
  /* Для позиционирования подсказок */
  position: relative !important;
}

/* 5. ПОЛНОСТЬЮ И БЕЗОПАСНО ПРЯЧЕМ СТАРЫЕ ШИРОКИЕ КНОПКИ TILDA И ФЕЙК-ПОДРОБНЕЕ */
.t-store__card .t-store__card__btn,
.t-store__card .t-store__card__btn_second,
.t-store__card .js-store-prod-btn,
.t-store__card .js-store-prod-btn2,
.t-store__btn-fake-more {
  display: none !important;
}

/* 6. СТИЛИ ДЛЯ САМИХ КНОПОК-ИКОНОК */
.t-store__btn-custom-3,
.t-store__btn-custom-4,
.t-store__btn-fake-cart {
  display: flex !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 1 / 1 !important; 
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 0 !important;
  box-sizing: border-box !important;
  cursor: pointer !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-color: transparent !important;
  border: none !important;
  transition: transform 0.2s ease, opacity 0.2s ease !important;
  
  /* Для позиционирования подсказок */
  position: relative !important;
}

.t-store__btn-custom-3:hover,
.t-store__btn-custom-4:hover,
.t-store__btn-fake-cart:hover {
  transform: scale(1.08) !important;
  opacity: 0.85 !important;
}

/* ========== СТИЛИ ДЛЯ ПОДСКАЗОК (TOOLTIP) ========== */
.tooltip-text {
  visibility: hidden !important;
  opacity: 0 !important;
  width: 120px !important;
  background-color: #333 !important;
  color: #fff !important;
  text-align: center !important;
  padding: 6px 10px !important;
  border-radius: 6px !important;
  font-size: 12px !important;
  font-family: system-ui, sans-serif !important;
  font-weight: 400 !important;
  line-height: 1.3 !important;
  
  /* Позиционирование */
  position: absolute !important;
  bottom: 110% !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  z-index: 9999 !important;
  
  /* Плавное появление */
  transition: opacity 0.3s ease, visibility 0.3s ease !important;
  
  white-space: nowrap !important;
}

/* Стрелочка вниз от подсказки */
.tooltip-text::after {
  content: "" !important;
  position: absolute !important;
  top: 100% !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  border: 6px solid transparent !important;
  border-top-color: #333 !important;
}

/* Показываем подсказку при наведении на кнопку */
.t-store__btn-custom-3:hover .tooltip-text,
.t-store__btn-custom-4:hover .tooltip-text,
.t-store__btn-fake-cart:hover .tooltip-text {
  visibility: visible !important;
  opacity: 1 !important;
}

/* ТОЧНАЯ ПРИВЯЗКА КАРТИНОК */
.t-store__btn-custom-3 { 
  background-image: url('https://static.tildacdn.com/tild3333-6163-4534-b930-303632366432/3.png') !important; 
}

.t-store__btn-custom-4 { 
  background-image: url('https://static.tildacdn.com/tild6362-3862-4633-b430-316135663331/3.png') !important; 
}

.t-store__btn-fake-cart { 
  background-image: url('https://static.tildacdn.com/tild3633-3731-4936-b362-316237643530/__.png') !important; 
}

@media screen and (max-width: 480px) {
  .custom-triple-row { width: 75% !important; gap: 9px !important; margin-top: auto !important; }
  .tooltip-text { 
    font-size: 10px !important; 
    width: 100px !important;
    padding: 4px 8px !important;
  }
}

/* ПРИБЛИЖАЕМ КНОПКИ К ОПИСАНИЮ ТОВАРА */
.store__card__wrap_txt-and-opts {
  min-height: 0px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
}



/* 1. Выравнивание контейнера чекбокса по центру строки с текстом */
.t-checkbox__control {
    display: flex !important;
    align-items: center !important; /* Центрирует картинку и текст по одной оси */
}

/* 2. Настройка уменьшенного размера и первой картинки */
.t-checkbox__indicator {
    width: 18px !important;            /* Уменьшили ширину (было 24px) */
    height: 18px !important;           /* Уменьшили высоту (было 24px) */
    min-width: 18px !important;        /* Защита от сжатия на мобильных */
    min-height: 18px !important;
    border: none !important;
    background-color: transparent !important;
    position: relative !important;
    display: inline-block !important;
    flex-shrink: 0 !important;
    margin-top: 0 !important;          /* Сбрасываем стандартное смещение Tilda */
    top: 0 !important;
    
    /* Ссылка на картинку ПУСТОГО чекбокса */
    background-image: url('https://static.tildacdn.com/tild6235-6631-4139-b865-643636633635/photo.png') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}

/* 3. Сброс стилей и центрирование второй картинки (галочки) */
.t-checkbox__indicator:after {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    border: none !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    transform: none !important;
    opacity: 0 !important;             /* Изначально галочка скрыта */
    transition: opacity 0.15s ease !important;
}

/* 4. Отображение галочки при клике */
.t-checkbox:checked ~ .t-checkbox__indicator:after {
    opacity: 1 !important;
    /* Ссылка на картинку ЧЕКБОКСА С НАРИСОВАННОЙ ГАЛОЧКОЙ */
    background-image: url('https://static.tildacdn.com/tild6135-3833-4732-a164-373363646635/__.png') !important;
}

/* 5. Настройка отступа для текста */
.t-checkbox__labeltext {
    padding-left: 0px !important;     /* Расстояние от картинки до текста */
    display: inline-block !important;
}




/* ИДЕАЛЬНАЯ И ЧИСТАЯ КНОПКА-ОВАЛ ДЛЯ ВСЕХ ЭКРАНОВ */
.t-submit {
    background: url("https://static.tildacdn.com/tild3331-6537-4061-a539-306132326130/___.png") no-repeat center / contain !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 auto !important;
    overflow: visible !important;
    cursor: pointer !important;

    /* Схлопываем и полностью скрываем фабричный текст Tilda */
    font: 0/0 a !important;
    color: transparent !important;

    /* Размеры и адаптивность */
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
    height: 75px !important; /* Базовая высота для мобильных */

    /* Плавность анимации */
    transition: transform 0.2s ease-in-out !important;
}

/* Коррекция высоты строго для компьютеров (десктопа) */
@media screen and (min-width: 961px) {
    .t-submit {
        height: 85px !important;
    }
}

/* Увеличение до 105% при наведении курсора */
.t-submit:hover {
    transform: scale(1.05) !important;
}





/* 1. Скрываем стандартную стрелочку Tilda для ВСЕХ списков */
.t-input-group_sb .t-select__wrapper::after {
    display: none !important;
}

/* 2. Убираем стандартные рамки у обертки ВСЕХ списков */
.t-select__wrapper {
    border: none !important;
    background: transparent !important;
}

/* 3. Универсальная кастомизация для ВСЕХ полей выбора на сайте */
.t-select {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;

    border: none !important;
    outline: none !important;
    background-color: transparent !important;
    box-shadow: none !important;

    /* Картинки применяются ко всем элементам с классом .t-select */
    background-image: 
        url('https://static.tildacdn.com/tild6434-6535-4630-a162-646561326635/_.png'), 
        url('https://static.tildacdn.com/tild6163-3033-4830-b463-396362373966/___.png') !important;
        
    background-repeat: no-repeat, no-repeat !important;
    background-position: right 15px center, center !important; 
    background-size: 20px auto, 100% 100% !important;

    /* Настройка текста */
    font-size: 14px !important; 
    color: #4CB350 !important;
    
    padding-left: 20px !important;
    padding-right: 45px !important;
}



/* =======================================================
   1. НАСТРОЙКА ОБЕРТКИ И ОТРИСОВКА КАРТИНКИ-ЛИНИИ
   ======================================================= */
.t-range__wrapper {
    position: relative !important;
    height: 40px !important; /* Общая высота кликабельной зоны */
    background: transparent !important;
    border: none !important;
    display: flex !important;
    align-items: center !important;
    box-sizing: border-box !important;
    margin-bottom: 30px !important; /* Отступ снизу, чтобы нижние цифры не наезжали на текст ниже */
    
}

.t-range__wrapper::before {
    content: "" !important;
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    height: 12px !important;
    
    /* 🛠 УМЕНЬШАЕМ ДЛИНУ ЛИНИИ НА 10 ПИКСЕЛЕЙ С КРАЕВ */
    left: 10px !important;
    right: 10px !important;
    
    background-image: url('https://static.tildacdn.com/tild3335-3566-4833-b362-363664303065/photo.png') !important;
    background-size: 100% 100% !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    z-index: 1 !important;
    pointer-events: none !important;
}


/* =======================================================
   2. СБРОС СТАНДАРТНОГО ПОЛЗУНКА TILDA
   ======================================================= */
.t-range__wrapper input[type=range].t-range {
    position: relative !important;
    z-index: 3 !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    width: 100% !important;
    height: 100% !important;
    background: transparent !important; 
    border: none !important;
    box-shadow: none !important;
    margin: 0 !important;
    outline: none !important;
}

/* Сброс скрытых треков во всех браузерах */
.t-range__wrapper input[type=range].t-range::-webkit-slider-runnable-track {
    background: transparent !important;
    border: none !important;
    height: 100% !important; 
}
.t-range__wrapper input[type=range].t-range::-moz-range-track {
    background: transparent !important;
    border: none !important;
    height: 100% !important;
}
.t-range__wrapper input[type=range].t-range::-moz-range-progress {
    background-color: transparent !important;
}

/* =======================================================
   3. ЗАМЕНА ЗЕЛЕНОГО КРУЖКА НА ВАШ ТРЕУГОЛЬНИК (БЕГУНОК)
   ======================================================= */

/* Настройка для Google Chrome, Safari (iPhone), Яндекс.Браузера, Opera, Edge */
.t-range__wrapper input[type=range].t-range::-webkit-slider-thumb {
    -webkit-appearance: none !important;
    appearance: none !important;
    
    height: 20px !important; /* Высота вашего треугольника */
    width: 20px !important;  /* Ширина вашего треугольника */
    
    /* 🔗 СЮДА ССЫЛКУ НА КАРТИНКУ ТРЕУГОЛЬНИКА ДЛЯ CHROME/SAFARI */
    background-image: url('https://static.tildacdn.com/tild6334-3965-4361-b961-366432623561/photo.png') !important;
    
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    border: none !important;
    background-color: transparent !important; 
    box-shadow: none !important;
    cursor: pointer !important;
    
    /* 🛠 РЕДАКТИРОВАНИЕ ВЫСОТЫ БЕГУНКА В Chrome/Safari: */
    /* Увеличивайте минус (например, -12px), чтобы поднять треугольник ВЫШЕ на линию */
    /* Уменьшайте минус (например, -6px), чтобы опустить треугольник НИЖЕ */
    margin-top: -30px !important; 
}

/* Настройка для браузера Mozilla Firefox */
.t-range__wrapper input[type=range].t-range::-moz-range-thumb {
    -moz-appearance: none !important;
    appearance: none !important;
    
    height: 20px !important; /* Высота вашего треугольника */
    width: 20px !important;  /* Ширина вашего треугольника */
    
    /* 🔗 СЮДА ТОЧНО ТАКУЮ ЖЕ ССЫЛКУ НА ТРЕУГОЛЬНИК ДЛЯ FIREFOX */
    background-image: url('https://static.tildacdn.com/tild6334-3965-4361-b961-366432623561/photo.png') !important;
    
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    border: none !important;
    background-color: transparent !important;
    box-shadow: none !important;
    cursor: pointer !important;
}

/* =======================================================
   4. ВЫРАВНИВАНИЕ БОКОВЫХ ЦИФР ИНТЕРВАЛА (10 и 50)
   ======================================================= */
.t-range__interval-txt-wrapper {
    position: absolute !important;
    bottom: -7px !important; /* На сколько пикселей опустить цифры 10 и 50 ниже линии */
    
    /* 🛠 ВОТ ЭТИ ДВЕ СТРОЧКИ ИСПРАВЯТ СДВИГ: */
    width: 100% !important;
    padding: 0 4px !important; 
    box-sizing: border-box !important;
    
    display: flex !important;
    justify-content: space-between !important; /* Жестко разносит цифру 10 влево, а 50 вправо */
    pointer-events: none !important;
}


/* Сбрасываем старые стили Tilda, мешающие выравниванию по краям */
.t-range__interval-txt {
    position: static !important;
    display: block !important;
}

/* =======================================================
   5. РЕДАКТИРОВАНИЕ ЦИФРЫ НАД БЕГУНКОМ (ПЛАШКА С НАЧАЛЬНЫМ ЗНАЧЕНИЕМ)
   ======================================================= */
.t-range__value-txt {
    /* 🛠 НАСТРОЙКА ВЫСОТЫ ЦИФРЫ НАД БЕГУНКОМ: */
    /* Увеличивайте минус (-25px, -30px), чтобы поднять цифру ВЫШЕ от треугольника */
    /* Уменьшайте минус (-15px, -10px), чтобы опустить цифру БЛИЖЕ к треугольнику */
    top: 21px !important; 
}

/* =======================================================
   6. ГЛОБАЛЬНАЯ НАСТРОЙКА ЗАГОЛОВКОВ ВСЕХ ПОЛЕЙ ФОРМ НА САЙТЕ
   ======================================================= */
.t-form .t-input-title,
.t-form label.t-input-title[style*="font-size"] {
    /* 🛠 МЕНЯЙТЕ РАЗМЕР ШРИФТА ЗДЕСЬ (применится ко всем формам): */
    font-size: 14px !important; 
    
    /* Если нужно сделать все заголовки жирнее (700) или тоньше (400): */
    font-weight: 500 !important;
    
    /* Если нужно изменить цвет всех заголовков полей: */
    /* color: #333333 !important; */
}





