/**
 * Registro de cuenta / comercio — Plugin/Users/View/Users/register.ctp
 * Estilos extraídos del <style> embebido, alineados al design system Croma
 * (tokens --color-*, --text-*, --radius* en webroot/css/colors.css).
 */

/* Loading Overlay Styles */
#site-creando {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 9999;
	background: color-mix(in srgb, var(--color-white) 97%, transparent);
}

#site-creando .loading-overlay {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}

#site-creando .loading-content {
	text-align: center;
	padding: 40px;
	max-width: 400px;
}

#site-creando .spinner-loader {
	width: 60px;
	height: 60px;
	border: 4px solid color-mix(in srgb, var(--color-grey) 15%, white);
	border-top-color: var(--color-navy);
	border-radius: 50%;
	animation: spin 1s linear infinite;
	margin: 0 auto 24px;
}

@keyframes spin {
	to { transform: rotate(360deg); }
}

#site-creando h2 {
	font-size: var(--text-2xl);
	font-weight: 600;
	margin-bottom: 12px;
	color: var(--color-navy);
}

#site-creando p {
	font-size: var(--text-base);
	margin-bottom: 8px;
}

#site-creando small {
	font-size: var(--text-sm);
	color: var(--color-secondary);
}