.rating-container .stars {
display: inline-block;
font-size: 45px;
cursor: pointer;
}
.rating-container .star {
color: #ccc;
transition: color 0.2s;
position: relative;
display: inline-block;
width: 32px;
height: 32px;
line-height: 24px;
text-align: center;
}
.rating-container .star:hover,
.rating-container .star.active {
color: #f5c518;
}
.star-number {
position: absolute;
top: 55%;
left: 50%;
transform: translate(-50%, -50%);
font-size: 16px;
color: #333;
font-weight: bold;
}
.star:hover .star-number,
.star.active .star-number {
color: #fff;
}
.update-message {
display: none;
color: #427642;
}
.update-message.show {
display: block;
}
.avg-rating{
color: #c79f10;
font-weight: 600;
}
.rating-info {
margin-top: 10px;
font-size: 16px;
}
.rating-prompt {
margin-top: 10px;
font-size: 16px;
font-weight: bold;
}
.star svg {
width: 100%;
height: 100%;
fill: currentColor;
}
.star:hover,
.star.active {
color: #f5c518;
}
.star:hover .star-overlay,
.star.active .star-overlay {
fill: #ffcc00; }
.star:hover .star-number,
.star.active .star-number {
color: #fff;
}.pcs-switcher {
transform: translateY(0%);
font-size: 15px;
cursor: pointer;
z-index: 9999;
user-select: none;
overflow: visible;
transition: box-shadow 0.3s ease;
}
.fa-coins:before {
color: #fff;
}
.pcs-current-currency {
font-weight: 600;
color: #fff;
text-align: center;
}
.pcs-currency-list {
position: absolute;
top: 100%;
left: 0;
right: 0;
border-radius: 0 0 8px 8px;
list-style: none;
margin: 0;
background: #fff;
max-height: 200px;
overflow-y: auto;
opacity: 0;
visibility: hidden;
transform: translateY(10px);
transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s;
z-index: 10000;
width: 200px;
}
.pcs-switcher:hover .pcs-currency-list,
.pcs-switcher.active .pcs-currency-list {
opacity: 1;
visibility: visible;
transform: translateY(0);
}
.pcs-currency-item {
padding: 10px 25px;
color: #555;
transition: background-color 0.2s, color 0.2s;
}
.pcs-currency-item:hover {
background-color: #f0f8ff;
color: #0073e6;
}
.pcs-currency-item.active {
font-weight: 700;
background-color: #0073e6;
color: #fff;
pointer-events: none;
}
.pcs-toast {
position: fixed;
top: 10%;
left: 50%;
transform: translateX(-50%);
background: rgb(255 255 255);
color: #000;
padding: 20px; font-size: 18px;
border-radius: 5px;
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
z-index: 11000;
width: 50%;
text-align: center;
border: 5px solid #d5d99e;
opacity: 0; visibility: hidden; transform: translateX(-50%) translateY(20px); transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s ease;
pointer-events: none;
}
.pcs-toast.show {
opacity: 1;
visibility: visible;
transform: translateX(-50%) translateY(0); }
@media (max-width: 768px) {
.pcs-switcher {
transform: none;
font-size: 12px;
margin-top: 10px;
}
.pcs-currency-list {
right: 0;
width: 170px;
left: auto;
}
.pcs-toast {
top: 10%; 
width: 80%; font-size: 14px; padding: 10px 15px; }
}