:root {
    --brand-primary: #C8102E;
    --brand-secondary: #620715;
}

.bg-brand-primary
{
    background-color: var(--brand-primary) !important;
}

.bg-brand-secondary {
	background-color: var(--brand-secondary) !important;
}

.hover\:bg-brand-secondary-opacity:hover {
	background-color: var(--brand-secondary) !important;
	opacity: 0.9 !important;
}

.text-brand-primary,
.hover\:text-brand-primary:hover {
	color: var(--brand-primary) !important;
}

.text-brand-secondary,
.hover\:text-brand-secondary:hover {
	color: var(--brand-secondary) !important;
}

.btn-primary {
	background-color: var(--brand-primary) !important;
	border-color: var(--brand-primary) !important;
	color: #ffffff !important;
	transition: background-color 140ms ease, border-color 140ms ease;
}

.btn-primary:hover:not(:disabled) {
	background-color: color-mix(in srgb, black 10%, var(--brand-primary)) !important;
	border-color: color-mix(in srgb, black 10%, var(--brand-primary)) !important;
}

.btn-secondary {
	background-color: var(--brand-secondary) !important;
	border-color: var(--brand-secondary) !important;
	transition: background-color 140ms ease, border-color 140ms ease;
}

.btn-secondary:hover:not(:disabled) {
	background-color: color-mix(in srgb, black 10%, var(--brand-secondary)) !important;
	border-color: color-mix(in srgb, black 10%, var(--brand-secondary)) !important;
}

@supports not (color: color-mix(in srgb, black 10%, white)) {
	.btn-primary:hover:not(:disabled),
	.btn-secondary:hover:not(:disabled) {
		filter: brightness(0.9);
	}
}
