/* --- NOWE ETYKIETY (BADGES) --- */
.n24-badge {
    font: normal 800 9px/1 sans-serif !important;
    text-transform: uppercase !important;
    padding: 2px 5px !important;
    border-radius: 3px !important;
    letter-spacing: 0.5px !important;
    display: inline-block !important;
}

/* Nowość - Zielona */
.badge-new {
    background: #00cc66 !important;
    color: #000 !important;
}

/* Hit - Złota/Żółta */
.badge-hit {
    background: #ffcc00 !important;
    color: #000 !important;
}

/* Klasyk - Głęboki błękit */
.badge-classic {
    background: #0066cc !important;
    color: #fff !important;
}

/* Polecamy - Fiolet / Purpura */
.badge-recommend {
    /* Ustawienie płynnego gradientu przechodzącego przez odcienie fioletu, różu i błękitu */
    background: linear-gradient(120deg, #9933ff, #ff007f, #3399ff, #9933ff) !important;
    background-size: 300% 300% !important; /* Rozszerzenie tła, aby ruch był płynny */
    color: #fff !important;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6) !important;
    
    /* Uruchomienie animacji: trwa 4 sekundy, zapętla się w nieskończoność i działa płynnie */
    animation: n24RainbowBadge 4s ease infinite !important;
    
    /* Subtelny efekt świecenia (neon) dopasowany do ciemnego motywu forum */
    box-shadow: 0 0 8px rgba(153, 51, 255, 0.4) !important;
}

/* Reguły odpowiedzialne za ruch gradientu w tle */
@keyframes n24RainbowBadge {
    0% {
        background-position: 0% 50% !important;
    }
    50% {
        background-position: 100% 50% !important;
    }
    100% {
        background-position: 0% 50% !important;
    }
}

/* Brak pliku - Czerwona */
.badge-missing {
    background: #d9534f !important;
    color: #fff !important;
}

/* --- POPRAWIONA IKONKA BRAKU ODCINKA NA KADRZE --- */
.ep-thumb.thumb-missing::after {
    content: "!" !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    
    /* Tworzenie małego narożnika w rogu grafiki */
    width: 0 !important;
    height: 0 !important;
    border-style: solid !important;
    border-width: 0 20px 20px 0 !important;
    border-color: transparent #d9534f transparent transparent !important;
    
    z-index: 10 !important;
}

/* Pozycjonowanie samego białego znaku wykrzyknika wewnątrz narożnika */
.ep-thumb.thumb-missing::before {
    content: "!" !important;
    position: absolute !important;
    top: 1px !important;
    right: 4px !important;
    font: normal 900 10px/1 sans-serif !important;
    color: #ffffff !important;
    z-index: 11 !important;
}

/* --- RESZTA STRUKTURY BEZ ZMIAN --- */
.ep-row {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
    padding: 12px !important;
    background: #1a1a1a !important;
    border-radius: 8px !important;
    margin-bottom: 10px !important;
}
.ep-row-missing {
    border-left: 3px solid #d9534f !important;
    background: #1f1414 !important;
}
.ep-thumb {
    display: block !important;
    width: 90px !important;             
    height: 51px !important;            
    background-size: cover !important;  
    background-position: center !important;
    position: relative !important;     
    overflow: hidden !important;
    flex-shrink: 0 !important;
    border: 1px solid #333 !important;
    border-radius: 4px !important;
}
.ep-thumb .ep-num {
    display: block !important;
    position: absolute !important;
    top: 2px !important;                
    left: 4px !important;
    font: normal 800 10px/1 sans-serif !important; 
    color: #ffffff !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8) !important;
    z-index: 99 !important;
}
.ep-main { flex-grow: 1 !important; }
.ep-title { font-size: 14px !important; font-weight: bold !important; display: flex !important; align-items: center; gap: 6px; flex-wrap: wrap; }
.ep-meta { font-size: 11px !important; color: #aaa !important; margin-top: 4px !important; }
.ep-accordion { display: block !important; margin-top: 6px !important; font-size: 11px !important; }
.ep-accordion-trigger { display: inline-flex !important; align-items: center !important; gap: 5px !important; color: #aaa !important; cursor: pointer !important; font-weight: 600 !important; outline: none !important; list-style: none !important; }
.ep-accordion-trigger::-webkit-details-marker { display: none !important; }
.ep-accordion-trigger::before { content: "▶" !important; font-size: 8px !important; color: #888 !important; display: inline-block !important; transition: transform 0.2s ease !important; }
.ep-accordion[open] .ep-accordion-trigger::before { transform: rotate(90deg) !important; color: #fff !important; }
.ep-accordion-content { padding: 6px 0 2px 0 !important; color: #ccc !important; font-size: 12px !important; line-height: 1.4 !important; }
.ep-media { display: flex !important; gap: 8px !important; flex-shrink: 0 !important; }
.btn-report { background: #444 !important; color: #fff !important; padding: 6px 12px !important; font-size: 11px !important; text-decoration: none !important; border-radius: 4px !important; border: 1px solid #555 !important; }
.btn-report:hover { background: #d9534f !important; border-color: #d43f3a !important; }
.text-muted { color: #888 !important; }
