/* TG_PREMIUM_CART_NOTICE_20261023
   Staging-only WooCommerce add-to-cart confirmation.
*/

body.single-product {
  --tg-notice-a: #343944;
  --tg-notice-b: #666c78;
  --tg-notice-rgb: 80,85,96;
}

body.single-product.tg-pdp-weight {
  --tg-notice-a: #9c1530;
  --tg-notice-b: #f47732;
  --tg-notice-rgb: 156,21,48;
}

body.single-product.tg-pdp-recovery {
  --tg-notice-a: #073d28;
  --tg-notice-b: #21a36c;
  --tg-notice-rgb: 7,61,40;
}

body.single-product.tg-pdp-performance {
  --tg-notice-a: #083faf;
  --tg-notice-b: #40a8ff;
  --tg-notice-rgb: 8,63,175;
}

body.single-product.tg-pdp-skin {
  --tg-notice-a: #5b2697;
  --tg-notice-b: #dda7ff;
  --tg-notice-rgb: 91,38,151;
}

body.single-product.tg-pdp-hormone {
  --tg-notice-a: #504900;
  --tg-notice-b: #d5c400;
  --tg-notice-rgb: 80,73,0;
}

body.single-product.tg-pdp-aging {
  --tg-notice-a: #4a2f1a;
  --tg-notice-b: #b67d57;
  --tg-notice-rgb: 74,47,26;
}

body.single-product.tg-pdp-women {
  --tg-notice-a: #a3005c;
  --tg-notice-b: #ff8bcb;
  --tg-notice-rgb: 163,0,92;
}

body.single-product.tg-pdp-cognitive {
  --tg-notice-a: #0b7c7f;
  --tg-notice-b: #2bc6cc;
  --tg-notice-rgb: 11,124,127;
}

/* Main confirmation card */
body.single-product .woocommerce-notices-wrapper
.woocommerce-message {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 18px !important;

  padding: 27px 30px !important;
  margin: 22px 0 28px !important;

  background: #fff !important;
  color: #20232c !important;

  border: 1px solid rgba(var(--tg-notice-rgb), .24) !important;
  border-radius: 19px !important;

  box-shadow:
    0 15px 38px rgba(17,21,34,.055),
    0 5px 18px rgba(var(--tg-notice-rgb),.055) !important;

  font-weight: 600 !important;
  line-height: 1.55 !important;
  overflow: hidden !important;
}

/* Gradient identity line */
body.single-product .woocommerce-notices-wrapper
.woocommerce-message::after {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 4px !important;
  background: linear-gradient(
    105deg,
    var(--tg-notice-a),
    var(--tg-notice-b)
  ) !important;
}

/* Success symbol */
body.single-product .woocommerce-notices-wrapper
.woocommerce-message::before {
  content: "✓" !important;
  position: static !important;
  display: inline-grid !important;
  place-items: center !important;

  width: 33px !important;
  height: 33px !important;
  min-width: 33px !important;

  border-radius: 50% !important;
  background: linear-gradient(
    135deg,
    var(--tg-notice-a),
    var(--tg-notice-b)
  ) !important;

  color: #fff !important;
  font-size: 17px !important;
  font-weight: 800 !important;
}

/* View cart */
body.single-product .woocommerce-notices-wrapper
.woocommerce-message a.button {
  order: 3 !important;
  float: none !important;
  margin: 0 0 0 auto !important;

  min-height: 46px !important;
  padding: 13px 25px !important;

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

  background: linear-gradient(
    110deg,
    var(--tg-notice-a),
    var(--tg-notice-b)
  ) !important;

  color: #fff !important;
  font-size: 11px !important;
  font-weight: 850 !important;
  letter-spacing: .095em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;

  box-shadow: 0 8px 19px rgba(var(--tg-notice-rgb),.16) !important;
  transition: transform .22s ease, box-shadow .22s ease !important;
}

body.single-product .woocommerce-notices-wrapper
.woocommerce-message a.button:hover {
  transform: translateY(-2px) !important;
  color: #fff !important;
  box-shadow: 0 12px 25px rgba(var(--tg-notice-rgb),.23) !important;
}

/* Mobile */
@media (max-width: 600px) {
  body.single-product .woocommerce-notices-wrapper
  .woocommerce-message {
    padding: 22px 19px !important;
    gap: 13px !important;
    font-size: 13px !important;
  }

  body.single-product .woocommerce-notices-wrapper
  .woocommerce-message a.button {
    flex-basis: 100% !important;
    width: 100% !important;
    margin: 8px 0 0 !important;
    text-align: center !important;
  }
}
