/* Fase 12 · pulido final del sistema de Perfil. */

.cp-profile-page {
	--cp12-radius-page: 28px;
	--cp12-radius-card: 22px;
	--cp12-shadow-card: 0 14px 40px rgba(11, 32, 55, .055);
}

.cp-profile-page :is(h1, h2, h3) {
	overflow-wrap: normal;
	word-break: normal;
}

.cp-profile-page .cp-claims9-create > header > strong,
.cp-profile-page .cp-claims9-history > header > strong {
	flex: 0 0 auto;
	max-width: 100%;
	overflow-wrap: normal;
	white-space: nowrap;
}

@media (max-width: 920px) {
	.cp-profile-page {
		scroll-padding-bottom: calc(112px + env(safe-area-inset-bottom, 0px));
	}

	.cp-profile-page .cp-main {
		padding-bottom: max(20px, env(safe-area-inset-bottom, 0px));
	}

	.cp-profile-page .cp-mobile-nav a {
		font-size: 8.5px !important;
		gap: 2px;
		letter-spacing: -.015em;
		min-width: 0;
	}

	.cp-profile-page .cp-mobile-nav a > span:last-child {
		max-width: none;
		overflow: visible;
		text-overflow: clip;
		white-space: nowrap;
	}
}

@media (max-width: 25rem) {
	/* La accesibilidad no debe convertir los resúmenes en listas interminables. */
	.cp-profile-page .cp-home4-stats {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		grid-template-rows: auto;
	}

	.cp-profile-page .cp-home4-stats > div {
		align-content: center;
		gap: 2px;
		grid-template-columns: 1fr;
		justify-items: center;
		min-width: 0;
		padding: 8px 3px;
		text-align: center;
	}

	.cp-profile-page .cp-home4-stats > div + div {
		border-left: 1px solid rgba(255, 255, 255, .12);
		border-top: 0;
	}

	.cp-profile-page .cp-home4-stats strong {
		font-size: 24px;
		grid-row: auto;
	}

	.cp-profile-page .cp-home4-stats span {
		font-size: 9px;
	}

	.cp-profile-page .cp-home4-stats small {
		font-size: 7px;
	}

	.cp-profile-page .cp-social5-stats {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.cp-profile-page .cp-social5-stats > div {
		min-height: 62px;
	}

	.cp-profile-page .cp-social5-stats > div:nth-child(n+3) {
		border-top: 1px solid rgba(255, 255, 255, .12);
	}

	.cp-profile-page .cp-social5-stats > div:nth-child(odd) {
		border-left: 0;
	}

	.cp-profile-page .cp-social5-stats > div:nth-child(even) {
		border-left: 1px solid rgba(255, 255, 255, .12);
	}

	.cp-profile-page .cp-claims9-create > header {
		align-items: flex-start;
		gap: 10px;
	}

	.cp-profile-page .cp-claims9-create > header > strong {
		font-size: 10px;
		padding: 6px 8px;
	}
}

@media (max-width: 22rem) {
	.cp-profile-page .cp-mobile-nav a {
		font-size: 7.75px !important;
		padding-left: 1px !important;
		padding-right: 1px !important;
	}
}
