/*!
 * ICE MU ONLINE - Theme Override
 * Paleta de hielo: azul oscuro, celeste, blanco frío
 */

/* =============================================
   VARIABLES DE COLOR - TEMA HIELO
   ============================================= */
:root {
    --ColorTemplate: #4fc3f7;
    --ColorTemplateAlpha: rgba(79, 195, 247, 0.3);
    --ice-dark: #071525;
    --ice-mid: #0d2137;
    --ice-panel: #0a1c2e;
    --ice-border: #1e4a6e;
    --ice-accent: #4fc3f7;
    --ice-light: #b3e5fc;
    --ice-text: #cce8f4;
}

/* =============================================
   FONDO GENERAL DEL BODY
   ============================================= */
body {
    background-color: #071525 !important;
    background-image: url('../img/backgroundweb.png') !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
    background-size: cover !important;
    background-position: center center !important;
}

/* =============================================
   HEADER - CELDA DEL LOGO
   ============================================= */
td.bg0 {
    vertical-align: middle !important;
}

.bg0 {
    background: transparent !important;
}

/* Navbar transparente, pegada arriba */
table[width="982"][border="0"][align="center"].bg2 {
    background: transparent !important;
    margin-top: 0 !important;
}

.bg2 {
    background: rgba(4, 14, 26, 0.75) !important;
    backdrop-filter: blur(4px) !important;
    border-top: 1px solid rgba(79,195,247,0.2) !important;
    border-bottom: 1px solid rgba(79,195,247,0.2) !important;
}

/* Navbar sticky */
.ice-navbar-sticky {
    position: fixed !important;
    top: 0 !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    z-index: 9999 !important;
    width: 982px !important;
    transition: background 0.3s ease, backdrop-filter 0.3s ease !important;
    background: transparent !important;
    backdrop-filter: none !important;
    border-top: none !important;
    border-bottom: none !important;
}

.ice-navbar-sticky.scrolled {
    background: rgba(4, 14, 26, 0.85) !important;
    backdrop-filter: blur(6px) !important;
    border-top: 1px solid rgba(79,195,247,0.2) !important;
    border-bottom: 1px solid rgba(79,195,247,0.2) !important;
}

.bg3 {
    background: transparent !important;
    backdrop-filter: none !important;
    background-image: none !important;
    padding-bottom: 0 !important;
    height: auto !important;
    overflow: hidden !important;
    max-width: 982px !important;
}

table[width="900px"] {
    background: rgba(4, 14, 26, 0.65) !important;
    backdrop-filter: blur(2px) !important;
}

/* =============================================
   PANELES LATERALES Y CAJAS
   ============================================= */
.box {
    background-color: var(--ice-panel) !important;
    border: 2px solid var(--ice-border) !important;
}

.box h1 {
    background-color: #0a2a45 !important;
    color: var(--ice-light) !important;
    border-bottom: 1px dashed var(--ice-border) !important;
}

/* =============================================
   TEXTOS Y ENCABEZADOS
   ============================================= */
body, th, td, input, textarea, select {
    color: #ffffff !important;
}

.text1, .text2, .text9, .text10, .text11 {
    background-image: url('../img/encabezadoice.png') !important;
    background-repeat: no-repeat !important;
    background-size: 100% 300% !important;
    background-position: left 56% !important;
    mix-blend-mode: screen !important;
    border-left: none !important;
    color: #ffffff !important;
    text-shadow: 0 0 6px rgba(79,195,247,1), 1px 1px 2px #000 !important;
    height: 40px !important;
    padding: 0px 0px 0px 40px !important;
    display: flex !important;
    align-items: flex-start !important;
    padding-top: 5px !important;
}

.text3 { color: var(--ice-light) !important; }
.text5 { color: var(--ice-accent) !important; }

/* =============================================
   LISTAS SIDEBAR
   ============================================= */
.list1 li {
    background: linear-gradient(to right, rgba(13,58,92,0.4), transparent) !important;
    border-bottom: 1px solid rgba(79,195,247,0.15);
}

.list1 li:has(> a > img) {
    padding: 0 !important;
    margin: 0 !important;
    background: none !important;
    border-bottom: none !important;
    line-height: 1 !important;
}

.list1 a { color: var(--ice-text) !important; }
.list1 a:hover { color: var(--ice-accent) !important; }

/* =============================================
   INPUTS Y FORMULARIOS
   ============================================= */
.input1 {
    background-color: #071525 !important;
    border-top: 1px solid #071525 !important;
    border-right: 1px solid #0d2137 !important;
    border-bottom: 1px solid var(--ice-border) !important;
    border-left: 1px solid #071525 !important;
    color: var(--ice-text) !important;
}

input[type=text], input[type=password], input[type=number] {
    background: #0a1c2e !important;
    border: 1px solid var(--ice-border) !important;
    color: var(--ice-text) !important;
}

input[type=text]:focus, input[type=password]:focus, input[type=number]:focus {
    border: 1px solid var(--ice-accent) !important;
    box-shadow: 0 0 8px rgba(79,195,247,0.4) !important;
}

/* =============================================
   BOTONES
   ============================================= */
.btn-success,
button[name="webengineLogin_submit"] {
    background-color: #0d3a5c !important;
    border-color: var(--ice-accent) !important;
    color: var(--ice-light) !important;
}

.btn-success:hover,
button[name="webengineLogin_submit"]:hover {
    background-color: var(--ice-accent) !important;
    color: #071525 !important;
}

.btn-primary {
    background-color: #0d3a5c !important;
    border-color: var(--ice-accent) !important;
    color: var(--ice-light) !important;
}

.btn-primary:hover {
    background-color: var(--ice-accent) !important;
    border-color: var(--ice-accent) !important;
    color: #071525 !important;
}

/* =============================================
   LINKS
   ============================================= */
a { color: var(--ice-accent) !important; }
a:hover { color: var(--ice-light) !important; }
.link1 { 
    color: #ffffff !important; 
    font-weight: bold !important;
    font-size: 15px !important;
}

/* =============================================
   BARRA ONLINE
   ============================================= */
.webengine-online-bar {
    background: #071525 !important;
    border: 1px solid var(--ice-border) !important;
}

.webengine-online-bar .webengine-online-bar-progress {
    background: linear-gradient(to right, #1565c0, var(--ice-accent)) !important;
}

/* =============================================
   PANEL GENERAL / NOTICIAS
   ============================================= */
.panel-general {
    border: 1px solid var(--ice-border) !important;
    background: var(--ice-panel) !important;
    color: var(--ice-text) !important;
}

/* Altura minima del area de contenido central */
#tableiposteng {
    min-height: 400px !important;
}

#tableiposteng > tbody > tr > td:first-child {
    min-height: 400px !important;
    vertical-align: top !important;
}

.panel-news .panel-heading {
    background-color: #0d3a5c !important;
    border-color: var(--ice-border) !important;
}

.panel-news .panel-body {
    background: var(--ice-panel) !important;
    border-color: var(--ice-border) !important;
    color: var(--ice-text) !important;
}

.panel-news .panel-footer {
    background: #071525 !important;
    color: var(--ice-text) !important;
}

/* =============================================
   SIDEBAR PANEL
   ============================================= */
.panel-sidebar {
    background: var(--ice-panel) !important;
    border-color: var(--ice-border) !important;
}

.panel-sidebar > .panel-heading {
    background: #0d3a5c !important;
    color: var(--ice-accent) !important;
    border-bottom: 3px solid var(--ice-accent) !important;
}

/* =============================================
   RANKINGS
   ============================================= */
.rankings-table {
    border-color: var(--ice-border) !important;
    color: var(--ice-text) !important;
}

.rankings-table tr td {
    border-bottom: 1px solid var(--ice-border) !important;
}

.rankings-table tr:first-child td {
    background: #0d3a5c !important;
    border-bottom: 3px solid var(--ice-accent) !important;
}

/* =============================================
   BARRA SUPERIOR GLOBAL
   ============================================= */
.global-top-bar {
    background: #040e1a !important;
    color: #5a8fa8 !important;
}

/* =============================================
   FOOTER
   ============================================= */
.footer {
    background: #040e1a !important;
    border-top: 3px solid var(--ice-accent) !important;
    color: #5a8fa8 !important;
}

/* Footer image row */
table[width="982"] > tbody > tr > td > img[src*="homepage06"] {
    display: none !important;
}

.text8 { color: #4a7a94 !important; }

/* =============================================
   EFECTO BRILLO HIELO EN HOVER DE LOGO
   ============================================= */
.webengine-mu-logo:hover {
    filter: brightness(130%) drop-shadow(0 0 8px rgba(79,195,247,0.7)) !important;
}

/* Neon blanco en el logo central */
td.bg0 img {
    filter: drop-shadow(0 0 8px rgba(255,255,255,0.6)) drop-shadow(0 0 20px rgba(79,195,247,0.5)) !important;
}

/* =============================================
   NAVBAR
   ============================================= */
#navbar {
    background: transparent !important;
    border-bottom: 1px solid rgba(79,195,247,0.2) !important;
}

#navbar ul li a {
    color: #ffffff !important;
    font-weight: bold !important;
    font-size: 15px !important;
}

#navbar ul li a:hover {
    color: var(--ice-accent) !important;
    text-shadow: 0 0 10px rgba(79,195,247,0.6);
}

/* =============================================
   SEPARADORES NAVBAR - CRISTAL DE HIELO
   ============================================= */
td > img[src*="subpage1_02"] {
    mix-blend-mode: screen !important;
    width: 28px !important;
    height: 75px !important;
    opacity: 1 !important;
    content: url('../img/subpage1_02.png') !important;
    vertical-align: middle !important;
    display: inline-block !important;
}

table.bg2 td:has(> img[src*="subpage1_02"]) {
    background: transparent !important;
    padding: 0 !important;
}

/* =============================================
   MARCO CASTLE SIEGE - PNG CENTRADO
   ============================================= */
td[style*="123.jpg"] {
    background-image: url('../img/marcocastle.png') !important;
    background-size: 100% 100% !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-color: transparent !important;
    width: 650px !important;
    height: 149px !important;
    vertical-align: middle !important;
    overflow: visible !important;
    padding: 0 !important;
    position: relative !important;
}

td[style*="123.jpg"]::before {
    content: '' !important;
    position: absolute !important;
    top: -55px !important;
    left: -30px !important;
    right: -30px !important;
    bottom: -70px !important;
    background-image: url('../img/marcocastle.png') !important;
    background-size: 100% 100% !important;
    background-repeat: no-repeat !important;
    z-index: 1 !important;
    pointer-events: none !important;
}

td[style*="123.jpg"] > table {
    position: relative !important;
    z-index: 2 !important;
}

/* =============================================
   SIDEBAR IZQUIERDO Y DERECHO - FONDO PANEL
   ============================================= */
td[width="171"] {
    background: rgba(4, 14, 26, 0.55) !important;
    border-left: 1px solid rgba(79,195,247,0.15) !important;
    border-right: 1px solid rgba(79,195,247,0.15) !important;
    padding: 5px !important;
}

table[width="900px"] > tbody > tr > td[width="171"] {
    width: 171px !important;
}

table[width="900px"] > tbody > tr > td[width="558"] {
    width: 558px !important;
    min-width: 558px !important;
    min-height: 600px !important;
    vertical-align: top !important;
    background: rgba(10, 30, 55, 0.35) !important;
}

/* =============================================
   ELIMINAR ESPACIO EXTRA EN CONTENIDO CENTRAL
   ============================================= */
.home-news-block,
.home-news-block .row:first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

.home-news-block ~ .row {
    margin-top: 0 !important;
}