/* ═══════════════════ QR LINK — composant partagé ═══════════════════
   Règle du site : partout où il y a un bouton « copier le lien » (une
   ancre #), un bouton « 📱 QR » apparaît juste à côté et affiche le QR
   code du même lien. Voir /public/shared/qr-link.js */

/* Le bouton QR est un clone du bouton « copier le lien » : il hérite des
   classes (et donc du style) de la page. On ne règle ici que le strict
   nécessaire. */
.qrl-btn{white-space:nowrap}

/* ── Mode ancres : paire « ⎘ Lien » + « 📱 QR » posée dans les titres de
   section des pages qui n'avaient pas de bouton de partage. Les couleurs
   viennent du titre lui-même (currentColor) : la paire s'adapte donc au
   thème clair/sombre de chaque page sans réglage. ── */
.qrl-a-acts{display:block;margin:-6px 0 18px}
.qrl-a-btn{display:inline-flex;align-items:center;margin:0 6px 4px 0;font:600 11px/1 'IBM Plex Mono','JetBrains Mono',ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.02em;color:inherit;background:transparent;border:1px solid currentColor;border-radius:999px;padding:5px 9px;cursor:pointer;opacity:.4;transition:opacity .15s}
.qrl-a-btn:hover,.qrl-a-btn:focus-visible{opacity:1}


/* ── Modale ── */
.qrl-ov{position:fixed;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(0,0,0,.68);backdrop-filter:blur(4px)}
.qrl-ov[hidden]{display:none}
.qrl-box{position:relative;background:#fdfaf5;border-radius:18px;padding:22px 20px 20px;width:100%;max-width:340px;max-height:92vh;overflow-y:auto;text-align:center;box-shadow:0 24px 70px rgba(0,0,0,.45);font-family:'DM Sans',system-ui,sans-serif;color:#1a1614}
.qrl-x{position:absolute;top:10px;right:12px;background:none;border:none;font-size:20px;line-height:1;color:#8a8078;cursor:pointer;padding:4px}
.qrl-x:hover{color:#1a1614}
.qrl-ttl{font:700 16px/1.3 'DM Sans',system-ui,sans-serif;margin:0 22px 6px;color:#1a1614}
.qrl-sub{font:13px/1.5 'DM Sans',system-ui,sans-serif;color:#6b6560;margin:0 0 14px}
.qrl-render{min-height:200px;display:flex;align-items:center;justify-content:center;font:13px/1.5 'DM Sans',system-ui,sans-serif;color:#6b6560}
.qrl-render svg,.qrl-render img{background:#fff;padding:10px;border-radius:12px;width:200px;height:200px;image-rendering:pixelated}
.qrl-url{font:11px/1.5 'IBM Plex Mono','SFMono-Regular',Consolas,monospace;color:#6b6560;word-break:break-all;margin:12px 0 16px}
.qrl-acts{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.qrl-act{padding:9px 16px;border-radius:9px;border:1.5px solid rgba(26,22,20,.14);background:transparent;color:#6b6560;font:600 13px/1 'DM Sans',system-ui,sans-serif;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center}
.qrl-act:hover{border-color:#b8713a;color:#b8713a}
.qrl-open{background:#b8713a;border-color:#b8713a;color:#fff}
.qrl-open:hover{background:#a3632f;border-color:#a3632f;color:#fff}

@media (max-width:480px){
  .qrl-box{padding:20px 16px 16px}
  .qrl-render svg,.qrl-render img{width:170px;height:170px}
}
@media print{
  .qrl-btn,.qrl-ov,.qrl-a-acts{display:none!important}
}