/* VLR.gg "Midnight Protocol" Theme v2.0 */
:root {
    /* Paleta Midnight basada en tu referencia */
    --bg-main: #0b0e12;       /* Fondo general muy oscuro */
    --bg-card: #151921;       /* Fondo de tarjetas */
    --bg-hover: #1e232e;      /* Color al pasar el mouse */
    --bg-header: #151921;     /* Header */
    
    --text-main: #e0e6ed;     /* Texto principal blanco hueso */
    --text-muted: #8b9bb4;    /* Texto secundario gris azulado */
    
    --accent: #4fffa8;        /* Cian/Verde menta para acentos (como la referencia) */
    --accent-red: #ff4655;    /* Rojo Valorant original */
    
    --border-color: #252a33;  /* Bordes muy sutiles */
    --radius: 12px;           /* Bordes redondeados modernos */
}

/* --- BASE & FONDO --- */
body {
    background-color: var(--bg-main) !important;
    color: var(--text-main) !important;
    font-family: 'Inter', 'Roboto', sans-serif !important;
}

a { color: var(--text-main) !important; text-decoration: none !important; transition: 0.2s; }
a:hover { color: var(--accent) !important; }

/* --- HEADER --- */
.header {
    background-color: var(--bg-header) !important;
    border-bottom: 1px solid var(--border-color) !important;
    padding: 10px 0 !important;
}
.header-nav-item {
    border-radius: 6px !important;
    margin: 0 5px !important;
}
.header-nav-item:hover {
    background: var(--bg-hover) !important;
    color: var(--accent) !important;
}

/* --- TARJETAS Y MÓDULOS (La parte clave) --- */
.wf-card, .wf-module, .mod-sidebar {
    background-color: var(--bg-card) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: var(--radius) !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.2) !important;
    padding: 20px !important;
    margin-bottom: 24px !important;
}

/* Títulos de secciones (ej: UPCOMING MATCHES) */
.wf-label {
    background: transparent !important;
    color: var(--text-muted) !important;
    border: none !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 1.5px !important;
    text-transform: uppercase;
    margin-bottom: 12px !important;
    padding-left: 5px !important;
}

/* --- LISTAS DE ELEMENTOS (Foros, Partidos, Noticias) --- */

/* Filas individuales */
.wf-module-item, .news-item, .thread-item, .event-item {
    background: transparent !important;
    border-bottom: 1px solid var(--border-color) !important;
    border-radius: 6px !important;
    margin-bottom: 4px !important;
    padding: 10px !important;
    transition: all 0.2s ease !important;
}

/* Efecto Hover */
.wf-module-item:hover, .news-item:hover {
    background-color: var(--bg-hover) !important;
    transform: translateX(4px);
    border-left: 3px solid var(--accent) !important;
}

/* Corrección específica para la columna derecha (Eventos) que se veía mal */
.event-item {
    padding-left: 10px !important;
    margin-left: 0 !important;
}
.event-item::before {
    display: none !important; /* Elimina la línea de tiempo fea */
}

/* --- PARTIDOS (Matches) --- */
.h-match-team-score {
    background: rgba(0,0,0,0.4) !important;
    color: var(--accent) !important;
    border-radius: 4px;
    padding: 2px 6px;
}
.mod-live {
    background-color: var(--accent-red) !important;
    box-shadow: 0 0 10px rgba(255, 70, 85, 0.4);
    animation: pulse 2s infinite;
}

/* --- NOTICIAS (Imagen principal) --- */
.news-feature {
    border-radius: var(--radius) !important;
    overflow: hidden;
    border: 1px solid var(--border-color);
}
.news-feature-caption {
    background: linear-gradient(0deg, rgba(11,14,18,0.95) 0%, transparent 100%) !important;
}

/* --- FORMULARIOS Y BUSCADOR --- */
input[type="text"], input[type="search"] {
    background-color: var(--bg-main) !important;
    border: 1px solid var(--border-color) !important;
    color: white !important;
    border-radius: 6px !important;
    padding: 8px 12px !important;
}

/* --- TEXTOS Y DETALLES --- */
.ge-text-light { color: var(--text-muted) !important; }
.reply-count { color: var(--text-muted) !important; }

/* Ocultar elementos molestos o viejos de VLR */
.wf-module-item.mod-disc { padding-left: 10px !important; }
.div { border-color: var(--border-color) !important; }

/* Scrollbar personalizada para que combine */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: var(--bg-main); }
::-webkit-scrollbar-thumb { background: #2c3545; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--accent); }

@keyframes pulse {
    0% { opacity: 1; }
    50% { opacity: 0.7; }
    100% { opacity: 1; }
}