/*
 * NFF Blinkit Shop Cart V10 - screenshot-matched card controls
 * Desired post-click layout: [ -  cart qty  + ]         [ Add cart ]
 * The Add button keeps the Royal Addons/theme styling. The number reflects the
 * live product quantity already in the cart and stays compact like the reference UI.
 */

.nff-v10-wrap {
    --nff-control-bg: var(--e-global-color-accent, var(--wp--preset--color--primary, #5b9f24));
    --nff-control-color: #ffffff;
    --nff-control-border-color: var(--e-global-color-accent, #5b9f24);
    --nff-control-border-style: solid;
    --nff-control-border-width: 1px;
    --nff-control-radius: 5px;
    --nff-control-shadow: none;
    --nff-control-height: 36px;
    --nff-control-font-family: inherit;
    --nff-control-font-size: 14px;
    --nff-control-font-weight: 600;
    --nff-control-letter-spacing: normal;
    --nff-control-text-transform: none;

    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 18px !important;
    width: 100% !important;
    max-width: 100% !important;
    position: relative !important;
    vertical-align: middle !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 0 !important;
}

.nff-v10-wrap.nff-v10-full {
    display: flex !important;
    width: 100% !important;
}

/* Neutral grocery-style quantity field: white surface, soft grey border. */
.nff-v10-stepper {
    display: inline-grid !important;
    grid-template-columns: 26px 28px 26px !important;
    align-items: stretch !important;
    flex: 0 0 82px !important;
    width: 82px !important;
    min-width: 82px !important;
    height: 34px !important;
    min-height: 34px !important;
    overflow: hidden !important;
    box-sizing: border-box !important;

    background: #ffffff !important;
    color: #657080 !important;
    border: 1px solid #d9dee4 !important;
    border-radius: max(4px, var(--nff-control-radius)) !important;
    box-shadow: 0 1px 1px rgba(19, 33, 45, .025) !important;

    font-family: var(--nff-control-font-family) !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
}

.nff-v10-stepper button {
    appearance: none !important;
    -webkit-appearance: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 26px !important;
    min-width: 26px !important;
    min-height: 32px !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #7b8793 !important;
    box-shadow: none !important;
    cursor: pointer !important;
    font-family: inherit !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    touch-action: manipulation !important;
}

.nff-v10-stepper button:hover,
.nff-v10-stepper button:focus-visible {
    background: #f4f8ef !important;
    color: var(--nff-control-border-color) !important;
    outline: none !important;
}

.nff-v10-stepper button:focus-visible {
    box-shadow: inset 0 0 0 1px var(--nff-control-border-color) !important;
}

.nff-v10-stepper button:disabled {
    opacity: .35 !important;
    cursor: default !important;
}

.nff-v10-number {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 28px !important;
    padding: 0 1px !important;
    box-sizing: border-box !important;
    border-left: 1px solid #edf0f2 !important;
    border-right: 1px solid #edf0f2 !important;
    color: #616c78 !important;
    font: inherit !important;
    font-variant-numeric: tabular-nums !important;
    line-height: 1 !important;
    text-align: center !important;
    user-select: none !important;
    -webkit-user-select: none !important;
}

/* Preserve the real Royal/theme CTA: label, icon, green outline, hover, radius. */
.nff-v10-confirm {
    flex: 0 0 auto !important;
    max-width: calc(100% - 100px) !important;
    min-height: 34px !important;
    height: 34px !important;
    margin: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
    box-sizing: border-box !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    touch-action: manipulation !important;
    font-size: 13.5px !important;
    line-height: 1 !important;
    transition: none !important;
}

.nff-v10-full .nff-v10-confirm {
    flex: 0 0 auto !important;
    min-width: 0 !important;
}


/* Shop cards start with only the normal Add to Cart CTA. During the first
   AJAX add the generated wrapper keeps that same one-button appearance; once
   the add succeeds JavaScript removes this class and reveals [- 1 +]. */
.nff-v10-wrap.nff-v10-first-add {
    justify-content: flex-end !important;
}

.nff-v10-wrap.nff-v10-first-add .nff-v10-stepper {
    display: none !important;
}

.nff-v10-wrap.nff-v10-first-add .nff-v10-confirm {
    max-width: 100% !important;
}

/* Kill theme hover animation layers. Some Ekomart/Royal button skins animate a
   ::before/::after block outside the button and into our quantity/button gap. */
body .nff-v10-wrap .nff-v10-confirm::before,
body .nff-v10-wrap .nff-v10-confirm::after,
body .nff-v10-wrap .nff-v10-confirm:hover::before,
body .nff-v10-wrap .nff-v10-confirm:hover::after,
body .nff-v10-wrap .nff-v10-confirm:focus::before,
body .nff-v10-wrap .nff-v10-confirm:focus::after,
body .nff-v10-wrap .nff-v10-confirm:active::before,
body .nff-v10-wrap .nff-v10-confirm:active::after {
    content: none !important;
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    opacity: 0 !important;
    visibility: hidden !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
}

/* Do not let any theme hover decoration bleed into the 18px control gap. */
body .nff-v10-wrap .nff-v10-confirm {
    position: relative !important;
    overflow: hidden !important;
    isolation: isolate !important;
}

body .nff-v10-wrap:hover,
body .nff-v10-wrap:focus-within {
    background: transparent !important;
    box-shadow: none !important;
}

/* Keep the CTA visually stable on hover/focus. Some themes replace the
   sampled button with a loud solid-green hover fill; this intentionally
   preserves the normal button colors instead. */
.nff-v10-confirm:hover,
.nff-v10-confirm:focus,
.nff-v10-confirm:focus-visible,
.nff-v10-confirm:active {
    background: var(--nff-control-bg) !important;
    color: var(--nff-control-color) !important;
    border-color: var(--nff-control-border-color) !important;
    border-style: var(--nff-control-border-style) !important;
    border-width: var(--nff-control-border-width) !important;
    box-shadow: var(--nff-control-shadow) !important;
    filter: none !important;
    transform: none !important;
    opacity: 1 !important;
    text-decoration: none !important;
    outline: none !important;
}

.nff-v10-loading {
    opacity: 1 !important;
    pointer-events: auto !important;
}

.nff-v10-loading .nff-v10-confirm {
    pointer-events: none !important;
}

.nff-v10-loading::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 5;
    cursor: wait;
    pointer-events: none !important;
}

.nff-v10-status {
    position: absolute !important;
    left: 0 !important;
    top: calc(100% + 4px) !important;
    z-index: 4 !important;
    max-width: 100% !important;
    padding: 0 !important;
    color: currentColor !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
    white-space: nowrap !important;
    pointer-events: none !important;
}

.nff-v10-status.nff-v10-error {
    color: #b42318 !important;
}

/* Success is visible as a global toast; keep card status for screen readers. */
.nff-v10-status.nff-v10-success {
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
}

.nff-v10-toast {
    /* Fixed success green: do not inherit a grey/neutral theme border color. */
    --nff-toast-bg: #16a34a;
    position: fixed !important;
    left: 50% !important;
    top: 62% !important;
    bottom: auto !important;
    z-index: 999999 !important;
    display: flex !important;
    align-items: center !important;
    gap: 9px !important;
    min-width: 210px !important;
    max-width: calc(100vw - 32px) !important;
    padding: 13px 18px !important;
    box-sizing: border-box !important;
    transform: translate(-50%, calc(-50% + 16px)) scale(.98) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    border: 1px solid #12833c !important;
    border-radius: 10px !important;
    background: var(--nff-toast-bg) !important;
    color: #ffffff !important;
    box-shadow: 0 14px 36px rgba(22, 101, 52, .34), 0 2px 8px rgba(0, 0, 0, .12) !important;
    font-family: inherit !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    text-align: left !important;
    transition: opacity .18s ease, transform .18s ease, visibility .18s ease !important;
}

.nff-v10-toast::before {
    content: '\2713' !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 22px !important;
    width: 22px !important;
    height: 22px !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, .24) !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 800 !important;
}

.nff-v10-toast.nff-v10-toast-show {
    transform: translate(-50%, -50%) scale(1) !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.nff-v10-weight {
    display: block !important;
    margin: 4px 0 7px !important;
    color: inherit !important;
    opacity: .68 !important;
    font-size: .82em !important;
    line-height: 1.25 !important;
    font-weight: 500 !important;
}

@media (max-width: 767px) {
    .nff-v10-wrap {
        gap: 14px !important;
        width: 100% !important;
    }

    .nff-v10-stepper {
        grid-template-columns: 25px 28px 25px !important;
        flex-basis: 80px !important;
        width: 80px !important;
        min-width: 80px !important;
        height: 33px !important;
        min-height: 33px !important;
    }

    .nff-v10-stepper button {
        width: 25px !important;
        min-width: 25px !important;
    }

    .nff-v10-number {
        width: 28px !important;
        min-width: 28px !important;
    }

    .nff-v10-confirm {
        max-width: calc(100% - 94px) !important;
        min-height: 33px !important;
        height: 33px !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
        font-size: 13px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    .nff-v10-toast {
        top: 64% !important;
        bottom: auto !important;
        min-width: 0 !important;
        width: auto !important;
        max-width: calc(100vw - 24px) !important;
        padding: 10px 14px !important;
        font-size: 13px !important;
    }
}

@media (max-width: 390px) {
    .nff-v10-wrap {
        gap: 12px !important;
    }

    .nff-v10-stepper {
        grid-template-columns: 24px 28px 24px !important;
        flex-basis: 78px !important;
        width: 78px !important;
        min-width: 78px !important;
    }

    .nff-v10-stepper button {
        width: 24px !important;
        min-width: 24px !important;
    }

    .nff-v10-number {
        width: 28px !important;
        min-width: 28px !important;
    }

    .nff-v10-confirm {
        max-width: calc(100% - 90px) !important;
    }
}


/* Product detail page: use the same compact chooser + theme Add to Cart button. */
body.single-product form.cart .nff-v10-single-wrap {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: auto !important;
    max-width: 100% !important;
    gap: 18px !important;
    margin: 0 !important;
}

body.single-product form.cart .nff-v10-single-wrap .nff-v10-confirm {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
}

/* v2.5.8: on simple product detail pages the NFF control is the only visible
   cart control. Theme quantity wrappers (including pseudo-element based vertical
   +/- widgets) are hidden wholesale while hidden WooCommerce product inputs stay
   available for compatibility. */
body.single-product form.cart.nff-v10-single-clean[data-nff-single-bound="1"] > *:not(.nff-v10-single-wrap):not(input[type="hidden"]):not(script):not(style) {
    display: none !important;
    visibility: hidden !important;
}

body.single-product form.cart.nff-v10-single-clean[data-nff-single-bound="1"] > .nff-v10-single-wrap {
    display: inline-flex !important;
    visibility: visible !important;
}

/* The cloned single-page CTA is deliberately stripped of theme behavior classes;
   also neutralize any residual generated content on the sanitized button itself. */
body.single-product form.cart .nff-v10-single-confirm::before,
body.single-product form.cart .nff-v10-single-confirm::after {
    content: none !important;
    display: none !important;
}

/* Custom AJAX flow intentionally never exposes WooCommerce's post-add View cart link. */
body.single-product form.cart[data-nff-single-bound="1"] a.added_to_cart,
body.single-product form.cart[data-nff-single-bound="1"] a.wc-forward.added_to_cart {
    display: none !important;
    visibility: hidden !important;
}

@media (max-width: 767px) {
    body.single-product form.cart .nff-v10-single-wrap {
        gap: 14px !important;
        width: 100% !important;
    }

    body.single-product form.cart .nff-v10-single-wrap .nff-v10-confirm {
        max-width: calc(100% - 94px) !important;
    }
}


/* v2.4.0 — remove orphaned theme quantity widgets on simple product pages.
   Our own .nff-v10-minus/.nff-v10-plus live inside .nff-v10-wrap and are excluded. */
body.single-product form.cart[data-nff-single-bound="1"] > .quantity,
body.single-product form.cart[data-nff-single-bound="1"] > .quantity-nav,
body.single-product form.cart[data-nff-single-bound="1"] > .quantity-button,
body.single-product form.cart[data-nff-single-bound="1"] > .quantity-buttons,
body.single-product form.cart[data-nff-single-bound="1"] > .qty-buttons,
body.single-product form.cart[data-nff-single-bound="1"] > .qty-plus,
body.single-product form.cart[data-nff-single-bound="1"] > .qty-minus,
body.single-product form.cart[data-nff-single-bound="1"] > .quantity-plus,
body.single-product form.cart[data-nff-single-bound="1"] > .quantity-minus,
body.single-product form.cart[data-nff-single-bound="1"] > .quantity-up,
body.single-product form.cart[data-nff-single-bound="1"] > .quantity-down,
body.single-product form.cart[data-nff-single-bound="1"] > .qib-button-wrapper,
body.single-product form.cart[data-nff-single-bound="1"] > .qib-button,
body.single-product form.cart[data-nff-single-bound="1"] > .plus,
body.single-product form.cart[data-nff-single-bound="1"] > .minus,
body.single-product form.cart[data-nff-single-bound="1"] > .qty-button,
body.single-product form.cart[data-nff-single-bound="1"] > .qty-button-wrapper,
body.single-product form.cart[data-nff-single-bound="1"] > .quantity-control,
body.single-product form.cart[data-nff-single-bound="1"] > .quantity-controls,
body.single-product form.cart[data-nff-single-bound="1"] > .qty-control,
body.single-product form.cart[data-nff-single-bound="1"] > .qty-controls,
body.single-product form.cart[data-nff-single-bound="1"] > .quantity-spinner,
body.single-product form.cart[data-nff-single-bound="1"] > .qty-spinner,
body.single-product form.cart[data-nff-single-bound="1"] > .quantity-increase,
body.single-product form.cart[data-nff-single-bound="1"] > .quantity-decrease,
body.single-product form.cart[data-nff-single-bound="1"] > .qty-increase,
body.single-product form.cart[data-nff-single-bound="1"] > .qty-decrease,
body.single-product form.cart[data-nff-single-bound="1"] > .increment,
body.single-product form.cart[data-nff-single-bound="1"] > .decrement,
body.single-product form.cart[data-nff-single-bound="1"] > [data-quantity-action],
body.single-product form.cart[data-nff-single-bound="1"] > [data-qty-action] {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

/* Mobile bottom navigation polish. Works with the bundled WP Bottom Menu and
   also upgrades an already-active standalone WP Bottom Menu installation. */
.wp-bottom-menu {
    padding-top: 7px !important;
    padding-bottom: max(7px, env(safe-area-inset-bottom)) !important;
    border-top: 1px solid rgba(0, 0, 0, .07) !important;
    box-shadow: 0 -5px 18px rgba(0, 0, 0, .09) !important;
}

.wp-bottom-menu .wp-bottom-menu-item {
    min-width: 0 !important;
    gap: 0 !important;
    line-height: 1.1 !important;
}

.wp-bottom-menu .wp-bottom-menu-item i.wp-bottom-menu-item-icons,
.wp-bottom-menu .wp-bottom-menu-item .wp-bottom-menu-item-icons {
    font-size: 20px !important;
    line-height: 1 !important;
}

.wp-bottom-menu .wp-bottom-menu-item svg {
    width: 20px !important;
    height: 20px !important;
}

.wp-bottom-menu .wp-bottom-menu-item > span:not(.wp-bottom-menu-cart-total) {
    margin-top: 4px !important;
    font-size: 11px !important;
    line-height: 1.15 !important;
}

.wp-bottom-menu .wp-bottom-menu-icon-wrapper {
    min-width: 24px !important;
    min-height: 22px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: visible !important;
}

.wp-bottom-menu .wp-bottom-menu-cart-count,
.wp-bottom-menu .nff-v10-bottom-cart-badge {
    position: absolute !important;
    top: -8px !important;
    left: calc(50% + 7px) !important;
    right: auto !important;
    transform: none !important;
    z-index: 4 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    width: auto !important;
    min-width: 17px !important;
    height: 17px !important;
    padding: 0 4px !important;
    border: 2px solid var(--wpbottommenu-bgcolor, #fff) !important;
    border-radius: 999px !important;
    background: #16a34a !important;
    color: #fff !important;
    box-shadow: 0 2px 7px rgba(22, 163, 74, .32) !important;
    font-family: inherit !important;
    font-size: 9px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
}

.wp-bottom-menu .wp-bottom-menu-cart-count.nff-v10-cart-empty {
    display: none !important;
}

.wp-bottom-menu .wp-bottom-menu-item:active .wp-bottom-menu-icon-wrapper {
    transform: scale(.94) !important;
}

@media (max-width: 480px) {
    .wp-bottom-menu .wp-bottom-menu-item i.wp-bottom-menu-item-icons,
    .wp-bottom-menu .wp-bottom-menu-item .wp-bottom-menu-item-icons {
        font-size: 19px !important;
    }

    .wp-bottom-menu .wp-bottom-menu-item svg {
        width: 19px !important;
        height: 19px !important;
    }
}

/* Bundled menu uses lightweight inline SVG icons instead of icon-font files. */
.wp-bottom-menu .nff-wpbm-icon,
.wp-bottom-menu-search-form .nff-wpbm-icon {
    fill: none !important;
    stroke: var(--wpbottommenu-icon-color, #555) !important;
    width: 20px !important;
    height: 20px !important;
    color: var(--wpbottommenu-icon-color, #555) !important;
    transition: stroke .18s ease, transform .18s ease !important;
}

.wp-bottom-menu .wp-bottom-menu-item:hover .nff-wpbm-icon,
.wp-bottom-menu .wp-bottom-menu-item.active .nff-wpbm-icon,
.wp-bottom-menu.sf-active .wp-bottom-menu-item.wp-bottom-menu-search-form-trigger .nff-wpbm-icon {
    fill: none !important;
    stroke: var(--wpbottommenu-h-icon-color, #000) !important;
    color: var(--wpbottommenu-h-icon-color, #000) !important;
}

.wp-bottom-menu-search-form .nff-wpbm-icon {
    position: absolute !important;
    top: 50% !important;
    left: 30px !important;
    transform: translate(-50%, -50%) !important;
}

/* ========================================================================
 * v2.5.0 - CTA vertical centering + cart weight + premium mobile cart
 * ======================================================================== */

/* Keep the sampled theme button, but center the label optically. The tiny
   2px top inset compensates for fonts whose visual baseline sits high. */
body .nff-v10-wrap .nff-v10-confirm {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding-top: 2px !important;
    padding-bottom: 0 !important;
    line-height: 1.15 !important;
    vertical-align: middle !important;
}

body .nff-v10-wrap .nff-v10-confirm > span,
body .nff-v10-wrap .nff-v10-confirm .wpr-button-text,
body .nff-v10-wrap .nff-v10-confirm .elementor-button-text {
    line-height: 1.15 !important;
    align-self: center !important;
}

/* Weight shown directly below Price on the cart page. */
body.woocommerce-cart .nff-v10-cart-price-weight {
    display: block !important;
    margin-top: 4px !important;
    color: #8a929b !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 1.25 !important;
    letter-spacing: 0 !important;
    white-space: normal !important;
}

/* Desktop: only add a little breathing room; keep the theme's table design. */
@media (min-width: 768px) {
    body.woocommerce-cart .woocommerce-cart-form td.product-price {
        vertical-align: middle !important;
    }
}

/* Mobile cart: convert the compressed responsive table into clean product
   cards while keeping WooCommerce's native form/actions and cart totals. */
@media (max-width: 767px) {
    body.woocommerce-cart .woocommerce-cart-form {
        width: 100% !important;
        margin: 0 0 18px !important;
    }

    body.woocommerce-cart .woocommerce-cart-form table.shop_table,
    body.woocommerce-cart .woocommerce-cart-form table.cart,
    body.woocommerce-cart .woocommerce-cart-form table.shop_table_responsive {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
        border: 0 !important;
        border-collapse: separate !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    body.woocommerce-cart .woocommerce-cart-form table.shop_table thead,
    body.woocommerce-cart .woocommerce-cart-form table.cart thead,
    body.woocommerce-cart .woocommerce-cart-form table.shop_table_responsive thead {
        display: none !important;
    }

    body.woocommerce-cart .woocommerce-cart-form table.shop_table tbody,
    body.woocommerce-cart .woocommerce-cart-form table.cart tbody,
    body.woocommerce-cart .woocommerce-cart-form table.shop_table_responsive tbody {
        display: block !important;
        width: 100% !important;
    }

    body.woocommerce-cart .woocommerce-cart-form tr.woocommerce-cart-form__cart-item,
    body.woocommerce-cart .woocommerce-cart-form tr.cart_item {
        position: relative !important;
        display: grid !important;
        grid-template-columns: 78px minmax(0, 1fr) 28px !important;
        grid-template-areas:
            "thumb name remove"
            "thumb price remove"
            "thumb qty qty" !important;
        column-gap: 13px !important;
        row-gap: 5px !important;
        width: 100% !important;
        margin: 0 0 12px !important;
        padding: 14px !important;
        overflow: hidden !important;
        border: 1px solid #e8ebee !important;
        border-radius: 12px !important;
        background: #ffffff !important;
        box-shadow: 0 4px 14px rgba(20, 31, 43, .045) !important;
        box-sizing: border-box !important;
    }

    body.woocommerce-cart .woocommerce-cart-form tr.cart_item > td,
    body.woocommerce-cart .woocommerce-cart-form tr.woocommerce-cart-form__cart-item > td {
        display: block !important;
        width: auto !important;
        min-width: 0 !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        text-align: left !important;
        vertical-align: top !important;
        box-sizing: border-box !important;
    }

    /* Remove WooCommerce/theme responsive labels such as Product:, Price: etc. */
    body.woocommerce-cart .woocommerce-cart-form tr.cart_item > td::before,
    body.woocommerce-cart .woocommerce-cart-form tr.woocommerce-cart-form__cart-item > td::before {
        content: none !important;
        display: none !important;
    }

    body.woocommerce-cart .woocommerce-cart-form td.product-thumbnail {
        grid-area: thumb !important;
        display: flex !important;
        align-items: flex-start !important;
        justify-content: center !important;
        width: 78px !important;
        min-width: 78px !important;
    }

    body.woocommerce-cart .woocommerce-cart-form td.product-thumbnail a {
        display: block !important;
        width: 74px !important;
        height: 74px !important;
        overflow: hidden !important;
        border: 1px solid #eef0f2 !important;
        border-radius: 10px !important;
        background: #fafbfb !important;
    }

    body.woocommerce-cart .woocommerce-cart-form td.product-thumbnail img {
        display: block !important;
        width: 74px !important;
        max-width: 74px !important;
        height: 74px !important;
        margin: 0 !important;
        padding: 0 !important;
        object-fit: contain !important;
        border: 0 !important;
        border-radius: 10px !important;
        box-shadow: none !important;
    }

    body.woocommerce-cart .woocommerce-cart-form td.product-name {
        grid-area: name !important;
        align-self: end !important;
        padding-right: 3px !important;
        color: #171a1f !important;
        font-size: 14px !important;
        font-weight: 650 !important;
        line-height: 1.35 !important;
        text-align: left !important;
        overflow-wrap: anywhere !important;
    }

    body.woocommerce-cart .woocommerce-cart-form td.product-name a {
        color: inherit !important;
        font: inherit !important;
        line-height: inherit !important;
        text-decoration: none !important;
    }

    body.woocommerce-cart .woocommerce-cart-form td.product-name dl.variation,
    body.woocommerce-cart .woocommerce-cart-form td.product-name .variation {
        margin: 5px 0 0 !important;
        color: #8a929b !important;
        font-size: 11px !important;
        font-weight: 500 !important;
        line-height: 1.3 !important;
    }

    body.woocommerce-cart .woocommerce-cart-form td.product-price {
        grid-area: price !important;
        align-self: start !important;
        color: #343a40 !important;
        font-size: 13px !important;
        font-weight: 650 !important;
        line-height: 1.25 !important;
    }

    body.woocommerce-cart .woocommerce-cart-form td.product-price .amount {
        color: inherit !important;
        font-size: inherit !important;
        font-weight: inherit !important;
    }

    body.woocommerce-cart .woocommerce-cart-form .nff-v10-cart-price-weight {
        margin-top: 3px !important;
        color: #9299a1 !important;
        font-size: 11px !important;
        font-weight: 500 !important;
    }

    body.woocommerce-cart .woocommerce-cart-form td.product-quantity {
        grid-area: qty !important;
        align-self: end !important;
        justify-self: start !important;
        margin-top: 5px !important;
    }

    body.woocommerce-cart .woocommerce-cart-form td.product-quantity .quantity {
        display: inline-flex !important;
        align-items: center !important;
        width: auto !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    body.woocommerce-cart .woocommerce-cart-form td.product-quantity input.qty {
        width: 58px !important;
        min-width: 58px !important;
        height: 34px !important;
        margin: 0 !important;
        padding: 5px 8px !important;
        border: 1px solid #dfe3e7 !important;
        border-radius: 7px !important;
        background: #ffffff !important;
        color: #5e6670 !important;
        box-shadow: none !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        line-height: 1 !important;
        text-align: center !important;
    }

    body.woocommerce-cart .woocommerce-cart-form td.product-remove {
        grid-area: remove !important;
        align-self: start !important;
        justify-self: end !important;
        width: 28px !important;
        min-width: 28px !important;
        text-align: right !important;
    }

    body.woocommerce-cart .woocommerce-cart-form td.product-remove a.remove {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 26px !important;
        height: 26px !important;
        margin: -4px -4px 0 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 50% !important;
        background: transparent !important;
        color: #4aa160 !important;
        box-shadow: none !important;
        font-size: 18px !important;
        font-weight: 500 !important;
        line-height: 1 !important;
        text-decoration: none !important;
    }

    body.woocommerce-cart .woocommerce-cart-form td.product-remove a.remove:hover,
    body.woocommerce-cart .woocommerce-cart-form td.product-remove a.remove:focus {
        background: #eef8f0 !important;
        color: #278841 !important;
    }

    /* Per-product subtotal is redundant on a narrow card. Overall subtotal and
       totals remain visible in .cart_totals at the end of the cart. */
    body.woocommerce-cart .woocommerce-cart-form td.product-subtotal {
        display: none !important;
    }

    body.woocommerce-cart .woocommerce-cart-form tr:not(.cart_item):not(.woocommerce-cart-form__cart-item) {
        display: block !important;
        width: 100% !important;
        border: 0 !important;
        background: transparent !important;
    }

    body.woocommerce-cart .woocommerce-cart-form td.actions {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 10px !important;
        width: 100% !important;
        margin: 3px 0 0 !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        box-sizing: border-box !important;
    }

    body.woocommerce-cart .woocommerce-cart-form td.actions::before {
        content: none !important;
        display: none !important;
    }

    body.woocommerce-cart .woocommerce-cart-form td.actions .coupon {
        display: flex !important;
        flex: 1 1 100% !important;
        gap: 8px !important;
        width: 100% !important;
        margin: 0 !important;
    }

    body.woocommerce-cart .woocommerce-cart-form td.actions .coupon input.input-text {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        height: 40px !important;
        border: 1px solid #dfe3e7 !important;
        border-radius: 8px !important;
        box-sizing: border-box !important;
    }

    body.woocommerce-cart .woocommerce-cart-form td.actions button,
    body.woocommerce-cart .woocommerce-cart-form td.actions .button,
    body.woocommerce-cart .woocommerce-cart-form button[name="update_cart"] {
        min-height: 40px !important;
        padding: 8px 16px !important;
        border-radius: 8px !important;
        line-height: 1.2 !important;
    }

    body.woocommerce-cart .cart-collaterals,
    body.woocommerce-cart .cart-collaterals .cart_totals {
        width: 100% !important;
        max-width: none !important;
        float: none !important;
        clear: both !important;
        margin: 0 !important;
    }

    body.woocommerce-cart .cart-collaterals .cart_totals {
        padding: 16px !important;
        border: 1px solid #e8ebee !important;
        border-radius: 12px !important;
        background: #ffffff !important;
        box-shadow: 0 4px 14px rgba(20, 31, 43, .045) !important;
        box-sizing: border-box !important;
    }

    body.woocommerce-cart .cart-collaterals .cart_totals h2 {
        margin: 0 0 10px !important;
        color: #171a1f !important;
        font-size: 17px !important;
        font-weight: 700 !important;
        line-height: 1.3 !important;
    }

    body.woocommerce-cart .cart-collaterals .cart_totals table.shop_table {
        display: table !important;
        width: 100% !important;
        margin: 0 0 12px !important;
        border: 0 !important;
        background: transparent !important;
    }

    body.woocommerce-cart .cart-collaterals .cart_totals table.shop_table tbody,
    body.woocommerce-cart .cart-collaterals .cart_totals table.shop_table tr {
        display: table-row-group !important;
    }

    body.woocommerce-cart .cart-collaterals .cart_totals table.shop_table tr {
        display: table-row !important;
    }

    body.woocommerce-cart .cart-collaterals .cart_totals th,
    body.woocommerce-cart .cart-collaterals .cart_totals td {
        display: table-cell !important;
        padding: 10px 0 !important;
        border-width: 1px 0 0 !important;
        text-align: left !important;
        vertical-align: middle !important;
    }

    body.woocommerce-cart .cart-collaterals .cart_totals td {
        text-align: right !important;
    }

    body.woocommerce-cart .cart-collaterals .cart_totals td::before {
        content: none !important;
        display: none !important;
    }

    body.woocommerce-cart .wc-proceed-to-checkout {
        padding: 8px 0 0 !important;
    }

    body.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        min-height: 44px !important;
        margin: 0 !important;
        padding: 10px 16px !important;
        border-radius: 9px !important;
        line-height: 1.2 !important;
        box-sizing: border-box !important;
    }
}

@media (max-width: 390px) {
    body.woocommerce-cart .woocommerce-cart-form tr.woocommerce-cart-form__cart-item,
    body.woocommerce-cart .woocommerce-cart-form tr.cart_item {
        grid-template-columns: 70px minmax(0, 1fr) 26px !important;
        column-gap: 11px !important;
        padding: 12px !important;
    }

    body.woocommerce-cart .woocommerce-cart-form td.product-thumbnail {
        width: 70px !important;
        min-width: 70px !important;
    }

    body.woocommerce-cart .woocommerce-cart-form td.product-thumbnail a,
    body.woocommerce-cart .woocommerce-cart-form td.product-thumbnail img {
        width: 68px !important;
        max-width: 68px !important;
        height: 68px !important;
    }
}

/* ========================================================================
 * v2.5.1 - editable cart quantity stepper + reliable remove control
 * ======================================================================== */

/* Use one compact native-looking - / quantity / + control in the cart. */
body.woocommerce-cart .woocommerce-cart-form td.product-quantity .quantity.nff-v10-cart-stepper {
    display: inline-grid !important;
    grid-template-columns: 34px 44px 34px !important;
    align-items: stretch !important;
    width: auto !important;
    min-width: 0 !important;
    height: 36px !important;
    margin: 0 !important;
    overflow: hidden !important;
    border: 1px solid #dfe3e7 !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    box-shadow: 0 1px 2px rgba(20, 31, 43, .035) !important;
    box-sizing: border-box !important;
}

body.woocommerce-cart .woocommerce-cart-form td.product-quantity .quantity.nff-v10-cart-stepper .screen-reader-text {
    position: absolute !important;
}

body.woocommerce-cart .woocommerce-cart-form td.product-quantity .quantity.nff-v10-cart-stepper input.qty {
    grid-column: 2 !important;
    width: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;
    height: 34px !important;
    min-height: 34px !important;
    margin: 0 !important;
    padding: 0 3px !important;
    border: 0 !important;
    border-right: 1px solid #edf0f2 !important;
    border-left: 1px solid #edf0f2 !important;
    border-radius: 0 !important;
    background: #ffffff !important;
    color: #343a40 !important;
    box-shadow: none !important;
    outline: 0 !important;
    appearance: textfield !important;
    -moz-appearance: textfield !important;
    font-size: 13px !important;
    font-weight: 650 !important;
    line-height: 34px !important;
    text-align: center !important;
    box-sizing: border-box !important;
}

body.woocommerce-cart .woocommerce-cart-form td.product-quantity .quantity.nff-v10-cart-stepper input.qty::-webkit-outer-spin-button,
body.woocommerce-cart .woocommerce-cart-form td.product-quantity .quantity.nff-v10-cart-stepper input.qty::-webkit-inner-spin-button {
    margin: 0 !important;
    -webkit-appearance: none !important;
}

body.woocommerce-cart .woocommerce-cart-form .nff-v10-cart-qty-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 34px !important;
    min-width: 34px !important;
    height: 34px !important;
    min-height: 34px !important;
    margin: 0 !important;
    padding: 0 0 1px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #ffffff !important;
    color: #319b4b !important;
    box-shadow: none !important;
    cursor: pointer !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 19px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
    text-align: center !important;
    text-decoration: none !important;
    -webkit-tap-highlight-color: transparent !important;
    box-sizing: border-box !important;
}

body.woocommerce-cart .woocommerce-cart-form .nff-v10-cart-qty-btn:hover,
body.woocommerce-cart .woocommerce-cart-form .nff-v10-cart-qty-btn:focus-visible {
    background: #eef8f0 !important;
    color: #24873d !important;
    outline: 0 !important;
}

body.woocommerce-cart .woocommerce-cart-form .nff-v10-cart-qty-btn:disabled,
body.woocommerce-cart .woocommerce-cart-form .nff-v10-cart-qty-btn[aria-disabled="true"] {
    background: #fafbfb !important;
    color: #bdc5cc !important;
    cursor: not-allowed !important;
}

@media (max-width: 767px) {
    body.woocommerce-cart .woocommerce-cart-form td.product-quantity {
        margin-top: 7px !important;
    }

    body.woocommerce-cart .woocommerce-cart-form td.product-quantity .quantity.nff-v10-cart-stepper {
        grid-template-columns: 30px 38px 30px !important;
        height: 32px !important;
        border-radius: 7px !important;
    }

    body.woocommerce-cart .woocommerce-cart-form td.product-quantity .quantity.nff-v10-cart-stepper input.qty {
        width: 38px !important;
        min-width: 38px !important;
        max-width: 38px !important;
        height: 30px !important;
        min-height: 30px !important;
        padding: 0 2px !important;
        font-size: 12px !important;
        line-height: 30px !important;
    }

    body.woocommerce-cart .woocommerce-cart-form .nff-v10-cart-qty-btn {
        width: 30px !important;
        min-width: 30px !important;
        height: 30px !important;
        min-height: 30px !important;
        font-size: 17px !important;
    }

    /* Force a consistent remove button. Some themes replace WooCommerce's ×
       with an icon font, which can render as a tiny green square on mobile. */
    body.woocommerce-cart .woocommerce-cart-form td.product-remove a.remove {
        position: relative !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 28px !important;
        min-width: 28px !important;
        height: 28px !important;
        min-height: 28px !important;
        margin: -3px -3px 0 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        border: 1px solid #cfe8d5 !important;
        border-radius: 50% !important;
        background: #edf8f0 !important;
        color: transparent !important;
        box-shadow: none !important;
        font-size: 0 !important;
        line-height: 1 !important;
        text-indent: 0 !important;
        text-decoration: none !important;
        box-sizing: border-box !important;
    }

    body.woocommerce-cart .woocommerce-cart-form td.product-remove a.remove > * {
        display: none !important;
    }

    body.woocommerce-cart .woocommerce-cart-form td.product-remove a.remove::before {
        content: "×" !important;
        position: static !important;
        display: block !important;
        width: auto !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 0 2px !important;
        background: transparent !important;
        color: #2f9348 !important;
        transform: none !important;
        font-family: Arial, Helvetica, sans-serif !important;
        font-size: 19px !important;
        font-style: normal !important;
        font-weight: 700 !important;
        line-height: 1 !important;
        text-align: center !important;
    }

    body.woocommerce-cart .woocommerce-cart-form td.product-remove a.remove::after {
        content: none !important;
        display: none !important;
    }

    body.woocommerce-cart .woocommerce-cart-form td.product-remove a.remove:hover,
    body.woocommerce-cart .woocommerce-cart-form td.product-remove a.remove:focus-visible {
        border-color: #b8ddc1 !important;
        background: #e2f4e6 !important;
        outline: 0 !important;
    }

    body.woocommerce-cart .woocommerce-cart-form td.product-remove a.remove:hover::before,
    body.woocommerce-cart .woocommerce-cart-form td.product-remove a.remove:focus-visible::before {
        color: #237d3a !important;
    }
}


/* ========================================================================
 * v2.6.0 - stable variable/attribute product detail flow
 * Attribute changes are local DOM updates only. The native WooCommerce
 * quantity/button stay in the form for compatibility but are hidden while the
 * NFF control is active. The NFF stepper stays hidden until the selected
 * variation is already in the cart or Add to Cart succeeds.
 * ======================================================================== */
body.single-product form.cart.nff-v10-variable-clean[data-nff-variable-bound="1"] .nff-v10-native-variable-control {
    display: none !important;
    visibility: hidden !important;
}

body.single-product form.cart.nff-v10-variable-clean[data-nff-variable-bound="1"] .nff-v10-variable-wrap {
    display: inline-flex !important;
    visibility: visible !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: auto !important;
    max-width: 100% !important;
    gap: 18px !important;
    margin: 0 !important;
}

/* Hide theme-injected native variation quantity helpers. These selectors are
   visual only; hidden variation/product inputs are never removed or disabled. */
body.single-product form.cart.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart > .quantity,
body.single-product form.cart.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart > .quantity-nav,
body.single-product form.cart.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart > .quantity-button,
body.single-product form.cart.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart > .quantity-buttons,
body.single-product form.cart.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart > .qty-buttons,
body.single-product form.cart.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart > .qty-plus,
body.single-product form.cart.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart > .qty-minus,
body.single-product form.cart.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart > .quantity-plus,
body.single-product form.cart.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart > .quantity-minus,
body.single-product form.cart.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart > .plus,
body.single-product form.cart.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart > .minus {
    display: none !important;
    visibility: hidden !important;
}

/* WooCommerce/themes may inject a post-add View cart link after the AJAX event.
   Product detail pages keep the in-place quantity control instead. */
body.single-product form.cart[data-nff-variable-bound="1"] a.added_to_cart,
body.single-product form.cart[data-nff-variable-bound="1"] a.wc-forward.added_to_cart,
body.single-product .summary a.added_to_cart.wc-forward {
    display: none !important;
    visibility: hidden !important;
}

@media (max-width: 767px) {
    body.single-product form.cart[data-nff-variable-bound="1"] .nff-v10-variable-wrap {
        gap: 14px !important;
        width: 100% !important;
    }

    body.single-product form.cart[data-nff-variable-bound="1"] .nff-v10-variable-wrap .nff-v10-confirm {
        max-width: calc(100% - 94px) !important;
    }

    body.single-product form.cart[data-nff-variable-bound="1"] .nff-v10-variable-wrap.nff-v10-first-add .nff-v10-confirm {
        max-width: 100% !important;
    }
}


/* ========================================================================
 * v2.6.1 - remove duplicate theme +/- helpers on variable products
 * Keep the NFF [- qty +] control intact while hiding theme/plugin steppers
 * that are injected elsewhere inside the selected variation add-to-cart area.
 * ======================================================================== */
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart .quantity-nav,
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart .quantity-button,
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart .quantity-buttons,
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart .qty-button,
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart .qty-buttons,
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart .qty-button-wrapper,
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart .quantity-control,
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart .quantity-controls,
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart .qty-control,
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart .qty-controls,
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart .quantity-spinner,
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart .qty-spinner,
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart .qty-plus,
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart .qty-minus,
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart .quantity-plus,
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart .quantity-minus,
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart .quantity-up,
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart .quantity-down,
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart .quantity-increase,
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart .quantity-decrease,
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart .qty-increase,
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart .qty-decrease,
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart .increment,
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart .decrement,
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart .qib-button-wrapper,
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart .qib-button,
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart .plus:not(.nff-v10-plus),
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart .minus:not(.nff-v10-minus),
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart [data-quantity-action],
body.single-product form.variations_form.nff-v10-variable-clean[data-nff-variable-bound="1"] .woocommerce-variation-add-to-cart [data-qty-action] {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
}


/* ========================================================================
 * v2.6.2 - variable products: one clean control only
 * The theme/WooCommerce quantity widget is hidden from the moment the variable
 * form exists, including before an attribute is selected. After a valid
 * variation is selected the NFF wrapper shows only Add to cart; [- qty +]
 * appears only after a successful explicit cart action.
 * ======================================================================== */
/* Structural fallback is intentionally independent of JavaScript so the theme
   quantity widget cannot flash on screen before DOM-ready. */
body.single-product .product-type-variable form.variations_form .single_variation_wrap .quantity,
body.single-product form.variations_form .woocommerce-variation-add-to-cart .quantity,
body.single-product form.variations_form.nff-v10-variable-ready .woocommerce-variation-add-to-cart .quantity,
body.single-product form.variations_form.nff-v10-variable-ready .single_variation_wrap .quantity {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
}

/* Theme/plugin +/- helpers can be siblings of .quantity instead of children.
   Hide the common variants across the native variation add-to-cart area. The
   NFF buttons use nff-v10-minus/nff-v10-plus and are explicitly excluded. */
body.single-product form.variations_form.nff-v10-variable-ready .woocommerce-variation-add-to-cart .plus:not(.nff-v10-plus),
body.single-product form.variations_form.nff-v10-variable-ready .woocommerce-variation-add-to-cart .minus:not(.nff-v10-minus),
body.single-product form.variations_form.nff-v10-variable-ready .woocommerce-variation-add-to-cart .qty-plus,
body.single-product form.variations_form.nff-v10-variable-ready .woocommerce-variation-add-to-cart .qty-minus,
body.single-product form.variations_form.nff-v10-variable-ready .woocommerce-variation-add-to-cart .quantity-plus,
body.single-product form.variations_form.nff-v10-variable-ready .woocommerce-variation-add-to-cart .quantity-minus,
body.single-product form.variations_form.nff-v10-variable-ready .woocommerce-variation-add-to-cart .quantity-up,
body.single-product form.variations_form.nff-v10-variable-ready .woocommerce-variation-add-to-cart .quantity-down,
body.single-product form.variations_form.nff-v10-variable-ready .woocommerce-variation-add-to-cart .quantity-increase,
body.single-product form.variations_form.nff-v10-variable-ready .woocommerce-variation-add-to-cart .quantity-decrease,
body.single-product form.variations_form.nff-v10-variable-ready .woocommerce-variation-add-to-cart .qty-increase,
body.single-product form.variations_form.nff-v10-variable-ready .woocommerce-variation-add-to-cart .qty-decrease,
body.single-product form.variations_form.nff-v10-variable-ready .woocommerce-variation-add-to-cart .quantity-nav,
body.single-product form.variations_form.nff-v10-variable-ready .woocommerce-variation-add-to-cart .quantity-button,
body.single-product form.variations_form.nff-v10-variable-ready .woocommerce-variation-add-to-cart .quantity-buttons,
body.single-product form.variations_form.nff-v10-variable-ready .woocommerce-variation-add-to-cart .qty-button,
body.single-product form.variations_form.nff-v10-variable-ready .woocommerce-variation-add-to-cart .qty-buttons,
body.single-product form.variations_form.nff-v10-variable-ready .woocommerce-variation-add-to-cart .qty-button-wrapper,
body.single-product form.variations_form.nff-v10-variable-ready .woocommerce-variation-add-to-cart .qib-button,
body.single-product form.variations_form.nff-v10-variable-ready .woocommerce-variation-add-to-cart .qib-button-wrapper,
body.single-product form.variations_form.nff-v10-variable-ready .woocommerce-variation-add-to-cart [data-quantity-action],
body.single-product form.variations_form.nff-v10-variable-ready .woocommerce-variation-add-to-cart [data-qty-action] {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
}

/* Generated content on native quantity helpers is a common source of the
   two orphaned vertical + / - marks seen in some WooCommerce themes. */
body.single-product form.variations_form.nff-v10-variable-ready .woocommerce-variation-add-to-cart .quantity::before,
body.single-product form.variations_form.nff-v10-variable-ready .woocommerce-variation-add-to-cart .quantity::after,
body.single-product form.variations_form.nff-v10-variable-ready .woocommerce-variation-add-to-cart .quantity *::before,
body.single-product form.variations_form.nff-v10-variable-ready .woocommerce-variation-add-to-cart .quantity *::after {
    content: none !important;
    display: none !important;
}

/* Keep the first selected-variation state visually identical to simple products:
   Add to cart only. */
body.single-product form.variations_form .nff-v10-variable-wrap.nff-v10-first-add .nff-v10-stepper {
    display: none !important;
}


/* ========================================================================
 * v2.6.3 - variable products: hard native-stepper suppression + cart restore
 * Some themes place their +/- controls outside .quantity or even outside the
 * .woocommerce-variation-add-to-cart row. Hide those native helpers anywhere
 * in the variation form; the NFF stepper uses dedicated nff-v10-* classes and
 * remains visible only when the selected variation has cart quantity > 0.
 * ======================================================================== */
body.single-product form.variations_form .quantity,
body.single-product form.variations_form .quantity-nav,
body.single-product form.variations_form .quantity-button,
body.single-product form.variations_form .quantity-buttons,
body.single-product form.variations_form .quantity-wrap,
body.single-product form.variations_form .quantity-wrapper,
body.single-product form.variations_form .qty-wrap,
body.single-product form.variations_form .qty-wrapper,
body.single-product form.variations_form .qty-button,
body.single-product form.variations_form .qty-buttons,
body.single-product form.variations_form .qty-button-wrapper,
body.single-product form.variations_form .quantity-control,
body.single-product form.variations_form .quantity-controls,
body.single-product form.variations_form .qty-control,
body.single-product form.variations_form .qty-controls,
body.single-product form.variations_form .quantity-spinner,
body.single-product form.variations_form .qty-spinner,
body.single-product form.variations_form .qib-button,
body.single-product form.variations_form .qib-button-wrapper,
body.single-product form.variations_form .plus:not(.nff-v10-plus),
body.single-product form.variations_form .minus:not(.nff-v10-minus),
body.single-product form.variations_form .qty-plus,
body.single-product form.variations_form .qty-minus,
body.single-product form.variations_form .quantity-plus,
body.single-product form.variations_form .quantity-minus,
body.single-product form.variations_form .quantity-up,
body.single-product form.variations_form .quantity-down,
body.single-product form.variations_form .quantity-increase,
body.single-product form.variations_form .quantity-decrease,
body.single-product form.variations_form .qty-increase,
body.single-product form.variations_form .qty-decrease,
body.single-product form.variations_form .increment,
body.single-product form.variations_form .decrement,
body.single-product form.variations_form [data-quantity-action],
body.single-product form.variations_form [data-qty-action],
body.single-product form.variations_form button[value="+"],
body.single-product form.variations_form button[value="-"],
body.single-product form.variations_form input[type="button"][value="+"],
body.single-product form.variations_form input[type="button"][value="-"] {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
}

/* Never let generated +/- marks survive on the hidden native quantity widget. */
body.single-product form.variations_form .quantity::before,
body.single-product form.variations_form .quantity::after,
body.single-product form.variations_form .quantity *::before,
body.single-product form.variations_form .quantity *::after,
body.single-product form.variations_form .quantity-wrap::before,
body.single-product form.variations_form .quantity-wrap::after,
body.single-product form.variations_form .quantity-wrapper::before,
body.single-product form.variations_form .quantity-wrapper::after,
body.single-product form.variations_form .qty-wrap::before,
body.single-product form.variations_form .qty-wrap::after,
body.single-product form.variations_form .qty-wrapper::before,
body.single-product form.variations_form .qty-wrapper::after {
    content: none !important;
    display: none !important;
}

/* ========================================================================
 * v2.6.4 - hard-remove theme native +/- beside variable Add to cart
 * Some themes place the stepper outside form.variations_form but still inside
 * .summary. NFF uses only .nff-v10-plus/.nff-v10-minus, so native helpers can be
 * suppressed across the variable-product summary without affecting our control.
 * ======================================================================== */
body.single-product .product-type-variable .summary .nff-v10-native-variable-control,
body.single-product .product-type-variable .summary .quantity,
body.single-product .product-type-variable .summary .quantity-nav,
body.single-product .product-type-variable .summary .quantity-button,
body.single-product .product-type-variable .summary .quantity-buttons,
body.single-product .product-type-variable .summary .quantity-wrap,
body.single-product .product-type-variable .summary .quantity-wrapper,
body.single-product .product-type-variable .summary .qty-wrap,
body.single-product .product-type-variable .summary .qty-wrapper,
body.single-product .product-type-variable .summary .qty-button,
body.single-product .product-type-variable .summary .qty-buttons,
body.single-product .product-type-variable .summary .qty-button-wrapper,
body.single-product .product-type-variable .summary .quantity-control,
body.single-product .product-type-variable .summary .quantity-controls,
body.single-product .product-type-variable .summary .qty-control,
body.single-product .product-type-variable .summary .qty-controls,
body.single-product .product-type-variable .summary .quantity-spinner,
body.single-product .product-type-variable .summary .qty-spinner,
body.single-product .product-type-variable .summary .qib-button,
body.single-product .product-type-variable .summary .qib-button-wrapper,
body.single-product .product-type-variable .summary .plus:not(.nff-v10-plus),
body.single-product .product-type-variable .summary .minus:not(.nff-v10-minus),
body.single-product .product-type-variable .summary .qty-plus,
body.single-product .product-type-variable .summary .qty-minus,
body.single-product .product-type-variable .summary .quantity-plus,
body.single-product .product-type-variable .summary .quantity-minus,
body.single-product .product-type-variable .summary .quantity-up,
body.single-product .product-type-variable .summary .quantity-down,
body.single-product .product-type-variable .summary .quantity-increase,
body.single-product .product-type-variable .summary .quantity-decrease,
body.single-product .product-type-variable .summary .qty-increase,
body.single-product .product-type-variable .summary .qty-decrease,
body.single-product .product-type-variable .summary .increment,
body.single-product .product-type-variable .summary .decrement,
body.single-product .product-type-variable .summary [data-quantity-action],
body.single-product .product-type-variable .summary [data-qty-action],
body.single-product .product-type-variable .summary button[value="+"]:not(.nff-v10-plus),
body.single-product .product-type-variable .summary button[value="-"]:not(.nff-v10-minus),
body.single-product .product-type-variable .summary input[type="button"][value="+"],
body.single-product .product-type-variable .summary input[type="button"][value="-"] {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
}

body.single-product .product-type-variable .summary .quantity::before,
body.single-product .product-type-variable .summary .quantity::after,
body.single-product .product-type-variable .summary .quantity *::before,
body.single-product .product-type-variable .summary .quantity *::after,
body.single-product .product-type-variable .summary .quantity-wrap::before,
body.single-product .product-type-variable .summary .quantity-wrap::after,
body.single-product .product-type-variable .summary .quantity-wrapper::before,
body.single-product .product-type-variable .summary .quantity-wrapper::after,
body.single-product .product-type-variable .summary .qty-wrap::before,
body.single-product .product-type-variable .summary .qty-wrap::after,
body.single-product .product-type-variable .summary .qty-wrapper::before,
body.single-product .product-type-variable .summary .qty-wrapper::after {
    content: none !important;
    display: none !important;
}

/* ========================================================================
 * v2.7.0 - Flipkart Minutes style refinements
 * ======================================================================== */
.nff-v10-stepper {
    background: #f3f3f3 !important;
    border-color: #e5e7eb !important;
    border-radius: 7px !important;
}

.nff-v10-single-weight {
    display: block !important;
    margin: 2px 0 10px !important;
    color: #7d8792 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.25 !important;
}

/* Archive/shop variable-product forms are supported when the theme or a swatch
   plugin exposes a real WooCommerce variations_form in the card. The original
   variation button remains in the DOM for WooCommerce JS but is hidden visually. */
form.variations_form[data-nff-loop-variable-bound="1"] .nff-v10-loop-variable-native {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
}

form.variations_form[data-nff-loop-variable-bound="1"] .nff-v10-loop-variable-wrap {
    display: flex !important;
    visibility: visible !important;
    margin-top: 8px !important;
}

/* Related products use the exact same product-card cart interaction. */
body.single-product .related.products .nff-v10-wrap,
body.single-product .upsells.products .nff-v10-wrap {
    width: 100% !important;
}

/* ========================================================================
 * v2.7.1 - single-product weight placement + private stock count
 * ======================================================================== */
body.single-product .nff-v10-single-weight {
    display: block !important;
    width: 100% !important;
    margin: 8px 0 8px !important;
    padding: 0 !important;
    color: #6f7d86 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;
}

/* Variable parents can start empty and receive the selected variation weight. */
body.single-product .nff-v10-single-weight:empty {
    display: none !important;
    margin: 0 !important;
}

/* Hide quantity-bearing in-stock lines such as "200 in stock". The PHP filter
   handles normal WooCommerce output; this catches themes that print it directly. */
body.single-product p.stock.in-stock,
body.single-product .summary .stock.in-stock,
body.single-product .woocommerce-variation-availability .stock.in-stock {
    display: none !important;
    visibility: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    overflow: hidden !important;
}



/* ========================================================================
 * v2.7.2 - universal grocery weight placement
 * ======================================================================== */
/* Auto-injected labels are used when custom homepage builders do not fire the
   normal WooCommerce loop hook. Keep the label as its own row below the title. */
.nff-v10-weight[data-nff-auto-weight="1"] {
    display: block !important;
    width: 100% !important;
    clear: both !important;
    margin: 4px 0 7px !important;
    padding: 0 !important;
    color: #7d8792 !important;
    opacity: 1 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 1.25 !important;
}

/* Common flex/grid card bodies occasionally make title, weight and price share
   one row. The weight node must behave like a full grocery metadata row. */
.wpr-grid-item .nff-v10-weight,
.wpr-woo-grid-item .nff-v10-weight,
.wc-block-grid__product .nff-v10-weight,
.wc-block-product .nff-v10-weight,
.elementor-loop-item .nff-v10-weight,
.woocommerce ul.products li.product .nff-v10-weight,
.woocommerce-page ul.products li.product .nff-v10-weight {
    flex-basis: 100% !important;
    max-width: 100% !important;
}

/* ========================================================================
 * v2.7.4 - left-aligned pack labels, guaranteed related section and polish
 * ======================================================================== */
/* v2.7.5 keeps the v2.7.4 visual design but removes the first-click
   button flash/jump seen in the supplied screen recording. */

/* Product weight should read like the category/title/price metadata instead of
   inheriting centered alignment from carousel/grid builders. */
.nff-v10-weight,
.nff-v10-weight[data-nff-auto-weight="1"],
body.single-product .nff-v10-single-weight {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: auto !important;
    text-align: left !important;
    justify-content: flex-start !important;
    justify-self: start !important;
    align-self: stretch !important;
}

/* Smooth first-add morph. The stepper exists from frame one but is collapsed,
   so the successful AJAX response expands it instead of causing a hard layout
   pop. This intentionally overrides the older display:none first-add rule. */
.nff-v10-wrap {
    transition: gap .18s ease, opacity .16s ease !important;
}

.nff-v10-stepper {
    transform-origin: left center !important;
    transition:
        width .18s cubic-bezier(.22,.8,.28,1),
        min-width .18s cubic-bezier(.22,.8,.28,1),
        flex-basis .18s cubic-bezier(.22,.8,.28,1),
        opacity .13s ease,
        transform .18s cubic-bezier(.22,.8,.28,1),
        border-width .13s ease !important;
}

.nff-v10-wrap.nff-v10-first-add {
    /* Keep the real Add to Cart button exactly where the theme placed it while
       the first AJAX request is running. The final space-between layout is
       introduced only after success and the JS FLIP animation masks that move. */
    justify-content: flex-start !important;
    gap: 0 !important;
}

.nff-v10-wrap.nff-v10-first-add .nff-v10-stepper {
    display: inline-grid !important;
    flex-basis: 0 !important;
    width: 0 !important;
    min-width: 0 !important;
    max-width: 0 !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateX(-5px) scaleX(.92) !important;
    border-width: 0 !important;
    pointer-events: none !important;
}

.nff-v10-wrap.nff-v10-first-add .nff-v10-confirm {
    max-width: 100% !important;
    opacity: 1 !important;
    transform: none !important;
}

/* First request should feel instant, not disabled/faded/shrunk. We block repeat
   clicks with pointer-events in the existing loading rule but keep pixels stable. */
.nff-v10-wrap.nff-v10-first-add.nff-v10-loading,
.nff-v10-wrap.nff-v10-first-add.nff-v10-loading .nff-v10-confirm {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
}

/* FLIP phase used after the first successful add. This prevents the CTA from
   teleporting when justify-content changes from the theme-like start position to
   the final [ - qty + ] ........ [ Add to Cart ] arrangement. */
.nff-v10-wrap.nff-v10-reveal-flip .nff-v10-confirm {
    transition: none !important;
    transform: translate3d(var(--nff-reveal-x, 0px), 0, 0) !important;
}

.nff-v10-wrap.nff-v10-reveal-flip.nff-v10-reveal-go .nff-v10-confirm {
    transition: transform .19s cubic-bezier(.22,.8,.28,1) !important;
    transform: translate3d(0, 0, 0) !important;
}

/* Modern/Gen-Z polish: subtle lift, soft depth and springy feedback without
   repainting the site's brand colors or changing the v2.7.2 card structure. */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
body.single-product .related.products ul.products li.product,
body.single-product .upsells.products ul.products li.product,
.wpr-grid-item,
.wpr-woo-grid-item,
.wc-block-grid__product,
.elementor-loop-item {
    transition: box-shadow .22s ease, border-color .22s ease !important;
}

body.single-product .nff-v10-related-products {
    width: 100% !important;
    clear: both !important;
    margin-top: clamp(34px, 6vw, 68px) !important;
    padding-top: clamp(20px, 3vw, 32px) !important;
    border-top: 1px solid rgba(20, 31, 24, .09) !important;
}

body.single-product .nff-v10-related-products > h2 {
    margin: 0 0 22px !important;
    font-size: clamp(22px, 2.4vw, 30px) !important;
    font-weight: 750 !important;
    line-height: 1.15 !important;
    letter-spacing: -.025em !important;
}

.nff-v10-confirm,
.nff-v10-stepper button {
    transition: transform .14s ease, opacity .14s ease, box-shadow .18s ease, background-color .18s ease !important;
}

@media (hover: hover) and (pointer: fine) {
    .woocommerce ul.products li.product:hover,
    .woocommerce-page ul.products li.product:hover,
    body.single-product .related.products ul.products li.product:hover,
    body.single-product .upsells.products ul.products li.product:hover {
        transform: translateY(-3px) !important;
        box-shadow: 0 12px 30px rgba(29, 49, 38, .09) !important;
    }

    /* Builder wrappers can be used by isotope/carousel positioning, so avoid
       overriding their transform property. A soft shadow still gives the same
       polished card response without fighting the layout engine. */
    .wpr-grid-item:hover,
    .wpr-woo-grid-item:hover,
    .wc-block-grid__product:hover,
    .elementor-loop-item:hover {
        box-shadow: 0 12px 30px rgba(29, 49, 38, .09) !important;
    }

    .nff-v10-confirm:hover,
    .nff-v10-stepper button:hover {
        transform: translateY(-1px) !important;
    }

    .nff-v10-confirm:active,
    .nff-v10-stepper button:active {
        transform: scale(.97) !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .nff-v10-wrap,
    .nff-v10-stepper,
    .nff-v10-confirm,
    .nff-v10-reveal-flip .nff-v10-confirm,
    .nff-v10-reveal-flip.nff-v10-reveal-go .nff-v10-confirm,
    .nff-v10-stepper button,
    .woocommerce ul.products li.product,
    .woocommerce-page ul.products li.product,
    .wpr-grid-item,
    .wpr-woo-grid-item,
    .wc-block-grid__product,
    .elementor-loop-item {
        transition: none !important;
        transform: none !important;
    }
}

/* v2.7.7: NFF owns the single related-products section. Hide any second
   standard WooCommerce related section a theme/template may print separately. */
body.single-product .related.products:not(.nff-v10-related-products) {
    display: none !important;
}

/* Keep 8-10 recommendations readable across the full product content width. */
body.single-product .nff-v10-related-products ul.products {
    width: 100% !important;
}

@media (min-width: 1180px) {
    body.single-product .nff-v10-related-products ul.products {
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        gap: 18px !important;
    }

    body.single-product .nff-v10-related-products ul.products::before,
    body.single-product .nff-v10-related-products ul.products::after {
        display: none !important;
    }

    body.single-product .nff-v10-related-products ul.products li.product {
        float: none !important;
        clear: none !important;
        width: auto !important;
        max-width: none !important;
        margin: 0 !important;
    }
}

@media (min-width: 768px) and (max-width: 1179px) {
    body.single-product .nff-v10-related-products ul.products {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 16px !important;
    }

    body.single-product .nff-v10-related-products ul.products li.product {
        float: none !important;
        clear: none !important;
        width: auto !important;
        max-width: none !important;
        margin: 0 !important;
    }
}

@media (max-width: 767px) {
    body.single-product .nff-v10-related-products ul.products {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 12px !important;
    }

    body.single-product .nff-v10-related-products ul.products li.product {
        float: none !important;
        clear: none !important;
        width: auto !important;
        max-width: none !important;
        margin: 0 !important;
    }
}

/* v2.7.8: Builder-safe related products. The site has a Royal/Elementor
   "Related Products" widget with its own Load More query; it can render the
   currently opened product. JS marks only that foreign block and this removes
   it without touching the NFF category-based section. */
body.single-product .nff-v10-foreign-related {
    display: none !important;
}

/* Direct NFF cards do not rely on the theme's content-product.php globals, so
   they stay correct even when Elementor/Royal mutates global $product. */
body.single-product .nff-v10-related-products-direct .nff-v10-related-grid {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    align-items: stretch !important;
}

body.single-product .nff-v10-related-products-direct .nff-v10-related-card {
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    min-width: 0 !important;
    padding: 10px !important;
    border: 1px solid rgba(22, 33, 27, .10) !important;
    border-radius: 10px !important;
    background: #fff !important;
    overflow: hidden !important;
}

body.single-product .nff-v10-related-products-direct .nff-v10-related-card-link {
    display: block !important;
    color: inherit !important;
    text-decoration: none !important;
}

body.single-product .nff-v10-related-products-direct .nff-v10-related-image {
    display: block !important;
    width: 100% !important;
    aspect-ratio: 1 / 1 !important;
    overflow: hidden !important;
    border-radius: 8px !important;
    background: #fafafa !important;
    margin: 0 0 10px !important;
}

body.single-product .nff-v10-related-products-direct .nff-v10-related-image img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    object-fit: contain !important;
}

body.single-product .nff-v10-related-products-direct .nff-v10-related-category {
    display: block !important;
    margin: 0 0 4px !important;
    color: #8b9290 !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
}

body.single-product .nff-v10-related-products-direct .woocommerce-loop-product__title {
    margin: 0 0 6px !important;
    padding: 0 !important;
    color: inherit !important;
    font-size: 15px !important;
    font-weight: 650 !important;
    line-height: 1.35 !important;
    min-height: 0 !important;
}

body.single-product .nff-v10-related-products-direct .nff-v10-related-weight,
body.single-product .nff-v10-related-products-direct .nff-v10-weight {
    width: 100% !important;
    display: block !important;
    margin: 0 0 7px !important;
    padding: 0 !important;
    text-align: left !important;
    color: #808786 !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
}

body.single-product .nff-v10-related-products-direct .price {
    display: block !important;
    margin: 0 0 10px !important;
    font-size: 15px !important;
    line-height: 1.3 !important;
}

body.single-product .nff-v10-related-products-direct .nff-v10-related-actions {
    margin-top: auto !important;
    padding-top: 2px !important;
}

body.single-product .nff-v10-related-products-direct .nff-v10-related-actions > .button,
body.single-product .nff-v10-related-products-direct .nff-v10-related-actions > a.button {
    margin: 0 !important;
}

/* ========================================================================
 * v2.8.0 - Related products: reference-card layout + mobile grid fixes
 * ========================================================================
 * The WooCommerce clearfix pseudo-elements become real grid items when a
 * products list is switched to CSS Grid. On narrow screens that created the
 * empty first slot visible in the supplied mobile screenshot. Remove those
 * pseudo-elements for the NFF-owned related grid at every breakpoint.
 */
body.single-product .nff-v10-related-products-direct .nff-v10-related-grid::before,
body.single-product .nff-v10-related-products-direct .nff-v10-related-grid::after {
    content: none !important;
    display: none !important;
}

/* Match the larger three-card reference layout instead of the previous
   five-column compact strip. */
body.single-product .nff-v10-related-products-direct .nff-v10-related-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 20px !important;
    align-items: stretch !important;
}

body.single-product .nff-v10-related-products-direct .nff-v10-related-card {
    float: none !important;
    clear: none !important;
    grid-column: auto !important;
    grid-row: auto !important;
    order: 0 !important;
    justify-self: stretch !important;
    width: auto !important;
    max-width: none !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 10px !important;
    border: 1px solid #e2e5e6 !important;
    border-radius: 11px !important;
    background: #ffffff !important;
    box-shadow: none !important;
}

body.single-product .nff-v10-related-products-direct .nff-v10-related-image {
    aspect-ratio: 1 / 1 !important;
    margin: 0 0 11px !important;
    border-radius: 8px !important;
    background: #fbfbfa !important;
}

body.single-product .nff-v10-related-products-direct .nff-v10-related-image img {
    object-fit: contain !important;
}

body.single-product .nff-v10-related-products-direct .nff-v10-related-category {
    margin: 0 0 5px !important;
    color: #8a9291 !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1.3 !important;
}

body.single-product .nff-v10-related-products-direct .woocommerce-loop-product__title {
    margin: 0 0 6px !important;
    color: #151817 !important;
    font-size: 17px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    letter-spacing: 0 !important;
}

body.single-product .nff-v10-related-products-direct .nff-v10-related-weight,
body.single-product .nff-v10-related-products-direct .nff-v10-weight {
    margin: 0 0 8px !important;
    color: #77817f !important;
    opacity: 1 !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1.3 !important;
}

body.single-product .nff-v10-related-products-direct .price,
body.single-product .nff-v10-related-products-direct .price .amount,
body.single-product .nff-v10-related-products-direct .price .woocommerce-Price-amount {
    color: #ff596d !important;
}

body.single-product .nff-v10-related-products-direct .price {
    display: block !important;
    margin: 0 0 16px !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;
}

body.single-product .nff-v10-related-products-direct .nff-v10-related-actions {
    width: 100% !important;
    margin-top: auto !important;
    padding-top: 0 !important;
}

/* The reference keeps the pre-add CTA at the left edge. Once a quantity exists,
   the quantity chooser stays left and the CTA stays right. */
body.single-product .nff-v10-related-products-direct .nff-v10-related-actions .nff-v10-wrap {
    justify-content: space-between !important;
    gap: 14px !important;
}

body.single-product .nff-v10-related-products-direct .nff-v10-related-actions .nff-v10-wrap.nff-v10-first-add {
    justify-content: flex-start !important;
}

body.single-product .nff-v10-related-products-direct .nff-v10-related-actions > .button,
body.single-product .nff-v10-related-products-direct .nff-v10-related-actions > a.button,
body.single-product .nff-v10-related-products-direct .nff-v10-related-actions .nff-v10-confirm {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 120px !important;
    max-width: none !important;
    min-height: 34px !important;
    height: 34px !important;
    margin: 0 !important;
    padding: 0 17px !important;
    border: 1px solid #4f985c !important;
    border-radius: 4px !important;
    background: #4f985c !important;
    background-image: none !important;
    color: #ffffff !important;
    box-shadow: none !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    text-transform: none !important;
    white-space: nowrap !important;
    overflow: visible !important;
    text-overflow: clip !important;
}

body.single-product .nff-v10-related-products-direct .nff-v10-related-actions > .button:hover,
body.single-product .nff-v10-related-products-direct .nff-v10-related-actions > a.button:hover,
body.single-product .nff-v10-related-products-direct .nff-v10-related-actions .nff-v10-confirm:hover,
body.single-product .nff-v10-related-products-direct .nff-v10-related-actions .nff-v10-confirm:focus {
    border-color: #43864f !important;
    background: #43864f !important;
    background-image: none !important;
    color: #ffffff !important;
}

@media (max-width: 767px) {
    body.single-product .nff-v10-related-products {
        margin-top: 30px !important;
        padding-top: 18px !important;
    }

    body.single-product .nff-v10-related-products > h2 {
        margin-bottom: 14px !important;
        font-size: 20px !important;
        line-height: 1.2 !important;
    }

    body.single-product .nff-v10-related-products-direct .nff-v10-related-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
    }

    body.single-product .nff-v10-related-products-direct .nff-v10-related-card {
        padding: 8px !important;
        border-radius: 9px !important;
    }

    body.single-product .nff-v10-related-products-direct .nff-v10-related-image {
        margin-bottom: 8px !important;
        border-radius: 7px !important;
    }

    body.single-product .nff-v10-related-products-direct .nff-v10-related-category {
        margin-bottom: 3px !important;
        font-size: 10.5px !important;
    }

    body.single-product .nff-v10-related-products-direct .woocommerce-loop-product__title {
        margin-bottom: 5px !important;
        font-size: 12.5px !important;
        line-height: 1.28 !important;
    }

    body.single-product .nff-v10-related-products-direct .nff-v10-related-weight,
    body.single-product .nff-v10-related-products-direct .nff-v10-weight {
        margin-bottom: 6px !important;
        font-size: 10.5px !important;
    }

    body.single-product .nff-v10-related-products-direct .price {
        margin-bottom: 9px !important;
        font-size: 12.5px !important;
    }

    /* Two-column phone cards are too narrow for an 80px stepper plus a readable
       Add to Cart button on one row. Stack only the post-add state so both
       controls remain fully legible and tappable. */
    body.single-product .nff-v10-related-products-direct .nff-v10-related-actions .nff-v10-wrap:not(.nff-v10-first-add) {
        flex-direction: column !important;
        align-items: stretch !important;
        justify-content: flex-start !important;
        gap: 6px !important;
    }

    body.single-product .nff-v10-related-products-direct .nff-v10-related-actions .nff-v10-wrap .nff-v10-stepper {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        flex: 0 0 auto !important;
        flex-basis: auto !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: 32px !important;
        min-height: 32px !important;
    }

    body.single-product .nff-v10-related-products-direct .nff-v10-related-actions .nff-v10-stepper button,
    body.single-product .nff-v10-related-products-direct .nff-v10-related-actions .nff-v10-number {
        width: auto !important;
        min-width: 0 !important;
    }

    body.single-product .nff-v10-related-products-direct .nff-v10-related-actions > .button,
    body.single-product .nff-v10-related-products-direct .nff-v10-related-actions > a.button,
    body.single-product .nff-v10-related-products-direct .nff-v10-related-actions .nff-v10-confirm,
    body.single-product .nff-v10-related-products-direct .nff-v10-related-actions .nff-v10-wrap.nff-v10-first-add .nff-v10-confirm {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        min-height: 32px !important;
        height: 32px !important;
        padding: 0 8px !important;
        font-size: 11.5px !important;
        white-space: nowrap !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }
}


/* v2.8.1 - site-wide Mumbai delivery-area strip */
.nff-v10-delivery-notice {
    position: relative;
    z-index: 9999;
    width: 100%;
    margin: 0;
    border: 0;
    border-bottom: 1px solid rgba(21, 128, 61, 0.16);
    background: linear-gradient(90deg, #f0fdf4 0%, #ecfdf5 50%, #f0fdf4 100%);
    color: #166534;
    box-shadow: 0 1px 0 rgba(15, 23, 42, 0.03);
    font-family: inherit;
}

.nff-v10-delivery-notice__inner {
    box-sizing: border-box;
    width: min(100%, 1440px);
    min-height: 38px;
    margin: 0 auto;
    padding: 7px 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    text-align: center;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.35;
    letter-spacing: 0.01em;
}

.nff-v10-delivery-notice__icon {
    width: 22px;
    height: 22px;
    flex: 0 0 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: #ffffff;
    box-shadow: 0 1px 5px rgba(22, 101, 52, 0.12);
}

.nff-v10-delivery-notice__icon svg {
    display: block;
    width: 13px;
    height: 13px;
    fill: currentColor;
}

.nff-v10-delivery-notice__text strong {
    font-weight: 800;
    color: #14532d;
}

@media (max-width: 767px) {
    .nff-v10-delivery-notice__inner {
        min-height: 34px;
        padding: 6px 10px;
        gap: 6px;
        font-size: 11.5px;
    }

    .nff-v10-delivery-notice__icon {
        width: 19px;
        height: 19px;
        flex-basis: 19px;
    }

    .nff-v10-delivery-notice__icon svg {
        width: 11px;
        height: 11px;
    }
}

/* v2.8.2 - compatibility for the site's custom moving delivery ticker.
   The page builder/theme can ship generic .ticker-track animation rules, so use
   a plugin-prefixed keyframe plus a more specific selector. This intentionally
   changes motion only; the widget keeps its own colors, spacing and typography. */
@-webkit-keyframes nff-v10-delivery-ticker-move {
    from { -webkit-transform: translate3d(-50%, 0, 0); transform: translate3d(-50%, 0, 0); }
    to   { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
}

@keyframes nff-v10-delivery-ticker-move {
    from { -webkit-transform: translate3d(-50%, 0, 0); transform: translate3d(-50%, 0, 0); }
    to   { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
}

html body .delivery-ticker {
    overflow: hidden !important;
    white-space: nowrap !important;
}

html body .delivery-ticker > .ticker-track {
    display: flex !important;
    flex-wrap: nowrap !important;
    width: max-content !important;
    min-width: max-content !important;
    -webkit-animation: nff-v10-delivery-ticker-move 18s linear infinite !important;
    animation: nff-v10-delivery-ticker-move 18s linear infinite !important;
    -webkit-animation-play-state: running !important;
    animation-play-state: running !important;
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

html body .delivery-ticker > .ticker-track > span {
    display: block !important;
    flex: 0 0 auto !important;
}

/* ========================================================================
 * v2.9.0 - persistent variation CTA + responsive rapid quantity taps
 * The custom selected-variation control is mounted as a direct child of the
 * variations form, outside theme-replaced .single_variation_wrap markup.
 * ======================================================================== */
body.single-product form.variations_form[data-nff-variable-bound="1"] > .nff-v10-variable-wrap {
    display: inline-flex !important;
    visibility: visible !important;
    position: relative !important;
    clear: both !important;
    margin-top: 10px !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

body.single-product form.variations_form[data-nff-variable-bound="1"] > .nff-v10-variable-wrap .nff-v10-confirm {
    visibility: visible !important;
    opacity: 1 !important;
}

form.variations_form[data-nff-loop-variable-bound="1"] > .nff-v10-loop-variable-wrap {
    display: flex !important;
    visibility: visible !important;
    position: relative !important;
    clear: both !important;
    width: 100% !important;
    margin-top: 8px !important;
}

/* While a cart write is running, Add to cart is locked but +/- stay tappable.
   JavaScript coalesces rapid taps into the latest absolute quantity. */
.nff-v10-wrap.nff-v10-loading .nff-v10-stepper,
.nff-v10-wrap.nff-v10-loading .nff-v10-stepper button {
    pointer-events: auto !important;
}

@media (max-width: 767px) {
    body.single-product form.variations_form[data-nff-variable-bound="1"] > .nff-v10-variable-wrap {
        width: 100% !important;
        max-width: 100% !important;
        margin-top: 10px !important;
    }
}

/* v2.9.1 - Managed product cards never expose WooCommerce's native View cart
   fallback. JavaScript replaces a successful add with [- qty +] + Add to Cart;
   this rule prevents a one-frame View cart flash while native AJAX events settle. */
li.product > a.added_to_cart,
li.product a.wc-forward.added_to_cart,
.products .product a.added_to_cart,
.related.products a.added_to_cart,
.upsells.products a.added_to_cart,
.cross-sells a.added_to_cart,
.nff-v10-related-card a.added_to_cart,
.nff-v10-related-actions a.added_to_cart,
.wpr-grid-item a.added_to_cart,
.wpr-woo-grid-item a.added_to_cart,
.elementor-loop-item a.added_to_cart,
.product-grid-item a.added_to_cart,
.wc-block-product a.added_to_cart,
.wc-block-grid__product a.added_to_cart {
    display: none !important;
}
/* v2.9.6 polish */
.nff-v10-related-actions .nff-v10-wrap,
.nff-v10-wrap {
    display:inline-flex;
    align-items:center;
    gap:8px;
    vertical-align:middle;
    margin:6px 0;
}
.nff-v10-related-actions .nff-v10-stepper {
    gap:6px;
}
.nff-v10-related-actions .nff-v10-confirm {
    margin-left:8px;
}
.single-product .summary .single_add_to_cart_button,
.single-product .summary .nff-v10-confirm {
    margin-top:12px;
}
.nff-custom-stepper {display:none!important;}


/* v297 quantity layout polish */
.nff-v10-related-actions .nff-v10-qty,
.nff-v10-related-actions .nff-qty-wrapper,
.nff-v10-related-actions .nff-quantity-wrap{
    display:inline-flex !important;
    align-items:center !important;
    gap:8px !important;
    margin:0 10px 0 0 !important;
    vertical-align:middle !important;
}
.nff-v10-related-actions .nff-v10-qty button,
.nff-v10-related-actions .nff-qty-wrapper button,
.nff-v10-related-actions .nff-quantity-wrap button{
    min-width:34px !important;
    height:34px !important;
}
.nff-v10-related-actions{
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
    flex-wrap:wrap !important;
}
.single-product form.cart .single_add_to_cart_button{
    margin-top:10px !important;
}

/* NFF v2.9.8 quantity polish */
.nff-universal-qty{
    align-items:center !important;
    vertical-align:middle;
    margin-right:12px !important;
}
.nff-universal-qty button{
    min-width:38px;
    height:38px;
    padding:0 !important;
}
.nff-universal-qty .nff-u-count{
    min-width:22px;
    text-align:center;
}
.nff-v10-related-actions .nff-universal-qty + a{
    margin-left:8px !important;
}