/* Satisfaction Badge Styles */
.satisfaction-badge {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    padding: 0.8rem 1.5rem;
    border-radius: 16px;
    margin: 1rem 0 1.5rem 0;
    backdrop-filter: blur(5px);
    transition: transform 0.3s ease;
}

.satisfaction-badge:hover {
    transform: scale(1.05);
    background: rgba(255, 255, 255, 0.08);
}

.stars {
    color: #fbbf24;
    /* Amber-400 equivalent for gold stars */
    font-size: 1.5rem;
    letter-spacing: 2px;
    margin-bottom: 0.25rem;
    text-shadow: 0 0 10px rgba(251, 191, 36, 0.5);
    /* Create the 4.9 effect by clipping the last star slightly if desired, 
     but simpler approach with font characters is often clearer. 
     Here we use a gradient clip to make the last star partially filled */
    background: linear-gradient(90deg, #fbbf24 98%, #4b5563 98%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}

.rating-text {
    font-size: 0.9rem;
    color: var(--text-secondary);
    font-weight: 500;
}

.score {
    font-size: 1.1rem;
    font-weight: 700;
    color: #fff;
}