.review-card {
    background-color: var(--light-tint);
    border-radius: var(--radius-sm);
    display: flex;
    flex-direction: column;
    height: auto;
    gap: var(--item-gap);
}

.review-stars {
    display: flex;
    gap: calc(var(--item-gap) * .19);
    color: var(--medium);
    font-size: var(--text-sm);
}

.review-text {
    margin: 0;
    padding: 0;
    flex-grow: 1;

    p {
        font-size: var(--text-sm);
        color: var(--dark);
        line-height: 1.6;
        margin: 0;
    }
}

.review-name {
    font-weight: 700;
    font-size: var(--text-sm);
    color: var(--dark);
}

.reviews-nav {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--item-gap);
    margin-block-start: var(--header-pad-y);
}

.reviews-btn-prev,
.reviews-btn-next {
    width: calc(var(--item-gap) * 2.06);
    height: calc(var(--item-gap) * 2.06);
    border-radius: 50%;
    border: 2px solid var(--dark);
    background-color: transparent;
    color: var(--dark);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--text-sm);
    transition: background-color var(--trans-fast), color var(--trans-fast);

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

    &:focus-visible {
        outline: var(--focus-ring);
        outline-offset: 2px;
    }

    &:active {
        background-color: var(--dark-dim);
        color: var(--white);
    }

    &.swiper-button-disabled {
        opacity: 0.35;
        cursor: not-allowed;
    }
}

.reviews-nav-hidden .reviews-nav {
    display: none;
}

.reviews-single {
    .swiper-slide {
        width: 100%;
    }

    .review-card {
        text-align: center;
        align-items: center;
        margin-inline: auto;
    }

    .review-stars {
        justify-content: center;
    }

    .review-author {
        text-align: center;
    }
}

.reviews-multi {
    .review-card {
        text-align: left;
    }

    .review-stars {
        order: 3;
        margin-top: calc(var(--item-gap) * -1);
    }

    .review-text {
        order: 1;
    }

    .review-author {
        order: 2;
    }
}