// This CSS is usually generated by Global Styles.
// However when a colors is not defined, the CSS for that color isn't output.
// This means that when users switch between themes colors set in one theme won't be carried over to another.
// By including all this CSS in every theme we ensure that these colors work across themes.
// The difference between this and the Global Styles CSS is that we reference the custom variables not the preset ones.
// This means that undefined colors are mapped to defined ones.

.has-primary-background-color {
	background-color: var(--wp--custom--color--primary) !important
}
.has-secondary-background-color {
	background-color: var(--wp--custom--color--secondary) !important
}
.has-foreground-background-color {
	background-color: var(--wp--custom--color--foreground) !important
}
.has-background-background-color {
	background-color: var(--wp--custom--color--background) !important
}
.has-tertiary-background-color {
	background-color: var(--wp--custom--color--tertiary) !important
}

.has-primary-color {
	color: var(--wp--custom--color--primary) !important;
}
.has-secondary-color {
	color: var(--wp--custom--color--secondary) !important;
}
.has-foreground-color {
	color: var(--wp--custom--color--foreground) !important;
}
.has-background-color {
	color: var(--wp--custom--color--background) !important;
}
.has-tertiary-color {
	color: var(--wp--custom--color--tertiary) !important;
}