/* Calm controls shared by QURA Web and Passline. */
:root{--control-line:var(--line,#34383f);--control-text:var(--fg,var(--white,#f5f5f5));--control-wash:rgba(150,160,180,.08)}
button,a.btn,a.button,a.primary,a.secondary,a.account,a.local-pill{
 background:transparent!important;color:var(--control-text)!important;border:1px solid var(--control-line)!important;box-shadow:none!important;
}
button:hover,a.btn:hover,a.button:hover,a.primary:hover,a.secondary:hover,a.account:hover,a.local-pill:hover{background:var(--control-wash)!important;border-color:var(--control-text)!important;box-shadow:none!important;filter:none!important}
button:focus-visible,a.btn:focus-visible,a.button:focus-visible,a.primary:focus-visible,a.secondary:focus-visible,a.account:focus-visible{outline:2px solid var(--control-text);outline-offset:3px}
button:disabled{opacity:.5;cursor:not-allowed;filter:none}
.tabs button{border-radius:0;padding:10px 14px;margin-block:8px}

/* Header actions stay light and compact, including on touch screens. */
.top .header-icon,.top .header-icon:hover,.top .header-icon[aria-pressed=true]{background:transparent!important;border:0!important;box-shadow:none!important;color:var(--white,#f5f5f5)!important;filter:none;display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;min-width:44px;padding:0;border-radius:6px;text-decoration:none;flex:0 0 44px}
.top .header-icon:hover{opacity:.72}
.top .header-icon:focus-visible{outline:2px solid currentColor;outline-offset:1px}
.top .header-icon svg{display:block;flex:none}
.top .top-actions,.top .account{display:flex;align-items:center;gap:2px;flex-wrap:nowrap}
.top .header-identity{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.top{justify-content:space-between}
@media(max-width:600px){.top{gap:4px;padding:10px 16px;min-height:72px}.top .top-actions{margin-left:auto;justify-content:flex-end;gap:0}.top .account{gap:0}.top .brand{margin-right:8px}.top .header-icon{width:44px;min-width:44px}}

/* Only theme and account remain next to the wordmark. */
.top{flex-wrap:nowrap!important;min-height:64px;height:64px;padding:8px 20px;gap:8px}
.top .top-actions{flex:0 0 auto;margin-left:auto}
.top .header-icon svg{width:19px;height:19px}
.passline-footer{display:flex;justify-content:center;align-items:center;gap:16px;flex-wrap:wrap;padding:20px 16px calc(20px + env(safe-area-inset-bottom));border-top:1px solid var(--line);color:var(--muted)}
.passline-footer .header-icon,.passline-footer .header-icon:hover{display:inline-flex;align-items:center;justify-content:center;flex-direction:column;gap:6px;min-width:44px;min-height:44px;padding:6px;border:0!important;background:transparent!important;box-shadow:none;color:inherit!important;text-decoration:none;font-size:10px;line-height:1.3}
.passline-footer .header-icon:after{content:attr(aria-label)}
.passline-footer .header-icon svg{width:18px;height:18px}
.passline-footer .header-icon:focus-visible{outline:2px solid currentColor;outline-offset:3px}
@media(max-width:600px){.top{padding:8px 14px}.top .brand-official .qura-vector{width:28px;height:28px;flex-basis:28px}.top .brand-official .qura-wordmark{font-size:14px}.top .brand{gap:9px;margin-right:0}.passline-footer{gap:10px}}

.passline-footer{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,90px);justify-content:center;align-items:start;gap:8px;width:100%;box-sizing:border-box}
.passline-footer .header-icon{width:100%;min-width:0;box-sizing:border-box;margin:0;font-size:11px;line-height:1.4;white-space:nowrap}
.passline-footer .header-icon:after{content:attr(data-footer-label)}
#tabs.tabs{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:24px;padding:0 20px;scrollbar-width:none;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
#tabs.tabs::-webkit-scrollbar{display:none}
#tabs.tabs button,#tabs.tabs button:hover{background:transparent!important;color:var(--muted)!important;border:0!important;border-bottom:2px solid transparent!important;border-radius:0;margin:0;padding:16px 0;flex:0 0 auto;white-space:nowrap;box-shadow:none;font-size:13px}
#tabs.tabs button.active{color:var(--white)!important;border-bottom-color:var(--white)!important}
#content button,#content a.secondary{border-radius:6px;padding:10px 14px;font-size:13px;box-shadow:none}
#content button.secondary,#content a.secondary,#content button.danger,#content button.icon-button,#content button.text-button{background:transparent!important;color:var(--white)!important;border:1px solid var(--control-line)!important}
#content button.secondary:hover,#content a.secondary:hover,#content button.danger:hover{background:var(--panel-soft)!important;border-color:var(--white)!important}
#content button.primary{background:transparent!important;color:var(--control-text)!important;border:1px solid var(--control-line)!important}
#app .hero{position:relative;isolation:isolate;overflow:hidden;min-height:170px;box-sizing:border-box;padding:28px 24px}
#app .event-backdrop{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:-2;pointer-events:none}
#app .hero.has-event-backdrop:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.8),rgba(0,0,0,.45));z-index:-1;pointer-events:none}
#app .hero.has-event-backdrop h1{color:#fff}
#app .hero.has-event-backdrop .subtle,#app .hero.has-event-backdrop .eyebrow{color:#e5e5e5}
@media(max-width:600px){#app .hero{padding:24px 16px;min-height:155px}#tabs.tabs{gap:22px;padding-inline:16px}.passline-footer{padding-inline:12px;gap:4px}}

/* Visual guide only: decoding still uses the complete camera frame. */
.scanner-camera{position:relative;overflow:hidden;border-radius:10px;background:#080808;margin:16px auto;max-width:480px}
.scanner-camera:has(video[hidden]){display:none}
.scanner-camera #video{display:block;width:100%;height:auto;max-height:55svh;object-fit:contain;margin:0;border-radius:0}
.scanner-camera #video[hidden]{display:none}
.scanner-guide{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);width:86%;max-height:86%;aspect-ratio:1;box-sizing:border-box;border:2px solid rgba(255,255,255,.9);border-radius:12px;box-shadow:0 0 0 100vmax rgba(0,0,0,.32);pointer-events:none}
.scanner-guide:after{content:'';position:absolute;inset:-3px;border:1px solid rgba(0,0,0,.4);border-radius:13px}
.tickets-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:20px 0}
.tickets-heading h2{margin:0;display:flex;align-items:center;gap:8px}
.tickets-table td{vertical-align:top}
.tickets-table td.actions{display:table-cell}
.tickets-table td.actions button{margin:0 6px 8px 0}
@media(max-width:700px){
 .tickets-card .table-wrap{overflow:visible}
 .tickets-table,.tickets-table tbody{display:block;width:100%;min-width:0}
 .tickets-table thead{display:none}
 .tickets-table tr{display:grid;grid-template-columns:1fr;gap:16px;border:1px solid var(--line);border-radius:10px;padding:18px;margin:0 0 14px}
 .tickets-table td,.tickets-table td.actions{display:block;width:auto;min-width:0;padding:0;border:0;white-space:normal;overflow-wrap:anywhere;text-align:left}
 .tickets-table td:before{content:attr(data-label);display:block;font-size:11px;color:var(--muted);margin-bottom:6px;letter-spacing:.04em}
 .tickets-table td small{display:inline-block;margin-top:5px;line-height:1.6}
 .tickets-table td.actions button{margin-bottom:0}
 .tickets-heading h2{font-size:21px}
}

/* Keep the footer at the bottom of short mobile screens without covering content. */
body:has(.passline-footer){min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}
body:has(.passline-footer)>main{flex:1 0 auto;min-width:0;display:flex;flex-direction:column}
body:has(.passline-footer) #app{flex:1 0 auto;min-width:0}
.passline-footer{margin-top:auto;flex:none}

/* The navigation is a single swipeable row on phones and tablets. */
@media(max-width:1099px){
 #tabs.tabs{width:100%;max-width:100vw;flex:none;overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;touch-action:pan-x;-webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain}
 #tabs.tabs button{flex:none;min-height:48px}
 #content{min-width:0}
}
@media(max-width:600px){
 .passline-footer{min-height:76px}
 #content .scanner{width:100%}
 #content .scanner .row{min-width:0}
 #content .scanner .row input{min-width:0;flex:1 1 150px}
}

/* Keep the desktop shell the same width across short and dense sections. */
@media(min-width:1100px){
 body:has(.passline-footer)>main{width:100%}
 #app{width:min(100%,1600px);max-width:1600px;grid-template-columns:215px minmax(0,1fr)}
 #app>.hero,#app>#content{min-width:0;width:100%}
}

.boot-screen{position:fixed;inset:0;z-index:20;display:grid;place-items:center;background:var(--bg);color:var(--white);padding:24px}
.boot-screen[hidden]{display:none}
.boot-content{width:min(100%,320px);display:grid;justify-items:center;gap:18px;text-align:center}
.boot-logo{display:flex;align-items:center;gap:14px;font-family:Michroma,sans-serif;letter-spacing:.16em;font-size:20px}
.boot-logo img{width:40px;height:40px;animation:boot-turn .58s cubic-bezier(.65,0,.25,1) infinite}
@keyframes boot-turn{to{transform:rotate(360deg)}}
.boot-content p{margin:0;color:var(--muted);font-size:13px}
.boot-progress{width:100%;height:2px;overflow:hidden;background:var(--line)}
.boot-progress:after{content:'';display:block;width:38%;height:100%;background:var(--white);animation:boot-move 1.2s ease-in-out infinite alternate}
@keyframes boot-move{from{transform:translateX(-100%)}to{transform:translateX(270%)}}
.loading-panel{display:grid;justify-items:center;gap:12px;min-height:170px;align-content:center;color:var(--muted);font-size:13px}
.loading-panel .boot-progress{width:130px}
.entry-type-row .type-discount-setting{grid-column:1/-2;grid-row:2;align-self:center}
.entry-type-row .type-discount-setting[hidden]{display:none}
.entry-type-row .icon-button{grid-column:-2;grid-row:2}
@media(max-width:620px){.entry-type-row .type-discount-setting{grid-column:1/-1;grid-row:3}.entry-type-row .icon-button{grid-column:3;grid-row:2}}
@media(prefers-reduced-motion:reduce){.boot-progress:after{animation:none;width:100%}.boot-logo img{animation:none}}