/* css/ss-pages/auth-tickets.css - the Safety night for sign in, create account, forgot password,
   /tickets and /my-tickets (loaded by INFO["ss_css"] = "auth-tickets"). Extends the core components only;
   every selector starts with ss- and stays inside .ss-main. Served byte for byte (css/ss-pages/main.mdk). */

/* moved from the core (css/ss-pages/safety-site.css) by RD/tools/css_split.py, review 2026-10-05:
   the rules below are used only by the pages that load this partial; they keep their core order */
.ss-form-links { display: grid; gap: 6px; margin-top: 6px; color: var(--ss-muted); font-size: 14px; }
.ss-banner { margin: 0 0 18px; padding: 14px 16px; border-radius: 14px; border: 1px solid rgba(242, 201, 135, 0.5); background: rgba(242, 201, 135, 0.08); color: var(--ss-cream); font-size: 15px; }
.ss-banner.is-bad { border-color: rgba(240, 163, 163, 0.6); background: rgba(240, 163, 163, 0.08); }
/* end of the rules moved from the core */

/* page head: centred over the form card */
.ss-main .ss-auth-head { text-align: center; padding-bottom: clamp(8px, 2vw, 20px); }
.ss-main .ss-auth-head::before { left: 15%; width: 70%; }
.ss-main .ss-auth-head .ss-lede { max-width: 560px; margin-left: auto; margin-right: auto; }
/* no darkening band at the foot of the head: over the ambient night it ended in a hard seam */
.ss-main .ss-auth-head::after { display: none; }

/* the card section sits close under the head; the moon glows behind the card, centred
   (the core rule centres it with translateX(-50%), which the breathe animation's transform replaces) */
.ss-main .ss-auth { padding-top: clamp(20px, 3vw, 36px); }
.ss-main .ss-auth .ss-form-moon { top: -40px; left: 0; right: 0; margin: 0 auto; transform: none; }
.ss-main .ss-auth .ss-glass-narrow { max-width: 480px; }

/* the note above a form when a ticket code is being carried through */
.ss-main .ss-auth-note { display: flex; gap: 10px; align-items: flex-start; }
.ss-main .ss-auth-note .ss-ico { flex: 0 0 auto; width: 20px; height: 20px; margin-top: 1px; color: var(--ss-amber-hi); }
.ss-main .ss-auth-note.is-bad .ss-ico { color: var(--ss-bad); }
.ss-main .ss-auth-hint { margin: 0; }
.ss-main .ss-auth .ss-form-links { text-align: center; margin-top: 4px; }
.ss-main .ss-auth .ss-form > .ss-btn-primary { width: 100%; }

/* centred text cards (forgot password, no tickets yet) */
.ss-main .ss-auth-center, .ss-main .ss-mt-empty { text-align: center; }
.ss-main .ss-auth-icon { margin: 0 auto 16px; }
.ss-main .ss-auth-copy { margin: 0 0 22px; color: var(--ss-ink); font-size: 17px; line-height: 1.6; }
.ss-main .ss-auth-actions { justify-content: center; }

/* the ticket-code card: wider, centred heading, the field and the button on one row (mockup-04) */
.ss-main .ss-glass-ticket { max-width: 760px; margin: 0 auto; text-align: center; }
.ss-main .ss-glass-ticket .ss-auth-card-h { margin: 0 0 22px; }
.ss-main .ss-glass-ticket .ss-banner { max-width: 560px; margin: 0 auto 18px; text-align: left; }
.ss-main .ss-glass-ticket .ss-auth-hint { text-align: center; }
.ss-main .ss-ticket-form { max-width: 560px; margin: 0 auto; }
.ss-main .ss-ticket-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: stretch; }
.ss-main .ss-ticket-row .ss-input { font-family: var(--ss-mono); letter-spacing: 0.04em; }
@media (max-width: 620px) {
  .ss-main .ss-ticket-row { grid-template-columns: minmax(0, 1fr); }
  .ss-main .ss-ticket-row .ss-btn { width: 100%; }
}

/* My Tickets list */
.ss-main .ss-auth-list { padding-bottom: 0; }
.ss-main .ss-mt-list { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); margin: 0; padding: 0; list-style: none; }
.ss-main .ss-mt-card h3 { font-size: 22px; word-break: break-word; }
.ss-main .ss-mt-ref { font-family: var(--ss-mono); font-size: 0.78em; font-weight: 500; letter-spacing: 0.04em; color: var(--ss-amber-hi); }
.ss-main .ss-mt-empty { max-width: 560px; margin: 0 auto; }
.ss-main .ss-mt-state { max-width: 560px; margin: 0 auto; }
