/* Barra de navegació dels mapes (mapnav.js): tipus, indicador/vista, any i territori en una sola barra; sota el mapa, pastilla del filtre de territori.
   Només s'aplica quan el JS l'ha construïda (html.mq); sense JS queden els controls originals. Colors i radis de la guia (petroli, taronja, bandes). */
.mq .cat-maptile .mapfull-head,.mq .cat-maptile .ele-chips-p,.mq .cat-maptile .mp-any,.mq .cat-maptile .map-eines{display:none!important}
/* html.mq el posa un script del <head>: els controls antics no es pinten mai i, fins que el JS construeix la barra, es reserva el seu lloc (sense salts) */
.mq .cat-maptile:not(:has(.mq-head)):before{content:"";display:block;height:84px;background:#e9edef;border-bottom:1px solid var(--line)}
@media(max-width:760px){.mq .cat-maptile:not(:has(.mq-head)):before{height:200px}}
/* el menú principal (Indicadors…) ha de quedar per damunt de la barra del mapa; el calaix del xat (120) continua per damunt de tot */
.header{z-index:100}.navdrop-menu{z-index:100}
.mq-head{--w:var(--mf-w,1440px);--pad:var(--mf-pad,32px);position:relative;z-index:30;background:#e9edef;border-bottom:1px solid var(--line);padding:14px 0 14px}
.mq-bar{max-width:var(--w);margin:0 auto;padding:0 var(--pad);display:flex;align-items:stretch;flex-wrap:wrap;gap:12px}
.mq-seg{display:flex;gap:4px;padding:4px;background:#fff;border:1px solid var(--line);border-radius:999px;box-shadow:0 2px 10px rgba(34,54,61,.08)}
.mq-seg-b{border:0;background:transparent;color:var(--muted);font:inherit;font-size:.9rem;font-weight:600;letter-spacing:.03em;padding:0 20px;min-height:44px;border-radius:999px;cursor:pointer;white-space:nowrap;transition:background .18s,color .18s}
.mq-seg-b:hover{background:var(--band-soft)}
.mq-seg-b.on{background:var(--petroli);color:#fff;box-shadow:0 3px 10px rgba(53,92,105,.35)}
.mq-dd{position:relative;min-width:0}
.mq-btn{display:flex;align-items:center;gap:10px;width:100%;height:100%;min-height:52px;padding:6px 18px 6px 12px;background:#fff;color:var(--ink);border:1px solid var(--line);border-radius:999px;box-shadow:0 2px 10px rgba(34,54,61,.08);font:inherit;text-align:left;cursor:pointer}
.mq-btn:hover,.mq-dd.open .mq-btn{border-color:var(--taronja-dades)}
.mq-dd.open .mq-btn{box-shadow:0 6px 18px rgba(224,108,0,.22)}
.mq-btn .mq-ic{flex:none;width:20px;height:20px;padding:6px;border-radius:50%;background:var(--taronja-soft);color:var(--taronja-dades);box-sizing:content-box}
.mq-t{display:flex;flex-direction:column;min-width:0;line-height:1.15}
.mq-l{font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:600}
.mq-v{font-size:.95rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:260px}
.mq-wide{flex:1 1 280px}.mq-wide .mq-v{max-width:none}
.mq-chev{flex:none;margin-left:auto;width:22px;height:22px;padding:5px;border-radius:50%;background:var(--band-soft);color:var(--petroli);box-sizing:border-box;transition:transform .18s}
.mq-dd.open .mq-chev{transform:rotate(180deg);background:var(--taronja-soft);color:var(--taronja-dades)}
.mq-share-btn{display:flex;align-items:center;gap:8px;margin-left:auto;padding:0 22px;min-height:52px;background:#fff;color:var(--petroli);border:1.5px solid var(--petroli);border-radius:999px;font:inherit;font-weight:600;font-size:.9rem;cursor:pointer;box-shadow:0 2px 10px rgba(34,54,61,.08)}
.mq-share-btn:hover{background:var(--petroli-soft)}
.mq-menu{display:none;position:absolute;top:calc(100% + 10px);left:0;min-width:100%;width:max-content;max-width:min(380px,90vw);max-height:min(70vh,520px);overflow:auto;background:#fff;color:var(--ink);border:1px solid #dbe5e8;border-radius:20px;box-shadow:0 18px 44px rgba(34,54,61,.22);padding:8px;z-index:40;animation:mqs .16s ease-out}
@keyframes mqs{from{opacity:0;transform:translateY(-6px)}}
.mq-dd.open .mq-menu{display:block}
.mq-grp{font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:600;padding:12px 12px 4px}
.mq-opt{display:flex;align-items:center;width:100%;border:0;background:transparent;color:inherit;font:inherit;font-size:.94rem;text-align:left;padding:10px 12px;min-height:44px;cursor:pointer;border-radius:10px}
.mq-opt:hover{background:var(--band-soft)}
.mq-opt.on{background:var(--taronja-soft);color:var(--taronja-text);font-weight:600}
.mq-opt.on:after{content:"✓";margin-left:auto;color:var(--taronja-dades);font-weight:700}
.mq-chips{display:flex;flex-wrap:wrap;gap:6px;padding:4px 6px 8px}
.mq-chip{border:1px solid var(--line);background:#fff;color:inherit;font:inherit;font-size:.86rem;padding:8px 14px;min-height:38px;border-radius:999px;cursor:pointer}
.mq-chip:hover{border-color:var(--taronja-dades)}
.mq-chip.on{background:var(--petroli);color:#fff;border-color:var(--petroli);box-shadow:0 3px 8px rgba(53,92,105,.3)}
.mq-back{display:none}
/* pastilla del territori filtrat */
.mq-pills{background:var(--band-soft);border-bottom:1px solid var(--line)}
.mq-pills-in{max-width:var(--mf-w,1440px);margin:0 auto;padding:12px var(--mf-pad,32px);display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.mapfull-cat{--mf-w:1440px}
.mq-pills-t{font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:600;margin-right:4px}
.mq-pill{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 12px 0 10px;border:1px solid var(--petroli);border-radius:999px;background:#fff;color:var(--petroli);font:inherit;font-size:.88rem;font-weight:600;cursor:pointer}
.mq-pill .mq-ic{color:var(--taronja-dades)}
.mq-pill svg:last-child{width:18px;height:18px;padding:4px;border-radius:50%;background:var(--band-soft);box-sizing:border-box}
.mq-pill:hover{background:var(--petroli);color:#fff}.mq-pill:hover svg:last-child{background:rgba(255,255,255,.2)}
/* cercador de municipi: a la dreta del mapa (mateixa columna que l'aside), només escriptori */
.mq-find{display:none}
@media(min-width:901px){
  .mapfull .map-layout > .mq-find{display:flex;align-items:center;gap:8px;position:absolute;z-index:4;top:4px;right:max(16px,calc((100% - var(--mf-w))/2 + var(--mf-pad)));width:340px;height:36px;padding:0 14px;background:#fff;border:1px solid var(--line);border-radius:999px;box-shadow:0 2px 10px rgba(34,54,61,.12);color:var(--taronja-dades)}
  .mq-find:focus-within{border-color:var(--taronja-dades);box-shadow:0 6px 18px rgba(224,108,0,.22)}
  .mq-find .mq-ic{flex:none}
  .mq-find-i{flex:1;min-width:0;border:0;outline:0;background:transparent;font:inherit;font-size:.92rem;color:var(--ink);height:100%}
  .mq-find-l{position:absolute;top:calc(100% + 6px);left:0;right:0;margin:0;padding:6px;list-style:none;background:#fff;border:1px solid #dbe5e8;border-radius:16px;box-shadow:0 14px 34px rgba(34,54,61,.22);max-height:320px;overflow:auto}
  .mq-find-l li{padding:9px 12px;border-radius:10px;font-size:.92rem;color:var(--ink);cursor:pointer}
  .mq-find-l li.on,.mq-find-l li:hover{background:var(--taronja-soft);color:var(--taronja-text)}
  .mq-find-l .mq-find-0{color:var(--muted);cursor:default}.mq-find-l .mq-find-0:hover{background:transparent;color:var(--muted)}
  /* Eleccions: la clau (títol, any, llegenda) a l'esquerra com a la resta de mapes; la dreta queda lliure per al cercador */
  .mapfull.cat-maptile .map-layout:not(.map-lateral) > .map-panel{right:auto;left:max(16px,calc((100% - var(--mf-w))/2 + var(--mf-pad)));top:12px;width:270px;max-height:calc(100% - 24px)}
}
/* diàleg de «Comparteix» (app.js) amb el mateix estil */
.mp-share{border-radius:22px}.mps-url input{border-radius:999px;padding-left:16px}.mps-url button{border-radius:999px}.mps-opts button{border-radius:18px}
@media(max-width:900px){.mq-head{--pad:16px}.mq-pills-in{padding:10px 16px}}
@media(max-width:760px){
  .mq-head{--pad:10px;padding:10px 0}
  .mq-bar{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .mq-seg{grid-column:1/-1;gap:2px;padding:3px;border-radius:999px;overflow:hidden}
  .mq-seg-b{flex:1 1 0;min-width:0;padding:0 4px;font-size:.78rem;letter-spacing:0;min-height:42px;border-radius:999px}
  .mq-seg-b.on{box-shadow:none}
  .mq-dd.mq-wide{grid-column:1/-1}.mq-wide .mq-v{white-space:normal;line-height:1.2}
  .mq-btn{min-height:50px;gap:8px;padding:6px 10px 6px 8px}.mq-btn .mq-ic{padding:5px}.mq-v{max-width:100%}
  .mq-chev{width:20px;height:20px;padding:4px}
  .mq-share-btn{margin:0;min-height:50px;padding:0 12px;justify-content:center}
  .mq-bar:has(.mq-wide) .mq-share-btn{grid-column:1/-1}
  .mq-menu{position:fixed;left:0;right:0;bottom:0;top:auto;width:auto;max-width:none;max-height:72vh;border-radius:22px 22px 0 0;padding:10px 10px calc(14px + env(safe-area-inset-bottom));z-index:1001;animation:none}
  .mq-menu:before{content:"";display:block;width:40px;height:4px;border-radius:2px;background:var(--muted);opacity:.4;margin:2px auto 8px}
  .mq-open .mq-back{display:block;position:fixed;inset:0;background:rgba(20,35,42,.5);z-index:20}
}
