/*
 * =========================================================
 * WILNAREN MU - RESPONSIVE LIMPIO
 * =========================================================
 * Este archivo se carga ULTIMO.
 * Desktop (>= 992px) no se modifica.
 * Rankings Reset/Guild mantienen su responsive propio.
 */

/* =========================================================
   TABLET + CELULAR
   ========================================================= */
@media (max-width: 991px) {

	*,
	*::before,
	*::after {
		box-sizing: border-box;
	}

	html,
	body {
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		overflow-x: hidden !important;
		-webkit-text-size-adjust: 100%;
	}

	body {
		background-attachment: scroll !important;
		background-position: center top !important;
		background-size: cover !important;
	}

	/* ---------------------------------------------------------
	   TOP BAR
	   --------------------------------------------------------- */
	.global-top-bar {
		width: 100% !important;
		min-width: 0 !important;
		height: auto !important;
		background: rgba(8,8,8,.98) !important;
		border-bottom: 1px solid rgba(215,178,105,.13) !important;
	}

	.global-top-bar-content {
		width: calc(100% - 20px) !important;
		max-width: 100% !important;
		min-width: 0 !important;
		margin: 0 auto !important;
		padding: 7px 0 !important;
	}

	.global-top-bar-content > .row {
		display: flex !important;
		align-items: center !important;
		justify-content: space-between !important;
		width: 100% !important;
		margin: 0 !important;
	}

	.global-top-bar .wil-topbar-language,
	.global-top-bar .wil-topbar-account {
		float: none !important;
		width: 50% !important;
		max-width: 50% !important;
		min-width: 0 !important;
		padding: 0 !important;
	}

	.global-top-bar .wil-topbar-language {
		text-align: left !important;
		white-space: nowrap !important;
		overflow: hidden !important;
	}

	.global-top-bar .wil-topbar-account {
		text-align: right !important;
		white-space: nowrap !important;
	}

	.global-top-bar a {
		font-size: 10px !important;
	}

	/* ---------------------------------------------------------
	   NAVBAR MOBILE
	   --------------------------------------------------------- */
	#navbar {
		position: relative !important;
		float: none !important;
		width: calc(100% - 20px) !important;
		max-width: calc(100% - 20px) !important;
		min-width: 0 !important;
		height: auto !important;
		min-height: 0 !important;
		margin: 8px auto 0 !important;
		padding: 6px !important;
		background: rgba(12,12,12,.96) !important;
		border: 1px solid rgba(215,178,105,.20) !important;
		border-radius: 7px !important;
		overflow: hidden !important;
	}

	.wil-mobile-menu-toggle {
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		gap: 8px !important;
		width: 100% !important;
		min-height: 42px !important;
		margin: 0 !important;
		padding: 9px 12px !important;
		color: #d7b269 !important;
		background: linear-gradient(180deg, #30281d, #171512) !important;
		border: 1px solid rgba(215,178,105,.33) !important;
		border-radius: 5px !important;
		font-family: 'Cinzel', serif !important;
		font-size: 12px !important;
		font-weight: 700 !important;
		letter-spacing: .6px !important;
		text-transform: uppercase !important;
		outline: none !important;
	}

	#wil-main-nav {
		display: none !important;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
	}

	#navbar.wil-navbar-open #wil-main-nav {
		display: block !important;
	}

	#wil-main-nav > ul {
		display: flex !important;
		flex-direction: column !important;
		align-items: stretch !important;
		width: 100% !important;
		height: auto !important;
		margin: 6px 0 0 !important;
		padding: 0 !important;
		list-style: none !important;
	}

	#wil-main-nav > ul > li {
		display: block !important;
		float: none !important;
		width: 100% !important;
		height: auto !important;
		margin: 0 !important;
		padding: 0 !important;
		border-top: 1px solid rgba(255,255,255,.05) !important;
	}

	#wil-main-nav > ul > li:first-child {
		border-top: 0 !important;
	}

	#wil-main-nav > ul > li > a {
		display: block !important;
		width: 100% !important;
		height: auto !important;
		min-height: 40px !important;
		margin: 0 !important;
		padding: 12px 13px !important;
		color: #d0d0d0 !important;
		background: transparent !important;
		text-align: left !important;
		line-height: 1.3 !important;
		font-size: 11px !important;
	}

	#wil-main-nav > ul > li > a:hover,
	#wil-main-nav > ul > li.active > a,
	#wil-main-nav > ul > li.current > a {
		color: #d7b269 !important;
		background: rgba(215,178,105,.06) !important;
	}

	#wil-main-nav > ul > li > a::before,
	#wil-main-nav > ul > li > a::after {
		display: none !important;
	}

	/* ---------------------------------------------------------
	   HEADER / LOGO
	   --------------------------------------------------------- */
	#header {
		position: relative !important;
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		float: none !important;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		height: 190px !important;
		min-height: 190px !important;
		margin: 0 !important;
		padding: 14px !important;
		background-position: center center !important;
		background-size: cover !important;
		overflow: hidden !important;
	}

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

	#header .webengine-mu-logo {
		position: static !important;
		display: block !important;
		width: auto !important;
		max-width: 210px !important;
		max-height: 125px !important;
		height: auto !important;
		margin: 0 auto !important;
		transform: none !important;
	}

	/* ---------------------------------------------------------
	   ONLINE / HORARIOS
	   --------------------------------------------------------- */
	.header-info-container {
		position: static !important;
		display: block !important;
		float: none !important;
		clear: both !important;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		transform: none !important;
	}

	.header-info {
		position: static !important;
		display: block !important;
		float: none !important;
		width: calc(100% - 20px) !important;
		max-width: 560px !important;
		min-width: 0 !important;
		margin: 10px auto 14px !important;
		padding: 0 !important;
		transform: none !important;
		background: linear-gradient(180deg, rgba(40,33,23,.96), rgba(18,17,15,.98)) !important;
		border: 1px solid rgba(205,160,78,.35) !important;
		border-radius: 7px !important;
		overflow: hidden !important;
	}

	.header-info > .row,
	.header-info .row {
		width: 100% !important;
		max-width: 100% !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	.header-info .col-xs-12 {
		float: none !important;
		width: 100% !important;
		padding: 0 !important;
	}

	.header-info-block {
		float: none !important;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		padding: 11px 12px !important;
		font-size: 10px !important;
	}

	.header-info-block .row > .col-xs-6 {
		float: left !important;
		width: 50% !important;
		max-width: 50% !important;
		padding-left: 3px !important;
		padding-right: 3px !important;
	}

	.webengine-online-bar {
		width: 100% !important;
		margin: 6px 0 9px !important;
	}

	/* ---------------------------------------------------------
	   CONTENEDOR GENERAL
	   --------------------------------------------------------- */
	#container {
		position: relative !important;
		float: none !important;
		width: calc(100% - 12px) !important;
		max-width: calc(100% - 12px) !important;
		min-width: 0 !important;
		margin: 0 auto !important;
		padding: 8px !important;
		background: linear-gradient(180deg, rgba(20,20,20,.97), rgba(10,10,10,.99)) !important;
		border: 1px solid rgba(205,160,78,.18) !important;
		border-radius: 8px !important;
		overflow: hidden !important;
	}

	#content {
		position: relative !important;
		float: none !important;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		background: transparent !important;
		color: #d6d6d6 !important;
		overflow: visible !important;
	}

	#content > .col-xs-12 {
		float: none !important;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	#content img,
	#content iframe,
	#content video,
	#content canvas {
		max-width: 100% !important;
	}

	/* USERCP */
	#content > .usercp-main-column,
	#content > .usercp-sidebar-column {
		float: none !important;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	#content > .usercp-sidebar-column {
		margin-top: 16px !important;
	}

	/* ---------------------------------------------------------
	   HOME: ESTRUCTURA REAL DEL home.php ACTUAL
	   --------------------------------------------------------- */
	#content .wilnaren-paint-main {
		display: block !important;
		width: 100% !important;
		margin: 0 !important;
	}

	#content .wilnaren-paint-main > .wilnaren-paint-left,
	#content .wilnaren-paint-main > .wilnaren-paint-right {
		display: block !important;
		float: none !important;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	#content .wilnaren-paint-left > .row,
	#content .wilnaren-paint-right > .row,
	#content .wilnaren-paint-dashboard,
	#content .wilnaren-paint-castle {
		width: 100% !important;
		max-width: 100% !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	/* Noticias */
	#content .home-news-block {
		float: none !important;
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 0 14px !important;
		padding: 0 !important;
		background: rgba(15,15,15,.98) !important;
		border: 1px solid rgba(190,145,65,.32) !important;
		border-radius: 7px !important;
		overflow: hidden !important;
	}

	#content .home-news-block-header {
		display: grid !important;
		grid-template-columns: minmax(0,1fr) auto !important;
		align-items: center !important;
		gap: 8px !important;
		width: 100% !important;
		margin: 0 !important;
		padding: 11px 12px !important;
		background: linear-gradient(180deg, #382f21, #1a1815) !important;
	}

	#content .home-news-block-header > .col-xs-8,
	#content .home-news-block-header > .col-xs-4 {
		float: none !important;
		width: auto !important;
		max-width: 100% !important;
		padding: 0 !important;
	}

	#content .home-news-block-header h2 {
		margin: 0 !important;
		font-size: 15px !important;
		line-height: 1.2 !important;
		color: #d7b269 !important;
	}

	#content .home-news-block-header a {
		font-size: 10px !important;
		white-space: nowrap !important;
	}

	#content .home-news-block-body {
		width: 100% !important;
		margin: 0 !important;
		padding: 7px 10px !important;
		background: rgba(15,15,15,.98) !important;
	}

	#content .home-news-block-body > .col-xs-12 {
		float: none !important;
		width: 100% !important;
		padding: 0 !important;
	}

	#content .home-news-block-article {
		display: grid !important;
		grid-template-columns: 54px minmax(0,1fr) 66px !important;
		align-items: center !important;
		gap: 7px !important;
		width: 100% !important;
		min-height: 42px !important;
		margin: 0 !important;
		padding: 8px 0 !important;
		border-bottom: 1px solid rgba(255,255,255,.06) !important;
	}

	#content .home-news-block-article > .col-xs-3,
	#content .home-news-block-article > .col-xs-6 {
		float: none !important;
		width: auto !important;
		max-width: 100% !important;
		min-width: 0 !important;
		padding: 0 !important;
	}

	#content .home-news-block-article-title-container {
		overflow: hidden !important;
	}

	#content .home-news-block-article-title,
	#content .home-news-block-article-title a {
		display: block !important;
		min-width: 0 !important;
		overflow: hidden !important;
		text-overflow: ellipsis !important;
		white-space: nowrap !important;
	}

	#content .home-news-block-article-date {
		display: block !important;
		text-align: right !important;
		font-size: 8px !important;
	}

	/* Bloque central */
	#content .wilnaren-paint-dashboard {
		display: block !important;
		margin-top: 0 !important;
	}

	#content .wilnaren-paint-stack,
	#content .wilnaren-paint-events {
		display: block !important;
		float: none !important;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	#content .wilnaren-stack-item,
	#content .wilnaren-events-inner,
	#content .wilnaren-serverinfo-inner {
		display: block !important;
		float: none !important;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		margin: 0 0 14px !important;
		padding: 0 !important;
	}

	#content .wilnaren-paint-stack .panel-sidebar,
	#content .wilnaren-paint-events .panel-sidebar,
	#content .wilnaren-paint-right .panel-sidebar {
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		margin: 0 !important;
		background: rgba(15,15,15,.98) !important;
		border: 1px solid rgba(190,145,65,.32) !important;
		border-radius: 7px !important;
		overflow: hidden !important;
	}

	#content .panel-sidebar .panel-heading {
		background: linear-gradient(180deg, #382f21, #1a1815) !important;
		border-bottom: 1px solid rgba(210,165,85,.35) !important;
		padding: 11px 12px !important;
	}

	#content .panel-sidebar .panel-heading .panel-title {
		color: #d7b269 !important;
		font-family: 'Cinzel', serif !important;
		font-size: 12px !important;
		font-weight: 700 !important;
	}

	#content .panel-sidebar .panel-body {
		background: rgba(15,15,15,.98) !important;
		color: #d5d5d5 !important;
		padding: 12px !important;
	}

	#content .panel-sidebar .table {
		width: 100% !important;
		margin: 0 !important;
		background: transparent !important;
		color: #d5d5d5 !important;
	}

	#content .panel-sidebar .table td,
	#content .panel-sidebar .table th {
		color: #cfcfcf !important;
		border-color: rgba(255,255,255,.07) !important;
		padding: 7px 5px !important;
		font-size: 10px !important;
	}

	#content .panel-sidebar-events .panel-body,
	#content .wilnaren-serverinfo .panel-body {
		min-height: 0 !important;
		height: auto !important;
	}

	/* Login / UserCP / Discord */
	#content .wilnaren-paint-right {
		margin-top: 2px !important;
	}

	#content .wilnaren-paint-right > .row {
		width: 100% !important;
		margin: 0 !important;
	}

	#content .wilnaren-paint-right > .row > .col-xs-12 {
		float: none !important;
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 0 14px !important;
		padding: 0 !important;
	}

	#content .panel-sidebar input.form-control {
		width: 100% !important;
		max-width: 100% !important;
		height: 38px !important;
		background: #101010 !important;
		color: #eee !important;
		border: 1px solid rgba(190,145,65,.35) !important;
	}

	#content .sidebar-banner,
	#content .sidebar-banner a,
	#content .sidebar-banner img {
		display: block !important;
		width: 100% !important;
		max-width: 100% !important;
		height: auto !important;
	}

	#content .wilnaren-discord-widget {
		width: 100% !important;
		max-width: 100% !important;
		overflow: hidden !important;
	}

	#content .wilnaren-discord-banner,
	#content .wilnaren-discord-banner img {
		display: block !important;
		width: 100% !important;
		max-width: 100% !important;
		height: auto !important;
	}

	#content .wilnaren-discord-frame {
		width: 100% !important;
		max-width: 100% !important;
		overflow: hidden !important;
	}

	#content .wilnaren-discord-frame iframe {
		display: block !important;
		width: 100% !important;
		max-width: 100% !important;
		height: 300px !important;
		border: 0 !important;
	}

	#content .wilnaren-discord-join .btn {
		width: 100% !important;
		max-width: 280px !important;
		white-space: normal !important;
	}

	/* Castle Siege de la Home */
	#content .wilnaren-paint-castle {
		display: block !important;
		margin-top: 0 !important;
	}

	#content .wilnaren-paint-castle > .col-xs-12 {
		float: none !important;
		width: 100% !important;
		max-width: 100% !important;
		padding: 0 !important;
	}

	#content .wilnaren-paint-castle .castle-owner-widget {
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		height: auto !important;
		min-height: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		background-color: #101010 !important;
		border: 1px solid rgba(190,145,65,.32) !important;
		border-radius: 7px !important;
		overflow: hidden !important;
	}

	#content .wilnaren-paint-castle .castle-owner-widget .panel-heading {
		padding: 11px 12px !important;
		background: linear-gradient(180deg, #382f21, #1a1815) !important;
	}

	#content .wilnaren-paint-castle .castle-owner-widget .panel-heading .panel-title {
		font-size: 15px !important;
		color: #d7b269 !important;
	}

	#content .wilnaren-paint-castle .castle-owner-widget .panel-body {
		min-height: 0 !important;
		height: auto !important;
		padding: 12px !important;
		background: rgba(15,15,15,.93) !important;
	}

	#content .wilnaren-paint-castle .castle-owner-widget img {
		max-width: 88px !important;
		height: auto !important;
	}

	/* ---------------------------------------------------------
	   FORMULARIOS / MÓDULOS GENERALES
	   --------------------------------------------------------- */
	#content input,
	#content select,
	#content textarea,
	#content button {
		max-width: 100% !important;
	}

	#content .form-control {
		width: 100% !important;
	}

	#content .form-horizontal .form-group {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	/* ---------------------------------------------------------
	   FOOTER
	   --------------------------------------------------------- */
	.footer {
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		margin: 0 !important;
		padding: 16px 10px !important;
		background: linear-gradient(180deg, rgba(14,14,14,.99), #080808) !important;
		border-top: 1px solid rgba(205,160,78,.20) !important;
		color: #888 !important;
		overflow: hidden !important;
	}

	.footer .footer-container,
	.footer .container,
	.footer > div {
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
		margin: 0 auto !important;
		padding: 0 !important;
		text-align: center !important;
		background: transparent !important;
	}

	.footer .footer-container .row {
		width: 100% !important;
		margin: 0 !important;
	}

	.footer .footer-container .col-xs-12 {
		float: none !important;
		width: 100% !important;
		padding: 0 !important;
		text-align: center !important;
	}

	.footer .footer-container > .row:first-child span {
		display: none !important;
	}

	.footer a {
		display: inline-block !important;
		margin: 4px 6px !important;
		color: #bfa064 !important;
		font-size: 10px !important;
		white-space: normal !important;
	}

	.footer p,
	.footer div,
	.footer span {
		color: #8f8f8f !important;
		font-size: 10px !important;
		line-height: 1.65 !important;
	}

	.footer hr {
		margin: 12px 0 !important;
		border-color: rgba(255,255,255,.07) !important;
	}
}


/* =========================================================
   CELULARES CHICOS
   ========================================================= */
@media (max-width: 480px) {

	#header {
		height: 165px !important;
		min-height: 165px !important;
	}

	#header .webengine-mu-logo {
		max-width: 175px !important;
		max-height: 105px !important;
	}

	.header-info {
		width: calc(100% - 14px) !important;
	}

	.header-info-block {
		padding: 10px !important;
		font-size: 9px !important;
	}

	#container {
		width: calc(100% - 8px) !important;
		max-width: calc(100% - 8px) !important;
		padding: 6px !important;
	}

	#content .home-news-block-article {
		grid-template-columns: 48px minmax(0,1fr) 58px !important;
		gap: 5px !important;
	}

	#content .home-news-block-article-type {
		font-size: 8px !important;
	}

	#content .home-news-block-article-title a {
		font-size: 10px !important;
	}

	#content .panel-sidebar .panel-heading .panel-title {
		font-size: 11px !important;
	}

	#content .top3-other-row,
	#content .guild-other-row {
		gap: 6px !important;
	}
}


/* =========================================================
   DESKTOP
   ========================================================= */
@media (min-width: 992px) {

	.wil-mobile-menu-toggle {
		display: none !important;
	}

	#wil-main-nav {
		display: block !important;
	}
}