@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');

html, body {
	font-family: "Segoe UI",Roboto,"Helvetica Neue","-apple-system",BlinkMacSystemFont,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
}

html, body {
	height: 100%;
}

.valid.modified:not([type=checkbox]) {
	outline: 1px solid #26b050;
}

.invalid {
	outline: 1px solid red;
}

.validation-message {
	color: red;
}

.button-link {
	text-decoration: unset;
}

#blazor-error-ui {
	background: lightyellow;
	bottom: 0;
	box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
	display: none;
	left: 0;
	padding: 0.6rem 1.25rem 0.7rem 1.25rem;
	position: fixed;
	width: 100%;
	z-index: 1000;
}

	#blazor-error-ui .dismiss {
		cursor: pointer;
		position: absolute;
		right: 0.75rem;
		top: 0.5rem;
	}

.validation-message {
	font-size: 0.875rem; /* Tamaño de fuente pequeño */
	margin-top: 0.25rem; /* Espacio superior */
	padding: 0.5rem; /* Espaciado interno */
	border-radius: 0.25rem; /* Bordes redondeados */
	color: #dc3545; /* Color rojo para errores */
	background-color: #f8d7da; /* Fondo rojo claro */
	border: 1px solid #f5c6cb; /* Borde rojo */
	display: block; /* Mostrar cuando se añade la clase "visible" */
}

/* Contenedor principal del CAPTCHA */
.captcha-container {
	text-align: center;
	padding: 20px;
	border: 1px solid #ddd;
	border-radius: 8px;
	background-color: #f9f9f9;
	max-width: 400px;
	margin: 0 auto;
}

/* Estilo para el texto de instrucción */
.captcha-instruction {
	font-size: 16px;
	color: #333;
	margin-bottom: 15px;
}

/* Contenedor de la imagen del CAPTCHA */
.captcha-image-container {
	margin-bottom: 15px;
}

/* Estilo para la imagen del CAPTCHA */
.captcha-image {
	border: 1px solid #ccc;
	border-radius: 4px;
	padding: 5px;
	background-color: #fff;
}

/* Estilo para el input de texto */
.captcha-input {
	width: 100%;
	padding: 10px;
	font-size: 14px;
	border: 1px solid #ccc;
	border-radius: 4px;
	box-sizing: border-box;
	margin-top: 10px;
}

	/* Estilo para el input cuando está enfocado */
	.captcha-input:focus {
		border-color: #66afe9;
		outline: none;
		box-shadow: 0 0 8px rgba(102, 175, 233, 0.6);
	}