/* ==== 
 --------- (5.07) testimonial styles start ---------
 ==== */

.testimonial {
    direction: ltr;

    .testimonial__inner {
        position: relative;
        overflow-x: clip;
        direction: ltr;

        &::before {
            content: '';
            position: absolute;
            inset-block: 0px;
            inset-inline-start: 0px;
            width: 50%;
            height: 100%;
            background: linear-gradient(90deg, #060606 0%, #060606 25.77%, rgba(6, 6, 6, 0.94) 43.87%, rgba(6, 6, 6, 0.00) 87.29%);
            z-index: 2;
        }

        &::after {
            content: '';
            position: absolute;
            inset-block: 0px;
            inset-inline-end: 0px;
            width: 50%;
            height: 100%;
            background: linear-gradient(-90deg, #060606 0%, #060606 25.77%, rgba(6, 6, 6, 0.94) 43.87%, rgba(6, 6, 6, 0.00) 87.29%);
            z-index: 2;
        }
    }

    .swiper-wrapper {
        transition-timing-function: linear !important;
    }

    .swiper-slide {
        width: auto;
    }

    .section__header {
        p {
            max-width: 750px;
        }
    }

    .testimonial__single {
        padding: 40px 20px;
        background-color: var(--quaternary-color);
        border-radius: 12px;
        flex: 0 0 auto;
        width: auto;
        max-width: 300px;
    }

    .testimonial__intro {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        flex-wrap: wrap;

        img {
            width: 40px;
            height: 30px;
            opacity: 0.1;
        }
    }

    .ratings {
        display: flex;
        align-items: center;
        gap: 4px;

        i {
            font-size: 20px;
            color: var(--octonary-color);
        }
    }

    .testimonial__author {
        display: flex;
        align-items: center;
        gap: 16px;
        flex-wrap: wrap;

        img {
            width: 50px;
            height: 50px;
            min-width: 50px;
            border-radius: 50%;
        }
    }

    .testimonial__slider-rtl {
        .testimonial__single {
            direction: ltr;
        }
    }
}

// testimonial section two styles
.testimonial-two {
    position: relative;
    z-index: 1;
    overflow-x: clip;

    .testimonial__single-wrapper {
        flex: 0 0 auto;
        width: auto;
        max-width: 300px;

        &:hover {
            .testimonial__single {
                background-color: var(--secondary-color);

                p {
                    color: var(--white);
                }

                .ratings {
                    i {
                        color: var(--white);
                    }
                }

                .testimonial__intro {
                    img {
                        opacity: 1;
                    }
                }
            }
        }
    }

    .testimonial__single {
        padding: 40px 20px;
        background-color: var(--quaternary-color);
        border-radius: 12px;
        transition: var(--transition);

        p {
            transition: var(--transition);
        }
    }

    .swiper-slide {
        width: auto;
    }

    .testimonial__intro {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        flex-wrap: wrap;

        img {
            width: 40px;
            height: 30px;
            opacity: 0.1;
            transition: var(--transition);
        }
    }

    .ratings {
        display: flex;
        align-items: center;
        gap: 4px;

        i {
            font-size: 20px;
            color: var(--octonary-color);
            transition: var(--transition);
        }
    }

    .testimonial__author {
        display: flex;
        align-items: center;
        gap: 16px;
        flex-wrap: wrap;

        img {
            width: 50px;
            height: 50px;
            min-width: 50px;
            border-radius: 50%;
        }
    }

    .swiper-slide-active {
        .testimonial__single {
            background-color: var(--secondary-color);

            p {
                color: var(--white);
            }

            .ratings {
                i {
                    color: var(--white);
                }
            }

            .testimonial__intro {
                img {
                    opacity: 1;
                }
            }
        }
    }
}

// testimonial four section styles
.testimonial-four {
    padding-top: 320px;
    position: relative;
    z-index: 1;
    overflow: hidden;

    .bg-img {
        position: absolute;
        inset: 0px;
        width: 100%;
        height: 100%;
        z-index: -1;

        img {
            width: 100%;
            height: 100%;
        }
    }

    .parallax-image-wrap,
    .parallax-image-inner {
        width: 100%;
        height: 100%;
    }

    .testimonial-four__wrapper {
        padding: 80px 20px 95px 20px;
        background-color: var(--quaternary-color);
        max-width: 540px;
        position: relative;
    }

    .testimonial__intro {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        opacity: 0;
        transform: scaleY(0);
        transform-origin: top;
        transition: all 1000ms ease;
    }

    .quote {

        img {
            width: 40px;
            height: 30px;
            opacity: 0.1;

        }
    }

    .ratings {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        gap: 4px;
        opacity: 0;
        transform: scaleY(0);
        transform-origin: top;
        transition: all 1000ms ease;

        i {
            font-size: 20px;
            color: var(--octonary-color);
            transition: var(--transition);
        }
    }

    .testimonial__author {
        display: flex;
        align-items: center;
        gap: 16px;
        flex-wrap: wrap;

        img {
            width: 50px;
            height: 50px;
            min-width: 50px;
            border-radius: 50%;
        }
    }

    .testimonial__content {
        padding-bottom: 80px;
        opacity: 0;
        transform: scaleY(0);
        transform-origin: top;
        transition: all 1000ms ease;
    }

    .slider-navigation {
        display: flex;
        align-items: center;
        gap: 2px;
        position: absolute;
        inset-inline-start: 20px;
        inset-block-end: 80px;
        z-index: 1;
    }

    .slider-btn {
        width: 50px;
        height: 50px;
        min-width: 50px;
        background-color: var(--template-color);
        color: var(--template-bg);
        font-size: 24px;
        display: inline-flex;
        align-items: center;
        justify-content: center;

        &:hover {
            background-color: var(--secondary-color);
            color: var(--white);
        }
    }

    .swiper-slide-active {

        .testimonial__content,
        .testimonial__intro,
        .ratings {
            opacity: 1;
            transform: scaleY(1);
            transition-delay: 800ms;
        }

        .testimonial__content {
            transition-delay: 1300ms;
        }

        .ratings {
            transition-delay: 1800ms;
        }
    }
}

/* ==== 
 --------- (5.07) testimonial styles end ---------
 ==== */