/*
 * PANAMERA2 - CAMBIO DE COLORES A MORADO
 * Solo cambia colores, NO rompe estructura
 * ==========================================
 */

/* ====================== */
/* VARIABLES              */
/* ====================== */
:root {
    --p-dark: #1a0a2e;
    --p-medium: #2d1b4e;
    --p-accent: #8b5cf6;
    --p-light: #a78bfa;
    --p-glow: rgba(139, 92, 246, 0.5);
}

/* ======================================= */
/* FIX GLOBAL CLICK ISSUES/ERRORES CLICKS  */
/* ======================================= */
.pixarts-header {
    pointer-events: none;
    /* El header contenedor no debe bloquear */
}

.pixarts-header .pixarts-nav,
.pixarts-header .fake-logo,
.pixarts-header .fake-pixarts,
.pixarts-header .pixarts-container {
    pointer-events: auto !important;
    /* Los hijos importantes si */
}

/* ======================================= */
/* FILTRO PARA CAMBIAR IMÁGENES ROJAS A    */
/* MORADO SIN EDITAR LOS ARCHIVOS PNG      */
/* ======================================= */

/* Filtro hue-rotate: 280deg cambia rojo a morado */
.box-sm-v1 .heading {
    filter: hue-rotate(280deg) saturate(1.2) !important;
}

.box-sm-v1 .inner.login-box,
.box-sm-v1 .inner.loggedin-box {
    filter: hue-rotate(280deg) saturate(1.1) !important;
}

/* Stats lanes */
.lane-stat,
.stats-box .lane-stat {
    filter: hue-rotate(280deg) saturate(1.2) !important;
}

/* ======================================= */
/* FIX: El header tiene overflow:hidden    */
/* que corta los elementos posicionados    */
/* ======================================= */
.pixarts-header {
    overflow: visible !important;
}

/* Header stat boxes */
.pixarts-header .header-dod .stat-box::before {
    filter: hue-rotate(280deg) saturate(1.3) !important;
}

/* ======================================= */
/* HEADER - STAT BOXES (Online counters)   */
/* ======================================= */

/* Contenedor de las stat boxes - POSICION ABSOLUTA para que aparezcan */
.pixarts-header .header-dod {
    display: flex !important;
    -webkit-box-pack: start !important;
    -ms-flex-pack: start !important;
    justify-content: flex-start !important;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: absolute !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    top: 180px !important;
    width: 1260px !important;
    max-width: 1260px !important;
    z-index: 20 !important;
    pointer-events: none !important;
    /* FIX: Permitir clicks a través del contenedor vacío */
}

/* Cada stat box individual - mismo selector que style.min.css */
.pixarts-header .header-dod .stat-box {
    width: 145px !important;
    margin-right: 15px !important;
    height: 145px !important;
    z-index: 15 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: center !important;
    position: relative !important;
    overflow: hidden !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    /* FIX: Permitir clicks en las cajas de stats */
    /* Quitar el filtro para que el fondo se vea bien */
}

/* Número grande - selector exacto */
.pixarts-header .header-dod .stat-box strong {
    font-size: 20px !important;
    font-family: "Trajan Pro", serif !important;
    color: var(--p-accent) !important;
    text-shadow: 0 0 15px var(--p-glow) !important;
    font-weight: bold !important;
    width: auto !important;
    margin-left: 30px !important;
    padding-right: 10px !important;
    text-align: center !important;
    line-height: 1.2 !important;
    height: auto !important;
    display: block !important;
}

/* Texto "Online" - selector exacto */
.pixarts-header .header-dod .stat-box span.info-stat {
    font-size: 12px !important;
    font-family: 'Trajan Pro', serif !important;
    color: var(--p-light) !important;
    line-height: 1 !important;
    max-width: 85px !important;
    text-align: center !important;
    margin: 0px -5px !important;
    display: block !important;
}

/* Navegación del usuario logueado */
.box-sm-v1 .inner.loggedin-box .navs a {
    filter: hue-rotate(280deg) !important;
}

/* Inputs de login */
.box-sm-v1 .inner.login-box form>label.password,
.box-sm-v1 .inner.login-box form>label.username {
    filter: hue-rotate(280deg) !important;
}

/* Botón de login */
.box-sm-v1 .inner.login-box form button {
    filter: hue-rotate(280deg) saturate(1.2) !important;
}

/* Ranking show full button */
.rank-add {
    filter: hue-rotate(280deg) !important;
}

/* Footer background */
.pixarts-footer {
    filter: hue-rotate(280deg) saturate(0.9) !important;
}

/* ======================================= */
/* MÁS ELEMENTOS CON FILTRO                */
/* ======================================= */

/* Ranking tables - encabezado y filas */
.rank .pix-tab.p-thead {
    filter: hue-rotate(280deg) saturate(1.2) !important;
}

/* Todo el contenedor de ranking */
.rank {
    filter: hue-rotate(280deg) saturate(1.1) !important;
}

/* Newsfeed area */
.newsfeed {
    filter: hue-rotate(280deg) saturate(1.0) !important;
}

/* Navegación del header - Fondo semitransparente morado oscuro */
.pixarts-header .pixarts-nav {
    margin-top: -80px !important;
    /* SUBIR TODA LA BARRA MORADA */
    position: relative !important;
    z-index: 10 !important;
}

.pixarts-header .pixarts-nav::before {
    background: linear-gradient(to right, rgba(26, 10, 46, 0.95), rgba(45, 27, 78, 0.95), rgba(26, 10, 46, 0.95)) !important;
    border-bottom: 1px solid rgba(139, 92, 246, 0.3);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
    filter: none !important;
    /* Quitar filtro anterior que podría estar oscureciendo demasiado */
}

/* Contenedor principal fondo */
.pixarts-body .pixarts-container.main {
    filter: hue-rotate(280deg) saturate(0.95) !important;
}

/* Borde inferior del contenedor */
.pixarts-body .pixarts-container.main::after {
    border-color: var(--p-accent) !important;
}

/* Menú de navegación hover */
.pixarts-header .pixarts-nav ul li.active,
.pixarts-header .pixarts-nav ul li:hover {
    color: var(--p-accent) !important;
}

/* Menú de navegación hover */
.pixarts-header .pixarts-nav ul li.active,
.pixarts-header .pixarts-nav ul li:hover {
    color: #fff !important;
    text-shadow: 0 0 10px #a78bfa;
}

/* Texto del menú - Hacerlo más blanco/brillante */
.pixarts-header .pixarts-nav ul li {
    color: #e9d5ff !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
    transition: all 0.3s ease;
}

/* Destacar Link de Registro en Barra Top */
.pixarts-header .pixarts-nav ul li a[href*="register"] {
    color: #d8b4fe !important;
    text-shadow: 0 0 15px rgba(167, 139, 250, 0.6);
    border-bottom: 2px solid #8b5cf6;
}

.pixarts-header .pixarts-nav ul li a[href*="register"]:hover {
    color: #fff !important;
    text-shadow: 0 0 20px rgba(167, 139, 250, 0.9);
}

/* ====================== */
/* CAMBIAR ROJOS A MORADOS */
/* ====================== */

/* Bordes de cajas - de rojo a morado */
.box-sm-v1 {
    border-color: var(--p-accent) !important;
}

/* ======================================= */
/* FIX: POSICIÓN DE LOGO CABECERA          */
/* ======================================= */
.pixarts-header .logo-head {
    /* SEPARACION TOTAL DEL MENU */
    position: absolute !important;
    top: 130px !important;
    /* Bajarlo casi a los contadores */
    left: 50% !important;
    transform: translateX(-50%) !important;
    margin-top: 0 !important;
    /* Resetear marge negativo anterior */
    z-index: 25 !important;
    width: 100% !important;
    text-align: center !important;
    pointer-events: auto !important;
}

.pixarts-header .logo-head img {
    max-height: 180px !important;
    /* Controlar altura por si acaso */
    width: auto !important;
    transition: transform 0.3s ease;
}

.pixarts-header .logo-head:hover img {
    transform: scale(1.05);
    /* Efecto zoom al pasar mouse */
    filter: drop-shadow(0 0 15px rgba(167, 139, 250, 0.8));
}

/* Encabezados de cajas */
.box-sm-v1 .heading {
    background: linear-gradient(180deg, var(--p-medium) 0%, var(--p-dark) 100%) !important;
    border-color: var(--p-accent) !important;
}

/* Números de estadísticas */
.stats-box strong,
.lane-stat strong,
.stat-box strong,
.odometer {
    color: var(--p-accent) !important;
    text-shadow: 0 0 10px var(--p-glow) !important;
}

/* Links y textos destacados */
a:hover {
    color: var(--p-light) !important;
}

/* Botones */
.login-box button,
button[type="submit"],
.btn-primary,
.btn {
    background: linear-gradient(180deg, var(--p-accent) 0%, var(--p-medium) 100%) !important;
    border-color: var(--p-accent) !important;
}

.login-box button:hover,
button[type="submit"]:hover {
    background: linear-gradient(180deg, var(--p-light) 0%, var(--p-accent) 100%) !important;
}

/* Inputs focus */
input:focus,
textarea:focus {
    border-color: var(--p-accent) !important;
    box-shadow: 0 0 10px var(--p-glow) !important;
}

/* Tags/badges */
.tag,
.badge,
span.tag {
    background: var(--p-accent) !important;
}

/* Menú de navegación hover */
.pixarts-nav ul li a:hover,
.pixarts-nav ul li.active a {
    color: var(--p-light) !important;
}

/* Rankings - encabezados */
.rank .pix-tab.p-thead {
    background: linear-gradient(180deg, var(--p-medium) 0%, var(--p-dark) 100%) !important;
}

/* Filas hover */
.rank .pix-tab.p-tbody .lane:hover,
.ranking li a:hover,
.user-menu a:hover {
    background: rgba(139, 92, 246, 0.2) !important;
}

/* Username en ranking */
.rank .pix-tab.p-tbody .lane .username {
    color: var(--p-light) !important;
}

/* Footer */
.pixarts-footer {
    border-top-color: var(--p-accent) !important;
}

/* Scrollbar */
::-webkit-scrollbar-thumb {
    background: var(--p-medium) !important;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--p-accent) !important;
}

/* Stat boxes en header */
.header-dod .stat-box {
    border-color: var(--p-accent) !important;
}

/* Botón de agregar noticia */
.newsfeed button,
.newsfeed .btn {
    background: linear-gradient(180deg, var(--p-accent) 0%, var(--p-medium) 100%) !important;
}

/* Links dorados a morados */
.c-golden {
    color: var(--p-light) !important;
}

/* Texto logout */
a.logout {
    color: #f87171 !important;
}

/* ====================== */
/* ELEMENTOS RESTANTES    */
/* ====================== */

/* Links de noticias/paquetes */
.newsfeed a,
.news-content a {
    color: var(--p-light) !important;
}

.newsfeed a:hover,
.news-content a:hover {
    color: #fff !important;
}

/* Fechas y timestamps */
.news-date,
.timestamp,
[style*="color:#f30006"],
[style*="color: #f30006"],
[style*="color:#d74238"],
[style*="color: #d74238"],
[style*="color:#dd575a"],
[style*="color: #dd575a"] {
    color: var(--p-light) !important;
}

/* Textos especiales rojos */
.c-red,
.text-danger,
[style*="color:red"],
[style*="color: red"] {
    color: var(--p-light) !important;
}

/* Barra de tiempo/fecha en noticias */
.news-time,
.time-badge {
    background: var(--p-accent) !important;
    color: white !important;
}

/* Reino Jinno - mantener amarillo, pero más hacia dorado */
.kingdom.jinno,
.jinno {
    color: #fbbf24 !important;
}

/* Reino Shinsoo - mantener azul */
.kingdom.shinsoo,
.shinsoo {
    color: #60a5fa !important;
}

/* Reino Chunjo - cambiar rojo a morado claro */
.kingdom.chunjo,
.chunjo {
    color: var(--p-light) !important;
}

/* Encabezado de estadísticas */
.stats-box center a,
.stats-box a[style] {
    color: var(--p-light) !important;
}

/* Títulos destacados en estadísticas */
.stats-box a[href="#"],
.stats-box u {
    color: var(--p-accent) !important;
}

/* Botón agregar (+) */
.btn-success,
.btn-add,
a.btn {
    background: linear-gradient(180deg, var(--p-accent) 0%, var(--p-medium) 100%) !important;
    border-color: var(--p-accent) !important;
    color: white !important;
}

/* Link "OficialPanamera" en menú */
.pixarts-nav a[style*="color: #ff6b6b"],
.pixarts-nav a[style*="color:#ff6b6b"],
.pixarts-nav a[style*="color: #90EE90"],
.pixarts-nav a[style*="color:#90EE90"] {
    color: var(--p-light) !important;
}

/* Footer author link */
.author a[style] {
    color: var(--p-light) !important;
}

/* Tab seleccionado/activo */
.tab-active,
.active-tab,
li.active>a {
    color: var(--p-accent) !important;
    border-color: var(--p-accent) !important;
}

/* ================================= */
/* FORZAR MORADO EN TODOS LOS LINKS  */
/* ================================= */

/* TODOS los links con cualquier estilo inline */
a[style],
span[style],
font[color] {
    color: var(--p-light) !important;
}

/* Links dentro del área de noticias */
.newsfeed a[style],
.newsfeed span[style],
.news-lane a,
.news-lane span {
    color: var(--p-light) !important;
}

/* Fecha/tiempo en noticias */
.news-lane .time,
.news-date,
[class*="time"],
[class*="fecha"] {
    color: var(--p-light) !important;
}

/* El texto (24h) y similares */
a[href*="#"] {
    color: var(--p-light) !important;
}

/* Forzar en cualquier elemento con color rojo inline */
*[style*="color:#f"],
*[style*="color: #f"],
*[style*="color:#d"],
*[style*="color: #d"],
*[style*="color:#9"],
*[style*="color: #9"],
*[style*="color:#c"],
*[style*="color: #c"] {
    color: var(--p-light) !important;
}

/* Específicamente para elementos con colores hexadecimales rojos */
*[style*="#f30006"],
*[style*="#F30006"],
*[style*="#dd575a"],
*[style*="#DD575A"],
*[style*="#d74238"],
*[style*="#D74238"],
*[style*="#f96969"],
*[style*="#F96969"],
*[style*="#ff0000"],
*[style*="#FF0000"],
*[style*="#ff6b6b"],
*[style*="#FF6B6B"],
*[style*="#e74c3c"],
*[style*="#E74C3C"],
*[style*="#c0392b"],
*[style*="#C0392B"] {
    color: var(--p-light) !important;
}

/* Link "Registro" en Panel de Usuario - Hacerlo muy visible */
.p-w-l[href*="register"],
.login-box a[href*="register"],
.lane a[href*="register"] {
    color: #a78bfa !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
    text-decoration: underline !important;
    text-shadow: 0 0 10px rgba(139, 92, 246, 0.4);
}

.p-w-l[href*="register"]:hover,
.login-box a[href*="register"]:hover {
    color: #fff !important;
    text-shadow: 0 0 15px rgba(139, 92, 246, 0.8);
}

/* Links de paquetes/coins */
.newsfeed a[href*="coins"],
.newsfeed a[href*="pack"],
.newsfeed a[href*="donate"] {
    color: var(--p-light) !important;
}

.newsfeed a[href*="coins"]:hover,
.newsfeed a[href*="pack"]:hover {
    color: #fff !important;
}