/* Main rating container */
.post-review-container {
	position:relative;
	float:left;
	width:100%;
	margin-bottom:15px;
}
.post-review-container h3 {
    margin-top: 0;
    color: #333;
}
/* Rating items */
.rating-itemwrapper {
	position:relative;
	float:left;
	width:100%;	
}
.rating-itemwrapper {
	position:relative;
	float:left;
	width:100%;	
}
.comment-section > label {
	position:relative;
	float:left;
	width:100%;	
	margin:15px 0;
}
.your-ratingwrapper .rating-itemwrapper {
	margin-bottom:0;
    padding: 0;	
}
.rating-item {
	grid-template-columns: 1fr 1fr;
    width: 100%;
    position: relative;
    float: left;
    display: grid;
    align-items: center;
    gap: 0 20px;
    margin-bottom: 5px;
}
.rating-item:last-child {
    margin-bottom: 0;
}
.comment-meta span.star,
.rating-item span{
	font-size:12px;
	text-transform:uppercase;
	font-weight:600;
}
.rating-item label {
	font-size: 12px;
    text-transform: uppercase;
    font-weight: 600;
}
/* Style for Criteria Ratings */
.criteria-ratings {
    width: 100%;
    position: relative;
    float: left;	
}
.criteria-title {
    width: 100%;
    position: relative;
	margin-bottom:10px;	
    line-height: 22px;
    font-weight: 500;
    font-style: normal;
    font-size: 16px;
	color:#111;
}
.dark .criteria-title {
	color:#fff;
}
.spr-comment-item p,
.your-comment p {
    margin: 0!important;
}
/* Overall Ratings Section */
.overall-rating {
	grid-template-columns: auto 1fr;
    width: 100%;
    position: relative;
    float: left;
    display: grid;
    align-items: center;
    gap: 0 20px;	
    margin-bottom: 20px;
	padding-bottom:20px;
	border-bottom:1px solid#ccc;
}
.dark .overall-rating {
	border-bottom:1px solid#333;
}
.overall-rating.your-rating .rating-value {
    font-size: 24px;
	line-height:1;
    font-weight: 600;
    color: #fff;
    margin-left: 0;	
	padding:15px 10px ;
	background:#000;
}
.dark .overall-rating.your-rating .rating-value {
	border:1px solid#333;	
}
.overall-ratings-section {
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: 30px 50px;
    width: 100%;
    position: relative;
    float: left;
    display: grid;
}
.overall-dummy
.overall-ratingwrapper {
	position:relative;
	float:left;
	width:100%;	
}
.overall-rating.all-readers {
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    width: 100%;
    position: relative;
    float: left;
    display: grid;
    align-items: start;
    gap: 30px 50px;
}
.allrating-wrapper {
	grid-template-columns: auto 1fr;
    width: 100%;
    position: relative;
    float: left;
    display: grid;
    align-items: center;
    gap: 0 20px;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #ccc;
}
.dark .allrating-wrapper {
    border-bottom: 1px solid #333;
}
.latest-comments-section {
	position:relative;
	float:left;
	width:100%;	
}
.spr-latest-comments-list {
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    width: 100%;
    position: relative;
    float: left;
    display: grid;
    align-items: start;
    gap: 30px 50px;
}
.spr-comment-item .comment-meta {
	float:left;
	width:100%;
	display:grid;
	margin-bottom:15px;
    grid-template-columns: auto 1fr;
    gap: 5px 5px;
	align-items:center;
}
.your-ratingwrapper {
	position:relative;
	float:left;
	width:100%;	
	padding-bottom: 30px;
	margin-bottom:30px;	
    border-bottom: 1px solid #ccc;		
}
.dark .your-ratingwrapper {
    border-bottom: 1px solid #333;	
}
.rating.all-readers {
	grid-template-columns: 1fr;
    width: 100%;
    position: relative;
    float: left;
    display: grid;
    align-items: center;
    gap: 5px 10px;	
    border-right: 1px solid #ccc;	
    padding-right: 15px;	
}
.dark .rating.all-readers {
    border-right: 1px solid #333;	
}
.rating-valuewrapper {
    display: flex;
    gap: 5px 10px;
}
.rating.all-readers .rating-value {
    font-size: 28px;
	line-height:1.1;
	font-weight:600;
    color: #fff;
	padding:10px ;
	background:#000;
}
.dark .rating.all-readers .rating-value {
	border:1px solid#333;
}
.dark .total-votes,
.dark .overall-rating.your-rating .rating-value,
.dark .rating-value {
    color: #fff!important;
}
/* Star rating input */
.star-rating {
    display: inline-flex;
    align-items: center;
    flex-direction: row-reverse;
    justify-content: flex-end;
}
.star-rating input {
    display: none;
}
.star-rating label {
    font-size: 16px;
    color: #ccc;
    cursor: pointer;
    padding: 0 2px;
    transition: color 0.2s;
}
.star-rating input:checked ~ label,
.star-rating label:hover,
.star-rating label:hover ~ label {
    color: #ffc107;
}
.star-rating input:checked + label {
    color: #ffc107;
}
/* Display stars */
.stars {
    display: inline-flex;
    align-items: center;
	width:86%;
	float:left;
}
.rating-itemwrapper .stars {
	width:100%;justify-content: flex-end;
}
.star {
    color: #ccc;
    font-size: 18px;
    margin-right: 2px;
    transition: color 0.2s;
}
.dark .star {
    color: #666;
}
.star.filled {
    color: #000;
}
.dark .star.filled {
    color: #fff;
}
.rating-value {
    color: #000;
}
/* Submit button */
.submit-rating {
    background: #111;
    color: #fff;
    border: 1px solid#111;
    padding: 8px 15px;
    cursor: pointer;
    transition: background 0.5s;
}
.submit-rating:hover {
    background: #eee;
    color: #111;	
}
.submit-rating:disabled {
    background: #ccc;
    cursor: not-allowed;
}
/* Messages */
.already-voted {
	position:relative;
	float:left;
	width:100%;	
	padding:15px;
    border: 1px solid #333;	
}
.average-ratings {
    margin-bottom: 20px;
    padding: 10px;
    background: #fff;
    border-radius: 3px;
}
.average-ratings h4 {
    margin-top: 0;
    margin-bottom: 10px;
    color: #333;
}
/* Widget styles */
.top-rated-posts {
    list-style: none;
    padding: 0;
    margin: 0;
}
.top-rated-posts li {
    grid-template-columns: 1fr;
    display: grid;
    align-items: start;
    gap: 10px 20px;	
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid #eee;
}
.top-rated-posts li:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}
.widget-rating {
    font-size: 12px;
}
.widget-rating .star {
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 600;
}
/* Admin column styles */
.fixed .column-total_ratings, 
.fixed .column-rating_ {
    width: 100px;
    text-align: center;
}
/* Hide the original stars */
.star {
    position: relative;
    display: inline-block;
    font-size: 0; /* Hide star characters */
}
/* Create the percentage bar */
.allrating-wrapper .stars::before,
.your-rating .stars::before {
    content: "";
    display: block;
    height: 6px; 
    width: 100%; 
    background: linear-gradient(90deg, #000 var(--rating-percentage), lightgray var(--rating-percentage));
}
.dark .allrating-wrapper .stars::before,
.dark .your-rating .stars::before {
    background: linear-gradient(90deg, #fff var(--rating-percentage), #666 var(--rating-percentage));
}
/* Calculate percentage from data-rating (e.g., 3.5/5 = 70%) */
.all-readers .stars[data-rating="0"] { --rating-percentage: 0%; }
.your-rating .stars[data-rating="0"] { --rating-percentage: 0%; }
.all-readers .stars[data-rating="0.25"] { --rating-percentage: 5%; }
.your-rating .stars[data-rating="0.25"] { --rating-percentage: 5%; }
.all-readers .stars[data-rating="0.5"] { --rating-percentage: 10%; }
.your-rating .stars[data-rating="0.5"] { --rating-percentage: 10%; }
.all-readers .stars[data-rating="0.75"] { --rating-percentage: 15%; }
.your-rating .stars[data-rating="0.75"] { --rating-percentage: 15%; }
.all-readers .stars[data-rating="1"] { --rating-percentage: 20%; }
.your-rating .stars[data-rating="1"] { --rating-percentage: 20%; }
.all-readers .stars[data-rating="1.25"] { --rating-percentage: 25%; }
.your-rating .stars[data-rating="1.25"] { --rating-percentage: 25%; }
.all-readers .stars[data-rating="1.5"] { --rating-percentage: 30%; }
.your-rating .stars[data-rating="1.5"] { --rating-percentage: 30%; }
.all-readers .stars[data-rating="1.75"] { --rating-percentage: 35%; }
.your-rating .stars[data-rating="1.75"] { --rating-percentage: 35%; }
.all-readers .stars[data-rating="2"] { --rating-percentage: 40%; }
.your-rating .stars[data-rating="2"] { --rating-percentage: 40%; }
.all-readers .stars[data-rating="2.25"] { --rating-percentage: 45%; }
.your-rating .stars[data-rating="2.25"] { --rating-percentage: 45%; }
.all-readers .stars[data-rating="2.5"] { --rating-percentage: 50%; }
.your-rating .stars[data-rating="2.5"] { --rating-percentage: 50%; }
.all-readers .stars[data-rating="2.75"] { --rating-percentage: 55%; }
.your-rating .stars[data-rating="2.75"] { --rating-percentage: 55%; }
.all-readers .stars[data-rating="3"] { --rating-percentage: 60%; }
.your-rating .stars[data-rating="3"] { --rating-percentage: 60%; }
.all-readers .stars[data-rating="3.25"] { --rating-percentage: 65%; }
.your-rating .stars[data-rating="3.25"] { --rating-percentage: 65%; }
.all-readers .stars[data-rating="3.5"] { --rating-percentage: 70%; }
.your-rating .stars[data-rating="3.5"] { --rating-percentage: 70%; }
.all-readers .stars[data-rating="3.75"] { --rating-percentage: 75%; }
.your-rating .stars[data-rating="3.75"] { --rating-percentage: 75%; }
.all-readers .stars[data-rating="4"] { --rating-percentage: 80%; }
.your-rating .stars[data-rating="4"] { --rating-percentage: 80%; }
.all-readers .stars[data-rating="4.25"] { --rating-percentage: 85%; }
.your-rating .stars[data-rating="4.25"] { --rating-percentage: 85%; }
.all-readers .stars[data-rating="4.5"] { --rating-percentage: 90%; }
.your-rating .stars[data-rating="4.5"] { --rating-percentage: 90%; }
.all-readers .stars[data-rating="4.75"] { --rating-percentage: 95%; }
.your-rating .stars[data-rating="4.75"] { --rating-percentage: 95%; }
.all-readers .stars[data-rating="5"] { --rating-percentage: 100%; }
.your-rating .stars[data-rating="5"] { --rating-percentage: 100%; }

.dummyrating {
    display: grid;
    align-items: center;	
	position:relative;
	width:100%;
	float:left;
}
.percentage-text {
	position:absolute;
	right: 0; 	
	bottom:2px;
	font-size:16px;
	line-height:1;
}
.dark .percentage-text {
	color: #ddd;
}
/* Review Modules area */
.post-review-stars-only {
    width: 100%;
	float:left;
	position:relative;
}
.post-review-stars-only .rating-value {
	display:none;
}
.stars-container {
	float:left;	
    position: relative;
}
.post-review-stars-only .stars {
	position:relative;	
    font-size: 0;
    height: 10px;
    width: 100px;
    background: #eee;
    overflow: hidden;
}
.post-review-stars-only .stars::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 10px;
    width: var(--fill-percentage, 70%);
    background: #ffc107;
}
.post-review-stars-only span.star {
    display: none; 
}
.percentage-value {
	position:absolute;
	right:0;
	top:-15px;
    color: #333;
    font-size: 11px;
    font-weight: bold;
}
.review-content-toggleable {
    display: none;
    float: left; 
    width: 100%;
    padding: 20px;
    border: 1px solid #000;	
}
.dark .review-content-toggleable {
    border: 1px solid #333;	
}
.review-trigger {
    cursor: pointer;
	width:100%;
	text-align:center;
    display: inline-block;
    padding: 10px 10px;
    border: 1px solid #000;
    margin-bottom: -1px;
	font-size:14px;
	font-weight:500;
	line-height:1;
    float: left;
    clear: both; 
	transition: background-color 0.2s ease;	
}
.active .review-trigger {
	background-color: #000;
    border: 1px solid #000;	
	color:#fff;
}
.review-trigger:hover {
	background-color: #000;
    border: 1px solid #000;	
	color:#fff;
}
.active .review-trigger:hover {
	background-color: #fff;
	color:#000;
}
.dark .review-trigger {
    border-color: #333;
    background-color: #333;
    color: #ccc;
}
.dark .review-trigger:hover {
    border-color: #111;
    background-color: #111;
    color: #ccc;
}
.review-trigger .percentage-value {
    font-weight: bold;
    margin-left: 5px;
}
.post-review-container.active .review-content-toggleable {
    display: block;
}
#review_comment_main {
    float: left; 
    width: 100%;	
}
/* Combined Rating Shortcode Styles */
.spr-combined-rating {
    display: inline-flex;
    align-items: center;
    gap: 8px 4px;
    line-height: 1;
    margin: 5px 0;
    vertical-align: middle;
}
.spr-combined-rating .spr-stars {
    display: inline-flex;
    position: relative;
}
.spr-combined-rating .spr-stars .star {
    display: inline-block;
    font-size: 16px;
    width: 12px;
    height: 12x;
    line-height: 1;
    color: #000; /* Default star color */
    position: relative;
}
/* Filled stars */
.spr-combined-rating .spr-stars .star.filled::before {
    content: "★";
    position: absolute;
    color: #000;
}
.dark .spr-combined-rating .spr-stars .star.filled::before {
    color: #fff;
}
/* Empty stars */
.spr-combined-rating .spr-stars .star:not(.filled)::before {
    content: "★";
    position: absolute;
    color: #cccccc;
}
.dark .spr-combined-rating .spr-stars .star:not(.filled)::before {
    color: #666;
}
.spr-combined-rating .spr-rating-numbers {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    line-height: 1;
}
.spr-combined-rating .spr-rating-value {
    color: #333;
}
.dark .spr-combined-rating .spr-rating-value {
    color: #ccc;
}
.spr-combined-rating .spr-vote-count {
    color: #666;
    font-size: 0.9em;
}
/*PROS CON*/
.pros-cons-section{
    grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr));
    width: 100%;
    position: relative;
    float: left;
    display: grid;
    align-items: start;
    gap: 15px 30px;
}
.vertical .pros-cons-section{
    grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
}
.total-votes {
	font-weight:600;
}
.pros-items, .cons-items {
	display:flex;
	margin-bottom:5px;
	width:100%;
	font-weight:500;
}
.pros-items:before {
    font-family: 'Material Icons Outlined';
	content: "\e5ca";
    color: green;
    margin-right: 5px;
}
.dark .pros-items:before {
    color: #47b017;
}
.cons-items:before {
    font-family: 'Material Icons Outlined';
	content: "\e5cd";
    color: #f00;
    margin-right: 5px;
}

/* Shortcode specific styles */
.spr-pros-cons-display.columns-1 .spr-pros-cons-wrapper {
    display: block;
}

.spr-pros-cons-display.columns-2 .spr-pros-cons-wrapper {
    display: flex;
    gap: 30px;
}

.spr-pros-cons-display.columns-2 .spr-pros-list,
.spr-pros-cons-display.columns-2 .spr-cons-list {
    flex: 1;
}

.spr-pros-cons-title {
    margin-bottom: 15px;
}
/* MODULE */
.module1default-article .allrating-wrapper {
	grid-template-columns: 1fr;
    gap: 10px 0;
    margin-bottom: 0;
    padding-bottom: 0;	
    border-bottom: 0px solid #ccc;		
}
.module1default-article .rating.all-readers {
    grid-template-columns: auto 1fr;	
    border-right: 0px solid #ccc;
}
.module1e-result .overall-rating.all-readers {
    gap: 15px 15px;
	margin-bottom: 0px;
    padding-bottom: 0;
    border-bottom: 0px solid #ccc;	
    align-items: end;	
}
.spr-stars-only {
    display: inline-flex;
    position: relative;
    margin-bottom:5px;	
}
.spr-stars-only .star.filled {
    color: #ffb900;
}
.spr-stars-only .star {
    display: inline-block;
    font-size: 16px;
    width: 12px;
    height: 12x;
    line-height: 1;
    color: #ccc;
    position: relative;
}
.module1e-articlemeta .total-votes,
.percentage-text span{
    line-height: 1;
    font-weight: 600;
	color:#000;
}
.dark .module1e-articlemeta .total-votes,
.dark .percentage-text span{
	color:#ccc;
}


.spr-combined-rating .spr-stars .star {
    display: inline-block;
    font-size: 16px;
    width: 12px;
    height: 12x;
    line-height: 1;
    color: #000;
    position: relative;
}