:root {
	--annbeauty-consent-font-size: 13px;
	--annbeauty-consent-line-height: 1.45;
	--annbeauty-consent-row-gap: 12px;
	--annbeauty-consent-control-gap: 8px;
	--annbeauty-consent-error-size: 12px;
	--annbeauty-consent-error: #f27362;
	--annbeauty-consent-required-border: rgba(242, 115, 98, 0.58);
	--annbeauty-field-border: #e1e1e1;
}

/* Theme-wide invalid fields keep the neutral frame and mark only the bottom edge. */
.form-row.woocommerce-invalid input:not([type="checkbox"]):not([type="radio"]),
.form-row.woocommerce-invalid select,
.form-row.woocommerce-invalid textarea,
.form-row-grid.woocommerce-invalid input:not([type="checkbox"]):not([type="radio"]),
.form-row-grid.woocommerce-invalid select,
.form-row-grid.woocommerce-invalid textarea,
.woocommerce input[aria-invalid="true"]:not([type="checkbox"]):not([type="radio"]),
.woocommerce select[aria-invalid="true"],
.woocommerce textarea[aria-invalid="true"],
.woocommerce-invalid .select2-selection {
	border-color: var(--annbeauty-field-border) !important;
	border-bottom-color: var(--annbeauty-consent-error) !important;
	box-shadow: none !important;
}

.woocommerce .checkout-inline-error-message,
.woocommerce .woocommerce-error-field,
.woocommerce .form-row .field-validation-error {
	color: var(--annbeauty-consent-error) !important;
	font-size: var(--annbeauty-consent-error-size) !important;
	line-height: 1.35 !important;
}

/* One switch geometry for every checkbox rendered on the storefront. */
input[type="checkbox"] {
	-webkit-appearance: none !important;
	appearance: none !important;
	background-color: transparent !important;
	background-image: none !important;
	border: 1px solid #e1e1e1 !important;
	border-radius: 999px !important;
	box-shadow: inset 0 1px 2px rgba(40, 40, 40, 0.08) !important;
	box-sizing: border-box;
	cursor: pointer;
	display: inline-block;
	height: 22px !important;
	margin: 0 8px 0 0;
	min-width: 40px !important;
	overflow: visible;
	padding: 0 !important;
	position: relative;
	transition: background-color 0.2s ease, border-color 0.2s ease;
	vertical-align: middle;
	width: 40px !important;
}

input[type="checkbox"]::before {
	background-color: #282828;
	border-radius: 50%;
	box-shadow: 0 3px 6px rgba(40, 40, 40, 0.35), 0 1px 2px rgba(40, 40, 40, 0.28), inset 0 1px 1px rgba(255, 255, 255, 0.22);
	content: "";
	display: block;
	height: 16px;
	left: 2px;
	position: absolute;
	top: 2px;
	transform: translateX(0);
	transition: transform 0.2s ease, background-color 0.2s ease;
	width: 16px;
}

input[type="checkbox"]:checked {
	background-color: #282828 !important;
	background-image: none !important;
	border-color: #282828 !important;
}

input[type="checkbox"]:checked::before {
	background-color: #fff;
	box-shadow: 0 3px 6px rgba(0, 0, 0, 0.32), 0 1px 2px rgba(0, 0, 0, 0.24);
	transform: translateX(18px);
}

input[type="checkbox"]:focus-visible {
	outline: 2px solid rgba(40, 40, 40, 0.35);
	outline-offset: 2px;
}

input[type="checkbox"]:disabled {
	cursor: not-allowed;
	opacity: 0.55;
}

.woocommerce-form__label-for-checkbox {
	align-items: flex-start;
	display: flex !important;
}

.woocommerce-form__label-for-checkbox input[type="checkbox"] {
	flex: 0 0 40px;
	margin: 1px 8px 0 0 !important;
}

.woocommerce-form__label-for-checkbox > .annbeauty-checkbox-copy,
.woocommerce-form__label-for-checkbox > .woocommerce-terms-and-conditions-checkbox-text,
.woocommerce-form__label-for-checkbox > .custom-checkbox__label {
	flex: 1 1 auto;
	min-width: 0;
}

.annbeauty-consent-group {
	display: grid;
	gap: var(--annbeauty-consent-row-gap);
}

.annbeauty-consent {
	box-sizing: border-box;
	font-size: var(--annbeauty-consent-font-size) !important;
	line-height: var(--annbeauty-consent-line-height) !important;
	margin: 0 0 var(--annbeauty-consent-row-gap) !important;
	padding: 0 !important;
	text-align: left !important;
	width: 100%;
}

.annbeauty-consent-group > .annbeauty-consent {
	margin-bottom: 0 !important;
}

.annbeauty-consent__label {
	align-items: flex-start;
	display: flex !important;
	font-size: inherit !important;
	line-height: inherit !important;
	margin: 0 !important;
	text-align: left !important;
}

.annbeauty-consent__label input[type="checkbox"] {
	flex: 0 0 40px;
	margin: 1px var(--annbeauty-consent-control-gap) 0 0 !important;
	transform: none !important;
}

.annbeauty-consent__copy {
	flex: 1 1 auto;
	font-size: inherit !important;
	line-height: inherit !important;
	min-width: 0;
	overflow: visible !important;
	text-align: left !important;
	text-overflow: clip !important;
	white-space: normal !important;
}

.annbeauty-consent__copy a,
.annbeauty-consent__copy a:hover,
.annbeauty-consent__copy a:focus,
.annbeauty-consent__copy a:active {
	text-decoration: none !important;
	text-underline-offset: 2px;
}

.annbeauty-consent__label .required {
	display: none !important;
}

.annbeauty-consent[data-annbeauty-consent-required] input[type="checkbox"]:not(:checked),
.annbeauty-consent[data-annbeauty-consent-required="true"] input[type="checkbox"]:not(:checked) {
	border-color: var(--annbeauty-consent-required-border) !important;
}

.annbeauty-consent.is-invalid input[type="checkbox"] {
	border-color: var(--annbeauty-consent-error) !important;
	box-shadow: 0 0 0 1px rgba(242, 115, 98, 0.14), inset 0 1px 2px rgba(40, 40, 40, 0.08) !important;
}

.annbeauty-consent__error {
	color: var(--annbeauty-consent-error);
	display: block;
	font-size: var(--annbeauty-consent-error-size);
	line-height: 1.35;
	margin: 0 0 0 48px;
	max-height: 0;
	opacity: 0;
	overflow: hidden;
	transform: translateY(-3px);
	transition: max-height 0.24s ease, margin-top 0.24s ease, opacity 0.18s ease, transform 0.24s ease, visibility 0s linear 0.24s;
	visibility: hidden;
}

.annbeauty-consent__error.is-visible {
	margin-top: 4px;
	max-height: 8em;
	opacity: 1;
	transform: translateY(0);
	transition-delay: 0s;
	visibility: visible;
}

[data-annbeauty-consent-submit][disabled] {
	cursor: not-allowed;
	opacity: 0.55;
	pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
	input[type="checkbox"],
	input[type="checkbox"]::before,
	.annbeauty-consent__error {
		transition: none;
	}
}
