/* Floating QR banner — NEON style, three layouts (v1/v2/v3) + collapsed states.
   Used by local/include/qr-banner/banner.php (+ qr-banner.js for QR & background).
   Text rules driven from the admin fields:
     .nvqr__title : bare text = big glossy headline; <span> = small eyebrow
     .nvqr__text  : bare text = white brand line;   <span> = cyan accent
   All classes namespaced .nvqr*. */

.nvqr{position:fixed;left:0;top:0;width:0;height:0;z-index:99990;font-family:inherit}
.nvqr__card,.nvqr__open{position:fixed;box-sizing:border-box}
.nvqr__card *,.nvqr__open *{box-sizing:border-box}
.nvqr__card{color:#eaf3ff;background-color:#0a1c44;overflow:hidden;
	box-shadow:0 24px 60px rgba(4,20,60,.55),0 0 0 1px rgba(80,170,255,.25) inset;
	transition:transform .45s cubic-bezier(.22,.61,.36,1),opacity .35s}
.nvqr__open{border:0;cursor:pointer;color:#dbeaff;display:flex;align-items:center;justify-content:center;
	background:linear-gradient(165deg,#0e2a5e,#0a1c44);
	box-shadow:0 0 0 2px rgba(120,200,255,.6),0 12px 30px rgba(4,20,60,.5),0 0 22px rgba(40,140,255,.5);
	opacity:0;pointer-events:none;transition:transform .42s cubic-bezier(.22,.61,.36,1),opacity .35s}
.nvqr__open svg{width:30px;height:30px}
.nvqr:not(.nvqr--ready) .nvqr__card,.nvqr:not(.nvqr--ready) .nvqr__open{opacity:0!important;transition:none!important}

/* decorative background streaks+particles (SVG injected by qr-banner.js) */
.nvqr__bg{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.9}
.nvqr__bg svg{display:block;width:100%;height:100%}
/* red corner accent */
.nvqr__stripe{position:absolute;top:-30px;right:-46px;width:150px;height:60px;transform:rotate(38deg);z-index:2;pointer-events:none;background:linear-gradient(90deg,#ff2d2d,#b00d2a);box-shadow:0 0 18px rgba(255,45,45,.5)}
.nvqr__inner{position:relative;z-index:2}

/* QR tile with neon frame */
.nvqr__qr{position:relative;z-index:2;display:block;background:#fff;border-radius:16px;overflow:hidden;text-decoration:none;
	box-shadow:0 0 0 2px rgba(120,200,255,.95),0 0 16px 3px rgba(50,150,255,.7),0 0 36px 8px rgba(40,130,255,.4)}
.nvqr__qr img,.nvqr__qr canvas,.nvqr__qrgen img,.nvqr__qrgen canvas{display:block;width:100%!important;height:100%!important;border-radius:8px}
.nvqr__qrgen{display:block;width:100%;height:100%}

/* collapse (close) button */
.nvqr__collapse{position:absolute;z-index:3;border:0;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:50%;background:rgba(255,255,255,.14);color:#cfe6ff}
.nvqr__collapse:hover{background:rgba(255,255,255,.24)}
.nvqr__collapse svg{display:block}

/* title: bare text = big glossy headline; <span> = small eyebrow */
.nvqr__title{position:relative;z-index:2;font-weight:900;line-height:.96;color:#eaf4ff;filter:drop-shadow(0 2px 10px rgba(70,160,255,.5))}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
	.nvqr__title{background:linear-gradient(180deg,#ffffff 0%,#ffffff 12%,#bcd9ff 52%,#7fb4ff 62%,#eaf4ff 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
}
.nvqr__title span{display:block;font-weight:800;letter-spacing:.14em;line-height:1.25;filter:none;background:none;color:#dbeaff;-webkit-text-fill-color:#dbeaff}

/* text: bare text = white brand line; <span> = cyan accent */
.nvqr__text{position:relative;z-index:2;color:#eaf3ff;font-weight:800;letter-spacing:.05em}
.nvqr__text span{display:block;color:#36c6f4;font-weight:800;letter-spacing:0}

/* hardcoded scan CTA */
.nvqr__scan{position:relative;z-index:2;display:flex;align-items:center;gap:9px;color:#eaf3ff;font-weight:700}
.nvqr__cam{flex:0 0 auto;display:flex;align-items:center;justify-content:center;border-radius:8px;background:linear-gradient(180deg,#2aa8ff,#1452d6);box-shadow:0 0 12px rgba(40,140,255,.7)}
.nvqr__cam svg{color:#fff}

/* ============ Variant 1: corner card (bottom-right) ============ */
.nvqr--v1 .nvqr__card{right:24px;bottom:24px;width:316px;border-radius:22px;
	background:radial-gradient(120% 70% at 50% 8%,rgba(43,150,255,.28),transparent 60%),radial-gradient(90% 60% at 50% 118%,rgba(40,140,255,.42),transparent 60%),linear-gradient(165deg,#0a2350,#0b1c44 48%,#06122e)}
.nvqr--v1 .nvqr__inner{padding:18px;text-align:center}
.nvqr--v1 .nvqr__collapse{top:10px;left:12px;width:28px;height:28px}
.nvqr--v1 .nvqr__collapse svg{width:13px;height:13px}
.nvqr--v1 .nvqr__title{font-size:34px;margin:4px 0 4px}
.nvqr--v1 .nvqr__title span{font-size:14px}
.nvqr--v1 .nvqr__text{font-size:13px;margin:0 0 12px}
.nvqr--v1 .nvqr__text span{font-size:15px}
.nvqr--v1 .nvqr__qr{width:170px;height:170px;padding:11px;margin:0 auto}
.nvqr--v1 .nvqr__scan{justify-content:center;margin-top:13px;font-size:15px}
.nvqr--v1 .nvqr__cam{width:30px;height:30px}
.nvqr--v1 .nvqr__cam svg{width:18px;height:18px}
.nvqr--v1 .nvqr__open{right:24px;bottom:24px;width:64px;height:64px;border-radius:18px;transform:translateY(22px) scale(.7)}
.nvqr--v1 .nvqr__open::after{content:"";position:absolute;top:-3px;right:-3px;width:14px;height:14px;border-radius:50%;background:#ff3838;border:2px solid #0a1c44;box-shadow:0 0 8px #ff3838}
.nvqr--v1.nvqr--collapsed .nvqr__card{transform:translateX(150%);opacity:0;pointer-events:none}
.nvqr--v1.nvqr--collapsed .nvqr__open{transform:none;opacity:1;pointer-events:auto}

/* ============ Variant 2: right-edge vertical tab ============ */
.nvqr--v2 .nvqr__card{right:0;top:50%;transform:translateY(-50%);width:300px;border-radius:22px 0 0 22px;
	background:radial-gradient(120% 60% at 50% 6%,rgba(43,150,255,.28),transparent 60%),radial-gradient(90% 55% at 50% 116%,rgba(40,140,255,.4),transparent 60%),linear-gradient(165deg,#0a2350,#0b1c44 48%,#06122e)}
.nvqr--v2 .nvqr__inner{padding:18px;text-align:center}
.nvqr--v2 .nvqr__collapse{top:10px;left:12px;width:28px;height:28px}
.nvqr--v2 .nvqr__collapse svg{width:13px;height:13px}
.nvqr--v2 .nvqr__title{font-size:32px;margin:4px 0 4px}
.nvqr--v2 .nvqr__title span{font-size:13px}
.nvqr--v2 .nvqr__text{font-size:12.5px;margin:0 0 12px}
.nvqr--v2 .nvqr__text span{font-size:14px}
.nvqr--v2 .nvqr__qr{width:164px;height:164px;padding:11px;margin:0 auto}
.nvqr--v2 .nvqr__scan{justify-content:center;margin-top:13px;font-size:14px}
.nvqr--v2 .nvqr__cam{width:28px;height:28px}
.nvqr--v2 .nvqr__cam svg{width:17px;height:17px}
.nvqr--v2 .nvqr__open{right:0;top:50%;transform:translate(120%,-50%);flex-direction:column;gap:9px;border-radius:16px 0 0 16px;padding:16px 10px}
.nvqr--v2 .nvqr__open svg{width:22px;height:22px}
.nvqr--v2 .nvqr__open-label{writing-mode:vertical-rl;transform:rotate(180deg);font-size:13px;font-weight:800;letter-spacing:.04em}
.nvqr--v2.nvqr--collapsed .nvqr__card{transform:translate(110%,-50%);opacity:0;pointer-events:none}
.nvqr--v2.nvqr--collapsed .nvqr__open{transform:translate(0,-50%);opacity:1;pointer-events:auto}

/* ============ Variant 3: horizontal (QR left / text right) ============ */
.nvqr--v3 .nvqr__card{right:24px;bottom:24px;width:392px;border-radius:20px;
	background:radial-gradient(70% 120% at 18% 50%,rgba(43,150,255,.3),transparent 60%),radial-gradient(80% 130% at 100% 120%,rgba(40,140,255,.38),transparent 60%),linear-gradient(150deg,#0a2350,#0b1c44 50%,#06122e)}
.nvqr--v3 .nvqr__inner{display:flex;gap:15px;align-items:center;padding:16px}
.nvqr--v3 .nvqr__collapse{top:9px;right:11px;width:26px;height:26px}
.nvqr--v3 .nvqr__collapse svg{width:12px;height:12px}
.nvqr--v3 .nvqr__qr{flex:0 0 auto;width:132px;height:132px;padding:9px}
.nvqr--v3 .nvqr__body{flex:1 1 auto;min-width:0}
.nvqr--v3 .nvqr__title{font-size:31px;margin:0 0 3px}
.nvqr--v3 .nvqr__title span{font-size:12px}
.nvqr--v3 .nvqr__text{font-size:12px;margin:0 0 9px}
.nvqr--v3 .nvqr__text span{font-size:13px}
.nvqr--v3 .nvqr__scan{font-size:13px}
.nvqr--v3 .nvqr__cam{width:26px;height:26px}
.nvqr--v3 .nvqr__cam svg{width:16px;height:16px}
.nvqr--v3 .nvqr__open{right:24px;bottom:24px;gap:10px;border-radius:30px;padding:13px 20px 13px 15px;font-size:14px;font-weight:800}
.nvqr--v3 .nvqr__open svg{width:22px;height:22px;color:#7fc4ff}
.nvqr--v3.nvqr--collapsed .nvqr__card{transform:translateX(150%);opacity:0;pointer-events:none}
.nvqr--v3.nvqr--collapsed .nvqr__open{transform:none;opacity:1;pointer-events:auto}

@media (max-width:480px){
	.nvqr--v1 .nvqr__card,.nvqr--v3 .nvqr__card{right:12px;bottom:12px;width:calc(100vw - 24px);max-width:360px}
	.nvqr--v1 .nvqr__open,.nvqr--v3 .nvqr__open{right:12px;bottom:12px}
	.nvqr--v2 .nvqr__card{width:min(300px,calc(100vw - 12px))}
}