/* GŁÓWNY KONTENER TABLICY - 4-KOLOROWY GRADIENT RGB ESPORT */
.esport-neon-board {
    /* Płynne, ukośne przejście: głęboki niebieski -> krwisty czerwony -> neonowa ciemna zieleń -> ciemne złoto/żółty */
    background: linear-gradient(135deg, #051329 0%, #26050b 33%, #051f0a 66%, #241f04 100%);
    background-size: 100% 100%;
    
    border: 1px solid rgba(255, 255, 255, 0.04);
    border-top: 3px solid #00f0ff; /* Pozostaje neonowy pasek na górze dla odcięcia */
    border-radius: 8px;
    padding: 24px;
    margin: 20px 0;
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.9);
    font-family: 'Segoe UI', sans-serif;
}

/* Tytuł główny */
.esport-neon-board .esport-board-title {
    color: #ffffff;
    font-size: 18px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 4px;
    margin-bottom: 25px;
    text-shadow: 0 0 15px #00f0ff;
}

/* Główny wrapper trzymający sekcje */
.pecet__legenda__wrapper {
    display: flex;
    flex-direction: column;
    gap: 25px;
}

/* Nagłówki sekcji z paskiem po lewej stronie */
.pecet__legenda__section h2 {
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin: 0 0 15px 0;
    padding-left: 12px;
}
.pecet__legenda__administracja > h2 { border-left: 3px solid #ff0055; color: #ff3377; text-shadow: 0 0 8px rgba(255,0,85,0.5); }
.pecet__legenda__forumowe > h2 { border-left: 3px solid #ff9f43; color: #ffb366; text-shadow: 0 0 8px rgba(255,159,67,0.5); }
.pecet__legenda__serwerowe > h2 { border-left: 3px solid #00d2d3; color: #00eeee; text-shadow: 0 0 8px rgba(0,210,211,0.5); }
.pecet__legenda__premium > h2 { border-left: 3px solid #f1c40f; color: #f3d147; text-shadow: 0 0 8px rgba(241,196,15,0.5); }
.pecet__legenda__podstawowe > h2 { border-left: 3px solid #e056fd; color: #be2edd; text-shadow: 0 0 8px rgba(224,86,253,0.5); }

/* Siatka układająca kafelki w poziomie */
.pecet__legenda__groups {
    display: flex;
    flex-wrap: wrap; 
    gap: 12px;       
}

/* Przywrócone kafelki z obraz_3.jpg (delikatne ciemne tło z przezroczystością) */
.badge-item {
    display: inline-flex;
    align-items: center;
    padding: 8px 18px;
    border-radius: 6px;
    background: rgba(5, 7, 12, 0.45); /* Lekko przezroczyste, aby przebijał gradient główny */
    backdrop-filter: blur(4px);        /* Delikatne rozmycie pod kafelkami */
    transition: all 0.2s ease-in-out;
}

/* Układ zawartości kafelka */
.badge-item span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap; 
}

/* Skalowanie ikon i obrazków w kafelkach */
.badge-item img, .badge-item i {
    max-height: 16px;
    width: auto;
    vertical-align: middle;
}

/* Efekt najechania */
.badge-item:hover {
    transform: scale(1.05);
    background: rgba(5, 7, 12, 0.7);
    filter: brightness(1.2);
}

/* ==========================================================================
   NEONOWE RAMKI I BLASKI KAFELKÓW
   ========================================================================== */
.glow-manager { border: 1px solid #ff0000; box-shadow: 0 0 10px rgba(255, 0, 0, 0.4); }
.glow-headadmin { border: 1px solid #00BFA5; box-shadow: 0 0 10px #00BFA5; }
.glow-opiekunsieci { border: 1px solid #99CCFF; box-shadow: 0 0 10px #99CCFF; }
.glow-admin { border: 1px solid #00bfa5; box-shadow: 0 0 10px #00bfa5; }
.glow-jadmin { border: 1px solid #040fe0; box-shadow: 0 0 10px #040fe0; }
.glow-gmod { border: 1px solid Green; box-shadow: 0 0 10px Blue; }
.glow-mod { border: 1px solid #12E807; box-shadow: 0 0 10px #12E807; }

.glow-opred { border: 1px solid #ff6721; box-shadow: 0 0 10px #ff6721; }
.glow-red { border: 1px solid #CC6666; box-shadow: 0 0 10px #CC6666; }
.glow-opgraf { border: 1px solid #00ff3c; box-shadow: 0 0 10px #00ff3c; }
.glow-grafik { border: 1px solid #62d0fb; box-shadow: 0 0 10px #62d0fb; }
.glow-przyjaciel { border: 1px solid #FF5722; box-shadow: 0 0 10px #FF5722; }
.glow-koszarowiec { border: 1px solid #DA680F; box-shadow: 0 0 10px #CD0D01; }
.glow-bywalec { border: 1px solid #808000; box-shadow: 0 0 5px #808000; }
.glow-legenda { border: 1px solid #00B0FF; box-shadow: 0 0 10px #00B0FF; }
.glow-partner { border: 1px solid #FF0000; box-shadow: 0 0 10px #FF0000; }
.glow-promotor { border: 1px solid #8C7853; box-shadow: 0 0 10px #8C7853; }

.glow-tech { border: 1px solid #48D1CC; box-shadow: 0 0 5px #48D1CC; }
.glow-admserw { border: 1px solid #1E90FF; box-shadow: 0 0 10px #1E90FF; }
.glow-wlascserw { border: 1px solid #0068ff; box-shadow: 0 0 10px #0068ff; }
.glow-opserw { border: 1px solid #FF00FF; box-shadow: 0 0 10px #FF00FF; }
.glow-ts3 { border: 1px solid #38b0de; box-shadow: 0 0 5px #38b0de; }
.glow-discord { border: 1px solid #FF0033; box-shadow: 0 0 10px #FF0033; }
.glow-opubt { border: 1px solid #ef4040; box-shadow: 0 0 10px #ef4040; }
.glow-ubt { border: 1px solid #FF9900; box-shadow: 0 0 10px #FF9900; }

.glow-fundator { border: 1px solid #32FF28; box-shadow: 0 0 10px #32FF28; }
.glow-vip { border: 1px solid Yellow; box-shadow: 0 0 10px Yellow; }
.glow-zasluzony { border: 1px solid #ff00ff; box-shadow: 0 0 10px #ff00ff; }
.glow-bejok { border: 1px solid #B5A642; box-shadow: 0 0 10px #B5A642; }
.glow-maniak { border: 1px solid #FFF000; box-shadow: 0 0 10px #FFF000; }
.glow-grzybek { border: 1px solid orange; box-shadow: 0 0 10px orange; }
.glow-ziomal { border: 1px solid #FE7F00; box-shadow: 0 0 5px #FE7F00; }
.glow-klanowicz { border: 1px solid Blue; box-shadow: 0 0 10px Blue; }
.glow-sprzedawczyk { border: 1px solid #0000CC; box-shadow: 0 0 10px #0000CC; }

.glow-kobieta { border: 1px solid #FF00FF; box-shadow: 0 0 8px #FF00FF; }
.glow-urlop { border: 1px solid #8e22c7; box-shadow: 0 0 5px #8e22c7; }
.glow-user { border: 1px solid rgba(255,255,255,0.2); }
.glow-aktywacja { border: 1px solid #98d1d6; box-shadow: 0 0 5px #98d1d6; }
.glow-zmutowany { border: 1px solid rgba(255,255,255,0.1); }
.glow-ban { border: 1px solid #ff0000; box-shadow: 0 0 8px #ff0000; }

/* RWD mobilne - środkowanie na telefonach */
@media (max-width: 768px) {
    .pecet__legenda__groups { justify-content: center; }
}