/*SECCION DE MODULOS.HTML*/

/* Estado normal */
.pill-circle {
	width: 50px;
	height: 54px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: none;
	transition: all 0.2s ease;
}

/* Ícono normal */
.pill-circle i {
	font-size: 25px;
	color: #fff;
	transition: color 0.2s ease;
}

/* Estado activo → outline */
.pill-circle.active {
	background-color: transparent !important;
	border: 2.5px solid currentColor;
	color: inherit;
}

/* Ícono cuando el pill está activo */
.pill-circle.active i {
	color: inherit;
	/* mantiene el mismo color que el círculo */
}

.nav-pills .nav-item:nth-child(1) .pill-circle.active {
	border-color: #0b3aa3;
	color: #0b3aa3;
}

.nav-pills .nav-item:nth-child(2) .pill-circle.active {
	border-color: #1f6fe0;
	color: #1f6fe0;
}

.nav-pills .nav-item:nth-child(3) .pill-circle.active {
	border-color: #19b1ff;
	color: #19b1ff;
}

.nav-pills .nav-item:nth-child(4) .pill-circle.active {
	border-color: #35d0c2;
	color: #35d0c2;
}

.nav-pills .nav-item:nth-child(5) .pill-circle.active {
	border-color: #7ad85f;
	color: #7ad85f;
}

.nav-pills .nav-item:nth-child(6) .pill-circle.active {
	border-color: #a3e635;
	color: #a3e635;
}

.nav-item p {
	display: none;
	opacity: 0;
	transition: opacity 0.3s ease-in-out;
}

.nav-link {
	transition: transform 0.3s ease-in-out;
	/* Animación suave */
}

.nav-link:hover {
	transform: scale(0.93);
	/* Zoom del ícono */
}

.nav-link.active+div p {
	display: block;
	opacity: 1;
}

/*SECCION DE IMG*/
.mod-title {
	font-size: 40pt;
}

.mod-subtitle {
	font-size: 18pt;
}

.mod-add {
	font-size: 16pt;
}
.txtt-gradient {
	display: inline-block;
	/* para que el fondo siga al texto */
	background: linear-gradient(90deg,
			#0b3aa3 0%,
			#1f6fe0 30%,
			#19b1ff 55%,
			#35d0c2 75%,
			#7ad85f 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	/* muestra el gradiente “dentro” del texto */
	-webkit-text-fill-color: transparent;
}