/* Contenido wiki (plantilla Royal) dentro del marco Tibia (.BoxContent) */
.wiki-page-wrap {
	text-align: left;
	max-width: 100%;
	overflow-x: auto;
	box-sizing: border-box;
}

/* Evita recortes por overflow:hidden de la plantilla Royal (.global-desc) */
.wiki-page-wrap .global-desc {
	overflow: visible !important;
}

.wiki-page-wrap .global-desc {
	width: 100% !important;
	max-width: 100%;
	box-sizing: border-box;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: stretch;
}

/* Área de contenido: alto según pestaña activa (sin reservar cientos de px vacíos) */
.wiki-page-wrap .global-desc__content {
	max-width: 100%;
	min-height: 0;
	position: relative;
	flex: 1 1 360px;
}

@media (min-width: 1100px) {
	.wiki-page-wrap .global-desc__nav {
		flex: 0 0 300px;
		width: 300px !important;
	}
	.wiki-page-wrap .global-desc__content {
		width: calc(100% - 300px - 12px) !important;
		max-width: none;
		flex: 1 1 360px;
	}
}

/* Título duplicado de la wiki: alinear con el scroll del box */
.wiki-page-wrap .desc-changelog__block {
	margin-top: 4px;
}

/*
 * Legibilidad: la plantilla Royal usa títulos muy claros (#d8bda5) sobre tarjetas semitransparentes;
 * encima del panel Canary se pierde contraste. Tarjetas oscuras + Verdana + texto claro.
 */
.wiki-page-wrap .desc-enchant__block,
.wiki-page-wrap .desc-boss__block {
	box-sizing: border-box !important;
	background: #2a211c !important;
	border: 1px solid #5c4a3e !important;
	border-bottom: 1px solid #3d2e28 !important;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.wiki-page-wrap .desc-enchant__title,
.wiki-page-wrap .desc-boss__title {
	font-family: Verdana, Geneva, Tahoma, sans-serif !important;
	font-weight: 700 !important;
	color: #fff8f0 !important;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.75);
}

.wiki-page-wrap .desc-enchant__line,
.wiki-page-wrap .desc-boss__line {
	font-family: Verdana, Geneva, Tahoma, sans-serif !important;
	font-size: 13px !important;
	line-height: 1.45 !important;
	color: #e8ddd0 !important;
}

.wiki-page-wrap .desc-enchant__line b,
.wiki-page-wrap .desc-boss__line b,
.wiki-page-wrap .desc-boss b {
	color: #ffc266 !important;
}

/* canary-port fuerza span dentro de .global-desc__content a marrón oscuro */
.wiki-page-wrap .desc-enchant__block span,
.wiki-page-wrap .desc-boss__block span,
.wiki-page-wrap .desc-enchant__block i,
.wiki-page-wrap .desc-boss__block i {
	color: #e8ddd0 !important;
}

.wiki-page-wrap .desc-text__title.fz_20,
.wiki-page-wrap .desc-text__title {
	font-family: Verdana, Geneva, Tahoma, sans-serif !important;
	color: #3d1f0a !important;
	text-shadow: 0 1px 0 #fff6e8;
}

.wiki-page-wrap .desc-text__text,
.wiki-page-wrap .desc-text__text.fz_15 {
	font-family: Verdana, Geneva, Tahoma, sans-serif !important;
	color: #3d2418 !important;
	line-height: 1.5 !important;
}

.wiki-page-wrap .global-desc__content-title-text {
	font-family: Verdana, Geneva, Tahoma, sans-serif !important;
}

/* Evitar desborde horizontal: grillas Royal usan width 100%+10px y calc() sin border-box */
.wiki-page-wrap .desc-boss__blocks,
.wiki-page-wrap .desc-enchant__blocks {
	width: 100% !important;
	max-width: 100%;
	margin-left: 0 !important;
	margin-right: 0 !important;
	box-sizing: border-box;
}

.wiki-page-wrap .global-desc__content-box {
	max-width: 100%;
	box-sizing: border-box;
	overflow-x: hidden;
	padding: 12px 10px !important;
}

/* Tarjetas tipo "Expansion Map" (.desc-rate__rates): 8 columnas + padding rompían el ancho */
.wiki-page-wrap .desc-rate__rates {
	max-width: 100%;
	box-sizing: border-box;
	overflow-x: hidden;
}

.wiki-page-wrap .desc-rate__rates.flex-ss {
	display: flex !important;
	flex-wrap: wrap !important;
	justify-content: flex-start !important;
	align-items: stretch;
	gap: 8px;
}

.wiki-page-wrap .desc-rate__rates-item {
	box-sizing: border-box !important;
	flex: 1 1 calc(25% - 8px);
	min-width: 140px;
	max-width: calc(33.333% - 8px);
	width: auto !important;
	padding: 14px 8px !important;
}

@media (max-width: 900px) {
	.wiki-page-wrap .desc-rate__rates-item {
		flex: 1 1 calc(50% - 8px);
		max-width: calc(50% - 8px);
	}
}

@media (max-width: 520px) {
	.wiki-page-wrap .desc-rate__rates-item {
		flex: 1 1 100%;
		max-width: 100%;
	}
}

.wiki-page-wrap .desc-rate__rates-item-title {
	color: #2a1810 !important;
	font-family: Verdana, Geneva, Tahoma, sans-serif !important;
	line-height: 1.25 !important;
}

.wiki-page-wrap .desc-rate__rates-item-desc {
	color: #4d3018 !important;
	font-family: Verdana, Geneva, Tahoma, sans-serif !important;
	font-size: 12px !important;
	line-height: 1.35 !important;
}

/* Imágenes centradas en textos largos (expansion screenshots) */
.wiki-page-wrap .global-desc__content-box img {
	max-width: 100%;
	height: auto;
	box-sizing: border-box;
}

/* --- Índice de la wiki (cuadrícula): reemplaza la barra lateral de pestañas --- */
.wiki-page-wrap .global-desc__nav {
	display: none !important;
}

.wiki-page-wrap[data-wiki-ui="hub"] #wiki-category-hub {
	display: block;
	width: 100% !important;
	flex: 1 1 100% !important;
	max-width: 100%;
	box-sizing: border-box;
}

.wiki-page-wrap[data-wiki-ui="hub"] .global-desc__content {
	display: none !important;
}

.wiki-page-wrap[data-wiki-ui="category"] #wiki-category-hub {
	display: none !important;
}

.wiki-page-wrap[data-wiki-ui="category"] .global-desc__content {
	display: block !important;
	width: 100% !important;
	flex: 1 1 100% !important;
	max-width: 100% !important;
}

.wiki-category-hub__loading {
	text-align: center;
	color: #5a4a38;
	font-size: 10pt;
	margin: 24px 0;
}

.wiki-category-hub__intro {
	text-align: center;
	margin-bottom: 18px;
}

.wiki-category-hub__title {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 22pt;
	font-weight: 700;
	color: #3d2410;
	margin: 0 0 8px;
	text-shadow: 0 1px 0 #fff6e8;
}

.wiki-category-hub__sub {
	color: #5a4a38;
	font-size: 10pt;
	margin: 0 auto;
	max-width: 520px;
	line-height: 1.45;
}

.wiki-category-hub__grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 12px 14px;
}

@media (min-width: 720px) {
	.wiki-category-hub__grid {
		grid-template-columns: repeat(3, 1fr);
	}
}

@media (min-width: 980px) {
	.wiki-category-hub__grid {
		grid-template-columns: repeat(4, 1fr);
	}
}

.wiki-hub-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	width: 100%;
	box-sizing: border-box;
	min-height: 132px;
	padding: 12px 10px 14px;
	margin: 0;
	cursor: pointer;
	font: inherit;
	text-align: center;
	color: inherit;
	background: linear-gradient(180deg, #d8c8a8 0%, #c9b896 100%);
	border: 1px solid #7a6548;
	border-radius: 2px;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35), 0 1px 2px rgba(0, 0, 0, 0.12);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.wiki-hub-card:hover {
	border-color: #2c6aa0;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45), 0 2px 6px rgba(44, 106, 160, 0.25);
}

.wiki-hub-card .global-desc__nav-icon {
	position: relative;
	width: 48px;
	height: 48px;
	margin-bottom: 8px;
	flex-shrink: 0;
}

.wiki-hub-card .global-desc__nav-icon img {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	max-width: 44px;
	max-height: 44px;
	width: auto;
	height: auto;
	pointer-events: none;
}

.wiki-hub-card__text {
	width: 100%;
}

.wiki-hub-card__title {
	font-weight: 700;
	font-size: 11pt;
	color: #1a4d8c;
	line-height: 1.2;
	margin-bottom: 4px;
}

.wiki-hub-card__sub {
	font-size: 9pt;
	font-weight: 600;
	color: #5a4a38;
	line-height: 1.2;
}

.wiki-hub-back-btn {
	display: inline-block;
	margin: 0 0 14px;
	padding: 10px 20px;
	font-size: 10pt;
	font-weight: 700;
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	cursor: pointer;
	color: #2a1810;
	background: linear-gradient(180deg, #d8c8a8 0%, #c9b896 100%);
	border: 1px solid #7a6548;
	border-radius: 2px;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35), 0 1px 2px rgba(0, 0, 0, 0.12);
	transition: border-color 0.15s ease, box-shadow 0.15s ease, color 0.15s ease;
}

.wiki-hub-back-btn:hover {
	border-color: #2c6aa0;
	color: #0d3d66;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45), 0 2px 6px rgba(44, 106, 160, 0.25);
}

/* "A look on systems": imágenes centradas en cada celda (evita left: calc(100% - 700px) roto en columnas estrechas) */
.wiki-page-wrap .desc-bonuses.flex-ss,
.wiki-page-wrap .desc-bonuses {
	display: flex !important;
	flex-wrap: wrap !important;
	justify-content: center !important;
	align-items: stretch;
	gap: 10px;
	border: 1px solid rgba(90, 70, 50, 0.35);
	background: rgba(255, 250, 240, 0.35);
	padding: 10px 8px 12px;
	box-sizing: border-box;
}

.wiki-page-wrap .desc-bonuses__item {
	width: calc(50% - 8px) !important;
	min-width: 130px;
	max-width: 220px;
	height: 200px !important;
	flex: 1 1 calc(33.333% - 10px);
	position: relative !important;
	overflow: hidden;
	border: 1px solid #8a7658;
	box-sizing: border-box;
	background: linear-gradient(160deg, rgba(90, 70, 50, 0.12) 0%, rgba(140, 120, 100, 0.06) 100%);
}

@media (min-width: 900px) {
	.wiki-page-wrap .desc-bonuses__item {
		width: calc(20% - 10px) !important;
		flex: 1 1 calc(20% - 10px);
		max-width: none;
	}
}

.wiki-page-wrap .desc-bonuses img {
	position: absolute !important;
	left: 50% !important;
	top: 38% !important;
	transform: translate(-50%, -50%) !important;
	max-width: 88% !important;
	max-height: 110px !important;
	width: auto !important;
	height: auto !important;
	object-fit: contain;
}

.wiki-page-wrap .desc-bonuses__content {
	position: absolute !important;
	left: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	padding: 10px 8px 12px !important;
	box-sizing: border-box;
}

.wiki-page-wrap .desc-bonuses__name {
	font-size: 15px !important;
	margin-bottom: 8px !important;
	color: #c4923a !important;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45);
}

/* Basic Information: usar banner original y fallback si no carga */
.wiki-page-wrap .desc-main__header {
	background:
		linear-gradient(180deg, rgba(22, 16, 12, 0.08) 0%, rgba(22, 16, 12, 0.45) 100%),
		url('../application/templates/default/images/bg/valley.webp') top center / cover no-repeat,
		url('../application/templates/default/images/description/desc_top_bg.png') center / cover no-repeat !important;
	position: relative;
	overflow: hidden;
}

.wiki-page-wrap .desc-main__header::before {
	content: "ROYAL EXODUS";
	position: absolute;
	top: 16px;
	right: 18px;
	font-family: Verdana, Arial, sans-serif;
	font-size: 28px;
	font-weight: 800;
	letter-spacing: 1.6px;
	color: #f3d7a4;
	text-shadow: 0 2px 0 #3a2414, 0 6px 14px rgba(0, 0, 0, 0.65);
	opacity: 0.95;
	pointer-events: none;
}

.wiki-page-wrap .desc-main__header::after {
	content: "Legendary MMORPG World";
	position: absolute;
	top: 52px;
	right: 20px;
	font-family: Verdana, Arial, sans-serif;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 1.1px;
	text-transform: uppercase;
	color: #ffe8c5;
	text-shadow: 0 2px 8px rgba(0, 0, 0, 0.8);
	opacity: 0.92;
	pointer-events: none;
}

/* Navegación lateral por categorías */
.wiki-page-wrap .wiki-nav-category {
	margin-bottom: 14px;
}

.wiki-page-wrap .wiki-nav-category__title {
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: #ffd85d;
	padding: 6px 8px 4px;
	border-bottom: 1px solid rgba(92, 74, 62, 0.6);
	margin-bottom: 4px;
}

/* Hub: secciones agrupadas */
.wiki-category-hub__section {
	margin-bottom: 22px;
}

.wiki-category-hub__section-title {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 14pt;
	font-weight: 700;
	color: #3d2410;
	margin: 0 0 10px;
	padding-bottom: 6px;
	border-bottom: 1px solid rgba(122, 101, 72, 0.45);
	text-shadow: 0 1px 0 #fff6e8;
}

/* Índice en pestaña Información del servidor */
.wiki-system-index {
	display: grid;
	grid-template-columns: 1fr;
	gap: 14px;
}

@media (min-width: 720px) {
	.wiki-system-index {
		grid-template-columns: repeat(2, 1fr);
	}
}

.wiki-system-index__cat-title {
	font-size: 15px;
	color: #ffd85d;
	margin: 0 0 8px;
	font-family: Verdana, Geneva, Tahoma, sans-serif;
}

.wiki-system-index__list {
	margin: 0;
	padding-left: 1.1em;
	color: #e8ddd0;
	font-size: 14px;
	line-height: 1.55;
}

.wiki-system-index__list li {
	margin-bottom: 4px;
}

.wiki-page-wrap .wiki-table th,
.wiki-page-wrap .wiki-table td {
	font-family: Verdana, Geneva, Tahoma, sans-serif;
}

/* Chips de ítem (sprite + nombre) */
.wiki-item-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	vertical-align: middle;
	padding: 3px 8px 3px 4px;
	margin: 2px 4px 2px 0;
	background: rgba(0, 0, 0, 0.35);
	border: 1px solid #5c4a3e;
	border-radius: 4px;
	max-width: 100%;
}

.wiki-item-chip__img {
	width: 32px;
	height: 32px;
	object-fit: contain;
	image-rendering: pixelated;
	image-rendering: -moz-crisp-edges;
	image-rendering: crisp-edges;
	flex-shrink: 0;
}

.wiki-item-chip__name {
	color: #ffe8c5;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.25;
}

/* Cuadrícula de ítems */
.wiki-items-grid {
	display: grid;
	grid-template-columns: repeat(var(--wiki-grid-cols, 4), minmax(0, 1fr));
	gap: 10px 12px;
}

.wiki-items-grid__cell {
	background: rgba(0, 0, 0, 0.28);
	border: 1px solid #5c4a3e;
	border-radius: 6px;
	padding: 10px 8px;
	text-align: center;
}

.wiki-items-grid__cell .wiki-item-chip {
	flex-direction: column;
	margin: 0 auto;
	padding: 6px 4px;
}

.wiki-items-grid__cell .wiki-item-chip__img {
	width: 40px;
	height: 40px;
}

.wiki-items-grid__note {
	margin-top: 6px;
	font-size: 12px;
	color: #c9b896;
	line-height: 1.35;
}

/* Criaturas (bosses, familiares) */
.wiki-creatures-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}

@media (min-width: 720px) {
	.wiki-creatures-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (min-width: 1000px) {
	.wiki-creatures-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

.wiki-creatures-grid--compact .wiki-creature-card__frame {
	min-height: 72px;
}

.wiki-creature-card {
	background: rgba(0, 0, 0, 0.3);
	border: 1px solid #5c4a3e;
	border-radius: 8px;
	padding: 10px 8px 12px;
	text-align: center;
	box-sizing: border-box;
}

.wiki-creature-card__frame {
	min-height: 88px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 6px;
}

.wiki-creature-card__sprite {
	max-width: 72px;
	max-height: 72px;
	width: auto;
	height: auto;
	object-fit: contain;
	image-rendering: pixelated;
	image-rendering: -moz-crisp-edges;
	image-rendering: crisp-edges;
}

.wiki-creature-card__sprite--anim {
	max-width: 80px;
	max-height: 80px;
}

.wiki-creature-card__name {
	color: #ffd85d;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.3;
}

.wiki-creature-card__meta {
	margin-top: 6px;
	font-size: 12px;
	color: #e8ddd0;
}

/* Flujo de proceso (fusión, tasks, etc.) */
.wiki-process-demo {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 8px 12px;
	padding: 14px 10px;
	background: rgba(0, 0, 0, 0.25);
	border: 1px solid #5c4a3e;
	border-radius: 8px;
}

.wiki-process-demo__step {
	display: flex;
	flex-direction: column;
	align-items: center;
	min-width: 88px;
	max-width: 140px;
	text-align: center;
}

.wiki-process-demo__outfit img {
	width: 64px;
	height: 64px;
	object-fit: contain;
	image-rendering: pixelated;
	animation: wiki-outfit-bob 2.2s ease-in-out infinite;
}

@keyframes wiki-outfit-bob {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-3px); }
}

.wiki-process-demo__items {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 4px;
}

.wiki-process-demo__items .wiki-item-chip {
	flex-direction: column;
	padding: 4px;
}

.wiki-process-demo__items .wiki-item-chip__img {
	width: 28px;
	height: 28px;
}

.wiki-process-demo__label {
	margin-top: 6px;
	font-size: 12px;
	color: #e8ddd0;
	line-height: 1.3;
}

.wiki-process-demo__arrow {
	font-size: 28px;
	color: #ef8757;
	font-weight: 700;
	padding: 0 4px;
}

.wiki-page-wrap .wiki-table .wiki-item-chip {
	white-space: normal;
}
