/* Single product – Keen/Bootstrap refactor */
.single-product-aji {
    --aji-brand-primary: #51150C;
    --aji-brand-bg-primary: #503B36;
    --aji-brand-secondary: #999999;
    --aji-brand-secondary-hover: #dbdbdb;
    /*--aji-brand: #C39D63; // default brand color*/
    font-family: "Plus Jakarta Sans", sans-serif;
    color: #333333;
}

.single-product-aji .text-primary {
    color: var(--aji-brand-primary) !important;
}

.single-product-aji .text-secondary {
    color: var(--aji-brand-secondary) !important;
}

.single-product-aji h1,
.single-product-aji h2,
.single-product-aji h3,
.single-product-aji h4,
.single-product-aji h5,
.single-product-aji h6,
.single-product-aji .h1,
.single-product-aji .h2,
.single-product-aji .h3,
.single-product-aji .h4,
.single-product-aji .h5,
.single-product-aji .h6 {
    font-family: "Marcellus", Sans-serif;
}

.single-product-aji h1,
.single-product-aji .h1 {
    font-size: 2.85em;
}

.single-product-aji h2,
.single-product-aji .h2 {
    font-size: 1.5em;
}



.single-product-aji [type=button]:focus,
.single-product-aji [type=submit]:focus,
.single-product-aji button:focus {
    text-decoration: none;
    background-color: transparent;
    color: inherit;
}


.single-product-aji .card-body {
    color: #333333 !important;
}







.single-product-aji .back {
    color: var(--aji-brand-primary) !important;
    border: 1px solid var(--aji-brand-primary) !important;
}

.single-product-aji .back i {
    color: var(--aji-brand-primary) !important;
}

.single-product-aji .back:hover {
    background-color: var(--aji-brand-secondary-hover);
}

.single-product-aji a {
    color: var(--aji-brand-primary);
}



.single-product-aji .short-description p:last-child {
    margin-bottom: 0;
}

/* Gallery thumbnails tweak (plugin-managed) */
.single-product-aji .aji-gallery-thumbs {
    display: flex;
    gap: 6px;
    margin-top: 8px;
}

.single-product-aji .aji-gallery-thumbs li {
    width: 70px !important;
}

.single-product-aji .aji-gallery-thumbs img {
    border-radius: 6px;
}

/* Hide default thumbs when using custom nav */
.single-product-aji .woocommerce-product-gallery.aji-gallery.aji-gallery-has-nav .aji-gallery-thumbs {
    display: none !important;
}

.woocommerce div.product div.images.woocommerce-product-gallery {
    transition: opacity .5s;
}

/* Custom gallery navigation overlay */
.single-product-aji .woocommerce-product-gallery.aji-gallery.aji-gallery-has-nav {
    position: relative;
}

.single-product-aji .aji-gallery-nav-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 5;
    width: 54px;
    height: 54px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, .35);
    background: rgba(25, 25, 25, .45);
    backdrop-filter: blur(6px) saturate(140%);
    -webkit-backdrop-filter: blur(6px) saturate(140%);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    cursor: pointer;
    transition: background .25s, border-color .25s, transform .25s;
    box-shadow: 0 4px 18px -4px rgba(0, 0, 0, .45);
}

/* Stacking / fade only when custom nav is active to avoid blank images if JS/nav absent */
.single-product-aji .woocommerce-product-gallery.aji-gallery-has-nav .woocommerce-product-gallery__wrapper {
    position: relative;
    height: 100%;
    /* inherit aspect ratio height */
}

.single-product-aji .woocommerce-product-gallery.aji-gallery-has-nav .woocommerce-product-gallery__wrapper>* {
    position: absolute !important;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity .25s ease;
    z-index: 9;
    display: block !important;
}

.single-product-aji .woocommerce-product-gallery.aji-gallery-has-nav .woocommerce-product-gallery__wrapper>*.aji-gallery-active {
    opacity: 1;
    z-index: 2;
}

/* Strong enforcement: ensure every slide's inner figure/img fills the absolute slide box */
.single-product-aji .woocommerce-product-gallery.aji-gallery-has-nav .woocommerce-product-gallery__wrapper>*,
.single-product-aji .woocommerce-product-gallery.aji-gallery-has-nav .woocommerce-product-gallery__wrapper>*>.woocommerce-product-gallery__image,
.single-product-aji .woocommerce-product-gallery.aji-gallery-has-nav .woocommerce-product-gallery__wrapper>* img {
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    display: block !important;
    object-fit: cover !important;
}

.single-product-aji .woocommerce-product-gallery.aji-gallery-has-nav .aji-gallery-slide-hidden {
    opacity: 0 !important;
}

/* Fallback: before JS marks .aji-gallery-ready, do not hide slides to prevent blank state */
.single-product-aji .woocommerce-product-gallery.aji-gallery-has-nav:not(.aji-gallery-ready) .woocommerce-product-gallery__wrapper>* {
    position: relative !important;
    opacity: 1 !important;
    z-index: 1;
}

/* Extra safety: ensure images and container elements are visible by default
   if some earlier rule (theme/plugin) sets figures absolute/hidden, override it here
   but only inside our single-product scope to avoid side-effects. */
.single-product-aji .woocommerce-product-gallery .woocommerce-product-gallery__wrapper>*,
.single-product-aji .woocommerce-product-gallery .woocommerce-product-gallery__wrapper img,
.single-product-aji .woocommerce-product-gallery .woocommerce-product-gallery__image,
.single-product-aji .woocommerce-product-gallery .woocommerce-product-gallery__image a {
    position: relative !important;
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Stronger fallback: ensure gallery has visible area before JS runs
   This forces a reasonable min-height and lets images size naturally. */
.single-product-aji .woocommerce-product-gallery:not(.aji-gallery-ready) {
    min-height: 420px !important;
}

.single-product-aji .woocommerce-product-gallery:not(.aji-gallery-ready) .woocommerce-product-gallery__wrapper,
.single-product-aji .woocommerce-product-gallery:not(.aji-gallery-ready) .woocommerce-product-gallery__wrapper>* {
    position: static !important;
    display: block !important;
    height: auto !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.single-product-aji .woocommerce-product-gallery:not(.aji-gallery-ready) img {
    max-width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
}

.single-product-aji .aji-gallery-nav-btn svg {
    width: 26px;
    height: 26px;
    pointer-events: none;
}

.single-product-aji .aji-gallery-nav-btn:hover {
    background: rgba(25, 25, 25, .65);
    border-color: rgba(255, 255, 255, .55);
    transform: translateY(-50%) scale(1.06);
}

.single-product-aji .aji-gallery-nav-btn:active {
    transform: translateY(-50%) scale(.94);
}

.single-product-aji .aji-gallery-nav-btn:focus-visible {
    outline: 2px solid var(--aji-brand-primary);
    outline-offset: 2px;
}

.single-product-aji .aji-gallery-nav-btn[disabled] {
    opacity: .25;
    cursor: default;
    pointer-events: none;
}

@media (max-width: 767.98px) {
    .single-product-aji .aji-gallery-nav-btn {
        width: 44px;
        height: 44px;
        font-size: 16px;
    }

    .single-product-aji .aji-gallery-nav-btn svg {
        width: 22px;
        height: 22px;
    }
}

/* Always visible arrows (previous fade-on-hover removed per request) */
@media (hover:hover) and (pointer:fine) {
    .single-product-aji .aji-gallery-nav-btn {
        opacity: 1;
    }
}

/* Hide navigation entirely if only one slide */
.single-product-aji .woocommerce-product-gallery.aji-gallery-has-nav[data-aji-gallery-total="1"] .aji-gallery-nav-btn,
.single-product-aji .woocommerce-product-gallery.aji-gallery-has-nav[data-aji-gallery-total="1"] .aji-gallery-counter {
    display: none !important;
}

/* Hide thumbs when only one slide */
.single-product-aji .woocommerce-product-gallery.aji-gallery-has-nav[data-aji-gallery-total="1"] .aji-gallery-thumbs {
    display: none !important;
}

.single-product-aji .aji-gallery-prev {
    left: 14px;
}

.single-product-aji .aji-gallery-next {
    right: 14px;
}

.single-product-aji .aji-gallery-counter {
    position: absolute;
    top: 14px;
    left: 16px;
    background: rgba(0, 0, 0, .55);
    color: #fff;
    padding: 4px 10px;
    font-size: 12px;
    line-height: 1;
    border-radius: 20px;
    z-index: 6;
    font-weight: 500;
    letter-spacing: .5px;
}

/* Disable direct click on main image anchor only when custom nav active; fallback gallery keeps default behavior */
.single-product-aji .woocommerce-product-gallery.aji-gallery-has-nav .woocommerce-product-gallery__image a {
    pointer-events: none;
    cursor: default;
}

/* (Ancien double bloc empilement supprimé; logique maintenant conditionnée par .aji-gallery-has-nav) */

/* Enhanced main gallery layout */
.single-product-aji .aji-product-main-row {
    --aji-gallery-gap: 1.5rem;
}

.single-product-aji .woocommerce-product-gallery {
    position: relative;
}

/* Fixed square gallery variant: force 1:1 aspect and cover cropping */
.single-product-aji .woocommerce-product-gallery.aji-gallery-fixed {
    aspect-ratio: 1/1 !important;
    --aji-gallery-aspect: 1/1 !important;
}

.single-product-aji .woocommerce-product-gallery.aji-gallery-fixed .woocommerce-product-gallery__image img {
    object-fit: cover !important;
}

/* Force full width inside Bootstrap column & neutralize legacy floats/widths */
.single-product-aji .woocommerce div.product div.images,
.single-product-aji .woocommerce div.product div.summary {
    width: 100% !important;
    float: none !important;
    margin: 0 0 2rem;
}

/* Ensure gallery container itself stretches fully */
.single-product-aji .woocommerce-product-gallery.images {
    width: 100% !important;
}

/* Fine‑tune internal layout when using vertical thumbs */
@media (min-width: 992px) {
    .single-product-aji .woocommerce div.product div.images {
        align-items: flex-start;
    }

    .single-product-aji .woocommerce div.product div.images figure {
        order: 1;
    }

    .single-product-aji .woocommerce div.product div.images .aji-gallery-thumbs {
        order: 2;
    }
}

.single-product-aji .woocommerce-product-gallery__wrapper {
    border-radius: 12px;
    overflow: hidden;
}

/* Unify image sizing to fill wrapper (wrapper height now driven by aspect-ratio) */
.single-product-aji .woocommerce-product-gallery__image,
.single-product-aji .woocommerce-product-gallery__image a,
.single-product-aji .woocommerce-product-gallery__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 12px;
}

.single-product-aji .flex-viewport {
    /* keep minimal rule for legacy structure but do not force zero/absolute behavior */
    height: auto !important;
    min-height: 300px;
}

.single-product-aji .woocommerce-product-gallery.aji-gallery.aji-gallery-has-nav .aji-gallery-thumbs {
    display: none !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Aspect ratio driven gallery sizing (fallback uses min-height below) */
.single-product-aji .woocommerce-product-gallery {
    /* Default aspect so the gallery has a height even before JS runs. JS may update --aji-gallery-aspect dynamically. */
    --aji-gallery-aspect: 4/5;
    aspect-ratio: var(--aji-gallery-aspect);
    height: auto;
    max-height: none;
}

.single-product-aji .woocommerce-product-gallery.aji-gallery {
    /* Keep selector for backward compatibility with any code that may add .aji-gallery */
    --aji-gallery-aspect: var(--aji-gallery-aspect, 4/5);
}

.single-product-aji .woocommerce-product-gallery.aji-gallery.fit-contain .woocommerce-product-gallery__image img {
    object-fit: contain;
    background: #fafafa;
}

.woocommerce div.product div.images {
    margin: 0;
}

@supports not (aspect-ratio: 1 / 1) {
    .single-product-aji .woocommerce-product-gallery.aji-gallery {
        min-height: 560px;
    }

    @media (max-width:1199.98px) {
        .single-product-aji .woocommerce-product-gallery.aji-gallery {
            min-height: 480px;
        }
    }

    @media (max-width:767.98px) {
        .single-product-aji .woocommerce-product-gallery.aji-gallery {
            min-height: 380px;
        }
    }
}

.single-product-aji .woocommerce-product-gallery.aji-gallery {
    width: 100%;
}

.single-product-aji .woocommerce-product-gallery.aji-gallery .woocommerce-product-gallery__trigger {
    top: 14px;
    right: 14px;
    background: rgba(0, 0, 0, .45);
    color: #fff;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
}

@media (hover:hover) {
    .single-product-aji .woocommerce-product-gallery.aji-gallery .woocommerce-product-gallery__trigger:hover {
        background: rgba(0, 0, 0, .65);
    }
}


@media (max-width: 1199.98px) {
    .single-product-aji .woocommerce-product-gallery__image img {
        height: 480px;
    }
}

@media (max-width: 767.98px) {
    .single-product-aji .woocommerce-product-gallery__image img {
        height: 380px;
    }
}

/* Thumbnails vertical on large screens */
@media (min-width: 992px) {
    .single-product-aji .woocommerce div.product div.images {
        display: flex;
        flex-direction: row;
        gap: var(--aji-gallery-gap);
    }

    .single-product-aji .woocommerce div.product div.images .aji-gallery-thumbs {
        flex-direction: column;
        width: 90px;
        order: 2;
        gap: 10px;
        margin-top: 0;
    }

    .single-product-aji .woocommerce div.product div.images .aji-gallery-thumbs li {
        width: 100% !important;
    }

    .single-product-aji .woocommerce div.product div.images .aji-gallery-thumbs img {
        width: 100%;
        height: 90px;
        object-fit: cover;
        border-radius: 8px;
    }

    .single-product-aji .woocommerce div.product div.images figure,
    .single-product-aji .woocommerce div.product div.images .woocommerce-product-gallery__wrapper {
        flex: 1 1 auto;
    }
}

/* Hover / focus states for thumbs */
.single-product-aji .aji-gallery-thumbs li img {
    transition: opacity .25s, transform .25s;
}

.single-product-aji .aji-gallery-thumbs li img:hover,
.single-product-aji .aji-gallery-thumbs li img:focus {
    opacity: .85;
    transform: scale(.97);
}

/* Option / vendor cards */
.single-product-aji .aji-option-card,
.single-product-aji .aji-vendor-card,
.single-product-aji .aji-takeaway-section .option-card {
    /* Use a neutral light background similar to Bootstrap's bg-light */
    background: var(--bs-gray-200, #f8f9fa);
    cursor: pointer;
    transition: .18s border-color, .18s box-shadow, .18s transform;
    border: 2px solid transparent;
    min-height: 100%;
}

.single-product-aji .aji-takeaway-section .option-card.no-takeaway {
    cursor: not-allowed;
    color: var(--bs-danger);
    border-color: var(--bs-danger);
    background-color: var(--bs-danger-light);
    opacity: 1 !important;
}

.single-product-aji .aji-option-card.active,
.single-product-aji .aji-delivery-card.active,
.single-product-aji .aji-vendor-card.active,
.single-product-aji .aji-takeaway-section .option-card.active {
    /* Stronger visible indicator for selected options */
    border: 2px solid var(--aji-brand-primary);
    transform: translateY(-2px);
}

.single-product-aji .aji-option-card:hover,
.single-product-aji .aji-vendor-card:hover,
.single-product-aji .aji-takeaway-section .option-card:hover {
    border-color: var(--aji-brand-primary);
}

.single-product-aji .aji-option-card .ratio img {
    object-fit: cover;
}

/* Quantity buttons */
.single-product-aji .option-quantity button {
    font-weight: 600;
}

/* Force equal height for option cards in a row */
.single-product-aji .aji-option-section.row {
    align-items: stretch;
}

.single-product-aji .aji-option-section.row>[class*='col-'] {
    display: flex;
}

/* Summary bar */
.single-product-aji .aji-summary-bar {
    background-color: var(--aji-brand-bg-primary);
}

.single-product-aji .aji-summary-bar .woocommerce-Price-amount {
    font-weight: 600;
}

/* Required asterisk */
.single-product-aji span.required {
    font-size: 18px;
    line-height: 1;
}

.single-product-aji .required-selection-message {
    display: none;
}

.single-product-aji .required-selection-message.show {
    display: block;
}

/* Related / Upsell cards */
.single-product-aji .related-product img {
    width: 100%;
    height: 220px;
    object-fit: cover;
}

.single-product-aji .related-product .card {
    overflow: hidden;
}

/* Badges override (ensure visibility over images) */
.single-product-aji .badge {
    backdrop-filter: blur(3px);
}




/* Legacy accordion removed – using Bootstrap collapse. */

/* Legacy .content wrapper replaced by cards. */

/* Legacy summary bar replaced by .aji-summary-bar */



/*.options.content {
    background-color: #F4F4F4;
}*/




.option-section.required:after {
    display: none;
}


/* Legacy related grid removed – now pure Bootstrap grid */


/**
 * Vendor Holiday States
 * Styling for vendors closed for holidays
 */
.aji-vendor-card.disabled {
    opacity: 0.6;
    pointer-events: none;
    background-color: #f8f9fa;
    border: 2px dashed #dee2e6;
    position: relative;
}

.aji-vendor-card.disabled .option-title {
    color: #6c757d;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.aji-vendor-card.disabled .badge {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.35rem 0.65rem;
}

.aji-vendor-card.disabled .alert {
    border: none;
    background-color: #fff3cd;
    border-left: 4px solid #ffc107;
}

.aji-vendor-card.disabled button:disabled,
.aji-vendor-card.disabled input:disabled {
    cursor: not-allowed;
    opacity: 0.5;
}

/* Disabled takeaway slots (on holidays) */
.option-card.disabled {
    opacity: 0.6;
    background-color: #f8f9fa;
    border: 2px dashed #dee2e6;
    pointer-events: none;
}

.option-card.disabled .option-title {
    color: #6c757d;
}

.option-card.disabled input:disabled {
    cursor: not-allowed;
}

/* Add-to-cart button disabled states */
.add-to-cart-btn:disabled {
    cursor: not-allowed;
}

.add-to-cart-btn.required-selection-disabled:disabled,
.add-to-cart-btn.price-zero-disabled:disabled {
    pointer-events: none;
}

/* Required selection message */
#required-message {
    background-color: #fff5f5;
    border: 2px solid #dc3545;
    color: #dc3545;
    font-weight: 500;
    border-radius: 0.5rem;
    transition: opacity 0.3s ease, max-height 0.3s ease;
}

#required-message.d-none {
    display: none !important;
}