/* Mapa de comités — els colors i la tipografia vénen del tema (variables --wp--preset--*) */
  .ojspv-mapa {
    --fons:var(--wp--preset--color--secondary, #1f1f1f);
    --text:var(--wp--preset--color--foreground, #fff);
    --accent:var(--wp--preset--color--primary, #e30041);
    --terra:#2f2f2f; --vora:#f0f0f0; --linia:rgba(255,255,255,.18); --alt:min(84vh, 760px);
    font-family:var(--wp--preset--font-family--rubik, Rubik, system-ui, sans-serif);
    font-size:var(--wp--custom--font-sizes--normal, 1.125rem); line-height:1.5; color:var(--text);
    background:var(--fons); padding:24px 0;
  }
  .ojspv-mapa * { box-sizing:border-box; }
  .ojspv-mapa__cos { display:grid; grid-template-columns:auto minmax(280px,1fr); gap:32px; align-items:start; justify-content:center; max-width:1000px; margin:0 auto; padding:0 20px; }
  @media (max-width:760px){ .ojspv-mapa__cos { grid-template-columns:1fr; } }
  .ojspv-mapa__mapa { position:relative; width:fit-content; max-width:100%; margin:0 auto; }
  .ojspv-mapa svg { display:block; height:var(--alt); width:auto; max-width:100%; touch-action:pan-x pan-y; }
  .ojspv-mapa .vora { fill:none; stroke:var(--vora); stroke-width:2.5; stroke-linejoin:round; }
  .ojspv-mapa .terra { fill:var(--terra); stroke:none; }
  .ojspv-mapa .punt { fill:var(--accent); stroke:var(--fons); stroke-width:2.5; cursor:pointer; transition:r .15s; }
  .ojspv-mapa .punt:hover, .ojspv-mapa .punt:focus-visible, .ojspv-mapa .punt.actiu { r:18; outline:none; stroke:#fff; }
  .ojspv-mapa .num { fill:#fff; font:500 15px var(--wp--preset--font-family--rubik, Rubik, system-ui, sans-serif); text-anchor:middle; dominant-baseline:central; pointer-events:none; }
  .ojspv-mapa__fitxa { position:absolute; z-index:2; width:min(400px,calc(100% - 8px)); background:var(--fons); color:var(--text); border:2px solid var(--accent); border-radius:4px; padding:14px 16px; transform:translate(-50%, calc(-100% - 18px)); box-shadow:0 8px 28px rgba(0,0,0,.6); }
  .ojspv-mapa__fitxa[hidden] { display:none; }
  .ojspv-mapa__fitxa.sota { transform:translate(-50%, 18px); }
  .ojspv-mapa ul.desplegada { max-height:40vh; overflow:auto; scrollbar-color:var(--accent) transparent; }
  .ojspv-mapa__fitxa.flotant { pointer-events:none; }
  .ojspv-mapa__fitxa.flotant .ojspv-mapa__tanca { display:none; }
  .ojspv-mapa li.mes { color:var(--accent); font-size:.875rem; }
  .ojspv-mapa__tanca { position:absolute; top:4px; right:8px; border:0; background:none; color:var(--text); font-size:24px; line-height:1; cursor:pointer; }
  .ojspv-mapa__fitxa h3 { margin:0 24px 8px 0; font-size:1.1rem; font-weight:400; text-transform:uppercase; color:var(--accent); }
  .ojspv-mapa ul { list-style:none; margin:0; padding:0; }
  .ojspv-mapa li { display:flex; flex-wrap:wrap; justify-content:space-between; gap:0 12px; padding:6px 0; border-top:1px solid var(--linia); font-size:1rem; }
  .ojspv-mapa li > :last-child { margin-left:auto; max-width:100%; min-width:0; overflow-wrap:anywhere; text-align:right; }
  .ojspv-mapa li > a, .ojspv-mapa li > .pendent { font-size:.875rem; }
  @media (max-width:760px){ .ojspv-mapa li > a, .ojspv-mapa li > .pendent { font-size:.8125rem; } }
  .ojspv-mapa li:first-child { border-top:0; }
  .ojspv-mapa .pendent { color:#9a9a9a; font-style:italic; }
  .ojspv-mapa a { color:var(--accent); font-weight:500; text-decoration:underline; }
  .ojspv-mapa a:hover { text-decoration:none; }
  .ojspv-mapa__panell { max-height:var(--alt); overflow:auto; padding-right:6px; scrollbar-color:var(--accent) transparent; }
  .ojspv-mapa label { display:block; font-weight:400; text-transform:uppercase; margin-bottom:6px; }
  .ojspv-mapa input[type=search] { width:100%; padding:10px 12px; font:inherit; font-size:1rem; color:var(--text); background:transparent; border:2px solid var(--text); border-radius:4px; }
  .ojspv-mapa input[type=search]:focus { outline:none; border-color:var(--accent); }
  .ojspv-mapa__resum { margin:10px 0; color:#bdbdbd; font-size:.875rem; }
  .ojspv-mapa__zona { margin:0 0 16px; }
  .ojspv-mapa__zona h3 { margin:0 0 4px; font-size:1rem; font-weight:400; text-transform:uppercase; color:var(--accent); }
  .ojspv-mapa mark { background:var(--accent); color:#fff; }
