/* =========================================================
   REVIEW MODAL
========================================================= */

.review-modal {

    border: 0;

    border-radius: 18px;

    overflow: hidden;

}


.review-modal-header {

    padding: 22px 24px;

    border-bottom: 1px solid #edf0f2;

    background:
        linear-gradient(
            135deg,
            rgba(98,157,35,.07),
            rgba(98,157,35,.015)
        );

}


.review-modal-label {

    font-size: 10px;

    font-weight: 700;

    letter-spacing: 1.5px;

    color: #629d23;

}


/* =========================================================
   PRODUCT
========================================================= */

.review-product-card {

    padding: 18px;

    border: 1px solid #edf0f2;

    border-radius: 14px;

    margin-bottom: 15px;

    background: #fff;

}


.review-product-info {

    display: flex;

    align-items: center;

    gap: 14px;

}


.review-product-image {

    width: 62px;

    height: 62px;

    border-radius: 11px;

    object-fit: cover;

    border: 1px solid #edf0f2;

}


.review-product-name {

    font-size: 14px;

    font-weight: 600;

    margin-bottom: 4px;

}


.review-product-meta {

    font-size: 12px;

    color: #8b939b;

}


/* =========================================================
   STAR RATING
========================================================= */

/* =========================================================
   UNIQUE REVIEW RATING
========================================================= */

.review-rating {
    display: inline-flex;
    flex-direction: row-reverse;
    justify-content: flex-end;
    align-items: center;
    gap: 7px;

    margin-top: 16px;
    padding: 8px 10px;
    margin-bottom: 20px;
    background: #f8faf7;

    border: 1px solid #edf1ea;

    border-radius: 14px;

    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.8);
}


/* =========================================================
   HIDE RADIO
========================================================= */

.review-rating input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}


/* =========================================================
   STAR
========================================================= */

.review-rating label {

    width: 38px;
    height: 38px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 11px;

    cursor: pointer;

    color: #cfd5d9;

    background: #ffffff;

    border: 1px solid #e8ecef;

    font-size: 19px;

    transition:
        color .2s ease,
        background .2s ease,
        border-color .2s ease,
        transform .2s ease,
        box-shadow .2s ease;
}


/* =========================================================
   HOVER
========================================================= */

.review-rating label:hover {

    color: #f5b301;

    background: #fff9e7;

    border-color: #f5d477;

    transform: translateY(-4px) rotate(-3deg);

    box-shadow:
        0 7px 16px rgba(245,179,1,.18);

}


.review-rating label:hover ~ label {

    color: #f5b301;

    background: #fff9e7;

    border-color: #f5d477;

}


/* =========================================================
   SELECTED
========================================================= */

.review-rating input:checked ~ label {

    color: #f5b301;
    background: #fff8df;
    border-color: #f2cf65;
    
    box-shadow:
        0 5px 14px rgba(245,179,1,.16);

}


/* =========================================================
   SELECTED STAR
========================================================= */

.review-rating input:checked + label {

    transform: translateY(-3px) scale(1.08);

    box-shadow:
        0 7px 18px rgba(245,179,1,.25);

}


/* =========================================================
   STAR ICON
========================================================= */

.review-rating label i {

    transition:
        transform .2s ease,
        filter .2s ease;
}


.review-rating label:hover i {

    transform: scale(1.15);

}


.review-rating input:checked + label i {

    transform: scale(1.12);
    
    filter:
        drop-shadow(0 2px 3px rgba(245,179,1,.25));

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 575px) {

    .review-rating {

        gap: 5px;

        padding: 7px 8px;

    }

    .review-rating label {

        width: 34px;
        height: 34px;

        font-size: 17px;

    }

}


/* =========================================================
   REVIEW TEXTAREA
========================================================= */

.review-comment {

    width: 100%;

    min-height: 90px;

    resize: vertical;

    border: 1px solid #e2e7eb;

    border-radius: 10px;

    padding: 12px 14px;

    font-size: 13px;

    outline: none;

    transition: .2s ease;

}


.review-comment:focus {

    border-color: #629d23;

    box-shadow:
        0 0 0 3px rgba(98,157,35,.08);

}


/* =========================================================
   REVIEWED
========================================================= */

.review-already-submitted {

    padding: 12px 14px;

    border-radius: 9px;

    background: rgba(98,157,35,.07);

    color: #629d23;

    font-size: 12px;

}

#reviewBTN{
    height: 60px;
    font-size: 20px;
}
#submitReviewButton{
    height: 60px;
    font-size: 20px;
}