/* Design chat «Beratung» (1.25.1 design: chat + live brief, quick replies). «Ihre Angaben» shows its own note and check (theme shop.css).
   Uses the theme's tokens (tokens.css). */
.vk-consult[hidden] {
	display: none;
}

/* ---------- The chat ---------- */
.vk-talk {
	display: grid;
	gap: var(--space-4);
}

/* Head: who, what is being made, one small language button */
.vk-talk__head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-3);
}

.vk-talk__who {
	display: flex;
	align-items: center;
	gap: var(--space-3);
	min-width: 0;
}

.vk-talk__avatar {
	display: grid;
	flex: none;
	place-items: center;
	width: var(--space-10);
	height: var(--space-10);
	border-radius: var(--radius-pill);
	background: var(--color-secondary);
	color: var(--color-on-secondary);
	--icon-size: var(--icon-sm);
}

.vk-talk__avatar svg {
	width: var(--icon-size);
	height: var(--icon-size);
}

.vk-talk__avatar--sm {
	width: var(--space-8);
	height: var(--space-8);
	--icon-size: var(--icon-xs);
}

.vk-talk__name {
	display: block;
	font-size: var(--fs-md);
	font-weight: var(--fw-bold);
	line-height: var(--lh-snug);
}

.vk-talk__sub {
	display: block;
	font-size: var(--fs-xs);
	color: var(--color-text-muted);
}

/* Two language choices: the language the customer writes in (automatic by default) and the language of the print. */
.vk-talk__langs {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: var(--space-2) var(--space-5);
}

.vk-talk__print {
	display: flex;
	align-items: center;
	gap: var(--space-3);
}

.vk-talk__print label {
	font-size: var(--fs-sm);
	font-weight: var(--fw-semibold);
	color: var(--color-text-muted);
	white-space: nowrap;
}

.vk-talk__print .pr-select {
	min-width: 10.5rem;
}

.vk-talk__print .pr-select__button {
	min-height: var(--control-h-sm);
	font-size: var(--fs-sm);
}

/* Phones: label above, dropdown over the full width. */
@media (max-width: 479px) {
	.vk-talk__langs {
		flex: 1 1 100%;
		flex-direction: column;
		align-items: stretch;
	}

	.vk-talk__print {
		flex: 1 1 100%;
		flex-direction: column;
		align-items: stretch;
		gap: var(--space-1);
	}

	.vk-talk__print .pr-select {
		min-width: 0;
	}
}

/* Under the head: the AI draws the text of this print language */
.vk-talk__ai-note,
.vk-talk__note {
	margin: 0;
	padding: var(--space-2) var(--space-3);
	border-radius: var(--radius-sm);
	background: var(--color-secondary-soft);
	color: var(--color-text);
	font-size: var(--fs-xs);
	line-height: var(--lh-snug);
}

.vk-talk__ai-note[hidden] {
	display: none;
}

/* Body: chat + live brief */
.vk-talk__body {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--space-4);
	align-items: start;
}

@media (min-width: 900px) {
	.vk-talk__body {
		grid-template-columns: minmax(0, 1fr) 16.5rem;
	}
}

/* The chat card */
.vk-talk__chat {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	grid-template-rows: minmax(0, 1fr) auto;
	min-width: 0;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-card);
	background: var(--color-surface-alt);
	overflow: hidden;
}

.vk-talk__log {
	display: flex;
	flex-direction: column;
	gap: var(--space-3);
	height: 24rem;
	padding: var(--space-5) var(--space-4);
	overflow-y: auto;
	overscroll-behavior: contain;
	scroll-behavior: smooth;
}

@media (max-width: 767px) {
	.vk-talk__log {
		height: 22rem;
		padding: var(--space-4) var(--space-3);
	}
}

.vk-talk__row {
	display: flex;
	align-items: flex-end;
	gap: var(--space-2);
	animation: vk-talk-in var(--dur-base) var(--ease-out) both;
}

.vk-talk__row--me {
	justify-content: flex-end;
}

.vk-talk__msg {
	max-width: min(85%, 30rem);
	margin: 0;
	padding: var(--space-2) var(--space-3);
	font-size: var(--fs-sm);
	line-height: var(--lh-base);
	overflow-wrap: anywhere;
	white-space: pre-line;
}

.vk-talk__row--bot .vk-talk__msg {
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md) var(--radius-md) var(--radius-md) var(--radius-xs);
	background: var(--color-surface);
	color: var(--color-text);
}

.vk-talk__row--me .vk-talk__msg {
	border-radius: var(--radius-md) var(--radius-md) var(--radius-xs) var(--radius-md);
	background: var(--color-secondary);
	color: var(--color-on-secondary);
}

/* Bot rows without their own avatar keep the indent */
.vk-talk__row--bot .vk-talk__spacer {
	flex: none;
	width: var(--space-8);
}

/* Typing */
.vk-talk__dots {
	display: inline-flex;
	gap: var(--space-1);
	padding-block: var(--space-1);
}

.vk-talk__dots i {
	width: calc(var(--space-2) - 1px);
	height: calc(var(--space-2) - 1px);
	border-radius: var(--radius-pill);
	background: var(--color-text-subtle);
	animation: vk-talk-dot calc(var(--dur-reveal) + var(--dur-slow)) var(--ease-in-out) infinite;
}

.vk-talk__dots i:nth-child(2) { animation-delay: var(--dur-fast); }
.vk-talk__dots i:nth-child(3) { animation-delay: calc(var(--dur-fast) * 2); }

/* Quick replies under the newest question */
.vk-talk__chips {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2);
	padding-left: calc(var(--space-8) + var(--space-2));
	animation: vk-talk-in var(--dur-base) var(--ease-out) both;
}

.vk-talk__chip {
	min-height: var(--space-8);
	padding: 0 var(--space-3);
	border: 1px solid var(--color-secondary);
	border-radius: var(--radius-pill);
	background: var(--color-surface);
	color: var(--color-secondary);
	font: inherit;
	font-size: var(--fs-sm);
	font-weight: var(--fw-semibold);
	cursor: pointer;
	transition:
		background-color var(--dur-fast) var(--ease-out),
		color var(--dur-fast) var(--ease-out);
}

@media (hover: hover) {
	.vk-talk__chip:hover {
		background: var(--color-secondary);
		color: var(--color-on-secondary);
	}
}

.vk-talk__chip:focus-visible {
	outline: none;
	box-shadow: var(--focus-ring);
}

/* Done: a card in the chat that leads on */
.vk-talk__done {
	display: grid;
	gap: var(--space-3);
	margin-left: calc(var(--space-8) + var(--space-2));
	padding: var(--space-4);
	border: 1px solid var(--color-secondary);
	border-radius: var(--radius-md);
	background: var(--color-secondary-soft);
	animation: vk-talk-in var(--dur-base) var(--ease-out) both;
}

.vk-talk__done strong {
	display: flex;
	align-items: center;
	gap: var(--space-2);
	color: var(--color-secondary);
	--icon-size: var(--icon-xs);
}

.vk-talk__done p {
	margin: 0;
	font-size: var(--fs-sm);
	color: var(--color-text-muted);
}

.vk-talk__done .btn {
	justify-self: start;
}

.vk-talk__error {
	margin: 0 0 0 calc(var(--space-8) + var(--space-2));
	padding: var(--space-2) var(--space-3);
	border-radius: var(--radius-sm);
	background: var(--color-primary-soft);
	color: var(--color-error);
	font-size: var(--fs-sm);
	font-weight: var(--fw-semibold);
}

/* Composer: inside the chat card, white strip */
.vk-talk__composer {
	display: flex;
	align-items: flex-end;
	gap: var(--space-2);
	padding: var(--space-3);
	border-top: 1px solid var(--color-border);
	background: var(--color-surface);
}

/* «.vk-talk .vk-talk__input» (0,2,0) beats the theme's «.woocommerce form textarea» (0,1,2: 7rem high, resizable) –
   the chat sits inside the configurator form on WooCommerce pages. */
.vk-talk .vk-talk__input {
	flex: 1;
	min-width: 0;
	/* One line by default (as high as the send button), grows line by line up to four lines, then scrolls. */
	height: var(--control-h-sm);
	min-height: var(--control-h-sm);
	max-height: calc(4 * var(--lh-snug) * var(--fs-base) + 1.125rem + 2px);
	padding: 0.5625rem var(--space-3);
	border: 1px solid var(--color-border-strong);
	border-radius: var(--radius-control);
	background: var(--color-field);
	color: var(--color-text);
	font: inherit;
	font-size: var(--fs-base);
	line-height: var(--lh-snug);
	resize: none;
	overflow-y: hidden;
	box-sizing: border-box;
	transition: border-color var(--dur-fast) var(--ease-out);
}

.vk-talk .vk-talk__input:focus {
	outline: none;
	border-color: var(--color-secondary);
	box-shadow: var(--shadow-field);
}

.vk-talk__send {
	display: grid;
	flex: none;
	place-items: center;
	width: var(--control-h-sm);
	height: var(--control-h-sm);
	border: 0;
	border-radius: var(--radius-control);
	background: var(--color-secondary);
	color: var(--color-on-secondary);
	cursor: pointer;
	transition:
		background-color var(--dur-fast) var(--ease-out),
		opacity var(--dur-fast) var(--ease-out);
	--icon-size: var(--icon-sm);
}

@media (hover: hover) {
	.vk-talk__send:hover {
		background: var(--color-secondary-hover);
	}
}

.vk-talk__send:focus-visible {
	outline: none;
	box-shadow: var(--focus-ring);
}

.vk-talk__send:disabled {
	opacity: 0.4;
	cursor: default;
}

/* Under the chat: links, counter, privacy in one quiet line */
.vk-talk__foot {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-2) var(--space-4);
	font-size: var(--fs-xs);
	color: var(--color-text-muted);
}

.vk-talk__foot .link-btn {
	font-size: var(--fs-sm);
}

.vk-talk__left:empty {
	display: none;
}

/* 1.49.0: chat credit – a labelled line above the input. Full green, below 50 % orange, below 25 % red;
   it shrinks smoothly after every answer. */
.vk-talk__composer {
	flex-wrap: wrap;
}

.vk-meter {
	--vk-tone: var(--color-success);
	--vk-tone-text: var(--color-success);
	display: grid;
	flex: 1 1 100%;
	gap: var(--space-1);
}

.vk-meter[data-tone="low"] {
	--vk-tone: #E8890C;
	--vk-tone-text: #A85F00;
}

.vk-meter[data-tone="crit"] {
	--vk-tone: var(--color-error);
	--vk-tone-text: var(--color-error);
}

.vk-meter__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--space-2);
	font-size: var(--fs-xs);
	line-height: 1.2;
	color: var(--color-text-muted);
}

.vk-meter__pct {
	color: var(--vk-tone-text);
	font-weight: var(--fw-bold);
	font-variant-numeric: tabular-nums;
	transition: color 300ms var(--ease-out);
}

.vk-meter__track {
	display: block;
	height: 4px;
	border-radius: var(--radius-pill);
	background: var(--color-border);
	overflow: hidden;
}

.vk-meter__fill {
	display: block;
	width: 100%;
	height: 100%;
	border-radius: inherit;
	background: var(--vk-tone);
	transition:
		width 600ms var(--ease-out),
		background-color 300ms var(--ease-out);
}

/* Used up: a calm card with the way on, not a red error */
.vk-talk__done--end {
	border-color: var(--color-border-strong);
	background: var(--color-surface);
}

.vk-talk__done--end strong {
	color: var(--color-text);
}

/* 1.51.0: both cards (ready / used up) with the teal button, light green on hover */
.vk-talk__done .btn {
	--btn-bg: var(--color-secondary);
	--btn-fg: var(--color-on-secondary);
	--btn-bg-hover: var(--color-todo, #BADD00);
	--btn-fg-hover: var(--color-on-todo, #1D1D1B);
}

.vk-talk .vk-talk__input:disabled {
	background: var(--color-surface-alt);
	cursor: not-allowed;
}

/* The product line ends with «…» before the round size button instead of running under it. */
.vk-talk__name {
	min-width: 0;
}

@media (prefers-reduced-motion: reduce) {
	.vk-meter__fill {
		transition: none;
	}
}

.vk-talk__links {
	display: flex;
	gap: var(--space-4);
}

.vk-talk__privacy {
	display: flex;
	align-items: center;
	gap: var(--space-1);
	--icon-size: var(--icon-xs);
}

/* ---------- Live brief ---------- */
.vk-brief {
	display: grid;
	gap: var(--space-3);
	padding: var(--space-5); /* 1.51.0: 20 px inside every frame */
	border: 1px solid var(--color-border);
	border-radius: var(--radius-card);
	background: var(--color-surface);
}

.vk-brief__head {
	display: grid;
	gap: var(--space-2);
}

.vk-brief__title {
	margin: 0;
	font-size: var(--fs-sm);
	font-weight: var(--fw-bold);
}

.vk-brief__count {
	font-size: var(--fs-xs);
	color: var(--color-text-muted);
	font-variant-numeric: tabular-nums;
}

.vk-brief__bar {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: minmax(0, 1fr);
	gap: var(--space-1);
}

.vk-brief__bar span {
	height: var(--space-1);
	border-radius: var(--radius-pill);
	background: var(--color-surface-sunk);
	transition: background-color var(--dur-slow) var(--ease-out);
}

.vk-brief__bar span.is-done {
	background: var(--color-secondary);
}

.vk-brief__list {
	display: grid;
	gap: var(--space-1);
	margin: 0;
	padding: 0;
	list-style: none;
}

.vk-brief__item {
	display: grid;
	grid-template-columns: var(--space-5) minmax(0, 1fr);
	column-gap: var(--space-2);
	padding: var(--space-2);
	border-radius: var(--radius-sm);
	transition: background-color var(--dur-slow) var(--ease-out);
}

.vk-brief__item.is-new {
	background: var(--color-secondary-soft);
}

.vk-brief__mark {
	display: grid;
	place-items: center;
	width: var(--space-5);
	height: var(--space-5);
	margin-top: 1px;
	border: var(--control-border) solid var(--color-border-strong);
	border-radius: var(--radius-pill);
	color: var(--color-on-secondary);
	transition:
		background-color var(--dur-base) var(--ease-out),
		border-color var(--dur-base) var(--ease-out);
	--icon-size: var(--space-3);
	--icon-stroke: 3;
}

.vk-brief__mark .icon {
	opacity: 0;
	transform: scale(0.5);
	transition:
		opacity var(--dur-fast) var(--ease-out),
		transform var(--dur-base) var(--ease-spring);
}

.vk-brief__item.is-done .vk-brief__mark {
	border-color: var(--color-secondary);
	background: var(--color-secondary);
}

.vk-brief__item.is-done .vk-brief__mark .icon {
	opacity: 1;
	transform: none;
}

.vk-brief__label {
	font-size: var(--fs-sm);
	font-weight: var(--fw-semibold);
	line-height: var(--lh-snug);
}

.vk-brief__value {
	grid-column: 2;
	display: -webkit-box;
	overflow: hidden;
	font-size: var(--fs-xs);
	line-height: var(--lh-snug);
	color: var(--color-text-muted);
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	white-space: pre-line;
}

.vk-brief__item:not(.is-done) .vk-brief__value {
	color: var(--color-text-subtle);
}

/* 1.51.0: only what is agreed – label small, the value in full; no circles, no progress bar */
.vk-brief__item.is-done {
	grid-template-columns: minmax(0, 1fr);
	gap: 2px;
}

.vk-brief__item .vk-brief__mark {
	display: none;
}

.vk-brief__item.is-done .vk-brief__label {
	font-size: var(--fs-xs);
	font-weight: var(--fw-semibold);
	color: var(--color-text-muted);
}

.vk-brief__item.is-done .vk-brief__value {
	grid-column: 1;
	display: block;
	font-size: var(--fs-sm);
	color: var(--color-text);
	overflow-wrap: anywhere;
	-webkit-line-clamp: unset;
}

.vk-brief__item + .vk-brief__item {
	border-top: 1px solid var(--color-border);
	border-radius: 0;
}

.vk-brief__empty {
	padding: var(--space-2);
	font-size: var(--fs-sm);
	line-height: var(--lh-snug);
	color: var(--color-text-muted);
}

.vk-brief__bar[hidden],
.vk-brief__head .vk-brief__count:empty {
	display: none;
}

/* Beside the chat: never taller than the chat – the list scrolls */
@media (min-width: 900px) {
	.vk-talk:not(.is-full) .vk-brief {
		max-height: 31rem;
		overflow-y: auto;
		overscroll-behavior: contain;
	}
}

/* Phones: «Das ist vereinbart  3» – the number as a small teal badge */
.vk-brief__toggle .vk-brief__count:not(:empty) {
	display: inline-grid;
	place-items: center;
	min-width: 1.375rem;
	height: 1.375rem;
	margin-right: auto;
	padding: 0 var(--space-1);
	border-radius: var(--radius-pill);
	background: var(--color-secondary);
	color: var(--color-on-secondary);
	font-weight: var(--fw-bold);
}

.vk-brief__note {
	margin: 0;
	font-size: var(--fs-xs);
	color: var(--color-text-muted);
}

/* Phones / narrow: the brief is a bar above the chat that opens */
.vk-brief__toggle {
	display: none;
}

@media (max-width: 899px) {
	.vk-brief {
		order: -1;
		gap: 0;
		padding: 0;
	}

	.vk-brief__toggle {
		display: flex;
		align-items: center;
		gap: var(--space-3);
		width: 100%;
		padding: var(--space-3) var(--space-4);
		border: 0;
		background: none;
		color: var(--color-text);
		font: inherit;
		text-align: left;
		cursor: pointer;
		--icon-size: var(--icon-xs);
	}

	.vk-brief__toggle:focus-visible {
		outline: none;
		box-shadow: var(--focus-ring);
		border-radius: var(--radius-card);
	}

	.vk-brief__toggle .vk-brief__bar {
		flex: 1;
	}

	.vk-brief__toggle .icon {
		transition: transform var(--dur-base) var(--ease-out);
	}

	.vk-brief__toggle[aria-expanded="true"] .icon {
		transform: rotate(180deg);
	}

	.vk-brief__head {
		display: none;
	}

	.vk-brief__panel {
		display: grid;
		grid-template-rows: 0fr;
		transition: grid-template-rows var(--dur-base) var(--ease-out);
	}

	.vk-brief__panel > div {
		display: grid;
		gap: var(--space-2);
		min-height: 0;
		overflow: hidden;
		padding: 0 var(--space-3);
	}

	.vk-brief.is-open .vk-brief__panel {
		grid-template-rows: 1fr;
	}

	.vk-brief.is-open .vk-brief__panel > div {
		padding-bottom: var(--space-3);
	}
}

@media (max-width: 479px) {
	.vk-talk__chips {
		margin-left: 0;
		padding-left: 0;
	}

	/* The red box keeps its inner space – only the indent next to the avatar goes. */
	.vk-talk__done,
	.vk-talk__error {
		margin-left: 0;
	}
}

@keyframes vk-talk-in {
	from {
		opacity: 0;
		transform: translateY(var(--space-2));
	}
}

@keyframes vk-talk-dot {
	0%, 60%, 100% { transform: none; opacity: 0.5; }
	30% { transform: translateY(calc(var(--space-1) * -1)); opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
	.vk-talk__row,
	.vk-talk__chips,
	.vk-talk__done,
	.vk-talk__dots i {
		animation: none;
	}

	.vk-talk__log {
		scroll-behavior: auto;
	}
}

/* Spelling and postcode suggestions (1.47.0): one compact card under the reply, the changed word marked in the line,
   two equal buttons per line and «Alle übernehmen». */
.vk-fix {
	display: grid;
	gap: var(--space-2);
	max-width: 34rem;
	padding: var(--space-3);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md) var(--radius-md) var(--radius-md) var(--radius-xs);
	background: var(--color-surface);
}

.vk-fix__head {
	display: flex;
	align-items: center;
	gap: var(--space-2);
	font-size: var(--fs-sm);
	font-weight: var(--fw-bold);
}

.vk-fix__head .vk-fix__ic {
	display: grid;
	place-items: center;
	width: var(--space-6);
	height: var(--space-6);
	border-radius: var(--radius-pill);
	background: var(--color-secondary-soft);
	color: var(--color-secondary);
}

.vk-fix__ic svg {
	width: 0.875rem;
	height: 0.875rem;
}

.vk-fix__list {
	display: grid;
	gap: var(--space-2);
	margin: 0;
	padding: 0;
	list-style: none;
}

/* 1.51.0: no box in the card – the lines are divided by a hairline */
.vk-fix__row {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	align-items: center;
	gap: var(--space-2) var(--space-3);
}

.vk-fix__row + .vk-fix__row {
	padding-top: var(--space-3);
	border-top: 1px solid var(--color-border);
}

.vk-fix__label {
	display: block;
	font-size: var(--fs-xs);
	color: var(--color-text-muted);
}

.vk-fix__text {
	font-size: var(--fs-sm);
	line-height: var(--lh-snug);
	overflow-wrap: anywhere;
}

/* Inline difference: the old word struck through, the new one marked light green */
.vk-fix__old {
	color: var(--color-text-muted);
	text-decoration: line-through;
	text-decoration-color: var(--color-primary);
}

.vk-fix__new {
	padding: 0 0.15em;
	border-radius: var(--radius-xs);
	background: rgb(186 221 0 / 0.45);
	color: var(--color-text);
	font-weight: var(--fw-semibold);
	transition: background-color var(--dur-base) var(--ease-out);
}

/* Two equal buttons per line, «Alle übernehmen» below */
.vk-fix__btns {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--space-2);
}

.vk-fix__btns button,
.vk-fix__all {
	min-height: 2.25rem;
	padding: 0 var(--space-3);
	border: 1px solid var(--color-secondary);
	border-radius: var(--radius-sm);
	background: var(--color-surface);
	color: var(--color-secondary);
	font: inherit;
	font-size: var(--fs-xs);
	font-weight: var(--fw-semibold);
	cursor: pointer;
	transition: background-color 300ms var(--ease-out), color 300ms var(--ease-out), border-color 300ms var(--ease-out);
}

.vk-fix__btns button.is-main,
.vk-fix__all {
	background: var(--color-secondary);
	color: var(--color-on-secondary);
}

@media (hover: hover) {
	.vk-fix__btns button:hover:not(:disabled),
	.vk-fix__all:hover:not(:disabled) {
		border-color: var(--c-lime-400, #BADD00);
		background: var(--c-lime-400, #BADD00);
		color: var(--c-key-900, #1D1D1B);
	}
}

.vk-fix__btns button:disabled,
.vk-fix__all:disabled {
	opacity: 0.55;
	cursor: default;
}

.vk-fix__btns button:focus-visible,
.vk-fix__all:focus-visible {
	outline: none;
	box-shadow: var(--focus-ring);
}

.vk-talk__row--fix {
	align-items: flex-start;
}

.vk-talk__row--fix .vk-fix {
	flex: 1 1 auto;
	min-width: 0;
}

/* Postcode/town: the reason as a quiet amber line with a small «!» */
.vk-fix__warn {
	display: flex;
	align-items: flex-start;
	gap: var(--space-2);
	margin: 0;
	font-size: var(--fs-xs);
	line-height: var(--lh-snug);
	color: #8A5A00;
}

.vk-fix__warn-ic {
	display: grid;
	flex: none;
	place-items: center;
	width: 1rem;
	height: 1rem;
	border-radius: var(--radius-pill);
	background: #E8890C;
	color: #fff;
	font-size: 0.6875rem;
	font-weight: var(--fw-bold);
	line-height: 1;
}

.vk-fix__btns--many {
	grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
}

.vk-fix__done {
	font-size: var(--fs-xs);
	font-weight: var(--fw-semibold);
	color: var(--color-secondary);
}



.vk-fix__old + .vk-fix__new {
	margin-left: 0.3em;
}

/* 1.27.12: product-switch guidance only when an actual published URL exists. */
.vk-talk__product-switch:not([hidden]) {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  padding: 11px 14px;
  margin: 8px 0;
  border: 1px solid #b6cdd1;
  border-radius: 12px;
  background: #f0f7f7;
  color: #254246;
  font-size: 13px;
  line-height: 1.4;
}
.vk-talk__product-switch .vk-talk__switch-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: #075b62;
  color: #fff;
  text-decoration: none;
  padding: 8px 12px;
  font-weight: 650;
  white-space: nowrap;
}
.vk-talk__product-switch .vk-talk__switch-link:focus-visible { background: #064a50; color: #fff; }
@media (hover: hover) {
	.vk-talk__product-switch .vk-talk__switch-link:hover { background: #064a50; color: #fff; }
}

/* ---------- 1.46.0: style pictures in the chat ---------- */
.vk-talk__styles {
	display: grid;
	gap: var(--space-2);
	padding-left: calc(var(--space-8) + var(--space-2));
	animation: vk-talk-in var(--dur-base) var(--ease-out) both;
}

/* 1.52.6: small pictures everywhere – name and «Wählen» lie on the lower part of the picture (dark gradient).
   With a mouse they come up on hover; on touch screens they are always there. About five fit the chat on a
   computer, about four on a phone. */
.vk-gal {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: clamp(5rem, calc((100% - 3 * var(--space-2)) / 3.6), 7rem);
	gap: var(--space-2);
	margin: 0 calc(var(--space-4) * -1) 0 0;
	padding: var(--space-1) var(--space-4) var(--space-2) 0;
	overflow-x: auto;
	overflow-y: hidden;
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	touch-action: pan-x pan-y;
}

.vk-gal::-webkit-scrollbar {
	display: none;
}

/* 1.52.15: landscape pictures – about as big as the upright ones (wider, lower), so fewer fit in view */
.vk-gal--quer {
	grid-auto-columns: clamp(9rem, calc((100% - 2 * var(--space-2)) / 2.2), 11rem);
}

.vk-talk__msg--style.is-quer img {
	width: 2.75rem;
	height: 1.875rem;
}

.vk-gal__item {
	position: relative;
	display: block;
	overflow: hidden;
	border-radius: var(--radius-md);
	background: var(--color-surface);
	box-shadow: 0 0 0 1px var(--color-border-strong);
	scroll-snap-align: center;
	transition: box-shadow var(--dur-base) var(--ease-out);
}

.vk-gal__item:first-child { scroll-snap-align: start; }
.vk-gal__item:last-child { scroll-snap-align: end; }

.vk-gal__item.is-picked {
	box-shadow: 0 0 0 2px var(--color-secondary), 0 0 0 5px var(--color-secondary-soft);
}

.vk-gal__pic {
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: var(--vk-gal-ar, 1000 / 1414);
	padding: 0;
	overflow: hidden;
	border: 0;
	background: var(--color-surface-sunk);
	cursor: zoom-in;
}

.vk-gal__pic img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform var(--dur-slow) var(--ease-out);
}

@media (hover: hover) {
	.vk-gal__pic:hover img {
		transform: scale(1.04);
	}
}

.vk-gal__zoom {
	position: absolute;
	top: var(--space-1);
	right: var(--space-1);
	display: grid;
	place-items: center;
	width: var(--space-6);
	height: var(--space-6);
	border-radius: var(--radius-pill);
	background: rgb(255 255 255 / 0.92);
	color: var(--color-text);
	box-shadow: var(--shadow-sm);
	transition: opacity var(--dur-base) var(--ease-out);
}

.vk-gal__zoom svg,
.vk-gal__check svg {
	width: 0.875rem;
	height: 0.875rem;
}

.vk-gal__check {
	position: absolute;
	top: var(--space-1);
	left: var(--space-1);
	z-index: 1;
	display: grid;
	place-items: center;
	width: var(--space-5);
	height: var(--space-5);
	border-radius: var(--radius-pill);
	background: var(--color-secondary);
	color: var(--color-on-secondary);
	opacity: 0;
	transform: scale(0.6);
	transition: opacity var(--dur-base) var(--ease-out), transform var(--dur-base) var(--ease-spring);
}

.vk-gal__item.is-picked .vk-gal__check {
	opacity: 1;
	transform: none;
}

.vk-gal__info {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	display: grid;
	gap: var(--space-1);
	padding: var(--space-6) var(--space-1) var(--space-1);
	background: linear-gradient(to top, rgb(10 20 20 / 0.92) 0%, rgb(10 20 20 / 0.72) 55%, rgb(10 20 20 / 0) 100%);
	color: #fff;
	pointer-events: none; /* a tap on the picture opens the big view; only the button takes its own tap */
	transition:
		opacity 300ms var(--ease-out),
		transform 300ms var(--ease-out);
}

.vk-gal__name {
	font-size: var(--fs-xs);
	font-weight: var(--fw-bold);
	line-height: var(--lh-snug);
	color: #fff;
}

/* The small pictures have no room for the description: it stays in the big view. */
.vk-gal__short {
	display: none;
}

.vk-gal__pick {
	min-height: var(--control-h-sm);
	padding: 0 var(--space-3);
	border: 1px solid var(--color-secondary);
	border-radius: var(--radius-sm);
	background: var(--color-surface);
	color: var(--color-secondary);
	font: inherit;
	font-size: var(--fs-sm);
	font-weight: var(--fw-semibold);
	cursor: pointer;
	transition: background-color 300ms var(--ease-out), color 300ms var(--ease-out), border-color 300ms var(--ease-out);
}

@media (hover: hover) {
	.vk-gal__pick:hover:not(:disabled) {
		border-color: var(--c-lime-400, #BADD00);
		background: var(--c-lime-400, #BADD00);
		color: var(--c-key-900, #1D1D1B);
	}
}

.vk-gal__pick:disabled {
	opacity: 0.6;
	cursor: default;
}

/* The small button on the picture (the big view keeps its own, see .vk-lightbox__pick). */
.vk-gal__info .vk-gal__pick {
	min-height: 1.75rem;
	padding: 0 var(--space-1);
	border-color: var(--color-secondary);
	background: var(--color-secondary);
	color: var(--color-on-secondary);
	font-size: var(--fs-xs);
	pointer-events: auto;
}

@media (hover: hover) {
	.vk-gal__info .vk-gal__pick:hover:not(:disabled) {
		border-color: var(--c-lime-400, #BADD00);
		background: var(--c-lime-400, #BADD00);
		color: var(--c-key-900, #1D1D1B);
	}
}

/* 1.52.21: the last tile – «KI entscheidet», same size as the pictures */
.vk-gal__auto {
	display: grid;
	place-content: center;
	justify-items: center;
	gap: var(--space-1);
	padding: var(--space-2);
	background: var(--color-secondary-soft, #E6F1F1);
	color: var(--color-secondary);
	text-align: center;
	cursor: pointer;
	transition: background-color 300ms var(--ease-out);
}

.vk-gal__auto-ic svg {
	width: 1.5rem;
	height: 1.5rem;
}

.vk-gal__auto-name {
	font-size: var(--fs-xs);
	font-weight: var(--fw-bold);
	line-height: var(--lh-snug);
}

.vk-gal__auto-short {
	font-size: 0.6875rem;
	line-height: var(--lh-snug);
	color: var(--color-text-muted);
}

@media (hover: hover) and (pointer: fine) {
	.vk-gal__auto:hover {
		background: var(--c-lime-400, #BADD00);
		color: var(--c-key-900, #1D1D1B);
	}
}

.vk-talk__msg-auto {
	display: grid;
	flex: none;
	place-items: center;
	width: 1.75rem;
	height: 1.75rem;
	border-radius: var(--radius-pill);
	background: rgb(255 255 255 / 0.18);
}

.vk-talk__msg-auto svg {
	width: 1rem;
	height: 1rem;
}

.vk-gal-wrap {
	position: relative;
	min-width: 0;
}

.vk-gal__nav {
	display: none;
}

@media (hover: hover) and (pointer: fine) {
	.vk-gal {
		grid-auto-columns: clamp(5rem, calc((100% - 4 * var(--space-2)) / 5), 8.5rem);
	}

	.vk-gal--quer {
		grid-auto-columns: clamp(8rem, calc((100% - 3 * var(--space-2)) / 3.4), 12rem);
	}

	.vk-gal__zoom {
		opacity: 0;
	}

	.vk-gal__info {
		opacity: 0;
		transform: translateY(var(--space-2));
	}

	.vk-gal__info .vk-gal__pick {
		pointer-events: none;
	}

	.vk-gal__item:is(:hover, :focus-within) .vk-gal__info {
		opacity: 1;
		transform: none;
	}

	.vk-gal__item:is(:hover, :focus-within) .vk-gal__info .vk-gal__pick {
		pointer-events: auto;
	}

	.vk-gal__item:is(:hover, :focus-within) .vk-gal__zoom {
		opacity: 1;
	}

	/* Round arrows over the row, shown while the mouse is over it */
	.vk-gal__nav {
		position: absolute;
		top: calc(50% - var(--space-1));
		z-index: 2;
		display: grid;
		place-items: center;
		width: var(--space-8);
		height: var(--space-8);
		padding: 0;
		border: 1px solid var(--color-border-strong);
		border-radius: var(--radius-pill);
		background: var(--color-surface);
		color: var(--color-secondary);
		box-shadow: var(--shadow-md);
		cursor: pointer;
		opacity: 0;
		transform: translateY(-50%) scale(0.9);
		transition:
			opacity 300ms var(--ease-out),
			transform 300ms var(--ease-out),
			background-color 300ms var(--ease-out),
			border-color 300ms var(--ease-out),
			color 300ms var(--ease-out);
	}

	.vk-gal-wrap:is(:hover, :focus-within) .vk-gal__nav {
		opacity: 1;
		transform: translateY(-50%);
	}

	.vk-gal__nav:hover {
		border-color: var(--c-lime-400, #BADD00);
		background: var(--c-lime-400, #BADD00);
		color: var(--c-key-900, #1D1D1B);
	}

	.vk-gal__nav:focus-visible {
		outline: none;
		box-shadow: var(--focus-ring);
	}

	.vk-gal__nav[hidden] {
		display: none;
	}

	.vk-gal__nav--prev {
		left: calc(var(--space-2) * -1);
	}

	.vk-gal__nav--next {
		right: var(--space-2);
	}

	.vk-gal__nav svg {
		width: 1rem;
		height: 1rem;
	}
}

.vk-gal__hint {
	margin: 0;
	font-size: var(--fs-xs);
	color: var(--color-text-muted);
}

/* The picked style in the customer's own message */
.vk-talk__msg--style {
	display: flex;
	align-items: center;
	gap: var(--space-2);
}

.vk-talk__msg--style img {
	width: 1.75rem;
	height: 2.5rem;
	border-radius: var(--radius-xs);
	object-fit: cover;
}

/* Big view: the whole picture fits the screen */
.vk-lightbox {
	position: fixed;
	inset: 0;
	z-index: calc(var(--z-drawer) + 10);
	display: grid;
	grid-template-rows: auto minmax(0, 1fr) auto;
	gap: var(--space-3);
	padding: var(--space-4);
	background: rgb(10 30 32 / 0.88);
	opacity: 0;
	visibility: hidden;
	transition: opacity var(--dur-base) var(--ease-out), visibility 0s linear var(--dur-base);
}

.vk-lightbox.is-open {
	opacity: 1;
	visibility: visible;
	transition: opacity var(--dur-base) var(--ease-out), visibility 0s;
}

.vk-lightbox__top {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
	grid-template-areas: "name sides close";
	align-items: center;
	gap: var(--space-3);
	color: var(--color-on-dark);
}

.vk-lightbox__name {
	grid-area: name;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.vk-lightbox__sides {
	grid-area: sides;
}

.vk-lightbox__close {
	grid-area: close;
	justify-self: end;
}

/* Phones: name and close on the first line, the side switch centred below */
@media (max-width: 640px) {
	.vk-lightbox__top {
		grid-template-columns: minmax(0, 1fr) auto;
		grid-template-areas: "name close" "sides sides";
	}
}

.vk-lightbox__name {
	font-size: var(--fs-md);
}

/* Vorderseite | Rückseite (two-sided only), sliding thumb */
.vk-lightbox__sides {
	position: relative;
	display: inline-grid;
	grid-auto-flow: column;
	grid-auto-columns: 1fr;
	margin: 0 auto;
	padding: var(--space-1);
	border-radius: var(--radius-pill);
	background: var(--color-on-dark-surface);
}

.vk-lightbox__sides[hidden] {
	display: none;
}

.vk-lightbox__sides button {
	position: relative;
	z-index: 1;
	min-height: var(--space-8);
	padding: 0 var(--space-4);
	border: 0;
	border-radius: var(--radius-pill);
	background: none;
	color: var(--color-on-dark);
	font: inherit;
	font-size: var(--fs-sm);
	font-weight: var(--fw-semibold);
	cursor: pointer;
	transition: color var(--dur-base) var(--ease-out);
}

.vk-lightbox__sides button[aria-selected="true"] {
	color: var(--color-text);
}

.vk-lightbox__thumb {
	position: absolute;
	top: var(--space-1);
	bottom: var(--space-1);
	left: 0;
	border-radius: var(--radius-pill);
	background: var(--color-surface);
}

.vk-lightbox__thumb.is-live {
	transition: transform var(--dur-base) var(--ease-out), width var(--dur-base) var(--ease-out);
}

html.vk-lb-lock {
	overflow: hidden;
}

.vk-lightbox__close {
	display: grid;
	place-items: center;
	width: var(--control-h-sm);
	height: var(--control-h-sm);
	border: 1px solid var(--color-on-dark-line);
	border-radius: var(--radius-pill);
	background: none;
	color: var(--color-on-dark);
	cursor: pointer;
}

.vk-lightbox__img {
	display: grid;
	place-items: center;
	min-height: 0;
}

.vk-lightbox__img img {
	max-width: 100%;
	/* the whole picture on the screen: minus top bar, button bar, gaps and padding */
	max-height: calc(100dvh - 2 * var(--space-4) - 2 * var(--space-3) - var(--control-h-sm) - var(--control-h));
	border-radius: var(--radius-sm);
	box-shadow: var(--shadow-lg);
	transform: scale(0.96);
	transition: transform var(--dur-slow) var(--ease-out);
}

.vk-lightbox.is-open .vk-lightbox__img img {
	transform: none;
}

.vk-lightbox__bar {
	display: flex;
	justify-content: center;
	gap: var(--space-3);
}

.vk-lightbox__pick {
	min-width: 12rem;
	min-height: var(--control-h);
	border-color: var(--color-secondary);
	background: var(--color-secondary);
	color: var(--color-on-secondary);
}

.vk-lightbox__nav {
	display: grid;
	place-items: center;
	width: var(--control-h);
	height: var(--control-h);
	border: 1px solid var(--color-on-dark-line);
	border-radius: var(--radius-pill);
	background: none;
	color: var(--color-on-dark);
	cursor: pointer;
}

.vk-lightbox__nav svg,
.vk-lightbox__close svg {
	width: var(--icon-sm);
	height: var(--icon-sm);
}

@media (max-width: 767px) {
	.vk-gal {
		margin-right: calc(var(--space-3) * -1);
		padding-right: var(--space-3);
	}

	.vk-talk__styles {
		padding-left: 0;
	}
}

/* 1.47.2: phones and tablets – in the chat step there is no design yet, so no preview above or over the chat. */
@media (max-width: 1199px) {
	.wizard--card[data-step="beratung"] .vk-stage {
		display: none;
	}
}

/* ---------- 1.48.0: phones – the chat in full screen; 1.50.0: big view on desktop ---------- */
.vk-talk__size {
	display: grid;
	flex: none;
	place-items: center;
	width: var(--control-h-sm);
	height: var(--control-h-sm);
	margin-left: auto;
	padding: 0;
	border: 1px solid var(--color-border-strong);
	border-radius: var(--radius-pill);
	background: var(--color-surface);
	color: var(--color-secondary);
	cursor: pointer;
	transition: border-color var(--dur-base) var(--ease-out), background-color var(--dur-base) var(--ease-out);
	--icon-size: var(--icon-sm);
}

@media (hover: hover) {
	.vk-talk__size:hover {
		border-color: var(--color-secondary);
	}
}

.vk-talk__size:focus-visible {
	outline: none;
	box-shadow: var(--focus-ring);
}

.vk-talk__size[hidden] {
	display: none;
}

.vk-talk__size svg {
	width: var(--icon-size);
	height: var(--icon-size);
}

/* Phones: name and the size button on one line */
@media (max-width: 767px) {
	.vk-talk__who {
		flex: 1 1 0;
	}
}

html.vk-talk-lock,
html.vk-talk-lock body {
	overflow: hidden;
}

/* Phones: the whole screen */
@media (max-width: 767px) {
	.vk-talk.is-full {
		position: fixed;
		top: var(--vk-vt, 0px);
		right: 0;
		left: 0;
		z-index: calc(var(--z-drawer) + 5);
		display: flex;
		flex-direction: column;
		gap: 0;
		height: var(--vk-vh, 100dvh);
		background: var(--color-surface);
		animation: vk-talk-full var(--dur-base) var(--ease-out);
	}

	@keyframes vk-talk-full {
		from {
			opacity: 0;
			transform: translateY(var(--space-4));
		}
	}

	/* Head: who + the small button on one line, the two languages below in one row */
	.vk-talk.is-full .vk-talk__head {
		flex: none;
		flex-wrap: wrap;
		gap: var(--space-2) var(--space-3);
		padding: var(--space-3) var(--space-4);
		border-bottom: 1px solid var(--color-border);
		background: var(--color-surface);
	}

	.vk-talk.is-full .vk-talk__who {
		flex: 1 1 0;
	}

	.vk-talk.is-full .vk-talk__avatar {
		width: var(--space-8);
		height: var(--space-8);
	}

	.vk-talk.is-full .vk-talk__sub {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.vk-talk.is-full .vk-talk__langs {
		display: grid;
		flex: 1 1 100%;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--space-2);
	}

	.vk-talk.is-full .vk-talk__print {
		gap: 2px;
	}

	.vk-talk.is-full .vk-talk__print label {
		font-size: var(--fs-xs);
	}

	.vk-talk.is-full .vk-talk__print .pr-select__button,
	.vk-talk.is-full .vk-talk__print select {
		min-height: 2.25rem;
	}

	.vk-talk.is-full > .vk-talk__ai-note,
	.vk-talk.is-full > .vk-talk__product-switch {
		flex: none;
		margin: var(--space-2) var(--space-4) 0;
	}

	.vk-talk.is-full .vk-talk__body {
		display: flex;
		flex: 1 1 auto;
		flex-direction: column;
		gap: 0;
		min-height: 0;
	}

	/* The live brief (business cards) as one slim line on top, it opens on tap */
	.vk-talk.is-full .vk-brief {
		flex: none;
		align-self: stretch; /* 1.52.14: the bar over the whole width (it was only as wide as its text) */
		order: -1;
		border-width: 0 0 1px;
		border-radius: 0;
	}

	.vk-talk.is-full .vk-talk__chat {
		display: flex;
		flex: 1 1 auto;
		flex-direction: column;
		min-height: 0;
		border: 0;
		border-radius: 0;
	}

	.vk-talk.is-full .vk-talk__log {
		flex: 1 1 auto;
		height: auto;
		min-height: 0;
	}

	.vk-talk.is-full .vk-talk__composer {
		flex: none;
		padding-bottom: calc(var(--space-3) + env(safe-area-inset-bottom));
	}

	/* 1.52.14: full screen is the conversation only – no head (name, product line, languages: they are there when the
	   chat is small); the button to make it small floats in the chat, top right. */
	/* 1.52.19: Safari's own bars (address pill, keyboard helper) float right above the keyboard, and the page shone
	   through them («– alles aus einer Hand.»). Safari draws nothing fixed there, so the page itself is hidden while the
	   chat is in full screen – only the chat (and its big picture view) stays visible, on the chat's colour.
	   (1.52.17 shadow and 1.52.18 cover were fixed layers, which Safari cuts off above its bars.) */
	html.vk-talk-lock,
	html.vk-talk-lock body {
		background: var(--color-surface);
	}

	html.vk-talk-lock body {
		visibility: hidden;
	}

	html.vk-talk-lock .vk-talk.is-full,
	html.vk-talk-lock .vk-lightbox.is-open {
		visibility: visible;
	}

	.vk-talk.is-full .vk-talk__head,
	.vk-talk.is-full .vk-brief {
		display: none; /* only the conversation and the input – «Das ist vereinbart» shows when the chat is small */
	}

	.vk-talk.is-full .vk-talk__chat {
		position: relative;
	}

	.vk-talk__size--float {
		position: absolute;
		top: var(--space-2);
		right: var(--space-3);
		z-index: 3;
		margin: 0;
		background: rgb(255 255 255 / 0.92);
		box-shadow: var(--shadow-md);
		-webkit-backdrop-filter: blur(6px);
		backdrop-filter: blur(6px);
	}

	/* The first message must not sit under the floating button */
	.vk-talk.is-full .vk-talk__log {
		padding-top: calc(var(--space-2) + var(--control-h-sm));
	}

	/* 1.49.0: full screen is only the conversation and the input – «Ohne Chat weiter» and «Neu beginnen» come back when the chat is small. */
	.vk-talk.is-full .vk-talk__foot {
		display: none;
	}
}

/* 1.50.0: tablets and desktop – the same button opens the chat big over the page (never by default).
   Page dimmed behind it; Esc, the button or a click beside it makes it small again. */
@keyframes vk-talk-pop {
	from {
		opacity: 0;
		transform: scale(0.98);
	}
}

@media (min-width: 768px) {
	/* Small chat: the button sits at the end of the name line, the languages stay on their own line as before. */
	.vk-talk__who {
		flex: 1 1 0;
	}

	.vk-talk:not(.is-full) .vk-talk__langs {
		flex: 1 1 100%;
		justify-content: flex-start;
	}

	/* Big: name, languages and button in one line */
	.vk-talk.is-full .vk-talk__head {
		flex-wrap: nowrap;
	}

	.vk-talk.is-full .vk-talk__size {
		order: 3;
		margin-left: 0;
	}

	.vk-talk.is-full {
		position: fixed;
		inset: 0;
		z-index: calc(var(--z-drawer) + 5);
		display: flex;
		flex-direction: column;
		gap: var(--space-4);
		width: min(75rem, calc(100vw - 4rem));
		height: min(60rem, calc(100dvh - 4rem));
		margin: auto;
		padding: var(--space-5) var(--space-6) var(--space-6);
		border-radius: var(--radius-lg);
		background: var(--color-surface);
		box-shadow: 0 0 0 100vmax rgb(14 43 44 / 0.55), var(--shadow-lg);
		animation: vk-talk-pop var(--dur-base) var(--ease-out);
	}

	.vk-talk.is-full .vk-talk__head,
	.vk-talk.is-full > .vk-talk__ai-note,
	.vk-talk.is-full > .vk-talk__product-switch {
		flex: none;
	}

	.vk-talk.is-full .vk-talk__body {
		display: flex;
		flex: 1 1 auto;
		gap: var(--space-4);
		align-items: stretch;
		min-height: 0;
	}

	.vk-talk.is-full .vk-talk__chat {
		flex: 1 1 auto;
		min-width: 0;
		min-height: 0;
	}

	.vk-talk.is-full .vk-talk__log {
		height: auto;
		min-height: 0;
	}

	.vk-talk.is-full .vk-brief {
		flex: 0 0 16.5rem;
		align-self: start;
		max-height: 100%;
		overflow-y: auto;
	}

	/* Big: only the conversation and the input, as on phones */
	.vk-talk.is-full .vk-talk__foot {
		display: none;
	}
}

@media (prefers-reduced-motion: reduce) {
	.vk-talk.is-full {
		animation: none;
	}
}

/* 1.51.0: phones – the opened «Das ist vereinbart» list takes at most half the screen, the chat stays visible */
@media (max-width: 899px) {
	.vk-brief.is-open .vk-brief__panel > div {
		max-height: 45dvh;
		overflow-y: auto;
		overscroll-behavior: contain;
	}
}