html 
{
	position: relative;
	min-height: 100%;
}

/* Pinta el fondo gris en campos deshabilitados y de solo lectura  */
.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control 
{
	background : none;
	background-color: #eee;
	opacity: 1;
}

/* Necesario porque en formularios largos no aparece el pop-up de java que indica que debemos rellenar el campo */
:root 
{
	scroll-behavior: auto !important;
}

/* Solo aplica a las celdas de datos, no a las cabeceras de las rejillas */
table.dataTable td.small-text
{
    font-size: 85% !important;  /* Fuerza el tamaño de la letra a 85% */
}

/* Para ajustar el texto */
.break-word 
{
	white-space: normal !important;
	word-break: break-all;
}



/* Contenido del menú desplegable */
		/* Botón desplegable de opciones */
		.dropdown 
		{
			position: relative;
			display: inline-block;
		}

		.dropdown-content 
		{
			display: none;
			position: fixed; /* Se posicionará en relación a la ventana */
			background-color: #ffffff;
			width: 240px;
			box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
			z-index: 9999;
			border-radius: 8px;
			max-height: 320px;
			overflow-y: auto; /* Scroll vertical para contenido largo */
			overflow-x: hidden;
			word-wrap: break-word;
			white-space: normal;
		}

		.dropdown-content a 
		{
			text-decoration: none !important;
			display: block;
			padding: 12px 16px; /* Espaciado interno */
			color: #555; /* Color del texto */
			font-size: 14px; /* Tamaño de fuente */
			transition: all 0.3s ease; /* Suaviza las transiciones */
			background-color: #fff; /* Fondo blanco */
			position: relative; /* Necesario para el espaciado */
			word-wrap: break-word; /* Rompe las palabras largas */
			overflow: hidden; /* Esconde el texto sobrante */
			white-space: normal; /* Permite que el texto ocupe varias líneas */
		}

		/* Efecto al pasar el ratón */
		.dropdown-content a:hover 
		{
			background-color: #f0f0f0; /* Fondo gris claro */
			color: #0078d4; /* Color de texto resaltado */
		}

		/* Líneas divisorias */
		.dropdown-content a:not(:last-child) 
		{
			border-bottom: 1px solid #eaeaea; /* Línea divisoria */
		}

		/* Mostrar desplegable al pasar el ratón */
		.dropdown:hover .dropdown-content 
		{
			display: block;
		}

        .dropbtn 
		{
            background-color: transparent; /* Fondo transparente */
            border: none;
            border-radius: 4px;
            font-size: 16px;
            cursor: pointer;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 5px; /* Espacio entre el texto y el ícono (si hay texto) */
        }

        .dropbtn:hover 
		{
            background-color: rgba(255, 0, 0, 0.1); /* Fondo ligeramente rojo al pasar el ratón */
            color: red; /* Mantener el color del texto e ícono */
            border-color: red; /* Borde rojo al hacer hover */
        }

        .dropbtn i 
		{
            pointer-events: none; /* Permite que el clic pase al botón completo */
        }




/* Para la información que se muestra al desplegar la fila de las rejillas */
		/* Contenedor principal */
		.ContenedorInfoDesplegable
		{
			max-width: 100%; /* Permite que el contenido use todo el ancho disponible */
			margin: auto; /* Centra el contenido */
			overflow-x: hidden; /* Evita la barra de desplazamiento horizontal */
		}

		/* Formato de la lista */
		.ContenedorInfoDesplegable-dl 
		{
			display: flex;
			flex-direction: column; /* Coloca los elementos en columna */
			margin: 0;
			padding: 0;
		}

		/* Filas individuales */
		.ContenedorInfoDesplegable-row 
		{
			display: flex;
			flex-direction: column; /* Siempre en columna, como pantallas pequeñas */
			margin-bottom: 15px; /* Espaciado entre filas */
			word-wrap: break-word; /* Divide palabras largas para evitar desbordamiento */
			overflow-wrap: break-word; /* Compatibilidad adicional para dividir palabras largas */
		}

		/* Términos (dt) */
		.ContenedorInfoDesplegable-row dt 
		{
			font-weight: bold;
			margin-bottom: 5px; /* Espaciado con el valor */
		}

		/* Valores (dd) */
		.ContenedorInfoDesplegable-row dd 
		{
			margin: 0;
		}

		/* Evita desbordamientos */
		.ContenedorInfoDesplegable-row dt, 
		.ContenedorInfoDesplegable-row dd 
		{
			white-space: normal; /* Fuerza el ajuste del texto en lugar de mantenerlo en una línea */
			word-break: break-word; /* Divide palabras largas */
			overflow-wrap: anywhere; /* Permite dividir incluso sin guiones */
		}



/* Para hacer responsive la rejilla de datos */
		/* Contenedor para hacer la tabla responsiva */
		.table-responsive 
		{
			width: 100%;
			overflow-x: auto; /* Permite desplazamiento horizontal si es necesario */
		}

		/* Estilo para la tabla para asegurarse de que no crezca más que el contenedor */
		#lookup 
		{
			width: 100%;
			table-layout: fixed; /* Esto hace que la tabla no crezca fuera de su contenedor */
		}
		
		#lookup th, #lookup td 
		{
			padding: 8px;
		}

		/* Mejora de la apariencia móvil */
		@media (max-width: 768px) 
		{
			#lookup 
			{
				font-size: 12px; /* Ajusta el tamaño de fuente en dispositivos pequeños */
			}

			#lookup th, #lookup td 
			{
				padding: 6px; /* Reduce el padding en pantallas pequeñas */
			}
		}
	


/* Para los mensajes de bootbox */
	/* Mensaje de error */
	.modal-error .modal-content 
	{
		background-color: #ffebee; /* Rojo pastel suave */
	}