@starting-style {
	.ais-Dropdown.ais-Dropdown--type-accordion.ais-Dropdown--opened .ais-Panel-body {
		opacity: 0;
	}
}

@view-transition {
	navigation: auto;
}

.contact-us.align-none {
	container-type: inline-size;
	container-name: contact-us;
}

@container contact-us (max-width: 329px) {
	.contact-us.align-none {

		.contact-us__inner {
			display: flex;
			flex-direction: column;
			width: 100%;
			height: auto;
		}

		.contact-us__content {
			width: auto;
		}

		.contact-us__image-wrapper {
			width: 100%;
			height: 200px;
			border-top-right-radius: 0;
			border-bottom-left-radius: var(--border-radius-m);
			border-bottom-right-radius: var(--border-radius-m);
		}
	}
}

#era-insurance-fieldset {
	container-type: inline-size;
	container-name: checkout-insurance;
}

#era-insurance-fieldset .insurance {
	display: flex;
	flex-direction: column-reverse;
}

@container checkout-insurance (width >= 730px) {
	#era-insurance-fieldset .insurance {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: var(--spacing-40);
	}
}

.woocommerce-billing-fields__field-wrapper,
.woocommerce-addons__field-wrapper,
.woocommerce-transport-fields__field-wrapper {
	container-type: inline-size;
	container-name: checkout-field-wrapper;
}

.form-row {
	grid-column: 1 / -1;
	display: grid;
	align-content: start;
}

@container checkout-field-wrapper (width > 450px) {
	.form-row {
		&.form-row-wide {
			grid-column: 1 / -1;
		}

		&.form-row-first {
			grid-column: 1 / 7;
		}

		&.form-row-last {
			grid-column: 7 / -1;
		}

		&#billing_postcode_field,
		&#phone_country_code_field {
			grid-column: 1 / 5;
		}

		&#billing_city_field,
		&#billing_phone_field {
			grid-column: 5 / -1;
		}

		&#billing_email_field {
			grid-column: 1 / -1;
		}
	}
}

@container checkout-field-wrapper (width > 800px) {
	.form-row {
		&#phone_country_code_field {
			grid-column: 1 / 3;
		}

		&#billing_phone_field {
			grid-column: 3 / 7;
		}

		&#billing_email_field {
			grid-column: 7 / -1;
		}
	}
}


.woocommerce-addons__field-wrapper {
	container-type: inline-size;
	container-name: addons-field-wrapper;
}

@container addons-field-wrapper (width <= 800px) {
	.woocommerce-addons__field-wrapper .woocommerce-addons__table {
		thead {
			display: none;
		}

		.addon-row {
			display: grid;
			grid-template-columns: 1fr auto;

			td:nth-child(1),
			td:nth-child(2){
				padding-top: 1rem;
				padding-bottom: 0.5rem;
			}
			td:nth-child(3),
			td:nth-child(4){
				padding-top: 0.5rem;
				padding-bottom: 1rem;
			}

			&:not(:last-child){
				border-bottom: 1px solid var(--color-black-muted);
			}

			td::before {
				content: attr(data-label);
				display: block;
				font-weight: var(--weight-bold);
				text-transform: uppercase;
			}

			.addon-row__total-text {
				height: var(--h);
				display: inline-flex;
				align-items: center;
			}
		}
	}
}

@container addons-field-wrapper (width > 800px) {
	.woocommerce-addons__field-wrapper .woocommerce-addons__table {
		.addon-row__price,
		.addon-row__total {
			width: 11ch;
		}

		.addon-row__choice {
			text-align: center;
		}
	}
}

#era-participants-fieldset {
	container-type: inline-size;
	container-name: participant-fieldset;
}

@container participant-fieldset (width <= 720px) {
	#era-participants-fieldset .woocommerce-participants__table {
		thead {
			display: none;
		}

		.participant-row {
			display: flex;
			flex-direction: column;

			&:not(:last-child) {
				border-bottom: 1px solid var(--color-black-muted);
			}

			td.participant-row__index {
				padding-top: 1rem;
			}

			td.participant-row__birthdate {
				padding-bottom: 1rem;
			}

			td.participant-row__index::before {
				content: attr(data-label);
				display: block;
				font-weight: var(--weight-bold);
				text-transform: uppercase;
			}
		}
	}
}
@container participant-fieldset (width > 720px) {
	#era-participants-fieldset .woocommerce-participants__table {
		.form-row label {
			border: 0;
			clip: rect(1px, 1px, 1px, 1px);
			clip-path: inset(50%);
			height: 1px;
			margin: -1px;
			overflow: hidden;
			padding: 0;
			position: absolute;
			width: 1px;
			word-wrap: normal !important;
			pointer-events: none;
		}

		.participant-row__index {
			display: none;
		}

		.participant-row__birthdate {
			width: calc(15ch + 1rem);
		}
	}
}