/* ==========================================================================
   PERDYSY â€” Single Product Page V2
   Premium e-commerce product page â€” matches V2 homepage aesthetic
   Targets: body.single-product (Elessi + nasa- classes)
   ========================================================================== */

/* ---------- DESIGN TOKENS ---------- */
body.single-product {
  --p2-primary: #1b72b9;
  --p2-primary-dark: #155d96;
  --p2-primary-light: rgba(27,114,185,0.08);
  --p2-accent: #298fc2;
  --p2-gold: #c9a84c;
  --p2-text: #1a1a2e;
  --p2-text-muted: #64748b;
  --p2-bg: linear-gradient(160deg, #f0f4f8 0%, #e8eef5 50%, #f5f7fa 100%);
  --p2-bg-alt: #f5f7fa;
  --p2-bg-warm: #faf8f5;
  --p2-card: #ffffff;
  --p2-border: #e2e8f0;
  --p2-radius: 16px;
  --p2-radius-sm: 10px;
  --p2-shadow: 0 4px 24px rgba(27,114,185,0.07);
  --p2-shadow-lg: 0 12px 40px rgba(27,114,185,0.12);
  --p2-ease: cubic-bezier(0.4,0,0.2,1);
  --p2-font: 'Jost', 'Inter', -apple-system, sans-serif;
}

@import url('https://fonts.googleapis.com/css2?family=Jost:wght@300;400;500;600;700;800&display=swap');

/* ---------- 1. PAGE BACKGROUND ---------- */
body.single-product {
  background: var(--p2-bg) !important;
}
body.single-product #content,
body.single-product .site-content,
body.single-product .main-content {
  background: transparent !important;
}

/* ---------- 2. BREADCRUMBS ---------- */
body.single-product .woocommerce-breadcrumb,
body.single-product .breadcrumbs,
body.single-product .nasa-breadcrumb {
  font-family: var(--p2-font) !important;
  font-size: 0.82rem !important;
  color: var(--p2-text-muted) !important;
  padding: 18px 0 !important;
  letter-spacing: 0.02em;
}
body.single-product .woocommerce-breadcrumb a,
body.single-product .breadcrumbs a {
  color: var(--p2-primary) !important;
  text-decoration: none !important;
  transition: color 0.25s var(--p2-ease);
}
body.single-product .woocommerce-breadcrumb a:hover { color: var(--p2-accent) !important; }

/* ---------- 3. PRODUCT IMAGE GALLERY ---------- */
body.single-product .woocommerce-product-gallery,
body.single-product .product-images,
body.single-product .images {
  background: var(--p2-card) !important;
  border-radius: var(--p2-radius) !important;
  box-shadow: var(--p2-shadow-lg) !important;
  overflow: hidden;
  padding: 16px !important;
  transition: box-shadow 0.4s var(--p2-ease);
}
body.single-product .woocommerce-product-gallery:hover {
  box-shadow: 0 16px 48px rgba(27,114,185,0.16) !important;
}
body.single-product .woocommerce-product-gallery__image img,
body.single-product .product-images img,
body.single-product .images > a > img {
  border-radius: 12px !important;
}

/* Thumbnails â€” pill style */
body.single-product .flex-control-thumbs li img,
body.single-product .product-thumbnails img,
body.single-product .thumbnails img {
  border-radius: 8px !important;
  border: 2px solid transparent !important;
  transition: all 0.3s var(--p2-ease) !important;
  opacity: 0.65;
}
body.single-product .flex-control-thumbs li img:hover,
body.single-product .flex-control-thumbs li img.flex-active {
  border-color: var(--p2-primary) !important;
  opacity: 1;
  box-shadow: 0 0 0 3px var(--p2-primary-light);
}

/* ---------- 4. PRODUCT TITLE ---------- */
body.single-product .product_title,
body.single-product h1.product_title,
body.single-product .summary h1,
body.single-product .entry-summary h1 {
  font-family: var(--p2-font) !important;
  font-size: 2.2rem !important;
  font-weight: 800 !important;
  color: var(--p2-text) !important;
  letter-spacing: -0.03em !important;
  line-height: 1.15 !important;
  margin-bottom: 10px !important;
}

/* ---------- 5. PRICE ---------- */
body.single-product .price,
body.single-product p.price,
body.single-product span.price,
body.single-product .summary .price,
body.single-product .nasa-single-product-price {
  font-family: var(--p2-font) !important;
  font-size: 1.85rem !important;
  font-weight: 700 !important;
  color: var(--p2-primary) !important;
}
body.single-product .price del {
  color: var(--p2-text-muted) !important;
  font-size: 1.15rem !important;
  font-weight: 400 !important;
}
body.single-product .price ins {
  text-decoration: none !important;
  color: var(--p2-primary) !important;
}

/* ---------- 6. BRAND LINK ---------- */
body.single-product .posted_in a,
body.single-product .brand a,
body.single-product a[href*="brand"] {
  color: var(--p2-accent) !important;
  font-family: var(--p2-font) !important;
  font-weight: 600 !important;
  font-size: 0.95rem !important;
  text-decoration: none !important;
  transition: color 0.25s var(--p2-ease);
}
body.single-product .posted_in a:hover { color: var(--p2-primary) !important; }

/* ---------- 7. VARIATION SELECTORS ---------- */
body.single-product .variations td label,
body.single-product .label-attr-tag,
body.single-product .nasa-attr-title {
  font-family: var(--p2-font) !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.12em !important;
  color: var(--p2-text) !important;
  margin-bottom: 10px !important;
}
body.single-product .nasa-attr-tag,
body.single-product .nasa-attribute-tag {
  border-radius: 8px !important;
  transition: all 0.25s var(--p2-ease) !important;
  border: 2px solid var(--p2-border) !important;
  font-family: var(--p2-font) !important;
  font-weight: 500 !important;
}
body.single-product .nasa-attr-tag:hover {
  border-color: var(--p2-primary) !important;
  background: var(--p2-primary-light) !important;
}
body.single-product .nasa-attr-tag.selected,
body.single-product .nasa-attribute-tag.selected {
  border-color: var(--p2-primary) !important;
  background: var(--p2-primary-light) !important;
  box-shadow: 0 0 0 3px rgba(27,114,185,0.1) !important;
  font-weight: 600 !important;
}

/* ---------- 8. CTA BUTTONS ---------- */

/* Add to Cart */
body.single-product .single_add_to_cart_button,
body.single-product button.single_add_to_cart_button {
  background: var(--p2-primary) !important;
  border: none !important;
  border-radius: var(--p2-radius-sm) !important;
  font-family: var(--p2-font) !important;
  font-weight: 700 !important;
  font-size: 0.85rem !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  padding: 15px 30px !important;
  transition: all 0.3s var(--p2-ease) !important;
  box-shadow: 0 4px 16px rgba(27,114,185,0.3) !important;
  position: relative;
  overflow: hidden;
}
body.single-product .single_add_to_cart_button:hover {
  background: var(--p2-primary-dark) !important;
  box-shadow: 0 8px 24px rgba(27,114,185,0.4) !important;
  transform: translateY(-2px);
}

/* Select Prescription */
body.single-product .rx-select-btn,
body.single-product button[class*="prescription"],
body.single-product .btn-select-prescription,
body.single-product a[class*="prescription"],
body.single-product .select-prescription-btn {
  background: transparent !important;
  border: 2px solid var(--p2-primary) !important;
  border-radius: var(--p2-radius-sm) !important;
  color: var(--p2-primary) !important;
  font-family: var(--p2-font) !important;
  font-weight: 700 !important;
  font-size: 0.85rem !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  padding: 13px 26px !important;
  transition: all 0.3s var(--p2-ease) !important;
}
body.single-product .rx-select-btn:hover,
body.single-product button[class*="prescription"]:hover {
  background: var(--p2-primary) !important;
  color: #fff !important;
  box-shadow: 0 4px 16px rgba(27,114,185,0.3) !important;
}

/* TRY-ON */
body.single-product .auglio-tryon-btn,
body.single-product button.auglio-tryon-btn {
  background: var(--p2-primary-light) !important;
  border: 2px solid var(--p2-accent) !important;
  border-radius: var(--p2-radius-sm) !important;
  color: var(--p2-accent) !important;
  font-family: var(--p2-font) !important;
  font-weight: 700 !important;
  font-size: 0.85rem !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  padding: 13px 26px !important;
  transition: all 0.3s var(--p2-ease) !important;
}
body.single-product .auglio-tryon-btn:hover {
  background: var(--p2-accent) !important;
  color: #fff !important;
  box-shadow: 0 4px 16px rgba(41,143,194,0.3) !important;
}

/* Buy Now â€” gradient */
body.single-product .nasa-buy-now,
body.single-product button.nasa-buy-now {
  background: linear-gradient(135deg, var(--p2-primary) 0%, var(--p2-accent) 100%) !important;
  border: none !important;
  border-radius: var(--p2-radius-sm) !important;
  color: #fff !important;
  font-family: var(--p2-font) !important;
  font-weight: 700 !important;
  font-size: 0.9rem !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  padding: 16px 36px !important;
  transition: all 0.3s var(--p2-ease) !important;
  box-shadow: 0 4px 20px rgba(27,114,185,0.3) !important;
}
body.single-product .nasa-buy-now:hover {
  box-shadow: 0 8px 28px rgba(27,114,185,0.45) !important;
  transform: translateY(-2px);
}

/* Quantity */
body.single-product .quantity .qty,
body.single-product .quantity input[type="number"] {
  border: 2px solid var(--p2-border) !important;
  border-radius: var(--p2-radius-sm) !important;
  font-family: var(--p2-font) !important;
  font-weight: 600 !important;
  font-size: 1rem !important;
  color: var(--p2-text) !important;
  text-align: center !important;
  transition: border-color 0.25s var(--p2-ease);
}
body.single-product .quantity .qty:focus {
  border-color: var(--p2-primary) !important;
  box-shadow: 0 0 0 3px var(--p2-primary-light) !important;
}

/* ---------- 9. TRUST BADGES STRIP ---------- */
.pdsy2-sp-trust {
  display: flex;
  gap: 20px;
  padding: 28px 0;
  margin-top: 24px;
  border-top: 1px solid var(--p2-border);
  border-bottom: 1px solid var(--p2-border);
  flex-wrap: wrap;
}
.pdsy2-sp-trust__item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-family: var(--p2-font);
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--p2-text-muted);
  letter-spacing: 0.02em;
}
.pdsy2-sp-trust__icon {
  width: 38px;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--p2-primary-light);
  border-radius: 50%;
  flex-shrink: 0;
  transition: all 0.3s var(--p2-ease);
}
.pdsy2-sp-trust__item:hover .pdsy2-sp-trust__icon {
  background: var(--p2-primary);
}
.pdsy2-sp-trust__item:hover .pdsy2-sp-trust__icon svg {
  stroke: #fff;
}
.pdsy2-sp-trust__icon svg {
  width: 18px;
  height: 18px;
  stroke: var(--p2-primary);
  fill: none;
  stroke-width: 2;
  transition: stroke 0.3s var(--p2-ease);
}

/* ---------- 10. FEATURE HIGHLIGHTS (NEW) ---------- */
.pdsy2-features {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-top: 20px;
  padding-bottom: 20px;
}
.pdsy2-feature {
  background: var(--p2-card);
  border: 1px solid var(--p2-border);
  border-radius: var(--p2-radius-sm);
  padding: 18px;
  text-align: center;
  transition: all 0.3s var(--p2-ease);
}
.pdsy2-feature:hover {
  border-color: var(--p2-primary);
  box-shadow: var(--p2-shadow);
  transform: translateY(-2px);
}
.pdsy2-feature__icon {
  font-size: 1.5rem;
  margin-bottom: 8px;
}
.pdsy2-feature__title {
  font-family: var(--p2-font);
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--p2-text);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 4px;
}
.pdsy2-feature__text {
  font-family: var(--p2-font);
  font-size: 0.75rem;
  color: var(--p2-text-muted);
  line-height: 1.4;
}

/* ---------- 11. ACCORDION / TABS ---------- */
body.single-product .woocommerce-tabs,
body.single-product .nasa-tabs,
body.single-product .nasa-single-product-tab,
body.single-product .nasa-accordion {
  margin-top: 56px !important;
  font-family: var(--p2-font) !important;
}

body.single-product .nasa-accordion-title,
body.single-product .woocommerce-Tabs-panel__title {
  font-family: var(--p2-font) !important;
  font-weight: 700 !important;
  font-size: 0.9rem !important;
  letter-spacing: 0.08em !important;
  color: var(--p2-text) !important;
  text-transform: uppercase !important;
  padding: 18px 24px !important;
  border: 1px solid var(--p2-border) !important;
  border-radius: var(--p2-radius-sm) !important;
  margin-bottom: 8px !important;
  background: var(--p2-card) !important;
  transition: all 0.3s var(--p2-ease) !important;
}
body.single-product .nasa-accordion-title:hover,
body.single-product .nasa-accordion-title.active {
  color: var(--p2-primary) !important;
  border-color: var(--p2-primary) !important;
  background: var(--p2-primary-light) !important;
}

body.single-product .nasa-accordion-content,
body.single-product .woocommerce-Tabs-panel,
body.single-product .wc-tab {
  background: var(--p2-card) !important;
  border-radius: 0 0 var(--p2-radius-sm) var(--p2-radius-sm) !important;
  padding: 28px !important;
  box-shadow: var(--p2-shadow) !important;
  font-family: var(--p2-font) !important;
  color: var(--p2-text) !important;
  line-height: 1.8 !important;
  font-size: 0.95rem !important;
}

/* ---------- 12. RELATED PRODUCTS ---------- */
body.single-product .related.products,
body.single-product section.related,
body.single-product .nasa-related-products {
  padding: 72px 0 !important;
  margin-top: 56px !important;
  background: var(--p2-bg-alt) !important;
}
body.single-product .related.products > h2,
body.single-product section.related > h2 {
  font-family: var(--p2-font) !important;
  font-size: 1.8rem !important;
  font-weight: 800 !important;
  color: var(--p2-text) !important;
  text-align: center !important;
  margin-bottom: 12px !important;
  letter-spacing: -0.02em !important;
}
body.single-product .related.products > h2::after,
body.single-product section.related > h2::after {
  content: '';
  display: block;
  width: 48px;
  height: 3px;
  background: var(--p2-primary);
  margin: 16px auto 40px;
  border-radius: 3px;
}

/* Related cards */
body.single-product .related.products .product,
body.single-product .related.products li.product {
  background: var(--p2-card) !important;
  border-radius: var(--p2-radius) !important;
  box-shadow: var(--p2-shadow) !important;
  transition: all 0.35s var(--p2-ease) !important;
  overflow: hidden;
  border: 1px solid rgba(226,232,240,0.5);
}
body.single-product .related.products .product:hover,
body.single-product .related.products li.product:hover {
  box-shadow: var(--p2-shadow-lg) !important;
  transform: translateY(-6px);
}
body.single-product .related.products .product img,
body.single-product .related.products li.product img {
  transition: transform 0.5s var(--p2-ease) !important;
}
body.single-product .related.products .product:hover img {
  transform: scale(1.05);
}
body.single-product .related.products .product .woocommerce-loop-product__title,
body.single-product .related.products li.product h2,
body.single-product .related.products li.product .product-name {
  font-family: var(--p2-font) !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  color: var(--p2-text) !important;
  padding: 10px 16px 4px !important;
}
body.single-product .related.products .product .price,
body.single-product .related.products li.product .price {
  font-family: var(--p2-font) !important;
  font-size: 1.05rem !important;
  font-weight: 700 !important;
  color: var(--p2-primary) !important;
  padding: 0 16px 16px !important;
}

/* ---------- 13. STICKY BOTTOM BAR ---------- */
body.single-product .nasa-stick-cart {
  background: rgba(255,255,255,0.94) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
  border-top: 1px solid var(--p2-border) !important;
  box-shadow: 0 -6px 32px rgba(0,0,0,0.06) !important;
  font-family: var(--p2-font) !important;
}
body.single-product .nasa-stick-cart .product-name,
body.single-product .nasa-stick-cart .product-title {
  font-family: var(--p2-font) !important;
  font-weight: 700 !important;
  font-size: 0.9rem !important;
  color: var(--p2-text) !important;
}
body.single-product .nasa-stick-cart .price,
body.single-product .nasa-stick-cart span.price {
  color: var(--p2-primary) !important;
  font-weight: 700 !important;
  font-family: var(--p2-font) !important;
}
body.single-product .nasa-stick-cart .single_add_to_cart_button {
  background: var(--p2-primary) !important;
  border-radius: var(--p2-radius-sm) !important;
  box-shadow: 0 2px 10px rgba(27,114,185,0.25) !important;
}
body.single-product .nasa-stick-cart .nasa-buy-now {
  background: linear-gradient(135deg, var(--p2-primary), var(--p2-accent)) !important;
  border: none !important;
  border-radius: var(--p2-radius-sm) !important;
}

/* ---------- 14. BADGES ---------- */
body.single-product .onsale,
body.single-product span.onsale {
  background: linear-gradient(135deg, #e74c3c, #c0392b) !important;
  color: #fff !important;
  font-family: var(--p2-font) !important;
  font-weight: 700 !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  border-radius: 8px !important;
  padding: 7px 16px !important;
  box-shadow: 0 3px 10px rgba(231,76,60,0.3);
}
body.single-product .nasa-new-badge {
  background: linear-gradient(135deg, #27ae60, #1e8449) !important;
}

/* ---------- 15. SKU & META ---------- */
body.single-product .sku_wrapper {
  font-family: var(--p2-font) !important;
  font-size: 0.78rem !important;
  color: var(--p2-text-muted) !important;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
body.single-product .product_meta {
  font-family: var(--p2-font) !important;
  font-size: 0.82rem !important;
  color: var(--p2-text-muted) !important;
  margin-top: 28px !important;
  padding-top: 24px !important;
  border-top: 1px solid var(--p2-border) !important;
}
body.single-product .product_meta a {
  color: var(--p2-primary) !important;
  text-decoration: none !important;
  font-weight: 500 !important;
}

/* ---------- 16. STAR RATINGS ---------- */
body.single-product .star-rating span::before,
body.single-product .star-rating::before {
  color: var(--p2-gold) !important;
}

/* ---------- 17. REVIEW FORM ---------- */
body.single-product #review_form input,
body.single-product #review_form textarea {
  border: 2px solid var(--p2-border) !important;
  border-radius: var(--p2-radius-sm) !important;
  font-family: var(--p2-font) !important;
  transition: all 0.25s var(--p2-ease);
  padding: 12px 16px !important;
}
body.single-product #review_form input:focus,
body.single-product #review_form textarea:focus {
  border-color: var(--p2-primary) !important;
  box-shadow: 0 0 0 3px var(--p2-primary-light) !important;
  outline: none !important;
}
body.single-product #review_form .submit {
  background: var(--p2-primary) !important;
  border: none !important;
  border-radius: var(--p2-radius-sm) !important;
  font-family: var(--p2-font) !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  padding: 14px 32px !important;
  box-shadow: 0 4px 14px rgba(27,114,185,0.25) !important;
  transition: all 0.3s var(--p2-ease);
}
body.single-product #review_form .submit:hover {
  background: var(--p2-primary-dark) !important;
  transform: translateY(-2px);
}

/* ---------- 18. WISHLIST & SHARE ---------- */
body.single-product .yith-wcwl-add-to-wishlist a {
  color: var(--p2-text-muted) !important;
  transition: color 0.25s var(--p2-ease) !important;
}
body.single-product .yith-wcwl-add-to-wishlist a:hover {
  color: #e74c3c !important;
}

/* ---------- 19. WC ALERTS ---------- */
body.single-product .woocommerce-message {
  border-top-color: var(--p2-primary) !important;
  font-family: var(--p2-font) !important;
  border-radius: var(--p2-radius-sm) !important;
  background: #f0f9ff !important;
}
body.single-product .woocommerce-message .button {
  background: var(--p2-primary) !important;
  border-radius: var(--p2-radius-sm) !important;
  font-family: var(--p2-font) !important;
  font-weight: 600 !important;
}

/* ---------- 20. OVERRIDE ANY GREEN BUTTONS ---------- */
body.single-product .btn-style-2,
body.single-product a.btn-style-2 {
  background: linear-gradient(135deg, var(--p2-primary), var(--p2-accent)) !important;
  border-color: var(--p2-primary) !important;
}

/* ---------- 21. FOCUS STYLES ---------- */
body.single-product *:focus-visible {
  outline: 2px solid var(--p2-primary) !important;
  outline-offset: 2px !important;
}

/* ---------- 22. RESPONSIVE ---------- */
@media (max-width: 768px) {
  body.single-product .product_title,
  body.single-product h1.product_title {
    font-size: 1.6rem !important;
  }
  body.single-product .price,
  body.single-product p.price {
    font-size: 1.5rem !important;
  }
  .pdsy2-sp-trust {
    flex-direction: column;
    gap: 14px;
  }
  .pdsy2-features {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  body.single-product .related.products > h2 {
    font-size: 1.4rem !important;
  }
}
