/* =========================================================
   ARMUS - Ranking clásico vivo
   Estilo MU clásico / negro-rojo / alto contraste
   ========================================================= */

.armus-classic-rankings {
    color: #eee;
}

.armus-classic-rankings .section-title {
    margin-bottom: 22px;
}

.armus-classic-rankings .section-title h2 {
    color: #fff;
    text-shadow: 0 2px 8px rgba(0,0,0,.75);
}

.armus-classic-rankings .section-title p {
    color: #c5c5c5;
}

/* CONTENEDOR PRINCIPAL */
.armus-classic-box {
    max-width: 1080px;
    margin: 0 auto;
    padding: 20px;
    background:
        linear-gradient(180deg, rgba(20,20,20,.98), rgba(8,8,8,.98));
    border: 1px solid #5c2023;
    border-top: 2px solid #9e2228;
    border-radius: 6px;
    box-shadow:
        0 14px 34px rgba(0,0,0,.55),
        inset 0 1px 0 rgba(255,255,255,.03);
}

/* TABS */
.armus-classic-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding-bottom: 16px;
}

.armus-classic-tab {
    min-width: 118px;
    padding: 11px 16px;
    border: 1px solid #54282a;
    border-radius: 5px;
    background: linear-gradient(180deg, #303030 0%, #171717 100%);
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.06),
        0 2px 4px rgba(0,0,0,.25);
    color: #e8e8e8;
    font-size: 13px;
    font-weight: 700;
    text-shadow: 0 1px 1px #000;
    cursor: pointer;
    transition: all .16s ease;
}

.armus-classic-tab:hover {
    color: #fff;
    border-color: #b92a30;
    background: linear-gradient(180deg, #3b2425, #1c1414);
}

.armus-classic-tab.active {
    color: #fff;
    border-color: #f04a50;
    background: linear-gradient(180deg, #b21e25 0%, #6e0d12 100%);
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.16),
        0 0 12px rgba(204,27,34,.22);
}

.armus-classic-separator {
    height: 1px;
    margin-bottom: 18px;
    background: linear-gradient(
        90deg,
        transparent,
        #8e2429 12%,
        #8e2429 88%,
        transparent
    );
}

/* FILTROS */
.armus-classic-tools {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    margin-bottom: 18px;
    color: #e7e7e7;
    font-size: 14px;
}

.armus-classic-show,
.armus-classic-search {
    display: flex;
    align-items: center;
    gap: 8px;
}

.armus-classic-tools label {
    color: #f0f0f0;
    font-weight: 500;
}

.armus-classic-tools select,
.armus-classic-tools input {
    height: 40px;
    color: #f5f5f5;
    background: #171717;
    border: 1px solid #5b5b5b;
    border-radius: 4px;
    outline: none;
    box-shadow: inset 0 1px 4px rgba(0,0,0,.35);
}

.armus-classic-tools select {
    padding: 0 32px 0 12px;
}

.armus-classic-tools input {
    width: 280px;
    padding: 0 13px;
}

.armus-classic-tools input::placeholder {
    color: #777;
}

.armus-classic-tools select:focus,
.armus-classic-tools input:focus {
    border-color: #d12b31;
    box-shadow:
        0 0 0 2px rgba(209,43,49,.14),
        inset 0 1px 4px rgba(0,0,0,.35);
}

/* PANELES */
.armus-ranking-panel {
    display: none;
}

.armus-ranking-panel.active {
    display: block;
}

/* BLOQUE GENERADO POR ArmusModernRanking */
.webengine-ranking-block {
    overflow: hidden;
    background: #0e0e0e;
    border: 1px solid #4f2527;
    border-radius: 5px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
}

/* TITULO DEL RANKING */
.webengine-ranking-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 16px 18px;
    background: linear-gradient(180deg, #321315 0%, #1d0c0d 100%);
    border-bottom: 1px solid #6f292d;
}

.webengine-ranking-title h3 {
    margin: 0 0 4px !important;
    color: #fff !important;
    font-size: 23px !important;
    font-weight: 700 !important;
    text-shadow: 0 2px 3px #000;
}

.webengine-ranking-title > div > span {
    color: #c6c6c6 !important;
    font-size: 13px;
}

.ranking-live-dot {
    flex: 0 0 auto;
    padding: 5px 9px;
    color: #ffb3b6 !important;
    background: rgba(155,22,28,.24);
    border: 1px solid #7d252a;
    border-radius: 3px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .6px;
}

.ranking-live-dot span {
    display: inline-block;
    width: 7px;
    height: 7px;
    margin-right: 5px;
    border-radius: 50%;
    background: #e72c33;
    box-shadow: 0 0 7px rgba(231,44,51,.8);
}

/* TABLA REAL */
.rankings-table-container {
    overflow: hidden;
}

.modern-rankings-table,
.rankings-table {
    width: 100%;
    margin: 0 !important;
    color: #ededed !important;
    background: #101010 !important;
    border-collapse: collapse !important;
}

.modern-rankings-table .rankings-header,
.rankings-table .rankings-header {
    background: linear-gradient(180deg, #47171a 0%, #281012 100%) !important;
}

.modern-rankings-table thead th,
.rankings-table thead th {
    padding: 13px 12px !important;
    color: #f5eeee !important;
    background: transparent !important;
    border: 0 !important;
    border-bottom: 1px solid #8b3034 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    letter-spacing: .55px;
    text-align: center !important;
    text-transform: uppercase;
    text-shadow: 0 1px 1px #000;
}

/* FILAS */
.modern-rankings-table tbody .rankings-row,
.rankings-table tbody .rankings-row {
    background: #141414 !important;
    transition: background .14s ease, box-shadow .14s ease;
}

.modern-rankings-table tbody .rankings-row:nth-child(even),
.rankings-table tbody .rankings-row:nth-child(even) {
    background: #191919 !important;
}

.modern-rankings-table tbody .rankings-row:hover,
.rankings-table tbody .rankings-row:hover {
    background: #271617 !important;
    box-shadow: inset 3px 0 0 #bd242a;
}

.modern-rankings-table tbody td,
.rankings-table tbody td {
    padding: 11px 12px !important;
    color: #e8e8e8 !important;
    background: transparent !important;
    border: 0 !important;
    border-top: 1px solid #292929 !important;
    vertical-align: middle !important;
    text-align: center !important;
}

/* TOP 3 */
.modern-rankings-table tbody tr.top-rank.rank-1 {
    background: linear-gradient(90deg, #31250f 0%, #1b1811 48%, #151515 100%) !important;
    box-shadow: inset 4px 0 0 #d5a52b;
}

.modern-rankings-table tbody tr.top-rank.rank-2 {
    background: linear-gradient(90deg, #25282c 0%, #1a1b1d 48%, #151515 100%) !important;
    box-shadow: inset 4px 0 0 #aab0b6;
}

.modern-rankings-table tbody tr.top-rank.rank-3 {
    background: linear-gradient(90deg, #322014 0%, #1e1814 48%, #151515 100%) !important;
    box-shadow: inset 4px 0 0 #b46e35;
}

/* RANK */
.rank-badge {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 3px;
    min-width: 38px;
    height: 30px;
    padding: 0 8px;
    border-radius: 4px;
    background: #252525;
    border: 1px solid #444;
    color: #d0d0d0 !important;
    font-weight: 800;
}

.rank-badge.rank-1 {
    color: #ffe08a !important;
    background: #5a4313;
    border-color: #aa7d1c;
    box-shadow: 0 0 7px rgba(213,165,43,.12);
}

.rank-badge.rank-2 {
    color: #f3f3f3 !important;
    background: #444a4f;
    border-color: #747b81;
}

.rank-badge.rank-3 {
    color: #ffbd84 !important;
    background: #5b3219;
    border-color: #9a562a;
}

.rank-symbol {
    color: inherit !important;
}

/* CLASE */
.modern-class-wrap {
    display: flex;
    align-items: center;
    gap: 9px;
    justify-content: flex-start;
}

.modern-class-wrap img {
    width: 38px !important;
    height: 38px !important;
    object-fit: contain;
    border-radius: 3px;
    filter: drop-shadow(0 2px 4px rgba(0,0,0,.7));
}

.modern-class-wrap small {
    color: #bdbdbd !important;
    font-size: 12px;
    white-space: nowrap;
}

/* NOMBRES */
.name-cell,
.guild-name-cell {
    text-align: left !important;
}

.player-name,
.guild-name {
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-shadow: 0 1px 2px #000;
}

/* BADGES DE DATOS */
.level-badge,
.master-badge,
.score-badge,
.pk-level-badge,
.wins-badge,
.losses-badge,
.kills-badge,
.resets-badge {
    display: inline-block;
    min-width: 52px;
    padding: 5px 9px;
    border-radius: 4px;
    font-weight: 800;
    line-height: 1.1;
}

/* LEVEL - gris/acero */
.level-badge,
.master-badge {
    color: #f3f3f3 !important;
    background: #25282b !important;
    border: 1px solid #555d63 !important;
}

/* RESETS - rojo vivo */
.resets-badge,
.wins-badge,
.score-badge {
    color: #ffb0b3 !important;
    background: #4a1115 !important;
    border: 1px solid #a22a30 !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}

/* PK / KILLS */
.kills-badge,
.pk-level-badge {
    color: #ff858a !important;
    background: #4d1013 !important;
    border: 1px solid #9a282d !important;
}

.losses-badge {
    color: #d5d5d5 !important;
    background: #262626 !important;
    border: 1px solid #4d4d4d !important;
}

/* FOOTER */
.rankings-update-time {
    padding: 11px 14px;
    color: #a5a5a5 !important;
    background: #0b0b0b;
    border-top: 1px solid #2d2d2d;
    text-align: right;
    font-size: 11px;
}

.rankings-update-time:before {
    content: "●";
    margin-right: 7px;
    color: #e42a31;
    text-shadow: 0 0 6px rgba(228,42,49,.75);
}

.rankings-empty-state {
    padding: 35px 20px;
    color: #aaa !important;
    text-align: center;
}

/* Responsive */
@media (max-width: 767px) {
    .armus-classic-box {
        padding: 12px;
    }

    .armus-classic-tab {
        min-width: 0;
        flex: 1 1 calc(50% - 10px);
        padding: 9px 7px;
        font-size: 11px;
    }

    .armus-classic-tools {
        flex-direction: column;
        align-items: stretch;
    }

    .armus-classic-show,
    .armus-classic-search {
        justify-content: space-between;
    }

    .armus-classic-tools input {
        width: 100%;
    }

    .modern-rankings-table thead th,
    .modern-rankings-table tbody td {
        padding: 8px 6px !important;
        font-size: 11px !important;
    }

    .modern-class-wrap small {
        display: none;
    }
}