/* =========================================================
   INITMU VISUAL PATCH v2
   WebEngine Momentum - video + magic rain + dark fantasy UI

   Archivos afectados:
   - momentum/effects/effects.css
   - momentum/effects/effects.js

   NO toca PHP, SQL, login, AdminCP ni rutas core.
   ========================================================= */

/* =========================
   CAPA VIDEO / EFECTOS v6
   Partículas suaves, pequeñas y ascendentes
========================= */

.initmu-magic-layer {
    position: fixed;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
    z-index: -1;
    opacity: 1;
    mix-blend-mode: screen;
    contain: layout paint style;
}

.mist {
    display: none !important;
}

.initmu-magic-drop {
    position: absolute;
    left: var(--x);
    bottom: -14vh;
    width: var(--size);
    height: var(--size);
    border-radius: 50%;
    opacity: 0;
    background: radial-gradient(
        circle,
        rgba(146, 223, 255, 0.92) 0%,
        rgba(78, 182, 255, 0.34) 42%,
        rgba(15, 79, 161, 0.02) 100%
    );
    box-shadow:
        0 0 5px rgba(138, 220, 255, 0.18),
        0 0 12px rgba(0, 120, 255, 0.08);
    filter: blur(0.2px);
    animation: initmu-particle-rise var(--duration) linear var(--delay) infinite;
    transform: translate3d(0, 14vh, 0) scale(0.7);
    will-change: transform, opacity;
}

.initmu-magic-spark {
    position: absolute;
    left: var(--x);
    bottom: -12vh;
    width: var(--size);
    height: var(--size);
    border-radius: 50%;
    opacity: 0;
    background: rgba(210, 244, 255, 0.88);
    box-shadow:
        0 0 4px rgba(170, 232, 255, 0.16),
        0 0 10px rgba(82, 177, 255, 0.06);
    animation: initmu-spark-rise var(--duration) ease-out var(--delay) infinite;
    transform: translate3d(0, 12vh, 0) scale(0.65);
    will-change: transform, opacity;
}

.initmu-energy-wisp {
    position: absolute;
    left: var(--x);
    top: var(--y);
    width: var(--size);
    height: var(--size);
    border-radius: 50%;
    opacity: 0;
    background: radial-gradient(
        circle,
        rgba(126, 220, 255, 0.20) 0%,
        rgba(44, 132, 228, 0.08) 42%,
        rgba(0, 60, 180, 0) 78%
    );
    filter: blur(10px);
    animation: initmu-wisp-float var(--duration) ease-in-out var(--delay) infinite;
    will-change: transform, opacity;
}

@keyframes initmu-particle-rise {
    0% {
        transform: translate3d(0, 14vh, 0) scale(0.7);
        opacity: 0;
    }
    15% {
        opacity: var(--opacity);
    }
    72% {
        opacity: calc(var(--opacity) * 0.88);
    }
    100% {
        transform: translate3d(var(--drift), -118vh, 0) scale(1.08);
        opacity: 0;
    }
}

@keyframes initmu-spark-rise {
    0% {
        transform: translate3d(0, 12vh, 0) scale(0.65);
        opacity: 0;
    }
    18% {
        opacity: var(--opacity);
    }
    65% {
        opacity: calc(var(--opacity) * 0.75);
    }
    100% {
        transform: translate3d(var(--drift), -112vh, 0) scale(0.95);
        opacity: 0;
    }
}

@keyframes initmu-wisp-float {
    0%, 100% {
        transform: scale(0.8) translate3d(0, 10px, 0);
        opacity: 0;
    }
    35% {
        opacity: calc(var(--opacity) * 0.75);
    }
    55% {
        transform: scale(1.08) translate3d(var(--drift), -18px, 0);
        opacity: var(--opacity);
    }
}

.video-overlay {
    background: rgba(3, 10, 24, 0.20) !important;
}

#bg-video {
    opacity: 0.94 !important;
}

/* =========================
   LOGO
========================= */

#header img {
    position: relative;
    z-index: 3;
    filter:
        drop-shadow(0 0 10px rgba(70, 190, 255, 0.80))
        drop-shadow(0 0 26px rgba(0, 120, 255, 0.58))
        drop-shadow(0 0 48px rgba(0, 70, 255, 0.32));
    transition: filter 260ms ease, transform 260ms ease;
}

#header img:hover {
    filter:
        drop-shadow(0 0 14px rgba(130, 235, 255, 0.95))
        drop-shadow(0 0 34px rgba(0, 155, 255, 0.78))
        drop-shadow(0 0 64px rgba(0, 85, 255, 0.45));
    transform: scale(1.018);
}

/* =========================
   NAVBAR FANTASY BLUE
========================= */

#navbar {
    position: sticky;
    top: 0;
    z-index: 20;
    background:
        linear-gradient(90deg, rgba(13, 43, 88, 0.60), rgba(2, 9, 24, 0.96), rgba(13, 43, 88, 0.60)),
        linear-gradient(180deg, rgba(9, 29, 62, 0.96) 0%, rgba(3, 9, 24, 0.94) 100%) !important;
    border: 1px solid rgba(66, 178, 255, 0.62) !important;
    border-radius: 9px !important;
    box-shadow:
        0 0 0 1px rgba(5, 45, 105, 0.78) inset,
        0 0 0 2px rgba(199, 150, 72, 0.30),
        0 0 22px rgba(0, 145, 255, 0.36),
        0 12px 28px rgba(0, 0, 0, 0.48) !important;
    backdrop-filter: blur(7px);
}

#navbar::before,
#navbar::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 95px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(73, 190, 255, 0.95), transparent);
    box-shadow: 0 0 12px rgba(0, 170, 255, 0.85);
    pointer-events: none;
}

#navbar::before { left: 28px; }
#navbar::after { right: 28px; }

#navbar ul li a {
    color: #d7f2ff !important;
    letter-spacing: 0.2px;
    text-shadow:
        0 0 6px rgba(0, 170, 255, 0.74),
        0 1px 1px rgba(0, 0, 0, 0.85);
}

#navbar ul li a:active,
#navbar ul li a:focus,
#navbar ul li a:hover {
    color: #ffffff !important;
    background: radial-gradient(circle at center, rgba(0, 145, 255, 0.26), rgba(0, 145, 255, 0.06) 72%) !important;
    box-shadow:
        0 0 18px rgba(0, 150, 255, 0.42) inset,
        0 8px 20px rgba(0, 0, 0, 0.28);
}

/* =========================
   BASE UI DARK FANTASY
========================= */

body {
    color: #d8ecff !important;
}

#container,
#content,
#header,
.footer {
    position: relative;
    z-index: 2;
}

#content {
    overflow: visible !important;
}

.module-contents {
    color: #c9ddf2 !important;
    background:
        linear-gradient(180deg, rgba(5, 16, 35, 0.88), rgba(2, 7, 18, 0.92)) !important;
    border: 1px solid rgba(64, 169, 255, 0.64) !important;
    border-radius: 9px !important;
    box-shadow:
        0 0 0 1px rgba(191, 137, 62, 0.32),
        0 0 24px rgba(0, 125, 255, 0.28),
        0 16px 36px rgba(0, 0, 0, 0.52),
        inset 0 0 30px rgba(0, 80, 170, 0.18) !important;
    min-height: 800px;
}

.module-contents::before,
.panel-sidebar::before,
.panel-sidebar-events::before {
    content: "";
    display: block;
    height: 1px;
    margin: -1px 18px 12px 18px;
    background: linear-gradient(90deg, transparent, rgba(76, 192, 255, 0.70), transparent);
    box-shadow: 0 0 10px rgba(0, 170, 255, 0.55);
    pointer-events: none;
}

.page-title,
.panel-news .panel-title,
.panel-body .panel-title {
    color: #9fe6ff !important;
    text-shadow: 0 0 8px rgba(0, 150, 255, 0.55);
}

/* Alertas Bootstrap: elimina el amarillo claro en noticias vacías */
.alert,
.alert-info,
.alert-warning {
    color: #cfeeff !important;
    background: linear-gradient(180deg, rgba(8, 36, 78, 0.74), rgba(4, 15, 38, 0.78)) !important;
    border: 1px solid rgba(66, 178, 255, 0.38) !important;
    box-shadow: inset 0 0 16px rgba(0, 120, 255, 0.12);
}

/* =========================
   SIDEBARS / LOGIN / SERVER INFO
========================= */

.panel-sidebar,
.panel-sidebar-events,
.panel-general,
.panel-news,
.panel-addstats {
    color: #cddff0 !important;
    background:
        linear-gradient(180deg, rgba(7, 22, 48, 0.88), rgba(3, 9, 23, 0.92)) !important;
    border: 1px solid rgba(64, 169, 255, 0.58) !important;
    border-radius: 7px !important;
    box-shadow:
        0 0 0 1px rgba(187, 130, 55, 0.30),
        0 0 20px rgba(0, 125, 255, 0.24),
        0 12px 26px rgba(0, 0, 0, 0.46),
        inset 0 0 24px rgba(0, 70, 150, 0.12) !important;
    overflow: hidden;
}

.panel-sidebar > .panel-heading,
.panel-sidebar-events > .panel-heading,
.panel-general > .panel-heading,
.panel-news .panel-heading,
.panel-addstats > .panel-heading {
    color: #9fe6ff !important;
    background:
        linear-gradient(90deg, rgba(24, 70, 127, 0.70), rgba(3, 12, 29, 0.95), rgba(24, 70, 127, 0.70)) !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(68, 181, 255, 0.34) !important;
    text-shadow: 0 0 8px rgba(0, 170, 255, 0.62);
}

.panel-sidebar > .panel-heading > .panel-title,
.panel-sidebar-events > .panel-heading > .panel-title,
.panel-general > .panel-heading > .panel-title,
.panel-addstats > .panel-heading > .panel-title {
    color: #9fe6ff !important;
    font-weight: 700 !important;
}

.panel-sidebar .panel-body,
.panel-sidebar-events .panel-body,
.panel-general .panel-body,
.panel-news .panel-body,
.panel-addstats .panel-body {
    color: #cddff0 !important;
}

.panel-sidebar table,
.panel-sidebar-events table,
.module-contents table,
.general-table-ui,
.myaccount-table,
.rankings-table {
    color: #cddff0 !important;
    background: rgba(1, 7, 18, 0.25) !important;
}

.table > tbody > tr > td,
.table > tbody > tr > th,
.table > tfoot > tr > td,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > thead > tr > th,
.general-table-ui tr td,
.myaccount-table tr td,
.rankings-table tr td {
    border-color: rgba(70, 170, 255, 0.14) !important;
    color: #cddff0 !important;
}

.table > tbody > tr:hover > td,
.rankings-table tr:hover td,
.general-table-ui tr:hover td {
    background: rgba(0, 145, 255, 0.08) !important;
}

/* =========================
   FORMULARIOS / BOTONES
========================= */

input[type=text],
input[type=password],
input[type=number],
.form-control,
textarea,
select {
    color: #dff6ff !important;
    background: rgba(1, 7, 18, 0.82) !important;
    border: 1px solid rgba(69, 171, 255, 0.38) !important;
    box-shadow:
        inset 0 0 12px rgba(0, 0, 0, 0.45),
        0 0 10px rgba(0, 125, 255, 0.08) !important;
}

input[type=text]:focus,
input[type=password]:focus,
input[type=number]:focus,
.form-control:focus,
textarea:focus,
select:focus {
    border-color: rgba(99, 208, 255, 0.72) !important;
    box-shadow:
        inset 0 0 12px rgba(0, 0, 0, 0.50),
        0 0 14px rgba(0, 160, 255, 0.36) !important;
}

.form-control::placeholder {
    color: rgba(215, 240, 255, 0.56) !important;
}

.btn-yellow,
.btn-primary,
button[type=submit],
input[type=submit] {
    color: #e9f8ff !important;
    background: linear-gradient(180deg, rgba(0, 127, 255, 0.86), rgba(0, 62, 150, 0.88)) !important;
    border: 1px solid rgba(115, 211, 255, 0.66) !important;
    border-radius: 4px !important;
    text-shadow: 0 0 7px rgba(0, 0, 0, 0.80);
    box-shadow:
        0 0 12px rgba(0, 140, 255, 0.36),
        inset 0 0 14px rgba(135, 220, 255, 0.14) !important;
}

.btn-yellow:hover,
.btn-primary:hover,
button[type=submit]:hover,
input[type=submit]:hover {
    color: #ffffff !important;
    background: linear-gradient(180deg, rgba(35, 170, 255, 0.96), rgba(0, 83, 190, 0.96)) !important;
    border-color: rgba(170, 232, 255, 0.86) !important;
    box-shadow:
        0 0 18px rgba(0, 165, 255, 0.56),
        inset 0 0 18px rgba(170, 232, 255, 0.18) !important;
}

/* =========================
   BANNERS LATERALES
========================= */

.sidebar-banner {
    margin: 20px 0 !important;
    border-radius: 7px;
    background: rgba(3, 11, 27, 0.56);
    box-shadow:
        0 0 0 1px rgba(65, 165, 255, 0.28),
        0 0 18px rgba(0, 125, 255, 0.18),
        0 10px 20px rgba(0, 0, 0, 0.42);
    overflow: hidden;
}

.sidebar-banner img {
    border-radius: 7px !important;
    opacity: 0.88;
    filter: saturate(0.92) brightness(0.92) contrast(1.05);
    transition: opacity 180ms ease, filter 180ms ease, transform 180ms ease;
}

.sidebar-banner img:hover {
    opacity: 1;
    filter: saturate(1.08) brightness(1.05) contrast(1.08);
    transform: scale(1.012);
}

/* =========================
   NEWS / CONTENIDO CENTRAL
========================= */

.panel-news {
    box-shadow:
        0 0 18px rgba(0, 125, 255, 0.18),
        0 10px 24px rgba(0, 0, 0, 0.38) !important;
}

.panel-news .panel-footer {
    color: #8fdfff !important;
    background: rgba(1, 8, 20, 0.70) !important;
    border-top: 1px solid rgba(68, 181, 255, 0.20) !important;
}

.thumbnail {
    color: #cddff0 !important;
    background: rgba(3, 12, 28, 0.86) !important;
    border: 1px solid rgba(64, 169, 255, 0.34) !important;
}

a {
    color: #9fe6ff !important;
}

a:hover {
    color: #ffffff !important;
    text-shadow: 0 0 8px rgba(0, 170, 255, 0.65);
}

/* =========================
   FOOTER MÁS INTEGRADO
========================= */

.footer {
    color: #9fb6ce !important;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.30), rgba(0, 0, 0, 0.76)) !important;
    border-top: 1px solid rgba(64, 169, 255, 0.20) !important;
    box-shadow: 0 -14px 32px rgba(0, 0, 0, 0.35);
}

.footer-time {
    color: #9fe6ff !important;
    text-shadow: 0 0 12px rgba(0, 170, 255, 0.55);
}

@media (prefers-reduced-motion: reduce) {
    .initmu-magic-drop,
    .initmu-magic-spark,
    .initmu-energy-wisp {
        animation: none !important;
        display: none !important;
    }
}

/* =========================================================
   INITMU VISUAL PATCH v4
   Enfoque: estructura comercial estilo MU, sin tocar backend.
   - Navbar sticky arriba
   - WhatsApp redondo fijo
   - Server Status / usuarios online visible
   - Registro y descarga con foco
   - Events Schedule conserva imagen original
   ========================================================= */

:root {
    --initmu-blue: #24a8ff;
    --initmu-blue-soft: rgba(36, 168, 255, 0.58);
    --initmu-gold: #c3914d;
    --initmu-panel: rgba(3, 10, 24, 0.88);
}

/* Status importante, visible pero sin tapar la navegación */
.initmu-top-status {
    position: fixed;
    top: 52px;
    right: 28px;
    z-index: 9998;
    display: flex;
    gap: 8px;
    align-items: stretch;
    padding: 7px;
    border-radius: 8px;
    border: 1px solid rgba(64, 169, 255, 0.42);
    background:
        linear-gradient(180deg, rgba(5, 18, 42, 0.82), rgba(2, 6, 17, 0.88));
    box-shadow:
        0 0 0 1px rgba(195, 145, 77, 0.18) inset,
        0 0 20px rgba(0, 128, 255, 0.22),
        0 10px 26px rgba(0, 0, 0, 0.45);
    backdrop-filter: blur(6px);
}

.initmu-status-item {
    min-width: 128px;
    padding: 7px 10px 6px 10px;
    background: rgba(0, 5, 15, 0.48);
    border: 1px solid rgba(76, 190, 255, 0.16);
    border-radius: 6px;
}

.initmu-status-label,
.initmu-status-value {
    display: block;
    white-space: nowrap;
}

.initmu-status-label {
    color: rgba(207, 235, 255, 0.72);
    font-size: 11px;
    line-height: 1.1;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.initmu-status-value {
    margin-top: 3px;
    color: #58ff8a;
    font-weight: 900;
    font-size: 13px;
    line-height: 1.1;
    text-shadow: 0 0 9px rgba(26, 255, 116, 0.55);
}

.initmu-online-dot::before {
    content: "";
    display: inline-block;
    width: 8px;
    height: 8px;
    margin-right: 6px;
    border-radius: 50%;
    background: #17d66b;
    box-shadow: 0 0 9px rgba(23, 214, 107, 0.85);
}

/* WhatsApp redondo, fijo y profesional */
.initmu-whatsapp-float {
    position: fixed;
    right: 24px;
    bottom: 24px;
    top: auto;
    left: auto;
    transform: none;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background: #25d366;
    border: 2px solid rgba(255, 255, 255, 0.84);
    box-shadow:
        0 0 0 4px rgba(37, 211, 102, 0.12),
        0 0 22px rgba(37, 211, 102, 0.46),
        0 12px 28px rgba(0, 0, 0, 0.50);
    transition: transform 180ms ease, filter 180ms ease, box-shadow 180ms ease;
}

.initmu-whatsapp-float img {
    width: 100%;
    height: 100%;
    display: block;
    border-radius: 50%;
}

.initmu-whatsapp-float:hover {
    transform: scale(1.075);
    filter: brightness(1.08) saturate(1.08);
    box-shadow:
        0 0 0 6px rgba(37, 211, 102, 0.16),
        0 0 30px rgba(37, 211, 102, 0.62),
        0 16px 34px rgba(0, 0, 0, 0.55);
}

/* Navbar realmente sticky y más cerca del modelo fantasy */
#navbar {
    position: sticky !important;
    top: 0 !important;
    z-index: 9999 !important;
    margin-top: 0 !important;
    margin-bottom: 22px !important;
    isolation: isolate;
}

#navbar ul li a {
    text-transform: uppercase;
    font-weight: 800 !important;
}

/* Entrada por piezas, sutil. No afecta funcionalidad. */
.initmu-piece,
#header,
#navbar,
#container {
    animation: initmu-piece-in 620ms ease-out both;
}

#header { animation-delay: 60ms; }
#navbar { animation-delay: 150ms; }
.initmu-top-status { animation-delay: 210ms; }
#container { animation-delay: 260ms; }
.initmu-whatsapp-float { animation: initmu-whatsapp-in 680ms ease-out 420ms both; }

@keyframes initmu-piece-in {
    0% { opacity: 0; transform: translate3d(0, 18px, 0) scale(0.985); filter: blur(3px); }
    100% { opacity: 1; transform: translate3d(0, 0, 0) scale(1); filter: blur(0); }
}

@keyframes initmu-whatsapp-in {
    0% { opacity: 0; transform: translateX(22px) scale(0.84); }
    100% { opacity: 1; transform: translateX(0) scale(1); }
}

/* Login: olvido de contraseña junto al botón, con menor jerarquía */
.initmu-login-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.initmu-login-button {
    flex: 1 1 auto;
    min-height: 38px;
    font-weight: 900 !important;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}

.initmu-forgot-link {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 9px;
    color: rgba(211, 225, 238, 0.62) !important;
    background: rgba(0, 0, 0, 0.32);
    border: 1px solid rgba(160, 180, 205, 0.15);
    border-radius: 4px;
    font-size: 10px;
    line-height: 1;
    text-decoration: none !important;
    text-shadow: none !important;
}

.initmu-forgot-link:hover {
    color: #dff6ff !important;
    border-color: rgba(88, 190, 255, 0.34);
    background: rgba(0, 40, 90, 0.32);
}

/* Registro / Descarga con foco inmediato */
.initmu-quick-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin: 0 0 18px 0;
}

.initmu-quick-actions a {
    position: relative;
    overflow: hidden;
    display: block;
    min-height: 58px;
    padding: 11px 10px 10px 12px;
    border-radius: 6px;
    text-decoration: none !important;
    text-transform: uppercase;
    border: 1px solid rgba(116, 210, 255, 0.42);
    box-shadow:
        inset 0 0 18px rgba(255, 255, 255, 0.06),
        0 0 18px rgba(0, 130, 255, 0.18),
        0 10px 20px rgba(0, 0, 0, 0.34);
}

.initmu-quick-actions a::after {
    content: "";
    position: absolute;
    inset: -50% -35%;
    background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,0.18), transparent 62%);
    transform: translateX(-65%) rotate(8deg);
    transition: transform 420ms ease;
}

.initmu-quick-actions a:hover::after {
    transform: translateX(65%) rotate(8deg);
}

.initmu-quick-actions span,
.initmu-quick-actions small {
    position: relative;
    z-index: 1;
    display: block;
}

.initmu-quick-actions span {
    color: #fff;
    font-weight: 900;
    font-size: 15px;
    line-height: 1.1;
    text-shadow: 0 0 9px rgba(0,0,0,0.78);
}

.initmu-quick-actions small {
    margin-top: 3px;
    color: rgba(230, 245, 255, 0.76);
    font-size: 10px;
    letter-spacing: 0.3px;
}

.initmu-action-register {
    background: linear-gradient(135deg, rgba(18, 86, 29, 0.92), rgba(6, 20, 14, 0.96));
    border-color: rgba(58, 255, 114, 0.38) !important;
}

.initmu-action-download {
    background: linear-gradient(135deg, rgba(0, 101, 192, 0.92), rgba(4, 14, 32, 0.96));
    border-color: rgba(82, 190, 255, 0.46) !important;
}

.initmu-register-banner,
.initmu-download-banner {
    box-shadow:
        0 0 0 1px rgba(195, 145, 77, 0.32),
        0 0 24px rgba(0, 140, 255, 0.26),
        0 12px 24px rgba(0, 0, 0, 0.48) !important;
}

.initmu-register-banner img,
.initmu-download-banner img {
    opacity: 1 !important;
    filter: saturate(1.08) brightness(1.04) contrast(1.08) !important;
}

/* Mantener Events Schedule con su imagen original */
.panel-sidebar-events {
    background: #000000 url('../img/panel_events_bg.jpg') no-repeat top center !important;
    background-size: cover !important;
    border: 3px solid #444 !important;
    box-shadow:
        0 0 0 1px rgba(64, 169, 255, 0.22),
        0 0 18px rgba(0, 120, 255, 0.16),
        0 12px 24px rgba(0,0,0,0.42) !important;
}

.panel-sidebar-events > .panel-heading {
    background: rgba(18, 36, 42, 0.72) !important;
    color: #95eaff !important;
    border-bottom: 1px solid rgba(68, 68, 68, 0.92) !important;
}

.panel-sidebar-events::before {
    display: none !important;
}

.panel-sidebar-events .panel-body,
.panel-sidebar-events .table,
.panel-sidebar-events .table tr,
.panel-sidebar-events .table td {
    background: transparent !important;
}

@media (max-width: 991px) {
    .initmu-top-status {
        top: 58px;
        right: 12px;
        left: 12px;
        justify-content: center;
    }

    .initmu-whatsapp-float {
        right: 14px;
        bottom: 16px;
        top: auto;
        width: 52px;
        height: 52px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .initmu-piece,
    #header,
    #navbar,
    #container,
    .initmu-whatsapp-float {
        animation: none !important;
    }
}


/* =========================================================
   INITMU RANKING PATCH v5
   Replace old left banners with Top Reset 5 + Top Guild 5
   ========================================================= */

.initmu-ranking-panel .panel-heading {
    position: relative;
}

.initmu-ranking-panel .panel-body {
    padding-top: 10px;
}

.initmu-guild-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.initmu-guild-champion-logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 48px;
    min-height: 48px;
    padding: 4px;
    border-radius: 10px;
    background: linear-gradient(180deg, rgba(55, 34, 4, 0.18), rgba(19, 12, 2, 0.34));
    box-shadow:
        0 0 0 1px rgba(255, 208, 112, 0.30),
        0 0 16px rgba(255, 189, 63, 0.24),
        inset 0 0 12px rgba(255, 220, 135, 0.10);
    animation: initmu-champion-pulse 2.6s ease-in-out infinite;
}

.initmu-guild-champion-logo img,
.initmu-guild-champion-logo table {
    filter: drop-shadow(0 0 6px rgba(255, 208, 112, 0.70));
}

.initmu-ranking-table {
    margin-bottom: 0;
    table-layout: fixed;
    font-size: 12px;
}

.initmu-ranking-table th {
    color: #cfeaff !important;
    font-size: 10px;
    letter-spacing: 0.5px;
    border-top: 0 !important;
    background: rgba(2, 12, 28, 0.35);
}

.initmu-ranking-table td,
.initmu-ranking-table th {
    vertical-align: middle !important;
    padding: 7px 5px !important;
}

.initmu-col-top { width: 36px; }
.initmu-col-class { width: 52px; }
.initmu-col-logo { width: 40px; }
.initmu-rank-pos,
.initmu-rank-class {
    font-weight: 700;
    text-align: center;
}

.initmu-guild-logo-cell {
    text-align: center;
}

.initmu-guild-logo-cell img,
.initmu-guild-logo-cell table {
    display: inline-block;
    vertical-align: middle;
}

.initmu-rank-name {
    font-weight: 700;
    color: #e4f5ff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.initmu-rank-score {
    font-weight: 700;
    color: #d8efff;
    white-space: nowrap;
}

.initmu-ranking-table .initmu-rank-1 td {
    color: #ffeebf !important;
    text-shadow: 0 0 10px rgba(255, 201, 79, 0.62);
    box-shadow: inset 0 0 0 999px rgba(185, 121, 16, 0.08);
}

.initmu-ranking-table .initmu-rank-2 td {
    color: #ffd6b4 !important;
    text-shadow: 0 0 8px rgba(255, 144, 66, 0.45);
    box-shadow: inset 0 0 0 999px rgba(173, 86, 26, 0.07);
}

.initmu-ranking-table .initmu-rank-1 .initmu-rank-pos,
.initmu-ranking-table .initmu-rank-1 .initmu-rank-score {
    color: #ffd76f !important;
}

.initmu-ranking-table .initmu-rank-2 .initmu-rank-pos,
.initmu-ranking-table .initmu-rank-2 .initmu-rank-score {
    color: #ffb067 !important;
}

@keyframes initmu-champion-pulse {
    0%, 100% {
        box-shadow:
            0 0 0 1px rgba(255, 208, 112, 0.30),
            0 0 14px rgba(255, 189, 63, 0.20),
            inset 0 0 10px rgba(255, 220, 135, 0.08);
    }
    50% {
        box-shadow:
            0 0 0 1px rgba(255, 221, 146, 0.48),
            0 0 22px rgba(255, 205, 88, 0.38),
            inset 0 0 14px rgba(255, 229, 163, 0.14);
    }
}

@media (max-width: 991px) {
    .initmu-ranking-table {
        font-size: 11px;
    }

    .initmu-ranking-table td,
    .initmu-ranking-table th {
        padding: 6px 4px !important;
    }
}

/* =========================================================
   INITMU HOTFIX INFO TABLE v6.1
   Restaura el patrón visual de la página Información
   filas grises con texto oscuro + filas azules con texto claro
   ========================================================= */

.module-contents .general-table-ui {
    width: 100%;
    table-layout: fixed;
    background: rgba(6, 16, 38, 0.34) !important;
    border: 1px solid rgba(90, 178, 255, 0.18) !important;
    padding: 10px;
    margin: 10px 0;
}

.module-contents .general-table-ui tr td {
    padding: 5px 8px !important;
    vertical-align: middle !important;
    text-align: center;
    text-shadow: none !important;
}

/* encabezado de bloque */
.module-contents .general-table-ui tr:first-child td {
    background: rgba(8, 18, 42, 0.96) !important;
    color: #f2f8ff !important;
    font-weight: 700;
    text-align: left;
}

/* filas claras */
.module-contents .general-table-ui tr:nth-child(2n+2) td {
    background: rgba(235, 239, 243, 0.94) !important;
    color: #1b2633 !important;
}

/* filas oscuras alternadas */
.module-contents .general-table-ui tr:nth-child(2n+3) td {
    background: rgba(4, 18, 46, 0.92) !important;
    color: #eef7ff !important;
}

/* hover suave sin romper el patrón */
.module-contents .general-table-ui tr:hover td {
    filter: brightness(1.03);
}

/* algunos módulos usan myaccount-table para tablas similares */
.module-contents .myaccount-table {
    width: 100%;
    background: rgba(6, 16, 38, 0.34) !important;
    border: 1px solid rgba(90, 178, 255, 0.18) !important;
}

.module-contents .myaccount-table tr td:first-child {
    color: #d8e7f6 !important;
    font-weight: 700;
}

.module-contents .myaccount-table tr td {
    border-bottom: 1px solid rgba(70, 170, 255, 0.14) !important;
    padding: 15px !important;
    background: rgba(3, 15, 38, 0.78) !important;
    color: #eef7ff !important;
    text-shadow: none !important;
}

/* =========================================================
   INITMU HOTFIX INFO TABLE v6.2 - selector fuerte
   Aplica a tablas del contenido central aunque no usen general-table-ui
   ========================================================= */

#content .module-contents table:not(.initmu-ranking-table),
.module-contents table:not(.initmu-ranking-table) {
    background: rgba(5, 14, 32, 0.42) !important;
    border-color: rgba(80, 170, 255, 0.22) !important;
}

#content .module-contents table:not(.initmu-ranking-table) tr td,
#content .module-contents table:not(.initmu-ranking-table) tr th,
.module-contents table:not(.initmu-ranking-table) tr td,
.module-contents table:not(.initmu-ranking-table) tr th {
    border-color: rgba(70, 170, 255, 0.16) !important;
    text-shadow: none !important;
}

/* Fila de encabezado / secciones */
#content .module-contents table:not(.initmu-ranking-table) tr:first-child td,
#content .module-contents table:not(.initmu-ranking-table) tr:first-child th,
.module-contents table:not(.initmu-ranking-table) tr:first-child td,
.module-contents table:not(.initmu-ranking-table) tr:first-child th {
    background: rgba(5, 15, 36, 0.96) !important;
    color: #f1f8ff !important;
    font-weight: 700 !important;
}

/* Filas claras: fondo gris/blanco con texto oscuro */
#content .module-contents table:not(.initmu-ranking-table) tr:nth-child(even) td,
#content .module-contents table:not(.initmu-ranking-table) tr:nth-child(even) th,
.module-contents table:not(.initmu-ranking-table) tr:nth-child(even) td,
.module-contents table:not(.initmu-ranking-table) tr:nth-child(even) th {
    background: rgba(238, 242, 246, 0.96) !important;
    color: #1b2838 !important;
}

/* Filas oscuras: fondo azul oscuro con texto claro */
#content .module-contents table:not(.initmu-ranking-table) tr:nth-child(odd):not(:first-child) td,
#content .module-contents table:not(.initmu-ranking-table) tr:nth-child(odd):not(:first-child) th,
.module-contents table:not(.initmu-ranking-table) tr:nth-child(odd):not(:first-child) td,
.module-contents table:not(.initmu-ranking-table) tr:nth-child(odd):not(:first-child) th {
    background: rgba(2, 13, 34, 0.94) !important;
    color: #eaf6ff !important;
}

/* Hereda el color correcto aunque haya span, a, strong u otros elementos dentro */
#content .module-contents table:not(.initmu-ranking-table) tr:nth-child(even) td *,
#content .module-contents table:not(.initmu-ranking-table) tr:nth-child(even) th *,
.module-contents table:not(.initmu-ranking-table) tr:nth-child(even) td *,
.module-contents table:not(.initmu-ranking-table) tr:nth-child(even) th * {
    color: #1b2838 !important;
    text-shadow: none !important;
}

#content .module-contents table:not(.initmu-ranking-table) tr:nth-child(odd) td *,
#content .module-contents table:not(.initmu-ranking-table) tr:nth-child(odd) th *,
.module-contents table:not(.initmu-ranking-table) tr:nth-child(odd) td *,
.module-contents table:not(.initmu-ranking-table) tr:nth-child(odd) th * {
    color: inherit !important;
    text-shadow: none !important;
}

#content .module-contents table:not(.initmu-ranking-table) tr:hover td,
#content .module-contents table:not(.initmu-ranking-table) tr:hover th,
.module-contents table:not(.initmu-ranking-table) tr:hover td,
.module-contents table:not(.initmu-ranking-table) tr:hover th {
    filter: brightness(1.04);
}

/* =========================================================
   INITMU INFO CONTENT PATCH v6.3
   Filas claras menos blancas: celeste eléctrico suave
   ========================================================= */

#content .module-contents table:not(.initmu-ranking-table) tr:nth-child(even) td,
#content .module-contents table:not(.initmu-ranking-table) tr:nth-child(even) th,
.module-contents table:not(.initmu-ranking-table) tr:nth-child(even) td,
.module-contents table:not(.initmu-ranking-table) tr:nth-child(even) th,
.module-contents .general-table-ui tr:nth-child(2n+2) td {
    background: linear-gradient(180deg, rgba(213, 244, 255, 0.94), rgba(171, 225, 247, 0.92)) !important;
    color: #102133 !important;
}

#content .module-contents table:not(.initmu-ranking-table) tr:nth-child(even) td *,
#content .module-contents table:not(.initmu-ranking-table) tr:nth-child(even) th *,
.module-contents table:not(.initmu-ranking-table) tr:nth-child(even) td *,
.module-contents table:not(.initmu-ranking-table) tr:nth-child(even) th * {
    color: #102133 !important;
    text-shadow: none !important;
}

.initmu-info-video-frame {
    width: 100% !important;
    max-width: 100% !important;
    aspect-ratio: 16 / 9;
    height: auto !important;
    min-height: 315px;
    border: 1px solid rgba(83, 190, 255, 0.45) !important;
    border-radius: 8px;
    box-shadow:
        0 0 0 1px rgba(0, 80, 160, 0.40),
        0 0 22px rgba(0, 150, 255, 0.22),
        0 14px 30px rgba(0, 0, 0, 0.45);
}

.initmu-info-autofixed-note {
    display: none !important;
}

/* =========================================================
   INITMU INFO FINAL FIX v6.4
   Sidebar Server Info alineado con la información central
   ========================================================= */

.initmu-serverinfo-panel .table,
.initmu-serverinfo-panel table {
    background: rgba(4, 14, 34, 0.38) !important;
}

.initmu-serverinfo-panel table tr td:first-child {
    color: #dff4ff !important;
    font-weight: 700 !important;
}

.initmu-serverinfo-panel table tr td:last-child {
    color: #eef8ff !important;
    font-weight: 700 !important;
    text-align: right;
}

.initmu-serverinfo-panel table tr:nth-child(1) td,
.initmu-serverinfo-panel table tr:nth-child(2) td,
.initmu-serverinfo-panel table tr:nth-child(3) td,
.initmu-serverinfo-panel table tr:nth-child(4) td {
    background: rgba(4, 18, 46, 0.30) !important;
}

.initmu-serverinfo-panel .initmu-online-count {
    color: #59ff9a !important;
    text-shadow: 0 0 8px rgba(0, 255, 120, 0.42);
}

/* =========================================================
   INITMU METALLIC TABLE THEME v6.6
   Ajuste visual pedido por el usuario:
   - el celeste claro pasa a gris/plata/acero
   - el azul oscuro queda más transparente
   - mejora la integración con el esquema azul del template
   ========================================================= */

/* Cabeceras del módulo info */
#content .module-contents table:not(.initmu-ranking-table) tr:first-child td,
#content .module-contents table:not(.initmu-ranking-table) tr:first-child th,
.module-contents table:not(.initmu-ranking-table) tr:first-child td,
.module-contents table:not(.initmu-ranking-table) tr:first-child th,
.module-contents .general-table-ui tr:first-child td,
.module-contents .general-table-ui tr:first-child th {
    background: rgba(8, 18, 40, 0.78) !important;
    color: #eef7ff !important;
    border-color: rgba(117, 153, 183, 0.16) !important;
}

/* Filas claras: gris metálico / plata */
#content .module-contents table:not(.initmu-ranking-table) tr:nth-child(2n+2) td,
#content .module-contents table:not(.initmu-ranking-table) tr:nth-child(2n+2) th,
.module-contents table:not(.initmu-ranking-table) tr:nth-child(2n+2) td,
.module-contents table:not(.initmu-ranking-table) tr:nth-child(2n+2) th,
.module-contents .general-table-ui tr:nth-child(2n+2) td,
.module-contents .general-table-ui tr:nth-child(2n+2) th {
    background: linear-gradient(180deg, rgba(193, 203, 214, 0.84), rgba(171, 183, 196, 0.84)) !important;
    color: #233241 !important;
    border-color: rgba(106, 130, 154, 0.24) !important;
}

#content .module-contents table:not(.initmu-ranking-table) tr:nth-child(2n+2) td *,
#content .module-contents table:not(.initmu-ranking-table) tr:nth-child(2n+2) th *,
.module-contents table:not(.initmu-ranking-table) tr:nth-child(2n+2) td *,
.module-contents table:not(.initmu-ranking-table) tr:nth-child(2n+2) th *,
.module-contents .general-table-ui tr:nth-child(2n+2) td * {
    color: #233241 !important;
    text-shadow: none !important;
}

/* Filas oscuras: azul más transparente */
#content .module-contents table:not(.initmu-ranking-table) tr:nth-child(2n+3) td,
#content .module-contents table:not(.initmu-ranking-table) tr:nth-child(2n+3) th,
.module-contents table:not(.initmu-ranking-table) tr:nth-child(2n+3) td,
.module-contents table:not(.initmu-ranking-table) tr:nth-child(2n+3) th,
.module-contents .general-table-ui tr:nth-child(2n+3) td,
.module-contents .general-table-ui tr:nth-child(2n+3) th {
    background: rgba(8, 24, 55, 0.58) !important;
    color: #edf6ff !important;
    border-color: rgba(88, 130, 171, 0.18) !important;
}

#content .module-contents table:not(.initmu-ranking-table) tr:nth-child(2n+3) td *,
#content .module-contents table:not(.initmu-ranking-table) tr:nth-child(2n+3) th *,
.module-contents table:not(.initmu-ranking-table) tr:nth-child(2n+3) td *,
.module-contents table:not(.initmu-ranking-table) tr:nth-child(2n+3) th *,
.module-contents .general-table-ui tr:nth-child(2n+3) td * {
    color: #edf6ff !important;
    text-shadow: none !important;
}

/* Hover más suave, sin sobresaturar */
#content .module-contents table:not(.initmu-ranking-table) tr:hover td,
#content .module-contents table:not(.initmu-ranking-table) tr:hover th,
.module-contents table:not(.initmu-ranking-table) tr:hover td,
.module-contents table:not(.initmu-ranking-table) tr:hover th,
.module-contents .general-table-ui tr:hover td,
.module-contents .general-table-ui tr:hover th {
    filter: brightness(1.02) !important;
}

/* =========================================================
   INITMU FINAL POLISH v6.7
   UserCP: normaliza color del texto del panel de usuario
   para que no se pierda sobre el fondo oscuro.
   ========================================================= */

.panel-usercp .panel-body,
.panel-usercp .panel-body * {
    color: #cfe3f7 !important;
    text-shadow: 0 0 6px rgba(0, 130, 255, 0.18);
}

.panel-usercp .panel-body a,
.panel-usercp .panel-body a span,
.panel-usercp .panel-body li,
.panel-usercp .panel-body td {
    color: #cfe3f7 !important;
}

.panel-usercp .panel-body a:hover,
.panel-usercp .panel-body a:hover span {
    color: #ffffff !important;
    text-shadow: 0 0 8px rgba(100, 205, 255, 0.65);
}

.panel-usercp .panel-body img {
    opacity: 1 !important;
    filter: none !important;
}

/* =========================================================
   INITMU RANKINGS HOTFIX v7.1
   Fix fuerte para /rankings: dark theme, Season 6 classes,
   WhatsApp protegido y Server Status protegido.
   ========================================================= */

/* WhatsApp: protección global contra SVG/IMG gigante */
a.initmu-whatsapp-float,
a[href*="chat.whatsapp.com"],
a[href*="wa.me"] {
    position: fixed !important;
    right: 24px !important;
    bottom: 24px !important;
    top: auto !important;
    left: auto !important;
    width: 58px !important;
    height: 58px !important;
    min-width: 58px !important;
    max-width: 58px !important;
    min-height: 58px !important;
    max-height: 58px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    border-radius: 50% !important;
    z-index: 10000 !important;
    transform: none !important;
}

a.initmu-whatsapp-float img,
a[href*="chat.whatsapp.com"] img,
a[href*="wa.me"] img,
img[src*="whatsapp"] {
    width: 58px !important;
    height: 58px !important;
    min-width: 58px !important;
    max-width: 58px !important;
    min-height: 58px !important;
    max-height: 58px !important;
    object-fit: contain !important;
    border-radius: 50% !important;
}

/* Server Status: si queda texto plano, volverlo caja superior derecha */
.initmu-top-status {
    position: fixed !important;
    top: 58px !important;
    right: 24px !important;
    z-index: 9998 !important;
    display: flex !important;
    gap: 8px !important;
    padding: 8px !important;
    border: 1px solid rgba(85, 190, 255, 0.45) !important;
    border-radius: 8px !important;
    background: rgba(2, 10, 26, 0.72) !important;
    box-shadow: 0 0 18px rgba(0, 135, 255, 0.18), inset 0 0 18px rgba(0, 80, 180, 0.10) !important;
    backdrop-filter: blur(5px);
}

.initmu-status-item {
    min-width: 92px !important;
    padding: 6px 9px !important;
    border: 1px solid rgba(75, 165, 255, 0.20) !important;
    border-radius: 5px !important;
    background: rgba(3, 14, 34, 0.58) !important;
}

.initmu-status-label,
.initmu-status-value {
    display: block !important;
    white-space: nowrap !important;
}

.initmu-status-label {
    color: rgba(207, 235, 255, 0.72) !important;
    font-size: 11px !important;
    line-height: 1.1 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.initmu-status-value {
    margin-top: 3px !important;
    color: #58ff8a !important;
    font-weight: 900 !important;
    font-size: 13px !important;
    line-height: 1.1 !important;
    text-shadow: 0 0 9px rgba(26, 255, 116, 0.55) !important;
}

/* Ranking page dark layout */
body.initmu-rankings-page #content .col-xs-12,
body.initmu-rankings-page #content .module-contents {
    color: #d8ecff !important;
}

body.initmu-rankings-page .module-contents {
    background: linear-gradient(180deg, rgba(5, 16, 35, 0.88), rgba(2, 7, 18, 0.92)) !important;
    border: 1px solid rgba(64, 169, 255, 0.64) !important;
    border-radius: 9px !important;
    box-shadow: 0 0 0 1px rgba(191, 137, 62, 0.22), 0 0 24px rgba(0, 125, 255, 0.22), 0 16px 36px rgba(0,0,0,0.50), inset 0 0 30px rgba(0,80,170,0.14) !important;
}

body.initmu-rankings-page .module-contents h1,
body.initmu-rankings-page .module-contents h2,
body.initmu-rankings-page .module-contents h3,
body.initmu-rankings-page .module-contents .page-title,
body.initmu-rankings-page .rankings_menu span {
    color: #9fe6ff !important;
    text-shadow: 0 0 12px rgba(0, 170, 255, 0.48) !important;
}

body.initmu-rankings-page .rankings_menu {
    width: 90% !important;
    margin: 0 auto 20px auto !important;
    text-align: center !important;
    overflow: visible !important;
}

body.initmu-rankings-page .rankings_menu a {
    color: #d9ecff !important;
    background: rgba(6, 18, 42, 0.66) !important;
    border: 1px solid rgba(90, 178, 255, 0.28) !important;
    box-shadow: inset 0 0 10px rgba(0, 110, 220, 0.10) !important;
}

body.initmu-rankings-page .rankings_menu a.active,
body.initmu-rankings-page .rankings_menu a:hover {
    color: #ffffff !important;
    border-color: rgba(124, 206, 255, 0.55) !important;
    background: rgba(15, 54, 105, 0.72) !important;
}

/* Filtro clases Season 6 EP3 */
body.initmu-rankings-page .rankings-class-filter {
    display: flex !important;
    justify-content: center !important;
    align-items: flex-start !important;
    flex-wrap: wrap !important;
    gap: 12px !important;
    margin: 22px auto 28px auto !important;
    padding: 12px 18px !important;
    background: rgba(4, 14, 34, 0.38) !important;
    border: 1px solid rgba(90, 178, 255, 0.14) !important;
}

body.initmu-rankings-page .rankings-class-filter li {
    margin: 0 !important;
}

body.initmu-rankings-page .rankings-class-filter li.initmu-hide-class {
    display: none !important;
}

body.initmu-rankings-page .rankings-class-filter-selection {
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 86px !important;
    color: #d8ecff !important;
    font-size: 11px !important;
    text-align: center !important;
    text-shadow: 0 0 8px rgba(0, 120, 255, 0.22) !important;
}

body.initmu-rankings-page .rankings-class-filter-selection img,
body.initmu-rankings-page .rankings-class-image {
    width: 58px !important;
    height: 58px !important;
    object-fit: cover !important;
    border-radius: 50% !important;
    margin-bottom: 6px !important;
    border: 1px solid rgba(91, 191, 255, 0.48) !important;
    background: rgba(2, 8, 20, 0.78) !important;
    box-shadow: 0 0 0 2px rgba(4, 16, 38, 0.78), 0 0 14px rgba(0, 142, 255, 0.24), inset 0 0 10px rgba(255,255,255,0.08) !important;
    filter: grayscale(18%) brightness(0.92) contrast(1.05) !important;
}

body.initmu-rankings-page .rankings-class-filter-selection:hover img,
body.initmu-rankings-page .rankings-class-filter-selection.active img {
    filter: grayscale(0%) brightness(1.08) contrast(1.08) !important;
    box-shadow: 0 0 0 2px rgba(4, 16, 38, 0.78), 0 0 22px rgba(0, 170, 255, 0.42), 0 0 34px rgba(0, 80, 255, 0.18) !important;
}

/* Tabla ranking */
body.initmu-rankings-page .rankings-table {
    width: 88% !important;
    margin: 24px auto !important;
    background: rgba(5, 14, 32, 0.50) !important;
    border: 1px solid rgba(90, 178, 255, 0.24) !important;
    box-shadow: 0 0 24px rgba(0, 110, 220, 0.16), 0 12px 28px rgba(0,0,0,0.36) !important;
}

body.initmu-rankings-page .rankings-table tr:first-child td,
body.initmu-rankings-page .rankings-table tr:first-child th {
    background: rgba(8, 18, 40, 0.78) !important;
    color: #dff5ff !important;
    border-bottom: 1px solid rgba(105, 188, 255, 0.30) !important;
    font-weight: 800 !important;
}

body.initmu-rankings-page .rankings-table tr td,
body.initmu-rankings-page .rankings-table tr th {
    border-bottom: 1px solid rgba(90, 178, 255, 0.13) !important;
    color: #d8ecff !important;
    text-shadow: none !important;
}

body.initmu-rankings-page .rankings-table tr:nth-child(2n+2) td,
body.initmu-rankings-page .rankings-table tr:nth-child(2n+2) th {
    background: linear-gradient(180deg, rgba(193, 203, 214, 0.78), rgba(171, 183, 196, 0.78)) !important;
    color: #233241 !important;
}

body.initmu-rankings-page .rankings-table tr:nth-child(2n+3) td,
body.initmu-rankings-page .rankings-table tr:nth-child(2n+3) th {
    background: rgba(8, 24, 55, 0.58) !important;
    color: #edf6ff !important;
}

body.initmu-rankings-page .rankings-table-place,
body.initmu-rankings-page .rankings-table tr td:first-child {
    color: #ffd76f !important;
    font-weight: 900 !important;
    text-shadow: 0 0 9px rgba(255, 201, 79, 0.38) !important;
}

body.initmu-rankings-page .rankings-table a {
    color: inherit !important;
}

body.initmu-rankings-page .rankings-update-time {
    width: 88% !important;
    margin: 0 auto !important;
    color: rgba(216, 236, 255, 0.62) !important;
}

@media (max-width: 991px) {
    a.initmu-whatsapp-float,
    a[href*="chat.whatsapp.com"],
    a[href*="wa.me"],
    img[src*="whatsapp"] {
        right: 14px !important;
        bottom: 16px !important;
        width: 52px !important;
        height: 52px !important;
        min-width: 52px !important;
        max-width: 52px !important;
        min-height: 52px !important;
        max-height: 52px !important;
    }

    body.initmu-rankings-page .rankings-table,
    body.initmu-rankings-page .rankings_menu {
        width: 100% !important;
    }

    body.initmu-rankings-page .rankings-class-filter-selection {
        width: 74px !important;
    }
}

/* =========================================================
   INITMU RANKINGS S6 CORE v7.2
   Ranking real para Season 6 Ep3 + avatares redondos
   ========================================================= */

/* Protección global del botón WhatsApp */
a.initmu-whatsapp-float {
    position: fixed !important;
    right: 24px !important;
    bottom: 24px !important;
    top: auto !important;
    left: auto !important;
    width: 58px !important;
    height: 58px !important;
    max-width: 58px !important;
    max-height: 58px !important;
    min-width: 58px !important;
    min-height: 58px !important;
    transform: none !important;
    z-index: 100000 !important;
    overflow: hidden !important;
    border-radius: 50% !important;
}

a.initmu-whatsapp-float img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: cover !important;
    border-radius: 50% !important;
}

a.initmu-whatsapp-float:hover {
    transform: scale(1.075) !important;
}

/* Página rankings sin exceso de blanco */
.rankings-table,
.module-contents .rankings-table,
#content .module-contents .rankings-table {
    width: 100% !important;
    color: #dcefff !important;
    background: rgba(4, 14, 33, 0.68) !important;
    border: 1px solid rgba(110, 170, 220, 0.22) !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    box-shadow:
        0 0 0 1px rgba(170, 190, 210, 0.08),
        0 0 18px rgba(0, 105, 190, 0.14) !important;
}

.rankings-table tr:first-child td,
.rankings-table tr:first-child th {
    background: rgba(8, 18, 40, 0.82) !important;
    color: #eef7ff !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    letter-spacing: 0.35px;
}

.rankings-table tr:nth-child(2n+2) td {
    background: linear-gradient(180deg, rgba(193, 203, 214, 0.84), rgba(171, 183, 196, 0.84)) !important;
    color: #233241 !important;
    border-color: rgba(106, 130, 154, 0.24) !important;
    text-shadow: none !important;
}

.rankings-table tr:nth-child(2n+3) td {
    background: rgba(8, 24, 55, 0.58) !important;
    color: #edf6ff !important;
    border-color: rgba(88, 130, 171, 0.18) !important;
    text-shadow: none !important;
}

.rankings-table tr:nth-child(2n+2) td *,
.rankings-table tr:nth-child(2n+2) td a {
    color: #233241 !important;
    text-shadow: none !important;
}

.rankings-table tr:nth-child(2n+3) td *,
.rankings-table tr:nth-child(2n+3) td a {
    color: #edf6ff !important;
    text-shadow: none !important;
}

.rankings-table tr:hover td {
    filter: brightness(1.03);
}

.rankings-table-place {
    font-weight: 800 !important;
}

/* Filtro de clases S6 */
.rankings-class-filter {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 12px !important;
    margin: 12px 0 20px 0 !important;
    padding: 0 !important;
}

.rankings-class-filter li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.rankings-class-filter-selection {
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 6px !important;
    color: #dcefff !important;
    font-weight: 700 !important;
    text-shadow: 0 0 6px rgba(0, 110, 200, 0.40) !important;
}

.rankings-class-image,
.rankings-class-filter-image {
    width: 58px !important;
    height: 58px !important;
    max-width: 58px !important;
    max-height: 58px !important;
    object-fit: cover !important;
    border-radius: 50% !important;
    border: 2px solid rgba(184, 210, 230, 0.78) !important;
    background: rgba(4, 13, 28, 0.95) !important;
    box-shadow:
        0 0 0 2px rgba(3, 18, 38, 0.90),
        0 0 14px rgba(0, 145, 255, 0.34),
        inset 0 0 8px rgba(255,255,255,0.10) !important;
    transition: transform 180ms ease, filter 180ms ease, box-shadow 180ms ease;
}

.rankings-class-filter-selection:hover .rankings-class-filter-image,
.rankings-class-filter-selection.active .rankings-class-filter-image {
    transform: translateY(-2px) scale(1.04);
    filter: brightness(1.08) saturate(1.08);
    box-shadow:
        0 0 0 2px rgba(3, 18, 38, 0.90),
        0 0 18px rgba(0, 155, 255, 0.48),
        0 0 26px rgba(205, 170, 85, 0.18) !important;
}

@media (max-width: 768px) {
    a.initmu-whatsapp-float {
        right: 14px !important;
        bottom: 16px !important;
        width: 52px !important;
        height: 52px !important;
        min-width: 52px !important;
        min-height: 52px !important;
    }

    .rankings-class-image,
    .rankings-class-filter-image {
        width: 50px !important;
        height: 50px !important;
        max-width: 50px !important;
        max-height: 50px !important;
    }
}

/* =========================================================
   INITMU URGENT HOTFIX v8.0
   1) Refuerzo global para rutas profundas (/rankings/resets/)
   2) WhatsApp fijo y blindado
   3) Rankings sin blanco fuerte
   4) Iconos de clase más grandes + hover
   ========================================================= */

html,
body {
    min-height: 100% !important;
    background: #071322 url('../img/background.jpg') center top / cover fixed no-repeat !important;
}

#bg-video {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    object-fit: cover !important;
    z-index: -3 !important;
    opacity: 0.94 !important;
    pointer-events: none !important;
}

.video-overlay {
    position: fixed !important;
    inset: 0 !important;
    z-index: -2 !important;
    pointer-events: none !important;
    background:
        radial-gradient(circle at center, rgba(0, 95, 180, 0.08), transparent 46%),
        rgba(3, 10, 24, 0.34) !important;
}

/* WhatsApp definitivo: no depende del panel ni del ranking */
a.initmu-whatsapp-float,
a.initmu-whatsapp-float:link,
a.initmu-whatsapp-float:visited,
a[href*="chat.whatsapp.com"].initmu-whatsapp-float {
    position: fixed !important;
    right: 28px !important;
    bottom: 28px !important;
    top: auto !important;
    left: auto !important;
    width: 56px !important;
    height: 56px !important;
    min-width: 56px !important;
    min-height: 56px !important;
    max-width: 56px !important;
    max-height: 56px !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    border-radius: 50% !important;
    background: #25d366 !important;
    border: 2px solid rgba(236, 255, 244, 0.88) !important;
    z-index: 100000 !important;
    transform: none !important;
    text-decoration: none !important;
    line-height: 1 !important;
    box-shadow:
        0 0 0 4px rgba(37, 211, 102, 0.14),
        0 0 22px rgba(37, 211, 102, 0.54),
        0 14px 30px rgba(0, 0, 0, 0.55) !important;
}

a.initmu-whatsapp-float img,
a[href*="chat.whatsapp.com"].initmu-whatsapp-float img {
    width: 56px !important;
    height: 56px !important;
    min-width: 56px !important;
    min-height: 56px !important;
    max-width: 56px !important;
    max-height: 56px !important;
    object-fit: cover !important;
    display: block !important;
    border-radius: 50% !important;
    padding: 0 !important;
    margin: 0 !important;
}

a.initmu-whatsapp-float:hover {
    transform: scale(1.08) !important;
}

/* Status arriba derecha, incluso en páginas internas */
.initmu-top-status {
    position: fixed !important;
    top: 54px !important;
    right: 28px !important;
    left: auto !important;
    z-index: 9998 !important;
}

/* Rankings: contenedor y fondo oscuros */
body.initmu-rankings-page .module-contents,
body.initmu-rankings-page #content .module-contents {
    background:
        linear-gradient(180deg, rgba(5, 15, 34, 0.90), rgba(2, 7, 18, 0.94)) !important;
    border: 1px solid rgba(64, 169, 255, 0.62) !important;
    color: #dcefff !important;
    overflow: visible !important;
}

body.initmu-rankings-page .rankings_menu,
body.initmu-rankings-page .rankings-class-filter {
    background: rgba(3, 12, 30, 0.58) !important;
    border: 1px solid rgba(80, 170, 255, 0.16) !important;
    border-radius: 8px !important;
    padding: 10px !important;
}

body.initmu-rankings-page .rankings_menu a {
    color: #dbeeff !important;
    background: linear-gradient(180deg, rgba(13, 36, 70, 0.86), rgba(4, 13, 32, 0.90)) !important;
    border: 1px solid rgba(95, 175, 240, 0.28) !important;
    border-radius: 4px !important;
}

body.initmu-rankings-page .rankings_menu a.active,
body.initmu-rankings-page .rankings_menu a:hover {
    color: #ffffff !important;
    background: linear-gradient(180deg, rgba(23, 74, 130, 0.92), rgba(8, 25, 58, 0.94)) !important;
    border-color: rgba(128, 207, 255, 0.58) !important;
}

body.initmu-rankings-page .rankings-table,
body.initmu-rankings-page .module-contents .rankings-table,
body.initmu-rankings-page #content .module-contents .rankings-table {
    width: 88% !important;
    margin: 24px auto !important;
    background: rgba(3, 12, 29, 0.76) !important;
    border: 1px solid rgba(89, 169, 230, 0.28) !important;
    border-collapse: collapse !important;
    box-shadow:
        0 0 0 1px rgba(195, 145, 77, 0.14),
        0 0 24px rgba(0, 120, 255, 0.18),
        0 14px 30px rgba(0, 0, 0, 0.42) !important;
}

body.initmu-rankings-page .rankings-table tr:first-child td,
body.initmu-rankings-page .rankings-table tr:first-child th {
    background: linear-gradient(180deg, rgba(11, 31, 66, 0.96), rgba(4, 14, 36, 0.98)) !important;
    color: #9fe6ff !important;
    border-bottom: 1px solid rgba(105, 188, 255, 0.42) !important;
    text-shadow: 0 0 8px rgba(0, 145, 255, 0.36) !important;
}

/* Sin blanco: filas acero oscuro y azul oscuro */
body.initmu-rankings-page .rankings-table tr:nth-child(2n+2) td,
body.initmu-rankings-page .rankings-table tr:nth-child(2n+2) th {
    background: linear-gradient(180deg, rgba(42, 55, 70, 0.86), rgba(27, 39, 54, 0.88)) !important;
    color: #e4f1ff !important;
    border-color: rgba(118, 150, 184, 0.18) !important;
    text-shadow: none !important;
}

body.initmu-rankings-page .rankings-table tr:nth-child(2n+3) td,
body.initmu-rankings-page .rankings-table tr:nth-child(2n+3) th {
    background: rgba(6, 20, 48, 0.78) !important;
    color: #eaf6ff !important;
    border-color: rgba(75, 145, 215, 0.15) !important;
    text-shadow: none !important;
}

body.initmu-rankings-page .rankings-table td *,
body.initmu-rankings-page .rankings-table th * {
    color: inherit !important;
}

body.initmu-rankings-page .rankings-table tr:hover td {
    background: rgba(22, 62, 108, 0.86) !important;
    color: #ffffff !important;
}

body.initmu-rankings-page .rankings-table-place,
body.initmu-rankings-page .rankings-table tr td:first-child {
    color: #ffd76f !important;
    font-weight: 900 !important;
}

/* Iconos de clase: filtro superior y tabla */
body.initmu-rankings-page .rankings-class-filter-image {
    width: 64px !important;
    height: 64px !important;
    max-width: 64px !important;
    max-height: 64px !important;
    object-fit: cover !important;
    border-radius: 50% !important;
}

body.initmu-rankings-page .rankings-table .rankings-class-image {
    width: 42px !important;
    height: 42px !important;
    max-width: 42px !important;
    max-height: 42px !important;
    object-fit: cover !important;
    border-radius: 50% !important;
    border: 1px solid rgba(140, 205, 255, 0.58) !important;
    box-shadow: 0 0 12px rgba(0, 145, 255, 0.32) !important;
    transition: transform 180ms ease, box-shadow 180ms ease, filter 180ms ease !important;
}

body.initmu-rankings-page .rankings-table .rankings-class-image:hover {
    transform: scale(1.20) !important;
    filter: brightness(1.12) saturate(1.08) !important;
    box-shadow: 0 0 18px rgba(120, 205, 255, 0.72) !important;
}

@media (max-width: 991px) {
    .initmu-top-status {
        top: 58px !important;
        right: 12px !important;
        left: 12px !important;
    }

    a.initmu-whatsapp-float,
    a.initmu-whatsapp-float img {
        right: 14px !important;
        bottom: 16px !important;
        width: 52px !important;
        height: 52px !important;
        min-width: 52px !important;
        min-height: 52px !important;
        max-width: 52px !important;
        max-height: 52px !important;
    }

    body.initmu-rankings-page .rankings-table {
        width: 100% !important;
    }
}

/* =========================================================
   INITMU EMERGENCY FIX v9.0 - 2026-05-01
   Objetivo: recuperar main + rankings sin SVG gigante ni blanco fuerte.
   ========================================================= */

/* WhatsApp: se elimina dependencia del SVG. Aunque exista un img viejo, queda oculto. */
a.initmu-whatsapp-float,
a.initmu-whatsapp-float:link,
a.initmu-whatsapp-float:visited,
body a.initmu-whatsapp-float[href*="chat.whatsapp.com"] {
    position: fixed !important;
    right: 24px !important;
    bottom: 24px !important;
    top: auto !important;
    left: auto !important;
    width: 56px !important;
    height: 56px !important;
    min-width: 56px !important;
    min-height: 56px !important;
    max-width: 56px !important;
    max-height: 56px !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: radial-gradient(circle at 35% 30%, #39ef82 0%, #22c767 54%, #11964b 100%) !important;
    border: 2px solid rgba(220,255,235,.92) !important;
    box-shadow: 0 0 0 4px rgba(37,211,102,.14), 0 0 26px rgba(37,211,102,.64), 0 12px 30px rgba(0,0,0,.55) !important;
    transform: none !important;
    z-index: 2147483000 !important;
    text-decoration: none !important;
    line-height: 1 !important;
}

a.initmu-whatsapp-float > img,
a.initmu-whatsapp-float[href*="chat.whatsapp.com"] > img {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    max-width: 0 !important;
    max-height: 0 !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

.initmu-whatsapp-glyph,
a.initmu-whatsapp-float::before {
    color: #fff !important;
    font-family: Arial, Helvetica, sans-serif !important;
    font-size: 33px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    text-shadow: 0 2px 5px rgba(0,0,0,.35) !important;
}

a.initmu-whatsapp-float::before { content: ""; }
a.initmu-whatsapp-float:hover { transform: scale(1.08) !important; }

/* Server status: siempre arriba derecha, nunca texto suelto arriba izquierda. */
.initmu-top-status {
    position: fixed !important;
    top: 66px !important;
    right: 28px !important;
    left: auto !important;
    bottom: auto !important;
    z-index: 9000 !important;
    display: flex !important;
    gap: 8px !important;
    align-items: stretch !important;
    background: rgba(3, 12, 29, .76) !important;
    border: 1px solid rgba(64, 169, 255, .55) !important;
    border-radius: 8px !important;
    padding: 7px !important;
    color: #dcefff !important;
    text-indent: 0 !important;
}

.initmu-top-status .initmu-status-item {
    background: rgba(4, 17, 40, .72) !important;
    border: 1px solid rgba(75, 148, 220, .26) !important;
    border-radius: 6px !important;
    padding: 7px 10px !important;
    min-width: 94px !important;
}

/* Rankings: no depende solo del body class; Chrome soporta :has y además dejamos fallback genérico. */
body.initmu-rankings-page .module-contents,
body:has(.rankings-table) .module-contents,
#content .module-contents:has(.rankings-table) {
    background: linear-gradient(180deg, rgba(5,15,33,.94), rgba(2,8,20,.96)) !important;
    border: 1px solid rgba(58,155,255,.70) !important;
    border-radius: 12px !important;
    box-shadow: 0 0 24px rgba(0,105,210,.34), inset 0 0 38px rgba(0,12,32,.88) !important;
    color: #dceeff !important;
}

body.initmu-rankings-page .page-title,
body:has(.rankings-table) .page-title {
    color: #8ecaff !important;
    text-shadow: 0 0 14px rgba(68,168,255,.55) !important;
}

body.initmu-rankings-page .rankings_menu,
body:has(.rankings-table) .rankings_menu {
    width: 82% !important;
    margin: 0 auto 24px auto !important;
    text-align: center !important;
}

body.initmu-rankings-page .rankings_menu a,
body:has(.rankings-table) .rankings_menu a {
    background: linear-gradient(180deg, rgba(13,35,68,.88), rgba(4,14,32,.94)) !important;
    border: 1px solid rgba(87,166,245,.42) !important;
    color: #b9dfff !important;
    box-shadow: inset 0 0 14px rgba(0,73,150,.35) !important;
}

body.initmu-rankings-page .rankings_menu a.active,
body.initmu-rankings-page .rankings_menu a:hover,
body:has(.rankings-table) .rankings_menu a.active,
body:has(.rankings-table) .rankings_menu a:hover {
    color: #ffe4a0 !important;
    border-color: rgba(255,199,94,.72) !important;
    background: linear-gradient(180deg, rgba(33,61,92,.95), rgba(10,24,48,.96)) !important;
}

body.initmu-rankings-page .rankings-class-filter,
body:has(.rankings-table) .rankings-class-filter {
    display: flex !important;
    justify-content: center !important;
    align-items: flex-start !important;
    flex-wrap: wrap !important;
    gap: 14px !important;
    margin: 26px auto 34px auto !important;
}

body.initmu-rankings-page .rankings-class-filter-selection,
body:has(.rankings-table) .rankings-class-filter-selection {
    color: #d9eaff !important;
    text-align: center !important;
}

body.initmu-rankings-page .rankings-class-filter-selection img,
body:has(.rankings-table) .rankings-class-filter-selection img {
    width: 58px !important;
    height: 58px !important;
    min-width: 58px !important;
    min-height: 58px !important;
    max-width: 58px !important;
    max-height: 58px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    box-shadow: 0 0 12px rgba(120,190,255,.52) !important;
    transition: transform .18s ease, box-shadow .18s ease, filter .18s ease !important;
}

body.initmu-rankings-page .rankings-class-filter-selection:hover img,
body:has(.rankings-table) .rankings-class-filter-selection:hover img {
    transform: scale(1.20) !important;
    filter: brightness(1.13) saturate(1.12) !important;
    box-shadow: 0 0 22px rgba(134,205,255,.90) !important;
}

body.initmu-rankings-page .rankings-table,
body:has(.rankings-table) .rankings-table {
    width: 82% !important;
    background: rgba(3,12,28,.88) !important;
    border: 1px solid rgba(75,166,255,.34) !important;
    border-collapse: collapse !important;
    box-shadow: 0 0 24px rgba(0,80,170,.24) !important;
}

body.initmu-rankings-page .rankings-table tr:first-child td,
body.initmu-rankings-page .rankings-table tr:first-child th,
body:has(.rankings-table) .rankings-table tr:first-child td,
body:has(.rankings-table) .rankings-table tr:first-child th {
    background: linear-gradient(180deg, rgba(14,43,80,.97), rgba(6,21,48,.98)) !important;
    color: #94ccff !important;
    border-bottom: 2px solid rgba(87,166,245,.82) !important;
    font-weight: 900 !important;
}

body.initmu-rankings-page .rankings-table tr:nth-child(even) td,
body:has(.rankings-table) .rankings-table tr:nth-child(even) td {
    background: linear-gradient(180deg, rgba(34,46,62,.96), rgba(26,36,51,.97)) !important;
    color: #e3edf8 !important;
    border-bottom: 1px solid rgba(130,178,230,.16) !important;
}

body.initmu-rankings-page .rankings-table tr:nth-child(odd):not(:first-child) td,
body:has(.rankings-table) .rankings-table tr:nth-child(odd):not(:first-child) td {
    background: linear-gradient(180deg, rgba(7,23,52,.94), rgba(5,16,38,.96)) !important;
    color: #dcecff !important;
    border-bottom: 1px solid rgba(130,178,230,.13) !important;
}

body.initmu-rankings-page .rankings-table tr:hover td,
body:has(.rankings-table) .rankings-table tr:hover td {
    background: linear-gradient(180deg, rgba(24,70,116,.94), rgba(9,33,72,.96)) !important;
    color: #ffffff !important;
}

body.initmu-rankings-page .rankings-table .rankings-class-image,
body:has(.rankings-table) .rankings-table .rankings-class-image {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    max-width: 42px !important;
    max-height: 42px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    box-shadow: 0 0 12px rgba(130,200,255,.60) !important;
    transition: transform .18s ease, box-shadow .18s ease !important;
}

body.initmu-rankings-page .rankings-table .rankings-class-image:hover,
body:has(.rankings-table) .rankings-table .rankings-class-image:hover {
    transform: scale(1.20) !important;
    box-shadow: 0 0 22px rgba(140,210,255,.95) !important;
}

@media (max-width: 991px) {
    a.initmu-whatsapp-float { right: 16px !important; bottom: 16px !important; width: 52px !important; height: 52px !important; min-width: 52px !important; min-height: 52px !important; max-width: 52px !important; max-height: 52px !important; }
    .initmu-top-status { top: 54px !important; right: 12px !important; transform: scale(.88); transform-origin: top right; }
}

/* =========================================================
   INITMU v10 - WhatsApp icon visual-only fix
   Mantiene el botón del v9, solo cambia el icono por CSS controlado.
   ========================================================= */
a.initmu-whatsapp-float {
    position: fixed !important;
    right: 24px !important;
    bottom: 24px !important;
    top: auto !important;
    left: auto !important;
    width: 56px !important;
    height: 56px !important;
    min-width: 56px !important;
    min-height: 56px !important;
    max-width: 56px !important;
    max-height: 56px !important;
    border-radius: 50% !important;
    overflow: hidden !important;
    background: #25d366 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 2147483000 !important;
}

a.initmu-whatsapp-float > img:not(.initmu-whatsapp-icon) {
    display: none !important;
}

a.initmu-whatsapp-float .initmu-whatsapp-glyph {
    display: none !important;
}

a.initmu-whatsapp-float .initmu-whatsapp-icon-css {
    display: block !important;
    width: 34px !important;
    height: 34px !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath fill='white' d='M32 6C17.6 6 6 17.1 6 30.8c0 5.2 1.7 10 4.6 14L7.6 58l13.7-3.6A26.9 26.9 0 0 0 32 56c14.4 0 26-11.1 26-25.2S46.4 6 32 6zm0 45.7c-3.5 0-6.9-.9-9.9-2.6l-.7-.4-8.1 2.1 2.2-7.8-.5-.8a20.1 20.1 0 0 1-3.1-10.7C11.9 20 20.9 10.6 32 10.6S52.1 20 52.1 31.5 43.1 51.7 32 51.7z'/%3E%3Cpath fill='white' d='M43.4 36.7c-.6-.3-3.5-1.7-4.1-1.9-.5-.2-.9-.3-1.3.3-.4.6-1.5 1.9-1.9 2.3-.3.4-.7.5-1.3.2-.6-.3-2.5-.9-4.8-2.9a18 18 0 0 1-3.3-4.1c-.3-.6 0-.9.3-1.2.3-.3.6-.7.9-1 .3-.4.4-.6.6-1 .2-.4.1-.8 0-1.1-.2-.3-1.3-3.1-1.8-4.2-.5-1.1-.9-.9-1.3-.9h-1.1c-.4 0-1 .1-1.5.7-.5.6-2 2-2 4.9s2.1 5.6 2.4 6c.3.4 4.1 6.4 10.1 8.9 1.4.6 2.5 1 3.4 1.3 1.4.4 2.7.4 3.7.2 1.1-.2 3.5-1.4 4-2.8.5-1.4.5-2.6.4-2.8-.2-.4-.6-.6-1.2-.9z'/%3E%3C/svg%3E") !important;
}

/* =========================================================
   INITMU v11 - Micro fix: video layer + centered status + glow pulse
   Solo ajuste visual menor. No toca rankings, backend ni datos.
   ========================================================= */
html {
    background: #071322 !important;
}

body {
    background-color: transparent !important;
}

#bg-video {
    display: block !important;
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    min-width: 100vw !important;
    min-height: 100vh !important;
    object-fit: cover !important;
    z-index: 0 !important;
    opacity: 1 !important;
    pointer-events: none !important;
    filter: none !important;
    transform: translateZ(0) !important;
}

.video-overlay {
    position: fixed !important;
    inset: 0 !important;
    z-index: 1 !important;
    pointer-events: none !important;
    background:
        radial-gradient(circle at 50% 18%, rgba(75, 170, 255, 0.08), transparent 42%),
        rgba(3, 9, 20, 0.28) !important;
}

#header,
#navbar,
#container,
#footer {
    position: relative !important;
    z-index: 2 !important;
}

.initmu-top-status {
    position: fixed !important;
    z-index: 9000 !important;
}

a.initmu-whatsapp-float {
    position: fixed !important;
    z-index: 2147483000 !important;
}

.initmu-top-status .initmu-status-item,
.initmu-top-status .initmu-status-label,
.initmu-top-status .initmu-status-value {
    text-align: center !important;
}

.initmu-top-status .initmu-status-value {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 5px !important;
}

.initmu-online-dot {
    animation: initmuStatusTextGlow 1.65s ease-in-out infinite !important;
}

.initmu-online-dot::before {
    flex: 0 0 auto !important;
    margin-right: 2px !important;
    animation: initmuStatusDotPulse 1.2s ease-in-out infinite !important;
}

@keyframes initmuStatusDotPulse {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 0 8px rgba(32, 255, 128, 0.75), 0 0 0 0 rgba(32, 255, 128, 0.42);
    }
    50% {
        transform: scale(1.18);
        box-shadow: 0 0 14px rgba(32, 255, 128, 1), 0 0 0 7px rgba(32, 255, 128, 0);
    }
}

@keyframes initmuStatusTextGlow {
    0%, 100% {
        text-shadow: 0 0 7px rgba(32, 255, 128, 0.55);
    }
    50% {
        text-shadow: 0 0 13px rgba(32, 255, 128, 1), 0 0 23px rgba(32, 255, 128, 0.42);
    }
}


/* =========================================================
   INITMU DOWNLOADS + INFO MICROFIX v12
   - Downloads sin cajas blancas vacías
   - Información con labels corregidos y foco visual FREE/VIP
   ========================================================= */

.initmu-downloads-page .panel-downloads,
.initmu-downloads-page .initmu-downloads-panel {
    background: linear-gradient(180deg, rgba(4, 15, 37, 0.94), rgba(2, 10, 28, 0.95)) !important;
    border: 1px solid rgba(63, 177, 255, 0.45) !important;
    border-radius: 10px !important;
    overflow: hidden !important;
    box-shadow:
        0 0 0 1px rgba(0, 90, 180, 0.30),
        0 0 22px rgba(0, 120, 255, 0.18),
        inset 0 0 26px rgba(0, 18, 50, 0.72) !important;
    color: #e7f4ff !important;
}

.initmu-downloads-page .panel-downloads .panel-body,
.initmu-downloads-page .initmu-downloads-panel .panel-body {
    background: transparent !important;
    padding: 0 !important;
}

.initmu-downloads-page .panel-downloads .panel-title,
.initmu-downloads-page .initmu-downloads-panel .panel-title {
    margin: 0 !important;
    padding: 16px 18px !important;
    background: linear-gradient(180deg, rgba(10, 38, 78, 0.92), rgba(5, 22, 54, 0.92)) !important;
    border-bottom: 1px solid rgba(85, 190, 255, 0.26) !important;
    color: #90d9ff !important;
    font-size: 18px !important;
    font-weight: 900 !important;
    text-shadow: 0 0 12px rgba(0, 145, 255, 0.38) !important;
}

.initmu-downloads-page .initmu-downloads-table {
    margin: 0 !important;
    background: transparent !important;
}

.initmu-downloads-page .initmu-downloads-table tr td {
    border-top: 1px solid rgba(78, 128, 176, 0.16) !important;
    border-bottom: 1px solid rgba(10, 25, 46, 0.32) !important;
    vertical-align: middle !important;
}

.initmu-downloads-page .initmu-downloads-table tr:nth-child(odd) td {
    background: rgba(8, 24, 55, 0.62) !important;
    color: #edf6ff !important;
}

.initmu-downloads-page .initmu-downloads-table tr:nth-child(even) td {
    background: linear-gradient(180deg, rgba(184, 195, 208, 0.86), rgba(161, 174, 188, 0.86)) !important;
    color: #213447 !important;
}

.initmu-downloads-page .initmu-downloads-table tr:nth-child(even) td *,
.initmu-downloads-page .initmu-downloads-table tr:nth-child(even) td .download-description {
    color: #213447 !important;
    text-shadow: none !important;
}

.initmu-downloads-page .initmu-download-title {
    display: inline-block;
    font-weight: 800;
    color: inherit !important;
}

.initmu-downloads-page .download-description {
    position: static !important;
    top: auto !important;
    display: inline-block;
    margin-top: 4px;
    font-size: 11px;
    color: rgba(226, 241, 255, 0.82) !important;
}

.initmu-downloads-page .initmu-downloads-col-main { width: 60%; }
.initmu-downloads-page .initmu-downloads-col-size { width: 18%; font-weight: 700; }
.initmu-downloads-page .initmu-downloads-col-action { width: 22%; }

.initmu-download-btn {
    min-width: 96px !important;
    padding: 8px 14px !important;
    border-radius: 8px !important;
    border: 1px solid rgba(88, 191, 255, 0.42) !important;
    background: linear-gradient(180deg, rgba(12, 129, 222, 0.96), rgba(5, 57, 120, 0.98)) !important;
    box-shadow:
        0 0 12px rgba(0, 132, 255, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
    color: #f4fbff !important;
    font-weight: 800 !important;
    text-transform: uppercase;
    letter-spacing: 0.35px;
}

.initmu-download-btn:hover {
    filter: brightness(1.08) !important;
    transform: translateY(-1px);
}

.initmu-downloads-empty {
    padding: 18px 18px 20px !important;
    background: rgba(10, 26, 55, 0.44) !important;
    color: #d9ebfb !important;
    text-align: center !important;
    font-weight: 700;
    border-top: 1px solid rgba(73, 153, 219, 0.12) !important;
}

.initmu-info-page h2 {
    color: #eef8ff !important;
    text-shadow: 0 0 14px rgba(0, 139, 255, 0.28) !important;
    margin: 18px 0 12px !important;
}

.initmu-info-table {
    border: 1px solid rgba(70, 146, 214, 0.28) !important;
    box-shadow:
        0 0 0 1px rgba(0, 90, 180, 0.12),
        0 0 16px rgba(0, 120, 255, 0.10) !important;
}

.initmu-info-table td,
.initmu-info-table th {
    transition: background .18s ease, color .18s ease;
}

.initmu-info-table .initmu-table-heading {
    font-weight: 800 !important;
    letter-spacing: 0.25px;
}

.initmu-info-table .initmu-rate-free,
.initmu-info-table .initmu-rate-vip {
    font-weight: 900 !important;
    letter-spacing: 0.45px;
}

.initmu-info-table .initmu-rate-free {
    color: #eef8ff !important;
    text-shadow: 0 0 10px rgba(110, 190, 255, 0.34) !important;
}

.initmu-info-table .initmu-rate-vip {
    color: #ffe7a6 !important;
    text-shadow:
        0 0 10px rgba(255, 194, 67, 0.38),
        0 0 18px rgba(255, 152, 0, 0.20) !important;
}

.initmu-info-page iframe.initmu-info-video-frame {
    display: block;
    margin: 0 auto;
}


/* =========================================================
   INITMU INFO VIP FOCUS MICROFIX v13
   VIP debe verse mejor que FREE sin romper la tabla.
   ========================================================= */

.initmu-info-table .initmu-rate-free {
    position: relative !important;
    color: #d9e9f7 !important;
    font-weight: 800 !important;
    text-shadow: 0 0 7px rgba(100, 170, 230, 0.22) !important;
    box-shadow: none !important;
}

.initmu-info-table .initmu-rate-vip {
    position: relative !important;
    overflow: hidden !important;
    color: #fff0bd !important;
    font-weight: 950 !important;
    letter-spacing: 0.75px !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.16), rgba(255, 214, 103, 0.08) 34%, rgba(10, 24, 52, 0.20)) !important;
    box-shadow:
        inset 0 2px 0 rgba(255, 255, 255, 0.72),
        inset 0 3px 0 rgba(255, 213, 92, 0.34),
        0 0 12px rgba(255, 199, 70, 0.20) !important;
    text-shadow:
        0 0 8px rgba(255, 255, 255, 0.34),
        0 0 13px rgba(255, 200, 63, 0.48),
        0 0 22px rgba(255, 146, 0, 0.25) !important;
}

.initmu-info-table .initmu-rate-vip::after {
    content: "";
    position: absolute;
    left: 14%;
    right: 14%;
    top: 4px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.95), rgba(255,217,113,0.82), transparent);
    box-shadow: 0 0 8px rgba(255, 237, 180, 0.45);
    pointer-events: none;
}


/* =========================================================
   INITMU URGENT RESPONSIVE + LIVE STATUS FIX v14
   - Estado OFFLINE real cuando GameServer/ConnectServer no responden
   - Logo, navbar, container y cajas dejan de quedar rígidos
   - Mobile/tablet usable sin scroll horizontal forzado
   ========================================================= */

html {
    min-width: 0 !important;
    width: 100% !important;
    overflow-x: hidden !important;
}

body {
    min-width: 0 !important;
    width: 100% !important;
    overflow-x: hidden !important;
}

#bg-video {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    object-fit: cover !important;
}

#header {
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: clamp(72px, 10vw, 120px) 16px clamp(28px, 4vw, 45px) !important;
    box-sizing: border-box !important;
    text-align: center !important;
    overflow: visible !important;
}

#header a {
    display: inline-flex !important;
    justify-content: center !important;
    align-items: center !important;
    max-width: 100% !important;
}

#header img {
    width: auto !important;
    height: auto !important;
    max-width: clamp(210px, 34vw, 390px) !important;
    max-height: clamp(150px, 24vw, 285px) !important;
    object-fit: contain !important;
    margin: 0 auto !important;
}

#navbar {
    width: calc(100% - 32px) !important;
    max-width: 1275px !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

#navbar ul {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 0 !important;
}

#navbar ul li {
    float: none !important;
}

#navbar ul li a {
    padding: 18px 22px !important;
    white-space: nowrap !important;
}

#container {
    width: calc(100% - 32px) !important;
    max-width: 1300px !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

#content {
    min-width: 0 !important;
    width: 100% !important;
    overflow: visible !important;
    box-sizing: border-box !important;
}

.module-contents,
.panel,
.panel-sidebar,
.panel-downloads,
.initmu-serverinfo-panel {
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.module-contents {
    overflow-x: auto !important;
}

.footer > .footer-container {
    width: calc(100% - 32px) !important;
    max-width: 1300px !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

.initmu-top-status .initmu-users-online-value {
    text-align: center !important;
    justify-content: center !important;
}

.initmu-status-offline {
    color: #ff6969 !important;
    font-weight: 900 !important;
    text-shadow:
        0 0 8px rgba(255, 45, 45, 0.48),
        0 0 16px rgba(255, 20, 20, 0.26) !important;
}

.initmu-status-offline::before {
    content: "";
    display: inline-block;
    width: 9px;
    height: 9px;
    margin-right: 6px;
    border-radius: 50%;
    background: #ff3434;
    box-shadow:
        0 0 8px rgba(255, 52, 52, 0.78),
        0 0 16px rgba(255, 52, 52, 0.32);
    vertical-align: middle;
}

/* Tablet */
@media (max-width: 1199px) {
    .initmu-top-status {
        top: 54px !important;
        right: 14px !important;
        transform: scale(0.92);
        transform-origin: top right;
    }

    #navbar ul li a {
        padding: 15px 18px !important;
        font-size: 15px !important;
    }

    #container {
        width: calc(100% - 24px) !important;
    }
}

/* Tablet chica / mobile: apilar sidebars y contenido */
@media (max-width: 991px) {
    #header {
        padding-top: 88px !important;
        padding-bottom: 24px !important;
    }

    #header img {
        max-width: min(280px, 72vw) !important;
        max-height: 210px !important;
    }

    #navbar {
        width: calc(100% - 20px) !important;
    }

    #navbar ul li a {
        padding: 12px 14px !important;
        font-size: 14px !important;
    }

    #container {
        width: calc(100% - 20px) !important;
        padding-top: 12px !important;
    }

    #content > .col-xs-3,
    #content > .col-xs-6,
    #content > .col-xs-12 {
        float: none !important;
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        margin-bottom: 16px !important;
    }

    .module-contents {
        min-height: 0 !important;
        padding: 14px 12px 22px !important;
    }

    .panel-sidebar,
    .panel {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .initmu-whatsapp-float {
        right: 18px !important;
        bottom: 18px !important;
    }
}

/* Mobile */
@media (max-width: 640px) {
    .initmu-top-status {
        position: absolute !important;
        top: 54px !important;
        right: 10px !important;
        left: 10px !important;
        width: auto !important;
        justify-content: center !important;
        transform: none !important;
    }

    .initmu-status-item {
        min-width: 0 !important;
        flex: 1 1 0 !important;
        padding: 7px 6px 6px !important;
    }

    .initmu-status-label {
        font-size: 9px !important;
    }

    .initmu-status-value {
        font-size: 12px !important;
    }

    #header {
        padding-top: 124px !important;
    }

    #header img {
        max-width: min(230px, 76vw) !important;
        max-height: 180px !important;
    }

    #navbar ul li {
        width: 50% !important;
    }

    #navbar ul li a {
        display: block !important;
        width: 100% !important;
        padding: 11px 6px !important;
        font-size: 13px !important;
        text-align: center !important;
    }

    table {
        font-size: 12px !important;
    }

    .module-contents {
        border-width: 2px !important;
        border-radius: 8px !important;
    }
}


/* =========================================================
   INITMU v12 - Downloads visual fix + MVP safe panels
   Corrige paneles blancos de Descargas sin tocar backend.
   ========================================================= */
.module-contents .panel-downloads,
body:has(.panel-downloads) .module-contents .panel-downloads {
    background: linear-gradient(180deg, rgba(6, 18, 42, .93), rgba(4, 12, 29, .96)) !important;
    border: 1px solid rgba(75, 166, 255, .42) !important;
    box-shadow: 0 0 18px rgba(0, 105, 210, .24), inset 0 0 22px rgba(0, 12, 32, .62) !important;
    color: #dceeff !important;
    border-radius: 8px !important;
    overflow: hidden !important;
}

.module-contents .panel-downloads .panel-heading,
body:has(.panel-downloads) .module-contents .panel-downloads .panel-heading {
    background: linear-gradient(180deg, rgba(12, 55, 105, .88), rgba(5, 22, 51, .92)) !important;
    border-bottom: 1px solid rgba(75, 166, 255, .38) !important;
    color: #8ee8ff !important;
}

.module-contents .panel-downloads .panel-title,
.module-contents .panel-downloads .panel-title a,
body:has(.panel-downloads) .module-contents .panel-downloads .panel-title,
body:has(.panel-downloads) .module-contents .panel-downloads .panel-title a {
    color: #8ee8ff !important;
    text-shadow: 0 0 10px rgba(100, 210, 255, .52) !important;
    font-weight: 800 !important;
}

.module-contents .panel-downloads .panel-body,
body:has(.panel-downloads) .module-contents .panel-downloads .panel-body {
    background: rgba(2, 8, 20, .46) !important;
    color: #dceeff !important;
}

.module-contents .panel-downloads .download-description,
body:has(.panel-downloads) .module-contents .panel-downloads .download-description {
    color: #b8d9f4 !important;
}

.module-contents .panel-downloads a.btn,
.module-contents .panel-downloads .btn,
body:has(.panel-downloads) .module-contents .panel-downloads a.btn,
body:has(.panel-downloads) .module-contents .panel-downloads .btn {
    background: linear-gradient(180deg, #0871c9, #014a8a) !important;
    border: 1px solid rgba(120, 210, 255, .62) !important;
    color: #ffffff !important;
    box-shadow: 0 0 14px rgba(0, 140, 255, .28) !important;
    font-weight: 700 !important;
}

body.initmu-rankings-page .rankings-class-filter-selection span,
body:has(.rankings-table) .rankings-class-filter-selection span {
    display: block !important;
    margin-top: 4px !important;
    font-weight: 800 !important;
    letter-spacing: .25px !important;
    color: #e6f7ff !important;
    text-shadow: 0 0 8px rgba(100, 210, 255, .42) !important;
}
