/* Bid2Stay Release 11 — Phase 7 Professional Animations */

/* Core motion tokens */
:root{
  --motion-fast:160ms;
  --motion-base:260ms;
  --motion-slow:520ms;
  --motion-ease:cubic-bezier(.2,.75,.2,1);
  --motion-spring:cubic-bezier(.16,1,.3,1);
}

/* Page entrance */
body{
  animation:b2sPageFade var(--motion-slow) var(--motion-ease) both;
}
@keyframes b2sPageFade{
  from{opacity:0}
  to{opacity:1}
}

/* Section reveal */
[data-animate="reveal"]{
  opacity:0;
  transform:translateY(18px);
  transition:
    opacity var(--motion-slow) var(--motion-ease),
    transform var(--motion-slow) var(--motion-ease);
}
[data-animate="reveal"].is-visible{
  opacity:1;
  transform:translateY(0);
}

/* Cards */
.card,
.guest-card,
.hotel-card,
.admin-card,
.market-card,
.r11-property-card,
.bw-image-card,
.guest-metric,
.hotel-metric,
.admin-metric,
.metric,
.partner-step,
.partner-feature,
.r11-insight-card,
.r11-how-card{
  transition:
    transform var(--motion-base) var(--motion-spring),
    box-shadow var(--motion-base) var(--motion-ease),
    border-color var(--motion-fast) ease;
  will-change:transform;
}
.card:hover,
.guest-card:hover,
.hotel-card:hover,
.admin-card:hover,
.market-card:hover,
.r11-property-card:hover,
.bw-image-card:hover,
.r11-insight-card:hover,
.r11-how-card:hover{
  transform:translateY(-4px);
  box-shadow:0 22px 58px rgba(15,23,42,.13);
}

/* Buttons */
.btn,
button,
a.btn{
  transition:
    transform var(--motion-fast) var(--motion-spring),
    box-shadow var(--motion-fast) ease,
    background-color var(--motion-fast) ease,
    color var(--motion-fast) ease,
    border-color var(--motion-fast) ease;
}
.btn:hover,
button:hover,
a.btn:hover{
  transform:translateY(-1px);
}
.btn:active,
button:active,
a.btn:active{
  transform:translateY(0) scale(.98);
}

/* Navigation */
.sidebar a,
.r11-nav a,
.public-nav a,
.r11-mobile-menu a{
  transition:
    background-color var(--motion-fast) ease,
    color var(--motion-fast) ease,
    transform var(--motion-fast) var(--motion-spring);
}
.sidebar a:hover,
.r11-nav a:hover,
.public-nav a:hover,
.r11-mobile-menu a:hover{
  transform:translateX(3px);
}

/* Tabs */
.tab,
.guest-tab,
.hotel-tab,
.admin-tab,
.view-switch button{
  transition:
    background-color var(--motion-fast) ease,
    color var(--motion-fast) ease,
    border-color var(--motion-fast) ease,
    transform var(--motion-fast) var(--motion-spring);
}
.tab.active,
.guest-tab.active,
.hotel-tab.active,
.admin-tab.active,
.view-switch button.active{
  animation:b2sTabPop 220ms var(--motion-spring);
}
@keyframes b2sTabPop{
  0%{transform:scale(.96)}
  100%{transform:scale(1)}
}

/* Live pulse indicators */
.badge.green,
.guest-status.live,
.hotel-badge.live,
.admin-badge.live,
.market-live,
.r11-live-badge,
.property-status,
.live-dot{
  position:relative;
}
.badge.green::after,
.guest-status.live::after,
.hotel-badge.live::after,
.admin-badge.live::after,
.market-live::after,
.r11-live-badge::after,
.property-status::after,
.live-dot::after{
  content:"";
  position:absolute;
  width:8px;height:8px;
  border-radius:50%;
  background:#12b76a;
  right:-3px;top:-3px;
  animation:b2sPulse 1.8s ease-out infinite;
}
@keyframes b2sPulse{
  0%{box-shadow:0 0 0 0 rgba(18,183,106,.48)}
  70%{box-shadow:0 0 0 9px rgba(18,183,106,0)}
  100%{box-shadow:0 0 0 0 rgba(18,183,106,0)}
}

/* Metric count animation target */
[data-counter]{
  display:inline-block;
  min-width:1ch;
}

/* Offer arrival animation */
.offer-arrival{
  animation:b2sOfferArrival 480ms var(--motion-spring) both;
}
@keyframes b2sOfferArrival{
  0%{opacity:0;transform:translateX(24px) scale(.98)}
  100%{opacity:1;transform:translateX(0) scale(1)}
}

/* Accepted offer */
.accepted-flash{
  animation:b2sAccepted 700ms var(--motion-spring);
}
@keyframes b2sAccepted{
  0%{box-shadow:0 0 0 0 rgba(18,183,106,.4)}
  45%{box-shadow:0 0 0 12px rgba(18,183,106,.12)}
  100%{box-shadow:0 0 0 0 rgba(18,183,106,0)}
}

/* QR verification success */
.qr-success{
  position:relative;
  overflow:hidden;
}
.qr-success::before{
  content:"✓";
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  background:rgba(18,183,106,.92);
  color:#fff;
  font-size:72px;
  font-weight:900;
  animation:b2sQrSuccess 900ms var(--motion-spring) both;
  z-index:20;
}
@keyframes b2sQrSuccess{
  0%{opacity:0;transform:scale(.7)}
  35%{opacity:1;transform:scale(1.04)}
  70%{opacity:1;transform:scale(1)}
  100%{opacity:0;transform:scale(1.08)}
}

/* Toast */
#toast,
.toast{
  transition:
    opacity var(--motion-fast) ease,
    transform var(--motion-base) var(--motion-spring);
}
.toast-enter{
  opacity:0;
  transform:translateY(14px) scale(.97);
}
.toast-enter.toast-show{
  opacity:1;
  transform:translateY(0) scale(1);
}

/* Skeleton loading */
.skeleton,
.skeleton-card,
.loading-skeleton{
  position:relative;
  overflow:hidden;
  background:#edf0f4;
}
.skeleton::after,
.skeleton-card::after,
.loading-skeleton::after{
  content:"";
  position:absolute;
  inset:0;
  transform:translateX(-100%);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.72),transparent);
  animation:b2sShimmer 1.35s infinite;
}
@keyframes b2sShimmer{
  100%{transform:translateX(100%)}
}

/* Progress animation */
.hotel-progress span,
.admin-track span,
.market-acceptance-track span,
.analytics-track span,
.ops-progress span,
.core-progress span{
  transform-origin:left center;
  animation:b2sProgress 850ms var(--motion-spring) both;
}
@keyframes b2sProgress{
  from{transform:scaleX(0)}
  to{transform:scaleX(1)}
}

/* Charts */
.hotel-bar,
.admin-bar,
.analytics-bar,
.r11-property-card .bar,
.bar{
  transform-origin:bottom center;
  animation:b2sBarGrow 760ms var(--motion-spring) both;
}
@keyframes b2sBarGrow{
  from{transform:scaleY(.08);opacity:.2}
  to{transform:scaleY(1);opacity:1}
}

/* Hero content */
.r11-hero-copy,
.market-hero-copy,
.hero-copy{
  animation:b2sHeroCopy 760ms var(--motion-spring) both;
}
.r11-booking-card,
.market-search-card{
  animation:b2sHeroCard 820ms 90ms var(--motion-spring) both;
}
@keyframes b2sHeroCopy{
  from{opacity:0;transform:translateY(24px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes b2sHeroCard{
  from{opacity:0;transform:translateY(28px) scale(.98)}
  to{opacity:1;transform:translateY(0) scale(1)}
}

/* Image hover */
.property-image-wrap img,
.market-card-image img,
.r11-property-image img,
.bw-image-card img,
.partner-preview-image img{
  transition:transform 700ms var(--motion-ease);
}
.property-card:hover .property-image-wrap img,
.market-card:hover .market-card-image img,
.r11-property-card:hover .r11-property-image img,
.bw-image-card:hover img,
.partner-preview-image:hover img{
  transform:scale(1.035);
}

/* Notification bell */
.notification-bell{
  animation:b2sBell 2.8s ease-in-out infinite;
  transform-origin:top center;
}
@keyframes b2sBell{
  0%,88%,100%{transform:rotate(0)}
  91%{transform:rotate(7deg)}
  94%{transform:rotate(-6deg)}
  97%{transform:rotate(3deg)}
}

/* Confirmation burst */
.confirm-burst{
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:9999;
}
.confirm-burst i{
  position:absolute;
  width:8px;height:8px;
  border-radius:2px;
  background:#f5ad16;
  animation:b2sConfetti 850ms ease-out forwards;
}
@keyframes b2sConfetti{
  from{opacity:1;transform:translate(0,0) rotate(0)}
  to{opacity:0;transform:translate(var(--x),var(--y)) rotate(420deg)}
}

/* Accessibility */
@media (prefers-reduced-motion:reduce){
  *,
  *::before,
  *::after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    scroll-behavior:auto!important;
    transition-duration:.001ms!important;
  }
  [data-animate="reveal"]{
    opacity:1!important;
    transform:none!important;
  }
}