:root {
	--hummel-error-bg: #fff6f6;
	--hummel-error-border: #f2caca;
	--hummel-error-accent: #c93434;
	--hummel-error-text: #3a2929;
	--hummel-error-icon-bg: #fce5e5;

	--hummel-success-bg: #f3faf6;
	--hummel-success-border: #cbe7d5;
	--hummel-success-accent: #27824f;
	--hummel-success-text: #25382c;
	--hummel-success-icon-bg: #e1f3e7;

	--hummel-warning-bg: #fff9ed;
	--hummel-warning-border: #eedaa9;
	--hummel-warning-accent: #a66a12;
	--hummel-warning-text: #493a22;
	--hummel-warning-icon-bg: #f9edcf;

	--hummel-info-bg: #f4f7fa;
	--hummel-info-border: #d7e0e8;
	--hummel-info-accent: #48677f;
	--hummel-info-text: #293640;
	--hummel-info-icon-bg: #e5edf3;
}

.woocommerce-notices-wrapper {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 0 0 16px;
	max-width: 100%;
}

.woocommerce-notices-wrapper:empty {
	display: none;
	margin: 0;
}

body.woocommerce .woocommerce-notices-wrapper > ul,
.woocommerce .woocommerce-notices-wrapper > ul,
ul.woocommerce-error,
ul.hummel-notice-list {
	display: flex;
	flex-direction: column;
	gap: 10px;
	list-style: none;
	margin: 0 0 16px !important;
	padding: 0 !important;
	background: transparent !important;
	border: none !important;
	border-top: none !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	overflow: visible;
}

ul.woocommerce-error::before,
ul.hummel-notice-list::before,
.woocommerce-error::before,
.woocommerce-info::before,
.woocommerce-message::before {
	display: none !important;
	content: none !important;
}

html body .hummel-notice,
html body .woocommerce-message,
html body .woocommerce-info,
html body ul.woocommerce-error > li,
html body .ha-notice:not([hidden]),
html body .hg-notice:not([hidden]),
html body .wc-block-components-notice-banner:not(.cart-empty) {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	min-height: 58px;
	margin: 0 0 16px;
	padding: 16px 18px !important;
	border: 1px solid var(--hummel-info-border) !important;
	border-top: 1px solid var(--hummel-info-border) !important;
	border-radius: 10px !important;
	background: var(--hummel-info-bg) !important;
	box-shadow: none !important;
	color: var(--hummel-info-text) !important;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.5;
	text-shadow: none;
	overflow-wrap: anywhere;
	animation: hummel-notice-in 160ms ease-out;
}

html body .woocommerce-notices-wrapper .hummel-notice,
html body .woocommerce-notices-wrapper .woocommerce-message,
html body .woocommerce-notices-wrapper .woocommerce-info,
html body .woocommerce-notices-wrapper ul.woocommerce-error,
html body ul.woocommerce-error > li {
	margin-bottom: 0;
}

html body .hummel-notice--error,
html body .woocommerce-error:not(ul),
html body ul.woocommerce-error > li,
html body .woocommerce-message.error,
html body .ha-notice:not([hidden]),
html body .hg-notice:not([hidden]):not(.hg-notice--ok),
html body .wc-block-components-notice-banner.is-error {
	background: var(--hummel-error-bg) !important;
	border-color: var(--hummel-error-border) !important;
	color: var(--hummel-error-text) !important;
}

html body .hummel-notice--success,
html body .woocommerce-message,
html body .hg-notice--ok:not([hidden]),
html body .wc-block-components-notice-banner.is-success {
	background: var(--hummel-success-bg) !important;
	border-color: var(--hummel-success-border) !important;
	color: var(--hummel-success-text) !important;
}

html body .hummel-notice--error,
html body .woocommerce-message.error,
html body ul.woocommerce-error > li,
html body .ha-notice:not([hidden]),
html body .hg-notice:not([hidden]):not(.hg-notice--ok) {
	background: var(--hummel-error-bg) !important;
	border-color: var(--hummel-error-border) !important;
	color: var(--hummel-error-text) !important;
}

html body .hummel-notice--warning,
html body .woocommerce-warning,
html body .wc-block-components-notice-banner.is-warning {
	background: var(--hummel-warning-bg) !important;
	border-color: var(--hummel-warning-border) !important;
	color: var(--hummel-warning-text) !important;
}

html body .hummel-notice--info,
html body .woocommerce-info,
html body .wc-block-components-notice-banner.is-info {
	background: var(--hummel-info-bg) !important;
	border-color: var(--hummel-info-border) !important;
	color: var(--hummel-info-text) !important;
}

html body .hummel-notice.hummel-notice--error {
	background: var(--hummel-error-bg) !important;
	border-color: var(--hummel-error-border) !important;
	color: var(--hummel-error-text) !important;
}

html body .hummel-notice.hummel-notice--success {
	background: var(--hummel-success-bg) !important;
	border-color: var(--hummel-success-border) !important;
	color: var(--hummel-success-text) !important;
}

html body .hummel-notice.hummel-notice--warning {
	background: var(--hummel-warning-bg) !important;
	border-color: var(--hummel-warning-border) !important;
	color: var(--hummel-warning-text) !important;
}

html body .hummel-notice.hummel-notice--info {
	background: var(--hummel-info-bg) !important;
	border-color: var(--hummel-info-border) !important;
	color: var(--hummel-info-text) !important;
}

.hummel-notice__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 34px;
	height: 34px;
	min-width: 34px;
	margin-top: 1px;
	border-radius: 50%;
	background: var(--hummel-info-icon-bg);
	color: var(--hummel-info-accent);
}

.hummel-notice--error .hummel-notice__icon,
ul.woocommerce-error > li .hummel-notice__icon,
.ha-notice .hummel-notice__icon,
.hg-notice:not(.hg-notice--ok) .hummel-notice__icon,
.wc-block-components-notice-banner.is-error .hummel-notice__icon {
	background: var(--hummel-error-icon-bg);
	color: var(--hummel-error-accent);
}

.hummel-notice--success .hummel-notice__icon,
.woocommerce-message .hummel-notice__icon,
.hg-notice--ok .hummel-notice__icon,
.wc-block-components-notice-banner.is-success .hummel-notice__icon {
	background: var(--hummel-success-icon-bg);
	color: var(--hummel-success-accent);
}

.hummel-notice--warning .hummel-notice__icon,
.woocommerce-warning .hummel-notice__icon,
.wc-block-components-notice-banner.is-warning .hummel-notice__icon {
	background: var(--hummel-warning-icon-bg);
	color: var(--hummel-warning-accent);
}

.hummel-notice--info .hummel-notice__icon,
.woocommerce-info .hummel-notice__icon,
.wc-block-components-notice-banner.is-info .hummel-notice__icon {
	background: var(--hummel-info-icon-bg);
	color: var(--hummel-info-accent);
}

html body .hummel-notice.hummel-notice--error .hummel-notice__icon {
	background: var(--hummel-error-icon-bg);
	color: var(--hummel-error-accent);
}

html body .hummel-notice.hummel-notice--success .hummel-notice__icon {
	background: var(--hummel-success-icon-bg);
	color: var(--hummel-success-accent);
}

html body .hummel-notice.hummel-notice--warning .hummel-notice__icon {
	background: var(--hummel-warning-icon-bg);
	color: var(--hummel-warning-accent);
}

html body .hummel-notice.hummel-notice--info .hummel-notice__icon {
	background: var(--hummel-info-icon-bg);
	color: var(--hummel-info-accent);
}

.hummel-notice__icon {
	--hummel-notice-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.2'/%3E%3Cpath d='M12 11.2V16'/%3E%3Ccircle cx='12' cy='8.4' r='1' fill='black' stroke='none'/%3E%3C/svg%3E");
}

.hummel-notice__icon::after {
	content: "";
	display: block;
	width: 18px;
	height: 18px;
	background-color: currentColor;
	-webkit-mask-image: var(--hummel-notice-icon);
	mask-image: var(--hummel-notice-icon);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
}

html body .hummel-notice--error .hummel-notice__icon,
html body ul.woocommerce-error > li .hummel-notice__icon,
html body .ha-notice .hummel-notice__icon,
html body .hg-notice:not(.hg-notice--ok) .hummel-notice__icon,
html body .wc-block-components-notice-banner.is-error .hummel-notice__icon {
	--hummel-notice-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.2'/%3E%3Cpath d='M12 8v5'/%3E%3Ccircle cx='12' cy='16.1' r='1' fill='black' stroke='none'/%3E%3C/svg%3E");
}

html body .hummel-notice--success .hummel-notice__icon,
html body .woocommerce-message .hummel-notice__icon,
html body .hg-notice--ok .hummel-notice__icon,
html body .wc-block-components-notice-banner.is-success .hummel-notice__icon {
	--hummel-notice-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.2'/%3E%3Cpath d='m8.4 12.2 2.4 2.4 4.8-5'/%3E%3C/svg%3E");
}

html body .hummel-notice--warning .hummel-notice__icon,
html body .woocommerce-warning .hummel-notice__icon,
html body .wc-block-components-notice-banner.is-warning .hummel-notice__icon {
	--hummel-notice-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4.6 20.2 19H3.8L12 4.6z'/%3E%3Cpath d='M12 10v4.2'/%3E%3Ccircle cx='12' cy='16.7' r='.8' fill='black' stroke='none'/%3E%3C/svg%3E");
}

html body .hummel-notice--info .hummel-notice__icon,
html body .woocommerce-info .hummel-notice__icon,
html body .wc-block-components-notice-banner.is-info .hummel-notice__icon {
	--hummel-notice-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.2'/%3E%3Cpath d='M12 11.2V16'/%3E%3Ccircle cx='12' cy='8.4' r='1' fill='black' stroke='none'/%3E%3C/svg%3E");
}

.hummel-notice__text {
	flex: 1;
	min-width: 0;
	padding-top: 6px;
	color: inherit;
}

html body .hummel-notice a,
html body .woocommerce-error a,
html body .woocommerce-message a,
html body .woocommerce-info a,
html body .ha-notice a,
html body .hg-notice a {
	color: inherit !important;
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 2px;
}

html body .hummel-notice .button,
html body .woocommerce-message .button,
html body .woocommerce-info .button,
html body .woocommerce-error .button {
	float: none !important;
	display: inline-block;
	margin: 8px 8px 0 0 !important;
}

.woocommerce-info.cart-empty,
.cart-empty.woocommerce-info {
	display: block;
	min-height: 0;
	margin: 0;
	padding: 0 !important;
	border: none !important;
	background: transparent !important;
	color: inherit !important;
	animation: none;
}

.woocommerce-info.cart-empty::before,
.cart-empty.woocommerce-info::before {
	display: none !important;
}

html body.woocommerce form .form-row.woocommerce-invalid input.input-text,
html body.woocommerce form .form-row.woocommerce-invalid select,
html body.woocommerce form .form-row.woocommerce-invalid textarea,
html body.woocommerce form .form-row.woocommerce-invalid .select2-selection,
html body.woocommerce form .form-row.woocommerce-invalid .select2-container--default .select2-selection--single,
html body.hummel-account-login #customer_login.ha-acc .form-row.woocommerce-invalid input.input-text,
html body.hummel-account-login #customer_login.ha-acc .form-row.woocommerce-invalid input.woocommerce-Input {
	border-color: #ddaaaa !important;
	background-color: #fff !important;
	box-shadow: none !important;
}

.woocommerce form .form-row .woocommerce-error,
.woocommerce form .form-row ul.woocommerce-error,
.ha-acc-field .woocommerce-error,
.form-row .em-error,
.form-row .error:not(.woocommerce-error) {
	display: block;
	width: 100%;
	min-height: 0;
	margin: 6px 0 0;
	padding: 0 !important;
	border: none !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	color: #b72c2c !important;
	font-size: 13px;
	font-weight: 400;
	line-height: 1.4;
	animation: none;
}

.woocommerce form .form-row .woocommerce-error::before,
.woocommerce form .form-row ul.woocommerce-error::before,
.woocommerce form .form-row .woocommerce-error .hummel-notice__icon {
	display: none !important;
}

.ha-notice[hidden],
.hg-notice[hidden] {
	display: none !important;
}

body.woocommerce.woocommerce-checkout .woocommerce-error,
body.woocommerce.woocommerce-checkout .woocommerce-message,
body.woocommerce.woocommerce-checkout .woocommerce-info,
body.woocommerce.woocommerce-checkout .hummel-notice,
body.hummel-checkout-address .ha-notice:not([hidden]) {
	max-width: 100%;
}

@keyframes hummel-notice-in {
	from {
		opacity: 0;
		transform: translateY(-3px);
	}

	to {
		opacity: 1;
		transform: none;
	}
}

@media screen and (max-width: 767px) {
	html body .hummel-notice,
	html body .woocommerce-message,
	html body .woocommerce-info,
	html body ul.woocommerce-error > li,
	html body .ha-notice:not([hidden]),
	html body .hg-notice:not([hidden]),
	html body .wc-block-components-notice-banner:not(.cart-empty) {
		min-height: 0;
		padding: 14px 15px !important;
		border-radius: 8px !important;
		font-size: 14px;
	}

	.hummel-notice__text {
		padding-top: 5px;
	}
}
