/* ============================================================
   SINGLE PRODUCT PAGE LAYOUT (SILAII / SHOPIFY STYLE)
   ============================================================ */

/* Mobile First: Default stacking */
.single-product .skp-hybrid-container {
    /* Product content is intentionally light; header and footer keep the site theme. */
    --sk-bg: #ffffff;
    --sk-bg2: #f7f7f5;
    --sk-card: #ffffff;
    --sk-text: #1d1d1b;
    --sk-muted: #5c5c58;
    --sk-border: #deded8;
    background: #ffffff !important;
    color: #1d1d1b !important;
}

.single-product .skp-hybrid-container .summary,
.single-product .skp-hybrid-container .summary * {
    color: inherit;
}

.single-product .skp-hybrid-container .summary .price,
.single-product .skp-hybrid-container .summary .price *,
.single-product .skp-hybrid-container .summary .woocommerce-Price-amount {
    color: #9d6e20 !important;
}

.single-product .skp-hybrid-container .summary select,
.single-product .skp-hybrid-container .summary input.qty {
    background: #ffffff !important;
    color: #1d1d1b !important;
    border-color: #bdbdb7 !important;
}

.single-product div.product {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

/* Ensure gallery images take full width on mobile */
.woocommerce-product-gallery {
    width: 100% !important; /* Override inline WooCommerce styles */
    float: none !important;
}

.summary.entry-summary {
    width: 100% !important;
    float: none !important;
}

/* Desktop Split-Screen Sticky Layout */
@media (min-width: 992px) {
    .single-product div.product {
        display: grid;
        grid-template-columns: 1fr 1fr;
        align-items: start; /* CRITICAL for sticky to work */
        gap: 60px;
        position: relative;
    }

    /* Remove WooCommerce clearfixes that become ghost grid items */
    .single-product div.product::before,
    .single-product div.product::after {
        display: none !important;
    }

    /* Left Column: Gallery — STICKY while right column scrolls */
    .woocommerce-product-gallery {
        grid-column: 1;
        grid-row: 1;
        position: sticky;
        top: 90px;             /* offset below fixed header */
        align-self: start;     /* CRITICAL: without this, sticky won't work in grid */
        width: min(50%, 560px) !important;
        margin: 0 auto !important;
        padding: 0 !important;
        float: none !important;
        overflow: visible;
        justify-self: center;
    }

    /* Strip ALL extra space from every WooCommerce gallery child */
    .woocommerce-product-gallery__wrapper,
    .woocommerce-product-gallery figure,
    .woocommerce-product-gallery .flex-viewport,
    .woocommerce-product-gallery .flexslider,
    .woocommerce-product-gallery .woocommerce-product-gallery__image,
    .woocommerce-product-gallery ol.flex-control-nav {
        margin: 0 !important;
        padding: 0 !important;
        width: 100% !important;
        line-height: 0;
    }

    /* Images fill the column perfectly — no gaps */
    .woocommerce-product-gallery img {
        width: 100% !important;
        height: auto !important;
        object-fit: cover !important;
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
        float: none !important;
    }

    /* Sale badge sits over image, absolutely positioned inside figure */
    .woocommerce-product-gallery figure {
        position: relative !important;
        display: block !important;
    }
    .woocommerce-product-gallery figure span.onsale,
    .woocommerce-product-gallery span.onsale {
        position: absolute !important;
        top: 16px !important;
        left: 16px !important;
        z-index: 99 !important;
        margin: 0 !important;
    }

    /* Right Column: Summary — scrolls inside its own panel while the image stays fixed */
    .summary.entry-summary {
        grid-column: 2;
        grid-row: 1;
        position: relative;
        max-height: calc(100vh - 110px);
        overflow-y: auto;
        overflow-x: hidden;
        padding-right: 8px;
        scrollbar-width: thin;
        scrollbar-color: rgba(17, 17, 17, 0.25) transparent;
    }

    .summary.entry-summary::-webkit-scrollbar {
        width: 6px;
    }

    .summary.entry-summary::-webkit-scrollbar-thumb {
        background: rgba(17, 17, 17, 0.25);
        border-radius: 999px;
    }

    /* Full-Width Bottom Sections — span both columns */
    .woocommerce-tabs.wc-tabs-wrapper,
    #reviews,
    .woocommerce-Reviews,
    .woocommerce-product-reviews,
    .skp-reviews-section-wrapper,
    .skp-trust-icons-wrap,
    section.related.products,
    section.upsells.products,
    .skp-prefooter-trust {
        grid-column: 1 / -1 !important;
        clear: both;
        width: 100% !important;
        margin-top: 0 !important;
    }
    /* Reduce row gap between product grid and below sections */
    .single-product div.product {
        row-gap: 32px;
    }
    }
    /* Reduce gap above reviews/related */
    .single-product div.product {
        row-gap: 32px;
    }
}

/* Make tabs look cleaner on the right side */
.woocommerce-tabs ul.tabs {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,0.1) !important;
}
.woocommerce-tabs ul.tabs li {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
}
.woocommerce-tabs ul.tabs li.active {
    border-bottom: 2px solid var(--sk-gold2, #d4af37) !important;
}
.woocommerce-tabs ul.tabs li a {
    color: var(--sk-text, #111) !important;
    font-weight: 600 !important;
}
.woocommerce-tabs .panel {
    padding: 20px 0 !important;
}

/* ==========================================
   GALLERY STYLING TWEAKS
   ========================================== */

/* Make default WooCommerce gallery look cleaner */
.woocommerce-product-gallery .flex-viewport,
.woocommerce-product-gallery .woocommerce-product-gallery__wrapper,
.woocommerce-product-gallery .woocommerce-product-gallery__image {
    margin: 0 !important;
    padding: 0 !important;
        overflow: visible !important;
    }

    .woocommerce-product-gallery .woocommerce-product-gallery__image img {
        width: 100% !important;
        height: auto !important;
        display: block !important;
        margin: 0 !important;
    }

    .woocommerce-product-gallery .flex-control-thumbs {
        display: flex !important;
        gap: 12px !important;
        margin-top: 16px !important;
        padding: 0 !important;
        flex-wrap: wrap;
    }

    .woocommerce-product-gallery .flex-control-thumbs li {
        width: calc(25% - 9px) !important;
        float: none !important;
        margin: 0 !important;
    }

    .woocommerce-product-gallery .flex-control-thumbs img {
        width: 100% !important;
        height: auto !important;
        border-radius: 8px !important;
        border: 2px solid transparent !important;
        transition: border-color 0.2s !important;
        cursor: pointer !important;
    }

    .woocommerce-product-gallery .flex-control-thumbs img.flex-active {
        border-color: var(--sk-gold2, #d4af37) !important;
        opacity: 1 !important;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

.woocommerce-product-gallery .flex-control-thumbs {
    display: flex;
    gap: 12px;
    margin-top: 12px;
    padding: 0;
}

.woocommerce-product-gallery .flex-control-thumbs li {
    width: calc(25% - 9px) !important; /* Usually 4 up */
    float: none !important;
}

.woocommerce-product-gallery .flex-control-thumbs img {
    border-radius: 8px;
    border: 2px solid transparent;
    transition: border-color 0.2s;
    cursor: pointer;
}

.woocommerce-product-gallery .flex-control-thumbs img.flex-active {
    border-color: var(--sk-gold2, #d4af37);
    opacity: 1 !important;
}

/* ==========================================
   SUMMARY TYPOGRAPHY & BUTTONS
   ========================================== */
.summary.entry-summary .product_title {
    font-family: var(--sk-font-display, serif);
    font-size: clamp(2rem, 3vw, 2.8rem);
    line-height: 1.1;
    margin-bottom: 12px;
    color: var(--sk-text, #111);
}

.summary.entry-summary .price {
    font-family: var(--sk-font-ui, sans-serif);
    font-size: 1.5rem;
    color: var(--sk-gold2, #d4af37);
    font-weight: 600;
    margin-bottom: 24px;
}

/* Add to Cart Button Premium Look */
.woocommerce div.product form.cart .button {
    background: var(--sk-text, #111);
    color: var(--sk-card, #fff);
    border: none;
    border-radius: 6px;
    padding: 16px 32px;
    font-family: var(--sk-font-ui, sans-serif);
    font-size: 1rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    width: 100%;
    transition: opacity 0.2s;
    margin-top: 16px;
}

.woocommerce div.product form.cart .button:hover {
    opacity: 0.8;
}

/* Variations Table overrides for future Swatches */
.woocommerce div.product form.cart .variations {
    width: 100%;
    margin-bottom: 24px;
}

.woocommerce div.product form.cart .variations th {
    text-align: left;
    font-family: var(--sk-font-ui, sans-serif);
    font-weight: 600;
    color: var(--sk-text, #111);
    padding-bottom: 8px;
}

.woocommerce div.product form.cart .variations td {
    padding-bottom: 16px;
}

/* ------------------------------------------
   VARIATION SWATCHES (GOLD THEME)
   ------------------------------------------ */
/*
 * Swatch plugins replace WooCommerce's select with a list of buttons.  Some
 * plugin themes carry a hidden/collapsed state from archive cards into the
 * single-product form, so reset that state only in the product purchase form.
 */
.single-product div.product form.variations_form .variations,
.single-product div.product form.variations_form .variable-items-wrapper,
.single-product div.product form.variations_form .woo-variation-items-wrapper,
.single-product div.product form.variations_form .tawcvs-swatches,
.single-product div.product form.variations_form .swatch-wrapper {
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
}

.single-product div.product form.variations_form .swatch-wrapper {
    display: block !important;
}

.single-product div.product form.variations_form .variable-items-wrapper,
.single-product div.product form.variations_form .woo-variation-items-wrapper,
.single-product div.product form.variations_form .tawcvs-swatches {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    margin: 8px 0 16px !important;
    padding: 0 !important;
    list-style: none !important;
}

.single-product div.product form.variations_form .variable-item,
.single-product div.product form.variations_form .swatch,
.single-product div.product form.variations_form .swatch-wrapper > * {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    inset: auto !important;
}

/*
 * Functional fallback: swatch extensions often visually hide the original
 * select fields.  When their replacement UI does not initialise on this
 * custom product template, leaving those fields hidden removes every way to
 * choose a variation.  Keep the native WooCommerce selectors available.
 */
.single-product div.product form.variations_form table.variations select,
.single-product div.product form.variations_form .variations select {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: static !important;
    clip: auto !important;
    clip-path: none !important;
    width: 100% !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 10px 12px !important;
    appearance: auto !important;
    -webkit-appearance: menulist !important;
}

/* Common swatch plugin classes (Woo Variation Swatches, Variation Swatches for Woo, etc) */
.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item),
.tawcvs-swatches .swatch,
table.variations .variable-item,
table.variations .swatch {
    background: transparent !important;
    border: 2px solid var(--sk-gold) !important;
    color: var(--sk-text) !important;
    border-radius: 4px !important;
    transition: all 0.3s ease !important;
    box-shadow: none !important;
}
/* Hover State */
.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item):hover,
.tawcvs-swatches .swatch:hover,
table.variations .variable-item:hover,
table.variations .swatch:hover {
    background: rgba(199, 150, 62, 0.1) !important; /* Subtle gold tint */
    border-color: var(--sk-gold2) !important;
}
/* Selected State */
.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).selected,
.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).active,
.tawcvs-swatches .swatch.selected,
table.variations .variable-item.selected,
table.variations .swatch.selected,
table.variations .swatch.active {
    background: var(--sk-gold) !important;
    color: #fff !important;
    border-color: var(--sk-gold2) !important;
    box-shadow: 0 2px 10px rgba(199, 150, 62, 0.2) !important;
}

/* ==========================================
   TRUST ICONS SECTION
   ========================================== */
.skp-trust-icons-wrap {
    width: 100%;
    max-width: 1200px;
    margin: 20px auto 20px;
    text-align: center;
    padding: 0 20px;
    clear: both;
}

.skp-trust-icons-wrap h2 {
    font-size: 1.6rem;
    font-weight: 500;
    margin-bottom: 40px;
    color: var(--sk-text, #111);
    font-family: var(--sk-font-heading, serif);
}

.skp-trust-icons-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    align-items: start;
}

.skp-trust-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
}

.skp-trust-item svg {
    width: 64px;
    height: 64px;
    color: var(--sk-text, #111);
    stroke-width: 1.2px;
}

.skp-trust-item span {
    font-size: 0.85rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--sk-text, #111);
}

@media (max-width: 768px) {
    .skp-trust-icons-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 32px 20px;
    }
    
    .skp-trust-item svg {
        width: 48px;
        height: 48px;
    }
}

/* ==========================================
   STICKY ADD TO CART CARD (BOTTOM RIGHT)
   ========================================== */
.skp-sticky-atc-card {
    position: fixed;
    bottom: 24px;
    right: 24px;
    background: var(--sk-card, #fff);
    border: 1px solid var(--sk-border, #eee);
    border-radius: 8px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
    z-index: 99998;
    padding: 16px;
    width: 320px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(30px);
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    font-family: var(--sk-font-ui, sans-serif);
}

.skp-sticky-atc-card.is-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.skp-sticky-atc-content {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.skp-sticky-info {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.skp-sticky-info h4 {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
    color: var(--sk-text, #111);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.skp-sticky-vars {
    font-size: 0.85rem;
    color: var(--sk-muted, #666);
    min-height: 18px; /* space for variation text */
}

.skp-sticky-img {
    display: none; /* Hide image on this small floating card to save space */
}

.skp-sticky-btn {
    background: var(--sk-text, #111);
    color: var(--sk-card, #fff);
    border: 1px solid var(--sk-text, #111);
    padding: 12px 24px;
    text-align: center;
    border-radius: 4px;
    font-weight: 600;
    cursor: pointer;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    transition: all 0.2s;
}

.skp-sticky-btn:hover {
    background: transparent;
    color: var(--sk-text, #111);
}

@media (max-width: 768px) {
    .skp-sticky-atc-card {
        bottom: 0;
        right: 0;
        width: 100%;
        border-radius: 12px 12px 0 0;
        padding: 12px;
        box-shadow: 0 -4px 20px rgba(0,0,0,0.1);
    }
}

/* ==========================================
   PRODUCT ACCORDIONS (RIGHT COLUMN)
   ========================================== */
.skp-product-accordions {
    margin-top: 32px;
    border-top: 1px solid var(--sk-border, #eee);
}

.skp-accordion-item {
    border-bottom: 1px solid var(--sk-border, #eee);
}

.skp-accordion-header {
    width: 100%;
    background: transparent;
    border: none;
    padding: 20px 0;
    text-align: left;
    font-size: 1rem;
    font-weight: 600;
    color: var(--sk-text, #111);
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-family: var(--sk-font-ui, sans-serif);
}

.skp-acc-icon {
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1;
    color: var(--sk-muted, #999);
    transition: transform 0.3s;
}

.skp-accordion-header[aria-expanded="true"] .skp-acc-icon {
    transform: rotate(45deg);
}

.skp-accordion-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-out;
}

.skp-accordion-inner {
    padding: 0 0 24px 0;
    font-size: 0.95rem;
    line-height: 1.6;
    color: var(--sk-muted, #444);
}

.skp-accordion-inner ul {
    padding-left: 20px;
    margin-bottom: 16px;
}

/* ==========================================
   SUMMARY LAYOUT CUSTOMIZATIONS (SILAII)
   ========================================== */

/* Rating Pill */
.woocommerce-product-rating {
    display: inline-flex !important;
    align-items: center;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 20px;
    padding: 6px 12px;
    margin-bottom: 20px !important;
    font-size: 0.9rem;
    font-weight: 600;
}
.woocommerce-product-rating .star-rating {
    margin-right: 8px;
    font-size: 0.9rem;
    color: #e6a822;
}
.woocommerce-product-rating .woocommerce-review-link {
    color: #333;
    text-decoration: none;
}
.woocommerce-product-details__short-description {
    font-size: 0.95rem;
    line-height: 1.6;
    margin-bottom: 24px;
    color: var(--sk-muted);
}
/* Price */
p.price {
    font-size: 1.8rem !important;
    font-weight: 500 !important;
    color: #b33 !important;
    margin-bottom: 8px !important;
}

/* ==========================================
   CUSTOM QUANTITY SELECTOR
   ========================================== */
.skp-custom-qty,
.woocommerce div.product form.cart div.quantity.skp-custom-qty {
    display: inline-flex !important;
    align-items: center !important;
    border: 1px solid var(--sk-border) !important;
    border-radius: 4px !important;
    height: 48px !important;
    background: transparent !important;
    padding: 0 !important;
}
.skp-custom-qty .qty-btn {
    background: transparent !important;
    color: var(--sk-text) !important;
    border: none !important;
    width: 40px !important;
    height: 100% !important;
    font-size: 1.2rem !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.2s !important;
}
.skp-custom-qty .qty-btn:hover {
    background: rgba(255,255,255,0.05) !important;
}
.skp-custom-qty input.qty {
    width: 50px !important;
    text-align: center !important;
    border: none !important;
    background: transparent !important;
    color: var(--sk-text) !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    padding: 0 !important;
    height: 100% !important;
    box-shadow: none !important;
}
.skp-custom-qty input.qty::-webkit-outer-spin-button,
.skp-custom-qty input.qty::-webkit-inner-spin-button {
    -webkit-appearance: none !important;
    margin: 0 !important;
}
.skp-custom-qty input.qty[type=number] {
    -moz-appearance: textfield !important;
}

/* Add to Cart & Buy Now Buttons */
.woocommerce div.product form.cart {
    margin-bottom: 32px !important;
    position: relative;
    z-index: 10;
    width: 100% !important;
}

/* Variable products need their table and variation wrapper to retain WooCommerce's layout. */
.woocommerce div.product form.variations_form.cart {
    display: block !important;
}
.woocommerce div.product form.variations_form.cart .variations {
    display: table !important;
    width: 100% !important;
    margin: 0 0 24px !important;
}
.woocommerce div.product form.variations_form.cart .woocommerce-variation,
.woocommerce div.product form.variations_form.cart .woocommerce-variation-add-to-cart {
    display: block !important;
    width: 100%;
}
/*
 * WooCommerce hides this wrapper until a complete variation has been chosen.
 * Keeping it visible prevents an unconfigured or unavailable variation from
 * making the entire purchase area appear to be missing.  The button remains
 * disabled until WooCommerce validates the selected variation.
 */
.woocommerce div.product form.variations_form.cart .single_variation_wrap {
    display: block !important;
    min-height: 56px;
}
.woocommerce div.product form.variations_form.cart .single_variation_wrap .woocommerce-variation-description,
.woocommerce div.product form.variations_form.cart .single_variation_wrap .woocommerce-variation-price {
    display: block !important;
}

/* Simple product controls and the selected variation controls share a compact row. */
.woocommerce div.product form.cart:not(.variations_form),
.woocommerce div.product .woocommerce-variation-add-to-cart {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
    align-items: center !important;
}
.woocommerce div.product form.cart .skp-custom-qty {
    flex: 0 0 auto;
}

/* ADD TO CART BUTTON — always gold, always clickable */
.woocommerce div.product form.cart button.single_add_to_cart_button,
.woocommerce div.product form.cart .single_add_to_cart_button,
.woocommerce div.product form.cart button.skp-buy-now-btn {
    flex: 1 1 100%;
    background: var(--sk-gold) !important;
    color: #fff !important;
    border: 1px solid var(--sk-gold2) !important;
    border-radius: 4px !important;
    text-transform: uppercase !important;
    font-weight: 600 !important;
    font-size: 1rem !important;
    padding: 16px !important;
    margin-top: 12px !important;
    width: 100% !important;
    cursor: pointer !important;
    pointer-events: all !important;
    opacity: 1 !important;
    transition: all 0.3s;
    box-shadow: 0 4px 15px rgba(199, 150, 62, 0.2);
    display: block !important;
}
.woocommerce div.product form.cart button.single_add_to_cart_button:hover,
.woocommerce div.product form.cart button.skp-buy-now-btn:hover {
    background: var(--sk-gold2) !important;
    border-color: var(--sk-gold) !important;
    box-shadow: 0 6px 20px rgba(199, 150, 62, 0.35) !important;
}

/* Remove WooCommerce greying out of disabled state — let the button always show gold */
.woocommerce div.product form.cart button.single_add_to_cart_button.disabled,
.woocommerce div.product form.cart button.single_add_to_cart_button.wc-variation-is-unavailable {
    background: var(--sk-gold) !important;
    opacity: 0.7 !important;
    cursor: not-allowed !important;
}

/* Ensure nothing sits on top of the form */
.summary.entry-summary {
    isolation: isolate;
    min-height: 0;
}
.woocommerce div.product form.cart button,
.woocommerce div.product form.cart input[type="submit"] {
    position: relative;
    z-index: 20;
    pointer-events: all !important;
}

/* PRODUCT VISUALIZER — DETAILS & PLACEMENT */
.skp-product-visualizer { background:#f7f5ef; color:#1d1d1b; padding:clamp(28px,5vw,64px); margin:32px 0 0; border-top:1px solid #ded9cd; border-bottom:1px solid #ded9cd; }
.skp-visualizer-heading { max-width:760px; margin:0 auto 24px; text-align:center; }
.skp-visualizer-eyebrow { color:#9d6e20; font-size:.75rem; font-weight:700; letter-spacing:.13em; margin:0 0 8px; text-transform:uppercase; }
.skp-visualizer-heading h2 { color:#1d1d1b; font-family:var(--sk-font-display,serif); font-size:clamp(1.8rem,4vw,3rem); margin:0; }
.skp-visualizer-stage { background:#181715; margin:0 auto; max-width:920px; overflow:hidden; position:relative; }
.skp-visualizer-image { display:block; height:auto; max-height:70vh; object-fit:contain; width:100%; }
.skp-hotspot { align-items:center; background:#b9852d; border:2px solid #fff; border-radius:50%; box-shadow:0 2px 16px rgba(0,0,0,.35); color:#fff; cursor:pointer; display:flex; font-size:1.35rem; height:38px; justify-content:center; padding:0; position:absolute; transform:translate(-50%,-50%); width:38px; }
.skp-hotspot:hover,.skp-hotspot:focus-visible { background:#1d1d1b; outline:3px solid rgba(185,133,45,.4); outline-offset:3px; }
.skp-visualizer-hint { color:#5c5c58; font-size:.9rem; margin:14px auto 0; max-width:920px; text-align:center; }
.skp-placement-section { margin:36px auto 0; max-width:920px; }
.skp-placement-section h3 { color:#1d1d1b; font-size:1.2rem; margin:0 0 14px; }
.skp-placement-grid { display:grid; gap:12px; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); }
.skp-placement-card { background:#fff; border:2px solid transparent; color:#1d1d1b; cursor:pointer; padding:0; text-align:left; }
.skp-placement-card.is-active,.skp-placement-card:hover,.skp-placement-card:focus-visible { border-color:#b9852d; outline:none; }
.skp-placement-card img { aspect-ratio:4 / 3; display:block; object-fit:cover; width:100%; }
.skp-placement-card span { display:block; font-size:.88rem; font-weight:700; padding:9px 10px; }
.skp-placement-caption { color:#5c5c58; margin:14px 0 0; min-height:1.5em; }
.skp-visualizer-modal[hidden] { display:none; }
.skp-visualizer-modal { align-items:center; display:flex; inset:0; justify-content:center; padding:20px; position:fixed; z-index:100000; }
.skp-visualizer-modal__backdrop { background:rgba(0,0,0,.82); inset:0; position:absolute; }
.skp-visualizer-modal__panel { background:#fff; color:#1d1d1b; max-height:calc(100vh - 40px); max-width:min(980px,100%); overflow:auto; position:relative; width:100%; z-index:1; }
.skp-visualizer-modal__image { display:block; max-height:70vh; object-fit:contain; width:100%; }
.skp-visualizer-modal__copy { padding:20px 24px 24px; }
.skp-visualizer-modal__copy h3,.skp-visualizer-modal__copy p { margin:0 0 8px; }
.skp-visualizer-modal__close { background:#fff; border:0; border-radius:50%; color:#1d1d1b; cursor:pointer; font-size:2rem; height:42px; line-height:1; position:absolute; right:12px; top:12px; width:42px; z-index:2; }
@media (min-width:992px) { .skp-product-visualizer { grid-column:1 / -1; width:100%; } }


/* ==========================================
   RELATED PRODUCTS
   ========================================== */
section.related.products {
    background: var(--sk-bg, #f4f4f4);
    padding: 40px 20px !important;
    margin-top: 20px !important;
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    border-top: none !important;
    box-sizing: border-box;
}
section.related.products > h2, 
section.related.products > ul.products {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}
section.related.products > h2 {
    text-align: center;
    font-size: 1.8rem;
    color: var(--sk-text, #222);
    margin-bottom: 30px;
    text-transform: none;
    font-family: var(--sk-font-ui, sans-serif);
}
.related.products ul.products li.product {
    background: var(--sk-card, #fff);
    border-radius: 8px;
    overflow: hidden;
    padding: 12px;
    text-align: left;
    box-shadow: 0 2px 10px rgba(0,0,0,0.03);
    border: 1px solid var(--sk-border);
}
.related.products ul.products li.product img {
    border-radius: 4px;
    width: 100%;
}
.related.products ul.products li.product .woocommerce-loop-product__title {
    font-size: 0.95rem;
    font-weight: 600;
    color: #111;
    margin-top: 12px;
    line-height: 1.4;
}
.related.products ul.products li.product .price {
    font-size: 1rem;
    color: #8b3a3a;
    font-weight: 600;
    margin-top: 8px;
}
.related.products ul.products li.product .button {
    display: block;
    width: 100%;
    background: var(--sk-gold) !important;
    color: #fff !important;
    text-align: center;
    border-radius: 4px;
    padding: 12px 0;
    border: 1px solid var(--sk-gold2) !important;
    margin-top: 16px;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 0.85rem;
}
.related.products ul.products li.product .button:hover {
    background: var(--sk-gold2) !important;
}

/* ==========================================
   TRUST ICONS & DISCLAIMER CLASSES
   ========================================== */
.skp-trust-box {
    background: #f8f8f8;
    border-radius: 8px;
    padding: 24px 12px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    text-align: center;
    margin-bottom: 24px;
}
.skp-trust-box svg { stroke: #666; }
.skp-trust-box strong {
    font-size: 0.75rem;
    text-transform: uppercase;
    display: block;
    line-height: 1.4;
    color: #333;
}
.skp-disclaimer-box {
    border: 1px solid #eaeaea;
    background: #fff;
    padding: 20px;
    border-radius: 8px;
    font-size: 0.85rem;
    color: #666;
    margin-bottom: 24px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.02);
}
.skp-bonus-box {
    background: #5a4634;
    color: #fff;
    padding: 12px 16px;
    border-radius: 6px;
    display: inline-block;
    margin-bottom: 24px;
    font-size: 0.95rem;
}
.skp-desc-card {
    border: 1px solid #eee;
    border-radius: 8px;
    padding: 12px;
    text-align: center;
    background: #fff;
}
.skp-desc-card strong {
    display: block;
    font-size: 0.9rem;
    margin-bottom: 4px;
    color: #111;
}
.skp-desc-card span {
    font-size: 0.8rem;
    color: #666;
}

/* ==========================================
   DARK MODE OVERRIDES
   ========================================== */
body.dark-theme .woocommerce-product-rating,
body.dark-mode .woocommerce-product-rating {
    background: #222;
    border-color: #333;
}
body.dark-theme .woocommerce-product-rating .woocommerce-review-link,
body.dark-mode .woocommerce-product-rating .woocommerce-review-link {
    color: #eee;
}
body.dark-theme .skp-custom-qty,
body.dark-mode .skp-custom-qty {
    background: #222;
    border-color: #444;
}
body.dark-theme .skp-custom-qty .qty-btn,
body.dark-theme .skp-custom-qty input.qty,
body.dark-mode .skp-custom-qty .qty-btn,
body.dark-mode .skp-custom-qty input.qty {
    color: #eee;
}
body.dark-theme .skp-custom-qty .qty-btn:hover,
body.dark-mode .skp-custom-qty .qty-btn:hover {
    background: #333;
}
body.dark-theme section.related.products,
body.dark-mode section.related.products {
    background: #111;
}
body.dark-theme section.related.products > h2,
body.dark-mode section.related.products > h2 {
    color: #eee;
}
body.dark-theme .related.products ul.products li.product,
body.dark-mode .related.products ul.products li.product {
    background: #222;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}
body.dark-theme .related.products ul.products li.product .woocommerce-loop-product__title,
body.dark-mode .related.products ul.products li.product .woocommerce-loop-product__title {
    color: #eee;
}

/* Trust Icons / Disclaimer Dark Mode */
body.dark-theme .skp-trust-box,
body.dark-mode .skp-trust-box {
    background: #222;
}
body.dark-theme .skp-trust-box svg,
body.dark-mode .skp-trust-box svg { stroke: #aaa; }
body.dark-theme .skp-trust-box strong,
body.dark-mode .skp-trust-box strong { color: #eee; }

body.dark-theme .skp-disclaimer-box,
body.dark-mode .skp-disclaimer-box {
    background: #222;
    border-color: #333;
    color: #aaa;
}
body.dark-theme .skp-desc-card,
body.dark-mode .skp-desc-card {
    background: #222;
    border-color: #333;
}
body.dark-theme .skp-desc-card strong,
body.dark-mode .skp-desc-card strong { color: #eee; }
/* ==========================================
   REVIEWS GRID REDESIGN
   ========================================== */
.skp-reviews-section-wrapper {
    background: var(--sk-bg, #fff);
    border-top: 1px solid var(--sk-border, #eaeaea);
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    position: relative;
}
.skp-reviews-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 60px 20px;
}
#reviews {
    display: flex;
    flex-direction: column;
    gap: 40px;
    width: 100%;
}
#reviews #comments {
    width: 100%;
}
#reviews .woocommerce-Reviews-title {
    font-size: 1.8rem;
    color: var(--sk-text, #222);
    margin-bottom: 30px;
    font-family: var(--sk-font-ui, sans-serif);
}
#reviews .commentlist {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
    padding: 0;
    margin: 0;
    list-style: none;
}
@media (min-width: 768px) {
    #reviews .commentlist {
        grid-template-columns: 1fr 1fr; /* 2 column masonry-style grid */
    }
}
#reviews .commentlist li.review {
    background: var(--sk-card, #fcfcfc);
    border: 1px solid var(--sk-border, #eee);
    border-radius: 8px;
    padding: 24px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.02);
}
#reviews .commentlist li.review img.avatar {
    border-radius: 50%;
    width: 40px;
    height: 40px;
    float: left;
    margin-right: 12px;
}
#reviews .commentlist li.review .meta {
    font-size: 0.85rem;
    color: var(--sk-muted, #666);
    margin-bottom: 12px;
}
#reviews .commentlist li.review .meta strong {
    color: var(--sk-text, #111);
    display: block;
    font-size: 1rem;
}
#reviews .commentlist li.review .description {
    font-size: 0.95rem;
    line-height: 1.6;
    color: var(--sk-text, #444);
    clear: both;
}

/* Review Form Styling */
#review_form_wrapper {
    background: var(--sk-bg2, #f8f8f8);
    padding: 40px;
    border-radius: 8px;
    border: 1px solid var(--sk-border, #eee);
    max-width: 800px;
    margin: 0 auto;
}
#review_form_wrapper .comment-reply-title {
    font-size: 1.2rem;
    margin-bottom: 20px;
    display: block;
    color: var(--sk-text, #111);
}
#review_form_wrapper input[type="text"],
#review_form_wrapper input[type="email"],
#review_form_wrapper textarea {
    width: 100%;
    padding: 12px;
    border: 1px solid #ccc;
    border-radius: 4px;
    margin-bottom: 16px;
    font-family: var(--sk-font-ui, sans-serif);
}
#review_form_wrapper input[type="submit"] {
    background: var(--sk-gold, #c7963e) !important;
    color: #fff !important;
    border: 1px solid var(--sk-gold2, #d4af37) !important;
    padding: 12px 24px;
    border-radius: 4px;
    font-weight: 600;
    text-transform: uppercase;
    cursor: pointer;
    width: 100%;
    letter-spacing: 0.08em;
    transition: all 0.3s;
    box-shadow: 0 4px 15px rgba(199, 150, 62, 0.2);
}
#review_form_wrapper input[type="submit"]:hover {
    background: var(--sk-gold2, #d4af37) !important;
    box-shadow: 0 6px 20px rgba(199, 150, 62, 0.35);
}

/* Reviews Dark Mode Overrides */
body.dark-theme .skp-reviews-section-wrapper,
body.dark-mode .skp-reviews-section-wrapper {
    background: #1a1a1a;
    border-color: #333;
}
body.dark-theme #reviews .woocommerce-Reviews-title,
body.dark-mode #reviews .woocommerce-Reviews-title {
    color: #eee;
}
body.dark-theme #reviews .commentlist li.review,
body.dark-mode #reviews .commentlist li.review {
    background: #222;
    border-color: #333;
}
body.dark-theme #reviews .commentlist li.review .meta strong,
body.dark-mode #reviews .commentlist li.review .meta strong,
body.dark-theme #reviews .commentlist li.review .description,
body.dark-mode #reviews .commentlist li.review .description {
    color: #ddd;
}
body.dark-theme #review_form_wrapper,
body.dark-mode #review_form_wrapper {
    background: #222;
    border-color: #333;
}
body.dark-theme #review_form_wrapper .comment-reply-title,
body.dark-mode #review_form_wrapper .comment-reply-title {
    color: #eee;
}
body.dark-theme #review_form_wrapper input[type="text"],
body.dark-theme #review_form_wrapper input[type="email"],
body.dark-theme #review_form_wrapper textarea,
body.dark-mode #review_form_wrapper input[type="text"],
body.dark-mode #review_form_wrapper input[type="email"],
body.dark-mode #review_form_wrapper textarea {
    background: #111;
    border-color: #444;
    color: #eee;
}
