/**
 * ANPCDEFP EU Map — [harta_retele] shortcode.
 * Hartă gri cu România evidențiată (vecinii sub mască, doar cu numele,
 * granițe subtile de județe), pin-uri moderne + clustere pie chart cu
 * tooltip, card de detalii andocat, panou de filtre glisant din stânga,
 * zoom dreapta-jos. Modelată după harta EU „European Union around me”.
 */

.eu-map {
    border: 1px solid var(--border-light, #e5e7eb);
    border-radius: var(--radius-lg, 12px);
    overflow: hidden;
    margin: 2rem 0;
}
/* isolation: toate z-index-urile interne (card detalii 1110, sidebar
   1120, panouri Leaflet ≤1000, pinuri 5000+) rămân închise în contextul
   de stivuire al hărții — altfel ar concura la nivel de pagină cu
   headerul sticky al temei (z-index 1000) și cardul ar pluti PESTE
   meniu la scroll. Harta ca întreg stă sub header, orice valori am
   folosi înăuntru. */
.eu-map__stage { position: relative; min-width: 0; isolation: isolate; }
.eu-map__canvas {
    height: var(--eu-map-h, 600px);
    min-height: 320px;
}

/* Grey basemap, like the EU map (EC-GISCO style) */
.eu-map .leaflet-tile-pane,
#eu-map-picker .leaflet-tile-pane {
    filter: grayscale(1) contrast(0.9) brightness(1.06);
}

/* ==================== Protecție contra stilurilor de conținut ====================
   Pe site harta stă în .prose/.entry-content, unde tema stilizează
   imaginile de articol (.prose img { margin: 1.5rem 0; cursor: zoom-in }).
   Tile-urile Leaflet sunt <img> — leaflet.css le resetează max-width/
   height, dar NU marginile: fiecare tile era împins 24px în jos, iar
   conturul țării și pinurile păreau decalate spre nord (doar pe site;
   în admin nu există .prose). Resetăm aici tot ce ar putea deplasa sau
   stiliza elementele interne ale hărții. */
.eu-map .leaflet-pane img,
.eu-map .leaflet-pane svg,
.eu-map .leaflet-pane canvas,
.contact-map .leaflet-pane img,
.contact-map .leaflet-pane svg,
.contact-map .leaflet-pane canvas {
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}
.eu-map .leaflet-tile,
.contact-map .leaflet-tile {
    cursor: inherit !important;
}

/* Etichetele proprii ale țărilor vecine (peste masca gri; tile-urile
   de sub mască au etichetele lor acoperite) — vezi addMask în ro-geo.js */
.ro-geo__country-label {
    background: none;
    border: none;
    text-align: center;
    font-family: var(--font-primary, sans-serif);
    font-size: 0.76rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: #a6adb8;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.9);
    white-space: nowrap;
    pointer-events: none;
}

/* ==================== Sidebar: panou glisant din STÂNGA, pliat implicit ==================== */
/* Layout pe coloană: header fix sus, lista de rețele scrollează singură —
   titlul și X-ul rămân mereu vizibile la scroll */
.eu-map__sidebar {
    position: absolute;
    top: 0; left: 0; bottom: 0;
    z-index: 1120; /* peste controalele Leaflet (1000) */
    width: 50%;
    min-width: 340px;
    max-width: 90%;
    background: #fff;
    box-shadow: 8px 0 28px rgba(0, 0, 0, 0.18);
    padding: 0;
    display: flex;
    flex-direction: column;
    transform: translateX(-105%);
    transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}
.eu-map__sidebar.is-open { transform: translateX(0); }
.eu-map__sidebar-head {
    flex: none;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
    padding: 18px 20px 14px;
    margin-bottom: 0;
    border-bottom: 1px solid var(--border-light, #e5e7eb);
    background: #fff;
}
.eu-map__sidebar-heading { min-width: 0; }

/* Butoanele de închidere — IDENTICE pe ambele panouri (rețele + detalii).
   Stil „ghost": fără fundal în repaus, fundalul apare doar la hover.
   Prefixul .eu-map le dă întâietate față de stilurile globale ale temei. */
.eu-map .eu-map__sidebar-close,
.eu-map .eu-map__sheet-close {
    width: 40px; height: 40px;
    flex: none;
    padding: 0;
    border: none;
    background: none;
    color: var(--text-primary, #1a1a2e);
    border-radius: 50%;
    cursor: pointer;
    display: grid;
    place-items: center;
    font-size: 1rem;
    line-height: 1;
    box-shadow: none;
    transition: background 0.15s ease;
}
.eu-map .eu-map__sidebar-close:hover,
.eu-map .eu-map__sheet-close:hover { background: var(--gray-100, #f4f4f5); }

/* Toggle button, STÂNGA-sus peste hartă */
.eu-map__filter-toggle {
    position: absolute;
    top: 12px; left: 12px;
    z-index: 910;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    padding: 0 16px;
    border: none;
    background: #fff;
    color: var(--text-primary, #1a1a2e);
    font-size: 0.88rem;
    font-weight: 700;
    border-radius: var(--radius-full, 9999px);
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.18);
    cursor: pointer;
    transition: background 0.15s ease;
}
.eu-map__filter-toggle:hover { background: var(--gray-100, #f4f4f5); }
.eu-map__filter-toggle i { color: var(--brand-primary, #440098); }
.eu-map__filter-toggle:focus-visible { outline: 3px solid var(--brand-primary, #440098); outline-offset: 2px; }
/* Prefixul .eu-map e obligatoriu: harta trăiește în .prose (conținutul
   paginii), iar .prose h2/h3/p ar împinge titlurile cu marginile lor */
.eu-map .eu-map__sidebar-title {
    font-family: var(--font-display, sans-serif);
    font-size: 1.1rem;
    font-weight: 800;
    margin: 0;
    line-height: 1.3;
}
.eu-map .eu-map__sidebar-sub {
    margin: 2px 0 0;
    font-size: 0.8rem;
    line-height: 1.4;
    color: var(--text-muted, #6b7280);
}
/* Lista de rețele — singura zonă care scrollează în panou */
.eu-map__filters {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 4px 20px 18px;
}

.eu-map__filter {
    display: flex;
    gap: 14px;
    align-items: flex-start; /* logo-ul sus, aliniat cu titlul, nu pe centru */
    padding: 16px 0;
    border-bottom: 1px solid var(--border-light, #e5e7eb);
    cursor: pointer;
    transition: background 0.15s ease;
}
.eu-map__filter:hover { background: rgba(0, 0, 0, 0.02); }
.eu-map__filter:last-child { border-bottom: none; }

/* Switch modern în locul checkbox-ului — starea e mai clară.
   Aliniat sus, pe rândul titlului (logo-ul și textul încep tot de sus). */
.eu-map__switch {
    position: relative;
    flex: none;
    margin-left: auto;
    align-self: flex-start;
    margin-top: 12px;
}
.eu-map__switch input {
    position: absolute;
    inset: 0;
    opacity: 0;
    margin: 0;
    cursor: pointer;
}
.eu-map__switch-knob {
    display: block;
    width: 40px;
    height: 22px;
    border-radius: 9999px;
    background: var(--gray-300, #d4d4d8);
    transition: background 0.18s ease;
    pointer-events: none;
}
.eu-map__switch-knob::after {
    content: '';
    position: absolute;
    top: 2px; left: 2px;
    width: 18px; height: 18px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
    transition: transform 0.18s ease;
}
.eu-map__switch input:checked + .eu-map__switch-knob { background: var(--brand-primary, #440098); }
.eu-map__switch input:checked + .eu-map__switch-knob::after { transform: translateX(18px); }
.eu-map__switch input:focus-visible + .eu-map__switch-knob {
    outline: 3px solid var(--brand-primary, #440098);
    outline-offset: 2px;
}

/* Logo în casetă fixă — toate rețelele au aceeași greutate vizuală,
   indiferent de proporțiile logo-ului */
.eu-map__filter-logobox {
    flex: none;
    margin-top: 2px; /* aliniat optic cu rândul titlului */
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    background: #fff;
    border: 1px solid var(--border-light, #e5e7eb);
    border-radius: 10px;
    overflow: hidden;
}
.eu-map__filter-logobox img {
    max-width: 38px;
    max-height: 38px;
    object-fit: contain;
}

.eu-map__filter-pin {
    flex: none;
    width: 13px; height: 13px;
    border-radius: 50%;
    border: 2px solid #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.25);
}
.eu-map__filter-pin--inline {
    width: 11px; height: 11px;
    border-width: 1.5px;
}

.eu-map__filter-body { min-width: 0; font-size: 0.9rem; line-height: 1.45; }
.eu-map__filter-title {
    display: flex;
    align-items: center;
    gap: 7px;
    flex-wrap: wrap;
}
.eu-map__filter-body strong { color: var(--text-primary, #1a1a2e); }
.eu-map__filter-count {
    color: var(--brand-primary, #440098);
    background: var(--brand-primary-100, #f1eafa);
    font-size: 0.72rem;
    font-weight: 700;
    padding: 1px 8px;
    border-radius: 9999px;
    white-space: nowrap;
}
/* Descrierea: maxim 3 rânduri, cu „Vezi mai mult” dace e mai lungă */
.eu-map__filter-desc {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    color: var(--text-muted, #6b7280);
    font-size: 0.8rem;
    line-height: 1.5;
    margin-top: 3px;
}
.eu-map__filter.is-expanded .eu-map__filter-desc {
    display: block;
    -webkit-line-clamp: unset;
    overflow: visible;
}
.eu-map .eu-map__filter-more {
    display: inline-block;
    margin-top: 3px;
    padding: 0;
    border: none;
    background: none;
    color: var(--brand-primary, #440098);
    font-size: 0.78rem;
    font-weight: 700;
    cursor: pointer;
}
.eu-map .eu-map__filter-more:hover { text-decoration: underline; }
.eu-map .eu-map__filter-more:focus-visible { outline: 2px solid var(--brand-primary, #440098); outline-offset: 2px; }

/* ==================== Pins, clusters & tooltip ====================
   Picătura are CONTUR ALB de 2px (desenat pe atribute în pinIcon(), din
   eu-map.js) plus umbră dublă aici: una strânsă, care lipește forma de
   hartă, și una largă, care o ridică deasupra ei. Conturul e ce ține
   pinul lizibil peste orice fundal și îl desparte de vecinii de aceeași
   culoare, la densitate mare.

   Cele patru stări folosesc semnale DIFERITE, ca să nu se confunde:
     normal      — contur + umbră dublă
     hover       — ÎNĂLȚIME (se ridică 2px, umbră mai adâncă)
     evidențiat  — CULOARE (halou mov), la hover pe un rezultat de căutare
     selectat    — înălțime mare + cerc colorat rămas la ancoră
   Dacă hover-ul și evidențierea ar folosi amândouă înălțimea, n-ai
   distinge pinul găsit de unul peste care a trecut întâmplător cursorul. */
.eu-map__pin { background: none; border: none; }
/* overflow: visible — conturul de 2px e centrat pe contur, deci iese 1px
   în afara formei, iar forma atinge deja marginea de sus a viewBox-ului
   (creștetul e la y=1). Fără asta, pinul apare retezat drept la vârf. */
.eu-map__pin svg {
    overflow: visible;
    filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.45)) drop-shadow(0 3px 6px rgba(0, 0, 0, 0.3));
    transition: transform 0.18s cubic-bezier(0.16, 1, 0.3, 1), filter 0.18s ease;
    transform-origin: bottom center;
}
/* transform-origin: bottom center — la mărire vârful rămâne pe loc, deci
   pinul crește în sus, fără să-și părăsească locația. */
.eu-map__pin:hover svg {
    transform: translateY(-2px) scale(1.12);
    filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.5)) drop-shadow(0 7px 13px rgba(0, 0, 0, 0.36));
}
/* Pinul selectat (cardul lui de detalii e deschis): se RIDICĂ vizibil ca să
   elibereze locația, iar acolo rămâne un cerc în CULOAREA REȚELEI, cu casing
   alb și inel care pulsează. Ridicarea e ce face cercul vizibil — altfel
   pinul l-ar acoperi. Culoarea vine din JS (`--eu-pin-color`, pusă de
   paintSelected din options.netColor); fallback pe mov dacă lipsește.
   Transformarea stă pe svg, nu pe containerul poziționat de Leaflet. */
.eu-map__pin.is-selected { z-index: 10000 !important; }
.eu-map__pin:not(.eu-map__pin--hq).is-selected svg {
    transform: translateY(-9px) scale(1.24);
    filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.5)) drop-shadow(0 10px 16px rgba(0, 0, 0, 0.4));
}
/* :not(.eu-map__pin--hq) peste tot mai jos — pastila sediului poartă aceeași
   clasă .eu-map__pin, dar are DEJA propriul ::after (punctul de locație).
   Fără excludere, regulile astea i-l suprascriu: punctul sare sub casetă,
   rămâne umplut ȘI capătă bordură, adică un hibrid. Vezi tratamentul ei
   separat, la secțiunea pastilei. */
.eu-map__pin:not(.eu-map__pin--hq).is-selected::before,
.eu-map__pin:not(.eu-map__pin--hq).is-selected::after {
    content: '';
    position: absolute;
    box-sizing: border-box;
    left: 50%;
    /* 39px = iconAnchor-ul din JS, adică punctul geografic REAL. Nu `100%`:
       marginea de jos a casetei e la 40px, iar vârful picăturii la 38,7px,
       deci cercul ar marca un loc în care nu se află nimic. */
    top: 39px;
    width: 18px;
    height: 18px;
    /* jumătate din lățimea reală — cu box-sizing: border-box, bordura e
       inclusă în cei 18px, deci -9px centrează exact pe vârful pinului */
    margin: -9px 0 0 -9px;
    border-radius: 50%;
    pointer-events: none;
}
.eu-map__pin:not(.eu-map__pin--hq).is-selected::before {
    background: var(--eu-pin-color, var(--brand-primary, #440098));
    border: 2.5px solid #fff;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.4);
}
.eu-map__pin:not(.eu-map__pin--hq).is-selected::after {
    border: 2.5px solid var(--eu-pin-color, var(--brand-primary, #440098));
    animation: eu-map-ping 1.7s cubic-bezier(0, 0, 0.2, 1) infinite;
}
/* scale 2.4 pe o bază de 18px ≈ aceeași amprentă ca inelul dinainte (12px
   × 3.4), ca inelul să nu înghită pinurile vecine la densitate mare */
@keyframes eu-map-ping {
    0% { transform: scale(0.9); opacity: 0.85; }
    80%, 100% { transform: scale(2.4); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
    .eu-map__pin:not(.eu-map__pin--hq).is-selected::after { animation: none; opacity: 0; }
}
.eu-map-admin-pin { background: none; border: none; }

/* ==================== Evidențiere la hover pe un rezultat de căutare ====================
   Arată UNDE e pe hartă rândul peste care stă cursorul în listă, fără
   pulsul rezervat punctului deschis. Tratament DIFERIT pe cele două
   forme, ca evidențierea să rămână discretă:
   — CLUSTERUL e deja un cerc, deci un inel concentric i se potrivește;
   — PINUL e o picătură: un inel cât tot pinul l-ar îngreuna, așa că
     primește un halou care îi urmează CONTURUL (drop-shadow pe forma
     SVG, nu un cerc) plus o mărire mică.
   :not(.is-selected) peste tot — punctul deschis are deja evidențierea
   lui și ar intra în conflict pe același ::after. */
.eu-map__pin.is-highlighted,
.eu-map__cluster.is-highlighted { z-index: 9000 !important; }

/* Pin: halou pe conturul picăturii, fără inel. Deliberat FĂRĂ ridicare —
   înălțimea e semnalul hover-ului; aici semnalul e culoarea. */
.eu-map__pin.is-highlighted:not(.is-selected) svg {
    transform: scale(1.12);
    filter:
        drop-shadow(0 0 1px var(--brand-primary, #440098))
        drop-shadow(0 0 6px rgba(68, 0, 152, 0.8))
        drop-shadow(0 3px 7px rgba(0, 0, 0, 0.3));
}
/* Ascunde inelul de puls cât timp pinul e și evidențiat, și selectat — cele
   două s-ar suprapune pe același ::after. :not(--hq) e obligatoriu: fără el,
   regula stinge PUNCTUL DE LOCAȚIE al pastilei sediului (are 0,2,1 față de
   0,1,1), deci sediul rămânea fără punct la hover pe rezultatul lui. */
.eu-map__pin:not(.eu-map__pin--hq).is-highlighted::after { display: none; }

/* Cluster: inel concentric, forma lui firească */
.eu-map__cluster.is-highlighted:not(.is-selected) svg {
    transform: scale(1.1);
    filter: drop-shadow(0 0 3px #fff) drop-shadow(0 4px 10px rgba(68, 0, 152, 0.45));
}
.eu-map__cluster.is-highlighted:not(.is-selected)::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    width: 100%;
    height: 100%;
    transform: translate(-50%, -50%) scale(1.3);
    border: 2.5px solid var(--brand-primary, #440098);
    border-radius: 50%;
    pointer-events: none;
}

/* Pastila sediului: doar o mărire mică — are deja identitate proprie */
.eu-map__hq-pill { transition: transform 0.15s ease; }
.eu-map__pin--hq.is-highlighted .eu-map__hq-pill { transform: scale(1.08); }
.eu-map__pin--hq.is-highlighted svg { filter: none; }
/* Selectată, pastila primește același puls ca pinurile, dar pe ::before —
   ::after e deja punctul ei de locație. Inelul e concentric CU PUNCTUL
   (centrul lui e la 4,5px deasupra marginii de jos, cât raza punctului),
   nu cu marginea casetei, altfel ar pulsa pe lângă el. */
.eu-map__pin--hq.is-selected::before {
    content: '';
    position: absolute;
    box-sizing: border-box;
    left: 50%;
    bottom: -4.5px;
    width: 18px;
    height: 18px;
    margin-left: -9px;
    border: 2.5px solid var(--brand-primary, #440098);
    border-radius: 50%;
    pointer-events: none;
    animation: eu-map-ping 1.7s cubic-bezier(0, 0, 0.2, 1) infinite;
}
/* Trebuie să vină DUPĂ regula de mai sus: aceeași specificitate (0,2,1), iar
   un @media nu adaugă specificitate — decide ordinea din fișier. */
@media (prefers-reduced-motion: reduce) {
    .eu-map__pin--hq.is-selected::before { animation: none; opacity: 0; }
}

/* ==================== Apariția simbolurilor la schimbarea vederii ====================
   Clusterele și pinurile se recreează la fiecare re-grupare; fără nimic,
   ele „pocnesc" pe hartă. Un fade+scale foarte scurt face schimbarea de
   nivel (județ → localitate → puncte) să pară o desfacere, nu o tăietură.
   Se aplică doar la schimbarea zoom-ului (clasa e pusă din JS), nu la
   panare — altfel simbolurile ar clipi la fiecare mișcare. */
@keyframes eu-map-appear {
    from { opacity: 0; transform: scale(0.82); }
    to   { opacity: 1; transform: scale(1); }
}
/* :not(...) — simbolul selectat sau evidențiat are deja o transformare a
   lui (mărire, inel); animația de apariție i-ar suprascrie transform-ul
   și l-ar face să clipească la fiecare zoom */
.eu-map--zooming .eu-map__cluster:not(.is-selected):not(.is-highlighted) svg,
.eu-map--zooming .eu-map__pin:not(.is-selected):not(.is-highlighted) svg,
.eu-map--zooming .eu-map__pin:not(.is-selected):not(.is-highlighted) .eu-map__hq-pill {
    animation: eu-map-appear 0.22s cubic-bezier(0.16, 1, 0.3, 1) both;
}

@media (prefers-reduced-motion: reduce) {
    .eu-map--zooming .eu-map__cluster svg,
    .eu-map--zooming .eu-map__pin svg,
    .eu-map--zooming .eu-map__hq-pill { animation: none; }
}

/* ==================== Pinul sediului ANPCDEFP (pastilă cu logo) ====================
   Aceeași pastilă mov cu logo alb ca pe harta de contact
   (.contact-map__pin din style.css), la scară de hartă cu multe pinuri.
   Coada și punctul de pe locație sunt pseudo-elemente. */
/* Containerul pastilei e un dreptunghi de 170x64, mult mai lat decât
   forma vizibilă: fără asta, „fura" click-urile pe toată suprafața lui,
   inclusiv pe colțurile transparente, iar pinurile de lângă sediu
   deveneau imposibil de selectat. Doar forma primește evenimente. */
.eu-map__pin--hq { text-align: center; }
/* selector mai specific decât `.leaflet-marker-icon.leaflet-interactive`
   din leaflet.css (0,2,0), altfel biblioteca repune pointer-events: auto */
.eu-map .leaflet-marker-icon.eu-map__pin--hq { pointer-events: none; }
.eu-map .eu-map__hq-pill { pointer-events: auto; cursor: pointer; }
.eu-map__pin--hq::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--brand-primary, #440098);
    box-shadow: 0 0 0 4px rgba(68, 0, 152, 0.2);
}
.eu-map__hq-pill {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 9px 18px;
    background: var(--brand-primary, #440098);
    border-radius: 9999px;
    box-shadow: 0 5px 14px rgba(0, 0, 0, 0.25);
    white-space: nowrap;
    transition: transform 0.15s ease;
    transform-origin: bottom center;
}
.eu-map__hq-pill::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 100%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 9px solid var(--brand-primary, #440098);
}
/* !important: stilurile globale de imagini ale temei și leaflet.css ar
   suprascrie altfel dimensiunea; filter forțează logo-ul ALB */
.eu-map .eu-map__hq-logo {
    display: block;
    height: 24px !important;
    width: auto !important;
    max-width: 130px !important;
    object-fit: contain;
    filter: brightness(0) invert(1);
}
.eu-map__hq-name {
    color: #fff;
    font-family: var(--font-display, 'Plus Jakarta Sans', sans-serif);
    font-weight: 800;
    font-size: 0.85rem;
}
.eu-map__pin--hq:hover .eu-map__hq-pill { transform: scale(1.05); }
.eu-map__pin--hq.is-selected .eu-map__hq-pill { transform: scale(1.12); }

/* Cluster: cerc / pie chart SVG generat în JS */
.eu-map__cluster { background: none; border: none; }
.eu-map__cluster svg {
    filter: drop-shadow(0 3px 8px rgba(0, 0, 0, 0.28));
    transition: transform 0.15s ease;
}
.eu-map__cluster:hover svg { transform: scale(1.08); }
.eu-map__cluster text {
    font-family: var(--font-display, 'Plus Jakarta Sans', sans-serif);
    font-size: 14px;
    font-weight: 800;
}

/* Etichete pentru țările vecine — doar numele, discret, ca pe hărțile EU */
.eu-map__country-label {
    display: grid;
    place-items: center;
    font-family: var(--font-primary, sans-serif);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #9ca3af;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.9);
    white-space: nowrap;
    pointer-events: none;
}

/* Zoom-ul Leaflet (dreapta-jos) — butoane rotunjite, fără chenar dur.
   text-decoration: none anulează sublinierea din .prose a (harta stă
   în conținutul paginii). */
.eu-map .leaflet-control-zoom {
    border: none !important;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.18) !important;
}
.eu-map .leaflet-control-zoom a {
    width: 38px;
    height: 38px;
    line-height: 38px;
    /* fundal explicit uniform pe toate trei (Acasă, +, −) */
    background: #fff;
    border: none;
    /* delimitator subțire între butoane */
    border-bottom: 1px solid var(--gray-200, #e5e7eb);
    color: var(--text-primary, #1a1a2e);
    font-weight: 600;
    text-decoration: none;
}
.eu-map .leaflet-control-zoom a:last-child { border-bottom: none; }
.eu-map .leaflet-control-zoom a:hover { background: var(--gray-200, #e5e7eb); color: var(--text-primary, #1a1a2e); }
/* butonul dezactivat (ex. zoom-out la vederea întreagă): același fundal
   alb ca restul — doar glifa se stinge; altfel părea singurul „cu fundal" */
.eu-map .leaflet-control-zoom a.leaflet-disabled {
    background: #fff;
    color: var(--gray-300, #d4d4d8);
    cursor: default;
}
.eu-map .leaflet-control-zoom a.leaflet-disabled:hover { background: #fff; color: var(--gray-300, #d4d4d8); }

.eu-map .leaflet-tooltip {
    font-family: var(--font-primary, sans-serif);
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--text-primary, #1a1a2e);
    background: #fff;
    border: 1px solid var(--border-light, #e5e7eb);
    border-radius: 8px;
    box-shadow: var(--shadow-md, 0 4px 6px -1px rgba(0,0,0,0.12));
    padding: 6px 10px;
}

/* ==================== Popup card (EU style) ==================== */
.eu-map__leaflet-popup .leaflet-popup-content-wrapper {
    border-radius: 12px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.18);
    padding: 0;
}
.eu-map__leaflet-popup .leaflet-popup-content {
    margin: 20px 22px;
    line-height: 1.5;
    min-width: 220px;
}
/* Big, touch-friendly close button, like the EU dark circle */
.eu-map__leaflet-popup .leaflet-popup-close-button {
    width: 44px !important;    height: 44px !important;
    top: 10px !important;
    right: 10px !important;
    border-radius: 50%;
    background: #3c3c3c !important;
    color: #fff !important;
    font-size: 18px !important;
    line-height: 44px !important;
    text-align: center;
    transition: background 0.2s ease;
}
.eu-map__leaflet-popup .leaflet-popup-close-button:hover { background: #000 !important; }

.eu-map__popup { font-family: var(--font-primary, sans-serif); }
.eu-map__popup-body { padding: 20px 22px 22px; }

/* Hero cu imagine (limbajul cardurilor echipei): poza pe toată lățimea
   cardului, gradient negru jos, numele + chip-ul rețelei peste ea */
.eu-map__popup-hero {
    position: relative;
    aspect-ratio: 16 / 9;
    max-height: 200px;
    background-size: cover;
    background-position: center 25%;
    background-color: var(--gray-100, #f4f4f5);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}
.eu-map__popup-hero-overlay {
    padding: 2.5rem 20px 14px;
    padding-right: 60px; /* loc pentru butonul de închidere */
    background: linear-gradient(
        to top,
        rgba(0, 0, 0, 0.9) 0%,
        rgba(0, 0, 0, 0.62) 55%,
        transparent 100%
    );
    display: flex;
    flex-direction: column;
    gap: 6px;
    align-items: flex-start;
}
.eu-map__popup--hero .eu-map__popup-title {
    color: #fff;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.45);
    margin: 0;
}
.eu-map__popup--hero .eu-map__popup-network { margin: 0; }

/* Prefixul .eu-map bate .prose h3 / .prose p (altfel titlul cardului
   primea margin-top 2rem și cădea sub butonul de închidere) */
.eu-map .eu-map__popup-title {
    font-family: var(--font-display, sans-serif);
    font-size: 1.15rem;
    font-weight: 800;
    line-height: 1.25;
    margin: 0 0 6px;
    color: var(--text-primary, #1a1a2e);
    padding-right: 40px; /* fără hero: titlul nu intră sub butonul de închidere */
}
.eu-map .eu-map__popup-network {
    display: block;
    font-size: 0.82rem;
    font-weight: 700;
    margin: 0 0 8px;
}
.eu-map .eu-map__popup-desc {
    font-size: 0.88rem;
    color: var(--text-secondary, #4a4a68);
    margin: 0 0 12px;
}
.eu-map__popup-rows { display: grid; gap: 10px; }
.eu-map__popup-row {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    font-size: 0.86rem;
    line-height: 1.45;
    color: var(--text-secondary, #4a4a68);
}
/* Iconițe în pastile mov deschis — același tratament ca formularele
   de pe pagina de carieră */
.eu-map__popup-ic {
    display: grid;
    place-items: center;
    width: 28px; height: 28px;
    border-radius: 8px;
    background: var(--brand-primary-100, #f1eafa);
    color: var(--brand-primary, #440098);
    font-size: 0.78rem;
}
.eu-map__popup-val { word-break: break-word; padding-top: 4px; }
/* Linkurile din card (email, telefon, web) — fără underline; tema pune
   underline global pe linkurile din .prose, îl anulăm aici explicit */
.eu-map .eu-map__popup-val a {
    color: var(--brand-primary, #440098);
    font-weight: 500;
    text-decoration: none;
    border-bottom: none;
    box-shadow: none;
}
.eu-map .eu-map__popup-val a:hover { color: var(--brand-primary-dark, #2d0066); }

/* ==================== Mobile ==================== */
@media (max-width: 860px) {
    .eu-map__canvas { height: 440px; }
    /* Popup must never exceed the viewport; Leaflet caps width via JS,
       the content scrolls internally past 300px */
    .eu-map__leaflet-popup .leaflet-popup-content {
        margin: 16px 16px;
        max-height: 300px;
        overflow-y: auto;
    }
}

@media (prefers-reduced-motion: reduce) {
    .eu-map__pin svg, .eu-map__cluster svg, .eu-map__filter { transition: none; }
}

/* ==================== EU-style tooltip (small card + arrow) ==================== */
.eu-map .leaflet-tooltip {
    font-family: var(--font-primary, sans-serif);
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--text-primary, #1a1a2e);
    background: #fff;
    border: none;
    border-radius: 10px;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
    padding: 8px 14px;
    white-space: nowrap;
}
.eu-map .leaflet-tooltip-top:before {
    border-top-color: #fff; /* keep the arrow white to match the card */
}

/* ==================== Copy-to-clipboard rows ==================== */
.eu-map__popup-row { position: relative; }
.eu-map__copy {
    flex: none;
    width: 30px; height: 30px;
    margin-left: 4px;
    border: none;
    background: var(--gray-100, #f4f4f5);
    color: var(--text-muted, #6b7280);
    border-radius: 6px;
    cursor: pointer;
    display: grid;
    place-items: center;
    font-size: 0.8rem;
    opacity: 0;
    transition: opacity 0.15s ease, background 0.15s ease, color 0.15s ease;
    align-self: center;
    justify-self: end;
}
.eu-map__popup-row { grid-template-columns: 26px minmax(0, 1fr) auto; }
.eu-map__popup-row:hover .eu-map__copy,
.eu-map__copy:focus-visible { opacity: 1; }
.eu-map__copy:hover { background: var(--brand-primary, #440098); color: #fff; }
.eu-map__copy.is-copied { opacity: 1; background: #2e7d32; color: #fff; }
/* Touch devices have no hover — keep the button visible */
@media (hover: none) {
    .eu-map__copy { opacity: 1; }
}

/* ==================== Mobile bottom sheet (EU pattern) ==================== */
/* Cardul închis stă ascuns prin atributul `hidden` — dar orice
   `display` setat de autor (flex-ul din varianta desktop) anulează
   `display: none`-ul implicit al atributului. Fără regula asta, cardul
   GOL ar rămâne permanent vizibil peste hartă. */
.eu-map__sheet[hidden] { display: none !important; }

.eu-map__sheet {
    position: absolute;
    left: 0; right: 0; bottom: 0;
    z-index: 1110; /* peste controalele Leaflet (1000) */
    background: #fff;
    border-radius: 14px 14px 0 0;
    box-shadow: 0 -10px 32px rgba(0, 0, 0, 0.25);
    padding: 0; /* padding-ul e pe __popup-body — hero-ul curge din margine în margine */
    max-height: 72%;
    overflow-y: auto;
    overscroll-behavior: contain;
}
.eu-map__sheet .eu-map__popup-hero { border-radius: 14px 14px 0 0; overflow: hidden; }
/* Poziția butonului de închidere pe cardul de detalii —
   aspectul e cel comun, definit lângă .eu-map__sidebar-close */
.eu-map .eu-map__sheet-close {
    position: absolute;
    top: 10px; right: 10px;
    z-index: 2;
}

/* ==================== Filtru pe județe (shortcode cu 1-2 rețele) ====================
   Panoul „Rețele” devine „Județe”: compact, doar județele cu puncte. */
.eu-map__sidebar--compact {
    width: 250px;
    min-width: 0;
}
.eu-map__sidebar--compact .eu-map__filters {
    padding: 6px 8px 10px;
}
.eu-map__cnty {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 6px 10px;
    border-radius: 8px;
    cursor: pointer;
    font-size: 0.9rem;
}
.eu-map__cnty:hover {
    background: var(--gray-100, #f4f4f5);
}
.eu-map__cnty input {
    flex: none;
    margin: 0;
    accent-color: var(--brand-primary, #440098);
}
.eu-map__cnty-name {
    flex: 1;
    font-weight: 600;
    color: var(--text-primary, #1a1a2e);
}
.eu-map__cnty-count {
    font-size: 0.76rem;
    font-weight: 600;
    color: var(--text-muted, #71717a);
    background: var(--gray-100, #f4f4f5);
    border-radius: 9999px;
    padding: 1px 8px;
}
.eu-map__cnty-all {
    display: block;
    margin: 4px 10px 8px;
    padding: 5px 12px;
    border: 1px solid var(--border-light, #e5e7eb);
    border-radius: 9999px;
    background: var(--white, #fff);
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--brand-primary, #440098);
    cursor: pointer;
}
.eu-map__cnty-all:hover {
    background: var(--gray-100, #f4f4f5);
}

/* ==================== Width variants ==================== */
/* [harta_retele width="full"] — full-bleed edge to edge */
.eu-map--full {
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    border-radius: 0;
    border-left: none;
    border-right: none;
}

/* ==================== Details card docked on desktop (EU pattern) ====================
   Înălțime FIXĂ, pe toată harta (aceeași margine sus și jos): la
   navigarea „N din M" între puncte, conținutul diferă de la un pin la
   altul — cu înălțime după conținut, cardul și butoanele săreau la
   fiecare pas. Flex pe coloană + margin-top:auto pe bara de navigare o
   țin lipită de marginea de jos și când conținutul e scurt; la
   conținut lung, cardul face scroll, iar bara rămâne sticky. */
@media (min-width: 641px) {
    .eu-map__sheet {
        left: auto;
        top: 14px; /* butonul „Rețele” e acum pe stânga — dreapta e liberă */
        right: 14px;
        bottom: 14px;
        width: 380px;
        max-width: calc(100% - 28px);
        max-height: none; /* înălțimea e fixată de top + bottom */
        border-radius: 14px;
        box-shadow: 0 14px 44px rgba(0, 0, 0, 0.28);
        padding: 0;
        display: flex;
        flex-direction: column;
    }
    .eu-map__sheet .eu-map__fan-nav { margin-top: auto; }
    .eu-map__sheet .eu-map__popup-hero { border-radius: 14px 14px 0 0; }
}

/* ==================== Legend (stânga-jos; zoom-ul e în dreapta) ==================== */
.eu-map__legend {
    position: absolute;
    left: 12px;
    right: 88px; /* până aproape de zoom controls — încap mai multe chip-uri pe rând */
    bottom: 24px;
    z-index: 890;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
/* Titlul rețelei (shortcode cu o singură rețea): înlocuiește chip-urile */
.eu-map__nettitle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid var(--border-light, #e5e7eb);
    border-radius: 9999px;
    padding: 6px 16px 6px 12px;
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.12);
}

.eu-map__nettitle-name {
    font-weight: 700;
    font-size: 14px;
    color: var(--text-primary, #1a1a2e);
}

.eu-map__nettitle-count {
    font-size: 12.5px;
    font-weight: 600;
    color: var(--text-secondary, #4a4a68);
    border-left: 1px solid var(--border-light, #e5e7eb);
    padding-left: 10px;
}

.eu-map__legend-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 32px;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid var(--border-light, #e5e7eb);
    border-radius: 9999px;
    padding: 4px 12px 4px 8px;
    font-family: var(--font-primary, sans-serif);
    font-size: 0.74rem;
    font-weight: 600;
    color: var(--text-primary, #1a1a2e);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.eu-map__legend-item:hover { background: #fff; border-color: var(--gray-300, #d4d4d8); }
.eu-map__legend-item.is-active {
    background: #1a1a2e;
    border-color: #1a1a2e;
    color: #fff;
}
.eu-map__legend-item--all { padding: 4px 14px; }
.eu-map__legend-item:focus-visible {
    outline: 3px solid var(--brand-primary, #440098);
    outline-offset: 2px;
}
.eu-map__legend-item .eu-map__legend-dot { pointer-events: none; }
.eu-map__legend-dot {
    width: 12px; height: 12px;
    border-radius: 50%;
    border: 2px solid #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
    flex: none;
}

/* ==================== Network label chip (tooltip + details card) ==================== */
.eu-map__net-chip {
    display: inline-block;
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 3px 10px;
    border-radius: 9999px;
    line-height: 1.4;
}
.eu-map__popup-network { margin-bottom: 10px; }

/* Tooltip: avatar (dacă există) + nume + oraș + chip-ul rețelei.
   Detaliile complete rămân în card — tooltip-ul e doar o privire. */
.eu-map .leaflet-tooltip {
    text-align: left;
    /* Leaflet pune nowrap implicit — numele lungi (universități…) ar
       întinde tooltip-ul cât jumătate de hartă */
    white-space: normal;
    /* Absolut-poziționat, lățimea „shrink-to-fit" poate coborî la
       min-content și rupea numele cuvânt cu cuvânt, pe verticală —
       max-content ține totul pe un rând până la max-width */
    width: max-content;
    max-width: 340px;
}
/* Chip-ul rețelei nu se frânge pe două rânduri („FORMATORI / AN") */
.eu-map .leaflet-tooltip .eu-map__net-chip { white-space: nowrap; }
/* Săgeata tooltipului, albă pe toate direcțiile (smartTooltip îl mută
   dedesubt / lateral lângă marginile hărții) */
.eu-map .leaflet-tooltip-bottom:before { border-bottom-color: #fff; }
.eu-map .leaflet-tooltip-left:before { border-left-color: #fff; }
.eu-map .leaflet-tooltip-right:before { border-right-color: #fff; }
.eu-map__tt {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 2px 0;
}
.eu-map__tt-avatar {
    flex: none;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
    object-position: center 25%;
    border: 2px solid var(--gray-100, #f4f4f5);
}
.eu-map__tt-main {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    min-width: 0;
}
.eu-map__tt-name {
    display: block;
    font-size: 0.86rem;
    line-height: 1.25;
}
.eu-map__tt-city {
    display: block;
    font-weight: 500;
    font-size: 0.74rem;
    color: var(--text-muted, #6b7280);
    line-height: 1.2;
}
.eu-map__tt .eu-map__net-chip {
    margin-top: 3px;
    font-size: 0.6rem;
    padding: 2px 8px;
}

/* ==================== Tooltip cluster (conținutul grupului) ====================
   Cluster de JUDEȚ: titlu = județul, rânduri = localitățile + numărul
   lor de puncte. Cluster de LOCALITATE: titlu = localitatea, rânduri =
   punctele. Layout pe GRID cu o singură linie per rând și elipsă — nu
   pe flex cu wrap, unde numele lungi și orașele se aliniau haotic în
   două coloane inegale. */
.eu-map .eu-map__cluster-tt { padding: 10px 14px; }
.eu-map__ct {
    display: block;
    min-width: 210px;
    max-width: 280px;
}
.eu-map__ct-title {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    padding-bottom: 6px;
    margin-bottom: 6px;
    border-bottom: 1px solid var(--border-light, #e5e7eb);
}
.eu-map__ct-title-name {
    font-size: 0.84rem;
    font-weight: 800;
    color: var(--text-primary, #1a1a2e);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.eu-map__ct-title-count {
    flex: none;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--text-muted, #6b7280);
}
.eu-map__ct-row {
    display: grid;
    grid-template-columns: 9px minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    padding: 2.5px 0;
    font-size: 0.82rem;
    line-height: 1.35;
}
.eu-map__ct-dot {
    width: 9px; height: 9px;
    border-radius: 50%;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08);
}
.eu-map__ct-dot--city { background: var(--gray-300, #d4d4d8); }
.eu-map__ct-name {
    font-weight: 600;
    color: var(--text-primary, #1a1a2e);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.eu-map__ct-count {
    justify-self: end;
    min-width: 22px;
    text-align: center;
    font-size: 0.7rem;
    font-weight: 700;
    color: var(--text-muted, #6b7280);
    background: var(--gray-100, #f4f4f5);
    border-radius: 9999px;
    padding: 1px 7px;
}
.eu-map__ct-more {
    display: block;
    margin-top: 5px;
    font-size: 0.74rem;
    font-weight: 700;
    color: var(--brand-primary, #440098);
}

/* Tooltip la hover pe suprafața unui județ (stratul interactiv) */
.eu-map__county-tip {
    display: flex;
    align-items: baseline;
    gap: 10px;
    white-space: nowrap;
}
.eu-map__county-tip strong {
    font-size: 0.84rem;
    font-weight: 800;
    color: var(--text-primary, #1a1a2e);
}
.eu-map__county-tip span {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--text-muted, #6b7280);
}

/* ==================== Navigare „N din M" în cardul de detalii ====================
   Apare când punctul deschis face parte dintr-un evantai (mai multe
   puncte pe aceleași coordonate). Bară de subsol: centrată, separator
   pe toată lățimea și STICKY — cardul (.eu-map__sheet) e containerul
   de scroll, deci la descrieri lungi conținutul se derulează, iar bara
   rămâne lipită de marginea de jos, mereu la vedere. Fundal opac, ca
   textul derulat să nu se vadă prin ea. */
.eu-map__fan-nav {
    position: sticky;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 10px 18px;
    margin-top: 6px;
    background: var(--white, #fff);
    border-top: 1px solid var(--border-light, #e5e7eb);
}
/* ghost: fundalul apare doar la hover, ca la butoanele de închidere */
.eu-map__fan-btn {
    flex: none;
    width: 34px; height: 34px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: none;
    color: var(--text-primary, #1a1a2e);
    display: grid;
    place-items: center;
    font-size: 0.85rem;
    cursor: pointer;
    transition: background 0.15s ease;
}
.eu-map__fan-btn:hover { background: var(--gray-100, #f4f4f5); }
.eu-map__fan-btn:focus-visible { outline: 3px solid var(--brand-primary, #440098); outline-offset: 2px; }
.eu-map__fan-count {
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--text-muted, #6b7280);
    white-space: nowrap;
}

@media (max-width: 640px) {
    /* ---------- Hartă mai înaltă cât timp cardul de detalii e deschis ----------
       Bottom sheet-ul acoperă partea de jos a hărții — fără compensare,
       din hartă rămânea o fâșie îngustă și pinul selectat stătea ascuns
       sub card. Cât timp un card e deschis: canvas-ul crește (~76% din
       ecran), cardul e plafonat la 55% din hartă (conținutul lung face
       scroll sub bara sticky), iar JS aduce pinul în mijlocul fâșiei
       vizibile (panIntoVisible în eu-map.js) — hartă utilă garantată
       ~45% din canvas. */
    .eu-map--sheet-open .eu-map__canvas {
        height: min(76vh, 600px);
        height: min(76svh, 600px);
    }
    /* pagina-template cu harta pe tot ecranul e deja destul de înaltă —
       nu o modificăm (regula de sus ar bate-o, având specificitate mai
       mare decât .harta-hero .eu-map__canvas din style.css) */
    .harta-hero .eu-map--sheet-open .eu-map__canvas {
        height: max(560px, calc(90vh - 1px));
        height: max(560px, 90svh);
    }
    .eu-map--sheet-open .eu-map__sheet { max-height: 55%; }

    /* Pe mobil zoom-ul se face din degete — butoanele doar aglomerează */
    .eu-map .leaflet-control-zoom { display: none; }
    /* Zoom-ul e ascuns pe mobil, deci chip-urile pot merge până la margine */
    .eu-map__legend { left: 12px; right: 12px; bottom: 34px; }
    /* 50% ar fi prea îngust pe telefon */
    .eu-map__sidebar { width: 90%; min-width: 0; }
}


/* Butonul „Acasă" din bara de zoom — aceeași pastilă ca +/−, cu glifă FA */
.eu-map .leaflet-control-zoom-home i {
    font-size: 12px;
    line-height: 30px;
    color: #1a1a2e;
}
.eu-map .leaflet-control-zoom-home:hover i {
    color: var(--brand-primary, #440098);
}


/* ==================== CĂUTARE PERSOANE (stânga-sus, lângă filtre) ==================== */
/* Butonul are EXACT stilul pastilei de filtre; poziția pe orizontală o
   setează JS-ul (după lățimea reală a butonului de filtre) */
.eu-map__search-toggle {
    position: absolute;
    top: 12px; left: 140px; /* fallback; JS recalculează */
    z-index: 910;
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    padding: 0;
    border: none;
    background: #fff;
    color: var(--text-primary, #1a1a2e);
    border-radius: var(--radius-full, 9999px);
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.18);
    cursor: pointer;
}
.eu-map__search-toggle i { color: var(--brand-primary, #440098); font-size: 0.85rem; }
.eu-map__search-toggle:hover { background: var(--gray-100, #f4f4f5); }

/* Caseta desfășurată acoperă zona butoanelor din stânga-sus */
.eu-map__search-box {
    position: absolute;
    top: 12px; left: 12px;
    z-index: 930;
    display: flex;
    align-items: center;
    gap: 8px;
    width: min(360px, calc(100% - 24px));
    min-height: 44px;
    padding: 0 12px;
    background: #fff;
    border-radius: 22px;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.22);
}
.eu-map__search-box[hidden] { display: none; }
.eu-map__search-ico { color: var(--brand-primary, #440098); font-size: 0.85rem; flex: none; }
/* Selector întărit + reseturi explicite: în previzualizarea din wp-admin,
   stilurile de formulare ale adminului (border, padding, min-height,
   focus albastru pe input[type=text]) băteau clasa simplă */
.eu-map input.eu-map__search-input {
    flex: 1;
    min-width: 0;
    border: none;
    outline: none;
    box-shadow: none;
    background: transparent;
    padding: 0;
    margin: 0;
    min-height: 0;
    line-height: 1.4;
    font: inherit;
    font-size: 0.9rem;
    color: var(--text-primary, #1a1a2e);
}
.eu-map input.eu-map__search-input:focus {
    border: none;
    outline: none;
    box-shadow: none;
    background: transparent;
}
/* Contorul de rezultate din input, cu divider spre X */
.eu-map__search-count {
    flex: none;
    font-size: 0.76rem;
    font-weight: 600;
    color: var(--text-muted, #6b7280);
    white-space: nowrap;
    padding-right: 10px;
    margin-right: 2px;
    border-right: 1px solid var(--gray-200, #e5e7eb);
}
.eu-map__search-count[hidden] { display: none; }

.eu-map__search-clear {
    flex: none;
    width: 28px; height: 28px;
    display: grid;
    place-items: center;
    border: none;
    border-radius: 50%;
    /* fără fundal în repaus — pastila X apare doar la hover */
    background: transparent;
    color: var(--text-secondary, #4a4a68);
    cursor: pointer;
}
.eu-map__search-clear:hover { background: var(--gray-200, #e5e7eb); }
/* display: grid de mai sus ar suprascrie atributul hidden — regulă explicită */
.eu-map .eu-map__search-clear[hidden] { display: none; }

/* Lista de sugestii, sub casetă — EXACT lățimea casetei de input.
   Prefixul .eu-map bate stilurile globale de liste ale temei (padding-left
   pe ul/li din conținut), care o îngustau și o împingeau spre dreapta. */
.eu-map .eu-map__search-results {
    position: absolute;
    top: calc(100% + 6px);
    left: 0; right: 0;
    width: 100%;
    box-sizing: border-box;
    margin: 0; padding: 6px;
    list-style: none;
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.22);
    max-height: 280px;
    overflow-y: auto;
}
.eu-map .eu-map__search-results[hidden] { display: none; }
/* Scrollbar subțire, modern — UNITAR pe toate panourile derulabile ale
   hărții: lista de rezultate, panoul de detalii, filtrele de rețele și
   conținutul popup-ului. Fir rotunjit discret, fără șine masive. */
.eu-map .eu-map__search-results,
.eu-map .eu-map__sheet,
.eu-map .eu-map__filters,
.eu-map .eu-map__leaflet-popup .leaflet-popup-content {
    scrollbar-width: thin;                            /* Firefox */
    scrollbar-color: var(--gray-300, #d4d4d8) transparent;
}
.eu-map .eu-map__search-results::-webkit-scrollbar,
.eu-map .eu-map__sheet::-webkit-scrollbar,
.eu-map .eu-map__filters::-webkit-scrollbar,
.eu-map .eu-map__leaflet-popup .leaflet-popup-content::-webkit-scrollbar { width: 6px; }
.eu-map .eu-map__search-results::-webkit-scrollbar-track,
.eu-map .eu-map__sheet::-webkit-scrollbar-track,
.eu-map .eu-map__filters::-webkit-scrollbar-track,
.eu-map .eu-map__leaflet-popup .leaflet-popup-content::-webkit-scrollbar-track { background: transparent; }
.eu-map .eu-map__search-results::-webkit-scrollbar-thumb,
.eu-map .eu-map__sheet::-webkit-scrollbar-thumb,
.eu-map .eu-map__filters::-webkit-scrollbar-thumb,
.eu-map .eu-map__leaflet-popup .leaflet-popup-content::-webkit-scrollbar-thumb {
    background: var(--gray-300, #d4d4d8);
    border-radius: 3px;
}
.eu-map .eu-map__search-results::-webkit-scrollbar-thumb:hover,
.eu-map .eu-map__sheet::-webkit-scrollbar-thumb:hover,
.eu-map .eu-map__filters::-webkit-scrollbar-thumb:hover,
.eu-map .eu-map__leaflet-popup .leaflet-popup-content::-webkit-scrollbar-thumb:hover {
    background: var(--gray-400, #a1a1aa);
}
.eu-map .eu-map__search-results li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 9px 10px;
    border-radius: 9px;
    cursor: pointer;
    font-size: 0.88rem;
}
.eu-map .eu-map__search-results li { margin: 0; }
.eu-map .eu-map__search-results li:hover,
.eu-map .eu-map__search-results li.is-active { background: var(--brand-primary-50, #f6f2fa); }
/* punctul colorat pe prima linie a numelui, chiar când numele se rupe */
.eu-map__search-dot { flex: none; width: 9px; height: 9px; border-radius: 50%; margin-top: 6px; }
.eu-map__search-main { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.eu-map__search-name { font-weight: 600; color: var(--text-primary, #1a1a2e); line-height: 1.35; }
/* de ce s-a potrivit (persoana/instituția găsită) · localitatea */
.eu-map__search-sub { font-size: 0.76rem; color: var(--text-muted, #6b7280); }
.eu-map__search-empty { padding: 10px; font-size: 0.85rem; color: var(--text-muted, #6b7280); cursor: default; }