/* Mapa de regiones. Usa las variables de marca de style.css y la fuente del sitio (Encode Sans). */
#mapa-regiones{
  /* Colores de región: bloque único, reemplazar por la paleta oficial cuando esté definida */
  --rg-metropolitana:#2BB8C4; --rg-norte:#1F6E7A; --rg-centro-oeste:#3A3584;
  --rg-centro-industrial:#6B5FA8; --rg-sudeste:#E91E79; --rg-sudoeste:#14A6B8;
  --rg-bg:#EDF0EF; --rg-water:#DCE6EA; --rg-line:#CBD3D2;
  --rg-ink:var(--brand-gray-dark,#141413); --rg-muted:var(--brand-gray-mid,#545453);
  background:var(--rg-bg); color:var(--rg-ink); font-family:inherit;
}
#mapa-regiones :focus-visible{outline:2.5px solid var(--brand-teal,#00829B);outline-offset:2px}
/* Pills de sector */
.rg-pill{--c:var(--brand-teal-dark,#014452);font-weight:700;font-size:.9rem;padding:.55rem 1.2rem;border:1.5px solid var(--c);border-radius:999px;background:#fff;color:var(--c);cursor:pointer;transition:background .15s,color .15s}
@media (max-width: 768px) {
  .rg-pill {
    font-size: .8rem;
    padding: .35rem .8rem;
  }
}
.rg-pill[data-tone="mid"]{--c:var(--brand-teal,#00829B)}
.rg-pill[data-tone="accent"]{--c:var(--brand-magenta,#E61566)}
.rg-pill:hover{background:color-mix(in srgb,var(--c) 12%,#fff)}
.rg-pill[aria-pressed="true"]{background:var(--c);color:#fff}
.rg-pill .rg-x{margin-left:.5rem;font-size:.8em}
.rg-status{color:var(--rg-muted)}
.rg-status button{border:0;background:none;padding:0;font:inherit;font-weight:700;color:var(--brand-teal-dark,#014452);text-decoration:underline;cursor:pointer}
/* Mapa */
.rg-card{border-radius:18px;overflow:hidden;position:relative}
@media (max-width:991.98px){#rg-map{height:auto;aspect-ratio:var(--rg-ar,.77)}.rg-mapwrap{min-height:0;height:auto}.rg-card{overflow:visible}.rg-mapwrap{border-radius:18px 18px 0 0}.rg-aside{border-radius:0 0 18px 18px}}
.rg-mapwrap{background:var(--rg-water);min-height:420px;height:100%}
#rg-map{display:block;width:100%;touch-action:pan-x pan-y}
/* Lado a lado: la altura de la tarjeta la fija el JS (ficha más alta) y el SVG ocupa toda la superficie */
@media (min-width:992px){.rg-card{height:var(--rg-h,auto)}#rg-map{position:absolute;inset:0;height:100%}}
.rg-part{stroke:#fff;stroke-width:.6;cursor:pointer;transition:opacity .15s}
.rg-part.dim{opacity:.22}
.rg-regline{fill:none;stroke:var(--rg-line);pointer-events:none;stroke-linejoin:round;opacity:.7}
.rg-reghl{fill:none;stroke:#fff;stroke-linejoin:round;stroke-linecap:round;pointer-events:none;filter:drop-shadow(0 0 1.5px rgba(0,0,0,.45))}
.rg-mapbtns{position:absolute;right:12px;top:12px;display:flex;flex-direction:column;gap:6px}
.rg-mapbtns button{width:40px;height:40px;border-radius:10px;border:1px solid var(--rg-line);background:#fff;color:var(--rg-ink);font-size:18px;font-weight:700;line-height:1;cursor:pointer}
.rg-hint{position:absolute;left:14px;bottom:12px;font-size:12px;color:var(--rg-muted);background:rgba(255,255,255,.8);padding:4px 10px;border-radius:999px}
.rg-tip{position:fixed;z-index:1080;pointer-events:none;background:var(--rg-ink);color:#fff;padding:8px 12px;border-radius:10px;font-size:13px;line-height:1.35;max-width:260px;opacity:0;transition:opacity .1s}
/* Panel */
.rg-aside{background:#fff;padding:1.25rem 1.5rem;border-top:6px solid var(--accent,var(--rg-ink))}
@media (min-width:992px){.rg-aside{border-top:0;border-left:6px solid var(--accent,var(--rg-ink));overflow-y:auto}}
/* ≥1200: lista de regiones a la izquierda, ficha a la derecha */
@media (min-width:1200px){.rg-aside{display:flex;gap:1.5rem;align-items:flex-start}.rg-nav{flex:0 0 200px;margin-bottom:0}.rg-ficha{flex:1;min-width:0}}
.rg-nav{flex-direction:column;gap:2px;margin-bottom:1rem}
.rg-nav-item{display:flex;align-items:center;gap:.6rem;width:100%;border:0;border-radius:8px;background:none;padding:.45rem .5rem;text-align:left;font-size:.9rem;color:inherit;cursor:pointer}
.rg-nav-item:hover{background:var(--rg-bg)}
.rg-nav-item.active{background:var(--rg-bg);font-weight:700}
.rg-select{position:relative;margin-bottom:1rem}
.rg-select-btn{display:flex;align-items:center;gap:.6rem;width:100%;min-height:48px;padding:.5rem .9rem;border:1.5px solid var(--accent,var(--rg-ink));border-radius:12px;background:#fff;color:inherit;font-size:1rem;font-weight:700;text-align:left;cursor:pointer}
.rg-sel-label{flex:1}
.rg-caret{transition:transform .15s}
.rg-select-btn[aria-expanded="true"] .rg-caret{transform:rotate(180deg)}
.rg-select-list{position:absolute;z-index:20;left:0;right:0;top:calc(100% + 6px);padding:6px;background:#fff;border:1px solid var(--rg-line);border-radius:12px;box-shadow:0 12px 28px rgba(0,0,0,.18);max-height:60vh;overflow-y:auto}
.rg-select-list .rg-nav-item{min-height:44px}
.rg-sw{width:14px;height:14px;border-radius:4px;flex:0 0 14px}
.rg-ficha h3{font-weight:800;font-size:1.6rem;line-height:1.1;margin:0 0 .75rem}
.rg-stats{display:flex;flex-wrap:wrap;gap:.75rem 1.4rem;padding:.75rem 0;margin-bottom:.75rem;border-block:1px solid var(--rg-line)}
.rg-stats div{display:flex;flex-direction:column}
.rg-stats strong{font-size:1.4rem;font-weight:700;line-height:1.1}
.rg-stats span{font-size:.75rem;color:var(--rg-muted)}
.rg-ficha dt{font-weight:700;font-size:.85rem;margin-top:.8rem}
.rg-ficha dd{margin:.15rem 0 0;font-size:.9rem}
.rg-chips{display:flex;flex-wrap:wrap;gap:6px}
.rg-chips span{font-size:.8rem;padding:2px 10px;border-radius:999px;background:color-mix(in srgb,var(--accent,var(--rg-ink)) 16%,#fff)}
@media (max-width:991.98px){.rg-perfil{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}.rg-perfil.open{display:block}}
.rg-more{border:0;background:none;padding:0;font-weight:700;font-size:.85rem;color:var(--brand-teal-dark,#014452);text-decoration:underline}
@media (prefers-reduced-motion:reduce){#mapa-regiones *{transition:none!important}}
