MediaWiki:Common.css

Nota: Después de publicar, quizás necesite actualizar la caché de su navegador para ver los cambios.

• Firefox/Safari: Mantenga presionada la tecla Shift mientras pulsa el botón Actualizar, o presiona Ctrl+F5 o Ctrl+R (⌘+R en Mac)
• Google Chrome: presione Ctrl+Shift+R (⌘+Shift+R en Mac)
• Edge: mantenga presionada Ctrl mientras pulsa Actualizar, o presione Ctrl+F5

/* ==========================================================
   TENARIUS RO - SIDEBAR ELEGANTE
   Estilo cálido dorado/rojo inspirado en la portada principal
   Compatible con Vector legacy y Vector 2022
   ========================================================== */

/* Fondo general del panel lateral */
#mw-panel,
.vector-main-menu,
.vector-main-menu-landmark {
	background: linear-gradient(180deg, #fff7df 0%, #fffaf0 52%, #ffe7a8 100%) !important;
	border-right: 1px solid #ead7ad !important;
	box-shadow: 8px 0 24px rgba(100,70,20,.08);
}

/* Contenedor de cada bloque del sidebar */
#mw-panel .portal,
#mw-panel .vector-menu-portal,
.vector-main-menu .vector-menu,
.vector-main-menu .vector-main-menu-action,
.vector-main-menu .vector-pinnable-element {
	background: #ffffff;
	border: 1px solid #ead7ad;
	border-radius: 16px;
	margin: 10px 10px 14px 10px;
	padding: 8px 10px 10px 10px;
	box-shadow: 0 6px 18px rgba(100,70,20,.10);
	overflow: hidden;
}

/* Títulos de secciones */
#mw-panel .portal h3,
#mw-panel .vector-menu-heading,
.vector-main-menu .vector-menu-heading,
.vector-main-menu .vector-pinnable-header-label {
	background: linear-gradient(135deg, #8b1e12 0%, #c43b22 62%, #f0a500 100%);
	color: #ffffff !important;
	border-radius: 12px;
	padding: 8px 10px !important;
	margin: 0 0 8px 0 !important;
	font-size: 13px !important;
	font-weight: 900 !important;
	letter-spacing: .3px;
	text-transform: none !important;
	border: 1px solid rgba(255,255,255,.35);
	box-shadow: 0 4px 10px rgba(89,59,5,.16);
}

/* Quitar decoraciones viejas de Vector */
#mw-panel .portal h3::after,
#mw-panel .vector-menu-heading::after {
	display: none !important;
}

/* Listas */
#mw-panel .portal .body,
#mw-panel .vector-menu-content,
.vector-main-menu .vector-menu-content {
	margin: 0 !important;
	padding: 0 !important;
}

#mw-panel .portal ul,
#mw-panel .vector-menu-content-list,
.vector-main-menu .vector-menu-content-list {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

/* Elementos del menú */
#mw-panel .portal li,
#mw-panel .vector-menu-content-list li,
.vector-main-menu .vector-menu-content-list li {
	margin: 3px 0 !important;
	padding: 0 !important;
}

/* Links normales */
#mw-panel .portal a,
#mw-panel .vector-menu-content-list a,
.vector-main-menu .vector-menu-content-list a {
	display: block;
	color: #5b2500 !important;
	background: #fffaf0;
	border: 1px solid transparent;
	border-radius: 10px;
	padding: 7px 9px;
	font-size: 13px;
	font-weight: 700;
	text-decoration: none !important;
	line-height: 1.35;
	transition: all .18s ease;
}

/* Hover elegante */
#mw-panel .portal a:hover,
#mw-panel .vector-menu-content-list a:hover,
.vector-main-menu .vector-menu-content-list a:hover {
	color: #8b1e12 !important;
	background: #fff1c4;
	border-color: #e0b94f;
	box-shadow: 0 4px 10px rgba(100,70,20,.12);
	transform: translateX(3px);
}

/* Link activo o seleccionado */
#mw-panel .portal li.selected a,
#mw-panel .vector-menu-content-list li.selected a,
.vector-main-menu .vector-menu-content-list li.selected a {
	background: linear-gradient(135deg, #ffd454 0%, #ffe7a8 100%);
	color: #4b2500 !important;
	border-color: #d99b00;
	font-weight: 900;
}

/* Bloque de búsqueda */
#p-search,
.vector-typeahead-search {
	background: #ffffff !important;
	border: 1px solid #ead7ad !important;
	border-radius: 16px !important;
	box-shadow: 0 6px 18px rgba(100,70,20,.10);
}

/* Input de búsqueda */
#searchInput,
.vector-search-box-input {
	background: #fffaf0 !important;
	border: 1px solid #ead7ad !important;
	border-radius: 10px !important;
	color: #5b2500 !important;
	font-weight: 700;
}

/* Botón de búsqueda */
#searchButton,
#mw-searchButton,
.vector-search-box-button {
	background: linear-gradient(135deg, #8b1e12 0%, #c43b22 100%) !important;
	color: #ffffff !important;
	border: 1px solid #8b1e12 !important;
	border-radius: 10px !important;
	font-weight: 900;
}

/* Logo / zona superior */
#p-logo,
.mw-logo {
	margin-bottom: 12px !important;
}

/* Ajuste para que no se vea apretado */
#mw-panel {
	padding-top: 12px !important;
}

/* Scroll del menú cuando el contenido sea muy largo */
#mw-panel,
.vector-main-menu {
	scrollbar-width: thin;
	scrollbar-color: #c43b22 #fff1c4;
}

#mw-panel::-webkit-scrollbar,
.vector-main-menu::-webkit-scrollbar {
	width: 8px;
}

#mw-panel::-webkit-scrollbar-track,
.vector-main-menu::-webkit-scrollbar-track {
	background: #fff1c4;
}

#mw-panel::-webkit-scrollbar-thumb,
.vector-main-menu::-webkit-scrollbar-thumb {
	background: #c43b22;
	border-radius: 999px;
}

/* Versión móvil / pantallas pequeñas */
@media screen and (max-width: 900px) {
	#mw-panel .portal,
	#mw-panel .vector-menu-portal,
	.vector-main-menu .vector-menu {
		margin: 8px 6px 12px 6px;
		border-radius: 14px;
	}

	#mw-panel .portal a,
	#mw-panel .vector-menu-content-list a,
	.vector-main-menu .vector-menu-content-list a {
		font-size: 13px;
		padding: 8px 10px;
	}
}