/* ============================================
   LA MIDNIGHT — Star Ratings (CSS-only)
   Ersetzt sprite-basierte Sterne durch reines CSS.
   Nutzt CSS Custom Properties aus 00-settings.css.
   ============================================ */

/* --- Basis-Container: 5 Sterne nebeneinander --- */
.star_rating {
    position: relative;
    width: 80px;
    height: 16px;
    overflow: hidden;
    list-style: none;
    margin: 0;
    padding: 0;
    /* Leere Sterne als Hintergrund via Unicode */
    font-size: 0;
    background: none;
    letter-spacing: 0;
}

/* Leere Sterne als Pseudo-Element */
.star_rating::before {
    content: "★★★★★";
    position: absolute;
    top: 0;
    left: 0;
    font-size: 16px;
    line-height: 16px;
    letter-spacing: 0;
    color: var(--border-light, #2a2a2a);
    z-index: 0;
}

/* Zentriert in Tabellen */
td .star_rating {
    margin: auto;
}

.star_rating li {
    display: inline;
}

/* --- Klickbare Sterne (für Bewertung) --- */
.star_rating li a,
.star_rating .current_rating {
    position: absolute;
    top: 0;
    left: 0;
    height: 16px;
    line-height: 16px;
    overflow: hidden;
    text-indent: -9999px;
    border: none;
    outline: none;
    background: none;
}

/* Aktuelle Bewertung: gefüllte Sterne in Accent-Farbe */
.star_rating .current_rating {
    z-index: 1;
    text-indent: 0;
    font-size: 16px;
    letter-spacing: 0;
    color: var(--accent, #ff4422);
}

/* Text ersetzen durch Sterne */
.star_rating .current_rating::after {
    content: "★★★★★";
}

/* --- Hover-Sterne (nicht bewertet) --- */
.star_rating_notrated li a:hover {
    text-indent: 0;
    font-size: 16px;
    letter-spacing: 0;
    color: var(--accent-hover, #ff6644);
    background: none;
}

.star_rating_notrated li a:hover::after {
    content: "★★★★★";
}

/* --- Breiten pro Stern-Anzahl --- */
.star_rating li a.one_star {
    width: 20%;
    z-index: 6;
}

.star_rating li a.two_stars {
    width: 40%;
    z-index: 5;
}

.star_rating li a.three_stars {
    width: 60%;
    z-index: 4;
}

.star_rating li a.four_stars {
    width: 80%;
    z-index: 3;
}

.star_rating li a.five_stars {
    width: 100%;
    z-index: 2;
}

/* --- Erfolgsmeldung nach Bewertung --- */
.star_rating_success,
.success_message {
    color: var(--success, #4ade80);
    font-family: var(--font-mono, 'Space Mono', monospace);
    font-weight: bold;
    font-size: 0.6rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    margin-bottom: var(--space-sm, 0.5rem);
}

/* --- Inline-Rating (z.B. in Thread-Listen) --- */
.inline_rating {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    float: left;
    vertical-align: middle;
    padding-right: var(--space-xs, 0.25rem);
    font-size: 12px;
    color: var(--accent, #ff4422);
    letter-spacing: 0;
    background: none;
}