/* === Base === */

/* Typography. */

@font-face {
  font-family: 'VisueltPro';
  src: url("../fonts/VisueltPro/VisueltPro-Bold.eot");
  src: url("../fonts/VisueltPro/VisueltPro-Bold.eot?#iefix")format("embedded-opentype"),
		 url("../fonts/VisueltPro/VisueltPro-Bold.woff")format("woff"),
		 url("../fonts/VisueltPro/VisueltPro-Bold.ttf")format("truetype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: 'VisueltPro';
  src: url("../fonts/VisueltPro/VisueltPro-Medium.eot");
  src: url("../fonts/VisueltPro/VisueltPro-Medium.eot?#iefix")format("embedded-opentype"),
		 url("../fonts/VisueltPro/VisueltPro-Medium.woff")format("woff"),
		 url("../fonts/VisueltPro/VisueltPro-Medium.ttf")format("truetype");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: 'VisueltPro';
  src: url("../fonts/VisueltPro/VisueltPro-Regular.eot");
  src: url("../fonts/VisueltPro/VisueltPro-Regular.eot?#iefix")format("embedded-opentype"),
		 url("../fonts/VisueltPro/VisueltPro-Regular.woff")format("woff"),
		 url("../fonts/VisueltPro/VisueltPro-Regular.ttf")format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: 'VisueltPro';
  src: url("../fonts/VisueltPro/VisueltPro-Italic.eot");
  src: url("../fonts/VisueltPro/VisueltPro-Italic.eot?#iefix")format("embedded-opentype"),
		 url("../fonts/VisueltPro/VisueltPro-Italic.woff")format("woff"),
		 url("../fonts/VisueltPro/VisueltPro-Italic.ttf")format("truetype");
  font-style: italic;
  font-weight: 400;
  font-display: swap;
}

.title * {
  font: inherit;
}

.fw-bold {
  font-weight: 700;
}

.fw-medium {
  font-weight: 500;
}

.fs-h1,
h1 {
  font-size: var(--h1);
}

.fs-h2,
h2 {
  font-size: var(--h2);
}

.fs-h3,
h3 {
  font-size: var(--h3);
}

.fs-h4,
h4 {
  font-size: var(--h4);
}

.fs-h5,
h5 {
  font-size: var(--h5);
}

.fs-body {
  font-size: var(--body);
}

.fs-small {
  font-size: var(--small);
}

.fs-tiny {
  font-size: var(--tiny);
}

/* Typography. */

/* Root. */

:root {
  /* scrollbar. */
  --scrollbar-size: 3px;
  --scrollbar-color: var(--background);
  --scrollbar-tumb: var(--primary);
  --scrollbar-radius: 2px;
  /* scrollbar. */
  --scroll: 0px;
  --header: 0px;
  --transition-speed: .43s;
  /* icon. */
  --icon-size: 24px;
  /* icon. */
  /* font-size. */
  --h1: clamp(28px, 7vw, 44px);
  --h2: clamp(24px, 6vw, 32px);
  --h3: clamp(20px, 5vw, 28px);
  --h4: clamp(18px, 4.5vw, 24px);
  --h5: clamp(16px, 4vw, 18px);
  --body: 16px;
  --small: 14px;
  --tiny: 12px;
  --family: 'VisueltPro', sans-serif;
  /* font-size. */
  /* color. */
  --color: var(--black);
  --primary: #c80d22;
  --black: #000;
  --white: #fff;
  --background: #f7f7ee;
  --decorative: #522b2b;
  --decorative-70: #522b2bb3;
  --close: #00000080;
  --stars: #ffd53c;
  --incorrect: #d62b2b;
  --correct: #127c16;
  --correct-bg: rgba(18, 124, 22, 0.15);
  --gray-icon: #8b8b8b;
  --gray-text: #7f7f7f;
  --gray-baclground: #F1EFEF;
  --disabled: #dbdbdb;
  --border: #dbdbdb;
  --background-pop-up: #00000066;
  /* color. */
  /* btn.*/
  --btn-min-width: 209px;
  --btn-height: 48px;
  --btn-inner: 20px;
  --btn-color: var(--white);
  --btn-font: var(--h5);
  --btn-bg: var(--primary);
  --btn-bd_size: 1px;
  --btn-bd_color: var(--btn-bg);
  --btn-lh: 0px;
  /* btn.*/
  /* inner. */
  --gap: 16px;
  --section-gap: clamp(40px, 10vw, 88px);
  --i-56: 56px;
  --i1: 40px;
  --i2: 32px;
  --i3: 24px;
  --i3-5: 20px;
  --i4: 16px;
  --i5: 12px;
  --i6: 8px;
  --bdrs-sm: 8px;
  --bdrs: 12px;
  --bdrs-md: 16px;
  --bdrs-lg: 24px;
  --bdrs-xl: 32px;
  --container-padding: clamp(16px, 5vw, 32px);
  --container-width: 1312px;
  --container-inner: max((100vw - var(--container-width) - var(--scroll)) / 2, var(--container-padding));
  /* inner. */
  /* grid. */
  --grid_2: 2;
  --grid_3: 3;
  --grid_4: 4;
  /* grid. */
}

/* Root. */

/* Null. */

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  display: block;
}

body {
  margin: 0;
  padding: 0;
  color: var(--color);
  font-size: var(--body);
  font-weight: 400;
  font-style: normal;
  line-height: 1.4;
  letter-spacing: -.02em;
  font-family: var(--family);
  background-color: var(--white);
}

img,
svg {
  display: block;
  width: 100%;
  height: auto;
}

a {
  text-decoration: none;
}

li {
  list-style-type: none;
}

input,
button,
textarea {
  display: block;
  font: inherit;
  background-color: transparent;
  border: 0 none;
  box-shadow: none;
  appearance: none;
  outline: none;
  resize: none;
}

button {
  cursor: pointer;
}

input::placeholder,
textarea::placeholder {
  color: var(--color);
  font-family: var(--family);
}

/* Null. */

/* Global. */

.overflow-hidden {
  overflow: hidden;
}

.container {
  width: 100%;
  max-width: calc(var(--container-width) + var(--container-padding) * 2);
  margin-inline: auto;
  padding-inline: var(--container-padding);
}

main section:not(:first-child) {
  margin-top: var(--section-gap);
}

main section:not(:last-child) {
  margin-bottom: var(--section-gap);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 500;
}

[data-bottom] + [data-full],
[data-full] + [data-full] {
  margin-top: calc(var(--section-gap) * -1);
}

section:last-child:not([data-bottom], [data-full]) {
  margin-bottom: var(--section-gap);
}



/* Global. */

/* Grid. Flex. */

[class*=grid] {
  display: grid;
  grid-template-columns: repeat(var(--grid), 1fr);
  grid-gap: var(--gap);
}

.grid-two {
  --grid: var(--grid_2);
}

.grid-three {
  --grid: var(--grid_3);
}

.grid-four {
  --grid: var(--grid_4);
}

[class*=flex] {
  display: flex;
}

[class*=-align_center] {
  align-items: center;
}

[class*=-align_start] {
  align-items: flex-start;
}

[class*=-align_end] {
  align-items: flex-end;
}

[class*=-justify_center] {
  justify-content: center;
}

[class*=-justify_start] {
  justify-content: flex-start;
}

[class*=-justify_end] {
  justify-content: flex-end;
}

[class*=-justify_between] {
  justify-content: space-between;
}

[class*=grid][hidden] {
  display: none;
}

/* Grid. Flex. */

/* === Libs === */

/* Swiper. */

.swiper-pagination {
  --swiper-pagination-bullet-size: clamp(6px, 1.5vw, 12px);
  --swiper-pagination-color: currentColor;
  --swiper-pagination-bullet-inactive-color: currentColor;
  --swiper-pagination-bullet-horizontal-gap: 0px;
  --swiper-pagination-bullet-inactive-opacity: .3;
  display: flex;
  align-items: center;
  justify-content: center;
  grid-gap: 8px;
  -webkit-transform: none;
  -moz-transform: none;
  -ms-transform: none;
  -o-transform: none;
  transform: none;
}

[class*=swiper-button-] {
  position: static;
  width: 44px;
  aspect-ratio: 1/1;
  margin: 0;
  color: inherit;
  border: 1px solid rgba(24, 24, 24, .2);
  border-radius: 50%;
  transform: none;
}

.swiper-button-prev:before {
  transform: rotate(180deg);
}

[class*=swiper-button-]:before {
  content: '';
  width: 24px;
  aspect-ratio: 1/1;
  background-color: currentColor;
  mask-image: url("data:image/svg+xml,%3Csvg width='15' height='15' viewBox='0 0 15 15' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.82812 3.54932L11.7656 7.48682L7.82812 11.4243M11.2187 7.48682L3.23437 7.48682' stroke='%23181818' stroke-width='0.875' stroke-miterlimit='10' stroke-linecap='square'/%3E%3C/svg%3E%0A");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

[class*=swiper-button-]:after {
  content: none;
}

.swiper-button {
  display: flex;
  align-items: center;
  grid-gap: 14px;
}

/* Swiper. */

/* === Elements === */

/* Button. */

.k-button,
.product-footer .added_to_cart,
.modal_form .button,
.single_add_to_cart_button {
  overflow: hidden;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  grid-gap: 10px;
  position: relative;
  min-width: min(var(--btn-min-width), 100%);
  height: var(--btn-height);
  padding: 0 var(--btn-inner) var(--btn-lh);
  color: var(--btn-color);
  font-size: var(--btn-font);
  font-weight: 500;
  text-align: center;
  border: var(--btn-bd_size) solid var(--btn-bd_color);
  background-color: var(--btn-bg);
  border-radius: var(--bdrs);
  cursor: pointer;
  z-index: 1;
  transition: all .43s;
}

.k-button.line {
  min-width: auto;
  height: auto;
  background-color: transparent !important;
  padding: 0;
  font-size: 1rem;
  font-weight: 500;
  color: var(--primary);
  border: 0 none;
  border-bottom: 1px solid currentColor;
  border-radius: 0;
}

.k-button.outline,
.product-footer .added_to_cart {
  --btn-bg: transparent;
  color: var(--btn-bd_color);
}

.k-button.loading {
  opacity: 0.7;
  pointer-events: none;
}

.k-button.added {
  --btn-bg: #2a7d2a;
  --btn-bd_color: #2a7d2a;
}

.k-button-decorative {
  --btn-bg: var(--decorative);
  --btn-bd_color: var(--decorative);
}

.k-button-xl {
  --btn-height: 56px;
}

.k-button[disabled] {
  --btn-bg: var(--disabled);
  --btn-bd_color: var(--disabled);
  cursor: no-drop;
}

/* Button. */

/* Icon. */

[class^=k-icon] {
  display: block;
  flex-shrink: 0;
  width: var(--icon-size);
  min-width: var(--icon-size);
  height: var(--icon-size);
  background-color: var(--icon-color, currentColor);
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.k-icon-add-user {
  mask-image: url("../images/icon/add-user.svg");
}

.k-icon-user {
  mask-image: url("../images/icon/user.svg");
}

.k-icon-cart {
  mask-image: url("../images/icon/cart.svg");
}

.k-icon-arrow-up {
  mask-image: url("../images/icon/arrow-up.svg");
}

.k-icon-arrow-down {
  mask-image: url("../images/icon/arrow-down.svg");
}

.k-icon-arrow-left {
  mask-image: url("../images/icon/arrow-left.svg");
}

.k-icon-arrow-right {
  mask-image: url("../images/icon/arrow-right.svg");
}

.k-icon-close {
  mask-image: url("../images/icon/close.svg");
}

.k-icon-glass {
  mask-image: url("../images/icon/glass.svg");
}

.k-icon-bell {
  mask-image: url("../images/icon/bell.svg");
}

.k-icon-logout {
  mask-image: url("../images/icon/logout.svg");
}

.k-icon-edit {
  mask-image: url("../images/icon/edit.svg");
}

.k-icon-subscription-management {
  mask-image: url("../images/icon/subscription-management.svg");
}

.k-icon-calendar {
  mask-image: url("../images/icon/calendar.svg");
}

.k-icon-email {
  mask-image: url("../images/icon/email.svg");
}

.k-icon-phone {
  mask-image: url("../images/icon/phone.svg");
}

.k-icon-map {
  mask-image: url("../images/icon/map.svg");
}

.k-icon-planet {
  mask-image: url("../images/icon/planet.svg");
}

.k-icon-link {
  mask-image: url("../images/icon/link.svg");
}

.k-icon-user-star {
  mask-image: url("../images/icon/user-star.svg");
}

.k-icon-image-add {
  mask-image: url("../images/icon/image-add.svg");
}

.k-icon-download {
  mask-image: url("../images/icon/download.svg");
}

.k-icon-alert-product {
  mask-image: url("../images/icon/alert-product.svg");
}

.k-icon-alert-calendar {
  mask-image: url("../images/icon/alert-calendar.svg");
}

.k-icon-alert-message {
  mask-image: url("../images/icon/alert-message.svg");
}

.k-icon-check {
  mask-image: url("../images/icon/check.svg");
}

.k-icon-featured {
  mask-image: url("../images/icon/featured.svg");
}

/* Icon. */

/* Input-checkbox. */

.input-checkbox-group {
  display: flex;
  flex-direction: column;
  grid-gap: 12px;
}

.input-checkbox input[type=checkbox] + span {
  --dot-size: 18px;
  position: relative;
  cursor: pointer;
}

.input-checkbox-switch input[type=checkbox] + span {
  --dot-size: 24px;
}

.input-checkbox input[type=checkbox] + span:before:not(:last-child) {
  margin-right: 12px;
}

.input-checkbox input[type=checkbox] + span:before {
  content: '';
  display: block;
  float: left;
  flex-shrink: 0;
  width: var(--dot-size);
  aspect-ratio: 1/1;
  border: 1px solid var(--border);
  border-radius: 2px;
  box-sizing: border-box;
  cursor: pointer;
  transition: box-shadow .43s;
}

.input-checkbox input[type=checkbox]:not([readonly]):checked + span:before {
  box-shadow: inset 0 0 0 3px var(--white), inset 0 0 0 24px var(--primary);
}

.input-checkbox-switch input[type=checkbox] + span:before {
  content: '';
  display: block;
  float: left;
  width: auto;
  height: var(--dot-size);
  aspect-ratio: 42/24;
  background-color: var(--border);
  border-radius: calc(var(--dot-size) / 2);
  box-sizing: border-box;
  cursor: pointer;
  transition: background-color .43s;
}

.input-checkbox-switch input[type=checkbox] + span:after {
  --size: calc(var(--dot-size) * .75);
  content: '';
  position: absolute;
  top: calc(var(--dot-size) / 2 - var(--size) / 2);
  left: calc(var(--dot-size) * .125);
  width: var(--size);
  aspect-ratio: 1/1;
  background-color: var(--white);
  border-radius: 50%;
  transition: transform .43s;
}

.input-checkbox-switch input[type=checkbox]:not([readonly]):checked + span:before {
  background-color: var(--primary);
  box-shadow: none;
}

.input-checkbox input[type=checkbox]:not([readonly]):checked + span:after {
  transform: translateX(var(--size));
}

/* Input-checkbox. */

/* Input-gender. */



.input_gender_wrapper {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  position: relative;
  padding: 2px;
  border-radius: var(--bdrs-sm);
  background-color: rgba(118, 118, 128, 0.12);
}

.input_gender_element span {
  display: flex !important;
  align-items: center !important;
  justify-content: center;
  padding: 0 !important;
  font-size: var(--tiny) !important;
  font-weight: 500;
  height: 32px;
  border-radius: var(--bdrs-sm);
  -webkit-transition: background-color .43s;
  -moz-transition: background-color .43s;
  -ms-transition: background-color .43s;
  -o-transition: background-color .43s;
  transition: background-color .43s;
}

.input_gender_element input:checked + span {
  background-color: var(--white);
}

.input_gender_element span:before {
  content: none !important;
}

/* Input-gender. */

/* Input-image. */

.input-image {
  position: relative;
  width: 98px;
  aspect-ratio: 1/1;
  border-radius: 50%;
}

.input-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  border-radius: 50%;
}

.input-image-icon {
  --icon-size: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  right: 0;
  bottom: 0;
  width: 30px;
  aspect-ratio: 1/1;
  border-radius: 50%;
  background-color: var(--white);
}

/* Input-image. */

/* Input-radio. */

.input-radio-group {
  display: flex;
  flex-direction: column;
  grid-gap: 12px;
}

.input-radio input[type=radio] + span {
  --dot-size: 18px;
  cursor: pointer;
}

.input-radio input[type=radio] + span:before {
  content: '';
  display: block;
  float: left;
  margin-right: 12px;
  width: var(--dot-size);
  margin-top: .15em;
  aspect-ratio: 1/1;
  border: 1px solid var(--border);
  border-radius: 50%;
  box-sizing: border-box;
  cursor: pointer;
  transition: box-shadow .43s, border-color .43s;
}

.input-radio input[type=radio]:not([readonly]):checked + span:before {
  box-shadow: inset 0 0 0 3px var(--white), inset 0 0 0 24px var(--primary);
}

/* Input-radio. */

/* Input. */

.input {
  display: flex;
  flex-direction: column;
  grid-gap: 4px;
  position: relative;
}

.input-wrapper {
  position: relative;
}

.input-label {
  font-size: var(--tiny);
  font-weight: 500;
  color: var(--gray-text);
  text-align: left;
}

.input_error {
  border-color: var(--incorrect) !important;
}

.input_error_message {
  --icon-size: 16px;
  display: flex;
  align-items: center;
  grid-gap: 8px;
  color: var(--incorrect);
  font-size: var(--tiny);
}

.input_error_message:before {
  content: '';
  width: var(--icon-size);
  flex-shrink: 0;
  aspect-ratio: 1/1;
  background-color: var(--icon-color, currentColor);
  mask-image: url("../images/icon/error.svg");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.input-icon {
  pointer-events: none;
  position: absolute;
  top: calc(50% - var(--icon-size) / 2);
  left: 24px;
}

.input-icon + input {
  padding-left: 56px !important;
}

input:not([type=checkbox], [type=radio], [type=submit], [type=range]),
textarea {
  width: 100%;
  min-height: var(--btn-height);
  padding-inline: 24px;
  color: inherit;
  font-size: 1rem;
  font-weight: 400;
  text-overflow: ellipsis;
  border: 1px solid var(--border);
  border-radius: var(--bdrs);
  transition: border-color .43s, color .43s;
}

textarea {
  height: 120px;
  padding-top: 16px;
}

input:not([type=checkbox], [type=radio], [type=submit], [type=range])::placeholder,
textarea::placeholder {
  color: var(--gray-icon);
  text-overflow: ellipsis;
}

input:not([type=checkbox], [type=radio], [type=submit], [type=range], [readonly]):hover,
input:not([type=checkbox], [type=radio], [type=submit], [type=range], [readonly]):focus,
textarea:not([readonly]):hover,
textarea:not([readonly]):focus {
  border-color: currentColor;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type=number] {
  -moz-appearance: textfield;
}

input[readonly],
textarea[readonly] {
  cursor: default;
}

.input-hidden {
  width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 none !important;
  opacity: 0;
  z-index: -1;
}

/* Input. */

/* Select. */

select {
  width: 100%;
  min-height: var(--btn-height);
  padding-inline: 24px;
  color: inherit;
  font-size: 1rem;
  font-weight: 400;
  text-overflow: ellipsis;
  border: 1px solid var(--border);
  border-radius: var(--bdrs);
  outline: none;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background: url('../images/icon/arrow-down.svg') no-repeat calc(100% - (24px - 16px) / 2) center;
  background-size: 16px;
  transition: border-color .43s, color .43s;
}

select:hover,
select:focus {
  border-color: currentColor;
}

/* Select. */

/* Status. */

[class*=status]:not(.status-publish) {
  --color-rgb: 127, 127, 127;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 29px;
  padding: 4px 12px;
  font-size: var(--small);
  font-weight: 500;
  border-radius: var(--bdrs-sm);
  color: rgba(var(--color-rgb), 1);
  background-color: rgba(var(--color-rgb), .15);
}

.status-processing {
  --color-rgb: 43, 77, 198;
}

.status-completed {
  --color-rgb: 18, 124, 22;
}

.status-cancelled {
  --color-rgb: 200, 13, 34;
}

.status-pending {
  --color-rgb: 240, 173, 78;
}

/* Status. */

/* === Widgets === */

/* Account_notes. */



.account_notes_top {
  grid-gap: 12px;
  margin-bottom: var(--i3);
}

.account_notes_load .k-button {
  --icon-size: 20px;
  --btn-min-width: auto;
  --btn-font: var(--body);
  color: var(--black);
  font-weight: 400;
}

.account_notes .wine-items-more {
  text-align: left;
}

/* Account_notes. */

/* Bar. */

.bar {
  display: none;
  z-index: 10;
}

.bar_veil {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: black;
  opacity: 0.9;
  transition: opacity .43s;
}

.bar_veil:not(.active) {
  pointer-events: none;
  opacity: 0;
}

.bar_burger {
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 32px;
  height: 32px;
  margin: -10px -8px;
  padding: 10px 8px;
  border-radius: 4px;
  cursor: pointer;
  z-index: 20;
  transition: background .43s, transform .43s;
}

.bar_burger:hover {
  background-color: var(--gray);
}

.bar_burger.active:hover {
  transform: scale(1.2);
}

.bar_burger span {
  width: 100%;
  height: 1.5px;
  background-color: var(--black);
  transition: transform .43s, opacity .43s;
}

.bar_burger.active span:nth-child(1) {
  transform: rotate(50grad) translate3d(3.7px, 3.2px, 0);
}

.bar_burger.active span:nth-child(2) {
  opacity: 0;
  transform: translateX(-100%);
}

.bar_burger.active span:nth-child(3) {
  transform: rotate(-50grad) translate3d(4px, -4px, 0);
}

.bar_wrapper {
  overflow: hidden;
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  max-height: calc(100vh);
  background-color: var(--bg);
  z-index: -1;
}

.bar_net {
  overflow-y: scroll;
  flex-direction: column;
  align-items: stretch;
  width: calc(100% + 40px);
  height: 100%;
  max-height: 100vh;
  margin-right: -40px;
  padding: var(--bone) calc(var(--bone) + 40px - var(--scroll)) calc(var(--bone) * 2) var(--bone);
}

.bar_center {
  flex-grow: 1;
}

/* Bar. */

/* Content. */

.content {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  grid-gap: var(--content-gap);
}

/* Content. */

/* Dashboard. */



.dashboard_top {
  grid-gap: 40px;
}

.dashboard_user {
  grid-gap: 12px;
}

.dashboard_user .image {
  flex-shrink: 0;
}

.dashboard_user .image img {
  width: clamp(64px, 16vw, 98px);
  aspect-ratio: 1/1;
  border-radius: 50%;
}

.dashboard_user .title {
  margin-bottom: 4px;
}

.dashboard_user .subtitle {
  color: var(--gray-text);
}

.dashboard_user .input-image {
  flex-shrink: 0;
  margin-inline: auto;
}

.dashboard_edit {
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(48px, 12vw, 56px);
  aspect-ratio: 1/1;
  color: inherit;
  border: 1px solid var(--border);
  border-radius: 50%;
}

.dashboard_info {
  --icon-size: 20px;
  margin-top: var(--i1);
}

.dashboard_delete {
  margin-top: var(--i3);
}

.dashboard_submit {
  margin-top: var(--i3);
}

/* Dashboard. */

/* Form. */

.form_error_message {
  color: var(--incorrect);
}

.form_privacy .input-radio-group {
  margin-top: var(--i5);
}

.form_notifications .input-checkbox-group {
  grid-gap: 24px;
}

/* Form. */

/* Message. */

.message {
  overflow: hidden;
  pointer-events: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(340px, 100% - 40px);
  padding: 20px;
  z-index: 9999;
}

.message_item {
  display: flex;
  align-items: center;
  width: 100%;
  color: var(--white);
  min-height: 48px;
  padding: 8px 16px;
  font-weight: 500;
  border-radius: var(--bdrs);
  -webkit-transition: opacity .43s, transform .43s, margin-bottom .43s;
  -moz-transition: opacity .43s, transform .43s, margin-bottom .43s;
  -ms-transition: opacity .43s, transform .43s, margin-bottom .43s;
  -o-transition: opacity .43s, transform .43s, margin-bottom .43s;
  transition: opacity .43s, transform .43s, margin-bottom .43s;
}

.message_item:not(.active) {
  margin-bottom: -58px;
  opacity: 0;
  transform: translateX(calc(100% + 20px));
}

.message_item.error {
  background-color: var(--incorrect);
}

.message_item.success {
  background-color: var(--correct);
}

/* Message. */

/* Modal. */

.modal {
  display: flex;
  align-items: center;
  justify-content: center;
  position: fixed;
  inset: 0;
  max-width: none !important;
  padding: 16px;
  background-color: var(--background-pop-up);
  z-index: 1000;
  transition: opacity .43s;
}

.modal:not(.active) {
  opacity: 0;
  pointer-events: none;
}

.modal_close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(40px, 10vw, 50px);
  margin-left: auto;
  color: var(--close);
  margin-bottom: 12px;
  aspect-ratio: 1/1;
  background-color: var(--white);
  border: 0 none;
  border-radius: 50%;
  box-shadow: none;
}

.modal_wrapper {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  width: 100%;
  max-width: 432px;
  max-height: 100%;
}

.modal_content {
  overflow-y: hidden;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  width: 100%;
  padding: clamp(16px, 4vw, 24px);
  background-color: var(--white);
  border-radius: var(--bdrs-lg);
}

.modal_content-body {
  overflow-y: auto;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  text-align: center;
}

.modal_content-footer {
  margin-top: 24px;
}

.modal_form_image {
  max-width: clamp(160px, 40vw, 180px);
  margin-top: clamp(16px, 4vw, 24px);
  margin-bottom: clamp(24px, 6vw, 32px);
  margin-inline: auto;
}

.modal_form_icon {
  --icon-size: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 80px;
  aspect-ratio: 1/1;
  margin-inline: auto;
  color: var(--gray-icon);
  border: 2px solid var(--gray-icon);
  border-radius: 50%;
}

.modal_form_title {
  margin-top: var(--i2);
}

.modal_form_text {
  margin-top: var(--i4);
  margin-bottom: var(--i2);
  text-wrap: balance;
  color: var(--gray-text);
}

.modal_form form {
  --btn-min-width: 100%;
  display: flex;
  flex-direction: column;
  grid-gap: 12px;
  margin-top: var(--i3);
}

.modal_form form .k-button:not(.line) {
  margin-top: 20px;
}

.modal_form .input-checkbox span {
  display: flex;
  align-items: center;
  justify-content: center;
  grid-gap: 12px;
}

.modal_form .input-checkbox span:before {
  margin-top: -.1em;
}

.modal_form_bottom {
  --btn-min-width: auto;
  margin-top: var(--i4);
}

/* Age Gate Modal */
.age-gate {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.age-gate__icon {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  border: 3px solid #1a1a1a;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
}

.age-gate__icon span {
  font-size: 28px;
  font-weight: 700;
  color: #1a1a1a;
  line-height: 1;
}

.age-gate__title {
  margin-bottom: 4px;
}

.age-gate__subtitle {
  color: var(--gray-text);
  font-size: 14px;
  margin-bottom: 20px;
}

.age-gate__fields {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.age-gate__dob {
  display: flex;
  gap: 8px;
  justify-content: center;
}

.age-gate__field {
  flex: 1;
  max-width: 100px;
}

.age-gate__field input {
  width: 100%;
  height: 48px;
  border: 1px solid var(--border);
  border-radius: var(--bdrs-sm);
  text-align: center;
  font-size: 16px;
  font-weight: 500;
  background: var(--white);
  transition: border-color .2s;
}

.age-gate__field input:focus {
  outline: none;
  border-color: var(--primary);
}

.age-gate__field input::placeholder {
  color: #bbb;
  font-weight: 400;
}

.age-gate__gender {
  display: flex;
  gap: 8px;
  justify-content: center;
}

.age-gate__gender-option input {
  display: none;
}

.age-gate__gender-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  height: 44px;
  padding: 0 20px;
  border: 1px solid var(--border);
  border-radius: var(--bdrs-sm);
  font-size: 14px;
  color: #555;
  cursor: pointer;
  transition: all .2s;
  user-select: none;
}

.age-gate__gender-btn:hover {
  border-color: #999;
}

.age-gate__gender-option input:checked + .age-gate__gender-btn {
  border-color: var(--primary);
  color: var(--primary);
  background: rgba(200, 13, 34, 0.05);
}

.age-gate__note {
  margin-top: 16px;
  font-size: 12px;
  line-height: 1.4;
  color: #999;
  max-width: 300px;
}

.age-gate__error {
  color: var(--primary);
  font-size: 13px;
  min-height: 20px;
  margin-top: 8px;
}

.age-gate__actions {
  display: flex;
  gap: 8px;
  width: 100%;
  margin-top: 16px;
}

.age-gate__actions .k-button {
  flex: 1;
  min-width: auto;
}

#age-gate .modal_wrapper {
  max-width: 380px;
}

#age-gate .modal_content {
  border-radius: var(--bdrs-lg);
}

.modal[id*=order-] .modal_content {
  padding: 0;
}

.modal[id*=order-] .modal_content-footer {
  margin: 0;
}

.modal_order {
  text-align: left;
}

.modal_order_head {
  padding: var(--i4);
  border-bottom: 1px solid var(--border);
}

.order_product_wrapper {
  grid-gap: 12px;
  padding: var(--i4);
}

.order_product_wrapper:not(:first-child) {
  border-top: 1px solid var(--border);
}

.modal_order_product_price {
  margin-top: var(--i4);
  font-size: var(--h5);
  font-weight: 500;
  color: var(--primary);
}

.modal_order_product_price del {
  font-size: var(--small);
  font-weight: 400;
  color: var(--gray-text);
}

.modal_order_info {
  border-top: 1px solid var(--border);
  padding: var(--i4);
}

.modal_order_info dt:not(:first-child) {
  margin-top: var(--i5);
}

.modal_order_info dt {
  color: var(--gray-text);
}

.modal_order_info dd {
  margin-top: 4px;
}

.modal_order_button {
  --btn-min-width: 100%;
  display: flex;
  flex-direction: column;
  grid-gap: var(--i4);
  border-top: 1px solid var(--border);
  padding: var(--i4);
}

/* Modal. */

/* Notifications. */

.notifications {
  display: flex;
  flex-direction: column;
  gap: var(--i4);
}

.notifications_item {
  grid-gap: clamp(20px, 5vw, 24px);
  padding: var(--i4);
  border: 1px solid var(--border);
  border-radius: var(--bdrs);
}

.notifications_item_info {
  grid-gap: clamp(16px, 4vw, 24px);
}

.notifications_item_icon {
  --size: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: var(--size);
  aspect-ratio: 1/1;
  color: var(--correct);
  border: 1px solid currentColor;
  background-color: var(--correct-bg);
  border-radius: 50%;
}

.notifications_item .richText {
  color: var(--gray-text);
}

.notifications_item .richText:not(:first-child) {
  margin-top: 4px;
}

.notifications_item button {
  flex-shrink: 0;
}

/* Notifications. */

/* Orders. */





.orders_table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}

.orders_table:not(:first-child) {
  margin-top: var(--i3);
}

.orders_table tr {
  grid-gap: 8px;
}

.orders_table_head {
  display: flex;
  background-color: var(--background);
  border-radius: var(--bdrs);
}

.orders_table_head div {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 20%;
  height: 56px;
  font-weight: 500;
  padding-inline: 4px;
  text-align: center;
}

.orders_table_order {
  border-bottom: 1px solid var(--border);
}

.orders_table_item {
  display: flex;
}

.orders_table_col {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  width: 20%;
}

.orders_table_col:not(:first-child) {
  justify-content: center;
  text-align: center;
  font-weight: 500;
}

.orders_more {
  margin-top: var(--i1);
}

.order_product {
  display: flex;
  align-items: center;
  grid-gap: 5px;
}

.order_product img {
  flex-shrink: 0;
  width: 66px;
  aspect-ratio: 66/97;
  object-fit: contain;
  object-position: center;
}

.order_product .title {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  word-break: break-word;
}

.order_product .subtitle {
  font-size: var(--tiny);
  color: var(--gray-text);
}

/* Orders. */

/* Pagination. */

.pagination {
  display: inline;
}

.pagination ul {
  display: inline-flex;
  align-items: center;
  grid-gap: 20px;
}

.pagination a {
  color: currentColor;
}

.pagination span {
  color: #E1E1E1;
}

.pagination li:first-child > *,
.pagination li:last-child > * {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 44px;
  aspect-ratio: 1/1;
  border: 1px solid currentColor;
  border-radius: 50%;
}

.pagination li svg {
  width: 14px;
}

/* Pagination. */

/* Rich text. */

.richText * {
  all: revert;
}

.richText > *:first-child {
  margin-top: 0;
}

.richText > *:last-child {
  margin-bottom: 0;
}

.richText h1,
.richText h2,
.richText h3,
.richText h4,
.richText h5,
.richText h6 {
  all: revert !important;
}

.richText .wp-block-image.size-full {
  margin-inline: calc(var(--container-inner) * -1) !important;
}

/* Rich text. */

/* Subscriptions. */

.subscriptions {
  grid-gap: var(--i1);
}

.subscription {
  --btn-min-width: 100%;
  display: flex;
  flex-direction: column;
  grid-gap: var(--i3);
  position: relative;
  padding: var(--i2);
  background-color: var(--background);
  border-radius: var(--bdrs);
}

.subscription_head {
  padding-bottom: var(--i3);
  border-bottom: 1px dashed var(--decorative-70);
}

.subscription_tabs {
  display: flex;
  flex-wrap: wrap;
  grid-gap: 8px;
}

.subscription_tab {
  padding: 4px 16px;
  font-weight: 500;
  color: rgba(141, 7, 48, 1);
  background-color: rgba(141, 7, 48, 0.1);
  border: 1px solid currentColor;
  border-radius: 40px;
}

.subscription_tab._correct {
  color: var(--correct);
  background-color: rgba(23, 141, 7, 0.1);
}

.subscription_featured {
  --icon-size: 16px;
  display: flex;
  align-items: center;
  grid-gap: 4px;
  position: absolute;
  top: 0;
  right: 0;
  padding: 5px 12px;
  color: var(--white);
  font-size: var(--tiny);
  font-weight: 500;
  background-color: var(--correct);
  border-radius: 0 var(--bdrs);
}

.subscription_body {
  flex-grow: 1;
}

.subscription_title:not(:first-child) {
  margin-top: var(--i2);
}

.subscription_description {
  display: flex;
  flex-direction: column;
  grid-gap: 16px;
}

.subscription_description li {
  display: flex;
  grid-gap: 14px;
  align-items: center;
  font-size: var(--h5);
}

.subscription_description li.excludes {
  --icon-size: 20px;
  color: var(--gray-text);
}

.subscription_footer {
  margin-top: calc(var(--i1) - var(--i3));
}

.subscription_price {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-direction: row-reverse;
  grid-gap: 12px;
  margin-bottom: var(--i3);
}

.subscription_price .wps_sfw_interval {
  display: none;
}

.subscription_price ins,
.subscription_price bdi {
  font-size: var(--h2);
  font-weight: 500;
  text-decoration: none;
}

.subscription_price del {
  color: var(--gray-text);
  font-size: var(--h4);
  font-weight: 500;
}

.subscription_price del bdi {
  font-size: inherit;
}

/* Subscriptions. */

/* Wpcf7. */

.wpcf7 br {
  display: none;
}

.wpcf7 p {
  grid-gap: var(--content-gap);
}

.wpcf7-not-valid-tip {
  position: absolute;
  top: 100%;
  left: 0;
  font-weight: 500;
  font-size: var(--small);
}

.wpcf7 label > span:not(.wpcf7-form-control-wrap, .wpcf7-list-item-label) {
  display: block;
  font-weight: 600;
  margin-bottom: 10px;
}

.wpcf7-btn-wrapper {
  position: relative;
  flex-shrink: 0;
  margin-top: 20px;
  white-space: nowrap;
}

.wpcf7 .submitting .k-button {
  pointer-events: none;
  opacity: .5;
}

.wpcf7-btn-wrapper .wpcf7-spinner {
  position: absolute;
  top: 50%;
  left: 50%;
  margin: 0;
  z-index: 2;
  transform: translate(-50%, -50%);
}

.wpcf7-response-output {
  display: none;
}

.wpcf7-radio {
  display: flex;
  flex-direction: column;
  grid-gap: 10px;
}

.wpcf7-list-item {
  margin: 0;
}

.wpcf7-list-item-label {
  --size: 20px;
  display: flex;
  align-items: center;
  grid-gap: 10px;
  position: relative;
  height: 60px;
  padding-inline: 24px;
  font-size: var(--extra-small);
  font-weight: 600;
  border: 1px solid #E1E1E1;
  border-radius: 30px;
  cursor: pointer;
  transition: border-color .43s;
}

.wpcf7-list-item-label:before {
  content: '';
  pointer-events: none;
  width: var(--size);
  aspect-ratio: 1/1;
  border: 1px solid #E1E1E1;
  border-radius: 50%;
  transition: box-shadow .43s, border-color .43s;
}

.wpcf7-list-item input:not([readonly]):checked + .wpcf7-list-item-label {
  border-color: var(--black);
}

.wpcf7-list-item input:not([readonly]):checked + .wpcf7-list-item-label:before {
  box-shadow: inset 0 0 0 4px var(--white), inset 0 0 0 24px var(--black);
  border-color: var(--black);
}

.wpcf7-custom-wrapper {
  display: flex;
  flex-direction: column;
  grid-gap: 16px;
}

.wpcf7-custom-wrapper .wpcf7-list-item-label {
  justify-content: center;
  height: 42px;
  font-size: var(--small);
}

.wpcf7-custom-wrapper .wpcf7-list-item-label:before {
  content: none;
}

.wpcf7-custom-label {
  font-weight: 600;
}

.wpcf7-custom-file {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  grid-gap: 8px;
  position: relative;
  padding: 26px 40px;
  min-height: 152px;
  text-align: center;
  border: 1px dashed #E1E1E1;
  border-radius: 30px;
  cursor: pointer;
}

.wpcf7-custom-file:has(.wpcf7-not-valid-tip) {
  border-color: var(--red);
}

.wpcf7-custom-file .wpcf7-form-control-wrap {
  display: contents;
}

.wpcf7-custom-file .wpcf7-not-valid-tip {
  top: 100%;
  left: 0;
  right: 0;
  margin-top: 8px;
  text-align: center;
}

.wpcf7-custom-file svg {
  width: 24px;
}

.wpcf7-custom-file-title {
  max-width: 17em;
  margin-bottom: 0 !important;
  font-size: var(--small);
  font-weight: 700;
}

.wpcf7-custom-file-size {
  font-weight: 600;
  margin-bottom: 0 !important;
  opacity: .4;
}

.wpcf7-custom-remove-btn {
  align-items: center;
  grid-gap: 6px;
  position: relative;
  color: var(--black);
  font-size: var(--extra-small);
  opacity: .4;
  cursor: pointer;
  z-index: 1;
}

.wpcf7-custom-remove-btn:before {
  content: '';
  width: 12px;
  aspect-ratio: 1/1;
  background-color: currentColor;
  mask-image: url("data:image/svg+xml,%3Csvg width='13' height='12' viewBox='0 0 13 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg opacity='0.4'%3E%3Cpath d='M3.00003 2.5L10.5 10M3.00003 10L10.5 2.5' stroke='%23181818' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/g%3E%3C/svg%3E%0A");
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}

.wpcf7-not-valid {
  border-color: var(--red) !important;
}

/* Wpcf7. */

/* === Sections === */

/* Wine Tabs Section */

.wine-tabs-section {
  margin-top: var(--section-gap);
}

.wine-tabs-container {
  display: flex;
  align-items: center;
  gap: clamp(16px, 4vw, 32px);
  margin-bottom: var(--i3);
  overflow-x: auto;
  padding-bottom: 8px;
}

.wine-tab {
  font-family: 'VisueltPro', sans-serif;
  font-weight: 500;
  font-style: Medium;
  font-size: 18px;
  color: #522B2B;
  cursor: pointer;
  white-space: nowrap;
  padding: 12px 24px;
  border-radius: 12px;
  transition: background-color 0.3s ease;
}

.wine-tab.active {
  background-color: #FFD53C;
  color: #000000;
}

.wine-tab-content {
  margin-top: var(--i4);
}

.wine-tab-pane {
  display: none;
}

.wine-tab-pane.active {
  display: block;
}

.wine-tab-description {
  background-color: #FFD53C26;
  border-radius: 16px;
  padding: var(--i3);
  margin-bottom: var(--i3);
  font-family: 'VisueltPro', sans-serif;
  font-weight: 500;
  font-style: Medium;
  font-size: 16px;
  color: #522B2B;
  line-height: 1.5;
}

/* Wine Tabs Header - hidden on desktop, visible on mobile */
.wine-tabs-header {
  display: none;
}

.wine-tabs-toggle {
  display: none;
}

/* Wine Evolution Section Header (standalone title) */
.wine-tabs-section > .wine-evolution-header {
  margin-bottom: var(--i3);
}

.wine-tabs-section > .wine-evolution-header .wine-evolution-title {
  font-family: 'VisueltPro', sans-serif;
  font-size: clamp(28px, 5vw, 44px);
  font-weight: 400;
  color: #522B2B;
  margin: 0;
  line-height: 1.2;
  letter-spacing: -0.02em;
}

/* Extended characteristics button */
.wine-extended-characteristics-btn {
  display: none;
}

/* Account. */



.account:not(:first-child) {
  margin-top: var(--i2);
}

.account_nav {
  --gap: clamp(16px, 4vw, 24px);
  --padding: clamp(16px, 4vw, 24px);
  flex-shrink: 0;
  padding: var(--padding);
  border: 1px solid var(--border);
  border-radius: var(--bdrs);
}

.account_nav ul {
  display: flex;
  flex-direction: column;
  grid-gap: var(--gap);
}

.account_nav li:last-child a,
.account_nav li:last-child button {
  width: calc(100% + var(--padding) * 2);
  margin-inline: calc(var(--padding) * -1);
  margin-bottom: calc(var(--padding) * -1);
  padding: var(--padding);
  border-top: 1px solid var(--border);
}

.account_nav a,
.account_nav button {
  display: flex;
  align-items: center;
  grid-gap: 12px;
  color: var(--black);
  font-size: var(--h5);
}

.account_nav .active a {
  color: var(--primary);
}



.account_content > .title:first-child {
  margin-bottom: var(--i4);
}

.account_tabs_wrapper {
  overflow: hidden;
  margin-bottom: var(--i2);
  margin-right: calc(var(--container-inner) * -1);
}

.account_tabs {
  overflow-x: scroll;
  overflow-y: hidden;
  display: flex;
  margin-bottom: -40px;
  padding-bottom: calc(40px - var(--scroll));
  padding-right: var(--container-inner);
}

.account_tabs ul {
  display: flex;
  align-items: center;
  grid-gap: clamp(24px, 6vw, 80px);
  flex-grow: 1;
  position: relative;
  border-bottom: 1px solid var(--border);
  margin-bottom: 1px;
  text-wrap: nowrap;
}

.account_tabs .active {
  color: var(--primary);
}

.account_tabs a {
  display: flex;
  align-items: center;
  grid-gap: 12px;
  position: relative;
  color: inherit;
  padding-bottom: 12px;
}

.account_tabs .active a:before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: -2px;
  height: 3px;
  background-color: currentColor;
}

/* Account. */

/* Footer. */

.footer {
  padding-block: var(--i1);
}



.footer_info {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.footer_logo {
  max-width: 150px;
}

.footer_logo:not(:last-child) {
  margin-bottom: var(--i1);
}

.footer_media {
  display: flex;
  flex-direction: column;
  grid-gap: 14px;
}

.footer_media ul {
  display: flex;
  grid-gap: 56px;
  align-items: center;
}

.footer_media a {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 32px;
  aspect-ratio: 1/1;
}

.footer_media img {
  all: revert-layer;
}



.footer_nav {
  display: flex;
  flex-direction: column;
  grid-gap: 24px;
}

.footer_nav ul {
  display: flex;
  flex-direction: column;
  grid-gap: 16px;
}

.footer_nav a {
  color: var(--gray-icon);
}



.footer_title {
  -webkit-text-stroke: 1px var(--border);
  color: var(--white);
  line-height: 1.2;
}

.footer_title:not(:first-child) {
  margin-top: var(--i1);
}

.footer_message {
  text-align: center;
  letter-spacing: .07em;
}

.footer_message:not(:first-child) {
  margin-top: var(--i2);
}

.footer_copyright {
  text-align: center;
}

.footer_copyright a {
  color: var(--gray-icon);
  letter-spacing: -.03em;
}

.footer_copyright:not(:first-child) {
  margin-top: var(--i4);
}

/* Footer. */

/* Header. */

.header {
  padding-block: 28px;
}



.header_logo {
  max-width: clamp(100px, 25vw, 132px);
}

.header_search {
  flex: 1;
  max-width: 430px;
  margin: 0 24px;
}

.header-search-form {
  display: flex;
  align-items: center;
  width: 100%;
  height: 44px;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 100px;
  padding: 2px 12px 2px 2px;
  gap: 0;
}

.header-search-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 38px;
  height: 38px;
  background: var(--primary);
  border: none;
  border-radius: 50%;
  padding: 0;
  cursor: pointer;
  color: var(--white);
  transition: background var(--transition-speed);
}

.header-search-btn:hover {
  background: var(--decorative);
}

button.header-search-btn svg {
  max-width: 24px;
}

input.header-search-input {
  flex: 1;
  width: 100%;
  height: 100%;
  background: none;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  font-family: var(--family);
  font-size: var(--small);
  color: var(--color);
  padding: 0 12px;
}

input.header-search-input:focus {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
}

.header-search-input::placeholder {
  color: var(--gray-text);
}

.header-search-input::-webkit-search-cancel-button {
  -webkit-appearance: none;
  appearance: none;
}

.header-search-filter {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  color: var(--gray-icon);
  transition: color var(--transition-speed);
}

.header-search-filter:hover {
  color: var(--primary);
}

.header-search-filter svg {
  width: 20px;
  height: 20px;
}

.header_right {
  grid-gap: 24px;
}

.header_login {
  display: flex;
  align-items: center;
  grid-gap: 8px;
}

.header_cart {
  display: flex;
  align-items: center;
  grid-gap: 18px;
  height: 47px;
  padding-inline: 16px;
  border: 1px solid var(--border);
  border-radius: 25px;
  background: transparent;
  font-family: var(--family);
  font-size: var(--body);
  font-weight: 500;
  color: var(--black);
  cursor: pointer;
  transition: border-color .3s ease;
}

.header_cart_icon {
  position: relative;
}

.header_cart_icon .k-icon-cart {
  --icon-size: 24px;
}

.header_cart_icon span {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: -3px;
  right: -10px;
  width: 16px;
  height: 16px;
  color: var(--white);
  font-size: 11px;
  letter-spacing: -.02em;
  background-color: var(--primary);
  border-radius: 50%;
}

span.cart-count {
  padding-top: 3px;
}

/* Cart Popup */
.header_cart_wrapper {
  position: relative;
}

.cart-popup {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

.cart-popup::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.35);
  z-index: -1;
}

.cart-popup.active {
  opacity: 1;
  visibility: visible;
}

.cart-popup-inner {
  width: 100%;
  max-width: 810px;
  max-height: 90vh;
  margin: 15px;
  background: var(--white);
  border-radius: 20px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.12);
  display: flex;
  flex-direction: column;
  transform: scale(0.96);
  transition: transform 0.25s ease;
  overflow: hidden;
}

.cart-popup.active .cart-popup-inner {
  transform: scale(1);
}

.cart-popup-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}

.cart-popup-title {
  font-size: 18px;
  font-weight: 600;
  color: var(--black);
}

.cart-popup-close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background: transparent;
  border: none;
  cursor: pointer;
  color: var(--black);
  transition: opacity 0.2s ease;
}

.cart-popup-close:hover {
  opacity: 0.6;
}

.cart-popup-content {
  flex: 1;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.cart-popup-items {
  padding: 0;
  overflow-y: auto;
  max-height: 50vh;
}

.cart-popup-item {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 20px 24px;
  border-bottom: 1px solid var(--border);
}

.cart-popup-item:last-child {
  border-bottom: none;
}

.cart-item-image {
  flex-shrink: 0;
  width: 80px;
  height: 100px;
}

.cart-item-image .wine-item-image {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: visible;
}

.cart-item-image .wine-item-image::before {
  content: '';
  position: absolute;
  top: 55%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 160%;
  height: 130%;
  background: var(--wine-stain, transparent);
  border-radius: 50% 45% 55% 40% / 50% 55% 45% 50%;
  filter: blur(10px);
  z-index: 0;
  pointer-events: none;
}

.cart-item-image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  display: block;
  position: relative;
  z-index: 1;
}

.cart-item-info {
  flex: 1;
  min-width: 0;
}

.cart-item-name {
  display: block;
  font-size: 15px;
  font-weight: 600;
  color: var(--black);
  text-decoration: none;
  line-height: 1.3;
  margin-bottom: 4px;
}

.cart-item-name:hover {
  color: var(--primary);
}

.cart-item-name .reserve-badge,
.woocommerce-cart .reserve-badge,
.woocommerce-checkout .reserve-badge {
  display: inline-block;
  background: #FFD53C;
  color: #000;
  font-size: 11px;
  font-weight: 500;
  padding: 2px 8px;
  border-radius: 4px;
  margin-left: 8px;
  vertical-align: middle;
}

.cart-item-subtitle {
  font-size: 13px;
  color: var(--primary);
  margin-bottom: 2px;
}

.cart-item-sort {
  font-size: 12px;
  color: var(--grey);
  margin-bottom: 10px;
  line-height: 1.4;
}

.cart-item-remove {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  background: transparent;
  border: 1px solid var(--border);
  border-radius: 8px;
  cursor: pointer;
  font-size: 13px;
  font-family: var(--family);
  color: var(--grey);
  transition: all 0.2s ease;
}

.cart-item-remove:hover {
  border-color: var(--grey);
  color: var(--black);
}

.cart-item-remove svg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

.cart-item-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
  min-width: 120px;
}

.cart-item-stock {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: #2e7d32;
}

.cart-item-stock svg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

.cart-item-prices {
  display: flex;
  align-items: baseline;
  gap: 6px;
}

.cart-item-price-old {
  font-size: 12px;
  color: var(--grey);
  text-decoration: line-through;
}

.cart-item-price {
  font-size: 16px;
  font-weight: 700;
  color: var(--primary);
}

.cart-item-quantity {
  display: flex;
  align-items: center;
  border: 1px solid var(--border);
  border-radius: 6px;
  overflow: hidden;
}

.qty-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background: transparent;
  border: none;
  cursor: pointer;
  font-size: 16px;
  color: var(--grey);
  transition: all 0.2s ease;
}

.qty-btn:hover {
  color: var(--black);
}

.qty-value {
  min-width: 32px;
  text-align: center;
  font-size: 14px;
  font-weight: 500;
  color: var(--black);
}

.cart-popup-footer {
  padding: 16px 24px 20px;
  border-top: 1px solid var(--border);
  flex-shrink: 0;
}

.cart-popup-total {
  display: flex;
  align-items: baseline;
  justify-content: flex-end;
  gap: 12px;
  margin-bottom: 16px;
}

.total-label {
  font-size: 14px;
  color: var(--grey);
}

.total-amount {
  font-weight: 700;
  color: var(--primary);
  font-size: 22px;
}

.cart-popup-buttons {
  display: flex;
  gap: 12px;
}

.cart-btn {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 44px;
  padding: 0 20px;
  font-size: 14px;
  font-weight: 500;
  font-family: var(--family);
  text-decoration: none;
  border-radius: 25px;
  transition: all 0.2s ease;
  cursor: pointer;
}

.cart-btn-outline {
  background: var(--white);
  border: 1px solid var(--border);
  color: var(--black);
}

.cart-btn-outline:hover {
  border-color: var(--black);
}

.cart-btn-primary {
  background: var(--primary);
  border: 1px solid var(--primary);
  color: var(--white);
}

.cart-btn-primary:hover {
  background: var(--primary-hover, #7b1c2e);
  border-color: var(--primary-hover, #7b1c2e);
}

/* Empty cart state */
.cart-popup-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 48px 24px;
  text-align: center;
}

.cart-popup-empty .k-icon-cart {
  --icon-size: 48px;
  --icon-color: var(--border);
  margin-bottom: 16px;
}

.cart-popup-empty p {
  font-size: 16px;
  color: var(--grey);
  margin-bottom: 20px;
}

.cart-popup-empty .cart-btn {
  min-width: 160px;
  flex: none;
}

.header_user {
  position: relative;
}

.header_user:not(.active) .header_user_menu_wrapper {
  pointer-events: none;
  margin-top: 12px;
  opacity: 0;
}

.header_user_info {
  display: flex;
  align-items: center;
  grid-gap: 8px;
}

.header_user_info img {
  width: 32px;
  aspect-ratio: 1/1;
  flex-shrink: 0;
  border-radius: 50%;
  object-fit: cover;
  object-position: center;
}

.header_user_info .k-icon-arrow-down {
  -webkit-transition: transform .43s;
  -moz-transition: transform .43s;
  -ms-transition: transform .43s;
  -o-transition: transform .43s;
  transition: transform .43s;
}

.header_user_info.active .k-icon-arrow-down {
  transform: rotate(180deg);
}

.header_user_menu_wrapper {
  position: absolute;
  top: 100%;
  right: -100px;
  right: 0;
  min-width: min(80vw, 400px);
  padding-top: 12px;
  z-index: 3;
  -webkit-transition: opacity .43s, margin-top .43s;
  -moz-transition: opacity .43s, margin-top .43s;
  -ms-transition: opacity .43s, margin-top .43s;
  -o-transition: opacity .43s, margin-top .43s;
  transition: opacity .43s, margin-top .43s;
}

.header_user_menu {
  display: flex;
  flex-direction: column;
  grid-gap: 8px;
  padding: 26px 16px;
  background-color: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--bdrs-md) var(--bdrs-md) 0 0;
}

.header_user_menu a {
  display: flex;
  align-items: center;
  grid-gap: 12px;
  height: 51px;
  color: inherit;
  font-size: var(--h5);
  padding-inline: 12px;
  border-radius: var(--bdrs);
}

.header_user_menu a:before {
  content: '';
  flex-shrink: 0;
  width: 6px;
  aspect-ratio: 1/1;
  background-color: currentColor;
  border-radius: 50%;
  opacity: 0;
}

.header_user_logout {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px;
  margin-top: -1px;
  background-color: var(--white);
  border: 1px solid var(--border);
  border-radius: 0 0 var(--bdrs-md) var(--bdrs-md);
  color: var(--primary);
  font-size: var(--h5);
  transition: background-color 0.3s ease;
}

.header_user_logout:hover {
  background-color: var(--background);
}

.header_user_logout svg {
  flex-shrink: 0;
  max-width: 16px;
}

.header_nav {
  margin-top: 32px;
}

.header_menu {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 60px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.header_menu > li {
  position: relative;
}

.header_menu > li > a {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 0;
  font-size: var(--body);
  font-weight: 400;
  color: var(--black);
  text-decoration: none;
  transition: color 0.2s;
}

.header_menu > li > a:hover {
  color: var(--primary);
}

/* Menu item icons */
.header_menu > li > a::before {
  content: '';
  display: inline-block;
  width: 20px;
  height: 20px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* Icons for specific menu items */
.header_menu > li.menu-obiraj > a::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238D0730' stroke-width='1.5'%3E%3Cpath d='M8 21h8M12 21v-9M12 12c-3 0-6-3-6-6h12c0 3-3 6-6 6z'/%3E%3C/svg%3E");
}

.header_menu > li.menu-doslidzuj > a::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238D0730' stroke-width='1.5'%3E%3Ccircle cx='10' cy='10' r='6'/%3E%3Cpath d='M14 14l6 6'/%3E%3C/svg%3E");
}

.header_menu > li.menu-kushtuj > a::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238D0730' stroke-width='1.5'%3E%3Cpath d='M8 21h8M12 21v-9M12 12c-3 0-6-3-6-6h12c0 3-3 6-6 6z'/%3E%3C/svg%3E");
}

.header_menu > li.menu-pro-nas > a::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238D0730' stroke-width='1.5'%3E%3Crect x='4' y='4' width='16' height='16' rx='2'/%3E%3Cpath d='M8 8h8M8 12h8M8 16h4'/%3E%3C/svg%3E");
}

/* Dropdown arrow for items with submenu */
.header_menu > li.menu-item-has-children > a::after {
  content: '';
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-left: 4px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='currentColor' stroke-width='1.5'%3E%3Cpath d='M3 4.5l3 3 3-3'/%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
  transition: transform 0.2s;
}

.header_menu > li.menu-item-has-children:hover > a::after {
  transform: rotate(180deg);
}

/* Dropdown submenu */
.header_menu .sub-menu {
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  min-width: 280px;
  padding: 24px;
  margin-top: 16px;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 16px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
  list-style: none;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s, visibility 0.2s;
}

/* Dropdown arrow/tail */
.header_menu .sub-menu::before {
  content: '';
  position: absolute;
  top: -8px;
  left: 50%;
  transform: translateX(-50%);
  width: 16px;
  height: 16px;
  background: var(--white);
  border: 1px solid var(--border);
  border-bottom: none;
  border-right: none;
  transform: translateX(-50%) rotate(45deg);
}

.header_menu > li:hover > .sub-menu {
  opacity: 1;
  visibility: visible;
}

/* Submenu items */
.header_menu .sub-menu li {
  margin-bottom: 12px;
}

.header_menu .sub-menu li:last-child {
  margin-bottom: 0;
}

.header_menu .sub-menu a {
  display: block;
  padding: 8px 12px;
  font-size: var(--body);
  color: var(--black);
  text-decoration: none;
  border-radius: 8px;
  transition: background 0.2s, color 0.2s;
}

.header_menu .sub-menu a:hover {
  background: var(--background);
  color: var(--primary);
}

/* Submenu with columns */
.header_menu .sub-menu.columns-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  min-width: 400px;
}

.header_menu .sub-menu.columns-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  min-width: 600px;
}

/* Mega dropdown for Обирай */
.mega-dropdown {
  position: fixed;
  top: auto;
  left: 50%;
  transform: translateX(-50%);
  width: var(--container-width);
  max-width: calc(100vw - var(--container-padding) * 2);
  padding-top: 16px;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s, visibility 0.2s;
  z-index: 1000;
}

.menu-item-has-children:hover > .mega-dropdown {
  opacity: 1;
  visibility: visible;
}

.mega-dropdown-inner {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 0;
  width: 100%;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 16px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
  overflow: hidden;
}

/* Arrow/tail */
.mega-dropdown-inner::before {
  content: '';
  position: absolute;
  top: 8px;
  left: 50%;
  transform: translateX(-50%) rotate(45deg);
  width: 16px;
  height: 16px;
  background: var(--white);
  border: 1px solid var(--border);
  border-bottom: none;
  border-right: none;
}

.mega-col {
  display: flex;
  flex-direction: column;
  padding: 24px;
  min-height: 300px;
}

.mega-col-level1 {
  background: var(--background);
}

.mega-col-level2,
.mega-col-level3 {
  border-left: 1px solid var(--border);
}

.mega-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

/* Submenu visibility */
.mega-submenu {
  display: none;
}

.mega-submenu.active {
  display: flex;
}

.mega-list li {
  position: relative;
}

.mega-list li a,
.mega-list li span {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 16px;
  font-size: var(--body);
  color: var(--black);
  text-decoration: none;
  border-radius: 8px;
  transition: background 0.2s, color 0.2s;
  cursor: pointer;
}

.mega-list li a:hover,
.mega-list li span:hover,
.mega-list li.active > a,
.mega-list li.active > span {
  background: var(--white);
  color: var(--primary);
}

.mega-col-level1 .mega-list li.active > span {
  background: var(--white);
}

/* Chevron icon for items with children */
.mega-list li.has-children > span::after,
.mega-list li.has-children > a::after {
  content: '';
  display: inline-block;
  width: 16px;
  height: 16px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%238b8b8b' stroke-width='1.5'%3E%3Cpath d='M6 4l4 4-4 4'/%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
  transition: stroke 0.2s;
}

.mega-list li.has-children.active > span::after,
.mega-list li.has-children:hover > span::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23c80d22' stroke-width='1.5'%3E%3Cpath d='M6 4l4 4-4 4'/%3E%3C/svg%3E");
}

/* Simple Menu Dropdown (Досліджуй, Куштуй) */
.menu-dropdown-trigger {
  display: flex;
  align-items: center;
  gap: 6px;
  background: none;
  border: none;
  padding: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
  transition: color 0.2s;
}

.menu-dropdown-trigger::before {
  content: '';
  display: inline-block;
  width: 20px;
  height: 20px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.menu-doslidzuj .menu-dropdown-trigger::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238D0730' stroke-width='1.5'%3E%3Ccircle cx='10' cy='10' r='6'/%3E%3Cpath d='M14 14l6 6'/%3E%3C/svg%3E");
}

.menu-kushtuj .menu-dropdown-trigger::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238D0730' stroke-width='1.5'%3E%3Cpath d='M8 21h8M12 21v-9M12 12c-3 0-6-3-6-6h12c0 3-3 6-6 6z'/%3E%3C/svg%3E");
}

.menu-dropdown-trigger:hover {
  color: var(--primary);
}

.menu-dropdown-arrow {
  transition: transform 0.2s ease;
  flex-shrink: 0;
}

.menu-item-has-children.open .menu-dropdown-arrow {
  transform: rotate(180deg);
}

.menu-dropdown {
  position: absolute;
  top: calc(100% + 16px);
  left: 50%;
  transform: translateX(-50%);
  min-width: 220px;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  padding: 12px;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s ease, visibility 0.2s ease;
  z-index: 100;
}

/* Arrow for dropdown */
.menu-dropdown::before {
  content: '';
  position: absolute;
  top: -8px;
  left: 50%;
  transform: translateX(-50%) rotate(45deg);
  width: 14px;
  height: 14px;
  background: var(--white);
  border: 1px solid var(--border);
  border-bottom: none;
  border-right: none;
}

.menu-item-has-children:hover > .menu-dropdown,
.menu-item-has-children.open > .menu-dropdown {
  opacity: 1;
  visibility: visible;
}

.menu-dropdown-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.menu-dropdown-list li a {
  display: block;
  padding: 10px 14px;
  font-size: var(--body);
  color: var(--black);
  text-decoration: none;
  border-radius: 10px;
  transition: background 0.15s ease, color 0.15s ease;
}

.menu-dropdown-list li a::before {
  display: none;
}

.menu-dropdown-list li a:hover {
  background: var(--background);
  color: var(--primary);
}

/* Header. */

/* === WOO === */

/* Breadcrumb. */

.woocommerce-breadcrumb {
  display: flex;
  grid-gap: var(--i5);
  margin-block: var(--i1);
}

.woocommerce-breadcrumb a,
.woocommerce-breadcrumb span {
  color: var(--gray-icon);
}

/* Breadcrumb. */

/* Notices. */

.woocommerce-notices-wrapper {
  display: none;
}

/* Notices. */

/* Price. */

.price {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  grid-gap: .25em;
  font-size: var(--h3);
  font-weight: 700;
}

.price del {
  margin-bottom: .4em;
  color: var(--gray-text);
  font-size: .57em;
  font-weight: 400;
}

.price ins {
  text-decoration: none;
}

/* Price. */

/* Product-single. */

.product-single-cover {
  position: relative;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 1312/377;
  min-height: 246px;
  border-radius: var(--bdrs-lg);
}

.product-single-cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.product-single-cover:after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 50%;
  background: linear-gradient(to bottom, transparent, black);
}

.product-single-main {
  display: flex;
  grid-gap: var(--i2);
  justify-content: space-between;
  margin-top: var(--i1);
}

.product-single-main .summary {
  flex-shrink: 0;
}

.woocommerce-product-gallery {
  margin-top: calc(var(--i1) * -1);
}

.woocommerce-product-gallery__wrapper img {
  aspect-ratio: 363/538;
  object-fit: contain;
  object-position: center;
}

.product-single-main .product_title {
  font-size: var(--h4);
  font-weight: 500;
}

.product-single-main .price {
  justify-content: flex-start;
  font-size: var(--h2);
  margin-top: var(--i4);
}

.product-single-main .stock {
  display: none;
}

.product-single-main .cart {
  --btn-min-width: 180px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  grid-gap: var(--gap);
  margin-top: var(--i4);
}

.product-single-main .cart .button {
  flex-shrink: 0;
  flex-grow: 1;
}

/* ==========================================
   WINE PRODUCT CARD - NEW DESIGN
   ========================================== */

/* Hide default WooCommerce tabs on wine products */
.product.is_wine .woocommerce-tabs {
  display: none;
}

/* SECTION 1: Top Section (3 columns) */
.product-top-section {
  display: grid;
  grid-template-columns: 300px 1fr 280px;
  gap: 40px;
  align-items: start;
  margin-bottom: 48px;
}

.product-gallery-col {
  position: relative;
}

.product-summary-col {
  min-width: 0;
}

.product-diary-col {
  position: sticky;
  top: 100px;
}

/* Diary Card */
.diary-card {
  background: #fff;
  border: 1px solid #E5E5E5;
  border-radius: 12px;
  padding: 24px;
  text-align: center;
}

.diary-card-title {
  font-size: 18px;
  font-weight: 600;
  margin: 0 0 12px 0;
  color: #333;
}

.diary-card-desc {
  font-size: 13px;
  color: #666;
  line-height: 1.5;
  margin: 0 0 20px 0;
}

.diary-card-btn {
  width: 100%;
}

/* SECTION 2: Info Section (Reviews + Characteristics) */
.product-info-section {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  margin-bottom: 48px;
}

.section-title {
  font-size: 20px;
  font-weight: 600;
  margin: 0 0 20px 0;
  color: #333;
}

/* Reviews Slider */
.product-reviews-col {
  min-width: 0;
}

.reviews-slider {
  position: relative;
  min-height: 180px;
}

.review-slide {
  display: none;
}

.review-slide.active {
  display: block;
}

.review-header {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 12px;
}

.review-avatar img {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: cover;
}

.review-author-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.review-author {
  font-size: 14px;
  font-weight: 600;
  color: #333;
}

.review-location {
  font-size: 12px;
  color: #999;
}

.review-date {
  margin-left: auto;
  font-size: 12px;
  color: #999;
}

.review-rating {
  margin-bottom: 12px;
}

.review-rating .star {
  color: #E5E5E5;
  font-size: 16px;
}

.review-rating .star.filled {
  color: #E5A00D;
}

.review-content {
  font-size: 14px;
  line-height: 1.6;
  color: #444;
}

.review-content p {
  margin: 0;
}

.no-reviews {
  color: #999;
  font-style: italic;
}

.reviews-footer {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-top: 20px;
}

.reviews-nav {
  display: flex;
  gap: 8px;
}

.review-nav-btn {
  width: 36px;
  height: 36px;
  border: 1px solid #E5E5E5;
  border-radius: 50%;
  background: #fff;
  cursor: pointer;
  font-size: 14px;
  transition: all 0.2s;
}

.review-nav-btn:hover {
  border-color: var(--accent);
  color: var(--accent);
}

.write-review-btn {
  flex: 1;
}

/* Characteristics Table */
.product-chars-col {
  min-width: 0;
}

.chars-table {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.char-row {
  display: flex;
  gap: 16px;
  padding: 12px 0;
  border-bottom: 1px solid #F0F0F0;
}

.char-row:last-child {
  border-bottom: none;
}

.char-label {
  flex: 0 0 140px;
  font-size: 14px;
  color: #666;
}

.char-value {
  flex: 1;
  font-size: 14px;
  font-weight: 500;
  color: #333;
}

.char-row-full {
  flex-direction: column;
  gap: 8px;
}

.char-row-full .char-label {
  flex: none;
}

/* SECTION 3: Collection Cards */
.product-collection-section {
  margin-bottom: 48px;
}

.collection-header {
  margin-bottom: 32px;
}

.collection-title-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.collection-title {
  font-size: 28px;
  font-weight: 600;
  margin: 0;
  color: #333;
}

.collection-nav {
  display: flex;
  gap: 8px;
}

.collection-nav-btn {
  width: 36px;
  height: 36px;
  border: 1px solid #E5E5E5;
  border-radius: 50%;
  background: #fff;
  cursor: pointer;
  font-size: 14px;
  transition: all 0.2s;
}

.collection-nav-btn:hover {
  border-color: var(--accent);
  color: var(--accent);
}

.collection-subtitle {
  font-size: 14px;
  color: #666;
  line-height: 1.6;
}

.collection-subtitle p {
  margin: 0 0 8px 0;
}

.collection-subtitle p:last-child {
  margin-bottom: 0;
}

/* Collection Cards Grid */
.collection-cards {
  display: flex;
  gap: 20px;
  overflow-x: auto;
  scroll-behavior: smooth;
  padding-bottom: 10px;
  scrollbar-width: thin;
  scrollbar-color: #C41E3A #E5E5E5;
}

.collection-cards::-webkit-scrollbar {
  height: 6px;
}

.collection-cards::-webkit-scrollbar-track {
  background: #E5E5E5;
  border-radius: 3px;
}

.collection-cards::-webkit-scrollbar-thumb {
  background: #C41E3A;
  border-radius: 3px;
}

.collection-card {
  background: #fff;
  border: 1px solid #E5E5E5;
  border-radius: 12px;
  padding: 20px;
  text-align: center;
  position: relative;
  min-width: 250px;
  max-width: 280px;
  flex-shrink: 0;
}

.collection-card.out-of-stock {
  opacity: 0.7;
}

.card-badge {
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  color: #333;
  margin-bottom: 12px;
}

.card-badge::before {
  content: '•';
  color: #C41E3A;
  margin-right: 6px;
}

.card-image {
  height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
}

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

.card-price {
  margin-bottom: 8px;
}

.card-price .old-price {
  font-size: 12px;
  color: #999;
  text-decoration: line-through;
  margin-right: 8px;
}

.card-price .current-price {
  font-size: 20px;
  font-weight: 700;
  color: #333;
}

.card-stock {
  font-size: 12px;
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}

.card-stock.available {
  color: #28a745;
}

.card-stock.low {
  color: #E5A00D;
}

.card-stock.none {
  color: #999;
}

.card-quantity {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  margin-bottom: 12px;
  border: 1px solid #E5E5E5;
  border-radius: 8px;
  overflow: hidden;
}

.qty-btn {
  width: 40px;
  height: 40px;
  border: none;
  background: #fff;
  cursor: pointer;
  font-size: 18px;
  color: #333;
  transition: background 0.2s;
}

.qty-btn:hover:not(:disabled) {
  background: #F5F5F5;
}

.qty-btn:disabled {
  color: #ccc;
  cursor: not-allowed;
}

.qty-input {
  width: 50px;
  height: 40px;
  border: none;
  border-left: 1px solid #E5E5E5;
  border-right: 1px solid #E5E5E5;
  text-align: center;
  font-size: 16px;
  font-weight: 500;
}

.qty-input::-webkit-outer-spin-button,
.qty-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.card-add-btn {
  width: 100%;
}

.card-add-btn:disabled {
  background: #ccc;
  cursor: not-allowed;
}

/* SECTION 4: Tabs */
.product-tabs-section {
  margin-bottom: 48px;
}

.tabs-header {
  display: flex;
  gap: 0;
  margin-bottom: 24px;
}

.tab-btn {
  padding: 16px 32px;
  border: none;
  background: #F5F5F5;
  font-size: 14px;
  font-weight: 500;
  color: #666;
  cursor: pointer;
  transition: all 0.2s;
  border-radius: 8px 8px 0 0;
}

.tab-btn:first-child {
  border-radius: 8px 0 0 0;
}

.tab-btn:last-child {
  border-radius: 0 8px 0 0;
}

.tab-btn.active {
  background: #C41E3A;
  color: #fff;
}

.tabs-content {
  background: #F9F9F9;
  border-radius: 0 12px 12px 12px;
  padding: 24px;
}

.tab-pane {
  display: none;
}

.tab-pane.active {
  display: block;
}

.evolution-intro {
  margin-bottom: 24px;
  font-size: 14px;
  line-height: 1.6;
  color: #444;
}

.evolution-intro p {
  margin: 0 0 8px 0;
}

/* RESPONSIVE */
@media (max-width: 1200px) {
  .product-top-section {
    grid-template-columns: 280px 1fr 240px;
    gap: 24px;
  }

  .collection-cards {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 992px) {
  .product-top-section {
    grid-template-columns: 1fr 1fr;
  }

  .product-diary-col {
    grid-column: 1 / -1;
    position: static;
  }

  .diary-card {
    max-width: 400px;
    margin: 0 auto;
  }

  .product-info-section {
    grid-template-columns: 1fr;
    gap: 32px;
  }
}

@media (max-width: 768px) {
  .product-top-section {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .collection-cards {
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }

  .collection-title {
    font-size: 22px;
  }

  .tabs-header {
    flex-direction: column;
  }

  .tab-btn {
    border-radius: 0;
  }

  .tab-btn:first-child {
    border-radius: 8px 8px 0 0;
  }

  .tab-btn:last-child {
    border-radius: 0 0 8px 8px;
  }
}

@media (max-width: 480px) {
  .collection-cards {
    grid-template-columns: 1fr;
  }

  .card-image {
    height: 150px;
  }
}

/* Wine Year Selector */
.wine-year-selector {
  margin-top: var(--i3);
  padding-top: var(--i3);
  border-top: 1px solid var(--border);
}

.wine-year-label {
  display: block;
  font-size: var(--small);
  color: var(--gray-text);
  margin-bottom: var(--i5);
}

.wine-year-options {
  display: flex;
  flex-wrap: wrap;
  gap: var(--i5);
}

.wine-year-btn {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: var(--i5) var(--i4);
  border: 1px solid var(--border);
  border-radius: var(--bdrs-sm);
  background: var(--white);
  cursor: pointer;
  transition: all 0.2s;
  min-width: 120px;
}

.wine-year-btn:hover {
  border-color: var(--primary);
}

.wine-year-btn.active {
  border-color: var(--primary);
  background: rgba(200, 13, 34, 0.05);
}

.wine-year-btn .year-value {
  font-size: var(--h5);
  font-weight: 500;
  color: var(--black);
}

.wine-year-btn .year-info {
  font-size: var(--tiny);
  color: var(--gray-text);
  margin-top: 2px;
}

/* Wine Quick Info */
.wine-quick-info {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--i4);
  margin-top: var(--i3);
  padding-top: var(--i3);
  border-top: 1px solid var(--border);
}

.wine-info-item {
  display: flex;
  align-items: center;
  gap: var(--i5);
}

.wine-info-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--background);
  color: var(--decorative);
  flex-shrink: 0;
}

.wine-info-icon svg {
  width: 16px;
  height: 16px;
}

.wine-info-label {
  font-size: var(--tiny);
  color: var(--gray-text);
}

.wine-info-value {
  font-size: var(--small);
  font-weight: 500;
  color: var(--black);
  margin-left: auto;
}

/* Wine Extended Info (Sidebar) */
.wine-extended-info {
  margin-top: var(--i3);
  padding: var(--i3);
  background: var(--background);
  border-radius: var(--bdrs);
}

.wine-extended-title {
  font-size: var(--h5);
  font-weight: 500;
  margin-bottom: var(--i4);
  color: var(--decorative);
}

.wine-extended-list {
  display: flex;
  flex-direction: column;
  gap: var(--i5);
}

.wine-ext-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: var(--i5);
  border-bottom: 1px solid var(--border);
}

.wine-ext-item:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.wine-ext-label {
  font-size: var(--small);
  color: var(--gray-text);
}

.wine-ext-value {
  font-size: var(--small);
  font-weight: 500;
  color: var(--black);
  text-align: right;
  max-width: 60%;
}

/* Wine Tastings */
.wine-tastings {
  margin-top: var(--i3);
  padding-top: var(--i3);
  border-top: 1px solid var(--border);
}

.wine-tastings h5 {
  font-size: var(--small);
  font-weight: 500;
  margin-bottom: var(--i4);
  color: var(--decorative);
}

.wine-tastings-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.wine-tastings-list li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--i5) 0;
  border-bottom: 1px solid var(--border);
}

.wine-tastings-list li:last-child {
  border-bottom: none;
}

/* Evolution Bars */
.evolution-bars {
    max-height: 380px; /* Точно для 5 элементов: 5*66px + 4*8px + padding */
    overflow-y: auto;
    overflow-x: hidden;
    position: relative;
}

.evolution-bars.has-scroll::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 40px;
    background: linear-gradient(to bottom, transparent, rgba(255, 255, 255, 0.9));
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.3s ease;
    z-index: 1;
}

.evolution-bars.has-scroll.show-gradient::after {
    opacity: 1;
}

/* Evolution bars scrollbar styling */
.evolution-bars::-webkit-scrollbar {
    width: 4px;
}

.evolution-bars::-webkit-scrollbar-track {
    background: var(--background);
    border-radius: 2px;
}

.evolution-bars::-webkit-scrollbar-thumb {
    background: var(--primary);
    border-radius: 2px;
}

.evolution-bars::-webkit-scrollbar-thumb:hover {
    background: var(--decorative);
}

/* Show only first 5 items, hide others for scrolling */
.evolution-bar-item:nth-child(n+6) {
    /* Not hiding items - let them scroll naturally */
}

.wine-tastings-list a {
  font-size: var(--small);
  color: var(--primary);
  text-decoration: none;
}

.wine-tastings-list a:hover {
  text-decoration: underline;
}

.tasting-date {
  font-size: var(--tiny);
  color: var(--gray-text);
}

/* Wine Register CTA */
.wine-register-cta {
  margin-top: var(--i3);
  padding: var(--i3);
  background: var(--background);
  border-radius: var(--bdrs);
  text-align: center;
}

.wine-register-cta p {
  font-size: var(--small);
  color: var(--gray-text);
  margin-bottom: var(--i4);
  line-height: 1.5;
}

/* Recommendations Section */
.wine-recommendations {
  margin-top: var(--section-gap);
}

.recommendations-section {
  padding: var(--i1) 0;
}

.recommendations-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: var(--i2);
}

.recommendations-title {
  font-size: 44px;
  font-weight: 200;
  margin: 0;
  color: black;
}

.recommendations-nav {
  display: flex;
  gap: 8px;
}

.recommendations-nav-btn {
  width: 48px;
  height: 48px;
  border: 1px solid #dbdbdb;
  border-radius: 300px;
  background: #fff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  color: #333;
  transition: all 0.2s;
}

.recommendations-nav-btn:hover {
  border-color: #333;
}

.recommendations-nav-btn:disabled {
  opacity: 0.3;
  cursor: default;
  pointer-events: none;
}

.recommendations-viewport {
  overflow: hidden;
  margin-left: -10px;
}

.recommendations-track {
  display: flex;
  gap: var(--gap);
  align-items: stretch;
  position: relative;
  left: 10px;
  transition: transform 0.45s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.recommendations-item {
  flex: 0 0 calc((100% - var(--gap) * 2) / 3);
  min-width: 0;
  display: flex;
}

.recommendations-item > * {
  width: 100%;
  display: flex;
  flex-direction: column;
  border: 1px solid #e0d6d6;
  border-radius: var(--bdrs);
  padding: var(--gap);
  transition: border-color 0.2s;
}

.recommendations-item > *:hover {
  border-color: var(--decorative-70);
}

.recommendations-item .product-footer {
  margin-top: auto;
}

@media (max-width: 992px) {
  .recommendations-item {
    flex: 0 0 calc((100% - var(--gap)) / 2);
  }
  .recommendations-nav-btn {
    width: 36px;
    height: 36px;
  }
}

@media (max-width: 576px) {
  .recommendations-item {
    flex: 0 0 100%;
  }
}

/* Product Summary Styles */
.product-single .product_title {
  margin-bottom: var(--i5);
  font-size: var(--h4);
  font-weight: 500;
  line-height: 1.3;
}

/* Wine Product Meta */
.wine-product-meta {
  display: flex;
  flex-direction: column;
  gap: var(--i5);
  margin-bottom: var(--i3);
}

.wine-product-meta p {
  margin: 0;
  line-height: 1.4;
}

.wine-product-winery {
  font-size: var(--body);
  font-weight: 500;
  color: var(--decorative);
}

.wine-product-type {
  font-size: var(--body);
  color: var(--gray-text);
}

.wine-product-grape {
  font-size: var(--small);
  color: var(--gray-text);
}

.wine-product-alcohol,
.wine-product-country {
  position: relative;
  padding-left: 14px;
  font-size: var(--small);
  color: var(--gray-text);
}

.wine-product-alcohol::before,
.wine-product-country::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.45em;
  width: 6px;
  height: 6px;
  background-color: var(--primary);
  border-radius: 50%;
}

/* Product Price in Summary */
.product-single .summary .price {
  margin: var(--i3) 0;
  font-size: var(--h2);
  font-weight: 600;
}

/* Product Cart Form */
.product-single .summary .cart {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--i4);
}

.product-single .summary .cart .quantity {
  flex-shrink: 0;
}

.product-single .summary .cart .button {
  flex: 1;
  min-width: 140px;
}

.product-single .summary .cart .go-to-cart-btn {
  flex: 1;
  min-width: 140px;
}

/* Product Diary Block */
.product-diary-block {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: var(--i3);
  background-color: var(--background);
  border-radius: var(--bdrs);
  height: fit-content;
}

.product-diary-icon {
  --icon-size: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  aspect-ratio: 1/1;
  margin-bottom: var(--i3);
  color: var(--decorative);
  background-color: var(--white);
  border-radius: 50%;
}

.product-diary-title {
  margin-bottom: var(--i4);
  font-size: var(--h5);
  font-weight: 500;
}

.product-diary-text {
  margin-bottom: var(--i3);
  font-size: var(--small);
  color: var(--gray-text);
  line-height: 1.5;
}

.product-diary-block .k-button {
  --btn-min-width: 100%;
  --btn-height: 40px;
  --btn-font: var(--small);
}

/* Go to Cart Button */
.go-to-cart-btn {
  --btn-bg: transparent;
  --btn-bd_color: var(--border);
  color: var(--black);
}

/* Product Single Cart Buttons */
.product-single .cart {
  flex-wrap: wrap;
}

.product-single .cart .button,
.product-single .cart .go-to-cart-btn {
  flex: 1 1 calc(50% - var(--gap) / 2);
  min-width: 150px;
}

/* Product-single. */

/* Product. */

.product:not(.product-single, body) {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  height: 100%;
  padding: var(--i4) var(--i3);
  background-color: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--bdrs);
}

.product-tag,
.product-tag-placeholder {
  display: block;
  min-height: 40px;
  margin-bottom: var(--i3-5);
}

.product-tag {
  display: inline-flex;
  align-items: center;
  padding: 2px var(--i3);
  color: var(--primary);
  margin-left: -16px;
  max-width: 210px;
  border: 1px solid currentColor;
  border-radius: 0 var(--bdrs) var(--bdrs) 0;
}

.product-content {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: var(--i3);
  flex-grow: 1;
  width: 100%;
}

.product-thumbnail-wrapper {
  position: relative;
}

.product-thumbnail {
  display: block;
  aspect-ratio: 1 / 1.2;
  overflow: hidden;
  background: #ffffff;
  border-radius: 8px;
  margin-bottom: 15px;
}

.product-thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  transition: transform 0.3s ease;
}

.product-thumbnail:hover img {
  transform: scale(1.05);
}

.product-thumbnail .wine-item-image,
.product-single-gallery .wine-item-image {
  height: 100%;
  position: relative;
}

.product-single-gallery .wine-item-image {
  overflow: visible;
}

.product-thumbnail .wine-item-image::before {
  content: '';
  position: absolute;
  top: 60%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 150%;
  height: 120%;
  background: var(--wine-stain, transparent);
  border-radius: 50% 45% 55% 40% / 50% 55% 45% 50%;
  filter: blur(15px);
  z-index: 0;
  pointer-events: none;
}

.product-single-gallery .wine-item-image::before {
  content: '';
  position: absolute;
  top: 70%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 250%;
  height: 200%;
  background: var(--wine-stain, transparent);
  border-radius: 50% 45% 55% 40% / 50% 55% 45% 50%;
  filter: blur(25px);
  z-index: 0;
  pointer-events: none;
}

.product-thumbnail .wine-item-image img {
  height: 100%;
  object-fit: contain;
  object-position: center;
  position: relative;
  z-index: 1;
}

.product-single-gallery .wine-item-image > * {
  position: relative;
  z-index: 1;
}

/* Products grid images fix */
.products-grid .product-thumbnail {
  aspect-ratio: 1 / 1.3;
  background: #fff;
}

.products-grid .product-thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

.product-info .product-name {
  color: inherit;
}

.product-info .woocommerce-loop-product__title {
  font-size: var(--body);
  font-weight: 500;
}

.product-footer {
  width: 100%;
}

.product-footer hr {
  margin: var(--i3) calc(var(--i3) * -1);
  border: 0 none;
  border-top: 1px solid var(--border);
}

.product-footer .k-button,
.product-footer .added_to_cart {
  width: 100%;
}

.product-footer .k-button:has(~ .added_to_cart) {
  display: none;
}

.product-footer .screen-reader-text {
  display: none;
}

.product-footer-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: var(--btn-height);
  margin-bottom: var(--i3);
}

.product-rating {
  margin-top: var(--i6);
}

.product-rating p {
  font-size: var(--small);
}

.product-rating p strong {
  font-weight: 500;
  font-size: var(--body);
}

.product-rating p span {
  margin-left: var(--i6);
  color: var(--gray-icon);
}

.product-rating-stars {
  aspect-ratio: 96/16;
  width: 96px;
  margin-top: 4px;
  background: linear-gradient(
			to right,
			var(--stars) 0%,
			var(--stars) var(--percentage),
			transparent var(--percentage),
			transparent 100%
	);
  background-color: var(--gray-baclground);
  mask: url('../images/icon/star.svg') repeat-x center;
  mask-size: auto 100%;
}

/* Product. */

/* Qty. */

.qty-wrapper {
  display: flex;
  align-items: center;
  height: var(--btn-height);
  border: 1px solid var(--border);
  border-radius: var(--bdrs);
  overflow: hidden;
}

input.qty {
  flex: 1;
  min-width: 40px;
  max-width: 60px;
  height: 100%;
  padding: 0;
  font-size: var(--h4);
  font-weight: 500;
  text-align: center;
  border: none;
  border-left: 1px solid var(--border);
  border-right: 1px solid var(--border);
  border-radius: 0;
  outline: none;
  -moz-appearance: textfield;
}

input.qty::-webkit-outer-spin-button,
input.qty::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.qty-wrapper button {
  flex-shrink: 0;
  width: 36px;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: none;
  cursor: pointer;
  -webkit-transition: background var(--transition-speed), color var(--transition-speed);
  -moz-transition: background var(--transition-speed), color var(--transition-speed);
  -ms-transition: background var(--transition-speed), color var(--transition-speed);
  -o-transition: background var(--transition-speed), color var(--transition-speed);
  transition: background var(--transition-speed), color var(--transition-speed);
}

.qty-wrapper button:hover {
  background: var(--bg-light);
}

.qty-wrapper button[disabled] {
  color: var(--gray-icon);
  cursor: not-allowed;
  background: transparent;
}

.qty-wrapper button svg {
  width: 14px;
  height: 14px;
}

/* Qty. */

/* Related. */

.related h2 {
  margin-bottom: var(--i1);
  font-size: var(--h1);
  font-weight: 400;
}

/* Related. */

/* Review. */

.review {
  width: 100%;
}

.review__title {
  margin-bottom: 32px;
}

.review__body {
  padding: 20px 24px;
  border: 1px solid var(--border);
  border-radius: var(--bdrs);
}

.review__body p {
  margin-bottom: 0 !important;
}



.review__author {
  display: flex;
  align-items: center;
  grid-gap: var(--gap);
}

.review__author-image img {
  flex-shrink: 0;
  width: 48px;
  aspect-ratio: 1/1;
  border-radius: 50%;
  box-shadow: 0 2px 8px rgba(99, 99, 99, 0.2);
}



.review__author-name {
  font-weight: 500;
}

.review__info {
  display: flex;
  justify-content: space-between;
  grid-gap: var(--gap);
  margin-top: var(--i5);
}

.review__rating {
  display: flex;
  align-items: center;
  grid-gap: var(--gap);
  font-size: var(--small);
  font-weight: 500;
  line-height: 1;
}

.review__rating .wine-rating-stars {
  width: 116px;
  height: 20px;
  margin-top: -.25em;
}

.review__date {
  flex-grow: 1;
  color: var(--gray-icon);
  font-size: var(--small);
  text-align: right;
  font-weight: 500;
}

.review__text {
  margin-top: var(--i5);
}

.review__slider-navigation {
  display: flex;
  align-items: center;
  grid-gap: var(--gap);
  position: relative;
  margin-top: var(--i4);
}

.review__slider-navigation .button-prev,
.review__slider-navigation .button-next {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 48px;
  aspect-ratio: 1/1;
  border-radius: 50%;
  border: 1px solid var(--border);
  cursor: pointer;
}

.review__slider-navigation .button-prev svg,
.review__slider-navigation .button-next svg {
  width: 50%;
}

.review__slider-navigation .button-prev:before,
.review__slider-navigation .button-next:before {
  content: none;
}

.review__slider-navigation .swiper-button-disabled {
  color: var(--gray-icon);
  cursor: not-allowed;
}

.reviews-slider-bottom {
  margin-top: var(--i2);
}

/* Review. */

/* Shop. */

.woocommerce-products-header__title {
  margin-bottom: var(--i1);
  font-weight: 400;
}

.woocommerce-ordering {
  margin-bottom: var(--i3);
}

.woocommerce ul.products {
  display: grid;
  grid-template-columns: repeat(var(--grid_3), 1fr);
  grid-gap: var(--gap);
}

/* Shop. */

/* Tabs. */

.woocommerce-tabs {
  display: grid;
  grid-gap: var(--i1) var(--gap);
  grid-template-columns: 100%;
  margin-top: var(--i1);
}

.woocommerce-tabs .tabs {
  display: none;
}

.woocommerce-Tabs-panel {
  display: block !important;
}

.woocommerce-Tabs-panel h2:not(:first-child) {
  margin-top: var(--i2);
}

.woocommerce-Tabs-panel h2 {
  margin-bottom: var(--i3);
}



.woocommerce-Tabs-panel--description .product-features-table {
  width: 100%;
  margin-top: var(--i3);
  padding-bottom: var(--i3);
  border-bottom: 1px solid var(--border);
}

.woocommerce-Tabs-panel--description .product-features-table tbody {
  display: flex;
  flex-direction: column;
  grid-gap: var(--i3);
}

.woocommerce-Tabs-panel--description .product-features-table tr {
  display: grid;
  grid-template-columns: 1fr 2.5fr;
  grid-gap: var(--gap);
  font-size: var(--h5);
  font-weight: 500;
}

.woocommerce-Tabs-panel--description .product-features-table td:first-child {
  color: var(--gray-text);
}

.woocommerce-Tabs-panel--description .product-features-table td:first-child:not(:last-child):after {
  content: ':';
}

.woocommerce-Tabs-panel--description .product-features-table td:first-child:last-child {
  grid-column: 1/3;
  height: 1px;
  border-bottom: 1px solid var(--border);
}

/* Tabs. */

@media only screen and (min-width: 768px) {
  /* Orders. */

  .orders_table_order_head,
  .orders_table_order_footer {
    display: none;
  }

  /* Orders. */

  /* Product-single. */

  .product-single-main .summary {
    max-width: 340px;
  }

  .woocommerce-product-gallery {
    width: 363px;
  }

  /* Product-single. */

  /* Review. */

  .woocommerce-Reviews-head .swiper-button {
    display: none;
  }

  /* Review. */
}

@media only screen and (min-width: 901px) {
  /* Tabs. */

  .woocommerce-tabs {
    grid-template-columns: 428px 1fr;
  }

  .woocommerce-Tabs-panel--description {
    justify-self: end;
    order: 1;
    width: 100%;
    max-width: 760px;
  }

  /* Tabs. */
}

@media only screen and (min-width: 1200px) {
  /* Account_notes. */

  .account_notes:not(.tasting) .wine-items-list {
    --net: 2;
  }

  /* Account_notes. */

  /* Account. */

  .account {
    display: grid;
    align-items: flex-start;
    grid-template-columns: 284px 1fr;
    grid-gap: 48px;
  }

  .account_nav {
    position: sticky;
    top: 20px;
  }

  /* Account. */
}

@media only screen and (max-width: 1199px) {
  /* Root. */

  :root {
    /* grid. */
    --grid_4: var(--grid_3);
    --grid_3: var(--grid_2);
    /* grid. */
  }

  /* Root. */

  /* Account. */

  .account_content {
    margin-top: var(--i1);
  }

  .account_tabs_wrapper {
    margin-left: calc(var(--container-inner) * -1);
  }

  .account_tabs {
    padding-left: var(--container-inner);
  }

  /* Account. */
}

@media only screen and (max-width: 1030px) {
  /* Bar. */

  .bar {
    display: block;
  }

  /* Bar. */
}

@media only screen and (max-width: 900px) {
  /* Orders. */

  .orders_table_head div,
  .orders_table_col {
    width: 15%;
  }

  .orders_table_head div:first-child,
  .orders_table_col:first-child {
    width: 40%;
  }

  /* Orders. */

  /* Account. */

  .account-edit .dashboard_info {
    margin-top: 12px;
  }

  .account-edit .dashboard_top {
    position: relative;
  }

  .account-edit .dashboard_user {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
  }

  .account-edit .dashboard_edit {
    position: absolute;
    top: 0;
    right: 0;
  }

  /* Account. */

  /* Product-single. */

  .product-single-top {
    grid-template-columns: 320px 1fr;
    grid-gap: 24px;
  }

  .product-single-gallery {
    margin-top: 0;
  }

  /* Product-single. */
}

@media only screen and (max-width: 767px) {
  /* Root. */

  :root {
    /* grid. */
    --grid_2: 1;
    /* grid. */
  }

  /* Root. */

  /* Account_notes. */

  .account_notes_top {
    flex-direction: column;
    align-items: stretch;
  }

  .account_notes_load .k-button {
    --btn-min-width: 100%;
  }

  /* Account_notes. */

  /* Notifications. */

  .notifications_item,
  .notifications_item_info {
    align-items: flex-start;
  }

  .notifications_item .k-icon-close {
    --icon-size: 20px;
  }

  /* Notifications. */

  /* Orders. */

  .orders_table_head {
    display: none;
  }

  .orders_table_body {
    display: grid;
    grid-gap: var(--i3);
  }

  .orders_table_order_head {
    display: flex;
    flex-direction: column;
    grid-gap: 12px;
    font-size: var(--small);
  }

  .orders_table_order_head .number {
    margin-bottom: 4px;
    font-size: 1rem;
  }

  .orders_table_order_head .number + span {
    color: var(--gray-text);
  }

  .orders_table_order_head .amount {
    font-size: 1rem;
    font-weight: 500;
  }

  .orders_table_order {
    padding: var(--i4);
    border: 1px solid var(--border);
    border-radius: var(--bdrs);
  }

  .orders_table_item {
    float: left;
    width: 100%;
    max-width: calc((100% - 12px) * .5);
    padding-bottom: var(--i4);
  }

  .orders_table_col {
    width: 100% !important;
  }

  .orders_table_col:not(:first-child) {
    display: none;
  }

  .orders_table_order_footer {
    --btn-min-width: 100%;
  }

  /* Orders. */

  /* Account. */

  .account_nav li.active {
    display: none;
  }

  /* Account. */

  /* Product-single. */

  .product-single-main {
    flex-direction: column;
  }

  .product-single-main .cart {
    flex-wrap: wrap;
  }

  .product-single-top {
    grid-template-columns: 1fr;
    grid-gap: 24px;
  }

  .product-single-left {
    gap: 24px;
  }

  .product-single-right {
    gap: 24px;
  }

  .product-single-gallery {
    max-width: 300px;
    margin-inline: auto;
  }

  .product-single-top .summary {
    max-width: 100%;
  }

  .product-reviews-section,
  .product-description-section,
  .product-characteristics-section,
  .product-diary-section {
    padding: 16px;
  }

  /* Product-single. */

  /* Review. */

  .woocommerce-Reviews-title {
    margin-bottom: 0 !important;
  }

  .woocommerce-Reviews-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    grid-gap: var(--gap);
    margin-bottom: var(--i3);
  }

  .reviews-slider-bottom {
    margin-top: var(--i4);
  }

  .reviews-slider-bottom .swiper-button {
    display: none;
  }

  .review-button-wrapper {
    --btn-min-width: 100%;
    flex-grow: 1;
  }

  /* Review. */
}

@media only screen and (max-width: 0px) {
  /* Header. */



  /* Header. */
}

@media (hover: hover) {
  /* Button. */



  /* Button. */

  /* Scrollbar. */

  ::-webkit-scrollbar {
    width: var(--scrollbar-size);
    height: var(--scrollbar-size);
  }

  /* Track */

  ::-webkit-scrollbar-track {
    background: var(--scrollbar-color);
  }

  /* Handle */

  ::-webkit-scrollbar-thumb {
    background: var(--scrollbar-tumb);
    border-radius: var(--scrollbar-radius);
  }

  /* Firefox */

@-moz-document url-prefix()  {
    :root {
      scrollbar-width: thin;
      scrollbar-color: var(--scrollbar-tumb) var(--scrollbar-color);
    }

    * {
      scrollbar-width: thin;
      scrollbar-color: var(--scrollbar-tumb) var(--scrollbar-color);
      scrollbar-track-color: var(--scrollbar-color);
      scrollbar-thumb-color: var(--scrollbar-tumb);
      scrollbar-thumb-border-radius: var(--scrollbar-radius);
    }
}

  /* Edge та IE 10+ */

@supports (-ms-ime-align:auto) {
    *::-ms-scrollbar {
      width: var(--scrollbar-size);
    }

    *::-ms-scrollbar-track {
      background: var(--scrollbar-color);
    }

    *::-ms-scrollbar-thumb {
      background: var(--scrollbar-tumb);
      border-radius: var(--scrollbar-radius);
    }
}

  /* Scrollbar. */

  .richText a,
  .richText a * {
    transition: color .43s;
  }

  .richText a:hover {
    --color: var(--accent);
  }

  .wpcf7-list-item-label:hover {
    border-color: var(--black);
  }

  .wpcf7-custom-file {
    transition: background-color .43s;
  }

  .wpcf7-custom-file:hover {
    background-color: #F8F8F8;
  }

  .footer a {
    -webkit-transition: color .43s;
    -moz-transition: color .43s;
    -ms-transition: color .43s;
    -o-transition: color .43s;
    transition: color .43s;
  }

  .footer a:hover {
    color: var(--primary);
  }

  .header_login {
    -webkit-transition: color .43s;
    -moz-transition: color .43s;
    -ms-transition: color .43s;
    -o-transition: color .43s;
    transition: color .43s;
  }

  .header_login:hover {
    color: var(--primary);
  }

  .header_cart {
    -webkit-transition: border-color .43s;
    -moz-transition: border-color .43s;
    -ms-transition: border-color .43s;
    -o-transition: border-color .43s;
    transition: border-color .43s;
  }

  .header_cart:hover {
    border-color: var(--primary);
  }

  .header_user_menu a {
    -webkit-transition: color .43s, background-color .43s;
    -moz-transition: color .43s, background-color .43s;
    -ms-transition: color .43s, background-color .43s;
    -o-transition: color .43s, background-color .43s;
    transition: color .43s, background-color .43s;
  }

  .header_user_menu a:hover {
    color: var(--primary);
    background-color: var(--background);
  }

  .header_user_menu a:before {
    -webkit-transition: opacity .43s;
    -moz-transition: opacity .43s;
    -ms-transition: opacity .43s;
    -o-transition: opacity .43s;
    transition: opacity .43s;
  }

  .header_user_menu a:hover:before {
    opacity: 1;
  }
}

/* Products Page Styles - Updated Design */

.products-page-wrapper {
    padding: 40px 0;
}

/* Breadcrumbs */
.breadcrumbs {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 20px;
    font-size: 14px;
    color: #666;
}

.breadcrumb-item {
    color: #666;
    text-decoration: none;
    transition: color 0.3s ease;
}

.breadcrumb-item:hover {
    color: #000;
}

.breadcrumb-item.current {
    color: #000;
    font-weight: 500;
}

.breadcrumb-separator {
    color: #999;
}

/* Page Title */
.products-page-title {
    font-size: 32px;
    font-weight: 600;
    margin-bottom: 30px;
    color: #000;
}

/* Filters Section */
.products-filters {
    margin-bottom: 40px;
}

.filters-row {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    width: 100%;
}

/* Filter Dropdown */
.filter-dropdown {
    position: relative;
    flex: 1;
    min-width: 0;
}

.filter-select {
    appearance: none;
    padding: 15px 40px 15px 15px;
    border: 1px solid #E5E5E5;
    border-radius: 16px;
    background: white;
    font-family: 'VisueltPro', sans-serif;
    font-size: 18px;
    font-weight: 500;
    font-style: normal;
    color: #000;
    cursor: pointer;
    transition: all 0.3s ease;
    width: 100%;
    background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L6 6L11 1' stroke='%23000' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 15px center;
}

.filter-select:hover {
    border-color: #000;
}

.filter-select:focus {
    outline: none;
    border-color: #000;
    box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.05);
}

/* Price Filter Wrapper */
.filter-price-wrapper {
    position: relative;
    flex: 1;
    min-width: 0;
}

.filter-price-trigger {
    appearance: none;
    padding: 15px 40px 15px 15px;
    border: 1px solid #E5E5E5;
    border-radius: 8px;
    background: white;
    font-family: 'VisueltPro', sans-serif;
    font-size: 18px;
    font-weight: 500;
    font-style: normal;
    color: #000;
    cursor: pointer;
    transition: all 0.3s ease;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.filter-price-trigger:hover {
    border-color: #000;
}

.filter-price-trigger.active {
    border-color: #000;
}

.filter-price-trigger svg {
    transition: transform 0.3s ease;
    width: 12px;
    height: 8px;
    flex-shrink: 0;
}

.filter-price-trigger.active svg {
    transform: rotate(180deg);
}

/* Price Dropdown */
.filter-price-dropdown {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    background: white;
    border: 1px solid #E5E5E5;
    border-radius: 12px;
    padding: 24px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    z-index: 100;
    display: none;
    min-width: 340px;
}

.filter-price-dropdown.active {
    display: block;
    animation: dropdownFadeIn 0.2s ease;
}

@keyframes dropdownFadeIn {
    from {
        opacity: 0;
        transform: translateY(-8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Price Inputs */
.price-inputs {
    display: flex;
    gap: 16px;
    margin-bottom: 20px;
}

.price-input-group {
    flex: 1;
    position: relative;
}

.price-input-group label {
    display: block;
    font-size: 12px;
    color: #666;
    margin-bottom: 8px;
}

.price-input {
    width: 100%;
    padding: 12px 45px 12px 14px;
    border: 1px solid #E5E5E5;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 500;
    color: #000;
    background: #fafafa;
    transition: all 0.2s ease;
}

.price-input:hover {
    border-color: #ccc;
    background: #fff;
}

.price-input:focus {
    outline: none;
    border-color: #c80d22;
    background: #fff;
    box-shadow: 0 0 0 3px rgba(200, 13, 34, 0.1);
}

/* Hide number input spinners */
.price-input::-webkit-outer-spin-button,
.price-input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.price-input[type=number] {
    -moz-appearance: textfield;
}

.currency {
    position: absolute;
    right: 14px;
    top: 36px;
    font-size: 14px;
    font-weight: 500;
    color: #888;
    pointer-events: none;
}

/* Price Slider */
.price-slider {
    position: relative;
    height: 6px;
    margin-top: 20px;
    margin-bottom: 10px;
    padding: 10px 0;
}

.slider-track {
    position: absolute;
    width: 100%;
    height: 6px;
    top: 10px;
    background: #E5E5E5;
    border-radius: 3px;
}

.slider-range {
    position: absolute;
    height: 6px;
    top: 10px;
    background: linear-gradient(90deg, #c80d22, #e01832);
    border-radius: 3px;
}

.slider-input {
    position: absolute;
    width: 100%;
    height: 6px;
    top: 10px;
    background: none;
    pointer-events: none;
    appearance: none;
    -webkit-appearance: none;
    margin: 0;
    padding: 0;
}

.slider-input::-webkit-slider-runnable-track {
    height: 6px;
    background: transparent;
}

.slider-input::-webkit-slider-thumb {
    appearance: none;
    -webkit-appearance: none;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #c80d22;
    cursor: pointer;
    pointer-events: auto;
    border: 3px solid #fff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
    margin-top: -7px;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.slider-input::-webkit-slider-thumb:hover {
    transform: scale(1.15);
    box-shadow: 0 3px 10px rgba(200, 13, 34, 0.4);
}

.slider-input::-moz-range-track {
    height: 6px;
    background: transparent;
}

.slider-input::-moz-range-thumb {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #c80d22;
    cursor: pointer;
    pointer-events: auto;
    border: 3px solid #fff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.slider-input::-moz-range-thumb:hover {
    transform: scale(1.15);
    box-shadow: 0 3px 10px rgba(200, 13, 34, 0.4);
}

/* Multi-select Filter Dropdown */
.filter-trigger {
    appearance: none;
    padding: 12px 16px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: white;
    font-family: var(--family);
    font-size: var(--body);
    font-weight: 500;
    color: var(--black);
    cursor: pointer;
    transition: all 0.2s ease;
    width: 100%;
    display: flex;
    align-items: center;
    gap: 8px;
}

.filter-trigger:hover {
    border-color: var(--black);
}

.filter-dropdown.open .filter-trigger {
    border-color: var(--primary);
}

.filter-label {
    flex: 1;
    text-align: left;
}

.filter-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    background: var(--primary);
    color: white;
    font-size: 12px;
    font-weight: 600;
    border-radius: 10px;
}

.filter-arrow {
    width: 16px;
    height: 16px;
    transition: transform 0.2s ease;
    flex-shrink: 0;
}

.filter-dropdown.open .filter-arrow {
    transform: rotate(180deg);
}

.filter-dropdown-menu {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    min-width: 220px;
    background: white;
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 8px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
    z-index: 100;
    display: none;
    max-height: 300px;
    overflow-y: auto;
}

.filter-dropdown.open .filter-dropdown-menu {
    display: block;
    animation: dropdownFadeIn 0.2s ease;
}

/* Checkbox Items */
.filter-checkbox-item,
.filter-radio-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    cursor: pointer;
    border-radius: 8px;
    transition: background 0.15s ease;
}

.filter-checkbox-item:hover,
.filter-radio-item:hover {
    background: var(--background);
}

.filter-checkbox-item input,
.filter-radio-item input {
    display: none;
}

.filter-checkbox-item .checkmark {
    width: 20px;
    height: 20px;
    border: 2px solid var(--border);
    border-radius: 4px;
    position: relative;
    transition: all 0.15s ease;
    flex-shrink: 0;
}

.filter-checkbox-item input:checked + .checkmark {
    background: var(--primary);
    border-color: var(--primary);
}

.filter-checkbox-item input:checked + .checkmark::after {
    content: '';
    position: absolute;
    left: 5px;
    top: 0px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.filter-checkbox-item .label-text,
.filter-radio-item .label-text {
    font-size: var(--body);
    color: var(--black);
}

/* Active Filters Tags */
.active-filters {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid var(--border);
    flex-wrap: wrap;
}

.active-filters-label {
    font-size: var(--small);
    color: var(--gray-text);
    font-weight: 500;
}

.active-filters-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    flex: 1;
}

.filter-tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    background: var(--background);
    border: 1px solid var(--border);
    border-radius: 20px;
    font-size: var(--small);
    color: var(--black);
}

.remove-tag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    background: none;
    border: none;
    cursor: pointer;
    font-size: 16px;
    color: var(--gray-text);
    padding: 0;
    line-height: 1;
    border-radius: 50%;
    transition: all 0.15s ease;
}

.remove-tag:hover {
    background: var(--primary);
    color: white;
}

.clear-all-filters {
    font-size: var(--small);
    color: var(--primary);
    text-decoration: none;
    font-weight: 500;
    margin-left: auto;
}

.clear-all-filters:hover {
    text-decoration: underline;
}

/* Price dropdown in new style */
.filter-price-dropdown {
    min-width: 280px;
}

.filter-apply-price {
    width: 100%;
    padding: 12px;
    background: var(--primary);
    color: white;
    border: none;
    border-radius: 8px;
    font-size: var(--body);
    font-weight: 500;
    cursor: pointer;
    margin-top: 16px;
    transition: background 0.2s ease;
}

.filter-apply-price:hover {
    background: var(--decorative);
}

/* Mobile Filter Toggle Button */
.mobile-filter-toggle {
    display: none;
}

/* Mobile Filter Panel */
.mobile-filter-panel {
    display: none;
}

@media (max-width: 768px) {
    /* Hide desktop filters on mobile */
    .products-filters .filters-form > .filters-row {
        display: none;
    }

    .products-filters .filters-form > .active-filters {
        display: flex;
    }

    /* Mobile Filter Toggle Button */
    .mobile-filter-toggle {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        width: 100%;
        padding: 14px 20px;
        background: #fff;
        border: 1px solid var(--border);
        border-radius: 12px;
        font-family: var(--family);
        font-size: 16px;
        font-weight: 500;
        color: var(--black);
        cursor: pointer;
        margin-bottom: 16px;
        transition: all 0.2s ease;
    }

    .mobile-filter-toggle:hover {
        border-color: var(--black);
    }

    .mobile-filter-toggle svg {
        width: 20px;
        height: 20px;
    }

    .mobile-filter-toggle .filter-count-badge {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 20px;
        height: 20px;
        padding: 0 6px;
        background: var(--primary);
        color: white;
        font-size: 12px;
        font-weight: 600;
        border-radius: 10px;
    }

    /* Mobile Filter Panel - Slide from right */
    .mobile-filter-panel {
        display: none;
        position: fixed;
        top: 0;
        right: 0;
        width: 100%;
        max-width: 400px;
        height: 100%;
        background: #fff;
        z-index: 9999;
        transform: translateX(100%);
        transition: transform 0.3s ease;
        flex-direction: column;
    }

    .mobile-filter-panel.active {
        display: flex;
        transform: translateX(0);
    }

    .mobile-filter-panel__header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 16px 20px;
        border-bottom: 1px solid var(--border);
    }

    .mobile-filter-panel__title {
        font-size: 18px;
        font-weight: 600;
        color: var(--black);
    }

    .mobile-filter-panel__close {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        background: none;
        border: none;
        cursor: pointer;
        border-radius: 50%;
        transition: background 0.2s ease;
    }

    .mobile-filter-panel__close:hover {
        background: #f5f5f5;
    }

    .mobile-filter-panel__close svg {
        width: 24px;
        height: 24px;
    }

    .mobile-filter-panel__content {
        flex: 1;
        overflow-y: auto;
        padding: 20px;
    }

    .mobile-filter-panel__content .filters-row {
        display: flex !important;
        flex-direction: column;
        gap: 16px;
    }

    .mobile-filter-panel__content .filter-dropdown {
        width: 100%;
    }

    .mobile-filter-panel__content .filter-trigger {
        width: 100%;
    }

    .mobile-filter-panel__content .filter-dropdown-menu,
    .mobile-filter-panel__content .filter-dropdown.open .filter-dropdown-menu {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        min-width: 100% !important;
        box-shadow: none !important;
        border-radius: 0 0 12px 12px;
        margin-top: -1px;
        animation: none !important;
        transform: none !important;
        transition: none !important;
    }

    .mobile-filter-panel__content .filter-price-dropdown,
    .mobile-filter-panel__content .filter-price-dropdown.active {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        min-width: 100% !important;
        transform: none !important;
        animation: none !important;
        transition: none !important;
    }

    .mobile-filter-panel__footer {
        padding: 16px 20px;
        border-top: 1px solid var(--border);
        display: flex;
        gap: 12px;
    }

    .mobile-filter-panel__clear {
        flex: 1;
        padding: 14px 20px;
        background: #fff;
        border: 1px solid var(--border);
        border-radius: 30px;
        font-size: 16px;
        font-weight: 500;
        color: var(--black);
        cursor: pointer;
        text-align: center;
        transition: all 0.2s ease;
    }

    .mobile-filter-panel__clear:hover {
        border-color: var(--black);
    }

    .mobile-filter-panel__apply {
        flex: 1;
        padding: 14px 20px;
        background: var(--primary);
        border: none;
        border-radius: 30px;
        font-size: 16px;
        font-weight: 500;
        color: #fff;
        cursor: pointer;
        transition: all 0.2s ease;
    }

    .mobile-filter-panel__apply:hover {
        background: var(--decorative);
    }

    /* Overlay */
    .mobile-filter-overlay {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.5);
        z-index: 9998;
    }

    .mobile-filter-overlay.active {
        display: block;
    }
}

/* Loading Overlay */
.products-loading-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 100;
}

.products-loader {
    width: 50px;
    height: 50px;
    border: 4px solid #f3f3f3;
    border-top: 4px solid #000;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Products Results */
.products-results {
    margin-top: 30px;
    position: relative;
}

#products-results-container {
    min-height: 200px;
}

.products-grid {
    display: grid;
	grid-template-columns: repeat(var(--grid_3), 1fr);
	grid-gap: var(--gap);
}

/* Product Card Enhancements */
.products-grid .product {
    background: white;
    border: 1px solid #E5E5E5;
    border-radius: 8px;
    padding: 20px;
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
}

.products-grid .product:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
    transform: translateY(-2px);
    border-color: #000;
}

/* No Products Found */
.no-products-found {
    text-align: center;
    padding: 60px 20px;
    background: #F9F9F9;
    border-radius: 8px;
}

.no-products-found p {
    font-size: 16px;
    color: #666;
    margin-bottom: 20px;
}

/* Products Error */
.products-error {
    text-align: center;
    padding: 60px 20px;
    background: #FFF3CD;
    border: 1px solid #FFC107;
    border-radius: 8px;
    color: #856404;
}

.products-error p {
    font-size: 16px;
    margin-bottom: 20px;
}

/* Load More Button */
.load-more-wrapper {
    display: flex;
    justify-content: center;
    margin-top: 40px;
    margin-bottom: 24px;
}

.load-more-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 14px 40px;
    background-color: #fff;
    border: 1px solid var(--primary);
    border-radius: 8px;
    color: var(--primary);
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s ease;
}

.load-more-btn:hover {
    background-color: var(--primary);
    color: #fff;
}

.load-more-btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.load-more-btn.loading {
    background-color: var(--primary);
    color: #fff;
}

.load-more-spinner {
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: spin 0.75s linear infinite;
    margin-right: 8px;
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

/* Pagination */
.products-pagination {
    margin-top: 0;
}

.products-pagination .page-numbers {
    display: flex;
    justify-content: center;
    align-items: center;
    list-style: none;
    padding: 0;
    margin: 0;
    gap: 8px;
    flex-wrap: wrap;
}

.products-pagination .page-numbers li {
    margin: 0;
}

.products-pagination .page-numbers a,
.products-pagination .page-numbers span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 16px;
    border: 1px solid #E5E5E5;
    border-radius: 6px;
    color: #000;
    text-decoration: none;
    transition: all 0.3s ease;
    min-width: 45px;
    font-size: 14px;
    font-weight: 500;
}

.products-pagination .page-numbers a:hover {
    background: #000;
    color: white;
    border-color: #000;
}

.products-pagination .page-numbers .current {
    background: #000;
    color: white;
    border-color: #000;
}

.products-pagination .page-numbers .dots {
    border: none;
    padding: 10px 8px;
}

/* Toast Notifications */
#toast-container {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 99999;
    display: flex;
    flex-direction: column;
    gap: 10px;
    pointer-events: none;
}

.toast {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 20px;
    background-color: #22c55e;
    color: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    font-size: 14px;
    font-weight: 500;
    pointer-events: auto;
    transform: translateX(120%);
    opacity: 0;
    transition: all 0.3s ease;
    max-width: 360px;
}

.toast.show {
    transform: translateX(0);
    opacity: 1;
}

.toast-icon {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.toast-message {
    flex: 1;
    line-height: 1.4;
}

.toast-close {
    background: none;
    border: none;
    color: #fff;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    opacity: 0.7;
    padding: 0;
    margin-left: 8px;
    transition: opacity 0.2s;
}

.toast-close:hover {
    opacity: 1;
}

.toast-error {
    background-color: #ef4444;
}

.toast-warning {
    background-color: #f59e0b;
}

/* Mobile elements - hidden on desktop */
.header_burger {
    display: none;
}

.header_search--mobile {
    display: none;
}

.mobile-menu {
    display: none;
}

/* Responsive Design */
@media (max-width: 768px) {
    .header_search {
        margin: 0 12px;
    }

    .header-search-form {
        height: 44px;
        padding: 3px;
        gap: 8px;
    }

    .header-search-btn {
        width: 36px;
        height: 36px;
    }

    .header-search-filter {
        width: 36px;
        height: 36px;
    }

    .header-search-input {
        font-size: 14px;
    }

    .products-page-title {
        font-size: 24px;
        margin-bottom: 20px;
    }

    .filters-row {
        gap: 8px;
    }

    .filter-select,
    .filter-price-trigger {
        padding: 12px 36px 12px 12px;
        font-size: 16px;
    }

    .filter-dropdown,
    .filter-price-wrapper {
        flex: 1 1 calc(50% - 4px);
        min-width: calc(50% - 4px);
    }

    .filter-dropdown-menu,
    .filter-dropdown.open .filter-dropdown-menu {
        position: relative;
        top: auto;
        left: auto;
        min-width: 100%;
        box-shadow: none;
        border-radius: 0 0 12px 12px;
        margin-top: -1px;
        animation: none;
    }

    .filter-price-dropdown {
        min-width: 280px;
        left: 50%;
        transform: translateX(-50%);
    }

    .products-grid {
        grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
        gap: 20px;
    }

    .breadcrumbs {
        font-size: 13px;
    }

    /* Mobile Header */
    .header {
        padding: 12px 0;
    }

    .header_net {
        flex-wrap: wrap;
    }

    .header_logo {
        order: 1;
        flex: 0 0 auto;
    }

    .header_logo img {
        height: 24px;
        width: auto;
    }

    .header_right {
        order: 2;
        gap: 12px;
    }

    .header_search--desktop {
        display: none;
    }

    .header_search--mobile {
        display: block;
        order: 3;
        width: 100%;
        margin: 12px 0 0;
        padding: 0;
    }

    .header_search--mobile .header-search-form {
        width: 100%;
    }

    .header_net.flex-align_center-justify_between {
        margin-bottom: 20px;
    }

    .header_cart_text {
        display: inline;
        font-size: 14px;
        font-weight: 500;
    }

    .header_cart {
        gap: 12px;
        padding: 0 10px;
        border: 1px solid var(--border);
        height: 40px;
        border-radius: 8px;
    }

    .header_login,
    .header_user {
        display: none;
    }

    /* Burger Menu Button */
    .header_burger {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        width: 32px;
        height: 32px;
        background: none;
        border: none;
        cursor: pointer;
        padding: 0;
        gap: 5px;
    }

    .header_burger span {
        display: block;
        width: 20px;
        height: 2px;
        background-color: var(--black);
        transition: all 0.3s ease;
    }

    .header_burger.active span:nth-child(1) {
        transform: rotate(45deg) translate(5px, 5px);
    }

    .header_burger.active span:nth-child(2) {
        opacity: 0;
    }

    .header_burger.active span:nth-child(3) {
        transform: rotate(-45deg) translate(5px, -5px);
    }

    /* Hide desktop navigation */
    .header_nav {
        display: none;
    }

    /* Mobile Menu */
    .mobile-menu {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: #fff;
        z-index: 9999;
        padding: 20px;
        overflow-y: auto;
        flex-direction: column;
    }

    .mobile-menu.active {
        display: flex;
    }

    .mobile-menu__header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding-bottom: 20px;
        margin-bottom: 10px;
    }

    .mobile-menu__logo img {
        height: 28px;
        width: auto;
    }

    .mobile-menu__close {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        background: none;
        border: none;
        cursor: pointer;
        color: var(--black);
    }

    .mobile-menu__nav {
        flex: 1;
    }

    .mobile-menu__nav ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .mobile-menu__nav li {
        border: none;
    }

    .mobile-menu__nav a {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 16px 0;
        font-size: 16px;
        font-weight: 500;
        color: var(--black);
        text-decoration: none;
    }

    .mobile-menu__nav a:hover,
    .mobile-menu__nav li.active a {
        color: var(--primary);
    }

    .mobile-menu__nav .menu-icon {
        flex-shrink: 0;
        width: 24px;
        height: 24px;
    }

    .mobile-menu__nav a span {
        flex: 1;
    }

    .mobile-menu__nav .menu-arrow {
        flex-shrink: 0;
        width: 20px;
        height: 20px;
        opacity: 0.4;
    }

    .mobile-menu__footer {
        padding-top: 20px;
        margin-top: auto;
    }

    .mobile-menu__login {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        width: 100%;
        padding: 16px 24px;
        background-color: var(--primary);
        color: #fff;
        border: none;
        border-radius: 12px;
        font-size: 16px;
        font-weight: 500;
        text-decoration: none;
        cursor: pointer;
    }

    .mobile-menu__login:hover {
        background-color: #a00b1c;
    }

    .mobile-menu__login svg {
        max-width: 16px;
    }

    /* Mobile Menu Multi-level */
    .mobile-menu__header {
        position: relative;
    }

    .mobile-menu__back {
        position: absolute;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        display: flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        background: none;
        border: none;
        cursor: pointer;
        color: var(--black);
        padding: 0;
    }

    .mobile-menu__content {
        flex: 1;
        position: relative;
        overflow: hidden;
    }

    .mobile-menu__level {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        transition: transform 0.3s ease;
        overflow-y: auto;
    }

    .mobile-menu__level[data-level="1"] {
        position: relative;
        transform: translateX(0);
    }

    .mobile-menu__level[data-level="1"].hidden {
        position: absolute;
        transform: translateX(-100%);
    }

    .mobile-menu__submenu {
        transform: translateX(100%);
    }

    .mobile-menu__submenu.active {
        transform: translateX(0);
    }

    .mobile-menu__item-link {
        cursor: pointer;
    }

    /* Mobile Footer */
    .footer {
        padding: 40px 0;
    }

    .footer .grid-two {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .footer_info {
        text-align: left;
    }

    .footer_logo img {
        height: 28px;
        width: auto;
    }

    .footer_net > .grid-two {
        grid-template-columns: 1fr 1fr;
        gap: 24px;
    }

    .footer_nav .title {
        font-size: 16px;
        margin-bottom: 16px;
    }

    .footer_nav ul {
        gap: 12px;
    }

    .footer_nav a {
        font-size: 14px;
    }

    .footer_media {
        margin-top: 24px;
    }

    .footer_media .title {
        font-size: 16px;
        margin-bottom: 12px;
    }

    .footer_media ul {
        gap: 16px;
    }

    .footer_media a {
        width: 32px;
        height: 32px;
    }

    .footer_message {
        margin-top: 32px;
        font-size: 48px;
        text-align: center;
    }

    .footer_copyright {
        margin-top: 24px;
        text-align: center;
        font-size: 12px;
    }
}

@media (max-width: 480px) {
    .header_search {
        max-width: none;
        margin: 0;
    }
}

/* Custom Pagination Styles */
/* .custom-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 40px 0;
    flex-wrap: wrap;
}

.page-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border: 1px solid var(--border, #E5E5E5);
    background: white;
    color: var(--black, #000);
    text-decoration: none;
    border-radius: 8px;
    font-weight: bold;
    font-size: 16px;
    transition: all 0.2s ease;
    cursor: pointer;
    font-family: monospace;
    line-height: 1;
}

.page-arrow:hover {
    background: var(--primary, #c80d22);
    color: white;
    border-color: var(--primary, #c80d22);
    transform: translateY(-1px);
}

.page-arrow.disabled {
    opacity: 0.3;
    cursor: not-allowed;
    background: #f5f5f5;
}

.page-arrow.disabled:hover {
    transform: none;
    background: #f5f5f5;
    color: var(--black, #000);
}

.page-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 12px;
    border: 1px solid var(--border, #E5E5E5);
    background: white;
    color: var(--black, #000);
    text-decoration: none;
    border-radius: 8px;
    font-weight: 500;
    font-size: 14px;
    transition: all 0.2s ease;
    cursor: pointer;
}

.page-number:hover {
    background: var(--primary, #c80d22);
    color: white;
    border-color: var(--primary, #c80d22);
    transform: translateY(-1px);
}

.page-number.current {
    background: var(--primary, #c80d22);
    color: white;
    border-color: var(--primary, #c80d22);
    font-weight: 600;
} */

.page-ellipsis {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    color: var(--gray-text, #888);
    font-size: 16px;
    font-weight: bold;
    padding: 0 4px;
}

@media (max-width: 480px) {
    .header_search {
        margin: 0 8px;
        max-width: none;
    }

    .header-search-form {
        height: 40px;
        padding: 2px;
    }

    .header-search-btn {
        width: 32px;
        height: 32px;
    }

    .header-search-btn svg {
        width: 14px;
        height: 14px;
    }

    .header-search-filter {
        width: 32px;
        height: 32px;
    }

    .filters-row {
        flex-direction: column;
        gap: 8px;
    }

    .filter-select,
    .filter-price-trigger {
        width: 100%;
        padding: 12px 36px 12px 12px;
        font-size: 16px;
    }

    .filter-dropdown,
    .filter-price-wrapper {
        flex: 1 1 100%;
        min-width: 100%;
    }

    .filter-dropdown-menu,
    .filter-dropdown.open .filter-dropdown-menu {
        position: relative;
        top: auto;
        left: auto;
        min-width: 100%;
        box-shadow: none;
        border-radius: 0 0 12px 12px;
        margin-top: -1px;
        animation: none;
    }

    .filter-price-dropdown {
        left: 0;
        right: 0;
        transform: none;
        min-width: auto;
    }

    .products-grid {
        grid-template-columns: 1fr;
    }

    .products-page-title {
        font-size: 20px;
    }

    .products-pagination .page-numbers a,
    .products-pagination .page-numbers span {
        padding: 8px 12px;
        font-size: 13px;
        min-width: 38px;
    }

    /* Cart popup mobile */
    .cart-popup-inner {
        max-width: 100%;
        max-height: 100vh;
        border-radius: 0;
        margin: 0;
    }

    .cart-popup-header {
        padding: 16px;
    }

    .cart-popup-item {
        padding: 16px;
        flex-wrap: wrap;
        gap: 12px;
    }

    .cart-item-image {
        width: 60px;
        height: 72px;
        flex-shrink: 0;
    }

    .cart-item-image img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        object-position: center;
    }

    .cart-item-info {
        flex: 1;
        min-width: calc(100% - 140px);
    }

    .cart-item-name {
        font-size: 14px;
    }

    .cart-item-right {
        width: 100%;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        margin-top: 8px;
        padding-left: 72px;
    }

    .cart-item-prices {
        order: 1;
    }

    .cart-item-quantity {
        order: 2;
    }

    .cart-item-stock {
        display: none;
    }

    .cart-popup-footer {
        padding: 16px;
    }

    .cart-popup-buttons {
        flex-direction: column;
        gap: 10px;
    }

    .cart-btn {
        height: 44px;
        font-size: 13px;
        min-height: 40px;
    }
}

/* ========================================
   CHECKOUT PAGE
   ======================================== */

.checkout-page {
  max-width: 1200px;
  margin: 0 auto;
  padding: 40px 20px;
}

.checkout-title {
  font-size: 32px;
  font-weight: 600;
  color: var(--black);
  margin-bottom: 12px;
}

.checkout-login-link {
  margin: 0 0 24px 0;
}

.checkout-login-link button {
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  color: var(--primary);
  text-decoration: none;
  font-size: 14px;
  font-family: inherit;
}

.checkout-login-link button:hover {
  text-decoration: underline;
}

.checkout-columns {
  display: grid;
  grid-template-columns: 1fr 400px;
  gap: 40px;
  align-items: start;
}

/* Left Column - Form */
.checkout-form-col {
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.checkout-section {
  border: none;
  border-radius: 12px;
}

.checkout-section-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 0px;
  background: none;
  border: none;
}

.section-number {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 8px;
  font-family: var(--family);
  font-size: 18px;
  font-weight: 500;
  color: var(--black);
}

.section-title {
  font-family: var(--family);
  font-size: 24px;
  font-weight: 400;
  color: var(--black);
  margin: 0;
}

.checkout-section-content {
  padding: 0;
}

.form-row-double {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-bottom: 16px;
}

.form-row-double:last-child {
  margin-bottom: 0;
}

.form-row {
  margin: 0;
}

.input-text,
.select-field {
  width: 100%;
  height: 48px;
  padding: 0 16px;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 14px;
  font-family: var(--family);
  color: var(--black);
  background: var(--white);
  transition: border-color 0.2s ease;
}

.input-text:focus,
.select-field:focus {
  outline: none;
  border-color: var(--primary);
}

.input-text::placeholder {
  color: var(--grey);
}

abbr.required {
    color: red;
}

.select-field {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 6L8 10L12 6' stroke='%23999' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 16px center;
  padding-right: 44px;
}

/* Delivery Method */
.delivery-method {
  margin-bottom: 16px;
}

.delivery-select {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: 8px;
  cursor: pointer;
}

.delivery-icon {
  color: var(--primary);
  flex-shrink: 0;
  width: 16px !important;
  height: 16px !important;
}

.delivery-select span {
  flex: 1;
  font-size: 14px;
  color: var(--black);
}

.select-arrow {
  color: var(--grey);
  flex-shrink: 0;
  width: 16px !important;
  height: 16px !important;
}

/* Payment Methods */
.payment-method-wrapper {
  position: relative;
}

.payment-select {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: 8px;
  cursor: pointer;
  background: var(--white);
  transition: border-color 0.2s ease;
}

.payment-select:hover {
  border-color: var(--gray-icon);
}

.payment-select.active {
  border-color: var(--primary);
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.payment-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--gray-icon);
}

.payment-icon svg {
  width: 24px;
  height: 24px;
}

.payment-select-text {
  flex: 1;
  font-size: 14px;
  color: var(--black);
}

.payment-select .select-arrow {
  color: var(--gray-icon);
  transition: transform 0.2s ease;
}

.payment-select.active .select-arrow {
  transform: rotate(180deg);
}

.payment-dropdown {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: var(--white);
  border: 1px solid var(--primary);
  border-top: none;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
  z-index: 1000;
  overflow: hidden;
}

.payment-dropdown.open {
  display: block;
  position: absolute;
}

.payment-option {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  cursor: pointer;
  border-bottom: 1px solid var(--border);
  transition: background-color 0.2s ease;
}

.payment-option:last-child {
  border-bottom: none;
}

.payment-option:hover {
  background: var(--background);
}

.payment-option input {
  display: none;
}

.payment-option-icon {
  display: flex;
  align-items: center;
  color: var(--gray-icon);
}

.payment-option-icon svg {
  width: 24px;
  height: 24px;
}

.payment-option-title {
  flex: 1;
  font-size: 14px;
  color: var(--black);
}

.payment-option-check {
  display: none;
  color: var(--primary);
}

.payment-option-check svg {
  width: 16px !important;
  height: 16px !important;
}

.payment-option.selected .payment-option-check {
  display: flex;
}

.payment-option.selected .payment-option-icon {
  color: var(--primary);
}

/* Delivery dropdown check icon */
svg.check-icon {
  max-width: 16px;
}

/* Terms Checkbox */
.checkout-terms {
  padding: 0;
}

.terms-checkbox {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  cursor: pointer;
  font-size: 13px;
  color: var(--grey);
  line-height: 1.5;
}

.terms-checkbox input {
  display: none;
}

.terms-checkbox .checkmark {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  border: 1px solid var(--border);
  border-radius: 4px;
  margin-top: 2px;
  position: relative;
  transition: all 0.2s ease;
}

.terms-checkbox input:checked + .checkmark {
  background: var(--primary);
  border-color: var(--primary);
}

.terms-checkbox input:checked + .checkmark::after {
  content: '';
  position: absolute;
  top: 3px;
  left: 6px;
  width: 4px;
  height: 8px;
  border: solid white;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

.terms-checkbox a {
  color: var(--primary);
  text-decoration: none;
}

.terms-checkbox a:hover {
  text-decoration: underline;
}

/* Right Column - Order Review */
.checkout-order-col {
  position: sticky;
  top: 20px;
}

.checkout-order-review {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 24px;
}

.order-review-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
}

.order-review-title {
  font-size: 18px;
  font-weight: 600;
  color: var(--black);
  margin: 0;
}

.order-edit-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  color: var(--grey);
  transition: color 0.2s ease;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
}

.order-edit-link:hover {
  color: var(--black);
}

.order-edit-link svg {
  width: 16px !important;
  height: 16px !important;
}

/* Order Items */
.order-items {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 16px;
}

.order-item {
  display: grid;
  grid-template-columns: 56px 1fr auto auto;
  gap: 12px;
  align-items: start;
}

.order-item-image {
  width: 64px;
  height: 80px;
  flex-shrink: 0;
}

.order-item-image .wine-item-image {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: visible;
}

.order-item-image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

.order-item-details {
  min-width: 0;
}

.order-item-name {
  font-size: 14px;
  font-weight: 600;
  color: var(--black);
  margin-bottom: 4px;
  line-height: 1.3;
}

.order-item-meta {
  font-size: 12px;
  color: var(--grey);
  margin-bottom: 2px;
}

.order-item-stock {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  color: #2e7d32;
  margin-top: 4px;
}

.order-item-stock svg {
  flex-shrink: 0;
  width: 16px !important;
  height: 16px !important;
}

.order-item-qty {
  font-size: 13px;
  color: var(--grey);
  white-space: nowrap;
}

.order-item-price {
  text-align: right;
}

.order-item-price .price-old {
  display: block;
  font-size: 12px;
  color: var(--grey);
  text-decoration: line-through;
}

.order-item-price .price-current {
  font-size: 16px;
  font-weight: 700;
  color: var(--primary);
}

/* Order Totals */
.order-totals {
  margin-bottom: 20px;
}

.order-total-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 0;
  font-size: 14px;
}

.order-total-row.discount span:last-child {
  color: var(--primary);
}

.order-total-row.total {
  padding-top: 12px;
  border-top: 1px solid var(--border);
}

.order-total-row.total span:first-child {
  color: var(--grey);
}

.order-total-row.total .total-amount {
  font-size: 22px;
  font-weight: 700;
  color: var(--primary);
}

/* Coupon */
.order-coupon {
  margin-bottom: 16px;
}

.coupon-toggle {
  width: 100%;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--white);
  border: 1px solid var(--primary);
  border-radius: 30px;
  color: var(--primary);
  font-size: 14px;
  font-weight: 500;
  font-family: var(--family);
  cursor: pointer;
  transition: all 0.2s ease;
}

.coupon-toggle:hover {
  background: rgba(var(--primary-rgb), 0.05);
}

.coupon-form {
  display: flex;
  gap: 8px;
  margin-top: 12px;
}

.coupon-input {
  flex: 1;
  height: 44px;
  padding: 0 14px;
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 14px;
  font-family: var(--family);
}

.coupon-apply {
  height: 44px;
  padding: 0 20px;
  background: var(--primary);
  border: none;
  border-radius: 8px;
  color: var(--white);
  font-size: 14px;
  font-weight: 500;
  font-family: var(--family);
  cursor: pointer;
  transition: background 0.2s ease;
}

.coupon-apply:hover {
  background: var(--primary-hover, #7b1c2e);
}

.coupon-apply:disabled {
  opacity: 0.7;
  cursor: not-allowed;
}

.coupon-form {
  flex-wrap: wrap;
}

.coupon-message {
  width: 100%;
  padding: 8px 12px;
  border-radius: 6px;
  font-size: 13px;
  margin-top: 8px;
}

.coupon-message.success {
  background: #d4edda;
  color: #155724;
}

.coupon-message.error {
  background: #f8d7da;
  color: #721c24;
}

/* Applied Coupon */
.applied-coupon {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  background: #f0fdf4;
  border: 1px solid #86efac;
  border-radius: 8px;
  margin-bottom: 10px;
}

.applied-coupon .coupon-code {
  font-family: monospace;
  font-size: 13px;
  font-weight: 600;
  color: #166534;
  background: #dcfce7;
  padding: 3px 8px;
  border-radius: 4px;
}

.applied-coupon .coupon-discount {
  flex: 1;
  text-align: right;
  font-size: 14px;
  font-weight: 500;
  color: #166534;
}

.applied-coupon .coupon-remove {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  background: none;
  border: none;
  cursor: pointer;
  color: #6b7280;
  padding: 0;
  border-radius: 4px;
  transition: all 0.2s;
}

.applied-coupon .coupon-remove:hover {
  background: #fecaca;
  color: #dc2626;
}

/* Submit Button */
.checkout-submit {
  width: 100%;
  height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--primary);
  border: none;
  border-radius: 30px;
  color: var(--white);
  font-size: 15px;
  font-weight: 600;
  font-family: var(--family);
  cursor: pointer;
  transition: background 0.2s ease;
}

.checkout-submit:hover {
  background: var(--primary-hover, #7b1c2e);
}

/* ========================================
   THANK YOU PAGE
   ======================================== */

.thankyou-page {
  max-width: 1200px;
  margin: 0 auto;
  padding: 40px 20px 60px;
}

/* Success/Error States */
.thankyou-success,
.thankyou-error,
.thankyou-no-order {
  text-align: center;
  padding: 40px 20px;
  margin-bottom: 40px;
}

.thankyou-success-icon,
.thankyou-error-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 80px;
  height: 80px;
  margin-bottom: 24px;
}

.thankyou-success-icon {
  color: #22c55e;
}

.thankyou-error-icon {
  color: #ef4444;
}

.thankyou-title {
  font-size: 32px;
  font-weight: 600;
  color: var(--black);
  margin: 0 0 12px;
}

.thankyou-message {
  font-size: 16px;
  color: var(--grey);
  margin: 0;
}

/* Error Actions */
.thankyou-error .thankyou-actions {
  display: flex;
  gap: 16px;
  justify-content: center;
  margin-top: 24px;
}

.thankyou-actions .btn-primary,
.thankyou-no-order .btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 48px;
  padding: 0 32px;
  background: var(--primary);
  color: var(--white);
  border: none;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  transition: background 0.2s ease;
}

.thankyou-actions .btn-primary:hover,
.thankyou-no-order .btn-primary:hover {
  background: var(--primary-hover, #7b1c2e);
}

.thankyou-actions .btn-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 48px;
  padding: 0 32px;
  background: var(--white);
  color: var(--black);
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  transition: border-color 0.2s ease;
}

.thankyou-actions .btn-secondary:hover {
  border-color: var(--black);
}

/* Two Column Layout */
.thankyou-columns {
  display: grid;
  grid-template-columns: 1fr 400px;
  gap: 40px;
  align-items: start;
}

.thankyou-info-col {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

/* Info Sections */
.thankyou-section {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
}

.thankyou-section-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 20px;
  background: var(--bg-light, #fafafa);
  border-bottom: 1px solid var(--border);
}

.thankyou-section-header .section-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  color: var(--primary);
}

.thankyou-section-header .section-title {
  font-size: 16px;
  font-weight: 500;
  color: var(--black);
  margin: 0;
}

.thankyou-section-content {
  padding: 16px 20px;
}

.info-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: 8px 0;
  gap: 16px;
}

.info-row:first-child {
  padding-top: 0;
}

.info-row:last-child {
  padding-bottom: 0;
}

.info-row + .info-row {
  border-top: 1px solid var(--border-light, #f0f0f0);
}

.info-label {
  font-size: 14px;
  color: var(--grey);
  flex-shrink: 0;
}

.info-value {
  font-size: 14px;
  color: var(--black);
  text-align: right;
  word-break: break-word;
}

.status-badge {
  display: inline-block;
  padding: 4px 12px;
  background: #fef3c7;
  color: #92400e;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 500;
}

.total-row {
  margin-top: 8px;
  padding-top: 16px !important;
  border-top: 1px solid var(--border) !important;
}

.total-row .info-label {
  font-size: 16px;
  font-weight: 500;
  color: var(--black);
}

.total-row .total-amount {
  font-size: 18px;
  font-weight: 600;
  color: var(--primary);
}

/* Order Review Column */
.thankyou-order-col {
  position: sticky;
  top: 100px;
}

.thankyou-order-review {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
}

.thankyou-order-review .order-review-header {
  padding: 16px 20px;
  border-bottom: 1px solid var(--border);
}

.thankyou-order-review .order-review-title {
  font-size: 18px;
  font-weight: 500;
  color: var(--black);
  margin: 0;
}

.thankyou-order-review .order-items {
  padding: 16px 20px;
  max-height: 400px;
  overflow-y: auto;
}

.thankyou-order-review .order-item {
  display: grid;
  grid-template-columns: 60px 1fr auto auto;
  gap: 12px;
  align-items: center;
  padding: 12px 0;
}

.thankyou-order-review .order-item:first-child {
  padding-top: 0;
}

.thankyou-order-review .order-item:last-child {
  padding-bottom: 0;
}

.thankyou-order-review .order-item + .order-item {
  border-top: 1px solid var(--border-light, #f0f0f0);
}

.thankyou-order-review .order-item-image {
  width: 64px;
  height: 80px;
  border-radius: 8px;
  overflow: visible;
  background: transparent;
}

.thankyou-order-review .order-item-image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.thankyou-order-review .order-item-details {
  min-width: 0;
}

.thankyou-order-review .order-item-name {
  font-size: 14px;
  font-weight: 500;
  color: var(--black);
  margin-bottom: 4px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.thankyou-order-review .order-item-meta {
  font-size: 12px;
  color: var(--grey);
}

.thankyou-order-review .order-item-qty {
  font-size: 14px;
  color: var(--grey);
  white-space: nowrap;
}

.thankyou-order-review .order-item-price .price-current {
  font-size: 14px;
  font-weight: 500;
  color: var(--black);
}

.thankyou-order-review .order-totals {
  padding: 16px 20px;
  background: var(--bg-light, #fafafa);
  border-top: 1px solid var(--border);
}

.thankyou-order-review .order-total-row {
  display: flex;
  justify-content: space-between;
  font-size: 14px;
  color: var(--grey);
  margin-bottom: 8px;
}

.thankyou-order-review .order-total-row:last-child {
  margin-bottom: 0;
}

.thankyou-order-review .order-total-row.discount span:last-child {
  color: #22c55e;
}

.thankyou-order-review .order-total-row.total {
  padding-top: 12px;
  margin-top: 12px;
  border-top: 1px solid var(--border);
  font-size: 16px;
  font-weight: 500;
  color: var(--black);
}

.thankyou-order-review .order-total-row.total .total-amount {
  font-size: 20px;
  font-weight: 600;
  color: var(--primary);
}

/* Bottom Actions */
.thankyou-actions-bottom {
  display: flex;
  gap: 12px;
  margin-top: 20px;
}

.btn-continue,
.btn-orders {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 48px;
  padding: 0 20px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  transition: all 0.2s ease;
}

.btn-continue {
  background: var(--white);
  color: var(--black);
  border: 1px solid var(--border);
}

.btn-continue:hover {
  border-color: var(--black);
}

.btn-orders {
  background: var(--primary);
  color: var(--white);
  border: none;
}

.btn-orders:hover {
  background: var(--primary-hover, #7b1c2e);
}

/* Thank You Responsive */
@media (max-width: 900px) {
  .thankyou-columns {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .thankyou-order-col {
    position: static;
    order: -1;
  }
}

@media (max-width: 600px) {
  .thankyou-page {
    padding: 24px 16px 40px;
  }

  .thankyou-title {
    font-size: 24px;
  }

  .thankyou-success,
  .thankyou-error,
  .thankyou-no-order {
    padding: 24px 16px;
    margin-bottom: 24px;
  }

  .thankyou-success-icon,
  .thankyou-error-icon {
    width: 64px;
    height: 64px;
  }

  .thankyou-success-icon svg,
  .thankyou-error-icon svg {
    width: 48px;
    height: 48px;
  }

  .thankyou-order-review .order-item {
    grid-template-columns: 48px 1fr;
    gap: 10px;
  }

  .thankyou-order-review .order-item-qty,
  .thankyou-order-review .order-item-price {
    grid-column: 2;
  }

  .thankyou-actions-bottom {
    flex-direction: column;
  }

  .info-row {
    flex-direction: column;
    gap: 4px;
  }

  .info-value {
    text-align: left;
  }
}

/* Checkout Responsive */
@media (max-width: 900px) {
  .checkout-columns {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .checkout-order-col {
    position: static;
    order: -1;
  }
}

@media (max-width: 600px) {
  .checkout-page {
    padding: 24px 0;
  }

  .checkout-title {
    font-size: 24px;
  }

  .form-row-double {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .order-item {
    grid-template-columns: 48px 1fr;
    gap: 10px;
  }

  .order-item-qty,
  .order-item-price {
    grid-column: 2;
  }

  .order-item-qty {
    font-size: 12px;
  }

  .order-item-price .price-current {
    font-size: 14px;
  }
}

/* Animation for results */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.products-grid .product {
    animation: fadeIn 0.4s ease;
}

/* Active Filter Indicator */
.filter-select:not([value=""]),
.filter-select option:checked:not([value=""]) {
    font-weight: 500;
}

/* Custom scrollbar */
.filter-select::-webkit-scrollbar {
    width: 6px;
}

.filter-select::-webkit-scrollbar-track {
    background: #F5F5F5;
}

.filter-select::-webkit-scrollbar-thumb {
    background: #CCC;
    border-radius: 3px;
}

.filter-select::-webkit-scrollbar-thumb:hover {
    background: #999;
}
.filters-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    grid-template-rows: 1fr;
    grid-column-gap: 12px;
}

/* ========================================
   Wine Evolution Section Wrapper
   ======================================== */

.wine-evolution-section {
    margin-top: 80px;
    font-family: 'VisueltPro', sans-serif;
}

.wine-evolution-title {
    font-size: 44px;
    font-weight: 400;
    margin-bottom: 24px;
    color: #000;
    font-family: 'VisueltPro', sans-serif;
    line-height: 1.2;
    letter-spacing: -0.88px;
}

.wine-evolution-section .evolution-intro {
    max-width: 800px;
    margin-bottom: 40px;
    color: #7f7f7f;
    line-height: 1.5;
    font-size: 18px;
    letter-spacing: -0.36px;
}

.wine-evolution-section .evolution-intro p {
    margin: 0 0 8px;
}

.wine-evolution-section .evolution-intro p strong {
    color: #000;
    font-weight: 500;
}

/* ========================================
   Wine Evolution - Еволюція смаку вина
   ======================================== */

.wine-evolution {
    font-family: 'VisueltPro', sans-serif;
}

.wine-evolution-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
}

.wine-evolution-header h3 {
    font-size: 20px;
    font-weight: 400;
    margin: 0;
    font-family: 'VisueltPro', sans-serif;
}

.evolution-diary-link {
    color: var(--accent);
    text-decoration: none;
    font-weight: 500;
}

.evolution-diary-link:hover {
    text-decoration: underline;
}

/* Evolution Section - Based on Figma */
.evolution-section {
    margin-bottom: 60px;
}

.evolution-section:last-of-type {
    margin-bottom: 0;
}

.evolution-section-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0;
}

.evolution-section-header h4 {
    font-size: 44px;
    font-weight: 400;
    margin: 0;
    font-family: 'VisueltPro', sans-serif;
    line-height: 1.2;
    letter-spacing: -0.88px;
    color: #000;
}

.evolution-nav {
    display: flex;
    gap: 14px;
}

.evolution-nav-btn {
    width: 48px;
    height: 48px;
    border: 1px solid #dbdbdb;
    border-radius: 300px;
    background: #fff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    color: #333;
    transition: all 0.2s;
}

.evolution-nav-btn:hover {
    border-color: #333;
}

/* Years Slider Container - Figma style */
.evolution-years-slider {
    background: #f0f0f0;
    border-radius: 24px;
    padding: 16px;
    margin-top: 90px;
    position: relative;
}

.evolution-years-track {
    display: flex;
    gap: 12px;
    overflow-x: auto;
    scroll-behavior: smooth;
    scrollbar-width: none;
    padding-bottom: 60px;
}

.evolution-years-track::-webkit-scrollbar {
    display: none;
}

/* Year Card - Figma exact specs */
.evolution-year-card {
    flex: 0 0 219px;
    min-width: 219px;
    height: 528px;
    background: #fff;
    border-radius: 12px;
    padding: 12px;
    display: flex;
    flex-direction: column;
    box-shadow: 0px 4px 6px -1px rgba(0,0,0,0.1), 0px 2px 4px -1px rgba(0,0,0,0.06);
}

.evolution-year-card.no-data {
    background: #fff;
}

.evolution-year-card.no-data .evolution-color-preview {
    border: 1px solid #d2d2d2;
    background: transparent;
}

/* Year Label - bottom of card */
.evolution-year-label {
    font-size: 28px;
    font-weight: 500;
    font-family: 'VisueltPro', sans-serif;
    text-align: center;
    margin-top: auto;
    line-height: 1.5;
    letter-spacing: -0.56px;
    color: #000;
}

/* "Рік" label */
.evolution-year-title {
    font-size: 32px;
    font-weight: 500;
    font-family: 'VisueltPro', sans-serif;
    line-height: 1.2;
    letter-spacing: -0.64px;
    color: #000;
    position: absolute;
    top: 94px;
    left: 50%;
    transform: translateX(-50%);
}

/* Color Preview Box */
.evolution-color-preview {
    height: 150px;
    border-radius: 16px;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.evolution-color-preview.no-data {
    border: 1px solid #d2d2d2;
}

.evolution-color-preview-text {
    font-size: 16px;
    font-weight: 500;
    font-family: 'VisueltPro', sans-serif;
    color: #000;
    letter-spacing: -0.32px;
}

/* Color Bars in Card */
.evolution-bars {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 0 4px;
}

.evolution-bar-item {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.bar-label {
    font-size: 14px;
    font-weight: 500;
    font-family: 'VisueltPro', sans-serif;
    color: #000;
    letter-spacing: -0.28px;
    line-height: 1.5;
}

.bar-container {
    height: 66px;
    background: transparent;
    border-radius: 16px;
    overflow: hidden;
}

.bar-fill {
    height: 100%;
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: center;
    padding-left: 12px;
    transition: width 0.3s ease;
    background-color: #E5A00D; /* дефолтний колір якщо не заданий */
}

.bar-count {
    font-size: 11px;
    font-weight: 500;
    font-family: 'VisueltPro', sans-serif;
    color: #000;
    background: #fff;
    padding: 4px 10px;
    border-radius: 8px;
    letter-spacing: -0.24px;
    white-space: nowrap;
}

/* Color-specific bars - Figma colors */
.evolution-color .bar-fill {
    background: var(--bar-color, #f5ee7e);
}

.bar-fill[data-color="lemon"],
.bar-fill.color-lemon {
    background: #f5ee7e;
}

.bar-fill[data-color="gold"],
.bar-fill.color-gold {
    background: #f3f2b3;
}

.bar-fill[data-color="purple"],
.bar-fill.color-purple {
    background: #683588;
}

/* Evolution Users - people who chose */
.evolution-users {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-top: auto;
    padding-top: 12px;
}

.evolution-users-text {
    font-size: 18px;
    font-weight: 400;
    font-family: 'VisueltPro', sans-serif;
    color: #7f7f7f;
    line-height: 1.5;
    letter-spacing: -0.36px;
}

.evolution-avatars {
    display: flex;
    margin-top: 8px;
}

.evolution-avatar {
    width: 40px;
    height: 40px;
    border-radius: 999px;
    border: 1px solid #fff;
    margin-left: -9px;
    object-fit: cover;
    background: #e0e0e0;
}

.evolution-avatar:first-child {
    margin-left: 0;
}

.evolution-users-count {
    font-size: 10px;
    color: #999;
}

/* No Data State */
.evolution-no-data {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100px;
}

.evolution-no-data span {
    font-size: 12px;
    color: #999;
}

/* Characteristics Charts */
.evolution-section-subtitle {
    font-size: 14px;
    color: #888;
    margin-top: 8px;
    font-family: 'VisueltPro', sans-serif;
}

.characteristics-charts {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    margin-top: 24px;
}

.characteristic-chart {
    border-radius: 12px;
    overflow: hidden;
    background: #F9F9F9;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}

.characteristic-chart .chart-svg {
    width: 100%;
    height: auto;
    display: block;
}

/* Demographics Table */
/* Demographics — card grid */
.demo-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
    margin-top: 40px;
}

.demo-year-block {
    border: 1px solid #E5E5E5;
    border-radius: 20px;
    overflow: hidden;
    background: #fff;
    transition: box-shadow 0.2s;
}

.demo-year-block:hover {
    box-shadow: 0 4px 24px rgba(0,0,0,0.06);
}

.demo-year-label {
    font-size: 22px;
    font-weight: 700;
    color: #000;
    padding: 20px 24px 12px;
    font-family: 'VisueltPro', sans-serif;
}

.demo-genders {
    display: flex;
    flex-direction: column;
    gap: 1px;
    background: #F0F0F0;
}

.demo-gender-row {
    background: #fff;
    padding: 16px 24px;
}

.demo-gender-icon {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    font-size: 13px;
    font-weight: 500;
    color: #555;
}

.demo-gender-icon svg {
    width: 18px;
}

.demo-gender--male .demo-gender-icon {
    color: #4A6FA5;
}

.demo-gender--female .demo-gender-icon {
    color: #B5577A;
}

.demo-age-cells {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
}

.demo-age-cell {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 10px 4px;
    border-radius: 12px;
    background: #F8F8F8;
}

.demo-age-label {
    font-size: 11px;
    color: #888;
    white-space: nowrap;
}

.demo-rating-badge {
    font-size: 18px;
    font-weight: 700;
    color: #BFBFBF;
    line-height: 1;
}

.demo-rating-badge.high {
    color: #2E7D32;
}

.demo-rating-badge.mid {
    color: #E8A838;
}

.demo-rating-badge.low {
    color: #C0392B;
}

.demo-count {
    font-size: 11px;
    color: #AAA;
}

/* Wine Peak */
.evolution-peak {
    margin-top: 90px;
}

.peak-container {
    display: flex;
    align-items: flex-start;
    gap: 40px;
}

.peak-header h4 {
    font-size: 44px;
    font-weight: 400;
    margin: 0;
    white-space: nowrap;
    padding-top: 60px;
}

.peak-cards {
    display: flex;
    gap: 16px;
    flex: 1;
    background: #f0f0f0;
    padding: 8px;
    border-radius: 10px;
}

/* Featured (first) card */
.peak-card--featured {
    width: 235px;
    height: 156px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08), 0 2px 6px rgba(0, 0, 0, 0.04);
    display: flex;
    flex-direction: column;
    padding: 20px;
    flex-shrink: 0;
}

.peak-card--featured .peak-card__year {
    font-size: 32px;
    font-weight: 700;
    color: #1a1a1a;
    line-height: 1;
}

.peak-card--featured .peak-card__bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: auto;
}

.peak-card--featured .peak-card__stats {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.peak-card--featured .peak-card__count {
    font-size: 18px;
    font-weight: 600;
    color: #1a1a1a;
    line-height: 1.2;
}

.peak-card--featured .peak-card__label {
    font-size: 12px;
    color: #7F7F7F;
}

/* Secondary cards (same structure as featured) */
.peak-card--secondary {
    width: 235px;
    height: 156px;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    padding: 20px;
}

.peak-card--secondary .peak-card__year {
    font-size: 32px;
    font-weight: 700;
    color: #1a1a1a;
    line-height: 1;
}

.peak-card--secondary .peak-card__bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: auto;
}

.peak-card--secondary .peak-card__stats {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.peak-card--secondary .peak-card__count {
    font-size: 18px;
    font-weight: 600;
    color: #1a1a1a;
    line-height: 1.2;
}

.peak-card--secondary .peak-card__label {
    font-size: 12px;
    color: #7F7F7F;
}

.peak-card--secondary .peak-card__avatars {
    display: flex;
}

.peak-card--secondary .peak-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    overflow: hidden;
    border: 2px solid #F0F0F0;
    margin-left: -8px;
    background: #E0E0E0;
    flex-shrink: 0;
}

.peak-card--secondary .peak-avatar:first-child {
    margin-left: 0;
}

.peak-card--secondary .peak-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.peak-card--featured .peak-card__avatars {
    display: flex;
}

.peak-card--featured .peak-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    overflow: hidden;
    border: 2px solid #fff;
    margin-left: -8px;
    background: #E0E0E0;
    flex-shrink: 0;
}

.peak-card--featured .peak-avatar:first-child {
    margin-left: 0;
}

.peak-card--featured .peak-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

/* Peak wine year — gold crown card */
.peak-wine-year {
    background: linear-gradient(135deg, #FFF8E1, #FFE082) !important;
    border: 2px solid #FFD54F !important;
    position: relative;
}

.peak-wine-year::before {
    content: '';
    position: absolute;
    top: 12px;
    right: 16px;
    width: 28px;
    height: 28px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23F9A825'%3E%3Cpath d='M2 19h20v3H2zM5 3l3.5 7L12 6l3.5 4L19 3l-1 10H6z'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
}

.peak-wine-year .peak-card__year {
    color: #E65100 !important;
}

.peak-wine-year .peak-card__count {
    color: #E65100 !important;
}

/* Evolution Toggle Button */
.wine-evolution-toggle {
    display: block;
    width: 100%;
    max-width: 300px;
    margin: 32px 0 0;
    background: #FFD53C;
    color: black;
    border: none;
    padding: 12px 24px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.2s;
}

.wine-evolution-toggle.outline {
    color: black;
}

.wine-evolution-toggle:hover {
    background: #c48a0b;
}

/* Collapsed state */
.wine-evolution.collapsed .evolution-section {
    display: none;
}

.wine-evolution.collapsed .wine-evolution-header {
    margin-bottom: 0;
}

.wine-evolution.collapsed .wine-evolution-toggle {
    margin-top: 16px;
}

/* Evolution Locked State */
.wine-evolution-locked {
    background: #F9F9F9;
    border-radius: 12px;
    padding: 48px 32px;
    text-align: center;
    margin-top: 40px;
}

.evolution-lock-icon {
    color: #999;
    margin-bottom: 16px;
    display: flex;
    justify-content: center;
}

.evolution-lock-icon svg {
    width: 50px !important;
}

.wine-evolution-locked h4 {
    font-size: 20px;
    font-weight: 600;
    margin: 0 0 12px 0;
}

.wine-evolution-locked p {
    color: #666;
    margin: 0 0 24px 0;
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
}

.wine-evolution-locked .k-button {
    margin: 0 8px;
}

/* Responsive */
@media (max-width: 768px) {
    .wine-evolution {
        padding: 20px;
    }

    .characteristics-charts {
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
    }

    .evolution-year-card {
        flex: 0 0 150px;
        /* min-width: 150px; */
    }

    .peak-container {
        flex-direction: column;
        gap: 20px;
    }

    .peak-header h4 {
        font-size: 28px;
        padding-top: 0;
    }

    .peak-cards {
        flex-wrap: wrap;
    }

    .peak-card--featured,
    .peak-card--secondary {
        width: 100%;
        max-width: 280px;
        height: auto;
        min-height: 140px;
    }

    .demo-grid {
        grid-template-columns: 1fr;
    }

    .demo-year-label {
        font-size: 18px;
        padding: 16px 16px 10px;
    }

    .demo-gender-row {
        padding: 12px 16px;
    }

    .demo-age-cells {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 480px) {
    .characteristics-charts {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .evolution-section-subtitle {
        font-size: 13px;
    }
}

.product-single-top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 35px;
}

.product-single-gallery {
	height: 540px;
}

/* .wine-item-image::before {
	height: 540px;
} */

.woocommerce-form-coupon-toggle {
    display: none;
}

/* Feedback Form Page */
.feedback-page {
    padding: 40px 0 80px;
}

.feedback-page .breadcrumbs {
    margin-bottom: 32px;
    font-size: 14px;
    color: #666;
}

.feedback-page .breadcrumbs a {
    color: #666;
    text-decoration: none;
}

.feedback-page .breadcrumbs a:hover {
    color: var(--accent);
}

.feedback-page .breadcrumbs span {
    margin: 0 8px;
}

.feedback-title {
    font-size: 32px;
    font-weight: 600;
    margin-bottom: 40px;
}

.feedback-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: start;
}

/* Product Card */
.feedback-product {
    display: flex;
    gap: 24px;
}

.feedback-product-image {
    width: 180px;
    flex-shrink: 0;
}

.feedback-product-image img {
    width: 100%;
    height: auto;
}

.feedback-product-info {
    flex: 1;
}

.feedback-product-name {
    font-size: 20px;
    font-weight: 600;
    margin: 0 0 8px;
}

.feedback-product-winery {
    font-size: 14px;
    font-weight: 500;
    color: #333;
    margin-bottom: 16px;
}

.feedback-product-meta {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 20px;
}

.feedback-product-meta .meta-item {
    font-size: 13px;
    color: #666;
}

.feedback-product-meta .meta-location {
    display: flex;
    align-items: center;
    gap: 6px;
}

.feedback-product-meta .meta-location svg {
    color: #999;
}

.feedback-product-price {
    display: flex;
    align-items: center;
    gap: 12px;
}

.feedback-product-price .price-old {
    font-size: 14px;
    color: #999;
    text-decoration: line-through;
}

.feedback-product-price .price-current {
    font-size: 24px;
    font-weight: 600;
}

/* Form */
.feedback-form-wrapper {
    background: #fff;
    border-radius: 12px;
    padding: 32px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
}

.feedback-error {
    background: #fee;
    color: #c00;
    padding: 12px 16px;
    border-radius: 8px;
    margin-bottom: 20px;
    font-size: 14px;
}

.feedback-login-required {
    text-align: center;
    padding: 40px 20px;
}

.feedback-login-required a {
    color: var(--accent);
    font-weight: 500;
}

.form-group {
    margin-bottom: 24px;
}

.form-label {
    display: block;
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 12px;
    color: #333;
}

/* Rating Input */
.rating-input {
    display: flex;
    gap: 8px;
}

.rating-input input {
    display: none;
}

.rating-star {
    cursor: pointer;
    color: #ddd;
    transition: color 0.2s;
}

.rating-star svg {
    display: block;
}

.rating-input input:checked ~ label .rating-star,
.rating-star:hover,
.rating-star:hover ~ .rating-star {
    color: #ddd;
}

.rating-input label:hover svg,
.rating-input label:hover ~ label svg,
.rating-input input:checked + label svg,
.rating-input input:checked + label ~ label svg {
    fill: #F5C842;
    stroke: #F5C842;
}

.rating-input label svg {
    fill: none;
    stroke: #ddd;
}

/* Fix rating - reverse order highlight */
.rating-input {
    display: flex;
    flex-direction: row-reverse;
    justify-content: flex-end;
}

.rating-input label:hover svg,
.rating-input label:hover ~ label svg {
    fill: #F5C842;
    stroke: #F5C842;
}

.rating-input input:checked + label svg,
.rating-input input:checked ~ label svg {
    fill: #F5C842;
    stroke: #F5C842;
}

/* Textarea */
.form-textarea {
    width: 100%;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: 16px;
    font-size: 14px;
    font-family: inherit;
    resize: vertical;
    min-height: 120px;
    transition: border-color 0.2s;
}

.form-textarea:focus {
    outline: none;
    border-color: var(--accent);
}

.form-textarea::placeholder {
    color: #999;
}

/* Submit Button */
.feedback-submit {
    width: 100%;
    padding: 16px 32px;
    font-size: 16px;
}

/* Success State */
.feedback-success {
    text-align: center;
    padding: 80px 40px;
    max-width: 500px;
    margin: 0 auto;
}

.feedback-success-icon {
    color: #4CAF50;
    margin-bottom: 24px;
}

.feedback-success h2 {
    font-size: 24px;
    margin-bottom: 12px;
}

.feedback-success p {
    color: #666;
    margin-bottom: 32px;
}

/* Responsive */
@media (max-width: 992px) {
    .feedback-content {
        grid-template-columns: 1fr;
        gap: 40px;
    }
}

@media (max-width: 576px) {
    .feedback-product {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .feedback-product-image {
        width: 140px;
    }

    .feedback-product-meta {
        align-items: center;
    }

    .feedback-form-wrapper {
        padding: 24px 16px;
    }

    .feedback-title {
        font-size: 24px;
    }
}

/* Feedback Modal */
.feedback-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s, visibility 0.3s;
}

.feedback-modal.active {
    opacity: 1;
    visibility: visible;
}

.feedback-modal-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
}

.feedback-modal-content {
    position: relative;
    background: #fff;
    border-radius: 16px;
    padding: 48px 56px;
    max-width: 520px;
    width: 90%;
    text-align: center;
    transform: scale(0.9);
    transition: transform 0.3s;
}

.feedback-modal.active .feedback-modal-content {
    transform: scale(1);
}

.feedback-modal-close {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 32px;
    height: 32px;
    border: none;
    background: none;
    font-size: 24px;
    color: #999;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.2s;
}

.feedback-modal-close:hover {
    color: #333;
}

.feedback-modal-icon {
    margin-bottom: 20px;
}

.feedback-modal-icon svg {
    display: inline-block;
}

.feedback-modal-title {
    font-size: 24px;
    font-weight: 600;
    margin: 0 0 12px;
}

.feedback-modal-text {
    font-size: 14px;
    color: #666;
    margin: 0 0 28px;
}

.feedback-modal-buttons {
    display: flex;
    gap: 12px;
    justify-content: center;
}

.feedback-modal-buttons .k-button {
    flex: 1;
    max-width: 160px;
}

@media (max-width: 576px) {
    .feedback-modal-content {
        padding: 32px 24px;
    }

    .feedback-modal-buttons {
        flex-direction: column;
    }

    .feedback-modal-buttons .k-button {
        max-width: none;
    }
}

/* ==========================================
   PRODUCT SINGLE MOBILE - FIGMA DESIGN
   ========================================== */

@media (max-width: 767px) {
    /* Product top section - vertical layout */
    .product-single-top {
        display: flex;
        flex-direction: column;
        gap: 24px;
        margin-top: 16px;
        padding: 0 16px;
    }

    /* Product gallery - centered */
    .product-single-gallery {
        width: 100%;
        max-width: 280px;
        height: auto;
        margin: 0 auto;
    }

    .product-single-gallery .woocommerce-product-gallery__image img {
        width: 100%;
        height: auto;
        object-fit: contain;
    }

    /* Summary section */
    .product-single-top .summary.entry-summary {
        width: 100%;
        max-width: 100%;
        padding: 0;
        margin-top: 90px;
    }

    /* Product title */
    .product-single .product_title {
        font-size: 24px;
        line-height: 1.3;
        margin-bottom: 16px;
    }

    /* Wine product meta info */
    .wine-product-meta {
        display: flex;
        flex-direction: column;
        gap: 12px;
        margin-bottom: 24px;
    }

    .wine-product-winery {
        font-size: 16px;
        font-weight: 500;
        color: var(--decorative, #C80D22);
    }

    .wine-product-type,
    .wine-product-grape,
    .wine-product-aging,
    .wine-product-alcohol {
        font-size: 14px;
        color: var(--gray-text, #7F7F7F);
        line-height: 1.5;
    }

    .wine-product-location {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 14px;
        color: var(--gray-text, #7F7F7F);
    }

    .wine-product-location svg {
        width: 20px;
        height: 20px;
        flex-shrink: 0;
    }

    /* Rating section */
    .wine-product-rating {
        display: flex;
        flex-direction: column;
        gap: 8px;
        margin-bottom: 24px;
    }

    .wine-product-rating .rating-text {
        font-size: 16px;
        color: var(--black, #000);
    }

    .wine-product-rating .rating-count {
        font-size: 16px;
        color: var(--gray-text, #7F7F7F);
    }

    .wine-product-rating .star-rating {
        display: flex;
        gap: 4px;
    }

    /* Price section - Figma style */
    .product-single .summary .price {
        display: flex;
        align-items: baseline;
        gap: 8px;
        margin: 16px 0;
    }

    .product-single .summary .price del {
        font-size: 16px;
        font-weight: 400;
        color: #8b8b8b;
        text-decoration: line-through;
        order: 1;
    }

    .product-single .summary .price ins,
    .product-single .summary .price > .woocommerce-Price-amount {
        font-size: 32px;
        font-weight: 500;
        color: var(--black, #000);
        text-decoration: none;
        order: 2;
    }

    .product-single .summary .price ins {
        background: none;
    }

    /* Cart form - quantity + button side by side */
    .product-single .summary .cart,
    .product-single-main .cart {
        display: flex;
        flex-wrap: nowrap;
        align-items: stretch;
        gap: 12px;
        margin-top: 16px;
    }

    /* Quantity wrapper - Figma style */
    .product-single .summary .cart .qty-wrapper,
    .product-single-main .cart .qty-wrapper,
    .woocommerce div.product form.cart .qty-wrapper {
        flex: 0 0 140px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        height: 56px;
        padding: 10px 12px;
        border: 1px solid var(--border, #DBDBDB);
        border-radius: 12px;
        background: var(--white, #fff);
    }

    .product-single .summary .cart .qty-wrapper input.qty,
    .product-single-main .cart .qty-wrapper input.qty {
        flex: 1;
        width: 40px;
        height: auto;
        padding: 0;
        border: none !important;
        text-align: center;
        font-size: 24px;
        font-weight: 500;
        font-family: 'Visuelt Pro', sans-serif;
        background: transparent;
        -moz-appearance: textfield;
    }

    .product-single .summary .cart .qty-wrapper input.qty::-webkit-outer-spin-button,
    .product-single .summary .cart .qty-wrapper input.qty::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

    /* Quantity buttons */
    .product-single .summary .cart .qty-wrapper button,
    .product-single-main .cart .qty-wrapper button {
        width: 24px;
        height: 24px;
        display: flex;
        align-items: center;
        justify-content: center;
        border: none;
        background: transparent;
        cursor: pointer;
        padding: 0;
        color: var(--black, #000);
    }

    .product-single .summary .cart .qty-wrapper button svg {
        width: 18px;
        height: 18px;
    }

    /* Add to cart button */
    .product-single .summary .cart .single_add_to_cart_button,
    .product-single .summary .cart .button,
    .product-single-main .cart .button {
        flex: 1;
        min-width: 0;
        height: 56px;
        padding: 6px 24px;
        font-size: 18px;
        font-weight: 500;
        border-radius: 12px;
        background: var(--primary, #C80D22);
        color: #fff;
        border: none;
    }

    /* Diary sidebar - banner style */
    .product-diary-sidebar {
        width: 100%;
        margin-top: 24px;
        padding: 16px;
        background: #F8F3EE;
        border-radius: 16px;
    }

    .product-diary-sidebar .diary-banner-title {
        font-size: 18px;
        font-weight: 500;
        color: var(--black, #000);
        margin-bottom: 12px;
    }

    .product-diary-sidebar .diary-banner-text {
        font-size: 14px;
        color: var(--gray-text, #7F7F7F);
        line-height: 1.5;
        margin-bottom: 16px;
    }

    .product-diary-sidebar .diary-banner-btn {
        width: 100%;
        height: 48px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 16px;
        font-weight: 500;
        color: var(--black, #000);
        background: var(--white, #fff);
        border: 1px solid var(--border, #DBDBDB);
        border-radius: 12px;
        cursor: pointer;
    }

    /* WooCommerce specific overrides */
    .woocommerce div.product form.cart {
        display: flex;
        flex-wrap: nowrap;
        gap: 12px;
        align-items: stretch;
    }

    .woocommerce div.product form.cart div.quantity {
        margin: 0;
        float: none;
        width: auto;
    }

    .woocommerce div.product form.cart .button {
        margin: 0;
        float: none;
        flex: 1;
    }

    /* Hide default quantity if wrapped */
    .woocommerce div.product form.cart .quantity:has(.qty-wrapper) {
        display: contents;
    }

    /* Wine Tabs Section - Collapsible on mobile */
    .wine-tabs-section {
        margin-top: 32px;
        padding: 0 16px;
    }

    /* Wine Evolution Section Header (standalone title) - mobile */
    .wine-tabs-section > .wine-evolution-header {
        margin-bottom: 20px;
    }

    .wine-tabs-section > .wine-evolution-header .wine-evolution-title {
        font-size: 24px;
    }

    .wine-tabs-section .wine-tabs-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 24px;
    }

    .wine-tabs-section .wine-tabs-title {
        font-family: 'Visuelt Pro', sans-serif;
        font-size: 28px;
        font-weight: 500;
        line-height: 1.5;
        color: #000;
        letter-spacing: -0.56px;
    }

    .wine-tabs-section .wine-tabs-toggle {
        width: 40px;
        height: 40px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: var(--white, #fff);
        border: 1px solid var(--border, #DBDBDB);
        border-radius: 50%;
        cursor: pointer;
        flex-shrink: 0;
        transition: transform 0.3s ease;
    }

    .wine-tabs-section .wine-tabs-toggle svg {
        width: 24px;
        height: 24px;
        transition: transform 0.3s ease;
    }

    .wine-tabs-section.collapsed .wine-tabs-toggle svg {
        transform: rotate(180deg);
    }

    .wine-tabs-section.collapsed .wine-tabs-container,
    .wine-tabs-section.collapsed .wine-tab-content {
        display: none;
    }

    /* Wine tabs - horizontal scroll on mobile */
    .wine-tabs-container {
        display: flex;
        gap: 12px;
        overflow-x: auto;
        padding-bottom: 8px;
        margin-bottom: 16px;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .wine-tabs-container::-webkit-scrollbar {
        display: none;
    }

    .wine-tab {
        flex-shrink: 0;
        padding: 10px 20px;
        font-size: 16px;
        white-space: nowrap;
    }

    /* Extended characteristics button - yellow */
    .wine-extended-characteristics-btn {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 12px;
        padding: 16px 56px;
        background: #FFD53C;
        border: none;
        border-radius: 12px;
        font-family: 'Visuelt Pro', sans-serif;
        font-size: 16px;
        font-weight: 500;
        color: #000;
        cursor: pointer;
        margin-top: 16px;
    }

    .wine-extended-characteristics-btn svg {
        width: 24px;
        height: 24px;
        flex-shrink: 0;
    }
}

/* Product Single Mobile - Additional Fixes */
@media (max-width: 480px) {
    .product-single-top {
        padding: 0 12px;
    }

    .product-single-gallery {
        max-width: 240px;
    }

    .product-single .summary .cart .qty-wrapper,
    .product-single-main .cart .qty-wrapper {
        flex: 0 0 120px;
        height: 48px;
        padding: 8px 10px;
    }

    .product-single .summary .cart .qty-wrapper input.qty {
        font-size: 20px;
    }

    .product-single .summary .cart .single_add_to_cart_button,
    .product-single .summary .cart .button {
        height: 48px;
        font-size: 16px;
        padding: 6px 16px;
    }

    .product-single .summary .price ins,
    .product-single .summary .price > .woocommerce-Price-amount {
        font-size: 28px;
    }

    .header_search {
        margin: 0;
        max-width: none;
    }
}

/* Header Mobile Adjustments */
@media (max-width: 768px) {
    .header_logo img {
        height: 38px;
        width: auto;
    }

    .header_cart {
        gap: 12px;
        padding: 0 10px;
        border: 1px solid var(--border);
        height: 40px;
        border-radius: 31px;
    }

    .wine-evolution {
        padding: 0;
    }

    /* Mobile collapsible sections */
    .mobile-features-section,
    .mobile-evolution-section {
        margin: 24px 0;
    }

    .mobile-section-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 16px;
        cursor: pointer;
    }

    .mobile-section-title {
        font-family: 'Visuelt Pro', sans-serif;
        font-size: 28px;
        font-weight: 500;
        line-height: 1.5;
        color: #000;
        letter-spacing: -0.56px;
    }

    .mobile-section-toggle {
        width: 40px;
        height: 40px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: var(--white, #fff);
        border: 1px solid var(--border, #DBDBDB);
        border-radius: 50%;
        cursor: pointer;
        flex-shrink: 0;
    }

    .mobile-section-toggle svg {
        width: 24px;
        height: 24px;
        transition: transform 0.3s ease;
    }

    .mobile-features-section.collapsed .mobile-section-toggle svg {
        transform: rotate(180deg);
    }

    .mobile-section-content {
        padding: 16px;
        overflow: hidden;
    }

    .mobile-features-section.collapsed .mobile-section-content,
    .mobile-evolution-section.collapsed .mobile-section-content {
        display: none;
    }

    /* Extended characteristics button for evolution */
    .mobile-evolution-section .wine-extended-characteristics-btn {
        display: flex;
        width: calc(100% - 32px);
        margin: 0 16px;
    }

    .wine-tabs-section {
        margin-top: 32px;
        padding: 0;
    }

    .mobile-section-header {
        padding: 0;
    }
}

@media (max-width: 768px) {
    .wine-collection-section {
        padding: 0;
    }

    .mobile-evolution-section .wine-extended-characteristics-btn {
        display: flex;
        width: 100%;
        margin: 0;
    }
}

@media (max-width: 480px) {
    .product-single-top {
        padding: 0;
    }
}