.z52-site-notice--custom {
	border-color: var(--z52-notice-border);
	background: var(--z52-notice-background-image);
	color: var(--z52-notice-text);
	backdrop-filter: blur(var(--z52-notice-backdrop-blur));
	-webkit-backdrop-filter: blur(var(--z52-notice-backdrop-blur));
}

.z52-site-notice--custom::before {
	background: var(--z52-notice-accent);
}

.z52-site-notice--custom .z52-site-notice__close {
	border-color: var(--z52-notice-border);
	background: color-mix(in srgb, var(--z52-notice-text) 7%, transparent);
	color: var(--z52-notice-text);
}

.z52-site-notice--custom .z52-site-notice__close:hover,
.z52-site-notice--custom .z52-site-notice__close:focus-visible {
	border-color: var(--z52-notice-accent);
	color: var(--z52-notice-accent);
}

.z52-site-notice--custom .z52-site-notice__icon {
	border-color: color-mix(in srgb, var(--z52-notice-accent) 42%, transparent);
	background: color-mix(in srgb, var(--z52-notice-accent) 15%, transparent);
	color: var(--z52-notice-accent);
}

.z52-site-notice--custom .z52-site-notice__badge {
	color: var(--z52-notice-accent);
}

.z52-site-notice--custom .z52-site-notice__text {
	color: var(--z52-notice-muted);
}

.z52-site-notice--custom .z52-site-notice__action--filled {
	background: var(--z52-notice-button);
	box-shadow: 0 12px 28px color-mix(in srgb, var(--z52-notice-button) 28%, transparent);
	color: var(--z52-notice-button-text);
}

.z52-site-notice--custom .z52-site-notice__action--filled:hover,
.z52-site-notice--custom .z52-site-notice__action--filled:focus-visible {
	background: color-mix(in srgb, var(--z52-notice-button) 84%, #000000);
	color: var(--z52-notice-button-text);
}

.z52-site-notice--custom .z52-site-notice__action--outline,
.z52-site-notice--custom .z52-site-notice__action--text {
	color: var(--z52-notice-text);
}

.z52-site-notice--custom .z52-site-notice__action--outline:hover,
.z52-site-notice--custom .z52-site-notice__action--outline:focus-visible,
.z52-site-notice--custom .z52-site-notice__action--text:hover,
.z52-site-notice--custom .z52-site-notice__action--text:focus-visible {
	border-color: var(--z52-notice-accent);
	background: color-mix(in srgb, var(--z52-notice-accent) 12%, transparent);
	color: var(--z52-notice-text);
}
