/* css/map2.css (11.10.2026) — karttojen v2, pari js/map2.js:lle. Esikatselu ?uusi=1.
   DESIGN.md: 44 px kosketusalueet, sirut, ei liukuvarjoja. Arvio: org/finland-map/kartta-critique-2026-10-11. */

/* 1 Kosketusvihje: nakyy vain kun yhdella sormella yritetaan liikuttaa karttaa sivuttain */
.fm-map-tap-to-pan::after { display: none !important; }
.fm2-hint {
  position: absolute; left: 50%; top: 50%; z-index: 1100;
  transform: translate(-50%, -50%);
  max-width: calc(100% - 48px);
  padding: 12px 18px; border-radius: 999px;
  background: rgba(18, 36, 27, .88); color: #fff;
  font-size: .95rem; font-weight: 600; line-height: 1.3; text-align: center;
  pointer-events: none; opacity: 0;
  transition: opacity 160ms ease-out;
}
.fm2-hint.on { opacity: 1; }

/* 2 Koko naytto: kartan kehys peittaa naytön, napit tulevat mukana */
.fm2-fs {
  position: fixed !important; inset: 0 !important; z-index: 9000 !important;
  width: auto !important; height: auto !important; min-height: 0 !important; margin: 0 !important;
  background: var(--color-bg, #f7f8f6);
}
.fm2-fs #map { height: 100% !important; min-height: 0 !important; }
html.fm2-fs-on, html.fm2-fs-on body { overflow: hidden !important; }
/* Mobiilissa suodatinpaneeli aukeaa koko naytön kartan paalle; tietokoneella koko naytto = pelkka kartta */
@media (max-width: 992px) { html.fm2-fs-on .map-sidebar { z-index: 9600 !important; } }

/* 3 Karttataso: yksi kuvake, valikko vasemmalle */
.layer-control { display: none !important; }
.fm2-layers { position: relative; }
.fm2-layers-btn { display: flex !important; align-items: center; justify-content: center; color: #1d3a2a !important; cursor: pointer; }
.fm2-layers-menu {
  display: none; position: absolute; top: 0; right: calc(100% + 8px);
  min-width: 156px; padding: 4px;
  background: var(--color-bg-card, #fff); border: 1px solid var(--color-border, #dfe4df); border-radius: 10px;
  box-shadow: 0 6px 20px rgba(18, 36, 27, .14);
}
.fm2-layers.open .fm2-layers-menu { display: block; }
.fm2-layers-menu .layer-btn {
  display: flex; align-items: center; gap: 10px; width: 100%; min-height: 44px; padding: 0 12px;
  border: 0; border-radius: 8px; background: none; color: var(--color-text, #1f2a24);
  font: inherit; font-size: .92rem; font-weight: 500; text-align: left; cursor: pointer;
}
.fm2-layers-menu .layer-btn svg { width: 18px; height: 18px; flex-shrink: 0; }
.fm2-layers-menu .layer-btn:hover { background: #f0f3f0; }
.fm2-layers-menu .layer-btn.active { background: #e8f1ec; color: #1d3a2a; font-weight: 700; }

/* 8 Suodattimet- ja Reitti-nappi kartan sisaan (ennen kiinteat koko sivun paalla) */
.fab-mobile {
  position: absolute !important; left: 12px !important; bottom: 12px !important; z-index: 1001 !important;
  width: auto !important; height: 44px !important; padding: 0 16px 0 13px !important; gap: 8px; border-radius: 999px !important;
  font: inherit; font-size: .92rem; font-weight: 600;
}
.fab-mobile svg { width: 18px !important; height: 18px !important; }
.fab-mobile::after { content: 'Suodattimet'; }
html[lang="en"] .fab-mobile::after { content: 'Filters'; }
html[lang="sv"] .fab-mobile::after { content: 'Filter'; }
.fm-route-toggle.fm2-in-map { position: absolute !important; right: 12px !important; bottom: 22px !important; z-index: 1001 !important; }
@media (max-width: 992px) {
  .fm-route-toggle.fm2-in-map { width: 48px !important; min-width: 48px !important; height: 48px !important; padding: 0 !important; }
  .fm-route-toggle.fm2-in-map::after { content: none !important; }
}
/* Ennen kuin kategoriasivun kartta on avattu, kehyksessa on vain esikuva -> ei nappeja */
#map:has(> .fm-map-facade) ~ .fab-mobile,
#map:has(> .fm-map-facade) ~ .fm-route-toggle { display: none !important; }

/* 4 Tulokset: vain valtakunnallisella kartalla, ilman sisakkaista vieritysta */
.fm2-noresults { display: none !important; }
.results-list { max-height: none !important; overflow: visible !important; }
.result-item-thumb { overflow: hidden; }
.result-item-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.fm2-empty { padding: 12px 0; color: var(--color-text-light, #5b6660); font-size: .92rem; }
.fm2-more, .fm2-suball {
  display: block; width: 100%; min-height: 44px; margin-top: 10px;
  border: 1px solid var(--color-border, #dfe4df); border-radius: 999px; background: none;
  color: var(--color-text, #1f2a24); font: inherit; font-size: .92rem; font-weight: 600; cursor: pointer;
}
.fm2-more:hover, .fm2-suball:hover { border-color: #1d3a2a; }

/* 6 Kategoriaryhmat */
.fm2-group { border-bottom: 1px solid var(--color-border, #dfe4df); }
.fm2-group[hidden] { display: none; }
.fm2-group > summary {
  display: flex; align-items: center; gap: 10px; min-height: 48px;
  list-style: none; cursor: pointer; font-weight: 600; font-size: .98rem; color: var(--color-text, #1f2a24);
}
.fm2-group > summary::-webkit-details-marker { display: none; }
.fm2-gname { flex: 1; }
.fm2-gcount { color: var(--color-text-light, #5b6660); font-weight: 400; font-size: .86rem; font-variant-numeric: tabular-nums; }
.fm2-chev { color: var(--color-text-light, #5b6660); transition: transform 160ms ease-out; flex-shrink: 0; }
.fm2-group[open] > summary .fm2-chev { transform: rotate(180deg); }
.fm2-gbody { padding: 0 0 8px; }
.fm2-flat .fm2-group { border: 0; }
.fm2-flat .fm2-group > summary { display: none; }
.fm2-hide { display: none !important; }

/* Valinnat siruina */
.fm2-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 12px; }
.fm2-chips[hidden] { display: none; }
.fm2-chip {
  display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 12px 0 14px;
  border: 1px solid #1d3a2a; border-radius: 999px; background: #e8f1ec; color: #1d3a2a;
  font: inherit; font-size: .86rem; font-weight: 600; cursor: pointer;
}
.fm2-chip-more { font-size: .86rem; color: var(--color-text-light, #5b6660); }
.fm2-chips-clear {
  min-height: 44px; padding: 0 6px; border: 0; background: none; cursor: pointer;
  color: var(--color-text-light, #5b6660); font: inherit; font-size: .86rem; text-decoration: underline;
}

/* 7 Mobiilin suodatinpaneeli: koko naytto, otsikko + sulje, alhaalla "Nayta N kohdetta" */
.fm2-sheet-head, .fm2-sheet-foot { display: none; }
@media (max-width: 992px) {
  .map-sidebar { top: 0 !important; max-width: none !important; z-index: 9600 !important; padding-top: 0 !important; padding-bottom: 0 !important; }
  .fm2-sheet-head {
    display: flex; position: sticky; top: 0; z-index: 2; align-items: center; justify-content: space-between;
    min-height: 56px; margin: 0 -20px 16px; padding: 6px 8px 6px 20px;
    background: var(--color-bg, #f7f8f6); border-bottom: 1px solid var(--color-border, #dfe4df);
  }
  .fm2-sheet-head strong { font-size: 1.05rem; }
  .fm2-sheet-x {
    display: flex; align-items: center; justify-content: center; width: 44px; height: 44px;
    border: 0; border-radius: 50%; background: none; color: var(--color-text, #1f2a24); cursor: pointer;
  }
  .fm2-sheet-foot {
    display: block; position: sticky; bottom: 0; z-index: 2;
    margin: 16px -20px 0; padding: 12px 20px calc(12px + env(safe-area-inset-bottom, 0px));
    background: var(--color-bg, #f7f8f6); border-top: 1px solid var(--color-border, #dfe4df);
  }
  .fm2-sheet-go {
    width: 100%; min-height: 48px; border: 0; border-radius: 999px; cursor: pointer;
    background: #1d3a2a; color: #fff; font: inherit; font-size: 1rem; font-weight: 700;
  }
  html.fm2-sheet-on, html.fm2-sheet-on body { overflow: hidden !important; }
}

@media (prefers-reduced-motion: reduce) {
  .fm2-hint, .fm2-chev { transition: none; }
}

/* Korjaukset 1. tarkistuksesta */
.fm2-layers-menu .layer-btn span { display: inline !important; }
@media (max-width: 992px) {
  /* Paneelin otsikko sanoo jo "Suodattimet" */
  .fm2-sheet-head + .sidebar-section > h4:first-child,
  .fm2-sheet-head + .sidebar-section > .sidebar-section-title:first-child { display: none; }
}
#fm-result-count { display: block; margin-top: 4px; text-transform: none; letter-spacing: 0; font-size: .9rem; font-weight: 400; color: var(--color-text-light, #5b6660); }
@media (max-width: 992px) {
  .map-sidebar .sidebar-section { margin-bottom: 16px !important; padding-bottom: 16px !important; }
}
/* Luku 0 nakyvalla alueella: himmea mutta valittava */
.filter-item.fm2-zero { opacity: .5; }
.fm2-group.fm2-zero > summary { color: var(--color-text-light, #5b6660); }
/* Pienella kartalla tietoikkuna on lahes kartan levyinen: oikean ylakulman napit sen alle, jotta ikkunan X on painettavissa */
@media (max-width: 992px) { #map.fm2-popup-on .leaflet-top { z-index: 399; } }