/* TS BusCamp Konfigurator-Funnel — Optik identisch zum Original:
   weißer Text zentriert auf dem Hintergrundbild (Container transparent),
   Orange-Akzent aus den Site-Buttons (#F9B231). */
.tsbuscamp-funnel {
  --tsf-accent: #F9B231;
  --tsf-accent-dark: #e09b1e;
  --tsf-text: #ffffff;
  --tsf-radius: 4px;
  max-width: 620px;
  margin: 0 auto;
  width: 100%;
  font-family: var(--font-kit-text-font, inherit);
  color: var(--tsf-text);
  text-align: center;
  box-sizing: border-box;
}
.tsbuscamp-funnel *, .tsbuscamp-funnel *::before, .tsbuscamp-funnel *::after { box-sizing: border-box; }

.tsbuscamp-funnel .tsf-step__title {
  font-family: var(--font-kit-header-font, inherit);
  font-weight: var(--font-kit-header-font-weight, 700);
  font-size: 32px;
  line-height: 1.2;
  margin: 8px 0 10px;
  color: #fff;
}
.tsbuscamp-funnel .tsf-step__desc {
  font-size: 16px;
  color: rgba(255,255,255,.9);
  margin: 0 0 26px;
}

/* Options-Liste (Checkbox multi / Radio single) */
.tsbuscamp-funnel .tsf-options {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 6px auto 8px;
  max-width: 460px;
  text-align: left;
}
.tsbuscamp-funnel .tsf-check,
.tsbuscamp-funnel .tsf-option {
  display: flex;
  align-items: center;
  gap: 14px;
  width: 100%;
  padding: 14px 18px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.5);
  border-radius: var(--tsf-radius);
  color: #fff;
  font-family: inherit;
  font-size: 16px;
  cursor: pointer;
  text-align: left;
  transition: background .15s, border-color .15s;
}
.tsbuscamp-funnel .tsf-check:hover,
.tsbuscamp-funnel .tsf-option:hover { background: rgba(255,255,255,.18); border-color: #fff; }

/* Checkbox-Kästchen (multi-select) */
.tsbuscamp-funnel .tsf-check__box {
  flex: 0 0 auto;
  width: 22px; height: 22px;
  border: 2px solid #fff;
  border-radius: 3px;
  position: relative;
  transition: background .15s;
}
.tsbuscamp-funnel .tsf-check--on { background: rgba(249,178,49,.22); border-color: var(--tsf-accent); }
.tsbuscamp-funnel .tsf-check--on .tsf-check__box { background: var(--tsf-accent); border-color: var(--tsf-accent); }
.tsbuscamp-funnel .tsf-check--on .tsf-check__box::after {
  content: ''; position: absolute; left: 6px; top: 2px;
  width: 6px; height: 11px; border: solid #fff; border-width: 0 2.5px 2.5px 0; transform: rotate(45deg);
}

/* Radio (single-select) */
.tsbuscamp-funnel .tsf-option__radio {
  flex: 0 0 auto;
  width: 22px; height: 22px;
  border: 2px solid #fff;
  border-radius: 50%;
  position: relative;
}
.tsbuscamp-funnel .tsf-option--on { background: rgba(249,178,49,.22); border-color: var(--tsf-accent); }
.tsbuscamp-funnel .tsf-option--on .tsf-option__radio { border-color: var(--tsf-accent); }
.tsbuscamp-funnel .tsf-option--on .tsf-option__radio::after {
  content: ''; position: absolute; left: 4px; top: 4px; width: 10px; height: 10px; border-radius: 50%; background: var(--tsf-accent);
}

/* Freitext + Formularfelder */
.tsbuscamp-funnel .tsf-field { margin: 0 auto 14px; max-width: 460px; text-align: left; }
.tsbuscamp-funnel .tsf-label { display: block; font-size: 14px; font-weight: 600; margin-bottom: 6px; color: #fff; }
.tsbuscamp-funnel .tsf-req { color: var(--tsf-accent); }
.tsbuscamp-funnel .tsf-input {
  width: 100%;
  max-width: 460px;
  margin: 0 auto;
  padding: 13px 15px;
  font-size: 16px;
  font-family: inherit;
  color: #222;
  background: #fff;
  border: 1px solid rgba(255,255,255,.6);
  border-radius: var(--tsf-radius);
  outline: none;
  display: block;
  transition: box-shadow .15s;
}
.tsbuscamp-funnel .tsf-field .tsf-input { max-width: none; }
.tsbuscamp-funnel .tsf-input:focus { box-shadow: 0 0 0 2px var(--tsf-accent); }
.tsbuscamp-funnel .tsf-input--invalid { box-shadow: 0 0 0 2px #e04141; }
.tsbuscamp-funnel textarea.tsf-input { resize: vertical; min-height: 84px; }

.tsbuscamp-funnel .tsf-error { color: #ffd2d2; font-size: 14px; min-height: 20px; margin: 6px 0; text-shadow: 0 1px 2px rgba(0,0,0,.4); }

/* Buttons */
.tsbuscamp-funnel .tsf-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 40px;
  margin-top: 22px;
  font-size: 15px;
  font-weight: 700;
  font-family: var(--font-kit-header-font, inherit);
  color: #fff;
  background: var(--tsf-accent);
  border: none;
  border-radius: var(--tsf-radius);
  cursor: pointer;
  text-decoration: none;
  transition: background .15s, transform .1s;
}
.tsbuscamp-funnel .tsf-btn:hover { background: var(--tsf-accent-dark); }
.tsbuscamp-funnel .tsf-btn:active { transform: translateY(1px); }
.tsbuscamp-funnel .tsf-btn--submit { min-width: 220px; }

.tsbuscamp-funnel .tsf-back {
  display: block;
  margin: 16px auto 0;
  background: none;
  border: none;
  color: rgba(255,255,255,.85);
  font-size: 14px;
  font-family: inherit;
  cursor: pointer;
  text-decoration: underline;
}
.tsbuscamp-funnel .tsf-back:hover { color: #fff; }

/* Finish */
.tsbuscamp-funnel .tsf-step--finish { text-align: center; }
.tsbuscamp-funnel .tsf-check-icon {
  width: 84px; height: 84px;
  margin: 4px auto 14px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%;
  background: rgba(249,178,49,.25);
  color: #fff;
}

@media (max-width: 640px) {
  .tsbuscamp-funnel .tsf-step__title { font-size: 24px; }
  .tsbuscamp-funnel { max-width: 100%; }
}