/* Testimonial */
.testimonial-block .list-avatar .bg-img {
    opacity: 0;
    visibility: hidden;
    overflow: hidden;
    transition: opacity ease 1s;

    img {
        position: absolute;
        height: 0;
    }

    &.active {
        opacity: 1;
        visibility: visible;

        img {
            position: relative;
            height: auto;
        }
    }
}

.video-tutorial-block {
    .list-video .bg-video {
        opacity: 0;
        visibility: hidden;
        overflow: hidden;
        transition: opacity ease 1s;
        position: absolute;
        top: 0;

        .bg-img {
            position: absolute;
            height: 0;
        }

        &.active {
            opacity: 1;
            visibility: visible;

            .bg-img {
                position: relative;
                height: 100%;
            }
        }

        @media (max-width: 640px) {
            position: relative;
        }
    }

    .button-main.play-btn {
        &:hover {
            svg {
                path {
                    fill: var(--black);
                }
            }
        }
    }
}

.testimonial-block.style-six .list-avatar .bg-img {
    height: 0;

    img {
        height: 0;
    }

    &.active {
        height: calc(100% - 40px);

        img {
            height: 100%;
        }
    }
}

.featured-product.toys-kid .left .bg-img {
    height: 0;
    opacity: 0;
    transition: 0.5s;

    img {
        height: 0;
    }

    &.active {
        height: 100%;
        opacity: 1;

        img {
            height: 100%;
        }
    }
}

.list-testimonial {
    &.dots-mt40 {
        .slick-dots {
            bottom: -60px;

            @media (max-width: 767.98px) {
                bottom: -50px;
            }
        }
    }

    &.list-testimonial-yoga {
        .slick-list {
            margin-left: -16px;
            margin-right: -16px;

            .slick-track {
                display: flex !important;
                cursor: grab;

                .slick-slide {
                    height: inherit !important;
                    padding-left: 16px;
                    padding-right: 16px;

                    >div {
                        height: 100% !important;
                    }
                }
            }
        }

        .slick-dots li {
            transition: all ease 0.5s;

            button {
                border-radius: 50%;
                border: 1px solid transparent;
                padding: 4px;
                transition: all ease 0.5s;
                width: 16px;
                height: 16px;
                position: relative;

                &::before {
                    font-size: 8px;
                    line-height: 16px;
                    width: 8px;
                    height: 8px;
                    opacity: 1;
                    color: transparent;
                    border: 1px solid var(--black);
                    border-radius: 50%;
                    top: 50%;
                    left: 50%;
                    transform: translate(-50%, -50%);
                    transition: all ease 0.5s;
                }
            }

            &.slick-active {
                button {
                    border-color: var(--black);

                    &::before {
                        background-color: var(--black);
                    }
                }
            }
        }
    }
}

.customer-feedbacks {
    .testimonial-item {
        .testimonial-main {
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            background-color: var(--surface);
        }
    }
}