/* ============================================================
   Aurea — Single Product (Experience) page restyle
   Scoped to body.single-product so other routes are untouched.
   NOTE: This file ONLY styles visual elements (typography, colors,
   buttons, chips). It does NOT change layout or grid — the parent
   theme owns the gallery/summary column structure.
   ============================================================ */

:root{
    --asp-maroon:#7a2e2e;
    --asp-maroon-deep:#5e1f1f;
    --asp-gold:#b8924f;
    --asp-gold-bright:#d8b15a;
    --asp-cream:#fdfbf6;
    --asp-cream-soft:#faf6ed;
    --asp-ink:#1f1720;
    --asp-ink-soft:#3a3340;
    --asp-muted:#7a7280;
    --asp-line:#ece6dc;
    --asp-line-soft:#f3eee5;
    --asp-radius:14px;
    --asp-radius-sm:10px;
    --asp-shadow-md:0 14px 30px rgba(31,23,32,.06);
    --asp-shadow-sm:0 4px 14px rgba(31,23,32,.05);
    --asp-serif:Georgia,"Times New Roman",serif;
    --asp-sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}

body.single-product{
    color:var(--asp-ink);
    font-family:var(--asp-sans);
    background:linear-gradient(180deg, #fbf8f3 0%, #f7efe1 55%, #f3e9dc 100%) !important;
}

/* Soft gold radial halo at the top to add warmth (matches home page hero) */
body.single-product::before{
    content:"";
    position:fixed; inset:0;
    pointer-events:none;
    z-index:0;
    background:
        radial-gradient(80% 50% at 50% 0%, rgba(216,177,90,.10) 0%, transparent 60%),
        radial-gradient(60% 40% at 50% 100%, rgba(122,46,46,.04) 0%, transparent 60%);
}
body.single-product #main-container,
body.single-product #main-content,
body.single-product .container{
    position:relative; z-index:1;
}

/* -------------------------------------------- Safe Checkout (relocated) -------- */
/* Hide the widget by default — the relocator JS appends it into #asp-safe-checkout-mount,
   where the deeper-selector rule below re-shows it. Prevents flash-of-wrong-location. */
.widget-text-safe-checkout,
.safe_custom{ display:none !important; }

/* Clean wrapper — let the widget render with its own design, just give it room + centering. */
#asp-safe-checkout-mount{
    max-width:980px;
    margin:48px auto 56px;
    padding:0 18px;
    position:relative; z-index:1;
}
#asp-safe-checkout-mount:empty{ display:none; }
#asp-safe-checkout-mount .widget-text-safe-checkout,
#asp-safe-checkout-mount .safe_custom{
    display:block !important;
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    float:none !important;
}

/* -------------------------------------------- Description / Tabs section -------- */
/* Wrap the description+reviews block in a soft white card so it integrates with the
   cream page bg. Targets the multiple wrappers the theme might use. */
body.single-product .urna-tab-content,
body.single-product .urna-product-tabs,
body.single-product .wc-tabs-wrapper,
body.single-product .woocommerce-tabs{
    background:#ffffff;
    border:1px solid var(--asp-line);
    border-radius:16px;
    padding:30px 32px;
    box-shadow:0 14px 32px rgba(31,23,32,.06);
    margin:32px auto 48px;
    max-width:1200px;
    position:relative; z-index:1;
}
/* Tab headings */
body.single-product .woocommerce-Tabs-panel--description h2:first-child,
body.single-product .woocommerce-Tabs-panel h2:first-child,
body.single-product .urna-tab-content h3:first-child{
    margin-top:0;
    font-family:var(--asp-serif);
    font-size:22px;
    font-weight:600;
    color:var(--asp-ink);
}
body.single-product .woocommerce-Tabs-panel h3,
body.single-product .urna-tab-content h4{
    font-family:var(--asp-serif);
    color:var(--asp-ink);
    margin-top:24px;
}
body.single-product .woocommerce-Tabs-panel p,
body.single-product .woocommerce-Tabs-panel li,
body.single-product .urna-tab-content p,
body.single-product .urna-tab-content li{
    color:var(--asp-ink-soft);
    line-height:1.7;
    font-size:14.5px;
}
body.single-product .woocommerce-Tabs-panel strong{ color:var(--asp-ink); }

/* Accordion-style headers (Urna's collapsible "Description" / "Reviews" rows) */
body.single-product .urna-tabs-collapse,
body.single-product .woocommerce-tabs .urna-tab-title,
body.single-product .urna-tab-content > h3,
body.single-product .urna-tab-content > .ui-accordion-header{
    background:transparent !important;
    border:0 !important;
    border-bottom:1px solid var(--asp-line) !important;
    padding:14px 0 !important;
    font-family:var(--asp-serif) !important;
    font-size:16px !important;
    font-weight:600 !important;
    color:var(--asp-ink) !important;
    letter-spacing:0 !important;
    text-transform:none !important;
    cursor:pointer;
}

/* Related products section — also card-ify */
body.single-product .related.products,
body.single-product .up-sells.products{
    background:#ffffff;
    border:1px solid var(--asp-line);
    border-radius:16px;
    padding:30px 32px;
    box-shadow:0 14px 32px rgba(31,23,32,.06);
    margin:32px auto 56px;
    max-width:1200px;
    position:relative; z-index:1;
}
body.single-product .related.products > h2,
body.single-product .up-sells.products > h2{
    font-family:var(--asp-serif);
    font-size:22px;
    font-weight:600;
    color:var(--asp-ink);
    margin:0 0 24px;
    text-align:center;
}

@media(max-width:768px){
    #asp-safe-checkout-mount{ margin:32px auto 40px; padding:0 12px; }
    body.single-product .urna-tab-content,
    body.single-product .wc-tabs-wrapper,
    body.single-product .woocommerce-tabs,
    body.single-product .related.products,
    body.single-product .up-sells.products{
        padding:22px 18px;
        margin:22px 10px 36px;
        border-radius:14px;
    }
}

/* -------------------------------------------- Title -------- */
body.single-product .product_title.entry-title,
body.single-product .summary h1.product_title{
    display:block !important;
    font-family:var(--asp-serif);
    font-size:clamp(26px,3.2vw,38px);
    font-weight:600;
    line-height:1.18;
    letter-spacing:-.005em;
    color:var(--asp-ink);
    margin:0 0 14px;
    text-align:left !important;
}

/* Quick-info chip row (rendered via PHP at priority 6) */
.asp-quick-info{
    display:flex; flex-wrap:wrap; gap:8px;
    margin:0 0 18px;
}
.asp-chip{
    display:inline-flex; align-items:center; gap:7px;
    padding:6px 12px;
    background:var(--asp-cream-soft);
    border:1px solid var(--asp-line);
    border-radius:999px;
    font-size:12.5px;
    font-weight:600;
    color:var(--asp-ink-soft);
    letter-spacing:.01em;
    line-height:1.3;
}
.asp-chip svg{ width:14px; height:14px; color:var(--asp-gold); flex:0 0 14px; }

/* -------------------------------------------- Price -------- */
body.single-product .summary .price,
body.single-product .summary p.price{
    margin:0 0 14px !important;
    padding:0 0 14px;
    border-bottom:1px dashed var(--asp-line);
    line-height:1.15;
}

/* Hide the "Minimum X people" duplicate — the chip under the title already shows it. */
body.single-product .summary .price .aurea-min-group,
body.single-product .summary .aurea-min-group{ display:none !important; }

/* When the user picks variation options, WC shows .woocommerce-variation-price.
   Style it the same as the main hero price so the updated price looks consistent. */
body.single-product .woocommerce-variation{
    margin:0 0 18px !important;
}
body.single-product .woocommerce-variation-price{
    margin:6px 0 14px !important;
    padding:0 0 14px;
    border-bottom:1px dashed var(--asp-line);
}
body.single-product .woocommerce-variation-price .price,
body.single-product .woocommerce-variation-price .price .woocommerce-Price-amount,
body.single-product .woocommerce-variation-price .woocommerce-Price-amount{
    color:var(--asp-maroon) !important;
    font-family:var(--asp-serif);
    font-size:30px !important;
    font-weight:700;
    text-decoration:none !important;
}
body.single-product .woocommerce-variation-availability{ display:none !important; }
body.single-product .summary .price ins,
body.single-product .summary .price .woocommerce-Price-amount,
body.single-product .summary p.price .woocommerce-Price-amount{
    color:var(--asp-maroon) !important;
    font-family:var(--asp-serif);
    font-size:32px !important;
    font-weight:700;
    text-decoration:none !important;
    background:transparent !important;
}
body.single-product .summary .price del,
body.single-product .summary .price del .woocommerce-Price-amount{
    color:var(--asp-muted) !important;
    font-size:17px !important;
    font-weight:500;
    text-decoration:line-through !important;
    opacity:.7;
    margin-right:6px;
}
body.single-product .summary .price .aurea-from,
body.single-product .summary .price .aurea-per,
body.single-product .summary .price .aurea-prefix,
body.single-product .summary .price-from{
    color:var(--asp-muted) !important;
    font-size:12.5px !important;
    font-weight:500 !important;
    text-transform:uppercase !important;
    letter-spacing:.06em !important;
}
body.single-product .summary .price .aurea-min-group{
    display:block;
    color:var(--asp-muted);
    font-size:12.5px;
    margin-top:6px;
    font-weight:500;
    text-transform:none;
    letter-spacing:0;
}

/* -------------------------------------------- Short description -------- */
body.single-product .woocommerce-product-details__short-description{
    color:var(--asp-ink-soft);
    font-size:14.5px;
    line-height:1.65;
    margin:0 0 18px;
}
body.single-product .woocommerce-product-details__short-description p{ margin:0 0 8px; }
body.single-product .woocommerce-product-details__short-description p:last-child{ margin:0; }

/* -------------------------------------------- Trust strip -------- */
.asp-trust{
    display:flex;
    flex-wrap:wrap;
    gap:14px 18px;
    margin:0 0 22px;
    padding:16px 0;
    border-top:1px solid var(--asp-line);
    border-bottom:1px solid var(--asp-line);
}
.asp-trust-item{
    display:flex;
    align-items:center;
    gap:10px;
    flex:1 1 calc(33% - 18px);
    min-width:130px;
    line-height:1.3;
}
.asp-trust-item > span:not(.asp-trust-ic){
    display:flex; flex-direction:column;
}
.asp-trust-item strong{
    font-family:var(--asp-serif);
    font-size:13px;
    color:var(--asp-ink);
    font-weight:700;
    margin:0 0 2px;
    display:block;
}
.asp-trust-item span span{
    font-size:11.5px;
    color:var(--asp-muted);
    font-weight:500;
    letter-spacing:.01em;
    display:block;
}
.asp-trust-ic{
    flex:0 0 32px;
    width:32px; height:32px; border-radius:50%;
    background:linear-gradient(135deg,#fbf2dc 0%,#e8d3a1 100%);
    color:var(--asp-maroon);
    display:inline-flex; align-items:center; justify-content:center;
    box-shadow:0 3px 8px rgba(184,146,79,.15);
}
.asp-trust-ic svg{ width:16px; height:16px; }

/* -------------------------------------------- Voucher type selector polish -------- */
body.single-product .aurea-voucher-type-selector{
    margin:0 0 20px;
    padding:18px;
    background:var(--asp-cream);
    border:1px solid var(--asp-line);
    border-radius:var(--asp-radius-sm);
}
body.single-product .aurea-voucher-type-selector h3{
    margin:0 0 12px !important;
    font-family:var(--asp-serif);
    font-size:15px !important;
    font-weight:600 !important;
    color:var(--asp-ink) !important;
    text-align:left !important;
}
body.single-product .aurea-voucher-type-options{ gap:8px; }
body.single-product .aurea-voucher-type-label{
    background:#fff;
    border:1.5px solid var(--asp-line);
    border-radius:10px;
    padding:12px 12px;
    font-size:13px;
    font-weight:600;
    color:var(--asp-ink-soft);
    transition:all .2s ease;
    /* Icon-left, text-right layout */
    display:flex !important;
    align-items:center;
    justify-content:center;
    gap:10px;
    text-align:left;
    line-height:1.25;
}
body.single-product .aurea-voucher-type-icon{
    width:22px; height:22px; flex:0 0 auto;
    color:var(--asp-maroon);
    transition:color .2s ease, transform .2s ease;
}
body.single-product .aurea-voucher-type-text{ flex:0 1 auto; }
body.single-product .aurea-voucher-type-btn:hover .aurea-voucher-type-label{
    border-color:var(--asp-gold);
    background:#fffaf0;
}
body.single-product .aurea-voucher-type-btn:hover .aurea-voucher-type-icon{
    transform:scale(1.06);
}
body.single-product .aurea-voucher-type-btn.active .aurea-voucher-type-label,
body.single-product .aurea-voucher-type-btn input:checked + .aurea-voucher-type-label{
    background:var(--asp-maroon);
    border-color:var(--asp-maroon);
    color:#fff;
    box-shadow:0 8px 16px rgba(122,46,46,.2);
}
body.single-product .aurea-voucher-type-btn.active .aurea-voucher-type-icon,
body.single-product .aurea-voucher-type-btn input:checked + .aurea-voucher-type-label .aurea-voucher-type-icon{
    color:#fff;
}
@media (max-width:600px){
    body.single-product .aurea-voucher-type-icon{ width:20px; height:20px; }
    body.single-product .aurea-voucher-type-label{ padding:11px 10px; gap:8px; }
}

/* -------------------------------------------- Group size widget polish -------- */
body.single-product .aurea-group-pricing{
    padding:18px;
    background:var(--asp-cream-soft);
    border:1px solid var(--asp-line);
    border-radius:var(--asp-radius-sm);
    margin:0 0 20px;
}
body.single-product .aurea-group-title{
    font-family:var(--asp-serif);
    font-size:15px;
    font-weight:600;
    margin:0 0 10px;
    color:var(--asp-ink);
}
body.single-product .aurea-group-size-input{
    width:110px; padding:11px 13px;
    border:1.5px solid var(--asp-line);
    border-radius:10px;
    font-size:15px;
    font-weight:600;
    background:#fff;
    color:var(--asp-ink);
    transition:border-color .2s ease, box-shadow .2s ease;
}
body.single-product .aurea-group-size-input:focus{
    outline:none;
    border-color:var(--asp-maroon);
    box-shadow:0 0 0 3px rgba(122,46,46,.12);
}
body.single-product .aurea-group-readout{
    background:#fff;
    border-radius:8px;
    border:1px dashed var(--asp-line);
    padding:10px 12px;
    margin:10px 0;
    font-size:14px;
    color:var(--asp-ink-soft);
}
body.single-product .aurea-group-readout strong{ color:var(--asp-maroon); font-size:16px; }
body.single-product .aurea-group-tier-table th{
    color:var(--asp-ink-soft);
    font-weight:700;
    letter-spacing:.04em;
    text-transform:uppercase;
    font-size:11px;
}

/* -------------------------------------------- Add to cart -------- */
body.single-product form.cart{
    margin:0 0 20px !important;
}
body.single-product form.cart .quantity input.qty,
body.single-product form.cart input.qty{
    height:52px !important;
    border:1.5px solid var(--asp-line) !important;
    border-radius:10px !important;
    font-size:16px !important;
    font-weight:700 !important;
    color:var(--asp-ink);
    background:#fff;
}
body.single-product form.cart input.qty:focus{
    outline:none; border-color:var(--asp-maroon);
    box-shadow:0 0 0 3px rgba(122,46,46,.12);
}
body.single-product form.cart button.single_add_to_cart_button,
body.single-product form.cart .single_add_to_cart_button{
    height:52px !important;
    -webkit-appearance: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background:linear-gradient(135deg,var(--asp-maroon) 0%,var(--asp-maroon-deep) 100%) !important;
    color:#fff !important;
    border:0 !important;
    border-radius:10px !important;
    font-size:14px !important;
    font-weight:700 !important;
    text-transform:uppercase !important;
    letter-spacing:.09em !important;
    padding:0 26px !important;
    cursor:pointer !important;
    box-shadow:0 10px 24px rgba(122,46,46,.25) !important;
    transition:transform .2s ease, box-shadow .2s ease, filter .2s ease !important;
    line-height:1 !important;
}
body.single-product form.cart button.single_add_to_cart_button:hover{
    transform:translateY(-1px) !important;
    box-shadow:0 14px 28px rgba(122,46,46,.32) !important;
    filter:brightness(1.05) !important;
}

/* Popup row (Size guide / Ask a question) — pill style */
body.single-product .tbay-button-popup-wrap{
    list-style:none; padding:0; margin:4px 0 20px;
    display:flex; flex-wrap:wrap; gap:6px;
}
body.single-product .tbay-button-popup-wrap > li > a{
    display:inline-flex; align-items:center; gap:6px;
    padding:8px 13px;
    background:#fff;
    border:1px solid var(--asp-line);
    border-radius:999px;
    color:var(--asp-ink-soft);
    font-size:12px; font-weight:600;
    text-decoration:none;
    transition:border-color .2s ease, color .2s ease;
}
body.single-product .tbay-button-popup-wrap > li > a:hover{
    border-color:var(--asp-maroon);
    color:var(--asp-maroon);
}

/* -------------------------------------------- Tabs polish (no layout change) -------- */
body.single-product ul.wc-tabs,
body.single-product ul.tabs.wc-tabs{
    border-bottom:1px solid var(--asp-line) !important;
}
body.single-product ul.wc-tabs li,
body.single-product ul.tabs.wc-tabs li{
    background:transparent !important;
    border:0 !important;
}
body.single-product ul.wc-tabs li::before,
body.single-product ul.wc-tabs li::after{
    display:none !important;
}
body.single-product ul.wc-tabs li a{
    color:var(--asp-muted) !important;
    font-weight:600 !important;
    font-size:13px !important;
    letter-spacing:.04em !important;
    text-transform:uppercase !important;
    border-bottom:2px solid transparent !important;
    background:transparent !important;
    transition:color .2s ease, border-color .2s ease !important;
}
body.single-product ul.wc-tabs li a:hover{ color:var(--asp-ink) !important; }
body.single-product ul.wc-tabs li.active a,
body.single-product ul.wc-tabs li.urna-active a{
    color:var(--asp-maroon) !important;
    border-bottom-color:var(--asp-maroon) !important;
}
body.single-product .woocommerce-Tabs-panel p,
body.single-product .woocommerce-Tabs-panel li{
    font-size:14.5px; line-height:1.7; color:var(--asp-ink-soft);
}

/* -------------------------------------------- Sticky mobile bottom CTA -------- */
.asp-mobile-cta{
    display:none;
    position:fixed; left:0; right:0; bottom:0;
    z-index:9990;
    background:#fff;
    border-top:1px solid var(--asp-line);
    box-shadow:0 -8px 24px rgba(0,0,0,.08);
    padding:10px 14px;
    padding-bottom:calc(10px + env(safe-area-inset-bottom, 0px));
    align-items:center;
    gap:12px;
}
.asp-mobile-cta-info{ flex:1; min-width:0; line-height:1.2; }
.asp-mobile-cta-label{
    font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--asp-muted); font-weight:600;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.asp-mobile-cta-price{
    font-family:var(--asp-serif);
    font-size:17px; font-weight:700; color:var(--asp-maroon);
    margin-top:2px;
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.asp-mobile-cta-price .woocommerce-Price-amount{
    color:var(--asp-maroon) !important; font-weight:700 !important;
}
.asp-mobile-cta-btn{
    flex:0 0 auto;
    background:linear-gradient(135deg,var(--asp-maroon) 0%,var(--asp-maroon-deep) 100%);
    color:#fff !important; text-decoration:none;
    padding:13px 20px; border-radius:10px;
    font-weight:700; font-size:13px;
    letter-spacing:.08em; text-transform:uppercase;
    box-shadow:0 8px 18px rgba(122,46,46,.25);
    display:inline-flex; align-items:center; gap:6px;
    border:0; cursor:pointer;
}

/* -------------------------------------------- Responsive -------- */
@media(max-width:768px){
    body.single-product .summary .price ins,
    body.single-product .summary .price .woocommerce-Price-amount{ font-size:26px !important; }

    body.single-product .asp-trust-item{ flex:1 1 calc(50% - 9px); }

    body.single-product ul.wc-tabs{ overflow-x:auto; flex-wrap:nowrap; -webkit-overflow-scrolling:touch; }
    body.single-product ul.wc-tabs li a{ padding:12px 14px !important; font-size:12px !important; white-space:nowrap; }

    /* Fix add to cart squishing on small phones */
    body.single-product form.cart{ display:flex !important; flex-wrap:wrap !important; gap:8px !important; }
    body.single-product form.cart .single_add_to_cart_button{ flex:1 1 auto !important; min-width:0 !important; width:100% !important; }

    /* ---- CRITICAL: Override Urna's mobile popup-cart system ----
       The theme moves form.cart off-screen (transform:translate(0,100%)) on phones
       and replaces it with .mobile-btn-cart-click. We disable that entirely so the
       Add to Cart button stays visible inline on the page. */
    body.single-product .form-cart-popup form.cart,
    body.single-product.single-product form.cart{
        position: static !important;
        transform: none !important;
        -webkit-transform: none !important;
        width: auto !important;
        z-index: auto !important;
        flex-direction: row !important;
        background: transparent !important;
    }
    body.single-product .mobile-btn-cart-click,
    body.single-product #mobile-close-infor-wrapper,
    body.single-product .mobile-infor-wrapper,
    body.single-product #mobile-close-infor{
        display: none !important;
    }

    body.single-product .asp-mobile-cta{ display:flex; }
    body.single-product{ padding-bottom:100px; }
}

@media(max-width:480px){
    body.single-product .asp-trust-item{ flex:1 1 100%; }
}