/* --- POPUP CSS --- */
    #popup-container {
        display: none; position: fixed; z-index: 1000; left: 0; top: 0; width: 100%; height: 100%;
        display: flex; align-items: center; justify-content: center;
    }
    .popup-overlay {
        position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.7);
    }
    .popup-content-box {
        background-color: #fff; padding: 25px; border-radius: 8px; position: relative; z-index: 1001; text-align: left; box-shadow: 0 4px 20px rgba(0,0,0,0.2);
        width: 90%; max-height: 90vh; overflow-y: auto;
    }
    .close-btn {
        position: absolute; top: 15px; right: 20px; color: #aaa; font-size: 30px; font-weight: bold; cursor: pointer; line-height: 1;
    }
    .close-btn:hover { color: #333; }
    @media (min-width: 768px) { .popup-content-box { width: 600px; } }

    /* --- TESTIMONIAL CSS --- */
    .testimonial-list { list-style: none; padding: 0; margin-top: 20px;}
    .testimonial-list li {
        margin-bottom: 20px; padding-bottom: 20px; border-bottom: 1px solid #eee; font-size: 0.95em; color: #555;
    }
    .testimonial-text { font-style: italic; display: block; margin-bottom: 8px; }
    .testimonial-author { display: block; color: #0056b3; font-weight: bold; margin-left: 0; text-align: left; font-style: normal;}
    .rating-number { float: left; font-weight: bold; color: #333; margin-right: 10px; }

    /* --- NEW DECIMAL STAR CSS --- */
    /* The container holding the layers */
    .stars-outer {
        display: inline-block;
        position: relative;
        font-size: 1.4em; /* Adjust star size here */
        color: #ccc; /* Gray background stars */
        font-family: "Times New Roman", serif; /* Serif fonts often have better star icons */
        line-height: 1;
    }
    /* The inner container holding the gold stars, which gets its width clipped */
    .stars-inner {
        position: absolute;
        top: 0;
        left: 0;
        white-space: nowrap;
        overflow: hidden;
        width: 0%; /* JS will set this width */
        color: #FFD700; /* Gold foreground stars */
    }
    /* Using CSS pseudo-elements to draw the stars so we don't need 5 span tags */
    .stars-outer::before { content: "★★★★★"; }
    .stars-inner::before { content: "★★★★★"; }