/* QR thumbnail and full-screen view (public/shared/qr-view.js).
   Every code is black modules on a white tile with its 4 module quiet zone
   drawn inside the svg, in light and dark mode: a scanner needs dark on light.
   The boxes here add no padding or ground of their own. */
[data-qr-text] { cursor: zoom-in; }
[data-qr-text] svg { display: block; width: 100%; height: 100%; }
.venue-qr .qr-thumb { display: block; width: 184px; height: 184px; padding: 0; margin: 0 auto 6px; background: none; box-sizing: border-box; border: 0; border-radius: 0; }
footer.mega-footer .venue-qr { margin-top: var(--sp-4); }
footer.mega-footer .venue-qr .qr-thumb { margin-bottom: var(--sp-4); }
.venue-qr .qr-host { display: block; }
/* Large view (F76, F76a): the whole screen in the page's own colours, light or
   dark; the code stays black on its white tile. Square close button. */
.qr-full { border: 0; padding: 0; margin: 0; width: 100vw; height: 100vh; height: 100dvh; max-width: none; max-height: none; background: var(--bg, #fff); color: var(--fg, var(--ink)); cursor: zoom-out; }
.qr-full[open] { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 24px; }
.qr-full::backdrop { background: var(--bg, #fff); }
.qr-full-box { padding: 24px; text-align: center; max-width: 100vw; box-sizing: border-box; }
.qr-full-code { width: min(88vw, 64vh, 720px); height: min(88vw, 64vh, 720px); margin: 0 auto; box-sizing: border-box; }
.qr-full-code svg { display: block; width: 100%; height: 100%; }
.qr-full-note { margin: 8px 0 0; font: 600 1rem/1.3 system-ui, sans-serif; }
.qr-full-host { margin: 8px 0 0; font: 600 clamp(1rem, 4.5vw, 1.5rem)/1.3 system-ui, sans-serif; overflow-wrap: anywhere; }
.qr-full-close.secondary { width: auto; min-width: 160px; }   /* style.css .secondary is full width; here it hugs its word */
@media (max-height: 560px) { .qr-full-box { padding: 12px; } .qr-full[open] { gap: 12px; } }

.qr-full-addr { display: block; margin: 8px 0 0; font: inherit; color: inherit; overflow-wrap: anywhere; user-select: text; -webkit-user-select: text; }
.qr-full-copy { margin-top: 12px; }
.qr-full-copy.secondary { width: auto; min-width: 140px; }