#mapid {
    height: calc(100vh - 280px);
    min-height: 480px;
    border-radius: .5rem;
    box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .06);
}

/* Cor "purple" para o ícone editora — Bootstrap não traz nativamente. */
.text-purple { color: #6f42c1; }

/* Halo dot — círculo achatado com halo difuso colorido, sem rotação.
   Visual leve, mantém identidade de cor por categoria. */
/* Halo dot leve. Sombras simplificadas (sem spread grande) p/ performance
   com centenas de pins simultâneos. */
.map-pin {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    color: #fff;
    font-size: 11px;
    background: var(--pin-color);
    border: 2px solid #fff;
    box-shadow:
        0 0 0 3px var(--pin-glow),
        0 1px 3px rgba(0, 0, 0, .35);
    cursor: pointer;
}

.map-pin:hover {
    transform: scale(1.18);
    transition: transform .12s ease;
    z-index: 1000;
}

.map-pin-escritor    { --pin-color: #ef4444; --pin-glow: rgba(239,  68,  68, .28); }
.map-pin-tradutor    { --pin-color: #22c55e; --pin-glow: rgba( 34, 197,  94, .28); }
.map-pin-organizador { --pin-color: #3b82f6; --pin-glow: rgba( 59, 130, 246, .28); }
.map-pin-editora     { --pin-color: #a855f7; --pin-glow: rgba(168,  85, 247, .28); }

/* ─── Popup moderno ─────────────────────────────────────────────
   Header com ícone (cor da categoria), kicker ("nascidos em") em
   caixa-alta sutil, cidade em destaque e chip com contagem.
   Lista sem bullet, hover com bg discreto e chevron à direita.
   ─────────────────────────────────────────────────────────────── */
.map-popup { min-width: 220px; }

.map-popup-header {
    display: flex;
    align-items: center;
    gap: .6rem;
    padding-bottom: .55rem;
    margin-bottom: .4rem;
    border-bottom: 1px solid #eef0f3;
}

.map-popup-icon {
    flex: 0 0 auto;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 14px;
    background: var(--cat-color, #6c757d);
    box-shadow: 0 0 0 4px var(--cat-glow, rgba(108, 117, 125, .18));
}

.map-popup-meta { flex: 1 1 auto; min-width: 0; }

.map-popup-kicker {
    font-size: .68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: #6b7280;
    line-height: 1.2;
}

.map-popup-cidade {
    font-size: .95rem;
    font-weight: 700;
    color: #111827;
    line-height: 1.25;
    margin-top: .1rem;
}

.map-popup-count {
    flex: 0 0 auto;
    min-width: 26px;
    padding: 2px 8px;
    border-radius: 999px;
    background: var(--cat-glow, rgba(108, 117, 125, .18));
    color: var(--cat-color, #495057);
    font: 700 12px/1.4 system-ui, sans-serif;
    text-align: center;
}

/* Cores por categoria (variáveis consumidas pelo ícone e chip) */
.map-popup-escritor    { --cat-color:#ef4444; --cat-glow:rgba(239, 68, 68,.16); }
.map-popup-tradutor    { --cat-color:#16a34a; --cat-glow:rgba(22,163, 74,.16); }
.map-popup-organizador { --cat-color:#2563eb; --cat-glow:rgba(37, 99,235,.16); }
.map-popup-editora     { --cat-color:#9333ea; --cat-glow:rgba(147, 51,234,.16); }

/* Lista */
.map-popup-list {
    list-style: none;
    margin: 0;
    padding: 0;
    max-height: 240px;
    overflow-y: auto;
}
.map-popup-list li { margin: 0; }
.map-popup-list a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding: .35rem .55rem;
    border-radius: .375rem;
    color: #1f2937;
    text-decoration: none;
    transition: background .12s ease;
}
.map-popup-list a:hover {
    background: #f3f4f6;
    color: var(--cat-color, #2563eb);
}
.map-popup-nome {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.map-popup-chev {
    flex: 0 0 auto;
    font-size: 12px;
    opacity: 0;
    transform: translateX(-4px);
    transition: opacity .12s ease, transform .12s ease;
}
.map-popup-list a:hover .map-popup-chev {
    opacity: .8;
    transform: translateX(0);
}

/* Scrollbar discreto na lista */
.map-popup-list::-webkit-scrollbar { width: 6px; }
.map-popup-list::-webkit-scrollbar-thumb { background: #d1d5db; border-radius: 3px; }
.map-popup-list::-webkit-scrollbar-thumb:hover { background: #9ca3af; }

.legend-mapa {
    background: #fff;
    padding: .5rem .75rem;
    border-radius: .35rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .15);
    font-size: .85rem;
    line-height: 1.5;
}

.legend-mapa .legend-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-right: .35rem;
    vertical-align: middle;
}