.sdash-wirtschaft {
	margin-block: var(--wp--preset--spacing--lg);
}

.sdash-wirtschaft p {
	margin: 0;
}

.sdash-wirtschaft__form {
	display: grid;
	gap: var(--wp--preset--spacing--sm);
	grid-template-columns: 1fr;
	margin-bottom: var(--wp--preset--spacing--lg);
}

@media (min-width: 600px) {
	.sdash-wirtschaft__form {
		grid-template-columns: 1fr 1fr;
	}
}

.sdash-wirtschaft__field label {
	display: block;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	margin-bottom: var(--wp--preset--spacing--xs);
}

.sdash-wirtschaft__input {
	align-items: center;
	background: var(--wp--preset--color--background);
	border: 1px solid var(--wp--preset--color--neutral);
	border-radius: var(--wp--custom--radius--md);
	display: flex;
	padding-right: var(--wp--preset--spacing--sm);
}

.sdash-wirtschaft__input:focus-within {
	border-color: var(--wp--preset--color--secondary);
	outline: 2px solid var(--wp--preset--color--secondary);
	outline-offset: 1px;
}

.sdash-wirtschaft__input input {
	background: transparent;
	border: 0;
	color: inherit;
	flex: 1;
	font: inherit;
	min-height: 44px;
	min-width: 0;
	outline: none;
	padding: 0 var(--wp--preset--spacing--sm);
}

.sdash-wirtschaft__input span {
	color: var(--wp--preset--color--neutral);
	font-size: var(--wp--preset--font-size--small);
}

.sdash-wirtschaft__kpis {
	display: grid;
	gap: var(--wp--preset--spacing--md);
	grid-template-columns: 1fr 1fr;
	margin-bottom: var(--wp--preset--spacing--md);
}

.sdash-wirtschaft__label {
	color: var(--wp--preset--color--neutral);
	font-size: var(--wp--preset--font-size--small);
}

.sdash-wirtschaft .sdash-wirtschaft__value {
	font-family: var(--wp--preset--font-family--headline);
	font-size: var(--wp--preset--font-size--large);
	font-weight: 700;
	line-height: 1.2;
	margin-block: var(--wp--preset--spacing--xs);
}

.sdash-wirtschaft .sdash-wirtschaft__value--large {
	font-size: var(--wp--preset--font-size--x-large);
	margin-block: 0;
}

.sdash-wirtschaft__value.is-positive {
	color: var(--wp--preset--color--secondary);
}

.sdash-wirtschaft__value.is-negative {
	color: var(--wp--preset--color--primary);
}

.sdash-wirtschaft__sub,
.sdash-wirtschaft__setup,
.sdash-wirtschaft__note {
	color: var(--wp--preset--color--neutral);
	font-size: var(--wp--preset--font-size--small);
}

.sdash-wirtschaft__card {
	background: var(--wp--preset--color--background);
	border: 1px solid var(--wp--preset--color--neutral);
	border-radius: var(--wp--custom--radius--md);
	padding: var(--wp--preset--spacing--md);
}

.sdash-wirtschaft .sdash-wirtschaft__label--card {
	color: var(--wp--preset--color--primary);
	font-size: var(--wp--preset--font-size--base);
	margin-bottom: var(--wp--preset--spacing--sm);
}

.sdash-wirtschaft__payback {
	align-items: flex-end;
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--xs) var(--wp--preset--spacing--md);
	justify-content: space-between;
	margin-bottom: var(--wp--preset--spacing--sm);
}

.sdash-wirtschaft__bar {
	background: color-mix(in srgb, var(--wp--preset--color--neutral) 25%, transparent);
	border-radius: var(--wp--custom--radius--sm);
	height: 8px;
	margin-bottom: var(--wp--preset--spacing--sm);
	overflow: hidden;
}

.sdash-wirtschaft__bar span {
	background: var(--wp--preset--color--secondary);
	display: block;
	height: 100%;
	transform: scaleX(0);
	transform-origin: left;
	width: 100%;
}

@media (prefers-reduced-motion: no-preference) {
	.sdash-wirtschaft__bar span {
		transition: transform 0.2s ease;
	}
}

.sdash-wirtschaft--editor {
	border: 1px dashed var(--wp--preset--color--neutral);
	padding: var(--wp--preset--spacing--sm);
}