//  =================
//      Imports
//  =================

@import '../base/color_variables';      // Color Variables
@import '../base/fonticons';            // Fonticons Variables
@import '../base/urls';                 // URLS Variables
@import '../base/utilities_variables';  // Utilities Variables

.review-top-section {
	.r-cards {
		[class*="r-container-"] {
			box-shadow: $shadow-3;
			border-radius: $br-6;
		}
		.r-container-tReview {
			background-color: $color_130;
			color: $white;
			padding: $p-20;
		}
		.r-container-tRating {
			background-color: $color_57;
			color: $white;
			padding: $p-20;
			.rating-stars {
				i {
					color: $color_88;
					font-size: 16px;
				}
			}
		}
		.r-container-ansques {
			background-color: $color_55;
			color: $white;
			padding: $p-20;
		}
		h5 {
			font-weight: 600;
		}
		h1 {
			font-weight: 600;
		}
	}
}
/*
    =========================
        Customer Reviews
    =========================
*/
.customer-review-section {
	h4.review-title {
		color: $color_325;
		border-bottom: $b-width-1 $solid $color_6;
	}
	.review-list {
		.media {
			&:not(:last-child) {
				border-bottom: $b-width-1 $solid $color_6;
			}
			img {
				width: 70px;
				height: 70px;
				border: $solid $b-width-4 $light-gray;
			}
			.media-body {
				div.meta-container {
					span.usr-name {
						font-size: 19px;
						font-weight: 600;
						color: $additional-color-11;
					}
					span.usr-product-name {
						color: $color_57;
						font-size: 16px;
					}
					span.r-meta-time {
						color: $color_6;
						font-size: 17px;
					}
				}
				div.rating-stars {
					i {
						color: $color_88;
						vertical-align: $v-align-middle;
						cursor: pointer;
					}
					span.r-meta-time {
						font-size: 14px;
						color: $additional-color-3;
					}
				}
				p {
					margin-bottom: 0.625rem;
					margin-top: $m-30;
					color: $color_2;
				}
			}
			.icon {
				.dropdown {
					i[data-toggle="dropdown"] {
						font-size: 18px;
						color: $color_53;
						vertical-align: sub;
						cursor: pointer;
						margin-left: -6px;
					}
					.dropdown-menu {
						min-width: 12rem;
						border-radius: 6px;
						border-color: $light-gray-3;
						a.dropdown-item {
							&:active {
								background-color: $color_none;
							}
						}
						a.dropdown-item.active {
							background-color: $color_none;
						}
					}
				}
			}
		}
	}
	ul.pagination {
		li {
			a {
				&:hover {
					&:not(.active) {
						background-color: $secondary;
					}
				}
			}
		}
	}
}