.radio-container {
    margin: 8px 0 16px 0;
    width: fit-content;
}

section.teilnehmer {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 2px 8px;
    margin-bottom: 16px;
}

section.teilnehmer > label {
    justify-self: start;
    align-self: center;
}

section.teilnehmer > input {
    justify-self: start;
    width: 3em;
}

section.teilnehmer > div {
    grid-column: 1 / 3;
    padding-bottom: 0;
    overflow: hidden;
    height: 0;
    transition: 
        height 0.7s ease-in-out,
        padding-bottom 0.7s ease-in-out;
}

section.teilnehmer > div.visible {
    padding-bottom: 12px;
}

section.teilnehmer > div > textarea {
    transform: translateY(-100%);
    transition: transform 0.7s ease-in-out;
    resize: vertical;
    width: 100%;
}

section.teilnehmer > div.visible > textarea {
    transform: translateY(0%);
}

section.kontaktinformationen {
    display: grid;
    grid-template-columns: fit-content(30%) 1fr;
    gap: 8px 8px;
}

section.kontaktinformationen > :nth-child(odd) {
    hyphens: auto;
}

section.kontaktinformationen > input[type=checkbox]:nth-child(even) {
  justify-self: start;
  margin-left: 0;
}

section.kontaktinformationen textarea {
    resize: vertical;
}

#kontakt_email_bestätigung {
    width: 100%;
    box-sizing: border-box;
}

.message-box {
    border-radius: 8px;
    text-align: center;
}

/* Message styles (used with jQuery .addClass()) */
.msg-error {
    background-color: #fee2e2; /* red-100 */
    color: #b91c1c; /* red-800 */
    border: 1px solid #fca5a5;
    margin-top: 4px;
    padding: 4px;
}

.msg-success {
    background-color: #d1fae5; /* green-100 */
    color: #065f46; /* green-800 */
    border: 1px solid #6ee7b7;
    margin-top: 4px;
    padding: 4px;
}

.msg-info {
    background-color: #e0e7ff; /* blue-100 */
    color: #3730a3; /* blue-800 */
    border: 1px solid #93c5fd;
    margin-top: 4px;
    padding: 4px;
}

.msg-warn {
    background-color: #fffbeb; /* yellow-100 */
    color: #92400e; /* yellow-800 */
    border: 1px solid #fcd34d;
    margin-top: 4px;
    padding: 4px;
}

.anmeldung-hint {
    background: #fee;
    border: 1px solid #c00;
    color: #c00;
    padding: 1rem;
    margin: 1rem 0;
    font-weight: bold;
}

p.bankverbindung {
    margin-left: 16px;
    font-weight: bold;
}

.anmeldungen {
    display: grid;
    grid-template-columns: max-content max-content max-content;
    gap: 4px;
    width: fit-content;
}

.anmeldungen span {
    background-color: #EEE;
    padding: 4px;
}
