/* ---------------------------------------------------------------------------
   Ajustes mínimos para que la gestión sea usable en móvil.

   Va en un fichero aparte a propósito: css/style.css son 164 KB de plantilla
   con 21 media queries y no conviene editarlos. Salvo la regla del logo, todo
   está dentro de media queries, así que el escritorio no cambia.

   Para desactivarlo entero, basta con quitar su <link> de includes_header.php.
   Añadido 2026-08-13.
   --------------------------------------------------------------------------- */


/* --- Login -----------------------------------------------------------------
   El logo se pintaba siempre a 260 px con max-width:none. En pantallas de
   320 px su contenedor mide 244 y se salía 29 px por la derecha. */
.inner-tittle.page img {
	max-width: 100%;
	height: auto;
}


@media (max-width: 667px) {

	/* --- Menú lateral ------------------------------------------------------
	   La plantilla fuerza width:65px en los TRES estados (normal,
	   .sidebar-collapsed y .sidebar-collapsed-back) y oculta las etiquetas
	   siempre, no solo al colapsar. Por eso el botón de hamburguesa cambiaba
	   de clase sin ningún efecto visible y el menú no se podía abrir.

	   En vez de pelear con esas reglas se usa una clase propia. El menú se
	   superpone al contenido en lugar de empujarlo: en 375 px no caben los dos. */

	.page-container.menu-movil-abierto .sidebar-menu {
		width: 230px !important;
		z-index: 1200;
	}

	.page-container.menu-movil-abierto .sidebar-menu .sidebar ul li a span:not(.fa) {
		display: inline !important;
	}

	/* El bloque .down —foto, nombre, rol y el enlace "Desconectar"— lo oculta la
	   plantilla con `.down { display: none }` por debajo de 667px. Como ese enlace
	   es el ÚNICO logout pulsable de todo el backoffice (sidebar.php:30; el resto
	   son redirecciones PHP), en móvil no había forma de cerrar sesión.
	   Se muestra al desplegar el menú. */
	.page-container.menu-movil-abierto .down {
		display: block !important;
	}

	/* La lista de .down es un desplegable que en escritorio se abre al pulsar el
	   nombre: sus <li> quedan a height:0 hasta entonces. En móvil no hay ese gesto,
	   así que se fuerzan a bloque con altura real. */
	.page-container.menu-movil-abierto .down ul,
	.page-container.menu-movil-abierto .down ul li {
		display: block !important;
		height: auto !important;
		overflow: visible !important;
	}

	.page-container.menu-movil-abierto .down ul li a {
		display: block !important;
		padding: 12px 14px !important;
	}

	.page-container.menu-movil-abierto .down ul li a span:not(.fa) {
		display: inline !important;
	}

	/* Capa que oscurece el resto y permite cerrar tocando fuera */
	.menu-movil-fondo {
		position: fixed;
		top: 0; left: 0; right: 0; bottom: 0;
		background: rgba(0, 0, 0, 0.35);
		z-index: 1100;
	}

	/* Sin niceScroll el menú recupera su scroll nativo, con inercia en iOS.
	   La plantilla le fija una altura en píxeles que en móvil se queda corta. */
	.sidebar-menu .scrollbar {
		height: auto;
		max-height: calc(100vh - 130px);
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
	}

	/* El hamburguesa tenía un área táctil de apenas 19 px */
	.sidebar-icon {
		padding: 12px 14px !important;
	}

	/* Los enlaces del menú, con altura suficiente para el dedo.
	   Lleva !important porque compite con las reglas de la plantilla, igual que
	   las dos de arriba. */
	.page-container.menu-movil-abierto .sidebar ul li a {
		padding-top: 12px !important;
		padding-bottom: 12px !important;
		display: block;
	}
}
