.product-sticky-add-to-cart {
    position: fixed;
    display: grid;
    inset: 12px;
    top: unset;
    z-index: 2;
    visibility: hidden;
    opacity: 0;
    gap: 8px;
    grid-template-columns: minmax(0, 1fr);
    grid-auto-flow: column;
    background: var(--theme-color-white-blur-9);
    backdrop-filter: blur(10px);
    justify-content: space-between;
    align-items: center;
    padding: 8px;
    transition:
        opacity 0.2s ease-in-out,
        visibility 0.2s ease-in-out;
    border: 1px solid var(--theme-color-grey-2);
    border-radius: 8px;

    .product-sticky-add-to-cart-toggle-variants {
        display: flex;
        align-items: center;
        border: 1px solid var(--theme-color-grey-2);
        height: 100%;
        gap: 8px;
        border-radius: 8px;
        padding: 12px 16px;

        [data-label] {
            color: var(--theme-color-grey-4);
        }

        &:focus {
            outline: 1px solid var(--theme-color-black);
        }

        svg {
            margin-left: auto;
            transition: transform 0.2s ease-in-out;
        }

        &[aria-expanded="false"] svg {
            transform: rotate(0deg);
        }

        &[aria-expanded="true"] svg {
            transform: rotate(180deg);
        }
    }

    .product-sticky-add-to-cart-details {
        display: flex;
        flex-direction: column;
        align-self: center;
    }

    .product-sticky-select-variant {
        margin-right: 8px;
    }

    .product-sticky-add-to-cart-info {
        display: flex;
        gap: 12px;
        .price-list {
            margin-top: 0;
        }
    }

    button:not([data-modal-trigger]) {
        width: calc(100dvw / 12 * 2);
    }
}

.product-sticky-add-to-cart.is-visible {
    visibility: visible;
    opacity: 1;
}

main .product-sticky-add-to-cart-variants {
    position: absolute;
    z-index: 3;
    bottom: calc(100% + 20px);
    background: var(--theme-color-white);
    background: var(--theme-color-white-blur-9);
    border: 1px solid var(--theme-color-grey-2);
    backdrop-filter: blur(10px);
    padding: 16px;
    border-radius: 8px;
    right: -40px;
    left: 0;

    &[data-block-id="variant_picker"] {
        .variant-picker__option-values {
            --_grid: 4;
            --_grid-gap: 6px;
            margin-right: 32px;
        }
    }

    variant-picker {
        margin-top: 0;
    }
}

@media screen and (max-width: 1000px) {
    .product-sticky-add-to-cart {
        display: none;
    }
}