/* Exelion Ticketing — front end */
.exl-tk [hidden], .exl-scan [hidden] { display:none !important; }
.exl-tk, .exl-scan { --navy:#0c1633; --gold:#e3c565; --gold-d:#b8962e; --ink:#14172b; --ok:#16a34a; --bad:#dc2626; --warn:#d97706; font-family:-apple-system,"Segoe UI",Roboto,Arial,sans-serif; color:var(--ink); box-sizing:border-box; }
.exl-tk *, .exl-scan * { box-sizing:border-box; }
.exl-btn { display:inline-block; background:var(--navy); color:var(--gold) !important; border:0; padding:11px 16px; font-weight:700; text-decoration:none !important; cursor:pointer; font-size:14px; text-align:center; border-radius:4px; }
.exl-btn-alt { background:#fff; color:var(--navy) !important; border:2px solid var(--navy); padding:9px 14px; }
.exl-btn-wa { background:#128c4a; color:#fff !important; }
.exl-hp { position:absolute !important; left:-9999px !important; width:1px; height:1px; opacity:0; }

/* ---------- Checkout ---------- */
.exl-tk { max-width:520px; margin:0 auto 2em; background:#fff; border:2px solid var(--gold-d); box-shadow:0 12px 36px rgba(12,22,51,.12); }
.exl-tk-head { background:var(--navy); text-align:center; padding:24px 16px 18px; }
.exl-tk-short { color:var(--gold); letter-spacing:.32em; font-weight:700; font-size:13px; }
.exl-tk-year { color:#fff; font-size:34px; font-weight:800; letter-spacing:.12em; line-height:1.1; }
.exl-tk-when { color:#c9cde0; font-size:13px; margin-top:6px; }
.exl-tk-form, .exl-wait, .exl-done, .exl-failed { padding:20px; }
.exl-tk-types { display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:10px; margin-bottom:18px; }
.exl-type { cursor:pointer; position:relative; }
.exl-type input { position:absolute; opacity:0; pointer-events:none; }
.exl-type-card { display:block; border:2px solid #e5e1d4; border-top:6px solid var(--tier); padding:12px; text-align:center; transition:.15s; background:#fff; }
.exl-type input:checked + .exl-type-card { border-color:var(--tier); box-shadow:0 0 0 3px color-mix(in srgb, var(--tier) 25%, transparent); background:#fffdf6; }
.exl-type input:focus-visible + .exl-type-card { outline:2px solid var(--navy); outline-offset:2px; }
.exl-type.is-out { opacity:.45; cursor:not-allowed; }
.exl-type-name { display:block; font-weight:800; letter-spacing:.08em; text-transform:uppercase; font-size:14px; }
.exl-type-price { display:block; font-size:19px; font-weight:800; margin-top:4px; }
.exl-type-left { display:block; font-size:11px; color:var(--bad); margin-top:3px; font-weight:700; }
.exl-field { margin-bottom:14px; }
.exl-field label { display:block; font-size:12px; font-weight:700; letter-spacing:.04em; margin-bottom:5px; color:#4b4b5a; }
.exl-field input { width:100%; padding:12px; font-size:16px; border:1.5px solid #cfcbbd; border-radius:4px; background:#fff; color:var(--ink); }
.exl-field input:focus { outline:none; border-color:var(--navy); box-shadow:0 0 0 3px rgba(12,22,51,.12); }
.exl-stepper { display:flex; max-width:170px; }
.exl-stepper button { width:46px; border:1.5px solid #cfcbbd; background:#f6f3ea; font-size:20px; cursor:pointer; color:var(--ink); }
.exl-stepper input { text-align:center; border-radius:0; border-left:0; border-right:0; -moz-appearance:textfield; }
.exl-stepper input::-webkit-inner-spin-button { -webkit-appearance:none; }
.exl-check { display:flex; gap:8px; align-items:center; font-size:14px; margin:0 0 16px; }
.exl-total { display:flex; justify-content:space-between; align-items:baseline; border-top:1px dashed #d9d3bf; padding-top:14px; margin-bottom:14px; }
.exl-total strong { font-size:22px; }
.exl-pay { width:100%; background:#1b8a3a; color:#fff; border:0; padding:16px; font-size:17px; font-weight:800; border-radius:4px; cursor:pointer; }
.exl-pay:disabled { opacity:.6; cursor:wait; }
.exl-error { color:var(--bad); font-weight:600; margin:12px 0 0; }
.exl-fine { color:#777; font-size:12px; margin:12px 0 0; }
.exl-note { padding:20px; }
.exl-wait, .exl-done, .exl-failed { text-align:center; }
.exl-wait h3, .exl-done h3, .exl-failed h3 { margin:10px 0 6px; font-size:22px; }
.exl-spinner { width:52px; height:52px; border:5px solid #eee7d1; border-top-color:var(--gold-d); border-radius:50%; margin:10px auto; animation:exlspin 1s linear infinite; }
@keyframes exlspin { to { transform:rotate(360deg); } }
.exl-tick { width:64px; height:64px; line-height:64px; border-radius:50%; background:var(--ok); color:#fff; font-size:34px; margin:6px auto; }
.exl-done-list { text-align:left; margin:18px 0; }
.exl-done-tk { display:flex; justify-content:space-between; align-items:center; gap:10px; border:1px solid #e5e1d4; border-left:6px solid var(--tier); padding:10px 12px; margin-bottom:8px; flex-wrap:wrap; }
.exl-done-type { display:block; font-size:11px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:#666; }
.exl-done-serial { font-family:ui-monospace,Menlo,Consolas,monospace; font-weight:800; font-size:16px; }
.exl-done-links { display:flex; gap:6px; }
.exl-done-links .exl-btn { padding:8px 12px; font-size:13px; }
.exl-done-actions { display:flex; gap:8px; justify-content:center; flex-wrap:wrap; }

/* ---------- Scanner ---------- */
.exl-scan { max-width:560px; margin:0 auto; background:#0f1426; color:#eef0f7; padding:14px; border-radius:8px; position:relative; }
.exl-scan-top { display:flex; justify-content:space-between; align-items:center; gap:10px; }
.exl-scan-event { font-weight:800; color:var(--gold); letter-spacing:.04em; }
.exl-scan-user { font-size:12px; color:#9aa3c0; }
.exl-scan-count { text-align:right; line-height:1.1; }
.exl-scan-count strong { display:block; font-size:22px; }
.exl-scan-count span, .exl-scan-count em { font-size:11px; color:#9aa3c0; font-style:normal; display:block; }
.exl-scan-gate { display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap; margin:12px 0; font-size:13px; }
.exl-scan-gate input[type=text] { background:#1b2240; border:1px solid #2e3760; color:#fff; padding:6px 8px; width:120px; border-radius:4px; margin-left:6px; }
.exl-scan-auto { display:flex; gap:6px; align-items:center; }
.exl-scan-cam { background:#000; border-radius:6px; overflow:hidden; text-align:center; }
#exl-reader { width:100%; min-height:10px; }
#exl-reader video { width:100% !important; }
.exl-scan-camtoggle { width:100%; border-radius:0; padding:14px; font-size:16px; }
.exl-scan-manual { margin-top:14px; display:grid; gap:8px; }
.exl-scan-manual-title, .exl-scan-log-title { font-size:12px; text-transform:uppercase; letter-spacing:.1em; color:#9aa3c0; }
.exl-scan-manual input, .exl-res-code input { width:100%; background:#1b2240; border:1px solid #2e3760; color:#fff; padding:12px; font-size:17px; font-family:ui-monospace,Menlo,Consolas,monospace; letter-spacing:.06em; border-radius:4px; text-transform:uppercase; }
.exl-scan-log { margin-top:16px; }
.exl-scan-log ol { list-style:none; margin:6px 0 0; padding:0; font-size:12px; font-family:ui-monospace,Menlo,Consolas,monospace; }
.exl-scan-log li { padding:4px 6px; border-left:4px solid #555; margin-bottom:3px; background:#151b33; }
.exl-scan-log li.is-ok { border-color:var(--ok); } .exl-scan-log li.is-bad { border-color:var(--bad); } .exl-scan-log li.is-warn { border-color:var(--warn); }

.exl-res { position:fixed; inset:0; z-index:99999; display:flex; align-items:center; justify-content:center; padding:16px; overflow:auto; }
.exl-res[hidden] { display:none; }
.exl-res.is-ok { background:#0f7a36; } .exl-res.is-bad { background:#b91c1c; } .exl-res.is-warn { background:#b45309; }
.exl-res-inner { width:100%; max-width:460px; color:#fff; text-align:center; }
.exl-res-icon { font-size:72px; font-weight:900; line-height:1; }
.exl-res-title { font-size:30px; font-weight:900; letter-spacing:.04em; margin:6px 0; }
.exl-res-msg { font-size:16px; margin-bottom:10px; opacity:.95; }
.exl-res-card { background:#fff; color:var(--ink); border-radius:6px; padding:14px; text-align:left; margin:12px 0; }
.exl-res-event { font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:#666; }
.exl-res-type { display:inline-block; color:#fff; font-weight:900; letter-spacing:.14em; padding:4px 10px; margin:6px 0; text-transform:uppercase; }
.exl-res-serial { font-family:ui-monospace,Menlo,Consolas,monospace; font-size:22px; font-weight:800; }
.exl-res-name { font-size:20px; font-weight:700; margin:2px 0 8px; }
.exl-res-card dl { display:grid; grid-template-columns:auto 1fr; gap:4px 12px; margin:0; font-size:14px; }
.exl-res-card dt { color:#777; } .exl-res-card dd { margin:0; font-weight:700; }
.exl-res-card [hidden] { display:none; }
.exl-res-code { display:grid; gap:8px; text-align:left; margin:10px 0; }
.exl-res-code label { font-weight:700; }
.exl-admit { width:100%; background:#fff; color:#0f7a36; border:0; font-size:22px; font-weight:900; padding:18px; border-radius:6px; margin:8px 0; cursor:pointer; letter-spacing:.06em; }
.exl-next { width:100%; background:rgba(0,0,0,.25); color:#fff; border:2px solid rgba(255,255,255,.6); font-size:17px; font-weight:700; padding:14px; border-radius:6px; cursor:pointer; }
.exl-scan-login { text-align:center; padding:2em 1em; }