/**
 * Frontend styles for Grovidex Sticky Cart.
 *
 * Mobile: an always-visible bottom bar with the plugin's own custom styling
 * (unchanged by the desktop feature below).
 *
 * Desktop: the sticky bar is shown only once the original Add to Cart / Buy
 * Now buttons scroll out of view, and hidden again once Related Products is
 * reached. It has no chrome of its own (background, border, shadow, padding)
 * -- JavaScript mirrors the real buttons' style and sizes the bar to their
 * exact combined position and width via CSS custom properties, so it looks
 * like the original buttons simply became fixed.
 */
.grovidex-sticky-cart {
    --grovidex-sticky-cart-primary: #2563eb;
    --grovidex-sticky-cart-primary-dark: #1d4ed8;
    --grovidex-sticky-cart-accent: #f97316;
    --grovidex-sticky-cart-accent-dark: #ea580c;
    --grovidex-sticky-cart-text: #102a2a;
    --grovidex-sticky-cart-surface: rgba(255, 255, 255, 0.97);
    --grovidex-sticky-cart-border: rgba(37, 99, 235, 0.16);
    --grovidex-sticky-cart-shadow: 0 -14px 34px rgba(37, 99, 235, 0.18);
    --grovidex-sticky-cart-radius: 999px;
    --grovidex-sticky-cart-focus: 0 0 0 3px rgba(249, 115, 22, 0.45), 0 0 0 6px rgba(37, 99, 235, 0.28);

    position: fixed;
    z-index: 9999;
    color: var(--grovidex-sticky-cart-text);
    opacity: 0;
    transform: translate3d(0, 12px, 0);
    transition: opacity 180ms ease, transform 180ms ease, box-shadow 180ms ease;
    -webkit-font-smoothing: antialiased;
}

@media (max-width: 782px), (orientation: landscape) and (max-height: 500px) and (pointer: coarse) {
    @supports ((backdrop-filter: blur(14px)) or (-webkit-backdrop-filter: blur(14px))) {
        .grovidex-sticky-cart {
            -webkit-backdrop-filter: saturate(160%) blur(14px);
            backdrop-filter: saturate(160%) blur(14px);
        }
    }
}

.grovidex-sticky-cart.is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

.grovidex-sticky-cart[hidden] {
    display: none !important;
}

.grovidex-sticky-cart__inner {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    width: 100%;
    padding: 0.75rem max(1rem, env(safe-area-inset-left)) max(0.75rem, env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-right));
}

.grovidex-sticky-cart__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 3.125rem;
    width: 100%;
    border: 1px solid transparent;
    border-radius: var(--grovidex-sticky-cart-radius);
    cursor: pointer;
    touch-action: manipulation;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    font: inherit;
    font-weight: 800;
    letter-spacing: 0.01em;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    text-rendering: optimizeLegibility;
    box-shadow: 0 8px 18px rgba(37, 99, 235, 0.16);
    transform: translate3d(0, 0, 0);
    transition: background-color 160ms ease, border-color 160ms ease, box-shadow 160ms ease, color 160ms ease, opacity 160ms ease, transform 160ms ease;
    -webkit-appearance: none;
    appearance: none;
}

.grovidex-sticky-cart__button:focus {
    outline: 2px solid transparent;
    outline-offset: 3px;
    box-shadow: var(--grovidex-sticky-cart-focus);
}

.grovidex-sticky-cart__button:focus:not(:focus-visible) {
    outline: none;
    box-shadow: 0 8px 18px rgba(37, 99, 235, 0.16);
}

.grovidex-sticky-cart__button--buy:focus:not(:focus-visible) {
    box-shadow: 0 8px 18px rgba(249, 115, 22, 0.28);
}

.grovidex-sticky-cart__button:focus-visible {
    outline: 2px solid transparent;
    outline-offset: 3px;
    box-shadow: var(--grovidex-sticky-cart-focus);
}

.grovidex-sticky-cart__button:hover:not(:disabled):not(.is-unavailable) {
    transform: translate3d(0, -1px, 0);
}

.grovidex-sticky-cart__button:active:not(:disabled):not(.is-unavailable) {
    transform: translate3d(0, 1px, 0);
}

.grovidex-sticky-cart__button--add {
    background: var(--grovidex-sticky-cart-primary);
    color: #ffffff;
}

.grovidex-sticky-cart__button--add:hover:not(:disabled):not(.is-unavailable) {
    background: var(--grovidex-sticky-cart-primary-dark);
    box-shadow: 0 10px 22px rgba(37, 99, 235, 0.24);
}

.grovidex-sticky-cart__button--add:active:not(:disabled):not(.is-unavailable) {
    background: #1e3a8a;
}

.grovidex-sticky-cart__button--buy {
    background: var(--grovidex-sticky-cart-accent);
    color: var(--grovidex-sticky-cart-text);
    box-shadow: 0 8px 18px rgba(249, 115, 22, 0.28);
}

.grovidex-sticky-cart__button--buy:hover:not(:disabled):not(.is-unavailable) {
    background: var(--grovidex-sticky-cart-accent-dark);
    box-shadow: 0 10px 22px rgba(249, 115, 22, 0.34);
}

.grovidex-sticky-cart__button--buy:active:not(:disabled):not(.is-unavailable) {
    background: #c2410c;
}

/**
 * Hides the original Quantity, Add to Cart, and Buy Now controls once the
 * sticky bar has confirmed (in JavaScript) that it can operate, leaving the
 * plugin's own buttons as the only visible purchase actions. If JavaScript
 * fails to run, this class is never added and the original controls remain
 * visible and usable.
 *
 * rc7-mobile-only: scoped strictly to the mobile breakpoint. The desktop
 * sticky bar is disabled in this release, so the original Add to Cart / Buy
 * Now / Quantity controls must remain fully visible and usable on desktop --
 * hiding them there would leave desktop shoppers with no way to purchase.
 */
@media (max-width: 782px), (orientation: landscape) and (max-height: 500px) and (pointer: coarse) {
    body.grovidex-sticky-cart-hide-original .summary form.cart .quantity,
    body.grovidex-sticky-cart-hide-original .summary form.cart .single_add_to_cart_button,
    body.grovidex-sticky-cart-hide-original .summary form.cart button[name="add-to-cart"],
    body.grovidex-sticky-cart-hide-original .summary form.cart input[name="add-to-cart"],
    body.grovidex-sticky-cart-hide-original .grovidex-buy-now-btn {
        visibility: hidden !important;
        pointer-events: none !important;
        display: none !important;
    }
}

.grovidex-sticky-cart__button:disabled,
.grovidex-sticky-cart__button.is-unavailable {
    cursor: not-allowed;
    opacity: 0.55;
    box-shadow: none;
    transform: none;
}

@media (hover: none) {
    .grovidex-sticky-cart__button:hover:not(:disabled):not(.is-unavailable) {
        transform: none;
    }
}

@media (max-width: 782px), (orientation: landscape) and (max-height: 500px) and (pointer: coarse) {
    .grovidex-sticky-cart {
        bottom: 0;
        left: 0;
        right: 0;
        width: 100%;
        background: var(--grovidex-sticky-cart-surface);
        border-top: 1px solid var(--grovidex-sticky-cart-border);
        box-shadow: var(--grovidex-sticky-cart-shadow);
    }

    .grovidex-sticky-cart__inner {
        gap: 0.625rem;
        padding-top: 0.625rem;
        padding-bottom: max(0.75rem, env(safe-area-inset-bottom));
    }

    .grovidex-sticky-cart__button {
        min-height: 3.25rem;
        font-size: 1rem;
    }

    body.grovidex-sticky-cart-visible {
        padding-bottom: calc(4.875rem + env(safe-area-inset-bottom));
    }
}

@media (min-width: 783px) and (min-height: 501px), (min-width: 783px) and (pointer: fine) {
    /*
     * rc7-mobile-only: desktop sticky bar is disabled for this release
     * (not needed alongside the upcoming Desktop Product Page v2 work).
     * This is the authoritative switch -- it hides the bar regardless of
     * any JS-computed visibility state, and is the single rule to remove
     * to reactivate desktop behavior later.
     */
    .grovidex-sticky-cart {
        display: none !important;
    }
}

@media (max-width: 600px) {
    .grovidex-sticky-cart__inner {
        padding-right: max(0.875rem, env(safe-area-inset-right));
        padding-left: max(0.875rem, env(safe-area-inset-left));
    }
}

@media (prefers-reduced-motion: reduce) {
    .grovidex-sticky-cart,
    .grovidex-sticky-cart__button {
        transition: none;
    }

    .grovidex-sticky-cart,
    .grovidex-sticky-cart.is-visible,
    .grovidex-sticky-cart__button,
    .grovidex-sticky-cart__button:hover:not(:disabled):not(.is-unavailable),
    .grovidex-sticky-cart__button:active:not(:disabled):not(.is-unavailable) {
        transform: none;
    }
}