/* ForLady Map widget – styly. Vše je pod .flmap, aby se nemíchalo se stránkou. */
.flmap {
  /* Firemní identita: #E51D77 základní, #EA6D92 / #F4B5C6 odvozené,
     #755B6F a #FBEBF2 doplňkové. Odstíny mimo manuál jsou jen ztmavení těchto. */
  --flmap-accent: #E51D77;
  --flmap-accent-dark: #B31259;
  --flmap-accent-mid: #EA6D92;
  --flmap-accent-light: #F4B5C6;
  --flmap-accent-soft: #FBEBF2;
  --flmap-plum: #755B6F;
  --flmap-text: #3A2E37;
  --flmap-muted: #755B6F;
  --flmap-border: #F2DCE6;
  --flmap-bg: #FFFFFF;
  --flmap-bg-alt: #FDF6F9;
  --flmap-radius: 10px;
  --flmap-sidebar: 324px;
  --flmap-height: 700px;
  --flmap-inset: 18px;        /* odsazení plovoucího panelu od krajů mapy */
  /* Místo dole pro atribuci Google: logo vlevo (~26 px) i spodní lišta s odkazem
     na podmínky (~22 px). Zakrývat se nesmí, vyžadují to licenční podmínky Maps. */
  --flmap-logo-gap: 66px;
  --flmap-glass: rgba(255, 255, 255, 0.33);
  --flmap-glass-edge: rgba(255, 255, 255, 0.34);
  --flmap-glass-fill: rgba(255, 255, 255, 0.5);    /* prvky uvnitř panelu */
  --flmap-glass-line: rgba(255, 255, 255, 0.45);
  --flmap-peek: 52px;         /* výška táhla = co je vidět ze zasunutého sheetu */
  --flmap-font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;

  position: relative;
  display: block;
  height: var(--flmap-height);
  min-height: 420px;
  overflow: hidden;
  font-family: var(--flmap-font);
  font-size: 15px;
  line-height: 1.45;
  color: var(--flmap-text);
  background: var(--flmap-bg);
  border: 1px solid var(--flmap-border);
  border-radius: 0;
  box-sizing: border-box;
}
.flmap *, .flmap *::before, .flmap *::after { box-sizing: border-box; }
.flmap button { font: inherit; color: inherit; cursor: pointer; }

/* ---------- panel ---------- */
.flmap__panel {
  position: absolute;
  z-index: 2;
  top: var(--flmap-inset);
  left: var(--flmap-inset);
  bottom: auto;
  /* Panel je vysoký podle obsahu – se zabalenými kategoriemi je nízký.
     Strop nechává dole místo na atribuci Google. */
  max-height: calc(100% - var(--flmap-inset) - var(--flmap-logo-gap));
  display: flex;
  flex-direction: column;
  width: var(--flmap-sidebar);
  overflow: hidden;                      /* ať obsah nepřeteče přes rádius */

  /* glass effect */
  background: var(--flmap-glass);
  border: 1px solid var(--flmap-glass-edge);
  border-radius: 16px;
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(7px);
  -webkit-backdrop-filter: blur(7px);
}
.flmap__head { padding: 14px 16px 10px; border-bottom: 1px solid var(--flmap-glass-line); }

.flmap__search { position: relative; }
.flmap__search input {
  width: 100%; padding: 10px 34px 10px 36px;
  font: inherit; color: inherit;
  background: var(--flmap-glass-fill);
  border: 1px solid var(--flmap-glass-edge);
  border-radius: 8px;
  box-sizing: border-box;
}
.flmap__search input::placeholder { color: var(--flmap-muted); opacity: .85; }
.flmap__search input:focus { outline: 2px solid var(--flmap-accent); outline-offset: -1px; background: #fff; }
.flmap__search-icon { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); color: var(--flmap-muted); pointer-events: none; display: flex; }
.flmap__search-clear {
  position: absolute; right: 6px; top: 50%; transform: translateY(-50%);
  width: 24px; height: 24px; display: none; align-items: center; justify-content: center;
  background: none; border: 0; border-radius: 50%; color: var(--flmap-muted);
}
.flmap__search-clear:hover { background: var(--flmap-glass-fill); }
.flmap.is-searching .flmap__search-clear { display: flex; }

.flmap__tools { display: flex; gap: 8px; margin-top: 10px; }
.flmap__btn {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 11px; font-size: 13.5px!important; text-transform: none!important;
  background: var(--flmap-glass-fill)!important; border: 1px solid var(--flmap-glass-edge); border-radius: 999px;
}
.flmap__btn:hover { border-color: var(--flmap-accent); color: var(--flmap-accent); }
.flmap__btn[disabled] { opacity: .55; cursor: default; }
.flmap__btn[hidden] { display: none; }
/* !important kvůli přebití stylů eshopu na .flmap__btn výše – bez něj by aktivní
   tlačítko zůstalo světlé a bílý text by na něm zmizel (stejně jako u chipů). */
.flmap__btn[aria-pressed="true"] { background: var(--flmap-accent)!important; border-color: var(--flmap-accent); color: #fff; }
.flmap__btn--ghost { border-color: transparent; color: var(--flmap-muted); margin-left: auto; }

/* ---------- filtry ---------- */
.flmap__filters { padding: 12px 16px; border-bottom: 1px solid var(--flmap-glass-line); background: rgba(255, 255, 255, 0.16); }
/* společný nadpis sekce – PRODUKTY i ODBORNÍCI */
.flmap__section-title {
  display: flex; align-items: baseline; justify-content: space-between; gap: 10px;
  margin: 0 0 8px; font-size: 12px; font-weight: 700; letter-spacing: .06em;
  text-transform: uppercase; color: var(--flmap-muted);
}
.flmap__section-title--list { margin: 0; padding: 13px 16px 9px; border-top: 1px solid var(--flmap-glass-line); }

.flmap__chips { display: flex; flex-wrap: wrap; gap: 6px; }
.flmap__chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 11px; font-size: 13.5px!important; text-transform: none!important;
  background: var(--flmap-glass-fill)!important; border: 1px solid var(--flmap-glass-edge); border-radius: 999px;
}
.flmap__chip:hover { border-color: var(--flmap-accent); }
.flmap__chip[aria-pressed="true"] { background: var(--flmap-accent)!important; border-color: var(--flmap-accent); color: #fff; }
.flmap__chip[data-empty="true"][aria-pressed="false"] { opacity: .4; }
.flmap__chip-count { font-size: 11.5px; opacity: .7; font-variant-numeric: tabular-nums; }

/* ---------- výsledky ---------- */
.flmap__count {
  font-size: 12px; font-weight: 600; letter-spacing: 0;
  text-transform: none; color: var(--flmap-muted); white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
/* Seznam je jediná pružná část panelu – hlavička, filtry a nadpis si drží výšku
   a nesrazí se, když panel narazí na strop. */
.flmap__handle,
.flmap__head,
.flmap__filters,
.flmap__section-title--list { flex: none; }
.flmap__list { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 0 8px 16px; }
.flmap__empty { padding: 24px 16px; color: var(--flmap-muted); text-align: center; }

.flmap__folder { margin: 4px 0; }
.flmap__folder-head {
  display: flex; align-items: center; gap: 8px; width: 100%;
  padding: 9px 8px; text-align: left;
  background: none; border: 0; border-radius: 8px; font-weight: 600;
}
.flmap__folder-head:focus { background: none!important; }
.flmap__folder-head:hover { background: rgba(255, 255, 255, 0.42); }
.flmap__folder-dot { width: 10px; height: 10px; border-radius: 50%; flex: none; }
.flmap__folder-label { flex: 1; font-size: 13.5px!important; text-transform: none!important; }
.flmap__folder-count { font-size: 12.5px; font-weight: 500; color: var(--flmap-muted); font-variant-numeric: tabular-nums; }
.flmap__folder-caret { transition: transform .15s ease; color: var(--flmap-muted); display: flex; }
.flmap__folder.is-open .flmap__folder-caret { transform: rotate(90deg); }
.flmap__folder-body { display: none; padding: 2px 0 6px; }
.flmap__folder.is-open .flmap__folder-body { display: block; }

.flmap__item {
  display: block; width: 100%; padding: 10px 10px 10px 26px; text-align: left; text-transform: none;
  background: none; border: 0; border-left: 3px solid transparent; border-radius: 0 8px 8px 0;
}
.flmap__item:focus { background: none!important; }
/* vybraná položka si zvýraznění drží i při focusu (po kliknutí zůstává zaostřená) */
.flmap__item.is-active,
.flmap__item.is-active:focus { background: rgba(251, 235, 242, 0.85)!important; }
.flmap__item:hover { background: rgba(255, 255, 255, 0.42); }
.flmap__item.is-active { background: rgba(251, 235, 242, 0.85); border-left-color: var(--flmap-accent); }
.flmap__item-name { font-weight: 600; }
.flmap__item-sub { font-size: 13px; color: var(--flmap-muted); }
.flmap__item-dist { font-size: 12.5px; color: var(--flmap-accent-dark); font-weight: 600; }
.flmap__item-tags { margin-top: 5px; display: flex; flex-wrap: wrap; gap: 4px; }
.flmap__tag { padding: 2px 7px; font-size: 11.5px; background: rgba(251, 235, 242, 0.8); color: var(--flmap-accent-dark); border-radius: 999px; }

/* ---------- mapa ---------- */
.flmap__map { position: absolute; inset: 0; background: var(--flmap-bg-alt); }
.flmap__map-canvas { position: absolute; inset: 0; }

.flmap__notice {
  position: absolute; inset: 0; z-index: 3;
  display: flex; align-items: center; justify-content: center; padding: 24px;
  text-align: center; color: var(--flmap-muted); background: var(--flmap-bg-alt);
}
.flmap__notice code { padding: 1px 5px; background: #fff; border: 1px solid var(--flmap-border); border-radius: 4px; font-size: 13px; }
.flmap__notice--error { color: #8E1538; }

.flmap__spinner {
  width: 26px; height: 26px; border: 3px solid var(--flmap-border);
  border-top-color: var(--flmap-accent); border-radius: 50%;
  animation: flmap-spin .8s linear infinite;
}
@keyframes flmap-spin { to { transform: rotate(360deg); } }

/* info window */
.flmap-iw { font-family: var(--flmap-font, sans-serif); max-width: 280px; color: #3A2E37; }
.flmap-iw__name { font-size: 15px; font-weight: 700; }
.flmap-iw__clinic { font-size: 13.5px; color: #755B6F; }
.flmap-iw__addr { margin-top: 6px; font-size: 13.5px; }
.flmap-iw__note { margin-top: 6px; font-size: 13px; color: #755B6F; }
.flmap-iw__tags { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 4px; }
.flmap-iw__tag { padding: 2px 7px; font-size: 11.5px; background: #FBEBF2; color: #B31259; border-radius: 999px; }
.flmap-iw__links { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 10px; font-size: 13.5px; }
.flmap-iw__links a { color: #B31259; font-weight: 600; text-decoration: none; }
.flmap-iw__links a:hover { text-decoration: underline; }

/* cluster bublina */
.flmap-cluster {
  display: flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; border-radius: 50%;
  background: #E51D77; color: #fff; font: 600 13px/1 var(--flmap-font, sans-serif);
  border: 3px solid rgba(255,255,255,.9); box-shadow: 0 2px 8px rgba(0,0,0,.25);
}

/* ---------- přepínač pro mobil ---------- */
.flmap__handle { display: none; }

/* Úzký layout: mapa je na celé ploše a filtr je nad ní jako bottom sheet se stejným
   sklem jako na desktopu. Výchozí stav je zasunutý – vidět je hlavně mapa a táhlo
   se šipkou nahoru. Kliknutím nebo swipem se sheet vysune a šipka se otočí dolů.
   Třídu is-narrow nasazuje widget podle šířky KONTEJNERU (ne okna), protože widget
   může být vložený do úzkého sloupce na širokém monitoru. */
.flmap.is-narrow { --flmap-height: 620px; --flmap-inset: 12px; display: block; }

.flmap.is-narrow .flmap__panel {
  top: auto;
  left: var(--flmap-inset);
  right: var(--flmap-inset);
  bottom: var(--flmap-logo-gap);
  width: auto;
  max-height: calc(100% - var(--flmap-inset) - var(--flmap-logo-gap));
  /* Roluje celý obsah sheetu, ne jen seznam odborníků – na malém displeji
     by z něj po odečtení hlavičky a filtrů zbyl nečitelný proužek. */
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  transition: max-height .28s ease;
}
/* Zasunutý stav: ze sheetu zůstane jen táhlo. Zkrácení (ne posun) proto, že posunutý
   sheet by se vysunul do mezery pro atribuci Google a zakryl logo. */
.flmap.is-narrow[data-view="map"] .flmap__panel {
  max-height: var(--flmap-peek);
  overflow: hidden;
}
@media (prefers-reduced-motion: reduce) {
  .flmap.is-narrow .flmap__panel { transition: none; }
}

/* seznam už nemá vlastní scroll, roluje se s celým panelem */
.flmap.is-narrow .flmap__list { flex: none; overflow: visible; min-height: 0; }

/* táhlo zůstává nahoře i při rolování */
.flmap.is-narrow .flmap__handle {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: var(--flmap-peek);
  padding: 0;
  border: 0;
  border-bottom: 1px solid var(--flmap-glass-line);
  color: #755b6f;
  touch-action: pan-y;
  /* Vysunutý sheet roluje pod táhlem, takže musí obsah krýt – jinak přes něj
     prosvítají jména odborníků. Zasunutý nemá co krýt a zůstane prosklený. */
  background: #ffffff85;
  backdrop-filter: blur(6px);
}
.flmap.is-narrow[data-view="map"] .flmap__handle { background: rgba(255, 255, 255, 0.5); }
.flmap.is-narrow .flmap__handle svg { transition: transform .28s ease; }
.flmap.is-narrow .flmap__handle[aria-expanded="true"] svg { transform: rotate(180deg); }
.flmap.is-narrow[data-view="map"] .flmap__handle { border-bottom: 0; }
@media (prefers-reduced-motion: reduce) {
  .flmap.is-narrow .flmap__handle svg { transition: none; }
}