/* ════════════════════════════════════════════════════════════════════════
   Унифицированные стили Дзен-индикаторов (рейтинги, читаемость)
   Используются на всех страницах: partners/, author_public, collegium_public
═════════════════════════════════════════════════════════════════════════ */

/* Базовый стиль для всех Дзен-индикаторов */
.dzen-rank-badge {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    border-radius: 5px;
    padding: 2px 6px;
    cursor: default;
    white-space: nowrap;
    border: 1px solid rgba(100, 116, 139, .2);
    background: rgba(100, 116, 139, .07);
    color: #475569;
    line-height: 1.2;
    transition: opacity .15s ease, transform .15s ease;
}

.dzen-rank-badge:hover {
    opacity: .8;
}

.dzen-rank-badge i {
    font-size: 0.75rem;
    opacity: .9;
}

/* ── Цветовые варианты по месту в рейтинге ── */

/* Топ-1: Золото */
.dzen-rank-badge.dzen-rank-1 {
    background: linear-gradient(135deg, rgba(251, 191, 36, .18), rgba(245, 158, 11, .12));
    border-color: rgba(245, 158, 11, .35);
    color: #92400e;
}

.dzen-rank-badge.dzen-rank-1 i {
    color: #f59e0b;
}

.dzen-rank-badge.dzen-rank-1:hover {
    background: linear-gradient(135deg, rgba(251, 191, 36, .26), rgba(245, 158, 11, .18));
    border-color: rgba(245, 158, 11, .5);
    box-shadow: 0 2px 8px rgba(245, 158, 11, .15);
    opacity: 1;
}

/* Топ-2: Серебро */
.dzen-rank-badge.dzen-rank-2 {
    background: linear-gradient(135deg, rgba(203, 213, 225, .18), rgba(148, 163, 184, .12));
    border-color: rgba(148, 163, 184, .35);
    color: #334155;
}

.dzen-rank-badge.dzen-rank-2 i {
    color: #78716c;
}

.dzen-rank-badge.dzen-rank-2:hover {
    background: linear-gradient(135deg, rgba(203, 213, 225, .26), rgba(148, 163, 184, .18));
    border-color: rgba(148, 163, 184, .5);
    box-shadow: 0 2px 8px rgba(148, 163, 184, .15);
    opacity: 1;
}

/* Топ-3: Бронза */
.dzen-rank-badge.dzen-rank-3 {
    background: linear-gradient(135deg, rgba(217, 119, 6, .14), rgba(180, 83, 9, .10));
    border-color: rgba(180, 83, 9, .3);
    color: #7c2d12;
}

.dzen-rank-badge.dzen-rank-3 i {
    color: #d97706;
}

.dzen-rank-badge.dzen-rank-3:hover {
    background: linear-gradient(135deg, rgba(217, 119, 6, .22), rgba(180, 83, 9, .16));
    border-color: rgba(180, 83, 9, .45);
    box-shadow: 0 2px 8px rgba(217, 119, 6, .12);
    opacity: 1;
}

/* Топ-4: Синий */
.dzen-rank-badge.dzen-rank-4 {
    background: linear-gradient(135deg, rgba(59, 130, 246, .14), rgba(37, 99, 235, .10));
    border-color: rgba(37, 99, 235, .3);
    color: #1e40af;
}

.dzen-rank-badge.dzen-rank-4 i {
    color: #2563eb;
}

.dzen-rank-badge.dzen-rank-4:hover {
    background: linear-gradient(135deg, rgba(59, 130, 246, .22), rgba(37, 99, 235, .16));
    border-color: rgba(37, 99, 235, .45);
    box-shadow: 0 2px 8px rgba(37, 99, 235, .12);
    opacity: 1;
}

/* Топ-5: Изумрудный */
.dzen-rank-badge.dzen-rank-5 {
    background: linear-gradient(135deg, rgba(16, 185, 129, .14), rgba(5, 150, 105, .10));
    border-color: rgba(5, 150, 105, .3);
    color: #065f46;
}

.dzen-rank-badge.dzen-rank-5 i {
    color: #10b981;
}

.dzen-rank-badge.dzen-rank-5:hover {
    background: linear-gradient(135deg, rgba(16, 185, 129, .22), rgba(5, 150, 105, .16));
    border-color: rgba(5, 150, 105, .45);
    box-shadow: 0 2px 8px rgba(16, 185, 129, .12);
    opacity: 1;
}

/* Топ-6-10: Нейтральный стиль */
.dzen-rank-badge.dzen-rank-6,
.dzen-rank-badge.dzen-rank-7,
.dzen-rank-badge.dzen-rank-8,
.dzen-rank-badge.dzen-rank-9,
.dzen-rank-badge.dzen-rank-10 {
    background: rgba(100, 116, 139, .07);
    border-color: rgba(100, 116, 139, .2);
    color: #475569;
}

.dzen-rank-badge.dzen-rank-6:hover,
.dzen-rank-badge.dzen-rank-7:hover,
.dzen-rank-badge.dzen-rank-8:hover,
.dzen-rank-badge.dzen-rank-9:hover,
.dzen-rank-badge.dzen-rank-10:hover {
    background: rgba(100, 116, 139, .12);
    border-color: rgba(100, 116, 139, .35);
    box-shadow: 0 2px 6px rgba(100, 116, 139, .08);
    opacity: 1;
}

/* ──────────────────────────────────────────────────────────────────────────
   Indikator читаемости на Дзен (топ-5 авторов по дочитываемости)
────────────────────────────────────────────────────────────────────────── */

.dzen-readability-badge {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: 0.75rem;
    font-weight: 500;
    color: #475569;
    background: rgba(71, 85, 105, .07);
    border: 1px solid rgba(71, 85, 105, .18);
    border-radius: 4px;
    padding: 1px 6px;
    cursor: default;
    white-space: nowrap;
    transition: opacity .15s ease, transform .15s ease;
}

.dzen-readability-badge:hover {
    background: rgba(71, 85, 105, .12);
    border-color: rgba(71, 85, 105, .28);
    opacity: 1;
}

.dzen-readability-badge i {
    font-size: 0.75rem;
    color: #0284c7;
}

/* ──────────────────────────────────────────────────────────────────────────
   Адаптивность для малых экранов
────────────────────────────────────────────────────────────────────────── */

@media (max-width: 576px) {
    .dzen-rank-badge {
        font-size: 0.7rem;
        padding: 1px 5px;
        gap: 2px;
    }

    .dzen-rank-badge i {
        font-size: 0.65rem;
    }

    .dzen-readability-badge {
        font-size: 0.7rem;
        padding: 0px 5px;
    }

    .dzen-readability-badge i {
        font-size: 0.65rem;
    }
}