/*!
    
 =========================================================
 * WebEngine CMS
 * https://webenginecms.org/
 =========================================================
 
 * Author Lautaro Angelico (https://lautaroangelico.com/)
 * Copyright (c) 2013-2020 Lautaro Angelico, All Rights Reserved
 
 * Licensed under the MIT license
 * http://opensource.org/licenses/MIT
 
 =========================================================
 
*/
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@600;700&display=swap');

.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th {
    border-top: none !important;
}

a:focus, a:hover {
    color: inherit !important;
    text-decoration: none !important;
}

.form-control {
	background: #fafafa;
	border: 1px solid #e3e3e3;
	color: #666;
}
.form-control:focus {
	border: 1px solid #ccc;
}

/* http://stackoverflow.com/questions/19562903/remove-padding-from-columns-in-bootstrap-3 */
.nopadding {
   padding: 0 !important;
   margin: 0 !important;
}

/* http://stackoverflow.com/questions/20547819/vertical-align-with-bootstrap-3 */
.vcenter {
    display: inline-block;
    vertical-align: middle;
    float: none;
}

.thumbnail {
    background-color: #f1f1f1;
    border: 1px solid #e3e3e3;
}
a.thumbnail:hover,
a.thumbnail:focus,
a.thumbnail.active {
  border-color: #ff0000;
}

.btn-primary {
    color: #ff0000;
    background-color: transparent;
	border-color: #ff0000;
	-moz-transition: all .1s ease-in;
    -o-transition: all .1s ease-in;
    -webkit-transition: all .1s ease-in;
    transition: all .1s ease-in;
	-moz-border-radius: 0px;
	border-radius: 0px;
}
.btn-primary:active, .btn-primary:focus, .btn-primary:hover {
    color: #fff !important;
    background-color: #ff0000 !important;
	border-color: #ff0000 !important;
}

.panel-body:after {
	clear: none !important;
}
table {
	box-shadow: none !important;
	border: none !important;
}
table tr td {
	border-bottom: 1px solid #241d2d !important;
	border-right: 1px solid #241d2d !important;
	border-left: 0px !important;
}
.myaccount-table tr td {
	background: #0d0615 !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 {
	background-color: #0d0615 !important;
	border: 1px solid #2c2437 !important;
}

.panel-body, .panel-body .character-name {
	color: white !important;
}
.panel-body .character-name {
	padding-bottom: 5px !important;
	border-bottom: 1px solid #2c2437 !important;
}
/*input {
	background: #241d2d !important;
	color: white !important;
	border: 1px solid #2c2437 !important;
}*/

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active { 
	background-clip: text;
	-webkit-background-clip: text;
	text-fill-color: #fff;
	-webkit-text-fill-color: #fff;
}

hr {
	border-top: 1px solid #3b2843 !important;
}

.help-block {
	color: #00ffae !important;
}

/* ============================================================
   T脥TULOS PREMIUM - INFANCIA MU
   Para revertir: borra este bloque.
   ============================================================ */
.block-widget-title,
.page-title span {
  font-family: 'Cinzel', Georgia, serif !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  color: #e9bf63 !important;
  text-shadow: 0 0 16px rgba(233, 191, 99, 0.38), 0 2px 5px rgba(0, 0, 0, 0.7) !important;
}

/* ============================================================
   TIPOGRAF脥A PREMIUM DORADA (NEWS, #, NAME, RESETS, LEVEL, SCORE)
   Para revertir: borra este bloque.
   ============================================================ */

/* NEWS */
.news-top-title span {
  font-family: 'Cinzel', Georgia, serif !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  color: #e9bf63 !important;
  text-shadow: 0 0 14px rgba(233, 191, 99, 0.35), 0 2px 4px rgba(0, 0, 0, 0.7) !important;
}

/* Encabezados de tablas: #, Name, Resets, Level, Score */
.top-title,
.top-title span,
.top-block .top-title span {
  font-family: 'Cinzel', Georgia, serif !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: #e9bf63 !important;
  text-shadow: 0 0 10px rgba(233, 191, 99, 0.3) !important;
}

/* Etiqueta [NEWS] y fecha */
span.news-1 {
  color: #e9bf63 !important;
  font-weight: 600;
}
.date {
  color: #a094c4 !important;
}

/* Bot贸n + */
.tab-more {
  color: #e9bf63 !important;
  border: 1px solid rgba(233, 191, 99, 0.5);
  background: rgba(9, 4, 15, 0.9) !important;
}
.tab-more:hover {
  background: #e9bf63 !important;
  color: #09040f !important;
}

/* Filas: hover dorado en vez de verde */
.top-list:hover,
.top-list:hover a {
  color: #ffd685 !important;
  border-bottom-color: rgba(233, 191, 99, 0.5) !important;
}

/* ============================================================
   PÁGINAS INTERNAS PREMIUM (NOTICIAS, ETC.) - INFANCIA MU
   Para revertir: borra este bloque.
   ============================================================ */

/* Título de la noticia (era rosado y subrayado) */
.page-text a,
.page-text a:link,
.page-text a:visited {
  color: #e9bf63 !important;
  text-decoration: none !important;
}
.page-text a:hover,
.page-text a:active {
  color: #ffd685 !important;
  text-decoration: none !important;
}

/* Títulos dentro de páginas internas */
.page-text h1,
.page-text h2,
.page-text h3,
.page-text h4,
.page-title-news,
.page-title-news a,
.page-top {
  font-family: 'Cinzel', Georgia, serif !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  color: #e9bf63 !important;
  text-shadow: 0 0 14px rgba(233, 191, 99, 0.3), 0 2px 4px rgba(0, 0, 0, 0.7) !important;
}

/* Título grande de la noticia, con línea decorativa dorada */
.page-text h1 a,
.page-text h2 a,
.page-text h3 a,
.page-text .panel-title a {
  font-family: 'Cinzel', Georgia, serif !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  color: #e9bf63 !important;
}

/* Tiempo / fecha */
.page-title-time,
.page-title-time span {
  color: #a094c4 !important;
  font-family: 'Cinzel', Georgia, serif !important;
}
.page-text em,
.page-text i,
.page-text .news-date,
.page-text small {
  color: #a094c4 !important;
}

/* Encabezados de tablas internas (rankings, etc.) */
.page-text table th,
.page-text table thead td,
.page-text table tr:first-child td {
  font-family: 'Cinzel', Georgia, serif !important;
  letter-spacing: 0.08em !important;
}
.page-text table thead td,
.page-text table th {
  color: #e9bf63 !important;
}

/* Negritas de reglas / términos (eran magenta) */
.module-rules strong,
.module-tos strong,
.module-privacy strong {
  color: #e9bf63 !important;
}

/* Enlaces del menú de usuario al pasar el mouse */
.block-usercp ul li a:active,
.block-usercp ul li a:hover,
.usercp-unreadmessages a:hover,
.usercp-unreadmessages a:active {
  color: #ffd685 !important;
}
.usercp-unreadmessages {
  border-color: #e9bf63 !important;
}

/* ============================================================
   REDES SOCIALES PREMIUM - INFANCIA MU
   (Facebook, YouTube, TikTok, Discord)
   Para revertir: borra este bloque.
   ============================================================ */
.net-block a,
.net-block a:link,
.net-block a:visited {
  font-family: 'Cinzel', Georgia, serif !important;
  font-weight: 700 !important;
  font-size: 12.5px !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  white-space: nowrap;
  color: #e9bf63 !important;
  text-shadow: 0 0 12px rgba(233, 191, 99, 0.3), 0 2px 4px rgba(0, 0, 0, 0.8) !important;
  transition: all 0.25s ease;
}
.net-block a:hover,
.net-block a:active {
  color: #ffd685 !important;
  text-shadow: 0 0 16px rgba(255, 214, 133, 0.6), 0 2px 4px rgba(0, 0, 0, 0.8) !important;
}

/* ============================================================
   DOWNLOAD / REGISTER PREMIUM - INFANCIA MU
   Para revertir: borra este bloque.
   ============================================================ */

/* Título grande (DOWNLOAD / REGISTER): dorado con degradado */
.download-block span,
.regisrtation-block span {
  font-family: 'Cinzel', Georgia, serif !important;
  font-weight: 700 !important;
  font-style: normal !important;
  font-size: 26px !important;
  letter-spacing: 0.06em !important;
  line-height: 1.1;
  background: linear-gradient(180deg, #fffbe8 0%, #ffe08a 48%, #e9bf63 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.65));
}

/* Subtítulo (MuOnline / Create Account) */
.download-block p,
.regisrtation-block p {
  font-family: 'Cinzel', Georgia, serif !important;
  font-weight: 600 !important;
  font-style: normal !important;
  font-size: 12.5px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  padding-top: 6px !important;
  color: #fff3cf !important;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.75) !important;
}

/* ============================================================
   MENÚ SUPERIOR PREMIUM - INFANCIA MU
   (Home, Donation, Downloads, Info, Rankings, Baneados)
   Para revertir: borra este bloque.
   ============================================================ */
.menu-top ul.menu-top-left > li > a,
.menu-top ul.menu-top-right > li > a {
  font-family: 'Cinzel', Georgia, serif !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  letter-spacing: 0.09em !important;
  color: #e9bf63 !important;
  text-shadow: 0 0 12px rgba(233, 191, 99, 0.3), 0 2px 4px rgba(0, 0, 0, 0.8) !important;
  border-top: 2px solid transparent !important;
  background: transparent;
  transition: all 0.25s ease;
}

/* Al pasar el mouse y en la página activa */
.menu-top ul.menu-top-left > li > a:hover,
.menu-top ul.menu-top-right > li > a:hover,
.menu-top ul.menu-top-left > li.active > a,
.menu-top ul.menu-top-right > li.active > a {
  color: #ffd685 !important;
  border-top: 2px solid #e9bf63 !important;
  text-shadow: 0 0 18px rgba(255, 214, 133, 0.65), 0 2px 4px rgba(0, 0, 0, 0.8) !important;
  background: linear-gradient(180deg, rgba(233, 191, 99, 0.16), rgba(233, 191, 99, 0) 70%);
}

/* ============================================================
   ONLINE USERS PREMIUM - INFANCIA MU
   Para revertir: borra este bloque.
   ============================================================ */

/* Resplandor dorado suave que "respira" detrás del contador */
.circle-online::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(233, 191, 99, 0.22) 0%, rgba(233, 191, 99, 0) 68%);
  pointer-events: none;
  animation: irOnlineGlow 3.2s ease-in-out infinite;
}
@keyframes irOnlineGlow {
  0%, 100% { opacity: 0.55; transform: scale(0.94); }
  50%      { opacity: 1;    transform: scale(1.04); }
}

/* Texto "ONLINE USERS" */
.server-load .serverInfo {
  padding-top: 24px;
}
.server-load .serverInfo .serverInfo__name {
  font-family: 'Cinzel', Georgia, serif !important;
  font-weight: 700 !important;
  font-size: 10.5px !important;
  letter-spacing: 0.1em !important;
  line-height: 1.25 !important;
  text-transform: uppercase !important;
  color: #e9bf63 !important;
  text-shadow: 0 0 10px rgba(233, 191, 99, 0.35), 0 2px 3px rgba(0, 0, 0, 0.8) !important;
  margin-bottom: 4px !important;
}

/* Número de jugadores online */
.server-load .serverInfo .serverInfo__online {
  font-family: 'Cinzel', Georgia, serif !important;
  font-weight: 700 !important;
  font-size: 26px !important;
  line-height: 1.1 !important;
  color: #fff3cf !important;
  text-shadow: 0 0 14px rgba(255, 214, 133, 0.75), 0 0 28px rgba(233, 191, 99, 0.45), 0 2px 4px rgba(0, 0, 0, 0.8) !important;
}

@media (prefers-reduced-motion: reduce) {
  .circle-online::before { animation: none; opacity: 0.8; }
}

/* ============================================================
   LOGIN PREMIUM - INFANCIA MU
   (título LOG IN + campos USERNAME / PASSWORD)
   Para revertir: borra este bloque.
   ============================================================ */

/* Título "LOG IN": de rosado a dorado */
#login-login .modal-content h2 span {
  font-family: 'Cinzel', Georgia, serif !important;
  font-weight: 700 !important;
  font-size: 21px !important;
  letter-spacing: 0.12em !important;
  color: #e9bf63 !important;
  text-shadow: 0 0 16px rgba(233, 191, 99, 0.45), 0 2px 5px rgba(0, 0, 0, 0.8) !important;
}

/* Texto escrito en los campos: de rosado a dorado claro */
#login-login .input-re_1,
#login-login .input-re_2 {
  color: #ffe9a8 !important;
  font-family: 'Cinzel', Georgia, serif;
  font-weight: 600;
  letter-spacing: 0.06em;
}

/* Textos de ayuda (USERNAME / PASSWORD) */
#login-login input::placeholder {
  color: rgba(233, 191, 99, 0.7) !important;
  opacity: 1;
  letter-spacing: 0.14em;
}
#login-login input::-webkit-input-placeholder {
  color: rgba(233, 191, 99, 0.7) !important;
  letter-spacing: 0.14em;
}

/* Quitar el fondo blanco del relleno automático de Chrome */
#login-login input:-webkit-autofill,
#login-login input:-webkit-autofill:hover,
#login-login input:-webkit-autofill:focus,
#login-login input:-webkit-autofill:active {
  -webkit-text-fill-color: #ffe9a8 !important;
  caret-color: #ffe9a8;
  transition: background-color 600000s 0s, color 600000s 0s !important;
}

/* ============================================================
   LOGIN - MANTENER ICONOS EN CAMPOS RELLENADOS POR CHROME
   (va DEBAJO del bloque "LOGIN PREMIUM")
   Para revertir: borra este bloque.
   ============================================================ */

/* Cada campo vive en un contenedor que dibuja su propia imagen */
#login-login form p:nth-of-type(1),
#login-login form p:nth-of-type(2) {
  position: relative;
}
#login-login form p:nth-of-type(1)::before,
#login-login form p:nth-of-type(2)::before {
  content: "";
  position: absolute;
  top: 0;
  left: calc(50% - 3px);
  width: 424px;
  margin-left: -212px;
  height: 100%;
  background-repeat: no-repeat;
  background-position: calc(50% + 3px) top;
  pointer-events: none;
  z-index: 0;
}
#login-login form p:nth-of-type(1)::before {
  background-image: url('../img/icon_modal_user.png');
}
#login-login form p:nth-of-type(2)::before {
  background-image: url('../img/icon_modal_password.png');
}

/* El campo queda transparente y por encima de la imagen */
#login-login .input-re_1,
#login-login .input-re_2 {
  background: transparent !important;
  position: relative;
  z-index: 1;
}