/* ==========================================================================
   CF7 Mehrpersonen-Check-in – Styles
   ========================================================================== */

/* Versteckte Personen-Blöcke (per [hidden]-Attribut oder JS gesetzt) */
.person-block[hidden] {
  display: none !important;
}

.person-block.person-extra {
}

.person-heading-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
}

/* kleine Einblend-Animation beim Erscheinen eines Blocks */
.person-block.person-extra:not([hidden]) {
  animation: fadeInPerson 0.25s ease-in;
}

@keyframes fadeInPerson {
  from { opacity: 0; transform: translateY(6px); }
  to   { opacity: 1; transform: translateY(0); }
}


.wpcf7-form .person-block {
	padding: 1rem;
	flex: 0 0 100%;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	position: relative;
}
.wpcf7-form .person-block:before {
	content: ''; position: absolute;
	top: 0.375rem; bottom: 0.375rem;
	left: 0.375rem; right: 0.375rem;
	width: auto; height: auto;
	border: 1px solid currentcolor;
	pointer-events: none;
}
.wpcf7-form .person-block > * {
	padding: 0.5rem;
}

@media screen and (min-width:40em){
	.wpcf7-form .person-block {
		flex: 0 0 50%;
	}
}