/* =====================================================================
   GlowStrong — Product Experience (Module 1)
   Loaded on single product pages only. Inherits tokens from global.css;
   theme-aware (light/dark), mobile-first, reduced-motion safe. Restyles the
   default WooCommerce single product into a custom premium PDP without
   replacing its templates. Does not affect cart/checkout.
   ===================================================================== */

/* ---------- Layout: gallery | summary, full-width detail below ---------- */
.single-product div.product { display: grid; grid-template-columns: 1fr; gap: var(--gs-space-6); }
@media (min-width: 900px) {
    .single-product div.product { grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); column-gap: var(--gs-space-8); align-items: start; }
    .single-product div.product > .woocommerce-product-gallery { grid-column: 1; position: sticky; top: calc(var(--gs-header-h) + var(--gs-space-4)); }
    .single-product div.product > .summary { grid-column: 2; }
    .single-product div.product > .woocommerce-tabs,
    .single-product div.product > .up-sells,
    .single-product div.product > .related,
    .single-product div.product > .gs-pdp-articles,
    .single-product div.product > .gs-pdp-recent { grid-column: 1 / -1; }
}

/* ---------- Gallery ---------- */
.woocommerce-product-gallery { position: relative; margin: 0; }
.woocommerce-product-gallery__wrapper { margin: 0; }
.woocommerce-product-gallery__image,
.woocommerce-product-gallery__image a { display: block; border-radius: var(--gs-radius-lg); overflow: hidden; background: var(--gs-surface-2); }
.woocommerce-product-gallery__image img { border-radius: var(--gs-radius-lg); }
.woocommerce-product-gallery__trigger {
    position: absolute; top: var(--gs-space-3); right: var(--gs-space-3); z-index: 3;
    width: 40px; height: 40px; display: grid; place-items: center; text-indent: 0; font-size: 0;
    background: var(--gs-surface); border: 1px solid var(--gs-border); border-radius: 50%; box-shadow: var(--gs-shadow-sm);
}
.woocommerce-product-gallery__trigger::before { content: "\1F50D"; font-size: 1rem; }
.flex-control-thumbs { display: flex; flex-wrap: wrap; gap: var(--gs-space-2); margin: var(--gs-space-3) 0 0; padding: 0; list-style: none; }
.flex-control-thumbs li { width: 68px; margin: 0; }
.flex-control-thumbs img { border-radius: var(--gs-radius-sm); border: 1px solid var(--gs-border); cursor: pointer; opacity: 0.65; transition: opacity var(--gs-dur-fast) var(--gs-ease), border-color var(--gs-dur-fast) var(--gs-ease); }
.flex-control-thumbs img.flex-active, .flex-control-thumbs img:hover { opacity: 1; border-color: var(--gs-accent); }

/* ---------- Summary ---------- */
.single-product .summary.entry-summary { display: flex; flex-direction: column; gap: var(--gs-space-3); }
.single-product .product_title.entry-title { font-family: var(--gs-font-heading); font-size: var(--gs-fs-2xl); color: var(--gs-heading); margin: 0; }
.single-product .summary .price { color: var(--gs-heading); font-weight: 700; font-size: var(--gs-fs-xl); margin: 0; }
.single-product .summary .price del { color: var(--gs-text-muted); font-weight: 500; margin-right: 0.4em; }
.single-product .summary .price ins { text-decoration: none; }
.single-product .woocommerce-product-details__short-description { color: var(--gs-text-muted); font-size: var(--gs-fs-base); }
.single-product .woocommerce-product-details__short-description p { margin-bottom: var(--gs-space-3); }
.single-product .summary .woocommerce-product-rating { display: flex; align-items: center; gap: 0.5em; margin: 0; }
.single-product .stock.in-stock { color: var(--gs-success-fg); font-size: var(--gs-fs-sm); font-weight: 600; }
.single-product .stock.out-of-stock { color: var(--gs-danger-fg); font-size: var(--gs-fs-sm); font-weight: 600; }

/* Benefits checklist (rendered in summary when data exists) */
.gs-pdp-benefits { list-style: none; margin: var(--gs-space-2) 0; padding: 0; display: flex; flex-direction: column; gap: var(--gs-space-2); }
.gs-pdp-benefits__item { display: flex; align-items: flex-start; gap: var(--gs-space-3); color: var(--gs-text); font-size: var(--gs-fs-sm); }
.gs-pdp-benefits__check { flex: none; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--gs-success-bg); color: var(--gs-success-fg); }

/* Subscription (Subscribe & Save) purchase-type radios */
.gs-purchase-type { display: flex; flex-direction: column; gap: var(--gs-space-2); margin: var(--gs-space-2) 0; }
.gs-purchase-type__opt { display: flex; align-items: flex-start; gap: var(--gs-space-3); padding: var(--gs-space-4); border: 1px solid var(--gs-border); border-radius: var(--gs-radius); cursor: pointer; transition: border-color var(--gs-dur-fast) var(--gs-ease), background var(--gs-dur-fast) var(--gs-ease); }
.gs-purchase-type__opt:hover { border-color: var(--gs-slate); }
.gs-purchase-type__opt:focus-within { border-color: var(--gs-focus); box-shadow: var(--gs-focus-ring); }
.gs-purchase-type__opt input { margin-top: 0.2em; accent-color: var(--gs-accent); }
.gs-purchase-type__opt span { font-weight: 600; color: var(--gs-text); }
.gs-purchase-type__opt small { display: block; font-weight: 400; color: var(--gs-text-muted); font-size: var(--gs-fs-xs); margin-top: 2px; }
.gs-purchase-type__opt--save { border-color: color-mix(in srgb, var(--gs-accent) 40%, var(--gs-border)); }

/* Quantity stepper (enhanced by product.js) */
.single-product .summary form.cart { display: flex; flex-wrap: wrap; gap: var(--gs-space-3); align-items: center; margin: var(--gs-space-2) 0 0; }
.single-product .summary .quantity.gs-qty { display: inline-flex; align-items: center; border: 1px solid var(--gs-input-border); border-radius: var(--gs-radius-pill); overflow: hidden; background: var(--gs-input-bg); }
.gs-qty__btn { width: 40px; height: 44px; border: 0; background: none; color: var(--gs-text); font-size: 1.2rem; line-height: 1; cursor: pointer; }
.gs-qty__btn:hover { color: var(--gs-accent); }
.gs-qty__btn:focus-visible { outline: 2px solid var(--gs-focus); outline-offset: -2px; }
.single-product .summary .quantity.gs-qty input.qty { width: 3rem; height: 44px; border: 0; background: none; text-align: center; color: var(--gs-text); font-weight: 600; -moz-appearance: textfield; }
.single-product .summary .quantity.gs-qty input.qty::-webkit-outer-spin-button,
.single-product .summary .quantity.gs-qty input.qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.single-product .summary .single_add_to_cart_button { flex: 1 1 12rem; }
.single-product .summary form.cart .gs-stack-btn,
.single-product .summary form.cart .add_stack_button { flex: 1 1 12rem; }

/* Trust badges under the add-to-cart form */
.gs-trust-badges { list-style: none; margin: var(--gs-space-4) 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--gs-space-3); }
.gs-trust-badges li { display: inline-flex; align-items: center; gap: 0.4em; font-size: var(--gs-fs-xs); font-weight: 600; color: var(--gs-text-muted); }
.gs-trust-badges li::before { content: "\2713"; color: var(--gs-success-fg); }

/* Wishlist button in summary */
.single-product .summary .gs-wishlist-btn { display: inline-flex; align-items: center; gap: 0.5em; background: none; border: 0; color: var(--gs-text-muted); cursor: pointer; font-size: var(--gs-fs-sm); font-weight: 600; padding: 0; }
.single-product .summary .gs-wishlist-btn:hover,
.single-product .summary .gs-wishlist-btn[aria-pressed="true"] { color: var(--gs-accent); }

/* ---------- Tabs (premium) ---------- */
.woocommerce-tabs { margin-top: var(--gs-space-8); }
.woocommerce-tabs ul.tabs { list-style: none; margin: 0 0 var(--gs-space-5); padding: 0 0 2px; display: flex; flex-wrap: wrap; gap: var(--gs-space-2); border-bottom: 1px solid var(--gs-border); }
.woocommerce-tabs ul.tabs li { margin: 0; }
.woocommerce-tabs ul.tabs li a { display: inline-block; padding: 0.7em 1.1em; font-weight: 600; font-size: var(--gs-fs-sm); color: var(--gs-text-muted); border-radius: var(--gs-radius-sm) var(--gs-radius-sm) 0 0; text-decoration: none; }
.woocommerce-tabs ul.tabs li a:hover { color: var(--gs-heading); }
.woocommerce-tabs ul.tabs li.active a { color: var(--gs-heading); box-shadow: inset 0 -2px 0 var(--gs-accent); }
.woocommerce-tabs .panel { max-width: 68ch; color: var(--gs-text); }
.woocommerce-tabs .panel h2 { font-size: var(--gs-fs-xl); color: var(--gs-heading); margin-bottom: var(--gs-space-3); }

/* Supplement Facts panel (core-rendered) */
.gs-supplement-facts, .woocommerce-tabs table.shop_attributes { width: 100%; border-collapse: collapse; }
.gs-supplement-facts th, .gs-supplement-facts td,
.woocommerce-tabs table.shop_attributes th, .woocommerce-tabs table.shop_attributes td { text-align: left; padding: 0.55em 0.6em; border-bottom: 1px solid var(--gs-border); font-size: var(--gs-fs-sm); }

/* Ingredients / Quality / Research / FAQ / disclaimer */
.gs-pdp-ingredients, .gs-pdp-quality { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--gs-space-3); }
.gs-pdp-ingredients__item { display: flex; flex-direction: column; gap: 2px; padding-bottom: var(--gs-space-3); border-bottom: 1px solid var(--gs-border); }
.gs-pdp-ingredients__name { font-weight: 600; color: var(--gs-heading); }
.gs-pdp-ingredients__note { color: var(--gs-text-muted); font-size: var(--gs-fs-sm); }
.gs-pdp-quality__item { display: flex; align-items: flex-start; gap: var(--gs-space-3); color: var(--gs-text); }
.gs-pdp-quality__seal { flex: none; color: var(--gs-accent); }
.gs-pdp-research { color: var(--gs-text); }
.gs-pdp-research__source { font-weight: 600; }
.gs-pdp-disclaimer { margin-top: var(--gs-space-4); font-size: var(--gs-fs-xs); color: var(--gs-text-muted); font-style: italic; }
.gs-pdp-faq { margin-top: var(--gs-space-2); }

/* ---------- Related products / articles / recently viewed ---------- */
.single-product .related > h2, .single-product .up-sells > h2 { font-family: var(--gs-font-heading); font-size: var(--gs-fs-xl); color: var(--gs-heading); margin-bottom: var(--gs-space-5); }
.single-product .related.products, .single-product .up-sells.products { margin-top: var(--gs-space-8); }
.gs-pdp-articles.gs-section, .gs-pdp-recent.gs-section { padding-block: var(--gs-space-8) 0; }
.gs-pdp-articles > .gs-container, .gs-pdp-recent > .gs-container { max-width: none; padding-inline: 0; }
.gs-pdp-article { display: flex; flex-direction: column; align-items: flex-start; overflow: hidden; }
.gs-pdp-article__media { display: block; width: 100%; border-radius: var(--gs-radius); overflow: hidden; margin-bottom: var(--gs-space-3); background: var(--gs-surface-2); }
.gs-pdp-article__media img { width: 100%; height: auto; display: block; }
.gs-pdp-article__title { font-family: var(--gs-font-heading); font-size: var(--gs-fs-lg); color: var(--gs-heading); margin-bottom: var(--gs-space-2); }
.gs-pdp-article__title a { color: inherit; }
.gs-pdp-article__title a:hover { color: var(--gs-accent); }
.gs-pdp-article__excerpt { color: var(--gs-text-muted); font-size: var(--gs-fs-sm); }
.gs-pdp-recent__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: var(--gs-space-5); margin: 0; padding: 0; list-style: none; }

/* ---------- Reviews (real, WooCommerce) ---------- */
.woocommerce-Reviews .commentlist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--gs-space-4); }
.woocommerce-Reviews .comment_container { display: flex; gap: var(--gs-space-4); background: var(--gs-surface); border: 1px solid var(--gs-border); border-radius: var(--gs-radius); padding: var(--gs-space-4); }
.woocommerce-Reviews .woocommerce-noreviews { color: var(--gs-text-muted); }

/* ---------- Mobile sticky add-to-cart bar (built by product.js) ---------- */
.gs-pdp-stickybar {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: var(--gs-z-header);
    display: flex; align-items: center; gap: var(--gs-space-3);
    padding: var(--gs-space-3) var(--gs-gutter);
    background: color-mix(in srgb, var(--gs-bg) 92%, transparent);
    backdrop-filter: saturate(180%) blur(12px);
    border-top: 1px solid var(--gs-border);
    transform: translateY(100%); transition: transform var(--gs-dur) var(--gs-ease);
}
.gs-pdp-stickybar.is-visible { transform: translateY(0); }
.gs-pdp-stickybar__title { flex: 1 1 auto; font-weight: 600; color: var(--gs-heading); font-size: var(--gs-fs-sm); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gs-pdp-stickybar__price { font-weight: 700; color: var(--gs-heading); }
@media (min-width: 900px) { .gs-pdp-stickybar { display: none !important; } }

/* ---------- Compare tray (client-side, real card data) ---------- */
.gs-compare-toggle { display: inline-flex; align-items: center; gap: 0.4em; background: none; border: 0; color: var(--gs-text-muted); font-size: var(--gs-fs-sm); font-weight: 600; cursor: pointer; padding: 0; }
.gs-compare-toggle:hover, .gs-compare-toggle[aria-pressed="true"] { color: var(--gs-accent); }
.gs-compare-bar { position: fixed; left: 50%; bottom: var(--gs-space-5); transform: translateX(-50%) translateY(200%); z-index: var(--gs-z-toast); display: flex; align-items: center; gap: var(--gs-space-4); padding: var(--gs-space-3) var(--gs-space-5); background: var(--gs-ink); color: var(--gs-text-inverse); border-radius: var(--gs-radius-pill); box-shadow: var(--gs-shadow-lg); transition: transform var(--gs-dur) var(--gs-ease); }
.gs-compare-bar.is-visible { transform: translateX(-50%) translateY(0); }
.gs-compare-bar__count { font-weight: 700; }
.gs-compare-bar .gs-btn { white-space: nowrap; }
.gs-compare-modal { position: fixed; inset: 0; z-index: var(--gs-z-popup); display: grid; place-items: center; padding: var(--gs-space-5); }
.gs-compare-modal[hidden] { display: none; }
.gs-compare-modal__overlay { position: absolute; inset: 0; background: var(--gs-overlay); backdrop-filter: blur(2px); }
.gs-compare-modal__dialog { position: relative; z-index: 1; background: var(--gs-surface); border: 1px solid var(--gs-border); border-radius: var(--gs-radius-lg); box-shadow: var(--gs-shadow-lg); max-width: 900px; width: 100%; max-height: 88vh; overflow: auto; padding: var(--gs-space-6); }
.gs-compare-table { width: 100%; border-collapse: collapse; }
.gs-compare-table th, .gs-compare-table td { padding: var(--gs-space-3); border-bottom: 1px solid var(--gs-border); text-align: left; vertical-align: top; font-size: var(--gs-fs-sm); }
.gs-compare-table thead th { color: var(--gs-heading); }
.gs-compare-modal__close { position: absolute; top: 10px; right: 12px; }

/* ---------- Loading / error states ---------- */
.single-product .summary .single_add_to_cart_button.loading { opacity: 0.7; position: relative; pointer-events: none; }
.gs-pdp-error { padding: var(--gs-space-5); border: 1px solid var(--gs-danger-fg); border-radius: var(--gs-radius); color: var(--gs-danger-fg); background: var(--gs-danger-bg); font-size: var(--gs-fs-sm); }