/* Tarifs des vols : tableau comparatif, mise en colonnes, prix dans le formulaire. */

.airlibre-tarifs {
	--al-primary: #1A3042;
	--al-secondary: #50623D;
	--al-text: #324A6D;
	--al-accent: #6DDAFB;
	--al-trait: #C8D5DC;
	--al-blanc: #FFFFFF;
	--al-fond: #F9FAFD;
}

/* ── Colonne des tarifs : elle suit le défilement du formulaire ──────────── */
/* Ciblage par l'ID Elementor du conteneur (« altarcolg »), posé par le script
   de construction de la page. L'apparence de la carte du formulaire, elle, est
   réglée dans les paramètres du conteneur Elementor, pas ici. */

@media ( min-width: 1025px ) {

	.elementor-element-altarcolg {
		position: sticky;
		top: 2rem;
		align-self: flex-start;
	}
}

/* ── Le bloc tarifs ──────────────────────────────────────────────────────── */

.airlibre-tarifs {
	background: var( --al-blanc );
	border: 1px solid var( --al-trait );
	border-radius: 12px;
	overflow: hidden;
}

.airlibre-tarifs__bascule {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
	padding: 1rem 1.25rem;
	cursor: pointer;
	font-weight: 600;
	color: var( --al-primary );
	list-style: none;
}

.airlibre-tarifs__bascule::-webkit-details-marker {
	display: none;
}

.airlibre-tarifs__bascule::after {
	content: "";
	width: 0.55rem;
	height: 0.55rem;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate( 45deg );
	transition: transform 0.2s ease;
	align-self: center;
	flex: 0 0 auto;
}

.airlibre-tarifs[open] .airlibre-tarifs__bascule::after {
	transform: rotate( -135deg );
}

.airlibre-tarifs__des {
	margin-left: auto;
	font-weight: 700;
	color: var( --al-secondary );
}

.airlibre-tarifs__cadre {
	overflow-x: auto; /* le tableau défile dans son cadre, jamais la page */
	-webkit-overflow-scrolling: touch;
}

.airlibre-tarifs table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	color: var( --al-text );
}

.airlibre-tarifs caption {
	caption-side: bottom;
	padding: 0.75rem 1.25rem 1rem;
	font-size: 0.85em;
	color: var( --al-text );
	opacity: 0.75;
	text-align: left;
}

.airlibre-tarifs thead th {
	background: var( --al-primary );
	color: var( --al-blanc );
	font-weight: 600;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	font-size: 0.75em;
	padding: 0.7rem 1.25rem;
	text-align: left;
}

.airlibre-tarifs thead th:last-child {
	text-align: right;
}

.airlibre-tarifs tbody th,
.airlibre-tarifs tbody td {
	padding: 0.8rem 1.25rem;
	border-top: 1px solid var( --al-trait );
	vertical-align: middle;
}

.airlibre-tarifs tbody th {
	text-align: left;
	font-weight: 600;
	color: var( --al-primary );
}

.airlibre-tarifs__precision {
	display: block;
	font-weight: 400;
	font-size: 0.85em;
	opacity: 0.75;
}

.airlibre-tarifs__duree {
	white-space: nowrap;
}

.airlibre-tarifs__prix {
	white-space: nowrap;
	text-align: right;
	font-weight: 700;
	color: var( --al-secondary );
}

.airlibre-tarifs tbody tr:nth-child( even ) th,
.airlibre-tarifs tbody tr:nth-child( even ) td {
	background: var( --al-fond );
}

/* Au-delà du pliage, le tableau est toujours ouvert : la bascule ne sert plus. */
@media ( min-width: 1025px ) {

	.airlibre-tarifs__bascule {
		border-bottom: 1px solid var( --al-trait );
		cursor: default;
		pointer-events: none;
	}

	.airlibre-tarifs__bascule::after {
		display: none;
	}
}

/* ── Prix et durée dans les options du formulaire ────────────────────────── */

.airlibre-choix__meta {
	display: inline-flex;
	align-items: baseline;
	gap: 0.5rem;
	margin-left: 0.6rem;
}

.airlibre-choix__prix {
	font-weight: 700;
	color: var( --al-secondary );
}

.airlibre-choix__duree {
	font-size: 0.85em;
	opacity: 0.7;
}

/* Sur mobile, le prix passe sous le nom du vol plutôt que de déborder. */
@media ( max-width: 640px ) {

	.airlibre-choix__meta {
		display: flex;
		margin-left: 0;
	}
}
