/* =========================================================
   SINGLE PRODUCT PAGE
   ========================================================= */


/* SINGLE PRODUCT HEADER */

.single-product-page .header {
  position:relative;
  top:auto;
  left:auto;
  background:rgba(255,255,255,.96);
  border-bottom:1px solid rgba(189,64,52,.1);
}

.single-product-page .header__inner {
  min-height:104px;
  align-items:center;
}

.single-product-page .header__logo {
  margin-top:0;
}

.single-product-page .header__actions {
  padding-top:0;
}

.single-product-page .header__icon img {
  filter:brightness(0);
}


/* SINGLE PRODUCT GLOBAL */

.single-product-main {
  position:relative;
  z-index:1;
}

.single-product__container,
.related-products__container {
  width:min(var(--container),calc(100% - var(--gutter) * 2));
  margin:0 auto;
}


/* PRODUCT BREADCRUMBS */

.product-breadcrumbs {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:30px;
  color:rgba(17,17,17,.46);
  font-size:13px;
  line-height:1.3;
}

.product-breadcrumbs a {
  transition:color .2s ease;
}

.product-breadcrumbs a:hover {
  color:var(--red);
}


/* PRODUCT */

.single-product {
  background:rgba(255,255,255,.88);
}

.product-layout {
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(420px,.88fr);
  gap:72px;
  align-items:start;
}


/* PRODUCT GALLERY */

.product-gallery {
  min-width:0;
}

.product-gallery__main {
  width:100%;
  aspect-ratio:1/1;
  overflow:hidden;
  background:#f7f2f0;
}

.product-gallery__main img {
  width:100%;
  height:100%;
  object-fit:cover;
}

.product-gallery__thumbs {
  display:grid;
  grid-template-columns:repeat(3,88px);
  gap:10px;
  margin-top:14px;
}

.product-gallery__thumb {
  position:relative;
  width:88px;
  height:88px;
  overflow:hidden;
  background:#f7f2f0;
  border:1px solid transparent;
  opacity:.62;
  transition:opacity .2s ease,border-color .2s ease;
}

.product-gallery__thumb:hover,
.product-gallery__thumb.is-active {
  opacity:1;
  border-color:var(--red);
}

.product-gallery__thumb img {
  width:100%;
  height:100%;
  object-fit:cover;
}


/* PRODUCT SUMMARY */

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

.product-summary__inner {
  position:sticky;
  top:30px;
}

.product-summary__category {
  display:inline-block;
  margin-bottom:14px;
  color:var(--red);
  font-size:13px;
  line-height:1;
  letter-spacing:.09em;
  text-transform:uppercase;
}

.product-summary__title {
  max-width:620px;
  margin:0;
  font-size:clamp(46px,4vw,70px);
  font-weight:400;
  line-height:.98;
  letter-spacing:-.035em;
}

.product-summary__price {
  margin-top:24px;
  color:var(--red);
  font-size:30px;
  font-weight:700;
  line-height:1;
}

.product-summary__description {
  max-width:600px;
  margin:28px 0 0;
  color:rgba(17,17,17,.66);
  font-size:17px;
  line-height:1.65;
}


/* PRODUCT PURCHASE */

/* PRODUCT BENEFITS */

.product-benefits {
  display:grid;
  gap:11px;
  margin-top:28px;
  padding:22px 0;
  border-top:1px solid rgba(17,17,17,.08);
  border-bottom:1px solid rgba(17,17,17,.08);
}

.product-benefit {
  display:flex;
  align-items:flex-start;
  gap:11px;
  color:rgba(17,17,17,.72);
  font-size:15px;
  line-height:1.4;
}

.product-benefit__icon {
  display:flex;
  align-items:center;
  justify-content:center;
  width:20px;
  height:20px;
  flex:0 0 20px;
  margin-top:1px;
  border:1px solid rgba(189,64,52,.35);
  border-radius:50%;
  color:var(--red);
  font-family:Arial,sans-serif;
  font-size:11px;
  line-height:1;
}

.product-meta {
  display:flex;
  align-items:center;
  gap:6px;
  margin-top:20px;
  color:rgba(17,17,17,.5);
  font-size:14px;
}

.product-meta a {
  color:var(--red);
}


/* PRODUCT ACCORDION */

.product-accordion {
  margin-top:24px;
  border-top:1px solid rgba(17,17,17,.1);
}

.product-accordion__item {
  border-bottom:1px solid rgba(17,17,17,.1);
}

.product-accordion__button {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  width:100%;
  padding:19px 0;
  color:var(--black);
  text-align:left;
  font-size:17px;
  line-height:1.25;
}

.product-accordion__icon {
  position:relative;
  width:16px;
  height:16px;
  flex:0 0 16px;
}

.product-accordion__icon::before,
.product-accordion__icon::after {
  content:"";
  position:absolute;
  top:50%;
  left:50%;
  background:var(--red);
  transform:translate(-50%,-50%);
  transition:transform .2s ease;
}

.product-accordion__icon::before {
  width:14px;
  height:1px;
}

.product-accordion__icon::after {
  width:1px;
  height:14px;
}

.product-accordion__item.is-open .product-accordion__icon::after {
  transform:translate(-50%,-50%) rotate(90deg);
}

.product-accordion__content {
  display:grid;
  grid-template-rows:0fr;
  transition:grid-template-rows .3s ease;
}

.product-accordion__item.is-open .product-accordion__content {
  grid-template-rows:1fr;
}

.product-accordion__content-inner {
  overflow:hidden;
  padding:0;
  color:rgba(17,17,17,.62);
  font-size:15px;
  line-height:1.6;
}

.product-accordion__item.is-open .product-accordion__content-inner {
  padding-bottom:20px;
}


/* RELATED PRODUCTS */

.related-products {
  padding:100px 0 120px;
}

.related-products__title {
  position:relative;
  width:max-content;
  max-width:100%;
  margin:0 auto 48px;
  padding-bottom:14px;
  font-size:clamp(48px,3.6vw,66px);
  font-weight:400;
  line-height:1;
  letter-spacing:-.025em;
  text-align:center;
}

.related-products__title::after {
  content:"";
  position:absolute;
  bottom:0;
  left:50%;
  width:54px;
  height:2px;
  transform:translateX(-50%);
  background:var(--red);
}


/* MOBILE STICKY CART */

.mobile-product-cart {
  display:none;
}


/* TABLET */

@media(max-width:1200px) {
  .product-layout {
    grid-template-columns:minmax(0,1fr) minmax(360px,.8fr);
    gap:42px;
  }

  .product-summary__title {
    font-size:52px;
  }

  .product-purchase {
    grid-template-columns:138px minmax(0,1fr);
  }
}


/* MOBILE */

@media(max-width:767px) {
  .single-product {
    padding:28px 0 76px;
  }

  .product-breadcrumbs {
    margin-bottom:20px;
    font-size:12px;
  }

  .product-layout {
    display:block;
  }

  .product-gallery__thumbs {
    grid-template-columns:repeat(3,72px);
  }

  .product-gallery__thumb {
    width:72px;
    height:72px;
  }

  .product-summary {
    margin-top:30px;
  }

  .product-summary__inner {
    position:static;
  }

  .product-summary__category {
    margin-bottom:11px;
    font-size:11px;
  }

  .product-summary__title {
    font-size:42px;
  }

  .product-summary__price {
    margin-top:18px;
    font-size:25px;
  }

  .product-summary__description {
    margin-top:20px;
    font-size:15px;
    line-height:1.55;
  }

  .product-benefits {
    margin-top:24px;
  }

  .related-products {
    padding:70px 0 90px;
  }

  .related-products__title {
    margin-bottom:32px;
    font-size:42px;
  }

  .mobile-product-cart {
    position:fixed;
    right:0;
    bottom:0;
    left:0;
    z-index:80;
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    align-items:center;
    gap:14px;
    padding:11px 16px;
    background:rgba(255,255,255,.97);
    border-top:1px solid rgba(189,64,52,.14);
    box-shadow:0 -10px 30px rgba(40,20,17,.08);
    transform:translateY(110%);
    transition:transform .25s ease;
  }

  .mobile-product-cart.is-visible {
    transform:translateY(0);
  }

  .mobile-product-cart__price {
    color:var(--red);
    font-size:17px;
    font-weight:700;
    white-space:nowrap;
  }

  .mobile-product-cart__button {
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:44px;
    padding:10px 14px;
    color:var(--white);
    background:var(--red);
    font-size:14px;
    line-height:1;
  }
}


/* SMALL MOBILE */

@media(max-width:420px) {
  .product-summary__title {
    font-size:37px;
  }

  .product-gallery__thumbs {
    grid-template-columns:repeat(3,64px);
  }

  .product-gallery__thumb {
    width:64px;
    height:64px;
  }

  .related-products__title {
    font-size:36px;
  }

  .mobile-product-cart {
    gap:10px;
    padding:9px 12px;
  }

  .mobile-product-cart__price {
    font-size:15px;
  }

  .mobile-product-cart__button {
    padding:9px 12px;
    font-size:13px;
  }
}

/* =========================================================
   WOOCOMMERCE SINGLE PRODUCT INTEGRATION
   ========================================================= */

.single-product-page .woocommerce-notices-wrapper {
  width:min(var(--container),calc(100% - var(--gutter) * 2));
  margin:20px auto 0;
}

.single-product-page .woocommerce-message,
.single-product-page .woocommerce-error,
.single-product-page .woocommerce-info {
  margin:0 0 18px;
  padding:14px 18px;
  background:rgba(255,253,252,.98);
  border:1px solid rgba(189,64,52,.14);
  list-style:none;
}

.single-product-page .woocommerce-message a,
.single-product-page .woocommerce-error a,
.single-product-page .woocommerce-info a {
  color:var(--red);
}


/* REAL WOO ADD TO CART */

.product-purchase .cart {
  display:grid;
  grid-template-columns:146px minmax(0,1fr);
  gap:14px;
  width:100%;
  margin:0;
}

.product-purchase .quantity {
  position:relative;
  display:block;
  width:146px;
  padding-top:21px;
}

.product-purchase .quantity::before {
  content:"Кількість";
  position:absolute;
  top:0;
  left:0;
  color:rgba(17,17,17,.48);
  font-size:12px;
  line-height:1;
  text-transform:uppercase;
  letter-spacing:.07em;
}

.product-purchase .quantity .qty {
  width:100%;
  height:56px;
  padding:0 42px;
  border:1px solid rgba(189,64,52,.16);
  outline:0;
  background:var(--white);
  text-align:center;
  font:inherit;
  font-size:16px;
  -moz-appearance:textfield;
}

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

.product-purchase .flora-quantity-button {
  position:absolute;
  bottom:0;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:56px;
  color:rgba(17,17,17,.6);
  transition:color .2s ease,background-color .2s ease;
}

.product-purchase .flora-quantity-button:hover {
  color:var(--red);
  background:#fff8f6;
}

.product-purchase .flora-quantity-button--minus {
  left:0;
  border-right:1px solid rgba(189,64,52,.12);
}

.product-purchase .flora-quantity-button--plus {
  right:0;
  border-left:1px solid rgba(189,64,52,.12);
}

.product-purchase .single_add_to_cart_button {
  align-self:end;
  min-height:56px;
  padding:14px 24px;
  color:var(--white);
  background:var(--red);
  border:1px solid var(--red);
  border-radius:0;
  box-shadow:none;
  font:inherit;
  font-size:18px;
  font-weight:400;
  line-height:1;
  text-shadow:none;
}

.product-purchase .single_add_to_cart_button:hover,
.product-purchase .single_add_to_cart_button:focus {
  color:var(--white);
  background:var(--red-dark);
}

.product-purchase .single_add_to_cart_button.disabled,
.product-purchase .single_add_to_cart_button:disabled {
  cursor:not-allowed;
  opacity:.5;
}

.product-purchase .stock {
  grid-column:1 / -1;
  margin:0;
  color:rgba(17,17,17,.55);
  font-size:14px;
}

.product-purchase .variations {
  grid-column:1 / -1;
  width:100%;
  margin:0 0 6px;
  border:0;
}

.product-purchase .variations th,
.product-purchase .variations td {
  display:block;
  padding:0;
  border:0;
  text-align:left;
}

.product-purchase .variations th {
  margin-bottom:7px;
  color:rgba(17,17,17,.55);
  font-size:13px;
  font-weight:400;
}

.product-purchase .variations select {
  width:100%;
  height:50px;
  padding:0 42px 0 14px;
  border:1px solid rgba(17,17,17,.13);
  outline:0;
  background:rgba(255,255,255,.95);
  font:inherit;
}

.product-purchase .reset_variations {
  display:inline-block;
  margin-top:8px;
  color:var(--red);
  font-size:12px;
}

.product-purchase .single_variation_wrap {
  grid-column:1 / -1;
}

.product-purchase .woocommerce-variation-price {
  margin-bottom:12px;
  color:var(--red);
  font-size:20px;
  font-weight:700;
}


/* RELATED PRODUCT CARDS
   Single-product.css originally relied on the global product-card rules. */

.related-products .products-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:24px;
}

.related-products .product-card {
  position:relative;
  display:flex;
  flex-direction:column;
  min-width:0;
  padding:10px 10px 22px;
  overflow:hidden;
  background:rgba(255,253,252,.98);
  border:1px solid rgba(189,64,52,.1);
  box-shadow:0 10px 30px rgba(57,34,30,.06);
  transition:border-color .25s ease,box-shadow .25s ease,transform .25s ease;
}

.related-products .product-card:hover {
  transform:translateY(-4px);
  border-color:rgba(189,64,52,.2);
  box-shadow:0 18px 42px rgba(57,34,30,.11);
}

.related-products .product-card__image {
  display:block;
  width:100%;
  aspect-ratio:1 / 1;
  overflow:hidden;
  background:#f7f2f0;
}

.related-products .product-card__image img {
  width:100%;
  height:100%;
  object-fit:cover;
}

.related-products .product-card__content {
  display:flex;
  flex:1;
  flex-direction:column;
  align-items:center;
  padding:20px 14px 0;
  text-align:center;
}

.related-products .product-card__title {
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  margin:0;
  font-size:17px;
  font-weight:400;
  line-height:1.3;
}

.related-products .product-card__title a:hover {
  color:var(--red);
}

.related-products .product-card__price {
  position:relative;
  margin-top:12px;
  padding-top:13px;
  font-size:18px;
  font-weight:700;
  line-height:1;
}

.related-products .product-card__price::before {
  content:"";
  position:absolute;
  top:0;
  left:50%;
  width:32px;
  height:1px;
  transform:translateX(-50%);
  background:rgba(189,64,52,.35);
}

.related-products .product-card__button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:154px;
  margin-top:19px;
  padding:11px 20px 12px;
  color:var(--white);
  background:var(--red);
  border:1px solid var(--red);
  font-size:15px;
  line-height:1;
}

.related-products .product-card__button:hover {
  color:var(--red);
  background:var(--white);
}


/* OUT OF STOCK */

.product-summary .out-of-stock {
  margin:28px 0 0;
  color:var(--red);
  font-size:16px;
}


@media(max-width:1200px) {
  .related-products .products-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:767px) {
  .product-purchase .cart {
    grid-template-columns:1fr;
  }

  .product-purchase .quantity {
    width:138px;
  }

  .product-purchase .quantity .qty {
    height:50px;
    padding:0 40px;
  }

  .product-purchase .flora-quantity-button {
    width:40px;
    height:50px;
  }

  .product-purchase .single_add_to_cart_button {
    min-height:52px;
    font-size:17px;
  }

  .related-products .products-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
  }

  .related-products .product-card {
    padding:7px 7px 15px;
  }

  .related-products .product-card__content {
    padding:13px 5px 0;
  }

  .related-products .product-card__title {
    min-height:38px;
    font-size:14px;
  }

  .related-products .product-card__price {
    margin-top:9px;
    padding-top:10px;
    font-size:15px;
  }

  .related-products .product-card__button {
    width:100%;
    min-width:0;
    margin-top:14px;
    padding:10px 7px 11px;
    font-size:13px;
  }
}

@media(max-width:420px) {
  .related-products .products-grid {
    grid-template-columns:1fr;
  }

  .related-products .product-card {
    width:100%;
    max-width:350px;
    margin:0 auto;
  }
}

/* =========================================================
   SINGLE PRODUCT LAYOUT FIX
   WooCommerce form.cart is a single child of .product-purchase.
   The original outer grid was squeezing the whole form into 146px.
   ========================================================= */

.single-product-page .product-purchase {
  display:block;
  margin-top:32px;
}

.single-product-page .product-purchase > form.cart {
  display:grid;
  grid-template-columns:146px minmax(0,1fr);
  gap:14px;
  width:100%;
  max-width:none;
  margin:0;
  float:none;
}

.single-product-page .product-purchase > form.cart .quantity {
  float:none;
  margin:0;
}

/* A little more balance on large screens */

@media(min-width:1201px) {
  .single-product-page .single-product__container {
    max-width:1360px;
  }

  .single-product-page .product-layout {
    grid-template-columns:minmax(0,680px) minmax(430px,1fr);
    gap:64px;
    justify-content:center;
  }

  .single-product-page .product-summary__title {
    font-size:clamp(46px,3.6vw,62px);
  }

  .single-product-page .product-summary__inner {
    top:24px;
  }

  .single-product-page .product-breadcrumbs {
    color:rgba(17,17,17,.56);
  }
}


/* Tablet */

@media(max-width:1200px) and (min-width:768px) {
  .single-product-page .product-layout {
    grid-template-columns:minmax(0,1fr) minmax(380px,.9fr);
    gap:36px;
  }

  .single-product-page .product-purchase > form.cart {
    grid-template-columns:138px minmax(0,1fr);
  }
}


/* Mobile */

@media(max-width:767px) {
  .single-product-page .product-purchase {
    margin-top:26px;
  }

  .single-product-page .product-purchase > form.cart {
    grid-template-columns:1fr;
    gap:12px;
  }

  .single-product-page .product-purchase > form.cart .quantity {
    width:138px;
  }

}

/* =========================================================
   FIX: WOO SINGLE ADD TO CART BUTTON COLOR
   Our custom single-product.php does not use Woo's div.product wrapper,
   so selectors that depended on div.product never matched.
   ========================================================= */

body.single-product-page .product-purchase form.cart .single_add_to_cart_button.button.alt,
body.single-product-page .product-purchase form.cart button.single_add_to_cart_button,
body.single-product-page .product-purchase form.cart .button.alt {
  float:none;
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-width:0;
  min-height:56px;
  margin:0;
  padding:14px 24px;
  align-self:end;
  color:var(--white);
  background:var(--red);
  border:1px solid var(--red);
  border-radius:0;
  box-shadow:none;
  font:inherit;
  font-size:18px;
  font-weight:400;
  line-height:1;
  text-shadow:none;
  white-space:nowrap;
}

body.single-product-page .product-purchase form.cart .single_add_to_cart_button.button.alt:hover,
body.single-product-page .product-purchase form.cart button.single_add_to_cart_button:hover,
body.single-product-page .product-purchase form.cart .button.alt:hover,
body.single-product-page .product-purchase form.cart .single_add_to_cart_button.button.alt:focus,
body.single-product-page .product-purchase form.cart button.single_add_to_cart_button:focus,
body.single-product-page .product-purchase form.cart .button.alt:focus {
  color:var(--white);
  background:var(--red-dark);
  border-color:var(--red-dark);
}

/* =========================================================
   SINGLE PRODUCT: EMPTY WOO NOTICE
   ========================================================= */

/*
 * The custom template keeps WooCommerce's notice hook, but an empty notice
 * wrapper must not reserve visual space above the product.
 */
.single-product-page .woocommerce-notices-wrapper:empty {
  display:none;
  margin:0;
  padding:0;
}