/* Lounge finder (lounges/default.aspx, lounges/airport.aspx). */
.lf-page { max-width: 900px; }
.lf-page h1 { color: var(--blue-text,#1078b3); margin-bottom: 8px; }
.lf-sub { display: block; font-size: 15px; line-height: 1.4; color: #666; font-weight: normal; margin-top: 4px; }
/* The subtitle is a paragraph after the h1 (SEO fix 9, 2026-10-23), spaced as when it was inside it. */
.lf-page p.lf-sub { margin: -4px 0 8px; }
.lf-crumb { font-size: 13px; margin: 0 0 6px; }
.lf-lead { font-size: 16px; }
.lf-search { position: relative; max-width: 460px; margin: 14px 0; }
.lf-search label { display: block; font-size: 12px; font-weight: bold; color: #666; text-transform: uppercase; margin-bottom: 3px; }
.lf-search input { width: 100%; box-sizing: border-box; padding: 10px 12px; font-size: 16px; border: 2px solid #169fe6; border-radius: 6px; }
.lf-suggest { position: absolute; left: 0; right: 0; z-index: 50; list-style: none; margin: 2px 0 0; padding: 0; background: #fff; border: 1px solid #ccc; border-radius: 6px; box-shadow: 0 4px 14px rgba(0,0,0,0.15); }
/* #main in front: the site's "#main a" rule otherwise turns suggestions light blue and underlined. */
#main .lf-suggest li a, .lf-suggest li a { display: block; padding: 8px 12px; color: #222; text-decoration: none; font-size: 14px; }
/* base.css "a b" fades bold text in links to half opacity and normal weight. */
#main .lf-suggest li a b, .lf-suggest li a b { color: #0b4f7a; margin-right: 2px; opacity: 1; font-weight: bold; font-family: inherit; }
.lf-suggest li.on a, .lf-suggest li a:hover { background: #e3f2fd; }
.lf-chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 16px; }
.lf-chip { display: inline-flex; align-items: center; gap: 6px; border: 1px solid #ccc; background: #fff; border-radius: 16px; padding: 4px 10px; font-size: 13px; cursor: pointer; color: #333; }
.lf-chip.on { border-color: #169fe6; background: #e3f2fd; color: #0b4f7a; font-weight: bold; }
.lf-chip img.lf-al-logo { display: block; width: 18px !important; height: 18px !important; object-fit: contain; background: #fff; border-radius: 3px; }
.lf-chip .lf-card-ico { display: block; }
.lf-short { font-size: 13px; color: #555; margin-top: 4px; }
body.dark-mode .lf-short { color: #bbb; }
.lf-logo { width: 22px; height: 22px; vertical-align: middle; border-radius: 3px; background: #fff; }
.lf-badge { display: inline-block; color: #fff; font-size: 10px; font-weight: bold; letter-spacing: 0.5px; padding: 3px 5px; border-radius: 3px; vertical-align: middle; line-height: 1; }
/* Airport list: each row is one link, the code in a box, name over city and logos, the count at the right.
   css/base.css makes every img display:block, which stacked the logos one per line; .lf-marks puts them back in a row. */
.lf-airports { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 8px 14px; }
.lf-airports li { margin: 0; padding: 0; }
#main .lf-airports a.lf-ap, .lf-airports a.lf-ap { display: flex; align-items: center; gap: 12px; height: 100%; box-sizing: border-box; padding: 10px 12px; border: 1px solid #e3e7eb; border-radius: 8px; background: #fff; color: #222; text-decoration: none; }
#main .lf-airports a.lf-ap:hover, #main .lf-airports a.lf-ap:focus, .lf-airports a.lf-ap:hover { border-color: #169fe6; box-shadow: 0 1px 6px rgba(22,159,230,0.18); }
.lf-region h2 { color: #003a70; font-size: 18px; margin: 22px 0 8px; }
.lf-region:first-of-type h2 { margin-top: 6px; }
body.dark-mode .lf-region h2 { color: #4da6ff; }
.lf-code { flex: 0 0 auto; width: 52px; text-align: center; padding: 7px 0; border-radius: 6px; background: #e3f2fd; color: #0b4f7a; font-weight: bold; font-size: 16px; letter-spacing: 0.5px; }
.lf-ap-body { flex: 1 1 auto; min-width: 0; }
.lf-ap-name { display: block; font-size: 14px; font-weight: bold; line-height: 1.3; color: #222; }
.lf-ap-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin-top: 4px; }
.lf-city { color: #6b6b6b; font-size: 12px; }
.lf-marks { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px; }
.lf-marks .lf-logo { display: block; width: 18px; height: 18px; }
.lf-marks .lf-badge { font-size: 9px; padding: 3px 4px; }
.lf-n { flex: 0 0 auto; text-align: center; color: #6f6f6f; font-size: 11px; line-height: 1.1; }
.lf-n b { display: block; font-size: 18px; color: #0b7cc0; opacity: 1; font-weight: bold; font-family: inherit; }
/* #main: style.css "#main h2 { margin: 0 }" otherwise wins and the cards touch the rule. */
#main .lf-term h2 { font-size: 20px; margin: 22px 0 10px; border-bottom: 2px solid #169fe6; padding-bottom: 3px; }
.lf-group h3 { color: #555; font-size: 15px; margin: 10px 0 6px; }
.lf-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; }
/* A column, so the action row (.lf-card-acts, margin-top: auto) sits at the foot of every card in a grid row, whatever
   the card above it holds (owner, 2026-10-22: a card beside a taller one with a photo ended its buttons mid-card). */
.lf-card { border: 1px solid #e0e0e0; border-left: 5px solid #169fe6; border-radius: 6px; padding: 10px 12px; background: #fafcff; display: flex; flex-direction: column; }
.lf-card-head { display: flex; align-items: center; gap: 8px; font-size: 15px; }
.lf-where, .lf-hours { font-size: 13px; color: #444; margin-top: 5px; }
.lf-official { display: inline-block; margin-top: 7px; font-size: 13px; color: var(--blue-text,#1078b3); }
.lf-access-h { color: #003a70; font-size: 18px; margin-top: 26px; }
.lf-access { padding-left: 0; list-style: none; }
.lf-access li { margin: 8px 0; font-size: 14px; line-height: 1.5; }
.lf-note { font-size: 12px; color: #6b6b6b; margin-top: 22px; }
[hidden] { display: none !important; }
body.dark-mode .lf-sub, body.dark-mode .lf-city, body.dark-mode .lf-note { color: #aaa; }
body.dark-mode .lf-suggest { background: #222; border-color: #444; }
body.dark-mode #main .lf-suggest li a, body.dark-mode .lf-suggest li a { color: #e0e0e0; }
body.dark-mode #main .lf-suggest li a b, body.dark-mode .lf-suggest li a b { color: #4da6ff; }
body.dark-mode .lf-suggest li.on a, body.dark-mode .lf-suggest li a:hover { background: #1e2a36; }
body.dark-mode .lf-chip { background: #222; color: #ddd; border-color: #555; }
body.dark-mode .lf-chip.on { background: #1e2a36; color: #4da6ff; border-color: #4da6ff; }
body.dark-mode .lf-card { background: #1f1f1f; border-color: #333; }
body.dark-mode .lf-where, body.dark-mode .lf-hours { color: #ccc; }
body.dark-mode .lf-term h2, body.dark-mode .lf-access-h { color: #4da6ff; }
body.dark-mode .lf-group h3 { color: #bbb; }
body.dark-mode #main .lf-airports a.lf-ap, body.dark-mode .lf-airports a.lf-ap { background: #1f1f1f; border-color: #333; }
body.dark-mode .lf-ap-name { color: #e6e6e6; }
body.dark-mode .lf-code { background: #1e2a36; color: #4da6ff; }
body.dark-mode .lf-n { color: #aaa; }
body.dark-mode .lf-n b { color: #4da6ff; }
@media (max-width: 767px) {
    #main { width: 100% !important; margin-right: 0; }
    .lf-airports { grid-template-columns: 1fr; }
    .lf-cards { grid-template-columns: 1fr; }
    /* Phones: chips are 36px tap targets, small print is at least 12px (badges 10-11px, they sit in a row of logos). */
    .lf-chips { gap: 8px; }
    .lf-chip { min-height: 36px; padding: 6px 12px; font-size: 14px; }
    .lf-city { font-size: 13px; }
    .lf-n { font-size: 12px; }
    .lf-badge { font-size: 11px; }
    .lf-marks .lf-badge { font-size: 10px; }
    .lf-short, .lf-where, .lf-hours, .lf-official { font-size: 14px; }
    .lf-pin-btn { font-size: 14px; padding: 6px 0; }
    .lf-crumb, .lf-map-note, .lf-note { font-size: 13px; }
}
body.dark-mode .lf-search label { color: #bbb; }
/* Map (airports with pin positions). z-index 0 keeps Leaflet's panes under the site menu. */
.lf-map { position: relative; z-index: 0; height: 380px; border: 1px solid #ddd; border-radius: 8px; margin: 6px 0 4px; background: #e8ebee; }
.lf-map-note { font-size: 12px; color: #6b6b6b; margin: 0 0 8px; }
.lf-pin-btn { background: none; border: none; padding: 0; margin-left: 10px; color: var(--blue-text,#1078b3); font-size: 13px; text-decoration: underline; cursor: pointer; }
.lf-card.lf-flash { box-shadow: 0 0 0 3px #169fe6; transition: box-shadow 0.2s; }
body.dark-mode .lf-map { border-color: #444; }
body.dark-mode .lf-map-note { color: #aaa; }
body.dark-mode .lf-pin-btn { color: #4da6ff; }
/* Full screen map, as on the Flight Tracker (flights/css/tracker.css explains the z-index, dvh and safe areas). */
.lf-map.lf-map-full { position: fixed; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100vh; height: 100dvh; margin: 0; border: 0; border-radius: 0; z-index: 9000; }
html.lf-fs-open, html.lf-fs-open body { overflow: hidden; }
.leaflet-bar a.lf-fs-btn svg { display: block; }
.lf-fs-exit { display: none; }
@media (hover: none) and (pointer: coarse) {
    .lf-map.lf-map-full .lf-fs-exit { display: flex; align-items: center; justify-content: center; position: absolute; top: calc(10px + env(safe-area-inset-top, 0px)); left: calc(52px + env(safe-area-inset-left, 0px)); z-index: 1100; height: 40px; padding: 0 16px; border: 0; border-radius: 20px; background: rgba(30,30,30,0.88); color: #fff; font-size: 15px; font-weight: bold; font-family: inherit; box-shadow: 0 2px 8px rgba(0,0,0,0.3); cursor: pointer; white-space: nowrap; }
}
/* Find-me message, laid over the bottom of the map (lounge-map.js). */
.lf-locate-note { display: none; position: absolute; left: 10px; right: 10px; bottom: 24px; z-index: 1000; background: rgba(255,255,255,0.95); color: #222; font-size: 13px; padding: 8px 10px; border-radius: 6px; box-shadow: 0 1px 4px rgba(0,0,0,0.3); text-align: center; }
body.dark-mode .lf-locate-note { background: rgba(255,255,255,0.95); color: #222; }
/* Map buttons keep their daylight look in dark mode, as on the Flight Tracker (see flights/css/tracker.css). */
body.dark-mode .lf-map .leaflet-bar a { background: #fff !important; border-bottom-color: #ccc; }
body.dark-mode .lf-map .leaflet-bar a,
body.dark-mode .lf-map .leaflet-bar a span { color: #000; }
@media (max-width: 767px) { .lf-map { height: 300px; } }
/* Map label: a shared pin lists its lounges, then the location they share in smaller grey text (lounge-map.js). */
.leaflet-tooltip .lf-tip-gate { color: #666; font-size: 12px; }
/* Map labels wrap (Leaflet's default is one unbroken line, which ran off a phone-width map). */
.lf-map .leaflet-tooltip { white-space: normal; width: max-content; max-width: 230px; line-height: 1.35; }
.lf-map .leaflet-tooltip .lf-tip-item + .lf-tip-item { margin-top: 6px; padding-top: 6px; border-top: 1px solid #e3e7eb; }
/* Zoom buttons: the site's "#main a" rule turned the + and - blue and underlined (gcdc.css has the same fix). */
#main .lf-map .leaflet-bar a { color: #000; text-decoration: none; }
/* Who gets in: base.css makes every img a block, which put each logo on its own line above its name. */
.lf-access li .lf-logo { display: inline-block; width: 18px; height: 18px; margin-right: 2px; vertical-align: -3px; }
/* Map pins (lounge-map.js): the lounge's logo, or its badge for card lounges, in a white circle with a glow in the
   group colour (airport.aspx GroupColor; set inline). A number shows how many lounges share the pin. */
.lf-pin-wrap { background: none; border: 0; }
.lf-pin { position: absolute; left: 0; top: 0; transform: translate(-50%, -50%); box-sizing: border-box; width: 28px; height: 28px; border: 0; border-radius: 50%; background: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; }
#main .lf-map .lf-pin img { display: block; width: 18px !important; height: 18px !important; max-width: 18px !important; margin: 0; padding: 0; border: 0; object-fit: contain; }
.lf-pin.lf-pin-text { width: auto; min-width: 28px; height: 22px; border-radius: 11px; padding: 0 2px; }
.lf-pin-badge { display: block; color: #fff; font: bold 9px/1 Arial, sans-serif; letter-spacing: 0.3px; padding: 3px 4px; border-radius: 8px; white-space: nowrap; }
/* While the terminal map is drawn in dark mode the OSM tiles under it are dimmed (the layer fades them to 0.45 too). */
.lf-map .leaflet-tile-pane.lf-tiles-dim { filter: brightness(.55) contrast(.9); }
/* Lounge page: "On the map: Concourse B" under the map when the pin sits on a mapped lounge room. */
.lf-map-where { font-size: 13px; color: #444; margin: 0 0 8px; }
body.dark-mode .lf-map-where { color: #bbb; }
.lf-pin-n { position: absolute; top: -7px; right: -8px; min-width: 16px; height: 16px; box-sizing: border-box; padding: 0 3px; border-radius: 8px; background: #222; color: #fff; font: bold 10px/16px Arial, sans-serif; text-align: center; box-shadow: 0 0 0 1.5px #fff; }
/* Count in each filter pill: lounges on an airport page, airports on the finder. */
.lf-chip-n { min-width: 18px; padding: 1px 6px; border-radius: 9px; background: #eef1f4; color: #555; font-size: 11px; font-weight: bold; line-height: 16px; text-align: center; }
.lf-chip.on .lf-chip-n { background: #1078b3; color: #fff; }
body.dark-mode .lf-chip-n { background: #333; color: #ccc; }
body.dark-mode .lf-chip.on .lf-chip-n { background: #4da6ff; color: #111; }
/* Jump to a terminal (airport.aspx JumpNav); lounge-search.js hides a link whose section the filters empty. */
.lf-jump { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 16px 0 0; padding: 8px 0; background: #fff; }
.lf-jump-h { font-size: 12px; font-weight: bold; text-transform: uppercase; color: #666; margin-right: 2px; }
#main .lf-jump a { display: inline-block; padding: 5px 10px; border: 1px solid #cfe6f7; border-radius: 14px; background: #f3f9fe; color: #0b4f7a; font-size: 13px; font-weight: bold; text-decoration: none; }
#main .lf-jump a:hover, #main .lf-jump a:focus { border-color: #169fe6; background: #e3f2fd; }
/* A concourse inside a terminal: the letter only, a small round pill tucked after its terminal (FRA Terminal 1: A B C Z). */
#main .lf-jump a.lf-jump-c { min-width: 30px; box-sizing: border-box; padding: 5px 8px; margin-left: -2px; text-align: center; background: #fff; }
.lf-term, .lf-group { scroll-margin-top: 70px; }
body.dark-mode .lf-jump { background: #1a1a1a; }
body.dark-mode .lf-jump-h { color: #aaa; }
body.dark-mode #main .lf-jump a { background: #1e2a36; border-color: #335; color: #4da6ff; }
/* Phones: the fixed copy lounge-search.js shows once the row scrolls away; under the site menu (z-index 1001). */
.lf-jump.lf-jump-fixed { position: fixed; top: 0; left: 0; right: 0; z-index: 900; margin: 0; padding: 8px 16px; flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; box-shadow: 0 2px 8px rgba(0,0,0,0.2); }
.lf-jump-fixed a, .lf-jump-fixed .lf-jump-h { flex: 0 0 auto; }
.lf-jump.lf-jump-fixed { scrollbar-width: none; }
.lf-jump.lf-jump-fixed::-webkit-scrollbar { display: none; }
@media (max-width: 767px) {
    #main .lf-jump a { padding: 7px 12px; font-size: 14px; }
}
/* Related links under the lounge list (airport.aspx RelatedHtml): each airline's chart and calculator, the alliance
   pages, other airports in the region. #main: style.css "#main h2 { margin: 0 }" and the "#main a" colour. */
.lf-rel { margin-top: 26px; padding-top: 4px; border-top: 1px solid #e3e7eb; }
#main .lf-rel h2 { color: #003a70; font-size: 18px; margin: 14px 0 6px; }
#main .lf-rel h3 { color: #555; font-size: 15px; margin: 14px 0 6px; }
.lf-rel-list, .lf-rel-ap { list-style: none; padding: 0; margin: 0; }
.lf-rel-list li { margin: 0; padding: 5px 0; font-size: 14px; line-height: 1.5; border-bottom: 1px solid #f0f2f4; }
.lf-rel-list li:last-child { border-bottom: 0; }
.lf-rel-sep { color: #aaa; margin: 0 4px; }
.lf-rel-al { font-size: 14px; line-height: 1.6; margin: 10px 0 0; }
.lf-rel-h { font-size: 12px; font-weight: bold; text-transform: uppercase; color: #666; margin-right: 4px; }
.lf-rel-ap { display: flex; flex-wrap: wrap; gap: 6px; }
.lf-rel-ap li { margin: 0; }
#main .lf-rel-ap a { display: inline-block; padding: 5px 10px; border: 1px solid #cfe6f7; border-radius: 14px; background: #f3f9fe; color: #0b4f7a; font-size: 13px; text-decoration: none; }
#main .lf-rel-ap a:hover, #main .lf-rel-ap a:focus { border-color: #169fe6; background: #e3f2fd; }
body.dark-mode .lf-rel { border-top-color: #333; }
body.dark-mode #main .lf-rel h2 { color: #4da6ff; }
body.dark-mode #main .lf-rel h3, body.dark-mode .lf-rel-h { color: #bbb; }
body.dark-mode .lf-rel-list li { border-bottom-color: #2a2a2a; }
body.dark-mode .lf-rel-sep { color: #666; }
body.dark-mode #main .lf-rel-ap a { background: #1e2a36; border-color: #335; color: #4da6ff; }
@media (max-width: 767px) {
    .lf-rel-list li, .lf-rel-al { font-size: 15px; }
    .lf-rel-list li { padding: 8px 0; }
    #main .lf-rel-ap a { padding: 8px 12px; font-size: 14px; }
}

/* One lounge's page (lounges/lounge.aspx). */
.lf-facts { display: grid; grid-template-columns: max-content 1fr; gap: 8px 16px; margin: 16px 0; font-size: 15px; line-height: 1.45; }
.lf-facts dt { font-weight: bold; color: #555; }
.lf-facts dd { margin: 0; color: #222; }
.lf-facts-brand { display: inline-flex; align-items: center; gap: 6px; font-weight: bold; }
.lf-facts-short { display: block; font-size: 13px; color: #555; margin-top: 2px; }
#main a.lf-official-btn, a.lf-official-btn { display: inline-block; padding: 9px 16px; border-radius: 6px; background: #1078b3; color: #fff; font-weight: bold; text-decoration: none; }
#main a.lf-official-btn:hover, a.lf-official-btn:hover { background: #0d6aa0; }
.lf-map-one { height: 260px; }
#main .lf-others-h { font-size: 18px; margin: 22px 0 8px; }
.lf-others { list-style: none; margin: 0 0 12px; padding: 0; }
.lf-others li { display: flex; align-items: center; gap: 10px; padding: 7px 0; border-bottom: 1px solid #eef1f4; }
/* css/base.css makes every img display:block: .lf-o-marks keeps the brand mark and alliance logo in one row. */
.lf-o-marks { display: inline-flex; align-items: center; gap: 4px; flex: 0 0 auto; }
.lf-o-marks .lf-logo { display: block; }
.lf-o-marks img.lf-al-logo, .lf-card-head img.lf-al-logo { display: block; width: 20px !important; height: 20px !important; object-fit: contain; background: #fff; border-radius: 3px; }
.lf-o-where { display: block; font-size: 12px; color: #6b6b6b; }
/* The card titles on the airport page link to the lounge pages. */
#main .lf-card-head a { color: inherit; text-decoration: none; }
#main .lf-card-head a:hover, #main .lf-card-head a:focus { text-decoration: underline; }
/* Card action row (airport.aspx Card): a filled "Lounge details" button to the lounge page, then Official page and
   Show on map. White on #1078b3 is 4.8:1 (hover #0d6aa0 5.9:1), in both themes. */
.lf-card-acts { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin-top: auto; padding-top: 9px; }
.lf-card-acts .lf-official, .lf-card-acts .lf-pin-btn { margin: 0; }
#main a.lf-details-btn, a.lf-details-btn { display: inline-flex; align-items: center; min-height: 34px; box-sizing: border-box; padding: 6px 14px; border-radius: 6px; background: #1078b3; color: #fff; font-size: 13px; font-weight: bold; line-height: 1.2; text-decoration: none; }
#main a.lf-details-btn:hover, #main a.lf-details-btn:focus, a.lf-details-btn:hover { background: #0d6aa0; color: #fff; text-decoration: none; }
#main a.lf-details-btn:focus-visible { outline: 3px solid #169fe6; outline-offset: 2px; }
body.dark-mode #main a.lf-details-btn, body.dark-mode #main a.lf-details-btn:hover, body.dark-mode #main a.lf-details-btn:focus { color: #fff; }
body.dark-mode #main a.lf-details-btn:focus-visible { outline-color: #4da6ff; }
@media (max-width: 767px) {
    /* Phones: 44 px touch targets across the row. */
    #main a.lf-details-btn { min-height: 44px; padding: 8px 18px; font-size: 15px; }
    .lf-card-acts .lf-official, .lf-card-acts .lf-pin-btn { display: inline-flex; align-items: center; min-height: 44px; padding: 0; }
}
@media (max-width: 600px) { .lf-facts { grid-template-columns: 1fr; gap: 2px; } .lf-facts dd { margin-bottom: 8px; } }
body.dark-mode .lf-facts dt { color: #aaa; }
body.dark-mode .lf-facts dd { color: #e0e0e0; }
body.dark-mode .lf-facts-short, body.dark-mode .lf-o-where { color: #aaa; }
body.dark-mode .lf-others li { border-bottom-color: #333; }
body.dark-mode #main a.lf-official-btn, body.dark-mode #main a.lf-official-btn:hover { color: #fff; }
/* The map stays light in dark mode, but dark-mode.css turns every div and span pale: keep the label and credits dark. */
body.dark-mode .lf-map .leaflet-tooltip, body.dark-mode .lf-map .leaflet-tooltip div, body.dark-mode .lf-map .leaflet-control-attribution, body.dark-mode .lf-map .leaflet-control-attribution span { color: #222; }
body.dark-mode .lf-map .leaflet-tooltip .lf-tip-gate { color: #555; }
/* Locate and follow (lounge-map.js addLocate, 2026-10-16): the button turns blue while following; the visitor is a
   blue dot with a white ring, and an arrow round it points the way they face or walk. */
#main .lf-map .leaflet-bar a.lf-locate-btn { display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; font-size: 15px; background: #fff; color: #000; text-decoration: none; }
#main .lf-map .leaflet-bar a.lf-locate-btn.on, body.dark-mode #main .lf-map .leaflet-bar a.lf-locate-btn.on { background: #4285f4 !important; color: #fff; }
.lf-me { position: absolute; left: 0; top: 0; }
.lf-me-dot { position: absolute; left: -9px; top: -9px; width: 18px; height: 18px; box-sizing: border-box; border-radius: 50%; background: #4285f4; border: 3px solid #fff; box-shadow: 0 0 0 1px rgba(0,0,0,0.25), 0 1px 4px rgba(0,0,0,0.35); }
.lf-me-arrow { display: none; position: absolute; left: -20px; top: -20px; width: 40px; height: 40px; }
.lf-me-arrow::before { content: ""; position: absolute; left: 50%; top: 0; margin-left: -7px; border-left: 7px solid transparent; border-right: 7px solid transparent; border-bottom: 11px solid #4285f4; filter: drop-shadow(0 0 1px #fff) drop-shadow(0 0 1px #fff); }
/* Lounge Finder home: "Near me" under the search box (lounge-search.js initNear). */
.lf-near { margin-top: 8px; padding: 7px 12px; border: 1px solid #169fe6; border-radius: 6px; background: #fff; color: #1078b3; font-size: 14px; font-weight: bold; cursor: pointer; }
.lf-near:hover { background: #eef7fd; }
.lf-near[disabled] { opacity: 0.6; cursor: default; }
.lf-near-note { margin: 6px 0 0; font-size: 14px; color: #444; min-height: 0; }
.lf-near-note:empty { display: none; }
body.dark-mode .lf-near { background: #1e1e1e; color: #4da6ff; border-color: #4da6ff; }
body.dark-mode .lf-near:hover { background: #26323d; }
body.dark-mode .lf-near-note { color: #ccc; }
/* Lounge photo (lounge.aspx, Part 2): a 16:10 box with the photo cropped to fill it, the credit under it. */
.lf-photo { margin: 14px 0 18px; max-width: 760px; }
.lf-photo-frame { position: relative; aspect-ratio: 16 / 10; border-radius: 8px; overflow: hidden; background: #eef1f4; }
/* The whole photo is shown (contain); the spare space behind it is a blurred, slightly darkened copy of the same photo, scaled up so the blurred edges stay outside the box. */
/* height and max-width need !important: site.css sets #wrapper img { height: auto; max-width: 100% }, which outranks a class. */
.lf-photo-frame img { position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important; max-width: none !important; object-fit: contain; }
.lf-photo-frame img.lf-photo-bg { object-fit: cover; transform: scale(1.15); filter: blur(16px) brightness(0.85); }
.lf-photo-credit { margin-top: 5px; font-size: 12px; color: #666; }
/* No photos yet: a brand-tinted box with a camera, a line on why photos help, and the add button (lounge-photos.js
   moves #lfAddPhotos in) filled as a primary button. Text: #003a70 and #3d4a55 on #f0f7fc (10.6:1, 8.4:1); dark #e6e6e6 and #c4ccd4 on #15212c (13:1, 10:1). */
.lf-photo-none { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 12px; align-items: start; margin: 14px 0 18px; max-width: 760px; box-sizing: border-box; padding: 14px 16px; border: 1px solid #b9d9ef; border-radius: 8px; background: #f0f7fc; color: #3d4a55; font-size: 14px; }
.lf-photo-none > * { grid-column: 2; min-width: 0; }
.lf-photo-none > .lf-photo-none-ico { grid-column: 1; grid-row: 1 / span 3; color: #1078b3; margin-top: 1px; }
#main .lf-photo-none .lf-photo-none-text { margin: 0; color: #003a70; font-size: 16px; font-weight: bold; }
.lf-photo-none .lf-photo-none-why { margin: 3px 0 0; color: #3d4a55; font-size: 14px; line-height: 1.45; }
#main .lf-photo-none .lf-add { margin: 12px 0 0; }
#main .lf-photo-none .lf-add-btn { display: inline-flex; align-items: center; box-sizing: border-box; min-height: 40px; padding: 8px 18px; border: 1px solid #1078b3; background: #1078b3; color: #fff; font-size: 15px; text-decoration: none; }
#main .lf-photo-none .lf-add-btn:hover, #main .lf-photo-none .lf-add-btn:focus { background: #0d6aa0; border-color: #0d6aa0; color: #fff; text-decoration: none; }
#main .lf-photo-none .lf-add-btn[disabled] { background: #1078b3; border-color: #1078b3; }
#main .lf-photo-none .lf-add-btn:focus-visible { outline: 3px solid #169fe6; outline-offset: 2px; }
#main .lf-photo-none .lf-add-panel { background: #fff; }
body.dark-mode .lf-photo-none { background: #15212c; border-color: #2d4a63; color: #ccc; }
body.dark-mode .lf-photo-none > .lf-photo-none-ico { color: #4da6ff; }
body.dark-mode #main .lf-photo-none .lf-photo-none-text { color: #e6e6e6; }
body.dark-mode .lf-photo-none .lf-photo-none-why { color: #c4ccd4; }
body.dark-mode #main .lf-photo-none .lf-add-btn, body.dark-mode #main .lf-photo-none .lf-add-btn:hover, body.dark-mode #main .lf-photo-none .lf-add-btn:focus { color: #fff; }
body.dark-mode #main .lf-photo-none .lf-add-btn { background: #1078b3; border-color: #1078b3; }
body.dark-mode #main .lf-photo-none .lf-add-btn:hover, body.dark-mode #main .lf-photo-none .lf-add-btn:focus { background: #0d6aa0; border-color: #0d6aa0; }
body.dark-mode #main .lf-photo-none .lf-add-btn:focus-visible { outline-color: #4da6ff; }
body.dark-mode #main .lf-photo-none .lf-add-panel { background: #1e1e1e; }
@media (max-width: 767px) { #main .lf-photo-none .lf-add-btn { min-height: 44px; } }
/* Airport page card: a square thumbnail at the end of the card head. */
.lf-card-thumb { margin-left: auto; flex: none; line-height: 0; }
.lf-card-thumb img { width: 64px; height: 64px; border-radius: 8px; object-fit: cover; }
body.dark-mode .lf-photo-frame, body.dark-mode .lf-photo-thumb { background: #2a2a2a; }
body.dark-mode .lf-photo-frame img.lf-photo-bg { filter: blur(16px) brightness(0.7); }
body.dark-mode .lf-photo-credit { color: #aaa; }
/* Member photos (Part 3): the thumbnail strip under the large photo, and the "Add your photos" panel. */
.lf-photo-strip { display: flex; flex-wrap: wrap; gap: 6px; margin: -8px 0 16px; max-width: 760px; }
.lf-photo-thumb { box-sizing: border-box; width: 64px; height: 64px; padding: 0; border: 2px solid transparent; border-radius: 6px; background: #eef1f4; cursor: pointer; line-height: 0; overflow: hidden; }
.lf-photo-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.lf-photo-thumb.on { border-color: #169fe6; }
.lf-add { margin: 6px 0 22px; }
.lf-add-btn { display: inline-block; padding: 8px 14px; border: 1px solid #169fe6; border-radius: 6px; background: #fff; color: #1078b3; font-weight: bold; font-size: 14px; cursor: pointer; text-decoration: none; }
.lf-add-btn[disabled] { opacity: 0.5; cursor: default; }
.lf-add-note, .lf-add-guide, .lf-add-msg { font-size: 14px; color: #444; margin: 6px 0; }
.lf-add-panel { margin-top: 8px; padding: 12px; border: 1px solid #d5dde5; border-radius: 8px; max-width: 760px; }
.lf-add-item { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 8px 0; }
.lf-add-item img { width: 96px; height: 72px; object-fit: cover; border-radius: 4px; background: #eef1f4; }
.lf-add-kind, .lf-add-consent { font-size: 14px; color: #333; }
.lf-add-consent { display: block; margin: 10px 0; }
.lf-add-err { flex-basis: 100%; margin: 0; font-size: 13px; color: #c62828; }
body.dark-mode .lf-add-btn { background: #1e1e1e; color: #4da6ff; border-color: #4da6ff; }
body.dark-mode .lf-add-note, body.dark-mode .lf-add-guide, body.dark-mode .lf-add-msg, body.dark-mode .lf-add-kind, body.dark-mode .lf-add-consent { color: #ccc; }
body.dark-mode .lf-add-panel { border-color: #444; }
body.dark-mode .lf-add-err { color: #ff8a80; }
body.dark-mode .lf-photo-thumb.on { border-color: #4da6ff; }
body.dark-mode .lf-add-item img { background: #2a2a2a; }