:root {
  --bs-primary: #E2001A;
  --bs-primary-rgb: 226, 0, 26;
  --bs-body-color: #333333;
  --bs-body-font-family: system-ui, -apple-system, 'Segoe UI', sans-serif;
  --bs-border-radius: 0.5rem;
  --bs-border-color: #D8D8D8;
  --ei-red: #E2001A;
  --ei-red-dark: #B80015;
  --ei-grey: #6B6B6B;
}

html, body {
  max-width: 100%;
  overflow-x: hidden;
}

body {
  margin: 0;
  background: #F4F4F4;
  color: #333;
  font-family: var(--bs-body-font-family);
  -webkit-font-smoothing: antialiased;
}

a {
  color: var(--ei-red);
  text-decoration: underline;
  text-underline-offset: 2px;
}

a:hover {
  color: var(--ei-red-dark);
}

.btn-primary {
  --bs-btn-bg: var(--ei-red);
  --bs-btn-border-color: var(--ei-red);
  --bs-btn-hover-bg: var(--ei-red-dark);
  --bs-btn-hover-border-color: var(--ei-red-dark);
  --bs-btn-active-bg: var(--ei-red-dark);
  --bs-btn-active-border-color: var(--ei-red-dark);
  --bs-btn-disabled-bg: #E9A6AD;
  --bs-btn-disabled-border-color: #E9A6AD;
  --bs-btn-focus-shadow-rgb: 226, 0, 26;
}

.btn-outline-secondary {
  --bs-btn-color: #555;
  --bs-btn-border-color: #CFCFCF;
  --bs-btn-hover-bg: #EFEFEF;
  --bs-btn-hover-border-color: #BDBDBD;
  --bs-btn-hover-color: #222;
  --bs-btn-active-bg: #E6E6E6;
  --bs-btn-active-color: #222;
  --bs-btn-active-border-color: #BDBDBD;
}

.btn {
  font-weight: 600;
  letter-spacing: .01em;
  padding-inline: 1.35rem;
}

.form-label {
  font-weight: 600;
  font-size: .875rem;
  margin-bottom: .3rem;
  color: #3A3A3A;
}

.form-label.required::after {
  content: ' *';
  color: #E2001A;
}

.form-control,
.form-select {
  padding: .6rem .8rem;
  border-color: #D8D8D8;
  font-size: .95rem;
}

.form-control::placeholder {
  color: #A9A9A9;
}

.form-control:focus,
.form-select:focus {
  border-color: var(--ei-red);
  box-shadow: 0 0 0 .2rem rgba(226, 0, 26, .14);
}

.form-check-input:checked {
  background-color: var(--ei-red);
  border-color: var(--ei-red);
}

.form-check-input:focus {
  border-color: var(--ei-red);
  box-shadow: 0 0 0 .2rem rgba(226, 0, 26, .14);
}

.form-control.is-invalid:focus,
.form-select.is-invalid:focus {
  box-shadow: 0 0 0 .2rem rgba(220, 53, 69, .14);
}

.input-group-text {
  background: #F7F7F7;
  border-color: #D8D8D8;
  color: #555;
  font-weight: 600;
}

/* Schritt-Anzeige (reines CSS, ohne Wizard-Logik) */
.ei-steps {
  display: flex;
  align-items: flex-start;
  gap: 0;
  list-style: none;
  padding: 0;
  margin: 0;
}

.ei-step {
  flex: 1 1 0;
  min-width: 0;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.ei-step::before {
  content: "";
  position: absolute;
  top: 17px;
  right: 50%;
  left: -50%;
  height: 2px;
  background: #DEDEDE;
}

.ei-step:first-child::before {
  display: none;
}

.ei-step.done::before,
.ei-step.active::before {
  background: var(--ei-red);
}

.ei-dot {
  position: relative;
  z-index: 1;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: 2px solid #DEDEDE;
  color: #9A9A9A;
  font-weight: 700;
  font-size: .9rem;
  transition: all .22s ease;
}

.ei-step.active .ei-dot {
  border-color: var(--ei-red);
  background: var(--ei-red);
  color: #fff;
  box-shadow: 0 0 0 5px rgba(226, 0, 26, .13);
}

.ei-step.done .ei-dot {
  border-color: var(--ei-red);
  background: #fff;
  color: var(--ei-red);
}

.ei-num {
  font-size: .72rem;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: #6B6B6B;
  margin-top: .5rem;
  font-weight: 600;
}

.ei-lbl {
  font-size: .82rem;
  line-height: 1.25;
  color: #8A8A8A;
  font-weight: 600;
  margin-top: .1rem;
  padding-inline: 2px;
}

.ei-step.active .ei-lbl,
.ei-step.active .ei-num {
  color: var(--ei-red);
}

.ei-step.done .ei-lbl {
  color: #4A4A4A;
}

@media (max-width: 575.98px) {
  .ei-lbl {
    display: none;
  }

  .ei-dot {
    width: 32px;
    height: 32px;
  }

  .ei-step::before {
    top: 15px;
  }
}

.ei-fade {
  animation: eiFade .28s ease both;
}

@keyframes eiFade {
  from {
    opacity: 0;
    transform: translateY(6px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}
