/* Park It Kiosk Admin - sign-in, 2FA, forgot/reset, installer, email-confirm. Glow theme. */
@font-face { font-family: 'Manrope'; font-style: normal; font-weight: 400 800; font-display: swap; src: url('/g/assets/fonts/manrope.woff2') format('woff2'); }
* { box-sizing: border-box; }
html { background: #1A1620; }
html, body { height: 100%; overflow: hidden; } body { margin: 0; background: radial-gradient(circle at 80% 12%, rgba(255,184,74,.22), transparent 42%), #1A1620; font-family: 'Manrope', "Helvetica Neue", Helvetica, Arial, sans-serif; color: #FFF7EA; }
a { color: #B9A9A0; } a:hover { color: #FFB84A; }
input, select, button { font-family: inherit; font-size: 14px; }
input:focus { outline: 2px solid #FFB84A; outline-offset: -1px; }
::placeholder { color: #6E6274; }
/* one viewport, no scroll: the form block is centred on the screen (equal top/bottom space keeps it clear of the fixed footer) */
.auth-wrap { height: 100svh; height: 100dvh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 26px; padding: 84px 20px; overflow: hidden; }
@media (max-height: 640px) { .auth-wrap { gap: 16px; padding: 56px 20px; } }
.auth-brand { font-size: 32px; font-weight: 800; letter-spacing: -1px; line-height: 1; } .auth-brand .it { background: linear-gradient(135deg, #FFB84A, #FF7A59); -webkit-background-clip: text; background-clip: text; color: transparent; }
.auth-title { text-align: center; font-size: 16px; font-weight: 700; color: #FFF7EA; letter-spacing: -.2px; }
.auth-title span { display: block; font-size: 12.5px; font-weight: 500; color: #B9A9A0; margin-top: 6px; letter-spacing: 0; text-transform: none; }
.auth-card { display: flex; flex-direction: column; gap: 12px; width: 320px; max-width: 92vw; }
.auth-card.wide { width: 380px; }
.auth-card label { font-size: 11px; font-weight: 700; color: #B9A9A0; display: flex; flex-direction: column; gap: 6px; }
.auth-card input { padding: 14px 18px; background: #272030; border: 1px solid #3A3146; border-radius: 999px; color: #FFF7EA; font-size: 15px; width: 100%; }
.auth-card input[type="checkbox"] { width: 16px; height: 16px; padding: 0; border-radius: 4px; accent-color: #FFB84A; }
.code-input { text-align: center; font-size: 28px !important; letter-spacing: 12px; color: #FFB84A !important; font-weight: 800; }
.err-msg { color: #FF8A80; font-size: 12.5px; margin: 0; text-align: center; line-height: 1.5; }
.ok-msg { color: #8BE39B; font-size: 12.5px; margin: 0; text-align: center; line-height: 1.5; }
.dim-msg { color: #B9A9A0; font-size: 12.5px; margin: 0; text-align: center; line-height: 1.6; }
.foot-note { font-size: 12px; color: #8E8190; text-align: center; line-height: 1.9; margin: 0; }
.foot-note a { color: #B9A9A0; text-decoration: none; } .foot-note a:hover { color: #FFB84A; }
.btn, .btn-y { display: inline-flex; align-items: center; justify-content: center; text-align: center; padding: 14px 18px; font-size: 14px; font-weight: 700; cursor: pointer; text-decoration: none; border: 1px solid #3A3146; border-radius: 999px; color: #FFF7EA; background: #272030; }
.btn:hover { border-color: #FFB84A; }
.btn-y { background: linear-gradient(135deg, #FFB84A, #FF7A59); border-color: transparent; color: #1A1620; font-weight: 800; box-shadow: 0 8px 24px rgba(255,184,74,.3); }
.btn-y:hover { filter: brightness(1.06); }
.block { display: flex; width: 100%; }
button:disabled { background: #272030 !important; border-color: #3A3146 !important; color: #6E6274 !important; box-shadow: none !important; cursor: default; }
.site-foot { position: fixed; bottom: 0; left: 0; right: 0; text-align: center; font-size: 11px; line-height: 1.9; color: #8E8190; padding: 18px 16px 22px; }
.site-foot a { color: #8E8190; text-decoration: none; } .site-foot a:hover { color: #B9A9A0; }
@keyframes pspin { to { transform: rotate(360deg); } }
button.loading { position: relative; color: transparent !important; pointer-events: none; }
button.loading::after { content: ""; position: absolute; left: 50%; top: 50%; width: 16px; height: 16px; margin: -8px 0 0 -8px; border-radius: 50%; border: 2px solid rgba(26,22,32,.2); border-top-color: #1A1620; animation: pspin .8s linear infinite; }
.btn.loading::after { border-color: rgba(255,247,234,.2); border-top-color: #FFF7EA; }
@media (min-width: 2200px) { html { zoom: 1.25; } } @media (min-width: 3000px) { html { zoom: 1.5; } }
