/* ------------------------------------------ variables gloables ------------------------------------------ */

:root {
	--colorPrincipal: #fa2851;
	--colorSecundario: #350d82;
	--colorBlanco: #ffffff;
	--colorNegro: #000000;
}

/* ------------------------------------------ utilidades ------------------------------------------ */

.boton {
	background-color: var(--colorPrincipal);
	color: var(--colorBlanco) !important;
	border-radius: 5px;
	height: 50px;
	text-align: center;
	vertical-align: middle;
	cursor: pointer;
}

.width-100 {
	width: 100%;
}

input[type='file'] {
	display: none;
}

/* ------------------------------------------ estilos especiales ------------------------------------------ */

.carga__archivo {
	padding: 10px;
	font-size: 17px;
	background-color: var(--colorPrincipal);
	color: var(--colorBlanco);
	border-radius: 5px;
	cursor: pointer;
}

.contenedor__cheks {
	display: flex;
	flex-wrap: wrap;
	background-color: var(--colorSecundario);
	border-radius: 5px;
	color: var(--colorBlanco);
	padding: 20px;
	margin-top: 10px;
}

.contenedor__converacion {
	max-height: 540px;
	overflow-y: scroll;
}

.audio-player {
	display: flex;
	align-items: center;
	justify-content: center;
	column-gap: 20px;
	width: 100%;
}

.audio-player audio {
	width: 100%;
}

.contenedor__informacion {
	max-height: 540px;
	overflow-y: scroll;
}

.contenedor__nombres {
	display: flex;
	justify-content: space-around;
}

.material-symbols-outlined {
	vertical-align: middle !important;
}

.card__checks {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
