:root {
	--acf-accent: #173b4d;
}

.acf-field .acf-label label {
	font-size: 1rem;
}

.acf-flexible-content .layout .acf-fc-layout-order {
	color: #333;
	background-color: #fbfbfc;
}

.acf-flexible-content .layout .acf-fc-layout-actions-wrap,
.acf-flexible-content .layout.active-layout > .acf-fc-layout-actions-wrap,
body:not(.block-editor-page) .acf-flexible-content .layout.active-layout > .acf-fc-layout-actions-wrap {
	color: var(--acf-accent);
	background: rgb(from var(--acf-accent) r g b / 10%);
}

/* Match ACFE's flexible-content selector so this project style wins without !important. */
.acf-field-flexible-content:not([data-acfe-flexible-placeholder='1'], [data-acfe-legacy]) > .acf-input > .acf-flexible-content > .values > .layout > .acf-fc-layout-actions-wrap {
	color: var(--acf-accent);
	background: rgb(from var(--acf-accent) r g b / 10%);
}

.acf-repeater .acf-row-handle.order {
	background-color: var(--acf-accent);
	color: #fff;
}

.acfe-image-selector > ul > li > label > .image.svg {
	background-color: var(--acf-accent);
}

.acfe-image-selector > ul > li > label.selected > .image {
	border-color: var(--acf-accent);
}

.layout .acf-field {
	background-color: #eaeaea;
}

/* Tabs links (acf-tab-group) und Felder darunter. Breite/Padding bleiben bei ACF (20 %), dafuer braeuchte es !important. */
.acf-fields.-sidebar::before {
	background-color: transparent;
}

.acf-fields.-sidebar > .acf-tab-wrap.-left .acf-tab-group li {
	margin: .5rem;
}

.acf-fields.-sidebar > .acf-tab-wrap.-left .acf-tab-group li a {
	border: 0;
	border-radius: .25rem;
	background: rgb(from var(--acf-accent) r g b / 10%);
	color: var(--acf-accent);
	padding: .625rem 1rem;
}

.acf-fields.-sidebar > .acf-tab-wrap.-left .acf-tab-group li a:hover {
	background: rgb(from var(--acf-accent) r g b / 10%);
	color: var(--acf-accent);
}

.acf-fields.-sidebar > .acf-tab-wrap.-left .acf-tab-group li.active a {
	background: rgb(from var(--acf-accent) r g b / 20%);
	color: var(--acf-accent);
	font-weight: 600;
}

.acf-fields.-sidebar > .acf-field:not(.acf-field-tab) {
	margin: .5rem;
	border-radius: .25rem;
}

.acf-fields.-sidebar > .acf-field:not(.acf-field-tab):not(.acf-hidden) {
	background: rgb(from var(--acf-accent) r g b / 20%);
}

.acf-fields.-sidebar > .acf-field:not(.acf-field-tab):not(.acf-hidden) .acf-label {
	color: var(--acf-accent);
}