/*!
 * BSG Multistep Formulare – Frontend styles
 * Tokens come from inline CSS (settings): --bsgmf-primary, --bsgmf-primary-hover,
 * --bsgmf-title, --bsgmf-text, --bsgmf-border, --bsgmf-bg, --bsgmf-radius, --bsgmf-max, --bsgmf-title-case
 */

.bsgmf {
	--bsgmf-primary: #009681;
	--bsgmf-primary-hover: #016D5D;
	--bsgmf-title: #0A1411;
	--bsgmf-text: #3A3A3A;
	--bsgmf-border: #DCE3E0;
	--bsgmf-bg: #FFFFFF;
	--bsgmf-radius: 16px;
	--bsgmf-max: 780px;
	--bsgmf-title-case: uppercase;

	--bsgmf-muted: #6B7571;
	--bsgmf-soft: #F5F8F7;
	--bsgmf-tint: #EEF7F5;
	--bsgmf-error: #B42318;
	--bsgmf-ring: rgba(0, 150, 129, .22);
	--bsgmf-font: 'BSGMF Inter Tight', 'Inter Tight', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
	--bsgmf-fs: clamp(16px, 15.5px + .15vw, 17px);
	--bsgmf-fs-title: clamp(20px, 17px + 1vw, 28px);
	--bsgmf-ease: cubic-bezier(.2, .7, .2, 1);

	position: relative;
	width: 100%;
	max-width: var(--bsgmf-max);
	margin-inline: auto;
	font-family: var(--bsgmf-font);
	font-size: var(--bsgmf-fs);
	font-weight: 300;
	line-height: 1.55;
	color: var(--bsgmf-text);
	text-align: left;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-tap-highlight-color: transparent;
}
@supports (color: color-mix(in srgb, red 50%, white)) {
	.bsgmf {
		--bsgmf-tint: color-mix(in srgb, var(--bsgmf-primary) 7%, #fff);
		--bsgmf-ring: color-mix(in srgb, var(--bsgmf-primary) 24%, transparent);
	}
}

.bsgmf *,
.bsgmf *::before,
.bsgmf *::after { box-sizing: border-box; }

.bsgmf button,
.bsgmf input,
.bsgmf textarea {
	font-family: inherit;
	letter-spacing: normal;
	text-transform: none;
	margin: 0;
	box-shadow: none;
}
.bsgmf button { -webkit-appearance: none; appearance: none; cursor: pointer; background: none; border: 0; color: inherit; }
.bsgmf svg { display: block; flex: none; }
.bsgmf [hidden] { display: none !important; }
.bsgmf p { margin: 0; }
.bsgmf a { color: var(--bsgmf-primary); text-underline-offset: 2px; }
.bsgmf a:hover { color: var(--bsgmf-primary-hover); }

/* ---------- Container ---------- */

.bsgmf--card {
	background: var(--bsgmf-bg);
	border-radius: calc(var(--bsgmf-radius) + 8px);
	box-shadow: 0 28px 80px -28px rgba(10, 20, 17, .22), 0 2px 8px rgba(10, 20, 17, .04);
	padding: clamp(20px, 4.5vw, 48px);
}
.bsgmf--plain { background: transparent; padding: 0; }

.bsgmf__draft {
	margin-bottom: 16px !important;
	padding: 10px 14px;
	border-radius: 10px;
	background: #FFF6E5;
	color: #7A4B00;
	font-weight: 500;
}
.bsgmf__noscript { padding: 20px; }
.bsgmf__hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }

/* Boot skeleton */
.bsgmf__boot { display: flex; gap: 8px; justify-content: center; align-items: center; min-height: 360px; }
.bsgmf__boot span { width: 10px; height: 10px; border-radius: 50%; background: var(--bsgmf-primary); opacity: .25; animation: bsgmf-pulse 1s infinite ease-in-out; }
.bsgmf__boot span:nth-child(2) { animation-delay: .15s; }
.bsgmf__boot span:nth-child(3) { animation-delay: .3s; }
@keyframes bsgmf-pulse { 50% { opacity: 1; transform: scale(1.2); } }

/* ---------- Head / progress ---------- */

.bsgmf__meta {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	margin-bottom: 12px;
}
.bsgmf__count { font-weight: 600; color: var(--bsgmf-title); font-size: 16px; }
.bsgmf__duration { display: inline-flex; align-items: center; gap: 6px; color: var(--bsgmf-muted); font-size: 16px; }
.bsgmf__duration .bsgmf-ui { width: 18px; height: 18px; }
.bsgmf__bar { height: 6px; border-radius: 999px; background: #E7EDEB; overflow: hidden; }
.bsgmf__bar-fill { display: block; height: 100%; width: 0; border-radius: inherit; background: var(--bsgmf-primary); transition: width .45s var(--bsgmf-ease); }

.bsgmf__intro { margin-top: 28px; }
.bsgmf__intro-title { font-weight: 600; color: var(--bsgmf-title); font-size: 18px; margin-bottom: 4px !important; }

/* ---------- Step ---------- */

.bsgmf__stage { min-height: 200px; }
.bsgmf-step { padding-top: clamp(24px, 3.5vw, 36px); }
.bsgmf-step.is-enter-fwd, .bsgmf-final.is-enter-fwd { animation: bsgmf-in-fwd .32s var(--bsgmf-ease); }
.bsgmf-step.is-enter-back { animation: bsgmf-in-back .32s var(--bsgmf-ease); }
@keyframes bsgmf-in-fwd { from { opacity: 0; transform: translateX(18px); } }
@keyframes bsgmf-in-back { from { opacity: 0; transform: translateX(-18px); } }

.bsgmf .bsgmf-step__title {
	margin: 0 0 8px;
	padding: 0;
	font-family: inherit;
	font-size: var(--bsgmf-fs-title);
	font-weight: 600;
	line-height: 1.18;
	letter-spacing: -.005em;
	text-transform: var(--bsgmf-title-case);
	color: var(--bsgmf-title);
	outline: none;
	text-wrap: balance;
}
.bsgmf-step__text { margin: 0 0 4px; max-width: 62ch; }
.bsgmf-step__text p + p { margin-top: 8px; }
.bsgmf-step__hint { color: var(--bsgmf-muted); font-size: 16px; }
.bsgmf-badge { margin-left: .4em; font-size: .62em; font-weight: 300; text-transform: none; letter-spacing: 0; color: var(--bsgmf-muted); vertical-align: .1em; }
.bsgmf-badge::before { content: '('; }
.bsgmf-badge::after { content: ')'; }

.bsgmf-step__error { color: var(--bsgmf-error); font-weight: 500; margin-top: 14px !important; }
.bsgmf-step__error:empty { display: none; }
.bsgmf-step.has-error .bsgmf-choices { animation: bsgmf-shake .36s; }
@keyframes bsgmf-shake { 20%, 60% { transform: translateX(-5px); } 40%, 80% { transform: translateX(5px); } }

/* ---------- Choices ---------- */

.bsgmf-choices-wrap { margin-top: 22px; }
.bsgmf-choices { display: grid; gap: 12px; }

.bsgmf .bsgmf-choice {
	position: relative;
	display: flex;
	align-items: center;
	gap: 14px;
	width: 100%;
	min-height: 60px;
	padding: 14px 18px;
	background: var(--bsgmf-bg);
	border: 1.5px solid var(--bsgmf-border);
	border-radius: var(--bsgmf-radius);
	color: var(--bsgmf-title);
	font-size: 16px;
	font-weight: 500;
	line-height: 1.3;
	text-align: left;
	transition: border-color .18s, background-color .18s, box-shadow .18s, transform .18s;
}
@media (hover: hover) { .bsgmf .bsgmf-choice:hover { border-color: var(--bsgmf-primary); box-shadow: 0 8px 22px -14px rgba(10, 20, 17, .35); } }
.bsgmf .bsgmf-choice:active { transform: scale(.985); }
.bsgmf .bsgmf-choice:focus-visible { outline: none; border-color: var(--bsgmf-primary); box-shadow: 0 0 0 4px var(--bsgmf-ring); }
.bsgmf .bsgmf-choice.is-selected { border-color: var(--bsgmf-primary); background: var(--bsgmf-tint); box-shadow: inset 0 0 0 1px var(--bsgmf-primary); }

/* list variant */
.bsgmf-choice__mark {
	display: grid;
	place-items: center;
	width: 22px;
	height: 22px;
	border: 1.5px solid #B9C4C0;
	border-radius: 50%;
	color: #fff;
	flex: none;
	transition: background-color .18s, border-color .18s;
}
.bsgmf-choice__mark.is-box { border-radius: 7px; }
.bsgmf-choice__mark .bsgmf-ui { width: 14px; height: 14px; stroke-width: 2.6; opacity: 0; transform: scale(.6); transition: opacity .15s, transform .18s var(--bsgmf-ease); }
.bsgmf-choice.is-selected .bsgmf-choice__mark { background: var(--bsgmf-primary); border-color: var(--bsgmf-primary); }
.bsgmf-choice.is-selected .bsgmf-choice__mark .bsgmf-ui { opacity: 1; transform: none; }

/* tile variant */
.bsgmf-choices--tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.bsgmf .bsgmf-choices--tiles .bsgmf-choice {
	flex-direction: column;
	justify-content: center;
	gap: 10px;
	min-height: 118px;
	padding: 20px 12px 16px;
	text-align: center;
}
.bsgmf-choice__icon { color: var(--bsgmf-primary); }
.bsgmf-choice__icon .bsgmf-ico { width: 36px; height: 36px; stroke-width: 1.5; }
.bsgmf-choice__label { overflow-wrap: anywhere; hyphens: auto; }
.bsgmf-choice__check {
	position: absolute;
	top: 10px;
	right: 10px;
	display: grid;
	place-items: center;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	border: 1.5px solid #C9D3CF;
	color: #fff;
	transition: background-color .18s, border-color .18s;
}
.bsgmf-choice__check .bsgmf-ui { width: 13px; height: 13px; stroke-width: 2.8; opacity: 0; transition: opacity .15s; }
.bsgmf-choice.is-selected .bsgmf-choice__check { background: var(--bsgmf-primary); border-color: var(--bsgmf-primary); }
.bsgmf-choice.is-selected .bsgmf-choice__check .bsgmf-ui { opacity: 1; }

/* notice */
.bsgmf-notice {
	display: flex;
	gap: 12px;
	margin-top: 16px;
	padding: 14px 16px;
	border-radius: 12px;
	background: var(--bsgmf-tint);
	color: var(--bsgmf-title);
	animation: bsgmf-in-fwd .25s var(--bsgmf-ease);
}
.bsgmf-notice .bsgmf-ui { width: 22px; height: 22px; color: var(--bsgmf-primary); margin-top: 1px; }
.bsgmf-notice p + p { margin-top: 6px; }

/* ---------- Inline upload ---------- */

.bsgmf-inline-upload { margin-top: 18px; }
.bsgmf .bsgmf-inline-upload__toggle {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 0;
	color: var(--bsgmf-primary);
	font-size: 16px;
	font-weight: 600;
}
.bsgmf .bsgmf-inline-upload__toggle:hover { color: var(--bsgmf-primary-hover); }
.bsgmf .bsgmf-inline-upload__toggle:focus-visible { outline: 2px solid var(--bsgmf-primary); outline-offset: 3px; border-radius: 4px; }
.bsgmf-inline-upload__toggle .bsgmf-ui { width: 20px; height: 20px; transition: transform .2s; }
.bsgmf-inline-upload.is-open .bsgmf-inline-upload__toggle .bsgmf-ui { transform: rotate(45deg); }
.bsgmf-inline-upload__panel { margin-top: 8px; }

/* ---------- Fields ---------- */

.bsgmf-fields {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 20px 14px;
	margin-top: 24px;
}
.bsgmf-field { grid-column: span 6; min-width: 0; }
.bsgmf-field--third { grid-column: span 2; }
.bsgmf-field--twothirds { grid-column: span 4; }

.bsgmf .bsgmf-field__label {
	display: block;
	margin: 0 0 8px;
	color: var(--bsgmf-title);
	font-size: 16px;
	font-weight: 500;
	line-height: 1.35;
}
.bsgmf-field__label .bsgmf-badge { font-size: .95em; }
.bsgmf-field--pills + .bsgmf-field--pills,
.bsgmf-field--checkbox { margin-top: 4px; }

.bsgmf .bsgmf-input {
	display: block;
	width: 100%;
	height: 56px;
	padding: 0 16px;
	background: #fff;
	border: 1.5px solid var(--bsgmf-border);
	border-radius: calc(var(--bsgmf-radius) - 4px);
	color: var(--bsgmf-title);
	font-size: 16px !important; /* never below 16px: prevents iOS zoom */
	font-weight: 400;
	line-height: 1.3;
	transition: border-color .18s, box-shadow .18s;
	-webkit-appearance: none;
	appearance: none;
}
.bsgmf .bsgmf-input--area { height: auto; min-height: 120px; padding: 14px 16px; resize: vertical; }
.bsgmf .bsgmf-input::placeholder { color: #9AA5A1; opacity: 1; }
@media (hover: hover) { .bsgmf .bsgmf-input:hover { border-color: #AEBBB6; } }
.bsgmf .bsgmf-input:focus { outline: none; border-color: var(--bsgmf-primary); box-shadow: 0 0 0 4px var(--bsgmf-ring); }
.bsgmf .bsgmf-input:disabled { background: var(--bsgmf-soft); color: var(--bsgmf-muted); }
.bsgmf .has-error .bsgmf-input { border-color: var(--bsgmf-error); }
.bsgmf .has-error .bsgmf-input:focus { box-shadow: 0 0 0 4px rgba(180, 35, 24, .15); }

.bsgmf-affix { position: relative; }
.bsgmf .bsgmf-affix .bsgmf-input { padding-right: 64px; }
.bsgmf-affix__unit { position: absolute; top: 50%; right: 16px; transform: translateY(-50%); color: var(--bsgmf-muted); font-weight: 500; pointer-events: none; }

.bsgmf-field__help { margin-top: 8px !important; color: var(--bsgmf-muted); font-size: 16px; }
.bsgmf-field__error { margin-top: 8px !important; color: var(--bsgmf-error); font-weight: 500; font-size: 16px; }
.bsgmf-field__error:empty { display: none; }

/* pills */
.bsgmf-pills { display: flex; flex-wrap: wrap; gap: 10px; }
.bsgmf .bsgmf-pill {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-height: 48px;
	padding: 10px 18px 10px 14px;
	border: 1.5px solid var(--bsgmf-border);
	border-radius: 999px;
	background: #fff;
	color: var(--bsgmf-title);
	font-size: 16px;
	font-weight: 500;
	line-height: 1.25;
	text-align: left;
	transition: border-color .18s, background-color .18s, box-shadow .18s;
}
@media (hover: hover) { .bsgmf .bsgmf-pill:hover { border-color: var(--bsgmf-primary); } }
.bsgmf .bsgmf-pill:focus-visible { outline: none; border-color: var(--bsgmf-primary); box-shadow: 0 0 0 4px var(--bsgmf-ring); }
.bsgmf .bsgmf-pill.is-selected { border-color: var(--bsgmf-primary); background: var(--bsgmf-tint); box-shadow: inset 0 0 0 1px var(--bsgmf-primary); }
.bsgmf-pill__dot { width: 18px; height: 18px; border-radius: 50%; border: 1.5px solid #B9C4C0; flex: none; transition: border .18s; }
.bsgmf-pill.is-selected .bsgmf-pill__dot { border: 5.5px solid var(--bsgmf-primary); }
.has-error .bsgmf-pill { border-color: #E8B4AF; }

/* unit toggle */
.bsgmf-units { display: inline-flex; margin-top: 10px; padding: 4px; border-radius: 999px; background: var(--bsgmf-soft); }
.bsgmf .bsgmf-unit { min-height: 40px; padding: 6px 16px; border-radius: 999px; font-size: 16px; font-weight: 500; color: var(--bsgmf-muted); }
.bsgmf .bsgmf-unit.is-selected { background: #fff; color: var(--bsgmf-title); box-shadow: 0 1px 4px rgba(10, 20, 17, .12); }
.bsgmf .bsgmf-unit:focus-visible { outline: 2px solid var(--bsgmf-primary); outline-offset: 1px; }

/* checkbox */
.bsgmf .bsgmf-check { position: relative; display: flex; align-items: flex-start; gap: 12px; cursor: pointer; line-height: 1.5; color: var(--bsgmf-text); font-size: 16px; font-weight: 300; }
.bsgmf-check--small { margin-top: 10px; }
.bsgmf-check__input { position: absolute; opacity: 0; width: 22px; height: 22px; margin: 0; }
.bsgmf-check__box {
	display: grid;
	place-items: center;
	width: 22px;
	height: 22px;
	margin-top: 1px;
	flex: none;
	border: 1.5px solid #B9C4C0;
	border-radius: 7px;
	background: #fff;
	color: #fff;
	transition: background-color .18s, border-color .18s;
}
.bsgmf-check__box .bsgmf-ui { width: 14px; height: 14px; stroke-width: 2.8; opacity: 0; }
.bsgmf-check__input:checked + .bsgmf-check__box { background: var(--bsgmf-primary); border-color: var(--bsgmf-primary); }
.bsgmf-check__input:checked + .bsgmf-check__box .bsgmf-ui { opacity: 1; }
.bsgmf-check__input:focus-visible + .bsgmf-check__box { box-shadow: 0 0 0 4px var(--bsgmf-ring); border-color: var(--bsgmf-primary); }
.has-error .bsgmf-check__box { border-color: var(--bsgmf-error); }

/* ---------- Uploads ---------- */

.bsgmf-uploads { display: grid; gap: 14px; margin-top: 24px; }
.bsgmf-upcard {
	padding: 16px;
	border: 1.5px solid var(--bsgmf-border);
	border-radius: var(--bsgmf-radius);
	background: #fff;
	transition: border-color .18s;
}
.bsgmf-upcard.has-files { border-color: var(--bsgmf-primary); }
.bsgmf-upcard__head { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.bsgmf-upcard__icon { color: var(--bsgmf-primary); }
.bsgmf-upcard__icon .bsgmf-ico { width: 28px; height: 28px; }
.bsgmf-upcard__label { flex: 1; font-weight: 600; color: var(--bsgmf-title); line-height: 1.3; }
.bsgmf-upcard__count:not(:empty) {
	display: grid;
	place-items: center;
	min-width: 26px;
	height: 26px;
	padding: 0 7px;
	border-radius: 999px;
	background: var(--bsgmf-primary);
	color: #fff;
	font-size: 14px;
	font-weight: 600;
}

.bsgmf-uploader { position: relative; }
.bsgmf-file-input { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; }
.bsgmf .bsgmf-drop {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 16px;
	border: 1.5px dashed #B9C4C0;
	border-radius: calc(var(--bsgmf-radius) - 4px);
	background: var(--bsgmf-soft);
	color: var(--bsgmf-title);
	cursor: pointer;
	transition: border-color .18s, background-color .18s;
}
.bsgmf .bsgmf-drop:hover, .bsgmf .bsgmf-drop.is-drag { border-color: var(--bsgmf-primary); background: var(--bsgmf-tint); }
.bsgmf-file-input:focus-visible + .bsgmf-drop { border-color: var(--bsgmf-primary); box-shadow: 0 0 0 4px var(--bsgmf-ring); }
.bsgmf-drop__icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: #fff; color: var(--bsgmf-primary); flex: none; box-shadow: 0 2px 8px rgba(10, 20, 17, .08); }
.bsgmf-drop__icon .bsgmf-ui { width: 22px; height: 22px; }
.bsgmf-drop__text { display: flex; flex-direction: column; gap: 2px; font-weight: 500; line-height: 1.35; min-width: 0; }
.bsgmf-drop__text u { color: var(--bsgmf-primary); text-decoration-thickness: 1.5px; }
.bsgmf-drop__text small { font-size: 16px; font-weight: 300; color: var(--bsgmf-muted); }
.bsgmf-drop__touch { display: none; }
@media (hover: none) and (pointer: coarse) {
	.bsgmf-drop__desk { display: none; }
	.bsgmf-drop__touch { display: inline; }
}

.bsgmf-upload-msg { margin-top: 8px !important; color: var(--bsgmf-error); font-weight: 500; }
.bsgmf-upload-msg:empty { display: none; }

.bsgmf .bsgmf-files { list-style: none; margin: 0; padding: 0; }
.bsgmf .bsgmf-file {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 10px 0 0;
	padding: 8px 8px 8px 8px;
	border-radius: 12px;
	background: var(--bsgmf-soft);
}
.bsgmf-file__thumb { width: 46px; height: 46px; border-radius: 9px; object-fit: cover; flex: none; background: #fff; }
.bsgmf-file__thumb.is-doc { display: grid; place-items: center; color: var(--bsgmf-primary); }
.bsgmf-file__thumb .bsgmf-ui { width: 22px; height: 22px; }
.bsgmf-file__body { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.bsgmf-file__name { color: var(--bsgmf-title); font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bsgmf-file__status { color: var(--bsgmf-muted); font-size: 16px; }
.bsgmf-file.is-error .bsgmf-file__status { color: var(--bsgmf-error); }
.bsgmf-file__bar { display: block; height: 4px; margin-top: 6px; border-radius: 99px; background: #E1E8E5; overflow: hidden; }
.bsgmf-file__bar span { display: block; height: 100%; background: var(--bsgmf-primary); transition: width .2s; }
.bsgmf .bsgmf-file__remove { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; color: var(--bsgmf-muted); flex: none; }
.bsgmf .bsgmf-file__remove:hover { background: #fff; color: var(--bsgmf-error); }
.bsgmf .bsgmf-file__remove:focus-visible { outline: 2px solid var(--bsgmf-primary); }
.bsgmf-file__remove .bsgmf-ui { width: 18px; height: 18px; }

/* ---------- Buttons / nav ---------- */

.bsgmf .bsgmf-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 54px;
	padding: 0 30px;
	border-radius: 999px;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.1;
	letter-spacing: .05em;
	text-transform: uppercase;
	text-decoration: none;
	transition: background-color .18s, color .18s, box-shadow .18s, transform .18s;
}
.bsgmf .bsgmf-btn .bsgmf-ui { width: 20px; height: 20px; stroke-width: 2; }
.bsgmf .bsgmf-btn--primary { background: var(--bsgmf-primary); color: #fff; }
.bsgmf .bsgmf-btn--primary:hover { background: var(--bsgmf-primary-hover); color: #fff; }
.bsgmf .bsgmf-btn--primary:active { transform: scale(.98); }
.bsgmf .bsgmf-btn--primary:focus-visible { outline: none; box-shadow: 0 0 0 4px var(--bsgmf-ring); }
.bsgmf .bsgmf-btn--primary:disabled { cursor: progress; opacity: .85; }
.bsgmf .bsgmf-btn--primary .bsgmf-ui--next { transition: transform .2s var(--bsgmf-ease); }
.bsgmf .bsgmf-btn--primary:hover .bsgmf-ui--next { transform: translateX(3px); }
.bsgmf .bsgmf-btn--primary.is-skip { background: #fff; color: var(--bsgmf-primary); box-shadow: inset 0 0 0 1.5px var(--bsgmf-primary); }
.bsgmf .bsgmf-btn--primary.is-skip:hover { background: var(--bsgmf-tint); }
.bsgmf .bsgmf-btn--primary.is-submit .bsgmf-ui--next { display: none; }
.bsgmf .bsgmf-btn--primary.is-loading::before {
	content: '';
	width: 18px;
	height: 18px;
	border: 2px solid rgba(255, 255, 255, .45);
	border-top-color: #fff;
	border-radius: 50%;
	animation: bsgmf-spin .7s linear infinite;
}
.bsgmf .bsgmf-btn--ghost { padding: 0 18px 0 12px; color: var(--bsgmf-text); background: transparent; }
.bsgmf .bsgmf-btn--ghost:hover { color: var(--bsgmf-title); background: var(--bsgmf-soft); }
.bsgmf .bsgmf-btn--ghost:focus-visible { outline: 2px solid var(--bsgmf-primary); outline-offset: 2px; }
.bsgmf .bsgmf-btn.is-hidden { visibility: hidden; }

.bsgmf__nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: 32px;
	padding-top: 24px;
	border-top: 1px solid #EAEFED;
}
.bsgmf__navmsg { margin-top: 20px; padding: 12px 16px; border-radius: 12px; background: #FDECEA; color: var(--bsgmf-error); font-weight: 500; }
.bsgmf__navmsg:empty { display: none; }

.bsgmf__foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 18px; }
.bsgmf__trust { display: inline-flex; align-items: center; gap: 8px; color: var(--bsgmf-muted); font-size: 16px; }
.bsgmf__trust .bsgmf-ui { width: 20px; height: 20px; color: var(--bsgmf-primary); }
.bsgmf .bsgmf__restart { color: var(--bsgmf-muted); font-size: 16px; text-decoration: underline; text-underline-offset: 3px; padding: 4px 0; }
.bsgmf .bsgmf__restart:hover { color: var(--bsgmf-title); }

@keyframes bsgmf-spin { to { transform: rotate(360deg); } }

/* ---------- Final panel ---------- */

.bsgmf-final { padding: clamp(12px, 3vw, 28px) 0 8px; text-align: center; outline: none; }
.bsgmf-final .bsgmf-step__text { margin-inline: auto; }
.bsgmf-final__badge { display: grid; place-items: center; width: 68px; height: 68px; margin: 0 auto 20px; border-radius: 50%; background: var(--bsgmf-primary); color: #fff; animation: bsgmf-pop .5s var(--bsgmf-ease); }
.bsgmf-final__badge .bsgmf-ui { width: 34px; height: 34px; stroke-width: 2.4; }
.bsgmf-final__eyebrow { color: var(--bsgmf-primary); font-weight: 600; margin-bottom: 6px !important; }
.bsgmf-final__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 26px; }
.bsgmf-final__redirect { display: inline-flex; align-items: center; gap: 10px; margin-top: 20px !important; color: var(--bsgmf-muted); }
.bsgmf-spinner { width: 18px; height: 18px; border: 2px solid #D5DEDB; border-top-color: var(--bsgmf-primary); border-radius: 50%; animation: bsgmf-spin .7s linear infinite; }
@keyframes bsgmf-pop { from { transform: scale(.5); opacity: 0; } 70% { transform: scale(1.06); } }

/* ---------- Breakpoints ---------- */

@media (min-width: 600px) {
	.bsgmf-choices--tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.bsgmf-choices--list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.bsgmf-field--half { grid-column: span 3; }
	.bsgmf-uploads { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 720px) {
	.bsgmf-choices--tiles.bsgmf-choices--even { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.bsgmf__count, .bsgmf__duration, .bsgmf__trust, .bsgmf .bsgmf__restart { font-size: 16px; }
	.bsgmf .bsgmf-choices--tiles .bsgmf-choice { min-height: 132px; }
	.bsgmf-choice__icon .bsgmf-ico { width: 40px; height: 40px; }
}

/* Small phones: 3 tiles become horizontal rows, nav gets sticky */
@media (max-width: 599px) {
	.bsgmf-field--third, .bsgmf-field--twothirds { grid-column: span 3; }
	.bsgmf .bsgmf-choices--tiles .bsgmf-choice:only-child,
	.bsgmf-choices--tiles:has(> :nth-child(3):last-child) { grid-template-columns: 1fr; }
	.bsgmf-choices--tiles:has(> :nth-child(3):last-child) .bsgmf-choice {
		flex-direction: row;
		justify-content: flex-start;
		min-height: 64px;
		padding: 12px 48px 12px 16px;
		text-align: left;
	}
	.bsgmf-choices--tiles:has(> :nth-child(3):last-child) .bsgmf-choice__icon .bsgmf-ico { width: 30px; height: 30px; }
	.bsgmf-choices--tiles:has(> :nth-child(3):last-child) .bsgmf-choice__check { top: 50%; transform: translateY(-50%); right: 14px; }

	.bsgmf__duration { display: none; }

	.bsgmf__nav {
		position: sticky;
		bottom: 0;
		z-index: 5;
		margin-inline: calc(-1 * clamp(20px, 4.5vw, 48px));
		padding: 12px clamp(20px, 4.5vw, 48px) calc(12px + env(safe-area-inset-bottom, 0px));
		background: var(--bsgmf-bg);
		border-top: 1px solid #EAEFED;
		box-shadow: 0 -10px 24px -18px rgba(10, 20, 17, .35);
	}
	.bsgmf--plain .bsgmf__nav { margin-inline: -16px; padding-inline: 16px; }
	.bsgmf .bsgmf__nav .bsgmf-btn--primary { flex: 1; padding: 0 20px; }
	.bsgmf .bsgmf__nav .bsgmf-btn--ghost { width: 54px; padding: 0; border: 1.5px solid var(--bsgmf-border); }
	.bsgmf .bsgmf__nav .bsgmf-btn--ghost span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	.bsgmf .bsgmf__nav .bsgmf-btn--ghost.is-hidden { display: none; }
	.bsgmf__foot { flex-direction: column; align-items: flex-start; }
	.bsgmf-final__actions .bsgmf-btn { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
	.bsgmf *, .bsgmf *::before, .bsgmf *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* Theme-Fokusrahmen bei Maus/Touch neutralisieren (Tastatur-Fokus bleibt sichtbar) */
.bsgmf button:focus:not(:focus-visible),
.bsgmf [tabindex]:focus:not(:focus-visible) { outline: none; }
.bsgmf .bsgmf-step__title:focus { outline: none; }