input {
	font-size: 1rem;
	border: 1px solid var(--smx-color-text);
	padding: var(--space-sm) var(--space-md);
	border-radius: var(--border-radius-md);
}
input:focus {
	outline: none;
	border: 1px solid var(--smx-color-primary);
	background: rgba(var(--smx-color-primary-tint-rgb), 0.2);
}

label {
	display: block;
	font-size: var(--font-size-sm);
	color: var(--smx-color-text-bold);
	font-weight: 600;
}
.has-text-color.has-primary-contrast-color {
	color: var(--smx-color-primary-contrast);
}
.has-text-color {
	&.has-primary-color {
		color: var(--smx-color-primary) !important;
	}

	&.has-primary-tint-color {
		color: var(--smx-color-primary-tint) !important;
	}

	&.has-primary-contrast-color {
		color: var(--smx-color-primary-contrast) !important;
	}

	&.has-primary-contrast-tint-color {
		color: var(--smx-color-primary-contrast-tint) !important;
	}

	/* Secondary */
	&.has-secondary-color {
		color: var(--smx-color-secondary) !important;
	}

	&.has-secondary-tint-color {
		color: var(--smx-color-secondary-tint) !important;
	}

	&.has-secondary-contrast-color {
		color: var(--smx-color-secondary-contrast) !important;
	}

	&.has-secondary-shade-color {
		color: var(--smx-color-secondary-shade) !important;
	}

	/* Tertiary */
	&.has-tertiary-color {
		color: var(--smx-color-tertiary) !important;
	}

	&.has-tertiary-tint-color {
		color: var(--smx-color-tertiary-tint) !important;
	}

	&.has-tertiary-contrast-color {
		color: var(--smx-color-tertiary-contrast) !important;
	}

	&.has-tertiary-shade-color {
		color: var(--smx-color-tertiary-shade) !important;
	}

	/* Semantic */
	&.has-success-color {
		color: var(--smx-color-success) !important;
	}

	&.has-danger-color {
		color: var(--smx-color-danger) !important;
	}

	&.has-alert-color {
		color: var(--smx-color-alert) !important;
	}

	/* Background */
	&.has-background-light-color {
		color: var(--smx-color-background-light) !important;
	}

	&.has-background-dark-color {
		color: var(--smx-color-background-dark) !important;
	}

	/* Text */
	&.has-text-default-color {
		color: var(--smx-color-text) !important;
	}

	&.has-text-bold-color {
		color: var(--smx-color-text-bold) !important;
		b,
		strong {
			color: var(--smx-color-primary) !important;
		}
	}

	/* Base */
	&.has-white-color {
		color: var(--smx-color-white) !important;
	}

	&.has-black-color {
		color: var(--smx-color-black) !important;
	}
}

.is-layout-constrained,
.container {
	margin: 0 auto;
	padding-left: var(--space-xs);
	padding-right: var(--space-xs);
	max-width: 1200px;
}

section {
	min-height: 300px;
}

.is-layout-constrained {
	@media (max-width: 767px), (min-width: 1024px) {
		padding-left: var(--space-md);
		padding-right: var(--space-md);
	}
	@media (min-width: 768px) and (max-width: 1023px) and (orientation: portrait) {
		padding-left: var(--space-md);
		padding-right: var(--space-md);
	}
}