.al-c{
    align-items: center;
}
.jc-sp-bt{
    justify-content: space-between;
}
.al-fs{
    align-items: flex-start;
}
.fd-c{
    flex-direction: column;
}

.comment-review{
    display: flex;
    column-gap: 10px;
    justify-content: space-between;
}
.rating-wrapper{
    display: flex;
    flex-wrap: wrap;
    column-gap: 20px;
    row-gap: 10px;
    margin-top: 20px;
    justify-content: space-between;
}
.rating-container {
    display: inline-flex;
    gap: 2px;
}
.rating-comment{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 0 0 30px 0;

    row-gap: 10px;
}

.rating-star {
    display: inline-block;
    cursor: pointer;
    color: #FF3A59;
}

.rating-container.custom-rating-comment{
    flex-direction: row-reverse;
}
.rating-container.custom-rating-comment label{
    position: relative;
}
.rating-container.custom-rating-comment input{
    display: none;
}
.comment-respond .rating-container > input + label {
    display:block;
    transition: background-color 0.3s ease;
}
.rating-container.custom-rating-comment > input + label:nth-last-child(1){
    display:none;
}

.rating-container > input + label {
    /* only enough room for the star */
    font-family: 'dashicons';
    display: inline-block;
    overflow: hidden;
    text-indent: 9999px;
    width: 1.5em;
    white-space: nowrap;
    cursor: pointer;
    margin: 0;

}
.rating-container > label.approved:before {
    display: inline-block;
    text-indent: -9999px;
    content: "";
    background-image: url("/wp-content/themes/financeraters/images/star.svg");
    background-repeat: no-repeat;
    background-size: 23px;
    position: absolute;
    left: 0;
    top: 0;
    width: 25px;
    height: 25px;
}
.rating-container > input + label:before{
    display: inline-block;
    text-indent: -9999px;
    content: "";
    background-image: url("/wp-content/themes/financeraters/images/star.svg");
    background-repeat: no-repeat;
    background-size: 23px;
    position: absolute;
    left: 0;
    top: 0;
    width: 25px;
    height: 25px;
}
.empty-star:before{
    display: inline-block;
    text-indent: -9999px;
    content: "";
    background-image: url("/wp-content/themes/financeraters/images/star.svg");
    background-repeat: no-repeat;
    background-size: 23px;
    width: 25px;
    height: 25px;
}
.rating-container > input:checked ~ label:before,
.rating-container > input + label:hover ~ label:before,
.rating-container > input + label:hover:before,
.filled-star{
    content: "";
    background-image: url("/wp-content/themes/financeraters/images/star-filled.svg");
    background-repeat: no-repeat;
    background-size: 23px;
    width: 25px;
    height: 25px;
    display: inline-block;
}
.rating-stars:nth-child(1),
.comment-author-rating:nth-child(1){
    width: 100%
}

.rating-wrapper{
    display: grid;
}
.comment-author-rating:nth-child(1){
    grid-column-start: 1;
    grid-column-end: 3;
}
.comment-author-rating:nth-child(2){
    grid-column-start: 1;
    grid-column-end: 2;
    grid-row-start: 2;
    grid-row-end: 3;
}
.comment-author-rating:nth-child(3){
    grid-column-start: 2;
    grid-column-end: 3;
    grid-row-start: 2;
    grid-row-end: 3;
}
.comment-author-rating:nth-child(4){
    grid-column-start: 1;
    grid-column-end: 2;
    grid-row-start: 3;
    grid-row-end: 4;
}
.comment-author-rating:nth-child(5){
    grid-column-start: 2;
    grid-column-end: 3;
    grid-row-start: 3;
    grid-row-end: 4;
} 



    .rating-stars:nth-child(1) .rating-container.custom-rating-comment >input+label:nth-last-child(1){
        display:inline-block;
    }
    .rating-stars:nth-child(1) .rating-container.custom-rating-comment >input+label {
        text-indent: inherit !important;
    }
    .rating-stars:nth-child(1) .rating-container.custom-rating-comment >input+label:before{
        display:none !important;
    }
    .rating-stars:nth-child(1) .rating-container.custom-rating-comment >input+label:nth-last-child(1) {
        display: inline-block !important;
    }

.custom-rating-comment-first label:hover, .custom-rating-comment-first .active + label {
    color: #020674;
}

@media (max-width: 1280px){
    .space-comments-list-item-author.d-flex {
        flex-direction: column;
        align-items: flex-start;
    }
}
@media (max-width: 1023px){
    .space-comments-list-item-author.d-flex {
        margin-top: 40px;
        flex-direction: column !important;
        align-items: flex-start!important;
    }
    .rating-comment{
        flex-direction: column;
    }
    .comment-review{
        flex-direction: column !important;
    }
    .rating-wrapper {
        display: flex !important; 
   }
}
@media (max-width: 600px){
    .comment-author-rating {
        width: 46%;
    }
}

@media (max-width: 468px){
    .comment-author-rating{
        width: 100% !important; 
    }
}