/**
 * Galeth standalone surfaces
 * Login, herramientas auxiliares, validadores, visores y páginas públicas nED.
 */

html.sga-galeth-standalone {
	color-scheme: light dark;
	background: var(--galeth-bg);
}

html.sga-galeth-standalone body {
	min-height: 100vh;
	margin: 0;
	color: var(--galeth-ink-soft);
	background:
		radial-gradient(circle at 94% 4%, rgba(0, 180, 216, .13), transparent 28rem),
		radial-gradient(circle at 4% 96%, rgba(124, 58, 237, .12), transparent 32rem),
		var(--galeth-bg);
	font-family: var(--galeth-font-body);
	-webkit-font-smoothing: antialiased;
}

html.sga-galeth-standalone :where(h1, h2, h3, h4, h5, h6) {
	color: var(--galeth-ink);
	font-family: var(--galeth-font-heading);
	letter-spacing: -.02em;
}

html.sga-galeth-standalone :where(a) {
	color: var(--galeth-cyan-ink);
}

html.sga-galeth-standalone :where(.card, .panel, .box, .modal-content, .login-card, .surface, main > section) {
	color: var(--galeth-ink-soft);
	background: color-mix(in srgb, var(--galeth-surface) 96%, transparent);
	border-color: var(--galeth-line);
	border-radius: var(--galeth-radius);
	box-shadow: var(--galeth-shadow-sm);
}

html.sga-galeth-standalone :where(button, .btn, [type="submit"], [role="button"]) {
	border-radius: var(--galeth-radius-pill);
	font-family: var(--galeth-font-heading);
	font-weight: 700;
	transition: transform .22s var(--galeth-ease-bounce), box-shadow .22s, border-color .22s;
}

html.sga-galeth-standalone :where(.btn-primary, button.primary, [type="submit"]) {
	color: #fff;
	border-color: transparent;
	background: var(--galeth-gradient-purple);
	box-shadow: 0 10px 24px rgba(124, 58, 237, .25);
}

html.sga-galeth-standalone :where(.btn-primary, button.primary, [type="submit"]):hover {
	transform: translateY(-2px);
	box-shadow: var(--galeth-shadow-color);
}

html.sga-galeth-standalone :where(input, select, textarea, .form-control, .form-select) {
	color: var(--galeth-ink);
	background: var(--galeth-surface-raised);
	border: 1.5px solid var(--galeth-line);
	border-radius: var(--galeth-radius-sm);
}

html.sga-galeth-standalone :where(input, select, textarea, .form-control, .form-select):focus {
	outline: none;
	border-color: var(--galeth-cyan);
	box-shadow: var(--galeth-focus);
}

html.sga-galeth-standalone :where(button, a, input, select, textarea, [tabindex]):focus-visible {
	outline: 2px solid var(--galeth-cyan);
	outline-offset: 2px;
	box-shadow: var(--galeth-focus);
}

html.sga-galeth-standalone :where(.alert, .notice, .message) {
	color: var(--galeth-ink-soft);
	background: var(--galeth-bg-tint);
	border: 1px solid var(--galeth-line);
	border-radius: var(--galeth-radius-sm);
}

html.sga-galeth-standalone :where(table) {
	color: var(--galeth-ink-soft);
	background: var(--galeth-surface);
	border-color: var(--galeth-line);
}

html.sga-galeth-standalone :where(th) {
	color: var(--galeth-ink);
	background: var(--galeth-bg-tint);
	font-family: var(--galeth-font-heading);
}

html.sga-galeth-standalone :where(td, th) {
	border-color: var(--galeth-line);
}

html.sga-galeth-standalone,
html.sga-galeth-standalone * {
	scrollbar-width: thin;
	scrollbar-color: color-mix(in srgb, var(--galeth-purple) 42%, transparent) transparent;
}

html.sga-galeth-standalone *::-webkit-scrollbar {
	width: 7px;
	height: 7px;
}

html.sga-galeth-standalone *::-webkit-scrollbar-thumb {
	background: color-mix(in srgb, var(--galeth-purple) 38%, transparent);
	border-radius: var(--galeth-radius-pill);
}

@media (max-width: 640px) {
	html.sga-galeth-standalone :where(.card, .panel, .box, .modal-content, .login-card) {
		border-radius: var(--galeth-radius-sm);
	}
}