.product.sd-hover-buttons-on-hover .sd-product-countdown {
    flex-wrap: nowrap;
    width: 100%;
    padding-top: 5px;
    border-top: 1px solid var(--brdcolor-gray-300)
}

.product.sd-hover-buttons-on-hover .sd-product-countdown > span {
    flex: 1 1 auto;
    min-width: 0;
    background-color: transparent;
    box-shadow: none
}

.product.sd-hover-buttons-on-hover {
    --text-align: start;
    --btn-height: 36px;
    --sd-btn-inset: 0;
    --sd-thumb-brd-radius: var(--sd-brd-radius);
    --sd-trans-h: calc(var(--sd-prod-gap) + var(--btn-height))
}

.product.sd-hover-buttons-on-hover .product-wrapper {
    overflow: hidden;
    border-radius: 0;
    transition: all .3s ease
}

.browser-Safari .product.sd-hover-buttons-on-hover .product-wrapper {
    transform: translate3d(0, 0, 0)
}

.product.sd-hover-buttons-on-hover .product-element-top {
    border-radius: var(--sd-thumb-brd-radius)
}

.product.sd-hover-buttons-on-hover .product-element-bottom {
    padding: var(--sd-prod-bg-cont-sp);
    background-color: inherit
}

.product.sd-hover-buttons-on-hover .product-element-bottom .sd-action-btn.sd-style-icon > a {
    width: 25px;
    height: 25px
}

.product.sd-hover-buttons-on-hover :is(.sd-product-header,.wrap-price) {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--sd-prod-gap)
}

.product.sd-hover-buttons-on-hover .wrap-price {
    flex-wrap: wrap
}

.product.sd-hover-buttons-on-hover .sd-action-buttons {
    display: inline-flex;
    gap: var(--sd-prod-gap)
}

.product.sd-hover-buttons-on-hover .sd-add-btn {
    flex-grow: 1;
    overflow: hidden
}

.product.sd-hover-buttons-on-hover .sd-add-btn > a {
    border-radius: var(--btn-accented-brd-radius);
    color: var(--btn-accented-color);
    box-shadow: var(--btn-accented-box-shadow);
    background-color: var(--btn-accented-bgcolor);
    text-transform: var(--btn-accented-transform, var(--btn-transform));
    font-weight: var(--btn-accented-font-weight, var(--btn-font-weight));
    font-family: var(--btn-accented-font-family, var(--btn-font-family));
    font-style: var(--btn-accented-font-style, var(--btn-font-style));
    width: 100%
}

.product.sd-hover-buttons-on-hover .sd-add-btn > a:hover {
    color: var(--btn-accented-color-hover);
    box-shadow: var(--btn-accented-box-shadow-hover);
    background-color: var(--btn-accented-bgcolor-hover)
}

.product.sd-hover-buttons-on-hover .sd-add-btn > a:active {
    box-shadow: var(--btn-accented-box-shadow-active);
    bottom: var(--btn-accented-bottom-active)
}

.product.sd-hover-buttons-on-hover .add-to-cart-loop span {
    font-size: 12px;
    padding: 0 14px;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: block;
    line-height: var(--btn-height);
    overflow: hidden
}

.product.sd-hover-buttons-on-hover .sd-buttons {
    opacity: .6;
    visibility: visible;
    transform: none;
    background: none;
    box-shadow: none
}

:is(.sd-fbt,.catalog-mode-on,.login-see-prices) .product.sd-hover-buttons-on-hover {
    --sd-trans-h: calc(var(--sd-prod-gap) + 25px)
}

.product.sd-hover-buttons-on-hover .sd-quick-shop-2 {
    width: 100%
}

.product.sd-hover-buttons-on-hover .sd-quick-shop-2 table.variations {
    display: inline-flex
}

:is(.products-bordered-grid-ins,.sd-products-with-bg:not(.products-bordered-grid),.sd-products-with-shadow:not(.products-bordered-grid)) .product.sd-hover-buttons-on-hover {
    --sd-prod-bg-sp: 0;
    --sd-prod-bg-cont-sp: 15px;
    --sd-thumb-brd-radius: 0
}

:is(.products-bordered-grid-ins,.sd-products-with-bg:not(.products-bordered-grid),.sd-products-with-shadow:not(.products-bordered-grid)) .product.sd-hover-buttons-on-hover .product-wrapper {
    border-radius: var(--sd-brd-radius);
    gap: 0
}

@media (min-width: 1025px) {
    .product.sd-hover-buttons-on-hover .product-wrapper:hover {
        transform: translateY(-10px)
    }

    .product.sd-hover-buttons-on-hover .product-element-top {
        clip-path: inset(0 0 0 0 round var(--sd-thumb-brd-radius));
        transition: all .3s ease
    }

    .product.sd-hover-buttons-on-hover .product-element-bottom {
        margin-bottom: calc(var(--sd-trans-h) * -1);
        transition: transform .3s ease;
        z-index: 2
    }

    .product.sd-hover-buttons-on-hover .sd-product-footer {
        display: flex;
        align-items: center;
        gap: 15px;
        opacity: 0;
        visibility: hidden;
        transition: opacity .3s ease, visibility .3s ease
    }

    .product.sd-hover-buttons-on-hover:not(:is(.quick-shop-shown,.sd-loading)):is(:hover,.sd-variation-active) :is(.product-element-bottom,.sd-product-grid-slider-pagin) {
        transform: translateY(calc(var(--sd-trans-h) * -1))
    }

    .product.sd-hover-buttons-on-hover:not(:is(.quick-shop-shown,.sd-loading)):is(:hover,.sd-variation-active) .sd-product-footer {
        opacity: 1;
        visibility: visible
    }

    .product.sd-hover-buttons-on-hover:not(:is(.quick-shop-shown,.sd-loading)):is(:hover,.sd-variation-active) .product-element-top {
        clip-path: inset(0 0 var(--sd-trans-h) 0 round var(--sd-thumb-brd-radius))
    }

    :is(.owl-carousel,.products-bordered-grid) .product.sd-hover-buttons-on-hover .product-wrapper {
        transform: none
    }
}

@media (max-width: 1024px) {
    :is(.sd-fbt,.catalog-mode-on,.login-see-prices) .product.sd-hover-buttons-on-hover .sd-product-footer {
        display: none
    }

    .product.sd-hover-buttons-on-hover .sd-action-buttons {
        display: none
    }
}
