#mitglied-form p { margin-bottom: 1em; }
#sepa-fieldset { margin-top: .5em; padding-left: 1em; border-left: 3px solid #ccc; }

.two-column-row {  display: flex;  gap: 1em; /* Abstand zwischen den beiden Feldern */}

.two-column-row p {  flex: 1;  margin: 0;  display: flex;  flex-direction: column; /* Label über dem Input */
}

#mitglied-form input[type="email"],
#mitglied-form input[type="tel"],
#mitglied-form input[type="text"] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;

  border: 1px solid #ccc;
  padding: .5em;
  font-size: 1rem;
  line-height: 1.4;
  background: white;
  border-radius: 4px;
  box-sizing: border-box;
}

#form-message {
  margin-top: 1.5em;
  padding: 1em;
  border-radius: 4px;
  display: none;
  font-weight: 600;
}

#form-message.error {
  display: block;
  color: #b00020;
  background: #fde7eb;
  border: 1px solid #f5c2c7;
}

#form-message.success {
  display: block;
  color: #0a6b00;
  background: #e6f8e5;
  border: 1px solid #b9e2b7;
}

.mitglied-message {
  margin-top: 1.5em;
  padding: 1em;
  border-radius: 4px;
  display: none;
  font-weight: 600;
}

.mitglied-message.error {
  display: block;
  color: #b00020;
  background: #fde7eb;
  border: 1px solid #f5c2c7;
}

.mitglied-message.success {
  display: block;
  color: #0a6b00;
  background: #e6f8e5;
  border: 1px solid #b9e2b7;
}

.mitglied-message ul {
  margin: 0;
  padding-left: 1.25em;
}

.mitglied-message li {
  margin-bottom: .25em;
}


/* Spinner Overlay */
#loader {
  display: none;       /* unsichtbar bis er gebraucht wird */
  margin-top: 10px;    /* Abstand zum Button */
 // margin-left: 300px;
  text-align: center;  /* zentriert unter dem Button */
}

#loader .spinner {
   width: 50px;
  height: 50px;
  border: 8px solid #f3f3f3;
  border-top: 8px solid #3498db;
  border-radius: 50%;     /* rund */
  animation: spin 1s linear infinite;
  margin: 0 auto;         /* horizontal zentrieren */
  display: block;         /* Block-Element für margin auto */
  
}

/* Rotation */
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}