/**
 * Professional 0-5 Star Rating System with 0.5 Half-Star Precision
 * Fully Accessible (WCAG 2.1 AA compliant, Keyboard Navigation, Large Touch Targets)
 */

.star-rating-control {
    display: inline-flex;
    flex-direction: column;
    gap: 0.5rem;
    padding: 0.5rem 0;
}

.star-rating-group {
    display: inline-flex;
    align-items: center;
    position: relative;
    gap: 0.25rem;
    cursor: pointer;
}

/* Individual Star Unit */
.star-unit {
    position: relative;
    display: inline-block;
    width: 38px;
    height: 38px;
    font-size: 32px;
    line-height: 38px;
    text-align: center;
    color: #CBD5E1; /* Empty star color */
    user-select: none;
    transition: transform 0.1s ease, color 0.15s ease;
}

.star-unit:hover {
    transform: scale(1.15);
}

.star-unit.full {
    color: #F59E0B; /* Amber gold */
}

.star-unit.half {
    color: #CBD5E1;
    position: relative;
}

.star-unit.half::before {
    content: '\2605';
    position: absolute;
    left: 0;
    top: 0;
    width: 50%;
    overflow: hidden;
    color: #F59E0B;
}

/* Numeric Value Badge */
.rating-numeric-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 1.15rem;
    font-weight: 700;
    color: #1E293B;
    background: #FEF3C7;
    border: 1px solid #FCD34D;
    padding: 0.25rem 0.75rem;
    border-radius: 9999px;
    min-width: 70px;
    justify-content: center;
}

.rating-numeric-badge .score-label {
    font-size: 0.75rem;
    text-transform: uppercase;
    color: #92400E;
}

/* Quick Select Buttons (Accessible Alternatives for 60+ users) */
.star-quick-select {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-top: 0.5rem;
}

.star-quick-btn {
    background: #FFFFFF;
    border: 1px solid #CBD5E1;
    border-radius: 6px;
    padding: 0.35rem 0.65rem;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s ease;
    min-width: 40px;
    text-align: center;
}

.star-quick-btn:hover,
.star-quick-btn.active {
    background: #2563EB;
    color: #FFFFFF;
    border-color: #1D4ED8;
}

/* Static Display Component */
.star-rating-display {
    display: inline-flex;
    align-items: center;
    font-size: 1.15rem;
    color: #F59E0B;
}

.star-rating-display .star-empty {
    color: #CBD5E1;
}

.star-rating-display .star-half {
    position: relative;
    color: #CBD5E1;
}

.star-rating-display .star-half::before {
    content: '\2605';
    position: absolute;
    left: 0;
    top: 0;
    width: 50%;
    overflow: hidden;
    color: #F59E0B;
}

.star-rating-display .rating-num {
    font-size: 0.95rem;
    font-weight: 700;
    color: #1E293B;
    margin-left: 0.35rem;
}
