:root {
  /* Объявление глобальных переменных (цветов и отступов) */
  --bg: #fbfaf7; /* Основной фоновый цвет сайта (светло-кремовый) */
  --text: #141316; /* Основной цвет текста (почти черный) */
  --muted: #6b656d; /* Цвет для второстепенного текста (серый) */
  --line: #e9e5df; /* Цвет разделительных линий и границ */
  --card: #ffffff; /* Цвет фона карточек (чисто белый) */

  --pink: #e7a3b8; /* Акцентный розовый цвет (под логотип) */
  --violet: #8b6ad9; /* Акцентный фиолетовый цвет */
  --gold: #b8923c; /* Акцентный золотой цвет для статусных элементов */

  --radius: 16px; /* Стандартный радиус скругления углов */
  --shadow: 0 14px 40px rgba(20, 19, 22, 0.08); /* Глубокая тень для эффекта парения */
  --shadow-soft: 0 8px 24px rgba(20, 19, 22, 0.06); /* Мягкая тень для блоков */
}

html {
  scroll-behavior: smooth;
} /* Плавная прокрутка при переходе по якорям */
body {
  /* Базовые стили для всего тела страницы */
  background: var(--bg); /* Применяем фоновый цвет из переменной */
  color: var(--text); /* Применяем основной цвет текста */
  font-family:
    Inter,
    system-ui,
    -apple-system,
    "Segoe UI",
    Roboto,
    Arial,
    sans-serif; /* Набор шрифтов без засечек */
  line-height: 1.55; /* Межстрочный интервал для читабельности */
  letter-spacing: 0.01em; /* Межбуквенный интервал */
}

h1,
h2,
h3,
.entry-title {
  /* Стили для заголовков */
  font-family: "Cormorant Garamond", Georgia, "Times New Roman", serif; /* Премиальный шрифт с засечками */
  letter-spacing: 0.01em; /* Интервал между буквами в заголовках */
}

a {
  color: inherit;
  text-underline-offset: 3px;
} /* Ссылки наследуют цвет текста, подчеркивание чуть ниже */
a:hover {
  color: var(--violet);
} /* Цвет ссылки при наведении меняется на фиолетовый */

/* ---------- Header top bar ---------- */ /* Секция настроек шапки сайта */
.site-header {
  /* Основной контейнер шапки */
  position: sticky; /* Прилипает к верху при скролле */
  top: 0; /* Дистанция от верха — ноль */
  z-index: 50; /* Слой выше остальных элементов */
  background: #fffffff0; /* Фон — плотный белый */
  backdrop-filter: none; /* Отключаем размытие (эффект стекла) */
  -webkit-backdrop-filter: none; /* Отключаем размытие для Safari */
  border-bottom: 1px solid var(--line); /* Тонкая линия снизу шапки */
}

.site-header__inner {
  /* Внутренняя обертка шапки */
  max-width: 1200px; /* Ограничение ширины контента */
  margin: 0 auto; /* Центрирование по горизонтали */
  padding: 10px 20px; /* Внутренние отступы (верх/низ 10, право/лево 20) */
  display: grid; /* Используем сетку Grid для компоновки */
  align-items: center; /* Центровка элементов по вертикали */
  gap: 12px 16px; /* Расстояние между элементами сетки */
  /* Колонки/строки задаются по data-header-layout (js/header-logic.js) */
}

/* a — один ряд: язык | навигация (поиск только в контенте, не в шапке) */
.site-header__inner[data-header-layout="a"] {
  grid-template-columns: auto max-content;
  grid-template-rows: auto;
}

.site-header__inner[data-header-layout="a"] .site-header__group--lang,
.site-header__inner[data-header-layout="a"] .site-header__group--nav {
  grid-column: auto;
  grid-row: auto;
}

/* b — первый ряд язык; второй ряд навигация */
.site-header__inner[data-header-layout="b"] {
  grid-template-columns: 1fr;
  grid-template-rows: auto auto;
}

.site-header__inner[data-header-layout="b"] .site-header__group--lang {
  grid-column: 1 / -1;
  grid-row: 1;
}

.site-header__inner[data-header-layout="b"] .site-header__group--nav {
  grid-column: 1 / -1;
  grid-row: 2;
  justify-self: start;
  align-self: center;
  min-width: 0;
}

/* c — два ряда: язык, затем навигация */
.site-header__inner[data-header-layout="c"] {
  grid-template-columns: 1fr;
  grid-template-rows: auto auto;
}

.site-header__inner[data-header-layout="c"] .site-header__group--lang {
  grid-column: 1;
  grid-row: 1;
}

.site-header__inner[data-header-layout="c"] .site-header__group--nav {
  grid-column: 1;
  grid-row: 2;
  justify-self: start;
  align-self: center;
}

.site-header__group {
  /* Общий класс для групп элементов в шапке */
  min-width: 0; /* Позволяет флекс-элементам сжиматься внутри */
}

.site-header__group--lang {
  /* Группа выбора языка — по ширине контента, не на всю строку сетки */
  justify-self: start;
  width: fit-content;
  max-width: 100%;
}

.site-header__group--nav {
  /* Группа навигационных ссылок */
  justify-self: start; /* Прижать к началу своей ячейки */
}

.lang-switcher, /* Стили для переключателя языков */
.lang-switcher select, /* Стили выпадающего списка */
.lang-switcher .lang-switcher__placeholder {
  /* Стили текста-заглушки */
  font-family:
    Inter,
    system-ui,
    -apple-system,
    "Segoe UI",
    Roboto,
    Arial,
    sans-serif; /* Шрифт без засечек */
}

.lang-switcher select, /* Конкретно для элемента select */
.lang-switcher .pll-switcher select, /* Для селекта Polylang */
.lang-switcher .lang-switcher__placeholder {
  /* Для плейсхолдера */
  height: 40px; /* Высота поля выбора */
  border: 1px solid var(--line); /* Тонкая граница */
  border-radius: 999px; /* Скругление "капсула" */
  padding: 0 14px; /* Боковые отступы внутри */
  background: #fff; /* Белый фон */
  color: var(--text); /* Цвет текста */
  font-size: 12px; /* Размер шрифта */
  letter-spacing: 0.06em; /* Увеличенный межбуквенный интервал */
  text-transform: uppercase; /* Все буквы заглавные */
}

.lang-switcher .pll-switcher {
  /* Обертка переключателя */
  display: inline-flex; /* Ведет себя как строка, внутри — флекс */
  align-items: center; /* Центровка содержимого по вертикали */
}

.lang-switcher .pll-switcher select {
  /* Кастомизация выпадающего списка */
  appearance: none; /* Скрываем стандартную стрелку браузера */
  -webkit-appearance: none; /* Скрываем стрелку в Safari */
  -moz-appearance: none; /* Скрываем стрелку в Firefox */
  padding-right: 34px; /* Место для кастомной стрелки справа */
  background-image: /* Рисуем стрелку градиентом */
    linear-gradient(45deg, transparent 50%, var(--muted) 50%),
    /* Левая часть стрелки */ linear-gradient(135deg, var(--muted) 50%, transparent 50%); /* Правая часть стрелки */
  background-position: /* Позиция стрелки */
    calc(100% - 18px) 50%,
    /* Первая линия стрелки */ calc(100% - 12px) 50%; /* Вторая линия стрелки */
  background-size:
    6px 6px,
    6px 6px; /* Размер частей стрелки */
  background-repeat: no-repeat; /* Не повторять рисунок стрелки */
}

.header-nav {
  /* Контейнер навигации */
  display: flex; /* Флекс-контейнер */
  flex-direction: row; /* Элементы в ряд */
  align-items: center; /* Центровка по вертикали */
  gap: 8px; /* Расстояние между ссылками */
  flex-wrap: nowrap; /* Запрет переноса на новую строку */
}

.header-nav__link {
  /* Стили отдельной ссылки в меню */
  color: var(--text); /* Цвет из переменной */
  text-decoration: none; /* Убираем подчеркивание */
  font-weight: 700; /* Жирный шрифт */
  text-transform: uppercase; /* Заглавные буквы */
  font-size: 12px; /* Маленький аккуратный размер */
  letter-spacing: 0.08em; /* Разрядка букв */
  display: inline-flex; /* Флекс для выравнивания иконки внутри */
  align-items: center; /* Центровка текста и значков */
  gap: 8px; /* Зазор между текстом и иконкой */
  padding: 10px 12px; /* Поля вокруг текста */
  border-radius: 999px; /* Овальная кнопка при наведении */
  transition:
    background 0.15s ease,
    transform 0.15s ease; /* Плавная анимация фона и движения */
}

.header-nav__link:hover {
  /* При наведении на ссылку */
  background: rgba(20, 19, 22, 0.06); /* Легкий серый фон */
  transform: translateY(-1px); /* Смещение вверх на 1 пиксель */
}

.header-nav__badge {
  /* Счетчик товаров в корзине */
  min-width: auto; /* Нет минимальной ширины */
  height: auto; /* Высота по контенту */
  padding: 0; /* Убираем отступы */
  border: 0; /* Убираем границы */
  background: transparent; /* Прозрачный фон */

  color: var(--violet); /* Фиолетовый цвет цифры */
  font-size: 11px; /* Мелкий шрифт */
  font-weight: 800; /* Очень жирный шрифт */
  line-height: 1; /* Высота строки равна размеру шрифта */

  position: relative; /* Относительное позиционирование */
  top: -6px; /* Сдвиг цифры вверх (эффект суперскрипта) */
  margin-left: 2px; /* Отступ слева от иконки */
}

/* Узкий экран: язык и меню в два ряда, ссылки переносятся — без наложения DEUTSCH / START и т.п. */
@media (max-width: 640px) {
  .site-header__inner {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto auto !important;
    gap: 10px 12px;
    padding: 10px 14px;
  }

  .site-header__inner .site-header__group--lang {
    grid-column: 1 / -1 !important;
    grid-row: 1 !important;
    justify-self: start;
    width: auto;
    max-width: 100%;
    min-width: 0;
  }

  .site-header__inner .site-header__group--nav {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    justify-self: stretch;
    width: 100%;
    min-width: 0;
  }

  .site-header__group--lang .lang-switcher {
    width: fit-content;
    max-width: 100%;
  }

  .lang-switcher .pll-switcher {
    width: fit-content;
    max-width: 100%;
  }

  .lang-switcher select,
  .lang-switcher .pll-switcher select {
    width: auto;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  .header-nav {
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    gap: 6px 8px;
    width: 100%;
    row-gap: 8px;
  }

  .header-nav__link {
    padding: 8px 10px;
    font-size: 11px;
    letter-spacing: 0.05em;
    flex: 0 1 auto;
  }
}

.header-search {
  /* Блок поиска */
  width: 100%; /* На всю доступную ширину */
  min-width: 0; /* Чтобы не распирало родителя */
  max-width: 100%; /* Не шире контейнера */
}

.header-search form {
  /* Форма поиска */
  margin: 0; /* Убираем внешние отступы */
}

.header-search input[type="search"], /* Поле ввода поиска */
.header-search input.search-field {
  /* Поле поиска для специфических тем */
  width: 100%; /* Растянуть на всю ширину */
  height: 40px; /* Высота поля */
  border-radius: 999px; /* Полное скругление краев */
  border: 1px solid var(--line); /* Цвет границы */
  padding: 0 14px; /* Внутренние отступы текста */
  background: #fff; /* Белый фон */
}

.header-search button, /* Скрываем кнопку "Найти" */
.header-search button[type="submit"], /* Скрываем кнопку типа сабмит */
.header-search input[type="submit"] {
  /* Скрываем кнопку-инпут */
  display: none; /* Элемент полностью удаляется из верстки */
}

/* Скрытие дублей навигации родительской темы */
body.home .storefront-primary-navigation {
  /* На главной странице */
  display: none !important; /* Принудительно скрываем стандартное меню Storefront */
}

/* ---------- Front page hero ---------- */ /* Секция с большим баннером */
.hero {
    background-image: url(/wp-content/themes/surprissa-dev/images/logo.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    width: 100%;
    aspect-ratio: 6; /* Пропорции изображения */
    height: auto; /* Высота подстроится автоматически */
}

/* ---------- Front page products ---------- */ /* Секция товаров на главной */
.home-products {
  /* Общий контейнер */
  padding: 26px 0 60px; /* Поля: сверху 26, снизу 60 */
}

.home-products__inner {
  /* Ограничитель ширины */
  max-width: 1200px; /* Максимум 1200px */
  margin: 0 auto; /* Центровка */
  padding: 0 20px; /* Боковые поля */
}

.home-products__title {
  /* Заголовок секции товаров */
  margin: 0 0 14px; /* Отступ снизу 14px */
  font-size: clamp(24px, 2.4vw, 34px); /* Адаптивный размер */
}

/* ---------- Home: подарок недели + новинки ---------- */ /* Секция Featured */
.home-featured {
  /* Контейнер */
  padding: 24px 0 32px; /* Поля */
}

.home-featured__inner {
  /* Внутренняя сетка */
  width: 100%; /* На всю ширину */
  max-width: 1200px; /* Ограничитель */
  margin: 0 auto; /* По центру */
  padding: 0 20px; /* Отступы */
  display: grid; /* Используем Grid */
  grid-template-columns: 0% 100%; /* Лево 35% (неделя), право 65% (новинки) */
  gap: 20px; /* Расстояние между блоками */
  align-items: start; /* Колонки начинаются сверху */
}

.home-featured__head {
  /* Шапки блоков внутри секции */
  display: flex; /* Флекс для заголовка и фильтра */
  align-items: center; /* По вертикали */
  justify-content: space-between; /* Разносим заголовок и фильтр */
  gap: 12px; /* Зазор */
  flex-wrap: wrap; /* Перенос на мобилках */
  margin: 0 0 12px; /* Отступ снизу */
  min-height: 44px; /* Чтобы шапки были одной высоты */
}

.home-featured__title {
  /* Текст заголовков Gift/New */
  margin: 0; /* Без отступов */
  font-family: "Cormorant Garamond", Georgia, "Times New Roman", serif; /* Засечки */
  font-size: clamp(1.05rem, 2.2vw, 1.35rem); /* Адаптивный размер */
  font-weight: 600; /* Полужирный */
  line-height: 1.2; /* Интервал */
  text-transform: uppercase; /* Заглавные */
  letter-spacing: 0.06em; /* Разрядка */
}

.home-featured__filter {
  /* Форма фильтра категорий */
  display: flex; /* Флекс */
  align-items: center; /* Центровка */
  gap: 10px; /* Зазор */
  margin: 0; /* Без отступов */
}

.home-featured__label {
  /* Текст "Category" */
  font-size: 11px; /* Мелкий */
  letter-spacing: 0.08em; /* Разрядка */
  text-transform: uppercase; /* Заглавные */
  color: var(--muted); /* Серый */
  white-space: nowrap; /* Запрет переноса слова */
}

.home-featured__filter select {
  /* Поле выбора категории */
  height: 38px; /* Высота */
  border-radius: 999px; /* Овал */
  border: 1px solid var(--line); /* Граница */
  padding: 0 14px; /* Поля */
  background: #fff; /* Фон */
  font-size: 12px; /* Шрифт */
}

.home-featured__card, /* Белые плашки под товары */
.home-featured__grid {
  /* Белые плашки под сетку */
  background: #fff; /* Фон */
  border: 1px solid var(--line); /* Граница */
  border-radius: calc(var(--radius) + 4px); /* Скругление */
  box-shadow: var(--shadow-soft); /* Мягкая тень */
  padding: 14px; /* Внутренние поля */
  min-width: 0; /* Защита от расширения */
}

.home-featured__empty {
  /* Текст, если товаров нет */
  color: var(--muted); /* Серый */
  font-size: 14px; /* Шрифт */
  line-height: 1.5; /* Интервал */
}

.home-featured__card .woocommerce ul.products, /* Убираем отступы у списков товаров внутри блоков */
.home-featured__grid .woocommerce ul.products {
  margin: 0; /* Ноль */
}

.home-featured__card .woocommerce ul.products li.product, /* Снимаем тени с товаров внутри этих блоков */
.home-featured__grid .woocommerce ul.products li.product {
  box-shadow: none; /* Убираем, так как тень уже есть у контейнера */
}

@media (max-width: 900px) {
  /* Планшетный режим для Featured */
  .home-featured__inner {
    /* Сетка блоков */
    grid-template-columns: 1fr; /* Теперь блоки один под другим (в одну колонку) */
  }
}

/* WooCommerce: кнопки */
.woocommerce a.button, /* Ссылка как кнопка */
.woocommerce button.button, /* Кнопка */
.woocommerce input.button, /* Инпут как кнопка */
.woocommerce #respond input#submit, /* Кнопка отправки комментария */
button, /* Глобально все кнопки */
input[type="submit"] {
  /* Глобально все сабмиты */
  border-radius: 999px; /* Полностью круглые края */
  padding: 0.95rem 1.25rem; /* Большие поля для удобства нажатия */
  border: 1px solid transparent; /* Убираем стандартную рамку */
  background: linear-gradient(90deg, var(--pink), var(--violet)); /* Красивый градиент Розовый -> Фиолетовый */
  color: #fff; /* Белый текст */
  font-weight: 700; /* Жирный текст */
  box-shadow: var(--shadow-soft); /* Тень */
  transition:
    filter 0.15s ease,
    transform 0.15s ease; /* Анимация нажатия */
}

.woocommerce a.button:hover, /* Эффект при наведении */
.woocommerce button.button:hover,
.woocommerce input.button:hover {
  filter: saturate(1.05) brightness(0.98); /* Увеличиваем насыщенность и чуть затемняем */
  transform: translateY(-1px); /* Подпрыгивание вверх */
}

.woocommerce a.button.alt, /* Главные кнопки (Add to cart) */
.woocommerce button.button.alt,
.woocommerce input.button.alt {
  background: var(--text); /* Делаем их темными (черными) для акцента */
}

.woocommerce ul.products li.product, /* Карточка товара в списке */
.woocommerce-page ul.products li.product {
  background: var(--card); /* Белый фон */
  border: 1px solid rgba(233, 229, 223, 0.85); /* Мягкая рамка */
  border-radius: calc(var(--radius) + 8px); /* Увеличенное скругление */
  overflow: hidden; /* Обрезаем картинку по углам рамки */
  box-shadow: 0 8px 32px rgba(20, 19, 22, 0.08); /* Более глубокая тень */
  transition:
    transform 0.3s cubic-bezier(0.4, 0, 0.2, 1),
    box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1),
    border-color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  display: flex;
  flex-direction: column;
  position: relative;
  z-index: 1;
  height: 100%;
}

.woocommerce ul.products li.product:hover, /* При наведении на товар */
.woocommerce-page ul.products li.product:hover {
  transform: translateY(-6px); /* Всплытие */
  box-shadow: 0 20px 48px rgba(20, 19, 22, 0.14), 0 12px 24px rgba(139, 106, 217, 0.12); /* Многослойная тень */
  border-color: rgba(139, 106, 217, 0.3);
  z-index: 2;
}

.woocommerce ul.products li.product a img {
  /* Картинка товара */
  width: 100%;
  height: 280px;
  object-fit: cover;
  display: block;
  border-bottom: 1px solid var(--line);
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
}

.woocommerce ul.products li.product:hover a img {
  transform: scale(1.06);
}

.woocommerce ul.products li.product a img::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(139, 106, 217, 0.08);
  opacity: 0;
  transition: opacity 0.3s ease;
}

.woocommerce ul.products li.product:hover a img::after {
  opacity: 1;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
  /* Заголовок товара */
  font-family:
    Inter,
    system-ui,
    -apple-system,
    "Segoe UI",
    Roboto,
    Arial,
    sans-serif; /* Без засечек */
  font-size: 15px; /* Немного больше */
  line-height: 1.5;
  font-weight: 700; /* Жирный */
  letter-spacing: 0.01em; /* Интервал */
  color: var(--text);
  padding: 14px 16px 0; /* Отступы внутри карточки */
  margin: 0;
  height: 54px; /* Фиксированная высота для единообразия */
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  transition: color 0.3s ease;
}

.woocommerce ul.products li.product:hover .woocommerce-loop-product__title {
  color: var(--violet);
}

.woocommerce ul.products li.product .price {
  /* Цена товара */
  color: var(--gold); /* Золотой цвет для выделения цены */
  font-weight: 800; /* Очень жирный */
  font-size: 1.2rem;
  padding: 10px 16px 10px; /* Отступы */
  display: flex;
  align-items: center;
  gap: 8px;
  line-height: 1.2;
  min-height: 40px;
}

.woocommerce span.onsale {
  /* Ярлык "Распродажа" */
  background: linear-gradient(135deg, var(--pink), var(--violet)); /* Градиент вместо сплошного цвета */
  color: #fff; /* Белый текст */
  border-radius: 999px; /* Круглый */
  padding: 0.6rem 1.2rem; /* Увеличенные поля */
  font-weight: 800; /* Очень жирный */
  min-height: auto; /* Высота по тексту */
  line-height: 1; /* Интервал */
  font-size: 13px;
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 10;
  transform: rotate(-3deg);
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s ease;
  box-shadow: 0 8px 20px rgba(139, 106, 217, 0.3);
  letter-spacing: 0.5px;
}

.woocommerce ul.products li.product:hover .onsale {
  transform: rotate(-3deg) scale(1.08);
  box-shadow: 0 12px 30px rgba(139, 106, 217, 0.4);
}

/* Формы ввода */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
textarea,
select,
.woocommerce input.input-text,
.woocommerce textarea {
  background: #fff; /* Белый фон */
  border: 1px solid var(--line); /* Граница */
  border-radius: 12px; /* Скругление */
  padding: 0.85rem 1rem; /* Большие поля */
  outline: none; /* Убираем стандартный контур */
}

input:focus,
textarea:focus,
select:focus {
  /* При клике в поле */
  border-color: rgba(139, 106, 217, 0.6); /* Фиолетовая граница */
  box-shadow: 0 0 0 4px rgba(139, 106, 217, 0.12); /* Фиолетовое свечение */
}

.woocommerce-message, /* Сообщения об успехе (товар добавлен) */
.woocommerce-info {
  /* Инфо-сообщения */
  border-top-color: var(--gold); /* Золотая полоска сверху */
}

/* ---------- WooCommerce layout polish (Trendy Storefront) ---------- */
.site-content, /* Основной контент страницы */
#content {
  background: transparent; /* Прозрачный фон, чтобы видеть общий фон сайта */
}



.woocommerce .woocommerce-breadcrumb {
  /* Хлебные крошки */
  color: var(--muted); /* Серый цвет */
  font-size: 12px; /* Мелкий */
  letter-spacing: 0.06em; /* Разрядка */
  text-transform: uppercase; /* Заглавные */
  margin: 18px 0 24px; /* Отступы */
}

.woocommerce .woocommerce-breadcrumb a {
  /* Ссылки в крошках */
  color: inherit; /* Наследуют серый цвет */
  text-decoration: none; /* Без подчеркивания */
}
.woocommerce .woocommerce-breadcrumb a:hover {
  /* Наведение в крошках */
  color: var(--violet); /* Становятся фиолетовыми */
}

.woocommerce ul.products {
  /* Сетка каталога */
  margin-top: 14px; /* Отступ сверху */
  gap: 18px; /* Расстояние между товарами */
}

.woocommerce ul.products li.product {
  /* Товар в каталоге */
  padding-bottom: 14px; /* Отступ снизу под кнопкой */
}

.woocommerce ul.products li.product .button {
  /* Кнопка в карточке товара */
  margin: 8px 16px 14px;
  width: calc(100% - 32px); /* Ширина на всю карточку минус отступы */
  text-align: center; /* Текст по центру */
  border-radius: 999px;
  padding: 0.85rem 0;
  background: linear-gradient(135deg, var(--pink), var(--violet));
  color: #fff;
  border: none;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  overflow: hidden;
  font-weight: 700;
  letter-spacing: 0.5px;
  box-shadow: 0 6px 16px rgba(139, 106, 217, 0.2);
  min-height: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: auto;
}

.woocommerce ul.products li.product .button::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.25), transparent);
  transition: left 0.5s;
}

.woocommerce ul.products li.product .button:hover::before {
  left: 100%;
}

.woocommerce ul.products li.product .button:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 30px rgba(139, 106, 217, 0.35);
  background: linear-gradient(135deg, var(--violet), var(--pink));
}

.woocommerce ul.products li.product .star-rating {
  /* Рейтинг (звезды) */
  margin: 6px 16px 0; /* Отступы */
  font-size: 1.1rem;
  color: var(--gold);
  min-height: 24px;
  display: flex;
  align-items: center;
}

.woocommerce ul.products li.product .price del {
  /* Старая цена (перечеркнутая) */
  opacity: 0.65; /* Полупрозрачная */
  font-weight: 600; /* Полужирная */
}

/* Страница одиночного товара */
.woocommerce div.product {
  background: transparent; /* Без фона */
}

.woocommerce div.product .product_title {
  /* Название товара */
  font-family: "Cormorant Garamond", Georgia, "Times New Roman", serif; /* Засечки */
  font-weight: 700; /* Жирный */
  font-size: clamp(28px, 3vw, 42px); /* Адаптивный размер */
  line-height: 1.06; /* Плотный интервал */
  margin-bottom: 10px; /* Отступ снизу */
}

.woocommerce div.product p.price, /* Цена на странице товара */
.woocommerce div.product span.price {
  font-size: 18px; /* Размер */
  font-weight: 800; /* Очень жирный */
  color: var(--text); /* Черный */
  margin: 12px 0 18px; /* Отступы */
}

.woocommerce div.product .woocommerce-product-details__short-description {
  /* Краткое описание */
  color: var(--muted); /* Серый */
  font-size: 15px; /* Размер */
}

.woocommerce div.product form.cart {
  /* Блок покупки (цена + кнопка) */
  margin-top: 18px; /* Отступ сверху */
  padding: 16px; /* Поля внутри */
  border: 1px solid var(--line); /* Рамка */
  border-radius: var(--radius); /* Скругление */
  background: rgba(255, 255, 255, 0.72); /* Полупрозрачный белый */
  backdrop-filter: blur(10px); /* Размытие фона под блоком */
  -webkit-backdrop-filter: blur(10px); /* Размытие для Safari */
  box-shadow: var(--shadow-soft); /* Мягкая тень */
}

.woocommerce div.product form.cart .quantity .qty {
  /* Поле количества */
  width: 92px; /* Ширина */
  height: 44px; /* Высота */
  border-radius: 999px; /* Круглое */
  border: 1px solid var(--line); /* Рамка */
  padding: 0 14px; /* Поля */
}

.woocommerce div.product form.cart .single_add_to_cart_button {
  /* Кнопка "В корзину" */
  width: 100%; /* На всю ширину блока */
  padding: 1rem 1.25rem; /* Поля */
  font-size: 14px; /* Шрифт */
  letter-spacing: 0.04em; /* Разрядка */
  text-transform: uppercase; /* Заглавные */
}

.woocommerce div.product .product_meta {
  /* Категории, артикул под кнопкой */
  margin-top: 18px; /* Отступ */
  color: var(--muted); /* Серый */
  font-size: 13px; /* Мелкий */
}

.woocommerce div.product .woocommerce-tabs ul.tabs {
  /* Вкладки (Описание, Отзывы) */
  padding-left: 0; /* Без отступа слева */
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
  /* Заголовок вкладки */
  border: 0; /* Без рамок */
  background: transparent; /* Без фона */
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  /* Ссылка во вкладке */
  font-weight: 700; /* Жирный */
  letter-spacing: 0.06em; /* Разрядка */
  text-transform: uppercase; /* Заглавные */
  font-size: 12px; /* Мелкий */
  color: var(--muted); /* Серый */
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
  /* Активная вкладка */
  color: var(--text); /* Черный текст */
}

.woocommerce div.product .woocommerce-tabs .panel {
  /* Контент внутри вкладки */
  background: #fff; /* Белый фон */
  border: 1px solid var(--line); /* Рамка */
  border-radius: var(--radius); /* Скругление */
  padding: 18px 18px 6px; /* Поля */
  box-shadow: none; /* Без тени */
}

/* Корзина */
.woocommerce-cart .woocommerce {
  background: #fff; /* Белый фон всей страницы корзины */
  border: 1px solid var(--line); /* Рамка */
  border-radius: var(--radius); /* Скругление */
  box-shadow: var(--shadow-soft); /* Тень */
  padding: 18px; /* Внутренние поля */
}

.woocommerce-cart table.cart {
  /* Таблица товаров в корзине */
  border-collapse: separate; /* Раздельные границы для скруглений */
  border-spacing: 0; /* Без зазоров между ячейками */
}

.woocommerce-cart table.cart th {
  /* Заголовки таблицы */
  font-size: 12px; /* Мелкий */
  letter-spacing: 0.08em; /* Разрядка */
  text-transform: uppercase; /* Заглавные */
  color: var(--muted); /* Серый */
}

.woocommerce-cart table.cart td, /* Ячейки таблицы */
.woocommerce-cart table.cart th {
  border-color: var(--line); /* Цвет разделителей в таблице */
}

.woocommerce-cart .cart-collaterals .cart_totals {
  /* Блок "Итого" в корзине */
  background: rgba(251, 250, 247, 0.8); /* Почти белый фон */
  border: 1px solid var(--line); /* Рамка */
  border-radius: var(--radius); /* Скругление */
  padding: 16px; /* Поля */
}

.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
  /* Кнопка перехода к оплате */
  width: 100%; /* На всю ширину */
  padding: 1rem 1.25rem; /* Поля */
  font-size: 14px; /* Шрифт */
  letter-spacing: 0.04em; /* Разрядка */
  text-transform: uppercase; /* Заглавные */
}

/* Чекаут */
.woocommerce-checkout .woocommerce {
  background: #fff; /* Белый фон страницы оплаты */
  border: 1px solid var(--line); /* Рамка */
  border-radius: var(--radius); /* Скругление */
  box-shadow: var(--shadow-soft); /* Тень */
  padding: 18px; /* Поля */
}

.woocommerce form .form-row label {
  /* Подписи полей (Имя, Адрес) */
  font-size: 12px; /* Мелкий */
  letter-spacing: 0.06em; /* Разрядка */
  text-transform: uppercase; /* Заглавные */
  color: var(--muted); /* Серый */
}

.woocommerce form .form-row .select2-selection, /* Поля выбора (Страна) */
.woocommerce form .form-row input.input-text {
  /* Обычные текстовые поля */
  height: 44px; /* Высота */
  border-radius: 12px; /* Скругление */
  border-color: var(--line); /* Цвет рамки */
}

.woocommerce form .form-row textarea {
  /* Поле примечаний к заказу */
  min-height: 120px; /* Минимальная высота */
}

/* === АДАПТИВНОСТЬ ДЛЯ ПЛАНШЕТОВ === */
@media (max-width: 768px) {
  /* Экран меньше 768px */
  .search-corner {
    /* Поиск в углу */
    width: 200px; /* Уменьшаем ширину */
    top: 15px; /* Сдвигаем */
    right: 15px; /* Сдвигаем */
  }
}
