/** Shopify CDN: Minification failed

Line 135:13 Expected identifier but found whitespace
Line 135:26 Unexpected "!"

**/
/* =========================
   SUAVITE - Variant 3 (Premium Black)
   Works for Wookiee: wrapper + inner button
   ========================= */

/* ---------- FIX: remove "button inside button" for ADD TO CART ---------- */

/* Внутренности add-to-cart НЕ должны иметь свой фон/рамку/паддинги */
.tt-product .thumbprod-button-bg.tt-btn-addtocart a,
.tt-product .thumbprod-button-bg.tt-btn-addtocart button,
.tt-product .thumbprod-button-bg.tt-btn-addtocart span,
.tt-product .thumbprod-button-bg.addtocart-item-js a,
.tt-product .thumbprod-button-bg.addtocart-item-js button,
.tt-product .thumbprod-button-bg.addtocart-item-js span {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;

  color: inherit !important;
  fill: currentColor !important;
  line-height: 1.1 !important;
}

/* Чтобы кликабельная зона была нормальная */
.tt-product .thumbprod-button-bg.tt-btn-addtocart,
.tt-product .thumbprod-button-bg.addtocart-item-js{
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}


/* ---------- GIFT BUTTON (outline, full size, no inner button) ---------- */

/* Внешний контейнер = сама кнопка */
.tt-product .thumbprod-button-bg.givy_send_as_gift_button{
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  width: 100% !important;
  min-height: 44px !important;
  padding: 10px 18px !important;

  background: transparent !important;
  background-image: none !important;
  border: 1px solid rgb(0 0 0 / 55%) !important;
  border-radius: 14px !important;
  box-shadow: none !important;

  font-size: 85% !important; /* -15% */
  font-weight: 400 !important;
  letter-spacing: 0.03em !important;
  color: rgb(0 0 0 / 88%) !important;

  margin-top: 10px !important; /* расстояние от верхней кнопки */
}

/* Внутренние элементы НЕ должны выглядеть как отдельная кнопка */
.tt-product .thumbprod-button-bg.givy_send_as_gift_button a,
.tt-product .thumbprod-button-bg.givy_send_as_gift_button button,
.tt-product .thumbprod-button-bg.givy_send_as_gift_button span{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;

  color: inherit !important;
  fill: currentColor !important;
  line-height: 1.1 !important;
}

/* Hover */
.tt-product .thumbprod-button-bg.givy_send_as_gift_button:hover{
  background-color: rgb(0 0 0 / 4%) !important;
  border-color: rgb(0 0 0 / 65%) !important;
}
/* ============================= */
/* ADD TO CART — single clean button */
/* ============================= */

/* Внешняя кнопка */
.tt-product .thumbprod-button-bg.tt-btn-addtocart:not(.givy_send_as_gift_button),
.tt-product .thumbprod-button-bg.addtocart-item-js:not(.givy_send_as_gift_button) {

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

  background: #000 !important;
  border: 1px solid #000 !important;
  border-radius: 12px !important;

  padding: 9px 16px !important;
font-size: 13px !important;

  margin: 0 auto !important;

  color: #fff !important;
}

/* Текст и иконки внутри — БЕЗ своих фонов */
.tt-product .thumbprod-button-bg.tt-btn-addtocart *,
.tt-product .thumbprod-button-bg.addtocart-item-js * {
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;

  color: inherit !important;
  fill: currentColor !important;

  padding: 0 !important;
  margin: 0 !important;
}

/* Hover ТОЛЬКО для add to cart */
.tt-product .thumbprod-button-bg.tt-btn-addtocart:hover,
.tt-product .thumbprod-button-bg.addtocart-item-js:hover {
  background: #000 !important;
  border-color: #000 !important;
}
/* ============================= */
/* GIFT BUTTON — restore outline (NOT black) */
/* ============================= */

  background: transparent !important;
  border: 1px solid rgba(0,0,0,0.35) !important;
  color: rgba(0,0,0,0.75) !important;

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

  border-radius: 12px !important;
  padding: 12px 20px !important;
  margin: 10px auto 0 !important;

  box-shadow: none !important;
}

/* текст и иконки внутри gift */
.tt-product .thumbprod-button-bg.givy_send_as_gift_button * {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;

  color: inherit !important;
  fill: currentColor !important;

  padding: 0 !important;
  margin: 0 !important;
}

.tt-product .thumbprod-button-bg.givy_send_as_gift_button:hover {
  background: rgba(0,0,0,0.04) !important;
  border-color: rgba(0,0,0,0.45) !important;
}
/* =========================================
   PRODUCT GRID — LUXURY ALIGN (NO CROP)
   ========================================= */

@media (min-width: 769px) {
  .tt-product .tt-image-box .tt-img {
    aspect-ratio: 4 / 5;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
  }

  .tt-product .tt-image-box .tt-img img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
  }
}

@media (max-width: 768px) {
  .tt-product .tt-image-box .tt-img {
    aspect-ratio: 4 / 5;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
  }

  .tt-product .tt-image-box .tt-img img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
  }
}
/* =========================================
   COLLECTION GRID IMAGES — SAME HEIGHT (NO CROP)
   Works with: .tt-product .tt-image-box .tt-img (has inline height)
   ========================================= */

/* фиксируем высоту карточек через ratio и перебиваем inline height */
.tt-product .tt-image-box .tt-img{
  display: block !important;
  width: 100% !important;

  height: auto !important;            /* <-- перебивает style="height: ...px" */
  aspect-ratio: 4 / 5 !important;     /* единая высота карточек */

  background: #fff !important;        /* luxury look */
}

/* заставляем img заполнять контейнер ratio, но без кропа */
.tt-product .tt-image-box .tt-img img{
  width: 100% !important;
  height: 100% !important;            /* <-- ключевой момент */
  object-fit: contain !important;     /* без обрезания */
  display: block !important;
}
/* Hide Shopify missing translation text (search placeholder etc.) */
.translation-missing,
[class*="translation-missing"],
div:has(> .translation-missing) {
  display: none !important;
}
/* Fix: hide 'Translation missing...' inside placeholders */
input::placeholder,
textarea::placeholder {
  opacity: 1;
}

input[placeholder*="Translation missing"]::placeholder,
textarea[placeholder*="Translation missing"]::placeholder {
  color: transparent !important;
}

input[placeholder*="Translation missing"],
textarea[placeholder*="Translation missing"] {
  caret-color: #000; /* курсор виден */
}
/* FIX: hide "Translation missing" text in search header (Wokiee) */
.tt-search__title,
.tt-search-title,
.tt-search-header__title {
  display: none !important;
}
/* Hide wishlist translation missing text */
.wishlist-text,
.tt-wishlist-text,
[class*="wishlist"] span {
  display: none !important;
}
/* FIX: hide wishlist "Translation missing" text on product page */
.template-product
.tt-list-btn
span {
  display: none !important;
}
.template-product
.tt-list-btn
span:contains("Translation missing") {
  display: none !important;
}
/* === FORCE hide Wishlist "Translation missing" text (Wokiee) === */
.tt-list-btn span {
  display: none !important;
}
/* ===== LUXURY TYPOGRAPHY (Ounass style) ===== */

/* Базовый текст */
body,
.product-description,
.tt-product-single-info,
.tt-description,
.tt-listing-info {
  font-weight: 300 !important;
  letter-spacing: 0.02em;
}

/* Названия товаров */
.tt-title,
.tt-product-single-info h1,
.tt-product-single-info h2 {
  font-weight: 300 !important;
  letter-spacing: 0.06em;
  text-transform: none;
}

/* Меню */
.tt-desktop-header,
.tt-menu > li > a {
  font-weight: 300 !important;
  letter-spacing: 0.08em;
}

/* Кнопки */
.tt-btn,
button,
input[type="submit"] {
  font-weight: 300 !important;
  letter-spacing: 0.12em;
}

/* Цены */
.tt-price,
.tt-product-price {
  font-weight: 300 !important;
  letter-spacing: 0.04em;
}
/* ===== Smile launcher text override ===== */

/* Скрываем оригинальный текст */
#smile-ui-lite-launcher span {
    font-size: 0 !important;
}

/* Показываем свой */
#smile-ui-lite-launcher span::after {
    content: "Suavité Circle — Винагороди";
    font-size: 14px;
    letter-spacing: .02em;
}
/* === Suavite: hidden by default, desktop hover, mobile first tap === */

.tt-product { position: relative; }

/* Скрываем ОБЕ кнопки по умолчанию:
   1) Add to cart: .thumbprod-button-bg.tt-btn-addtocart
   2) Gift:       .thumbprod-button-bg.givy_send_as_gift_button
*/
.tt-product .thumbprod-button-bg.tt-btn-addtocart,
.tt-product .thumbprod-button-bg.givy_send_as_gift_button{
  opacity: 0;
  visibility: hidden;
  transform: translateY(15px);
  transition: opacity .25s ease, transform .25s ease, visibility .25s ease;
  pointer-events: none;
}

/* Desktop — показываем при наведении */
@media (hover: hover) and (pointer: fine){
  .tt-product:hover .thumbprod-button-bg.tt-btn-addtocart,
  .tt-product:hover .thumbprod-button-bg.givy_send_as_gift_button{
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
  }
}

/* Mobile — показываем по первому тапу (класс добавляет JS) */
@media (hover: none) and (pointer: coarse){
  .tt-product.is-touch-open .thumbprod-button-bg.tt-btn-addtocart,
  .tt-product.is-touch-open .thumbprod-button-bg.givy_send_as_gift_button{
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
  }
}
/* ======================================
   Smile — перевод Ways to earn / redeem
   ====================================== */

/* Ways to earn */
.smile-panel .card-list-item:nth-of-type(1) .list-item-title{
    font-size:0 !important;
}
.smile-panel .card-list-item:nth-of-type(1) .list-item-title::after{
    content:"Нарахування балів";
    font-size:16px;
    font-weight:600;
    letter-spacing:0.04em;
}

/* Ways to redeem */
.smile-panel .card-list-item:nth-of-type(2) .list-item-title{
    font-size:0 !important;
}
.smile-panel .card-list-item:nth-of-type(2) .list-item-title::after{
    content:"Обмін балів";
    font-size:16px;
    font-weight:600;
    letter-spacing:0.04em;
}
/* =========================================================
   MOBILE: hide catalog buttons (Farfetch-like)
   ========================================================= */
@media (hover: none) and (pointer: coarse){

  /* Скрываем обе кнопки в карточке товара */
  .tt-product .thumbprod-button-bg.tt-btn-addtocart,
  .tt-product .thumbprod-button-bg.givy_send_as_gift_button{
    display: none !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* На всякий случай: если где-то остаётся эффект "открытия" */
  .tt-product.is-touch-open .thumbprod-button-bg.tt-btn-addtocart,
  .tt-product.is-touch-open .thumbprod-button-bg.givy_send_as_gift_button{
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }
}
/* =========================================================
   MOBILE: tighter luxury grid (bigger images, smaller gaps)
   ========================================================= */
@media (max-width: 768px){

  /* 1) Уменьшаем боковые поля контейнера */
  .container,
  .container-fluid,
  .tt-container{
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  /* 2) Уменьшаем расстояние между колонками (часто Wokiee/Bootstrap row/col) */
  .row,
  .tt-row,
  .tt-product-listing .row{
    margin-left: -6px !important;
    margin-right: -6px !important;
  }

  .row > [class*="col-"],
  .tt-product-listing [class*="col-"]{
    padding-left: 6px !important;
    padding-right: 6px !important;
  }

  /* 3) Меньше расстояние между рядами товаров */
  .tt-product{
    margin-bottom: 14px !important;
  }

  /* 4) Убираем лишний воздух вокруг изображения */
  .tt-product .tt-image-box,
  .tt-product .tt-image-box .tt-img{
    margin: 0 !important;
  }

  /* 5) Чуть компактнее текст под фото (чтобы фото выглядело крупнее) */
  .tt-product .tt-description{
    padding-top: 10px !important;
  }
  .tt-product .tt-description .tt-title{
    margin-top: 0 !important;
    margin-bottom: 6px !important;
  }
  .tt-product .tt-description .tt-price{
    margin-top: 0 !important;
  }
}
/* =========================================================
   MOBILE LUX GRID — Wokiee (.tt-product-listing / .tt-col-item)
   Bigger images, smaller gaps (Farfetch-like)
   ========================================================= */

/* 0) Чуть уменьшаем боковые поля страницы */
@media (max-width: 768px){
  .container, .tt-container, .container-fluid{
    padding-left: 8px !important;
    padding-right: 8px !important;
  }
}

/* 1) Главный источник "воздуха" у вас — .tt-product-listing > .tt-col-item */
@media (max-width: 1024px){

  /* Убираем принудительный большой отступ между карточками */
  .tt-product-listing > .tt-col-item{
    margin-top: 12px !important;     /* было 40px в теме */
    padding-left: 6px !important;    /* было 10px */
    padding-right: 6px !important;   /* было 10px */
  }

  /* Если тема добавляет общий padding снизу/сверху контейнера листинга */
  .tt-product-listing{
    margin-top: 0 !important;
  }

  /* Уменьшаем "низ" карточки, чтобы фото выглядело больше */
  .tt-product{
    margin-bottom: 0 !important;
  }

  /* Убираем лишние отступы вокруг картинки */
  .tt-product .tt-image-box,
  .tt-product .tt-image-box .tt-img{
    margin: 0 !important;
  }

  /* Чуть плотнее подпись под фото */
  .tt-product .tt-description{
    padding-top: 8px !important;
  }
}

/* 2) Ещё плотнее именно на телефонах */
@media (max-width: 575px){
  .tt-product-listing > .tt-col-item{
    margin-top: 10px !important;
    padding-left: 5px !important;
    padding-right: 5px !important;
  }
}
/* =========================================================
   MOBILE: hide action icons under product (quickview/wishlist/compare)
   ========================================================= */
@media (max-width: 768px){

  /* Самый частый контейнер этих иконок в Wokiee */
  .tt-product .tt-row-btn,
  .tt-product .tt-product__buttons,
  .tt-product .tt-product-buttons,
  .tt-product .tt-buttons,
  .tt-product [class*="row-btn"],
  .tt-product [class*="product-buttons"]{
    display: none !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* На случай, если иконки идут отдельными кнопками без общего контейнера */
  .tt-product a[class*="quickview"],
  .tt-product button[class*="quickview"],
  .tt-product a[class*="wishlist"],
  .tt-product button[class*="wishlist"],
  .tt-product a[class*="compare"],
  .tt-product button[class*="compare"]{
    display: none !important;
  }
}
/* =========================================================
   MOBILE: tighter product grid (Farfetch style)
   ========================================================= */

@media (max-width: 1024px){
  .tt-product-listing > .tt-col-item{
    margin-top: 8px !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
  }
}

@media (max-width: 575px){
  .tt-product-listing > .tt-col-item{
    margin-top: 6px !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
  }
}
/* =========================================================
   MOBILE LUX: tighten cards (Farfetch-like)
   - hide size chips
   - remove reserved spacing under image/description
   - keep grid tight
   ========================================================= */

@media (max-width: 768px){

  /* 1) УБИРАЕМ размеры в листинге (главный источник "воздуха") */
  .tt-product .tt-options-swatch,
  .tt-product .tt-options-swatch ul,
  .tt-product .tt-options-swatch li,
  .tt-product [class*="options-swatch"],
  .tt-product [class*="swatch"]{
    display: none !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* 2) УБИРАЕМ любые action-строки под товаром (если где-то остались) */
  .tt-product .tt-row-btn,
  .tt-product [class*="row-btn"],
  .tt-product [class*="product-buttons"]{
    display: none !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* 3) Поджимаем "низ" карточки: меньше вертикальных отступов */
  .tt-product .tt-description{
    padding-top: 8px !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
  }

  .tt-product .tt-description .tt-title{
    margin: 0 0 6px 0 !important;
    line-height: 1.25 !important;
  }

  .tt-product .tt-description .tt-price{
    margin: 0 !important;
    padding: 0 !important;
  }

  /* 4) Сетка Wokiee: уменьшаем боковые и вертикальные интервалы */
  .tt-product-listing > .tt-col-item{
    margin-top: 4px !important;     /* перебиваем темы */
    padding-left: 3px !important;
    padding-right: 3px !important;
  }
}

@media (max-width: 575px){
  .tt-product-listing > .tt-col-item{
    margin-top: 4px !important;
    padding-left: 3px !important;
    padding-right: 3px !important;
  }
}
/* =========================================================
   MOBILE: bigger/taller product images WITHOUT CROP
   (Farfetch/Spazio feel, but keep full image)
   ========================================================= */

@media (max-width: 575px){

  /* Делаем “окно” под фото выше => на экране будет ~2 ряда, а не 2.5 */
  .tt-product .tt-image-box .tt-img{
    aspect-ratio: 2 / 3 !important;   /* ключевой параметр */
    height: auto !important;
  }

  /* Фото всегда целиком, без обрезки */
  .tt-product .tt-image-box .tt-img img{
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;   /* важно: без кропа */
    display: block !important;
  }
}
/* =========================================
   MOBILE LUX GRID — одинаковая высота фото
   Без обрезки (contain)
========================================= */

@media (max-width: 768px) {

  /* Фиксированная высота контейнера фото */
  .tt-product .tt-image-box {
    height: 62vw !important; /* можно менять 60–70 */
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    overflow: hidden;
  }

  /* Само изображение */
  .tt-product .tt-image-box img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
  }

}
/* =========================================================
   MOBILE LUX FINISH — aligned price baseline WITHOUT text truncation
   (title keeps full text; we reserve equal space for 3 lines)
   ========================================================= */

@media (max-width: 575px){

  /* Делаем описание "колонкой" */
  .tt-product .tt-description{
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;              /* аккуратный “воздух” */
    padding-top: 10px !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
  }

  /* Название: НЕ режем, но задаём одинаковую высоту под 3 строки */
  .tt-product .tt-description .tt-title{
    margin: 0 !important;
    line-height: 1.25 !important;
    min-height: calc(1.25em * 3) !important; /* 3 строки, текст НЕ обрезается */
  }

  /* Цена: уезжает вниз в пределах одинакового блока */
  .tt-product .tt-description .tt-price{
    margin-top: auto !important;
    padding-top: 0 !important;
  }

  /* Чуть компактнее старую/новую цену (если нужно) */
  .tt-product .tt-price,
  .tt-product .tt-price *{
    line-height: 1.2 !important;
  }
}
/* ==========================================================
   MOBILE FINAL – tighter rows + less side gutters (NO CROP)
   Put this block at the VERY END of suavite-buttons.css
========================================================== */

@media (max-width: 575px){

  /* tighter grid: row gap + side gutters */
  .tt-product-listing > .tt-col-item,
  .tt-product-listing.row > .tt-col-item,
  .tt-product-listing.tt-col-two > .tt-col-item,
  .tt-product-listing.tt-col-three > .tt-col-item{
    margin-top: 6px !important;     /* <-- это “стрелочки” между рядами */
    padding-left: 3px !important;
    padding-right: 3px !important;
  }

  /* на всякий случай: если тема добавляет отступы контейнеру листинга */
  .tt-product-listing{
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  /* чуть плотнее блок под фото (название/цена) */
  .tt-product .tt-description{
    padding-top: 6px !important;
  }

  /* убираем лишний нижний отступ у “окна” картинки */
  .tt-product .tt-image-box,
  .tt-product .tt-image-box .tt-img{
    margin-bottom: 0 !important;
  }
}