/* /q/ — Qased's booth QR page. At the venue: the registration, under the form's own header, in Qased's green on
   ivory. The note (checking, away, refused, no fix, sent) carries the group lockup with Qased's own logo. */
@font-face{font-family:Thmanyah;font-weight:400;font-display:swap;src:url('/fonts/thmanyah-sans-400.woff2') format('woff2')}
@font-face{font-family:Thmanyah;font-weight:700;font-display:swap;src:url('/fonts/thmanyah-sans-700.woff2') format('woff2')}
:root{color-scheme:light}
html,body{margin:0;min-height:100%;background:#FBF8F0}
body{display:flex;align-items:center;justify-content:center;min-height:100vh;min-height:100svh;font-family:Thmanyah,system-ui,-apple-system,'Segoe UI',sans-serif}
[hidden]{display:none!important}
.again:focus-visible,.send:focus-visible{outline:3px solid #B4936F;outline-offset:3px}
.note{box-sizing:border-box;width:100%;max-width:440px;padding:32px 24px;text-align:center;color:#1D1B17}
.lockup{display:flex;align-items:center;justify-content:center;gap:16px;margin:0 0 44px}
.lockup .g{height:34px}
.lockup .q{height:62px}
.lockup i{width:1px;height:46px;background:rgba(29,27,23,.22)}
.note h1{margin:0 0 12px;font-size:26px;font-weight:700;line-height:1.45;text-wrap:balance;color:#0D563E}
.note p{margin:0;font-size:18px;line-height:1.75;color:rgba(29,27,23,.72);text-wrap:balance}
.note.checking h1{color:#8A6A4A}
/* a refused visitor's steps, for their own phone: numbered in Qased's green, on a faint green card */
.steps{margin:22px 0 0;padding:18px 18px 18px 14px;list-style:none;counter-reset:s;text-align:right;background:rgba(13,86,62,.06);border:1px solid rgba(13,86,62,.14);border-radius:14px}
.steps li{position:relative;counter-increment:s;padding-right:38px;font-size:16px;line-height:1.7;color:#1D1B17}
.steps li+li{margin-top:10px}
.steps li::before{content:counter(s);position:absolute;right:0;top:1px;width:26px;height:26px;border-radius:50%;background:#0D563E;color:#FBF8F0;font-size:14px;font-weight:700;line-height:26px;text-align:center}
/* refused again after «أعد المحاولة»: the steps are all that is left, so their card turns gold */
.note.blocked .steps{background:rgba(180,147,111,.14);border:2px solid #B4936F}
.again{margin-top:30px;min-height:56px;padding:0 34px;border:0;border-radius:14px;background:#0D563E;color:#FBF8F0;font:700 19px Thmanyah,system-ui,sans-serif;cursor:pointer}

/* the registration: the page scrolls from the top once it shows */
body.form{display:block}
.reg{box-sizing:border-box;width:100%;max-width:560px;margin:0 auto;padding:16px 16px 40px;color:#1D1B17}
.banner{display:block;width:100%;height:auto;aspect-ratio:4/1;border-radius:14px;background:#0D563E}
.card{margin-top:12px;padding:24px 20px 26px;background:#fff;border:1px solid rgba(13,86,62,.14);border-top:8px solid #0D563E;border-radius:14px}
.card h1{margin:0 0 10px;font-size:24px;font-weight:700;line-height:1.45;color:#0D563E;text-wrap:balance}
.card>p{margin:0;font-size:16px;line-height:1.8;color:rgba(29,27,23,.72)}
.field{margin:24px 0 0;padding:0;border:0;min-width:0}
.field>label:not(.opt),.field legend{display:block;margin:0 0 10px;padding:0;font-size:17px;font-weight:700;line-height:1.5}
/* 17px: an iPhone zooms into any field under 16px */
.field input[type=text],.field input[type=tel]{box-sizing:border-box;width:100%;min-height:52px;padding:0 14px;border:1px solid rgba(29,27,23,.22);border-radius:12px;background:#FBF8F0;color:#1D1B17;font:400 17px Thmanyah,system-ui,-apple-system,'Segoe UI',sans-serif}
.field input[dir=ltr]{text-align:right}
.field input::placeholder{color:rgba(29,27,23,.38)}
.field input:focus{outline:none;border-color:#0D563E;box-shadow:0 0 0 3px rgba(180,147,111,.45)}
.opts{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.opt{display:flex;align-items:center;gap:12px;min-height:52px;padding:0 14px;border:1px solid rgba(29,27,23,.18);border-radius:12px;background:#FBF8F0;font-size:17px;cursor:pointer}
.opt input{flex:none;width:20px;height:20px;margin:0;accent-color:#0D563E}
.opt:has(input:checked){border-color:#0D563E;background:rgba(13,86,62,.07);font-weight:700}
.opt:has(input:focus-visible){box-shadow:0 0 0 3px rgba(180,147,111,.45)}
.err{display:block;margin-top:8px;font-size:15px;line-height:1.5;color:#B3261E}
.field.bad input[type=text],.field.bad input[type=tel],.field.bad .opt{border-color:rgba(179,38,30,.6)}
.fail{margin:20px 0 0;font-size:15px;line-height:1.6;color:#B3261E;text-align:center}
.send{display:block;width:100%;margin-top:28px;min-height:56px;border:0;border-radius:14px;background:#0D563E;color:#FBF8F0;font:700 19px Thmanyah,system-ui,-apple-system,'Segoe UI',sans-serif;cursor:pointer}
.send:disabled{opacity:.6;cursor:default}
