/**
 * Ricerca voli e volo prenotato.
 *
 * Deliberatamente indipendente da Bootstrap: queste pagine stanno nel front-end
 * del sito, e non possiamo dare per scontato che il tema lo carichi.
 * Tutti i colori passano da variabili così un tema scuro può ridefinirle senza
 * riscrivere le regole.
 */

.wpvams-search {
	--wpv-bg:      #ffffff;
	--wpv-panel:   #f6f7f7;
	--wpv-border:  #dcdcde;
	--wpv-text:    #1d2327;
	--wpv-muted:   #646970;
	--wpv-accent:  #2271b1;
	--wpv-radius:  8px;

	color: var(--wpv-text);
	font-size: 15px;
	line-height: 1.45;
}

@media (prefers-color-scheme: dark) {
	.wpvams-search {
		--wpv-bg:     #1e1f21;
		--wpv-panel:  #2a2b2e;
		--wpv-border: #3c3f43;
		--wpv-text:   #e8e8e9;
		--wpv-muted:  #a7aaad;
	}
}

.wpvams-search * { box-sizing: border-box; }

.wpvams-empty {
	color: var(--wpv-muted);
	padding: 1.2em;
	text-align: center;
	margin: 0;
}

.wpvams-banner {
	background: var(--wpv-panel);
	border-left: 4px solid var(--wpv-accent);
	border-radius: var(--wpv-radius);
	padding: .75em 1em;
	margin-bottom: 1em;
}
.wpvams-banner a { margin-left: .6em; }

/* --- filtri ------------------------------------------------------------ */

.wpvams-filters {
	display: flex;
	flex-wrap: wrap;
	gap: .75em;
	align-items: flex-end;
	background: var(--wpv-panel);
	border: 1px solid var(--wpv-border);
	border-radius: var(--wpv-radius);
	padding: .9em 1em;
	margin-bottom: 1em;
}

.wpvams-filter { display: flex; flex-direction: column; min-width: 8.5em; }
.wpvams-filter-grow { flex: 1 1 12em; }
.wpvams-filter-check { justify-content: center; min-width: auto; }

.wpvams-filter label {
	font-size: .78em;
	text-transform: uppercase;
	letter-spacing: .04em;
	color: var(--wpv-muted);
	font-weight: 600;
	margin-bottom: .25em;
}

.wpvams-filter-check label {
	text-transform: none;
	letter-spacing: 0;
	font-size: .9em;
	color: var(--wpv-text);
	display: flex;
	align-items: center;
	gap: .4em;
	margin: 0;
}

.wpvams-filter input[type=text],
.wpvams-filter select {
	background: var(--wpv-bg);
	border: 1px solid var(--wpv-border);
	border-radius: 5px;
	color: var(--wpv-text);
	padding: .45em .6em;
	font: inherit;
	width: 100%;
}

.wpvams-filter input:disabled { opacity: .6; }
.wpvams-filter small { color: var(--wpv-muted); font-size: .75em; margin-top: .2em; }

/* --- corpo -------------------------------------------------------------- */

.wpvams-search-body {
	display: grid;
	grid-template-columns: 1fr 22em;
	gap: 1em;
	align-items: start;
}

@media (max-width: 860px) {
	.wpvams-search-body { grid-template-columns: 1fr; }
}

.wpvams-map-wrap {
	position: relative;
	border: 1px solid var(--wpv-border);
	border-radius: var(--wpv-radius);
	overflow: hidden;
}

#wpvams-search-map { height: 520px; }

@media (max-width: 860px) {
	#wpvams-search-map { height: 340px; }
}

.wpvams-map-legend {
	position: absolute;
	left: .6em;
	bottom: .6em;
	z-index: 500;
	display: flex;
	gap: .8em;
	background: rgba(255,255,255,.92);
	color: #1d2327;
	border-radius: 5px;
	padding: .35em .6em;
	font-size: .75em;
}
.wpvams-map-legend span { display: flex; align-items: center; gap: .3em; }
.wpvams-map-legend i {
	width: .7em; height: .7em; border-radius: 50%;
	display: inline-block; border: 1px solid #fff;
}

.wpvams-side { max-height: 520px; overflow-y: auto; }
@media (max-width: 860px) { .wpvams-side { max-height: none; } }

.wpvams-side-title {
	font-size: .78em;
	text-transform: uppercase;
	letter-spacing: .05em;
	color: var(--wpv-muted);
	margin: .2em 0 .6em;
}
.wpvams-side-hot { color: #00794b; }

/* --- schede volo -------------------------------------------------------- */

.wpvams-card {
	background: var(--wpv-bg);
	border: 1px solid var(--wpv-border);
	border-radius: var(--wpv-radius);
	padding: .65em .8em;
	margin-bottom: .5em;
	cursor: pointer;
	transition: border-color .12s, transform .12s;
}
.wpvams-card:hover { border-color: var(--wpv-accent); transform: translateY(-1px); }
.wpvams-card-taken { opacity: .55; }
.wpvams-card-mine  { border-left: 3px solid #bd8600; }

.wpvams-card-route {
	display: flex;
	align-items: baseline;
	gap: .4em;
	font-size: 1.05em;
}
.wpvams-card-route em {
	margin-left: auto;
	font-style: normal;
	font-size: .78em;
	color: var(--wpv-muted);
}
.wpvams-arrow { color: var(--wpv-muted); }

.wpvams-card-meta {
	display: flex;
	flex-wrap: wrap;
	gap: .4em;
	align-items: center;
	margin-top: .35em;
	font-size: .8em;
	color: var(--wpv-muted);
}

.wpvams-chip {
	display: inline-block;
	padding: .1em .5em;
	border-radius: 3px;
	color: #fff;
	font-weight: 600;
	font-size: .92em;
}

.wpvams-card-foot {
	display: flex;
	justify-content: space-between;
	margin-top: .4em;
	font-size: .82em;
}
.wpvams-card-type { color: var(--wpv-muted); }
.wpvams-card-net  { font-weight: 700; }

/* --- popup della mappa -------------------------------------------------- */

.wpvams-pop { font-size: 13px; min-width: 220px; }
.wpvams-pop-head {
	display: flex; justify-content: space-between; align-items: baseline;
	gap: .6em; margin-bottom: .1em;
}
.wpvams-pop-name { color: #646970; font-size: .9em; margin-bottom: .5em; }

.wpvams-pop-rows { display: grid; grid-template-columns: auto 1fr; gap: .15em .8em; margin: 0 0 .6em; }
.wpvams-pop-rows dt { color: #646970; }
.wpvams-pop-rows dd { margin: 0; text-align: right; font-weight: 600; }
.wpvams-pop-note { color: #646970; font-style: italic; }

/* --- pulsanti ----------------------------------------------------------- */

.wpvams-btn {
	background: var(--wpv-accent, #2271b1);
	color: #fff;
	border: 1px solid transparent;
	border-radius: 5px;
	padding: .5em 1em;
	font: inherit;
	font-weight: 600;
	cursor: pointer;
	width: 100%;
}
.wpvams-btn:hover:not(:disabled) { filter: brightness(1.1); }
.wpvams-btn:disabled { opacity: .6; cursor: default; }
.wpvams-btn-lg { padding: .7em 1em; font-size: 1.02em; margin-top: 1em; }
.wpvams-btn-ghost {
	background: transparent;
	color: var(--wpv-muted);
	border-color: var(--wpv-border);
}

/* --- modale di prenotazione --------------------------------------------- */

.wpvams-modal {
	position: fixed;
	inset: 0;
	z-index: 9999;
	background: rgba(0,0,0,.55);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1em;
}
.wpvams-modal[hidden] { display: none; }

.wpvams-modal-box {
	position: relative;
	background: var(--wpv-bg);
	border-radius: var(--wpv-radius);
	padding: 1.4em;
	width: 100%;
	max-width: 34em;
	max-height: 88vh;
	overflow-y: auto;
}

.wpvams-modal-close {
	position: absolute;
	top: .4em; right: .6em;
	background: none; border: 0;
	font-size: 1.6em; line-height: 1;
	color: var(--wpv-muted);
	cursor: pointer;
}

.wpvams-book-title { margin: 0 0 .2em; font-size: 1.15em; }
.wpvams-book-sub { color: var(--wpv-muted); font-size: .9em; margin-bottom: .8em; }
.wpvams-book-h4 {
	font-size: .78em; text-transform: uppercase; letter-spacing: .05em;
	color: var(--wpv-muted); margin: 1.1em 0 .5em;
}

.wpvams-book-why {
	list-style: none;
	margin: 0 0 .8em;
	padding: .5em .7em;
	background: var(--wpv-panel);
	border-radius: 5px;
	font-size: .84em;
}
.wpvams-book-why li { display: flex; justify-content: space-between; }
.wpvams-book-why .up   span { color: #00794b; font-weight: 600; }
.wpvams-book-why .down span { color: #d63638; font-weight: 600; }

.wpvams-blockers {
	background: rgba(214,54,56,.08);
	border-left: 3px solid #d63638;
	border-radius: 5px;
	padding: .7em .9em;
	margin-top: .8em;
}
.wpvams-blockers h4 { margin: 0 0 .4em; font-size: .95em; }
.wpvams-blockers ul { margin: 0; padding-left: 1.1em; }
.wpvams-blockers li { margin-bottom: .35em; }
.wpvams-blockers small { color: var(--wpv-muted); }

.wpvams-planes { display: flex; flex-direction: column; gap: .4em; }

.wpvams-plane {
	display: flex;
	gap: .6em;
	align-items: flex-start;
	border: 1px solid var(--wpv-border);
	border-radius: 6px;
	padding: .6em .8em;
	cursor: pointer;
}
.wpvams-plane:has(input:checked) { border-color: var(--wpv-accent); background: var(--wpv-panel); }
.wpvams-plane input { margin-top: .3em; }
.wpvams-plane-body { display: flex; flex-direction: column; gap: .1em; }
.wpvams-plane-reg { font-weight: 700; }
.wpvams-plane-reg em { font-style: normal; font-weight: 400; color: var(--wpv-muted); }
.wpvams-plane-load { font-size: .85em; color: var(--wpv-muted); }
.wpvams-plane-net  { font-size: .85em; font-weight: 600; }

.wpvams-blocked { margin-top: .7em; font-size: .85em; color: var(--wpv-muted); }
.wpvams-blocked summary { cursor: pointer; }
.wpvams-blocked ul { margin: .4em 0 0; padding-left: 1.1em; }

.wpvams-book-timeout { font-size: .82em; color: var(--wpv-muted); margin: .9em 0 0; }
.wpvams-book-error {
	background: rgba(214,54,56,.1);
	border-left: 3px solid #d63638;
	padding: .6em .8em;
	border-radius: 5px;
	margin-top: .9em;
	font-size: .9em;
}

/* --- scheda della tratta ------------------------------------------------ */

.wpvams-sd {
	--wpv-bg:     #ffffff;
	--wpv-panel:  #f6f7f7;
	--wpv-border: #dcdcde;
	--wpv-text:   #1d2327;
	--wpv-muted:  #646970;
	--wpv-accent: #2271b1;

	color: var(--wpv-text);
	font-size: 14px;
	line-height: 1.45;
}
.wpvams-sd * { box-sizing: border-box; }

.wpvams-sd-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1em;
	flex-wrap: wrap;
}
.wpvams-sd-cs    { font-weight: 700; font-size: 1.25em; margin-right: .7em; }
.wpvams-sd-route { font-size: 1.15em; letter-spacing: .05em; }
.wpvams-sd-airports { color: var(--wpv-muted); margin: .15em 0 .9em; }

.wpvams-sd-body {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
	gap: 1.1em;
	align-items: start;
}
@media (max-width: 800px) {
	.wpvams-sd-body { grid-template-columns: 1fr; }
}

.wpvams-sd-map {
	border: 1px solid var(--wpv-border);
	border-radius: 8px;
	overflow: hidden;
}
.wpvams-sd-map > div { height: 320px; }

.wpvams-sd-cols {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(13em, 1fr));
	gap: .3em 1.4em;
}

.wpvams-sd-block h4 {
	font-size: .72em;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--wpv-muted);
	margin: 0 0 .4em;
	padding-bottom: .25em;
	border-bottom: 1px solid var(--wpv-border);
}
.wpvams-sd-block + .wpvams-sd-block { margin-top: .2em; }

.wpvams-sd-row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: .8em;
	padding: .16em 0;
}
.wpvams-sd-k { color: var(--wpv-muted); white-space: nowrap; }
.wpvams-sd-v { text-align: right; font-weight: 600; }
.wpvams-sd-v small { font-weight: 400; color: var(--wpv-muted); }

.wpvams-bar {
	display: inline-block;
	width: 4em;
	height: 5px;
	border-radius: 3px;
	background: #e0e0e0;
	overflow: hidden;
	vertical-align: middle;
}
.wpvams-bar > span { display: block; height: 100%; }

.wpvams-sd-hint {
	font-size: .84em;
	color: var(--wpv-muted);
	margin: .5em 0 0;
}

.wpvams-sd-strip {
	display: flex;
	gap: .7em;
	align-items: baseline;
	margin-top: 1em;
}
.wpvams-sd-strip code {
	flex: 1;
	background: var(--wpv-panel);
	border-radius: 5px;
	padding: .45em .7em;
	font-size: .85em;
	word-break: break-all;
}

.wpvams-sd-note { color: var(--wpv-muted); margin: .7em 0 0; }

.wpvams-sd-actions {
	display: flex;
	align-items: center;
	gap: 1em;
	margin-top: 1.2em;
}
.wpvams-sd-actions .wpvams-btn { width: auto; min-width: 14em; }
.wpvams-sd-state { color: var(--wpv-muted); font-size: .9em; }

/* --- il mio volo -------------------------------------------------------- */

.wpvams-flight {
	background: var(--wpv-bg);
	border: 1px solid var(--wpv-border);
	border-radius: var(--wpv-radius);
	padding: 1.2em 1.4em;
	margin-bottom: 1em;
}

.wpvams-flight-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 1em;
	flex-wrap: wrap;
	margin-bottom: .6em;
}
.wpvams-flight-callsign { font-weight: 700; font-size: 1.2em; margin-right: .6em; }
.wpvams-flight-route { font-size: 1.1em; letter-spacing: .04em; }

.wpvams-flight-timer {
	background: var(--wpv-panel);
	border-radius: 5px;
	padding: .5em .8em;
	font-size: .9em;
	margin-bottom: .9em;
}
.wpvams-flight-timer.urgent {
	background: rgba(214,54,56,.1);
	border-left: 3px solid #d63638;
}

.wpvams-flight-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(9em, 1fr));
	gap: .8em 1.2em;
	margin-bottom: 1em;
}
.wpvams-k {
	display: block;
	font-size: .74em;
	text-transform: uppercase;
	letter-spacing: .05em;
	color: var(--wpv-muted);
	font-weight: 600;
}
.wpvams-v { display: block; font-size: 1.08em; font-weight: 600; }
.wpvams-v em { font-style: normal; font-weight: 400; color: var(--wpv-muted); }

.wpvams-flight-route-str code {
	display: block;
	background: var(--wpv-panel);
	border-radius: 5px;
	padding: .5em .7em;
	font-size: .85em;
	word-break: break-all;
	margin-top: .2em;
}
.wpvams-flight-note { color: var(--wpv-muted); font-size: .9em; margin: .8em 0 0; }

/* --- Piano di volo ------------------------------------------------------ */

.wpvams-ofp {
	background: var(--wpv-panel);
	border-radius: var(--wpv-radius);
	padding: .9em 1em;
	margin-top: 1em;
	font-size: .92em;
}
.wpvams-ofp-head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: .8em;
	margin-bottom: .6em;
}
.wpvams-ofp-head strong { color: var(--wpv-text); }
.wpvams-ofp-pdf { font-size: .88em; }

.wpvams-ofp-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(8em, 1fr));
	gap: .7em 1.2em;
	margin-bottom: .8em;
}
.wpvams-ofp-foot { color: var(--wpv-muted); font-size: .85em; margin: .6em 0 0; }
.wpvams-ofp-msg  { color: var(--wpv-muted); font-size: .88em; margin: 0 0 .6em; }
.wpvams-ofp-msg:empty { display: none; }

.wpvams-ofp .wpvams-btn { width: auto; }

/* Il pulsante e l'attesa si alternano: lo stato lo porta l'attributo sul
   contenitore, cosi' il JavaScript ne cambia uno solo invece di rincorrere
   le classi di ogni pezzo. */
.wpvams-ofp-wait {
	display: none;
	align-items: center;
	gap: .5em;
	color: var(--wpv-muted);
	font-size: .9em;
}
.wpvams-ofp[data-state="waiting"] .wpvams-ofp-go   { display: none; }
.wpvams-ofp[data-state="waiting"] .wpvams-ofp-wait { display: inline-flex; }
.wpvams-ofp[data-state="done"]    .wpvams-ofp-wait { display: none; }

.wpvams-spinner {
	width: 1em;
	height: 1em;
	border: 2px solid currentColor;
	border-right-color: transparent;
	border-radius: 50%;
	animation: wpvams-spin .7s linear infinite;
}
@keyframes wpvams-spin { to { transform: rotate(360deg); } }

/* Chi ha chiesto di ridurre le animazioni non deve vedersi girare una
   rotella addosso per dieci minuti. */
@media (prefers-reduced-motion: reduce) {
	.wpvams-spinner { animation-duration: 3s; }
}

.wpvams-ofp-fallback { display: inline-block; margin-left: .8em; font-size: .88em; }

.wpvams-flight-actions {
	display: flex;
	gap: .6em;
	flex-wrap: wrap;
	margin-top: 1.2em;
}
.wpvams-flight-actions .wpvams-btn { width: auto; flex: 1 1 12em; }