/* Sign-in motion: the booking sign-in pop-up rises in slowly, and a sign-in
   step that slides away (app.js slideAuthStage) holds still inside.
   Moving between pages is ui/page-handover.js, never a whole-screen swipe. */
/* The old sign-in step, sliding away, holds still inside. */
.auth-stage-copy,
.auth-stage-copy * { animation: none !important; transition: none !important; }

/* The booking sign-in pop-up arrives slowly: the page dims, then the card
   rises into place (on a phone, the sheet slides up from the bottom). */
body .booking-auth-backdrop { animation: pm-dim .56s ease both; }
body .booking-auth-dialog { animation: pm-card-rise .72s cubic-bezier(.22, 1, .36, 1) both; }
@keyframes pm-dim { from { opacity: 0; } to { opacity: 1; } }
@keyframes pm-card-rise { from { opacity: 0; transform: translate3d(0, 28px, 0) scale(.985); } to { opacity: 1; transform: none; } }
@media (max-width: 760px) {
  body.booking-workspace-mode .booking-auth-dialog { animation: pm-sheet-up .72s cubic-bezier(.22, 1, .36, 1) both; }
  @keyframes pm-sheet-up { from { transform: translate3d(0, 100%, 0); } to { transform: none; } }
}

@media (prefers-reduced-motion: reduce) {
  body .booking-auth-backdrop,
  body .booking-auth-dialog { animation: none; }
}

/* Signed in from booking: the pop-up becomes a check that draws itself, then
   everything fades away onto the booking (app.js celebrateBookingSignIn). */
.signin-celebration-layer { position: fixed; inset: 0; z-index: 10000; }
.signin-celebration-backdrop { position: absolute; inset: 0; background: rgba(31, 25, 45, .56); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.signin-celebration-card {
  position: fixed;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 10px;
  padding: 28px;
  border-radius: 20px;
  background: #fff;
  color: #16151b;
  text-align: center;
  box-shadow: 0 30px 80px -30px rgba(31, 25, 45, .45);
}
.signin-celebration-card > * { animation: signin-rise .6s cubic-bezier(.22, 1, .36, 1) both; }
.signin-celebration-card h2 { margin: 6px 0 0; font-size: 22px; letter-spacing: -.01em; animation-delay: .32s; }
.signin-celebration-card p { max-width: 30ch; margin: 0; color: #5d5966; font-size: 14px; line-height: 1.5; animation-delay: .4s; }
.signin-celebration-mark { display: grid; place-items: center; width: 76px; height: 76px; border-radius: 50%; background: linear-gradient(135deg, #8ff7d2, #93a2f7 50%, #916be8); animation: signin-pop .55s cubic-bezier(.34, 1.56, .64, 1) both; }
.signin-celebration-mark svg { width: 52px; height: 52px; fill: none; stroke: #fff; stroke-width: 3.4; stroke-linecap: round; stroke-linejoin: round; }
.signin-celebration-mark circle { stroke-opacity: .35; stroke-dasharray: 151; stroke-dashoffset: 151; animation: signin-draw .7s .1s cubic-bezier(.65, 0, .35, 1) forwards; }
.signin-celebration-mark path { stroke-dasharray: 34; stroke-dashoffset: 34; animation: signin-draw .45s .42s cubic-bezier(.65, 0, .35, 1) forwards; }
body.booking-site .signin-celebration-card { border-radius: var(--site-card-radius, 20px); background: var(--site-page, #fff); color: var(--site-fg, #16151b); }
body.booking-site .signin-celebration-mark { background: var(--site-fg, #16151b); }
@keyframes signin-draw { to { stroke-dashoffset: 0; } }
@keyframes signin-pop { from { opacity: 0; transform: scale(.6); } to { opacity: 1; transform: none; } }
@keyframes signin-rise { from { opacity: 0; transform: translate3d(0, 8px, 0); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
  .signin-celebration-card > *, .signin-celebration-mark { animation: none; }
  .signin-celebration-mark circle, .signin-celebration-mark path { animation: none; stroke-dashoffset: 0; }
}
