.primary { background-color: var(--md-sys-color-primary); }
.primary-text { color: var(--md-sys-color-primary); }
.on-primary { background-color: var(--md-sys-color-on-primary); }
.on-primary-text { color: var(--md-sys-color-on-primary); }
.primary-container { background-color: var(--md-sys-color-primary-container); }
.primary-container-text { color: var(--md-sys-color-primary-container); }
.on-primary-container { background-color: var(--md-sys-color-on-primary-container); }
.on-primary-container-text { color: var(--md-sys-color-on-primary-container); }

.secondary { background-color: var(--md-sys-color-secondary); }
.secondary-text { color: var(--md-sys-color-secondary); }
.on-secondary { background-color: var(--md-sys-color-on-secondary); }
.on-secondary-text { color: var(--md-sys-color-on-secondary); }
.secondary-container { background-color: var(--md-sys-color-secondary-container); }
.secondary-container-text { color: var(--md-sys-color-secondary-container); }
.on-secondary-container { background-color: var(--md-sys-color-on-secondary-container); }
.on-secondary-container-text { color: var(--md-sys-color-on-secondary-container); }

.tertiary { background-color: var(--md-sys-color-tertiary); }
.tertiary-text { color: var(--md-sys-color-tertiary); }
.on-tertiary { background-color: var(--md-sys-color-on-tertiary); }
.on-tertiary-text { color: var(--md-sys-color-on-tertiary); }
.tertiary-container { background-color: var(--md-sys-color-tertiary-container); }
.tertiary-container-text { color: var(--md-sys-color-tertiary-container); }
.on-tertiary-container { background-color: var(--md-sys-color-on-tertiary-container); }
.on-tertiary-container-text { color: var(--md-sys-color-on-tertiary-container); }

.error { background-color: var(--md-sys-color-error); }
.error-text { color: var(--md-sys-color-error); }
.on-error { background-color: var(--md-sys-color-on-error); }
.on-error-text { color: var(--md-sys-color-on-error); }
.error-container { background-color: var(--md-sys-color-error-container); }
.error-container-text { color: var(--md-sys-color-error-container); }
.on-error-container { background-color: var(--md-sys-color-on-error-container); }
.on-error-container-text { color: var(--md-sys-color-on-error-container); }

.background { background-color: var(--md-sys-color-background); }
.background-text { color: var(--md-sys-color-background); }
.on-background { background-color: var(--md-sys-color-on-background); }
.on-background-text { color: var(--md-sys-color-on-background); }

.surface { background-color: var(--md-sys-color-surface); }
.surface-text { color: var(--md-sys-color-surface); }
.on-surface { background-color: var(--md-sys-color-on-surface); }
.on-surface-text { color: var(--md-sys-color-on-surface); }

.surface-variant { background-color: var(--md-sys-color-surface-variant); }
.surface-variant-text { color: var(--md-sys-color-surface-variant); }
.on-surface-variant { background-color: var(--md-sys-color-on-surface-variant); }
.on-surface-variant-text { color: var(--md-sys-color-on-surface-variant); }

.outline { background-color: var(--md-sys-color-outline); }
.outline-text { color: var(--md-sys-color-outline); }

.inverse-on-surface { background-color: var(--md-sys-color-inverse-on-surface); }
.inverse-on-surface-text { color: var(--md-sys-color-inverse-on-surface); }

.inverse-surface { background-color: var(--md-sys-color-inverse-surface); }
.inverse-surface-text { color: var(--md-sys-color-inverse-surface); }

.inverse-primary { background-color: var(--md-sys-color-inverse-primary); }
.inverse-primary-text { color: var(--md-sys-color-inverse-primary); }

.shadow { background-color: var(--md-sys-color-shadow); }
.shadow-text { color: var(--md-sys-color-shadow); }

.surface-tint { background-color: var(--md-sys-color-surface-tint); }
.surface-tint-text { color: var(--md-sys-color-surface-tint); }

.outline-variant { background-color: var(--md-sys-color-outline-variant); }
.outline-variant-text { color: var(--md-sys-color-outline-variant); }

.scrim { background-color: var(--md-sys-color-scrim); }
.scrim-text { color: var(--md-sys-color-scrim); }
