/*
* Leonardo - flight page (flight_show.html),
modern layout
 * everything is scoped under .lfs so the rest of leonardo is not affected
 */

.lfs {
	--lfs-ink: #1d2733;
	--lfs-muted: #637085;
	--lfs-line: #e3e8ef;
	--lfs-line-soft: #eef1f5;
	--lfs-bg: #f5f7fa;
	--lfs-card: #ffffff;
	--lfs-accent: #1b6bb5;
	--lfs-accent-dark: #124f89;
	--lfs-green: #1f9d55;
	--lfs-red: #d64545;

	box-sizing: border-box;
	width: 100%;
	max-width: 1320px;
	margin: 0 auto;
	padding: 4px 0 16px;
	text-align: left;
	color: var(--lfs-ink);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	font-size: 14px;
	line-height: 1.45;
}

.lfs *,
.lfs *::before,
.lfs *::after {
	box-sizing: border-box;
}

/* leonardo main_text forces Verdana + underline on every link */
.lfs td,
.lfs th,
.lfs div {
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
}

.lfs a:link,
.lfs a:visited,
.lfs a:active {
	color: var(--lfs-accent);
	text-decoration: none;
	font-weight: inherit;
}

.lfs a:hover {
	color: var(--lfs-accent-dark);
	text-decoration: underline;
}

/* the formatXXX() helpers wrap the values in coloured spans */
.lfs .time_style,
.lfs .altitude_style,
.lfs .speed_style,
.lfs .vario_style,
.lfs .score_type_style,
.lfs .distance_style {
	color: inherit;
	font-weight: inherit;
}

/* ---------------------------------------------------------------- header */

.lfs .lfs-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	flex-wrap: wrap;
	padding: 14px 18px;
	border-radius: 12px;
	background: linear-gradient(135deg, #17548f 0%, #2379c4 100%);
	color: #ffffff;
	box-shadow: 0 2px 8px rgba(23, 84, 143, 0.25);
}

.lfs .lfs-head-main {
	display: flex;
	align-items: center;
	gap: 12px;
	min-width: 0;
}

.lfs .lfs-cat {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	flex: none;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.95);
}

/* the category icon files are 3x size, so a bigger box stays sharp */
.lfs .lfs-cat img.icons1 {
	width: 26px;
	height: 26px;
}

.lfs .lfs-pilot-label {
	font-size: 12px;
	opacity: 0.8;
}

.lfs .lfs-pilot {
	font-size: 20px;
	font-weight: 700;
	line-height: 1.2;
}

.lfs .lfs-pilot a:link,
.lfs .lfs-pilot a:visited {
	color: #ffffff;
}

.lfs .lfs-pilot a:hover {
	color: #ffffff;
	text-decoration: underline;
}

.lfs .lfs-date {
	display: inline-block;
	margin-left: 10px;
	padding: 2px 10px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.18);
	font-size: 13px;
	font-weight: 600;
	vertical-align: middle;
}

.lfs .lfs-actions {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
}

/* owner / admin tools (start-stop time, edit, delete, db record) and the private / disabled marks */
.lfs .lfs-owner-icons {
	display: flex;
	align-items: center;
	gap: 2px;
	padding: 3px;
	border-radius: 10px;
	background: rgba(255, 255, 255, 0.96);
	box-shadow: 0 1px 3px rgba(9, 38, 66, 0.25);
}

.lfs .lfs-owner-icons:empty {
	display: none;
}

.lfs .lfs-owner-icons img {
	display: block;
	vertical-align: middle;
}

/* only marks the place where the start-stop popup opens */
.lfs .lfs-owner-icons #setBoundsPos {
	position: absolute;
}

.lfs .lfs-owner-icons .lfs-tool {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	flex: none;
	border-radius: 7px;
	color: var(--lfs-muted);
	text-decoration: none;
	transition: background-color 0.15s, color 0.15s;
}

.lfs .lfs-owner-icons a.lfs-tool-time { color: #1b6bb5; }
.lfs .lfs-owner-icons a.lfs-tool-edit { color: #0f8a5f; }
.lfs .lfs-owner-icons a.lfs-tool-delete { color: #d64545; }
.lfs .lfs-owner-icons a.lfs-tool-db { color: #6d3fc4; }

.lfs .lfs-owner-icons a.lfs-tool-time:hover { background: #e3effb; color: #124f89; }
.lfs .lfs-owner-icons a.lfs-tool-edit:hover { background: #def5ea; color: #0a6b49; }
.lfs .lfs-owner-icons a.lfs-tool-delete:hover { background: #fde4e4; color: #b42a2a; }
.lfs .lfs-owner-icons a.lfs-tool-db:hover { background: #ece5fb; color: #55309c; }

.lfs .lfs-owner-icons a.lfs-tool:focus-visible {
	outline: 2px solid var(--lfs-accent);
	outline-offset: 1px;
}

.lfs .lfs-owner-icons .lfs-tool-flag {
	cursor: help;
}

.lfs .lfs-owner-icons .lfs-tool-private {
	background: #fff4e0;
	color: #b45309;
}

.lfs .lfs-owner-icons .lfs-tool-disabled {
	background: #fde4e4;
	color: #b42a2a;
}

/* a small gap between the tools and the marks */
.lfs .lfs-owner-icons a.lfs-tool + .lfs-tool-flag {
	margin-left: 5px;
}

/* buttons */
.lfs a.lfs-btn,
.lfs a.lfs-btn:link,
.lfs a.lfs-btn:visited {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	height: 32px;
	padding: 0 12px;
	border: 1px solid var(--lfs-line);
	border-radius: 8px;
	background: #ffffff;
	color: var(--lfs-ink);
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
}

.lfs a.lfs-btn:hover {
	border-color: var(--lfs-accent);
	color: var(--lfs-accent);
	text-decoration: none;
}

.lfs .lfs-head a.lfs-btn,
.lfs .lfs-head a.lfs-btn:link,
.lfs .lfs-head a.lfs-btn:visited {
	border-color: rgba(255, 255, 255, 0.35);
	background: rgba(255, 255, 255, 0.14);
	color: #ffffff;
}

.lfs .lfs-head a.lfs-btn:hover {
	border-color: #ffffff;
	background: rgba(255, 255, 255, 0.26);
	color: #ffffff;
}

.lfs .lfs-btn svg {
	flex: none;
}

.lfs .lfs-btn .lfs-caret {
	width: 0;
	height: 0;
	border-left: 4px solid transparent;
	border-right: 4px solid transparent;
	border-top: 5px solid currentColor;
	opacity: 0.8;
}

/* flights imported from other servers */
.lfs .lfs-ext {
	margin-top: 10px;
	padding: 10px 14px;
	border: 1px solid #cfe3b4;
	border-radius: 10px;
	background: #f1f8e8;
}

/* ---------------------------------------------------------------- key figures */

.lfs .lfs-kpis {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 12px;
	margin-top: 14px;
}

.lfs .lfs-kpi {
	padding: 12px 16px;
	border: 1px solid var(--lfs-line);
	border-radius: 12px;
	background: linear-gradient(180deg, #ffffff 0%, #edf4fc 100%);
	box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}

/* the key figures lift a little under the mouse */
.lfs .lfs-kpi {
	transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.lfs .lfs-kpi:hover {
	transform: translateY(-4px);
	border-color: #a9c9ea;
	box-shadow: 0 10px 22px rgba(23, 84, 143, 0.16);
}

@media (prefers-reduced-motion: reduce) {
	.lfs .lfs-kpi {
		transition: none;
	}
	.lfs .lfs-kpi:hover {
		transform: none;
	}
}

.lfs .lfs-kpi-label {
	color: var(--lfs-muted);
	font-size: 13px;
	font-weight: 600;
}

.lfs .lfs-kpi-value {
	margin-top: 2px;
	font-size: 24px;
	font-weight: 700;
	line-height: 1.2;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.lfs .lfs-kpi-sub {
	margin-top: 2px;
	color: var(--lfs-muted);
	font-size: 12px;
}

.lfs .lfs-kpi-sub img {
	vertical-align: middle;
}

.lfs .lfs-kpi-score {
	border-color: #bcd6ef;
	background: linear-gradient(180deg, #f2f8fe 0%, #ffffff 100%);
}

.lfs .lfs-kpi-score .lfs-kpi-value {
	color: var(--lfs-accent-dark);
}

/* ---------------------------------------------------------------- detail cards */

.lfs .lfs-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 14px;
	align-items: stretch; /* the three columns share the height of the tallest (flight info) */
	margin-top: 14px;
}

.lfs .lfs-col {
	display: flex;
	flex-direction: column;
	gap: 14px;
	min-width: 0;
}

.lfs .lfs-card {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto; /* cards in a column split the column height */
	border: 1px solid var(--lfs-line);
	border-radius: 12px;
	background: var(--lfs-card);
	box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
	overflow: hidden;
}

/* the XC card: rows spread out and the footer links sit at the bottom */
.lfs .lfs-card > .lfs-row {
	flex: 1 0 auto;
}

.lfs .lfs-card > .lfs-card-foot {
	margin-top: auto;
}

/* left column: the timeline and the glider block centre vertically in their cards */
.lfs .lfs-card > .lfs-tl {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.lfs .lfs-card > .lfs-glider {
	flex: 1 1 auto;
	align-items: center;
	justify-content: center;
	text-align: center;
}

/* h3 has a global underlined brown style in style.css */
.lfs h3.lfs-card-title {
	display: flex;
	align-items: center;
	gap: 8px;
	clear: none;
	width: auto;
	margin: 0;
	padding: 11px 16px;
	border-bottom: 1px solid var(--lfs-line);
	background: #fafbfd;
	color: var(--lfs-ink);
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
}

.lfs h3.lfs-card-title::before {
	content: "";
	width: 4px;
	height: 14px;
	border-radius: 2px;
	background: var(--lfs-accent);
}

.lfs .lfs-row {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 12px;
	padding: 8px 16px;
	border-top: 1px solid var(--lfs-line-soft);
}

.lfs .lfs-row:first-of-type {
	border-top: none;
}

.lfs .lfs-row.lfs-sep {
	border-top-color: var(--lfs-line);
}

.lfs .lfs-label {
	color: var(--lfs-muted);
	min-width: 0;
}

.lfs .lfs-value {
	font-weight: 600;
	text-align: right;
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}

.lfs .lfs-value img {
	vertical-align: middle;
}

.lfs .lfs-speed {
	margin-left: 6px;
	color: var(--lfs-muted);
	font-size: 12px;
	font-weight: 500;
}

.lfs .lfs-score {
	font-size: 17px;
	color: var(--lfs-accent-dark);
}

/* xc card: the distances and the score stand out from the grey speeds next to them */
.lfs .lfs-xc .lfs-value {
	font-size: 18px;
	font-weight: 700;
	letter-spacing: -0.01em;
}

.lfs .lfs-xc .lfs-speed {
	margin-left: 8px;
	font-size: 12.5px;
	letter-spacing: 0;
}

.lfs .lfs-xc .lfs-score {
	font-size: 20px;
}

/* the score type is a text, not a figure */
.lfs .lfs-xc .lfs-value .score_type_style {
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0;
}

/* distance labels open an explanation image on hover */
.lfs .helpTooltips {
	display: inline;
	border-bottom: 1px dashed #aab4c3;
	text-decoration: none;
	cursor: help;
}

.lfs .lfs-card-foot {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	align-items: center;
	gap: 6px 14px;
	padding: 10px 16px;
	border-top: 1px solid var(--lfs-line);
	background: #fafbfd;
	font-size: 13px;
	text-align: right;
}

.lfs .lfs-card-foot img {
	vertical-align: middle;
}

/* "report wrong score" sits next to the optimisation link, separated by a thin bar */
.lfs .lfs-report {
	margin: 0;
	padding-left: 14px;
	border-left: 1px solid var(--lfs-line);
	font-size: 12px;
}

.lfs .lfs-report:first-child {
	padding-left: 0;
	border-left: 0;
}

/* takeoff -> landing timeline */
.lfs .lfs-tl {
	position: relative;
	padding: 14px 16px 6px 40px;
}

.lfs .lfs-tl::before {
	content: "";
	position: absolute;
	top: 22px;
	bottom: 30px;
	left: 21px;
	border-left: 2px dashed #c9d3df;
}

.lfs .lfs-tl-item {
	position: relative;
	padding-bottom: 12px;
}

.lfs .lfs-tl-item::before {
	content: "";
	position: absolute;
	top: 4px;
	left: -25px;
	width: 12px;
	height: 12px;
	border: 2px solid #ffffff;
	border-radius: 50%;
	background: var(--lfs-green);
	box-shadow: 0 0 0 1px var(--lfs-green);
}

.lfs .lfs-tl-end::before {
	background: var(--lfs-red);
	box-shadow: 0 0 0 1px var(--lfs-red);
}

.lfs .lfs-tl-top {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 8px;
}

.lfs .lfs-tl-label {
	color: var(--lfs-muted);
	font-size: 12px;
	font-weight: 600;
}

.lfs .lfs-tl-time {
	font-size: 16px;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}

.lfs .lfs-tl-place {
	margin-top: 2px;
	font-weight: 500;
	word-wrap: break-word;
}

.lfs .lfs-tl-place .attentionLink {
	margin-top: 4px;
}

/* glider: brand logo box on the left, name and category on the right */
.lfs .lfs-glider {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 16px;
}

.lfs .lfs-glider-logo {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: none;
	min-width: 104px;
	height: 64px;
	padding: 10px 14px;
	border: 1px solid var(--lfs-line);
	border-radius: 12px;
	background: linear-gradient(180deg, #ffffff 0%, #f3f7fb 100%);
}

.lfs .lfs-glider-logo:empty {
	display: none;
}

/* CL_brands.php sets a small size in the style attribute */
.lfs .lfs-glider-logo img.leo-brand-logo {
	max-width: 132px !important;
	max-height: 40px !important;
}

.lfs .lfs-glider-logo .leo-brand-text {
	max-width: 132px;
	border: 0;
	background: none;
	color: var(--lfs-ink);
	font-size: 15px;
	font-weight: 700;
}

.lfs .lfs-glider-info {
	min-width: 0;
	text-align: center;
}

.lfs .lfs-glider-name {
	font-size: 19px;
	font-weight: 700;
	line-height: 1.25;
	word-wrap: break-word;
}

.lfs .lfs-glider-cat {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 7px;
	padding: 3px 11px 3px 7px;
	border: 1px solid #d5e3f2;
	border-radius: 999px;
	background: #eef5fc;
	color: #2b4a6b;
	font-size: 12.5px;
	font-weight: 600;
	line-height: 20px;
	white-space: nowrap;
}

.lfs .lfs-glider-cat img {
	flex: none;
	vertical-align: middle;
}

/* admin / owner panel */
.lfs .lfs-admin {
	margin-top: 14px;
}

.lfs .lfs-admin-body {
	padding: 10px 16px;
	font-size: 13px;
	text-align: center;
}

.lfs .lfs-admin-body pre {
	margin: 6px 0;
	white-space: pre-wrap;
	font-size: 12px;
}

/* ---------------------------------------------------------------- tabs + map */

.lfs .lfs-map {
	margin-top: 18px;
	border: 1px solid var(--lfs-line);
	border-radius: 12px;
	background: var(--lfs-card);
	overflow: hidden;
	box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}

.lfs .lfs-tabbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 0 10px 0 6px;
	border-bottom: 1px solid var(--lfs-line);
	background: #fafbfd;
}

/* right side of the tab bar: map layer switches + full screen button */
.lfs .lfs-tabbar-tools {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
	justify-content: flex-end;
}

.lfs .lfs-layer-toggles {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.lfs .lfs-layer-toggle {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	height: 32px;
	padding: 0 11px;
	border: 1px solid var(--lfs-line);
	border-radius: 8px;
	background: #ffffff;
	color: var(--lfs-ink);
	font-size: 13px;
	font-weight: 600;
	white-space: nowrap;
	cursor: pointer;
	user-select: none;
}

.lfs .lfs-layer-toggle:hover {
	border-color: #c3cfdd;
	background: #f5f8fb;
}

.lfs .lfs-layer-toggle input {
	margin: 0;
	cursor: pointer;
}

/* the switches belong to the map: hidden on the other tabs and in full screen (the map has its own) */
.lfs .lfs-tabbar.lfs-no-map .lfs-layer-toggles {
	display: none !important;
}

.lfs ul.tabs {
	display: flex;
	float: none;
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
	border: none;
	list-style: none;
}

.lfs ul.tabs li {
	float: none;
	height: auto;
	margin: 0 0 -1px;
	padding: 0;
	border: none;
	background: none;
	line-height: normal;
	overflow: visible;
	cursor: pointer;
}

.lfs ul.tabs li a,
.lfs ul.tabs li a:link,
.lfs ul.tabs li a:visited {
	display: block;
	padding: 13px 16px 11px;
	border: none;
	border-bottom: 3px solid transparent;
	color: var(--lfs-muted);
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	outline: none;
}

.lfs ul.tabs li a:hover {
	background: none;
	color: var(--lfs-ink);
	text-decoration: none;
}

.lfs ul.tabs li.active a,
.lfs ul.tabs li.active a:hover {
	border-bottom-color: var(--lfs-accent);
	background: none;
	color: var(--lfs-accent);
}

.lfs .tab_container {
	float: none;
	clear: both;
	width: 100%;
	border: none;
	background: #ffffff;
	overflow: hidden;
}

.lfs .tab_content {
	padding: 0;
	font-size: 14px;
}

.lfs .collapsed {
	height: 1px;
	overflow: hidden;
}

.lfs .imgBox {
	float: left;
	width: auto;
	margin: 6px;
	padding: 4px;
	border: 1px solid var(--lfs-line);
	border-radius: 8px;
	background: #ffffff;
}

#tabphotos::after {
	content: "";
	display: block;
	clear: both;
}

/* full screen map: the map container is pinned to the window */
#gmaps_div.lfs-fs {
	position: fixed !important;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100% !important;
	height: 100% !important;
	z-index: 2147483000;
	background: #000000;
}

html.lfs-fs-on,
html.lfs-fs-on body {
	overflow: hidden !important;
}

.lfs-fs-exit {
	display: none;
	position: fixed;
	top: 10px;
	left: 50%;
	z-index: 2147483001;
	transform: translateX(-50%);
	align-items: center;
	gap: 6px;
	height: 34px;
	padding: 0 14px;
	border: none;
	border-radius: 999px;
	background: rgba(17, 24, 39, 0.85);
	color: #ffffff;
	font: 600 13px/34px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
	cursor: pointer;
}

.lfs-fs-exit:hover {
	background: rgba(17, 24, 39, 1);
}

html.lfs-fs-on .lfs-fs-exit {
	display: inline-flex;
}

/* ---------------------------------------------------------------- charts */

.lfs .lfs-charts {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
	margin-top: 14px;
}

.lfs .lfs-charts:empty {
	display: none;
}

.lfs .lfs-chart {
	padding: 8px;
	border: 1px solid var(--lfs-line);
	border-radius: 12px;
	background: #ffffff;
	text-align: center;
	box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}

.lfs .lfs-chart img {
	display: block;
	width: 100%;
	max-width: 600px;
	height: auto;
	margin: 0 auto;
}

/* ---------------------------------------------------------------- popups */

.dropBox {
	border: 1px solid #c9d3df !important;
	border-radius: 10px;
	background-color: #ffffff;
	box-shadow: 0 10px 30px rgba(16, 24, 40, 0.18);
	overflow: hidden;
}

.dropBox .infoBoxHeader {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	box-sizing: border-box;
	width: 100%;
	height: auto;
	margin: 0;
	padding: 8px 10px 8px 14px;
	border-top: none;
	background: #1d2733;
}

/* style.css floats the title, which collapses the header */
.dropBox .infoBoxHeader .title {
	display: block;
	float: none;
	clear: none;
	margin: 0;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
	font-size: 13px;
	line-height: 18px;
}

.dropBox .closeButton {
	float: none;
	flex: none;
	width: 22px;
	height: 22px;
	margin: 0;
	border-radius: 6px;
	background: none;
	color: #cbd5e1;
	font: 20px/22px Arial, sans-serif;
	text-align: center;
}

.dropBox .closeButton::before {
	content: "\00D7";
}

.dropBox .closeButton:hover {
	background: rgba(255, 255, 255, 0.15);
	color: #ffffff;
}

#geOptionsID {
	width: 310px;
	background-color: #ffffff;
}

#geOptionsID .content {
	padding: 10px 14px 12px;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
	font-size: 13px;
	line-height: 1.8;
}

#geOptionsID .content a {
	text-decoration: none;
}

#geOptionsID .content a:hover {
	text-decoration: underline;
}

/* ---------------------------------------------------------------- narrow windows */

@media (max-width: 1000px) {
	.lfs .lfs-kpis {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
	.lfs .lfs-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 700px) {
	.lfs .lfs-kpis {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	.lfs .lfs-grid,
	.lfs .lfs-charts {
		grid-template-columns: minmax(0, 1fr);
	}
	.lfs .lfs-kpi-value {
		font-size: 20px;
	}
}

/* "optimization details" link with the calculator icon */
.lfs a.lfs-optlink {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-weight: 600;
}

.lfs .lfs-ico {
	flex: none;
	vertical-align: middle;
}

/* google earth popup */
#geOptionsID {
	width: 320px;
}

#geOptionsID .geChoose {
	margin-bottom: 4px;
	font-weight: 600;
}

#geOptionsID .geNote {
	margin-top: 6px;
	color: #637085;
	font-size: 12px;
	line-height: 1.4;
}

/* download menu in the header */
.lfs .lfs-dl {
	position: relative;
}

.lfs .lfs-dl-menu {
	display: none;
	position: absolute;
	top: calc(100% + 6px);
	right: 0;
	z-index: 1500;
	width: 330px;
	padding: 6px;
	border: 1px solid var(--lfs-line);
	border-radius: 12px;
	background: #ffffff;
	box-shadow: 0 12px 32px rgba(16, 24, 40, 0.2);
}

.lfs .lfs-dl.open .lfs-dl-menu {
	display: block;
}

.lfs a.lfs-dl-item,
.lfs a.lfs-dl-item:link,
.lfs a.lfs-dl-item:visited {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 10px 12px;
	border-radius: 8px;
	color: var(--lfs-ink);
	text-decoration: none;
}

.lfs a.lfs-dl-item:hover {
	background: #f1f6fc;
	color: var(--lfs-ink);
	text-decoration: none;
}

.lfs .lfs-dl-item .lfs-ico {
	margin-top: 2px;
	color: var(--lfs-accent);
}

.lfs .lfs-dl-item b {
	display: block;
	font-size: 14px;
	font-weight: 600;
}

.lfs .lfs-dl-item small {
	display: block;
	margin-top: 1px;
	color: var(--lfs-muted);
	font-size: 12px;
	line-height: 1.35;
}

/* "new" badge on the 3d view button */
.lfs .lfs-head a.lfs-btn-3d,
.lfs .lfs-head a.lfs-btn-3d:link,
.lfs .lfs-head a.lfs-btn-3d:visited {
	border-color: #ffffff;
	background: #ffffff;
	color: var(--lfs-accent-dark);
}

.lfs .lfs-head a.lfs-btn-3d:hover {
	background: #eaf2fb;
	color: var(--lfs-accent-dark);
}

.lfs a.lfs-btn-3d {
	position: relative;
}

.lfs .lfs-new {
	position: absolute;
	top: -9px;
	right: -8px;
	padding: 1px 6px;
	border-radius: 999px;
	background: #fbbf24;
	color: #422006;
	font-size: 10px;
	font-weight: 700;
	line-height: 15px;
	box-shadow: 0 0 0 0 rgba(251, 191, 36, 0.7);
	animation: lfsNewPulse 2.4s ease-out infinite;
	pointer-events: none;
}

@keyframes lfsNewPulse {
	0% { box-shadow: 0 0 0 0 rgba(251, 191, 36, 0.7); }
	70% { box-shadow: 0 0 0 7px rgba(251, 191, 36, 0); }
	100% { box-shadow: 0 0 0 0 rgba(251, 191, 36, 0); }
}

@media (prefers-reduced-motion: reduce) {
	.lfs .lfs-new {
		animation: none;
	}
}
