/* BeachHub reservation QR and check-in components */
.reservation-access-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px;align-items:stretch}
.qr-upload-card,.reservation-lookup{padding:28px}
.qr-upload-dropzone{min-height:220px;border:2px dashed rgba(14,116,144,.26);border-radius:22px;background:linear-gradient(145deg,rgba(236,254,255,.8),rgba(255,255,255,.96));display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:7px;padding:28px;cursor:pointer;transition:.2s ease}
.qr-upload-dropzone:hover{transform:translateY(-2px);border-color:var(--primary,#087f8c);box-shadow:0 15px 35px rgba(8,127,140,.12)}
.qr-upload-icon{width:60px;height:60px;border-radius:18px;display:grid;place-items:center;background:#0f766e;color:#fff;font-size:32px;line-height:1}
.qr-status{margin:14px 0 0}
.qr-status.is-working{color:#0369a1}.qr-status.is-success{color:#047857}.qr-status.is-error{color:#b91c1c}
.reservation-qr-ticket{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr);gap:30px;align-items:center;overflow:hidden;position:relative;padding:34px;background:linear-gradient(135deg,#072f3f 0%,#0d5664 58%,#168596 100%);color:#fff}
.reservation-qr-ticket:after{content:"";position:absolute;width:250px;height:250px;border-radius:50%;right:-90px;top:-110px;background:rgba(255,255,255,.08)}
.reservation-qr-ticket .eyebrow,.reservation-qr-ticket p,.reservation-qr-ticket small{color:rgba(255,255,255,.8)}
.reservation-qr-ticket h3{font-size:clamp(25px,3vw,38px);margin:6px 0 10px;color:#fff}
.reservation-qr-ticket__copy,.reservation-qr-ticket__code{position:relative;z-index:1}
.reservation-qr-ticket__code{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}
.qr-ticket-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:22px 0}
.qr-ticket-meta span{padding:12px 14px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.08);border-radius:14px;display:flex;flex-direction:column;gap:3px}
.qr-ticket-meta strong{font-size:14px}.qr-ticket-meta small{font-size:11px;text-transform:uppercase;letter-spacing:.06em}
.qr-code-box{width:210px;min-height:210px;display:grid;place-items:center;background:#fff;padding:10px;border-radius:18px;box-shadow:0 16px 38px rgba(2,20,28,.2)}
.qr-code-box--large{width:280px;min-height:280px;padding:10px;border-radius:24px}
.qr-code-box canvas,.qr-code-box img{max-width:100%;height:auto!important;border-radius:8px}
.qr-scanner-card{display:grid;grid-template-columns:minmax(0,.85fr) minmax(320px,1.15fr);gap:28px;margin-bottom:24px;padding:28px;background:linear-gradient(145deg,#f0fdfa,#fff)}
.qr-scanner-card h3{font-size:clamp(24px,3vw,34px);margin:6px 0 10px}
.qr-check-rules{display:grid;gap:9px;margin-top:20px}.qr-check-rules span{display:flex;gap:8px;align-items:center;font-weight:700;color:#0f766e}
.qr-scanner-panel{min-width:0}
.qr-video-frame{position:relative;overflow:hidden;aspect-ratio:16/10;border-radius:22px;background:#082f3a;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.qr-video-frame video{width:100%;height:100%;display:block;object-fit:cover}
.qr-camera-placeholder{position:absolute;inset:0;display:grid;place-items:center;color:rgba(255,255,255,.7);font-weight:700;padding:30px;text-align:center}
.qr-video-frame.is-live .qr-camera-placeholder{display:none}
.qr-viewfinder{position:absolute;width:min(56%,230px);aspect-ratio:1;left:50%;top:50%;transform:translate(-50%,-50%);border:3px solid rgba(255,255,255,.9);border-radius:24px;box-shadow:0 0 0 999px rgba(2,18,25,.22);pointer-events:none}
.qr-viewfinder:before,.qr-viewfinder:after{content:"";position:absolute;left:12%;right:12%;height:2px;background:#2dd4bf;box-shadow:0 0 14px #2dd4bf}
.qr-viewfinder:before{top:18%;animation:qrScanLine 2s ease-in-out infinite}.qr-viewfinder:after{display:none}
@keyframes qrScanLine{0%,100%{transform:translateY(0)}50%{transform:translateY(140px)}}
.qr-scanner-actions{margin:14px 0 0;flex-wrap:wrap}
.qr-divider{display:flex;align-items:center;gap:12px;margin:17px 0;color:var(--muted,#64748b);font-size:12px;text-transform:uppercase;letter-spacing:.08em}.qr-divider:before,.qr-divider:after{content:"";height:1px;background:rgba(100,116,139,.22);flex:1}
.qr-upload-button{display:flex;justify-content:center;align-items:center;border:1px solid rgba(15,118,110,.22);background:#fff;border-radius:14px;padding:13px 16px;font-weight:800;cursor:pointer}
.booking-qr-details{margin-top:15px;border:1px solid rgba(15,118,110,.16);border-radius:18px;background:#f8fffe;overflow:hidden}
.booking-qr-details summary{cursor:pointer;font-weight:800;padding:15px 18px;color:#0f766e}
.booking-qr-layout{display:grid;grid-template-columns:210px minmax(0,1fr);gap:20px;align-items:center;padding:0 18px 18px}
.booking-qr-layout .qr-code-box{box-shadow:0 8px 25px rgba(15,118,110,.12)}
.qr-checkin-result{margin-top:15px}
@media(max-width:900px){.reservation-access-grid,.reservation-qr-ticket,.qr-scanner-card{grid-template-columns:1fr}.reservation-qr-ticket__code{order:-1}.qr-ticket-meta{grid-template-columns:1fr 1fr}.booking-qr-layout{grid-template-columns:1fr}.booking-qr-layout .qr-code-box{margin:auto}}
@media(max-width:560px){.reservation-qr-ticket,.qr-scanner-card,.qr-upload-card,.reservation-lookup{padding:20px}.qr-ticket-meta{grid-template-columns:1fr}.qr-code-box--large{width:min(100%,280px);min-height:auto}.qr-scanner-actions .btn{width:100%}.booking-qr-layout{padding:0 14px 14px}.qr-code-box{width:min(100%,210px);min-height:auto}}
@media print{.reservation-qr-ticket{background:#fff!important;color:#111!important;border:1px solid #ddd}.reservation-qr-ticket h3,.reservation-qr-ticket p,.reservation-qr-ticket small,.reservation-qr-ticket .eyebrow{color:#111!important}.reservation-qr-ticket .btn{display:none}.topbar,.footer{display:none!important}}

/* Owner QR camera modal: keep scanner hidden until explicitly started */
.qr-scanner-launch-panel{min-height:260px;border:1px solid rgba(15,118,110,.16);border-radius:24px;background:linear-gradient(145deg,#ffffff,#ecfdf5);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:14px;padding:30px;box-shadow:0 18px 42px rgba(15,118,110,.09)}
.qr-scanner-launch-panel strong{font-size:20px;color:#083344}.qr-scanner-launch-panel p{max-width:460px;margin:0 auto}.qr-scanner-launch-panel .btn{min-width:220px;justify-content:center}
.qr-scanner-launch-icon{width:74px;height:74px;border-radius:24px;background:#0f766e;color:#fff;display:grid;place-items:center;font-size:38px;line-height:1;box-shadow:0 16px 32px rgba(15,118,110,.22)}
.qr-camera-modal{position:fixed;inset:0;z-index:10000;display:none;align-items:center;justify-content:center;padding:22px}.qr-camera-modal.is-open{display:flex}.qr-camera-modal-open{overflow:hidden}
.qr-camera-modal__backdrop{position:absolute;inset:0;background:rgba(2,18,25,.72);backdrop-filter:blur(8px)}
.qr-camera-modal__surface{position:relative;z-index:1;width:min(760px,100%);max-height:min(92vh,820px);overflow:auto;border-radius:28px;background:#fff;padding:22px;box-shadow:0 30px 90px rgba(2,18,25,.45)}
.qr-camera-modal__header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:16px}.qr-camera-modal__header h3{margin:3px 0 0;font-size:clamp(22px,4vw,32px);color:#083344}.qr-camera-modal__close{width:44px;height:44px;border:0;border-radius:999px;background:#f1f5f9;color:#0f172a;font-size:28px;line-height:1;cursor:pointer}.qr-camera-modal__close:hover{background:#e2e8f0}
.qr-camera-modal .qr-video-frame{aspect-ratio:4/3;border-radius:24px;box-shadow:0 18px 45px rgba(2,18,25,.18)}.qr-camera-modal .qr-camera-placeholder{font-size:16px}.qr-scanner-actions--modal{justify-content:center;margin-top:16px}.qr-scanner-actions--modal .btn{min-width:190px;justify-content:center}
@media(max-width:900px){.qr-scanner-launch-panel{min-height:220px}.qr-camera-modal{padding:16px}.qr-camera-modal__surface{border-radius:24px}}
@media(max-width:560px){.qr-scanner-launch-panel{padding:24px 18px;min-height:0}.qr-scanner-launch-panel .btn{width:100%;min-width:0}.qr-scanner-launch-icon{width:64px;height:64px;border-radius:20px;font-size:32px}.qr-camera-modal{align-items:flex-end;padding:10px}.qr-camera-modal__surface{width:100%;max-height:94vh;border-radius:24px 24px 16px 16px;padding:16px}.qr-camera-modal__header{align-items:center}.qr-camera-modal__close{width:42px;height:42px;flex:0 0 auto}.qr-camera-modal .qr-video-frame{aspect-ratio:3/4;border-radius:20px}.qr-scanner-actions--modal .btn{width:100%}}