/* Unvarnish — sidebar: Categories as pills (match Tags) + infographics gallery + popin.
   Enqueued by mu-plugin unvarnish-infographics (single + archives). Tokens from
   unvarnish-swiss.css (:root --unv-*) → auto dark/light. rem only. Mirror _HUB/server/uploads/. */

/* ---- 1. Categories list + Tag cloud → one unified brand pill ---- */
.wp-block-categories{
  list-style:none !important;margin:.7rem 0 0 !important;padding:0 !important;
  display:flex;flex-wrap:wrap;gap:.4rem;
  text-transform:none !important;letter-spacing:-.01em !important;color:inherit !important;
}
.wp-block-categories li{margin:0 !important;padding:0 !important;}
.wp-block-categories li::before{content:none !important;}
.wp-block-tag-cloud{display:flex;flex-wrap:wrap;gap:.4rem;margin:.7rem 0 0;}
.wp-block-categories a,
.wp-block-tag-cloud a.tag-cloud-link{
  display:inline-block;
  font-size:.78rem !important;font-weight:600 !important;letter-spacing:-.01em !important;
  text-transform:none !important;line-height:1.2;text-decoration:none;
  color:var(--unv-ink) !important;background:var(--unv-paper) !important;
  border:1px solid var(--unv-line) !important;border-radius:999px;
  padding:.32rem .8rem;
}
.wp-block-categories a:hover,
.wp-block-tag-cloud a.tag-cloud-link:hover{
  border-color:var(--unv-red) !important;color:var(--unv-red) !important;text-decoration:none;
}

/* ---- 2. Infographics gallery (3x3 paginated) ---- */
.unv-infg{margin-top:1.2rem;}
/* Title = same design as Categories/Tags headings (theme is-style-text-summary) — mini size +
   xx-large line-height, inheriting theme heading typo via .wp-block-heading.is-style-heading-basic. */
.unv-infg-title{font-size:.9375rem;line-height:1.6;margin:0 0 .7rem;}
.unv-infg-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.4rem;}
.unv-infg-tile{
  display:block;padding:0;margin:0;aspect-ratio:1;overflow:hidden;line-height:0;cursor:pointer;box-sizing:border-box;
  background:var(--unv-paper);border:0 solid rgba(226,0,26,0);  /* idem cartes sidebar : 0→5px rouge au survol */
  transition:border-width .25s ease,border-color .25s ease;
}
.unv-infg-tile:hover{border-width:5px;border-color:var(--unv-red);}
.unv-infg-tile img{width:100%;height:100%;object-fit:cover;display:block;}
.unv-infg-nav{display:flex;align-items:center;justify-content:center;gap:.8rem;margin-top:.8rem;}
.unv-infg-nav button{
  min-width:2rem;height:2rem;border:1px solid var(--unv-line);background:var(--unv-paper);
  color:var(--unv-ink);font-size:.95rem;line-height:1;cursor:pointer;border-radius:999px;
  transition:border-color .15s ease,color .15s ease;
}
.unv-infg-nav button:hover:not(:disabled){border-color:var(--unv-red);color:var(--unv-red);}
.unv-infg-nav button:disabled{opacity:.32;cursor:default;}
.unv-infg-pageinfo{
  font-size:.72rem;font-weight:700;letter-spacing:.08em;color:var(--unv-grey);
  min-width:3.2rem;text-align:center;
}

/* ---- 3. Popin (lightbox) ---- */
body.unv-infg-lock{overflow:hidden;}
.unv-infg-popin{
  position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;
  padding:5vh 5vw;background:rgba(0,0,0,.82);
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
}
.unv-infg-popin[hidden]{display:none;}
.unv-infg-figure{
  margin:0;max-width:min(44rem,92vw);max-height:90vh;display:flex;flex-direction:column;
  background:var(--unv-paper);border:1px solid var(--unv-line);
}
.unv-infg-figure img{display:block;width:100%;height:auto;max-height:78vh;object-fit:contain;background:var(--unv-paper);}
.unv-infg-figure figcaption{display:flex;flex-direction:column;gap:.3rem;padding:.85rem 1.1rem;border-top:1px solid var(--unv-line);}
.unv-infg-cap-t{font-size:.92rem;font-weight:600;letter-spacing:-.01em;color:var(--unv-ink);line-height:1.3;}
.unv-infg-cap-l{font-size:.72rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--unv-red);}
.unv-infg-close{
  position:absolute;top:1rem;right:1.3rem;width:2.6rem;height:2.6rem;z-index:2;
  border:0;background:transparent;color:#fff;font-size:2rem;line-height:1;cursor:pointer;
}
.unv-infg-close:hover{color:var(--unv-red);}

/* popin prev/next (lightbox carousel through all infographics) */
.unv-infg-pnav{
  position:absolute;top:50%;transform:translateY(-50%);z-index:2;
  width:3rem;height:3rem;display:flex;align-items:center;justify-content:center;
  border:0;border-radius:999px;background:rgba(255,255,255,.14);color:#fff;
  font-size:1.4rem;line-height:1;cursor:pointer;transition:background .15s ease;
}
.unv-infg-pnav:hover{background:var(--unv-red);}
.unv-infg-pprev{left:1rem;}
.unv-infg-pnext{right:1rem;}

@media (max-width:30rem){
  .unv-infg-grid{gap:.3rem;}
  .unv-infg-figure figcaption{padding:.7rem .9rem;}
  .unv-infg-pnav{width:2.4rem;height:2.4rem;font-size:1.1rem;}
  .unv-infg-pprev{left:.3rem;}
  .unv-infg-pnext{right:.3rem;}
}