/* ==========================================================================
   СЕЗОННЫЕ НАГРАДЫ: градация никнеймов, плашки, полка медалей
   Путь: css/season_awards.css
   ==========================================================================
   Ники топ-5 красятся градиентом ПО ТЕКСТУ (background-clip: text), а не
   заливкой фона: заливка превратила бы ник в цветной прямоугольник и
   разъехалась бы по строкам в ленте.

   Из-за -webkit-text-fill-color: transparent обычный text-shadow под таким
   ником не рисуется — тень легла бы под прозрачную заливку и была бы не
   видна. Поэтому свечение делает filter: drop-shadow, он работает по
   реальным контурам букв.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. НИКНЕЙМЫ ПО МЕСТАМ В СЕЗОНЕ
   Классы вешаются на элемент, внутри которого ТОЛЬКО имя. Свойство
   -webkit-text-fill-color наследуется, поэтому если положить класс на
   контейнер вместе с плашкой и бейджем рейтинга — они тоже станут
   прозрачными.
   -------------------------------------------------------------------------- */
.nick-season-1st,
.nick-season-2nd,
.nick-season-3rd,
.nick-season-top5 {
    font-weight: bold;
    background-repeat: no-repeat;
    background-size: 300% 100%;
    background-position: 50% 0;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    /* Чтобы длинный ник не рвал градиент по переносу строки. */
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    text-decoration: none;
}

/* Вложенные элементы (плашка, бейдж рейтинга, точка онлайна) не должны
   унаследовать прозрачную заливку, если однажды попадут внутрь. */
.nick-season-1st > *,
.nick-season-2nd > *,
.nick-season-3rd > *,
.nick-season-top5 > * {
    -webkit-text-fill-color: initial;
    color: initial;
}

/* --- 1 место: золото с бегущим бликом --- */
.nick-season-1st {
    background-image: linear-gradient(100deg,
        #7a5200 0%, #b8860b 12%, #f0c44a 26%, #fff6c9 38%,
        #ffffff 43%, #fff6c9 48%, #f0c44a 60%, #b8860b 78%, #7a5200 100%);
    filter: drop-shadow(0 0 3px rgba(255, 200, 60, 0.55));
    animation: season-nick-sheen 5.5s linear infinite;
}

/* --- 2 место: платина --- */
.nick-season-2nd {
    background-image: linear-gradient(100deg,
        #5c646b 0%, #9aa5ad 18%, #e8eef3 34%, #ffffff 43%,
        #e8eef3 52%, #9aa5ad 72%, #5c646b 100%);
    filter: drop-shadow(0 0 3px rgba(200, 225, 255, 0.6));
    animation: season-nick-sheen 6.5s linear infinite;
}

/* --- 3 место: бронза --- */
.nick-season-3rd {
    background-image: linear-gradient(100deg,
        #5c2c0c 0%, #8d5220 16%, #c17f3c 30%, #eab77a 40%,
        #ffe0bd 45%, #c17f3c 62%, #8d5220 80%, #5c2c0c 100%);
    filter: drop-shadow(0 0 2px rgba(214, 140, 70, 0.5));
    animation: season-nick-sheen 7.5s linear infinite;
}

/* --- 4-5 места: голография --- */
.nick-season-top5 {
    background-image: linear-gradient(100deg,
        #ff3ea5 0%, #b14dff 18%, #3ea0ff 34%, #2ff2c8 50%,
        #b6ff3e 66%, #ffd23e 82%, #ff3ea5 100%);
    filter: drop-shadow(0 0 3px rgba(120, 200, 255, 0.55));
    animation: season-nick-holo 4.5s linear infinite;
}

@keyframes season-nick-sheen {
    0%   { background-position: 150% 0; }
    100% { background-position: -50% 0; }
}

@keyframes season-nick-holo {
    0%   { background-position: 0% 0; }
    100% { background-position: 200% 0; }
}

/* Старые движки без background-clip: text показали бы прозрачный (то есть
   невидимый) ник. Возвращаем им плоский цвет. */
@supports not ((-webkit-background-clip: text) or (background-clip: text)) {
    .nick-season-1st,
    .nick-season-2nd,
    .nick-season-3rd,
    .nick-season-top5 {
        background-image: none;
        -webkit-text-fill-color: currentColor;
        filter: none;
        animation: none;
    }
    .nick-season-1st  { color: #b8860b; }
    .nick-season-2nd  { color: #6f7a84; }
    .nick-season-3rd  { color: #8d5220; }
    .nick-season-top5 { color: #8a2be2; }
}

/* --------------------------------------------------------------------------
   2. НАГРАДНЫЕ ПЛАШКИ (рядом с ником в шапке профиля)
   -------------------------------------------------------------------------- */
.season-badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    vertical-align: middle;
    margin-left: 8px;
    padding: 2px 8px;
    font-family: Tahoma, "MS Sans Serif", sans-serif;
    font-size: 11px;
    font-weight: bold;
    letter-spacing: 0.3px;
    white-space: nowrap;
    cursor: help;
    position: relative;
    overflow: hidden;
    border-radius: 0 !important;
    box-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35);
}

.season-badge-icon { font-size: 12px; line-height: 1; }

.season-badge-gold {
    color: #4a3000;
    background: linear-gradient(to bottom, #fff3b0 0%, #ffd24a 45%, #e8a70f 55%, #b87d05 100%);
    border: 1px solid #8b5a00;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}

.season-badge-silver {
    color: #2f3a42;
    background: linear-gradient(to bottom, #ffffff 0%, #dfe6ec 45%, #b6c1ca 55%, #8b969f 100%);
    border: 1px solid #6d7880;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);
}

.season-badge-bronze {
    color: #ffffff;
    background: linear-gradient(to bottom, #e0a06a 0%, #c07a37 45%, #9c5a22 55%, #75400f 100%);
    border: 1px solid #5c3410;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
}

/* Топ-10 — родной Luna-градиент заголовка окна XP. */
.season-badge-top10 {
    color: #ffffff;
    background: linear-gradient(to bottom, #538ef2 0%, #245edb 40%, #0e44b8 100%);
    border: 1px solid #003db3;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.45);
}

/* Финалисты — серый Win32, как неактивная кнопка панели задач. */
.season-badge-finalist {
    color: #2a2a2a;
    background: linear-gradient(to bottom, #fdfdfd 0%, #ece9d8 45%, #d4d0c8 55%, #b9b4a6 100%);
    border: 1px solid #8b8676;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);
}

/* Блик пробегает только по трём призовым плашкам: на серой он выглядел бы
   как артефакт отрисовки. */
.season-badge-gold::after,
.season-badge-silver::after,
.season-badge-bronze::after {
    content: "";
    position: absolute;
    top: 0;
    left: -150%;
    width: 45%;
    height: 100%;
    background: linear-gradient(to right,
        rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.55) 50%, rgba(255, 255, 255, 0) 100%);
    transform: skewX(-25deg);
    animation: season-badge-shine 5s infinite;
    pointer-events: none;
}

.season-badge-silver::after { animation-delay: 1.2s; }
.season-badge-bronze::after { animation-delay: 2.4s; }

@keyframes season-badge-shine {
    0%   { left: -150%; }
    18%  { left: 220%; }
    100% { left: 220%; }
}

/* --------------------------------------------------------------------------
   3. ПОЛКА МЕДАЛЕЙ (в .profile-details, под статусом)
   Вдавленная панель Win32: сама полка утоплена, слоты выпуклые.
   -------------------------------------------------------------------------- */
.season-medals {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
    margin: 7px 0 4px;
    padding: 4px 5px;
    background: #f1efe7;
    border: 1px inset #d4d0c8;
    border-radius: 0 !important;
}

.season-medal {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    font-size: 14px;
    line-height: 1;
    cursor: help;
    background: linear-gradient(to bottom, #ffffff 0%, #e6e3d6 100%);
    border: 1px solid;
    border-color: #ffffff #9b9687 #9b9687 #ffffff;   /* выпуклость Win32 */
    border-radius: 0 !important;
    transition: transform 0.12s ease-out;
}

.season-medal:hover {
    transform: scale(1.15);
    z-index: 2;
    /* При наведении слот «вдавливается»: инверсия граней — тот же приём,
       что у кнопок панели инструментов IE6. */
    border-color: #9b9687 #ffffff #ffffff #9b9687;
    background: linear-gradient(to bottom, #e6e3d6 0%, #ffffff 100%);
}

/* Глобальное правило img { height: auto !important } схлопнуло бы иконку-
   картинку, поэтому размеры здесь тоже с !important. */
.season-medal img {
    width: 16px !important;
    height: 16px !important;
    max-height: 16px !important;
    object-fit: contain !important;
    display: block;
}

/* --------------------------------------------------------------------------
   4. МЕСТО В ТАБЛИЦЕ ЛИДЕРОВ
   -------------------------------------------------------------------------- */
.leaderboard-season-mark {
    margin-left: 6px;
    font-size: 10px;
    color: #7a6a3a;
    white-space: nowrap;
}

/* --------------------------------------------------------------------------
   5. МОБИЛЬНАЯ РАСКЛАДКА
   -------------------------------------------------------------------------- */
@media screen and (max-width: 768px) {
    .season-badge {
        margin-left: 5px;
        padding: 2px 6px;
        font-size: 10px;
    }

    /* Палец в 24 пиксела не попадает, а тултип по наведению на телефоне и
       так не работает — увеличиваем слот до нажимаемого размера. */
    .season-medal {
        width: 32px;
        height: 32px;
        font-size: 17px;
    }

    .season-medal img {
        width: 20px !important;
        height: 20px !important;
        max-height: 20px !important;
    }

    .season-medals { gap: 5px; }
}

/* --------------------------------------------------------------------------
   6. ДОСТУПНОСТЬ
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
    .nick-season-1st,
    .nick-season-2nd,
    .nick-season-3rd,
    .nick-season-top5 {
        animation: none !important;
        background-position: 50% 0 !important;
    }

    .season-badge-gold::after,
    .season-badge-silver::after,
    .season-badge-bronze::after {
        animation: none !important;
        display: none;
    }

    .season-medal { transition: none !important; }
}