/* OffRio · eventer/assets/ev_qr.css — 05-10-2026. Het QR-venster. */
.ev-qr { position: fixed; inset: 0; z-index: 9999; background: rgba(5,3,12,.88); display: flex;
         align-items: center; justify-content: center; padding: 16px; backdrop-filter: blur(4px); }
.ev-qr-doos { position: relative; background: #151122; border: 1px solid rgba(212,175,55,.45); border-radius: 22px;
              padding: 22px; width: min(580px, 100%); text-align: center; color: #f5f2ed;
              font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; }
.ev-qr-x { position: absolute; top: 8px; right: 12px; background: none; border: 0; color: #f5f2ed; font-size: 32px; cursor: pointer; line-height: 1; }
.ev-qr-titel { font-family: 'Syne', sans-serif; font-weight: 800; font-size: 22px; color: #f0d060; margin: 4px 30px 12px; }
.ev-qr-tabs { display: flex; gap: 6px; justify-content: center; margin-bottom: 14px; }
.ev-qr-tabs button { font: inherit; font-weight: 700; font-size: 14px; padding: 8px 16px; border-radius: 99px; cursor: pointer;
                     background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.15); color: #f5f2ed; }
.ev-qr-tabs button.actief { background: linear-gradient(135deg, #d4af37, #f0d060); color: #16202e; border-color: transparent; }
.ev-qr-code { background: #fff; border-radius: 16px; padding: 10px; margin: 0 auto; width: min(500px, 64vh, 100%); }
.ev-qr-code svg { display: block; width: 100%; height: auto; }
.ev-qr-uitleg { font-size: 15px; margin-top: 14px; line-height: 1.5; }
.ev-qr-url { font-size: 13px; color: #e8c860; margin-top: 4px; word-break: break-all; }
.ev-qr-knoppen { display: flex; gap: 8px; justify-content: center; margin-top: 16px; flex-wrap: wrap; }
.ev-qr-knoppen button { font: inherit; font-weight: 700; font-size: 14px; padding: 11px 16px; border-radius: 11px; cursor: pointer;
                        background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.18); color: #f5f2ed; }
/* Telefoon: (bijna) het hele scherm, de code zo groot als het kan. */
@media (max-width: 600px) {
    .ev-qr { padding: 0; align-items: stretch; }
    .ev-qr-doos { width: 100%; border-radius: 0; border: 0; padding: 18px 14px calc(18px + env(safe-area-inset-bottom));
                  display: flex; flex-direction: column; justify-content: center; }
    .ev-qr-code { width: min(92vw, 62vh); }
}