/*
 * THEGROWNS RELATED PRODUCTS CATEGORY BUTTONS
 * Staging only — desktop and mobile.
 * Category colors follow the approved design system.
 */

body.single-product .related.products ul.products li.product {
  --tg-related-gradient:
    linear-gradient(110deg,#363b46,#656b78);
}

/* Weight */
body.single-product .related.products li.product.tg-related-weight {
  --tg-related-gradient:
    linear-gradient(110deg,#9c1530,#d43233,#f47732);
}

/* Recovery */
body.single-product .related.products li.product.tg-related-recovery {
  --tg-related-gradient:
    linear-gradient(110deg,#073d28,#0b6b44,#21a36c);
}

/* Performance */
body.single-product .related.products li.product.tg-related-performance {
  --tg-related-gradient:
    linear-gradient(110deg,#083faf,#176bff,#40a8ff);
}

/* Skin */
body.single-product .related.products li.product.tg-related-skin {
  --tg-related-gradient:
    linear-gradient(110deg,#5b2697,#a54fdf,#dda7ff);
}

/* Hormone */
body.single-product .related.products li.product.tg-related-hormone {
  --tg-related-gradient:
    linear-gradient(110deg,#504900,#8c8100,#d5c400);
}

/* Healthy Aging */
body.single-product .related.products li.product.tg-related-aging {
  --tg-related-gradient:
    linear-gradient(110deg,#4a2f1a,#7b4f2e,#b67d57);
}

/* Women */
body.single-product .related.products li.product.tg-related-women {
  --tg-related-gradient:
    linear-gradient(110deg,#a3005c,#e84da1,#ff8bcb);
}

/* Cognitive */
body.single-product .related.products li.product.tg-related-cognitive {
  --tg-related-gradient:
    linear-gradient(110deg,#0b7c7f,#2bc6cc,#a6f2f4);
}

body.single-product .related.products ul.products li.product
.product-action-wrap a.button {

  position:relative !important;
  box-sizing:border-box !important;

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

  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;

  min-height:46px !important;
  margin:0 !important;
  padding:12px 8px !important;

  border:0 !important;
  border-radius:7px !important;

  background:var(--tg-related-gradient) !important;
  background-image:var(--tg-related-gradient) !important;

  color:#fff !important;
  -webkit-text-fill-color:#fff !important;

  font-size:12px !important;
  font-weight:850 !important;
  line-height:1.15 !important;
  letter-spacing:.025em !important;

  text-transform:uppercase !important;
  text-align:center !important;
  text-indent:0 !important;
  white-space:nowrap !important;

  box-shadow:0 8px 20px rgba(30,20,45,.12) !important;

  transition:
    filter .25s ease,
    box-shadow .25s ease !important;
}

body.single-product .related.products ul.products li.product
.product-action-wrap a.button:hover {
  filter:brightness(1.12) !important;
  box-shadow:0 12px 25px rgba(30,20,45,.2) !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}

body.single-product .related.products ul.products li.product
.product-action-wrap a.button:focus-visible {
  outline:2px solid #1c1c24 !important;
  outline-offset:3px !important;
}

body.single-product .related.products ul.products li.product
.product-action-wrap a.button svg {
  display:none !important;
}

/* Mobile — preserve two-column product cards */
@media screen and (max-width:760px) {

  body.single-product .related.products ul.products li.product
  .product-action-wrap {
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
  }

  body.single-product .related.products ul.products li.product
  .product-action-wrap a.button {
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    min-height:44px !important;

    padding:10px 4px !important;

    font-size:clamp(9px,2.55vw,11px) !important;
    letter-spacing:0 !important;
  }
}

@media (prefers-reduced-motion:reduce) {
  body.single-product .related.products
  .product-action-wrap a.button {
    transition:none !important;
  }
}

/* TG_RELATED_NATIVE_CATEGORY_FALLBACK_START */

/* WooCommerce native product category class fallback. */

body.single-product .related.products ul.products li.product.product_cat-weight-management,
body.single-product .related.products ul.products li.product.tg-related-weight {
  --tg-related-gradient:linear-gradient(110deg,#9c1530,#d43233,#f47732) !important;
}

body.single-product .related.products ul.products li.product.product_cat-recovery-repair,
body.single-product .related.products ul.products li.product.tg-related-recovery {
  --tg-related-gradient:linear-gradient(110deg,#073d28,#0b6b44,#21a36c) !important;
}

body.single-product .related.products ul.products li.product.product_cat-performance,
body.single-product .related.products ul.products li.product.tg-related-performance {
  --tg-related-gradient:linear-gradient(110deg,#083faf,#176bff,#40a8ff) !important;
}

body.single-product .related.products ul.products li.product.product_cat-skin-appearance,
body.single-product .related.products ul.products li.product.tg-related-skin {
  --tg-related-gradient:linear-gradient(110deg,#5b2697,#a54fdf,#dda7ff) !important;
}

body.single-product .related.products ul.products li.product.product_cat-hormone-support,
body.single-product .related.products ul.products li.product.tg-related-hormone {
  --tg-related-gradient:linear-gradient(110deg,#504900,#8c8100,#d5c400) !important;
}

body.single-product .related.products ul.products li.product.product_cat-healthy-aging,
body.single-product .related.products ul.products li.product.tg-related-aging {
  --tg-related-gradient:linear-gradient(110deg,#4a2f1a,#7b4f2e,#b67d57) !important;
}

body.single-product .related.products ul.products li.product.product_cat-womens-wellness,
body.single-product .related.products ul.products li.product.tg-related-women {
  --tg-related-gradient:linear-gradient(110deg,#a3005c,#e84da1,#ff8bcb) !important;
}

body.single-product .related.products ul.products li.product.product_cat-cognitive-support,
body.single-product .related.products ul.products li.product.tg-related-cognitive {
  --tg-related-gradient:linear-gradient(110deg,#0b7c7f,#2bc6cc,#a6f2f4) !important;
}

/* TG_RELATED_NATIVE_CATEGORY_FALLBACK_END */