/* ======================================================
   LES AMIGOS — PRO MOTION FINAL
   Motion system, depth, hover, focus, responsive polish
   ====================================================== */
:root{
  --motion-fast:160ms;
  --motion-med:260ms;
  --motion-slow:520ms;
  --ease-out:cubic-bezier(.22,.61,.36,1);
  --ease-spring:cubic-bezier(.2,.9,.25,1.25);
  --focus-ring:0 0 0 3px rgba(99,232,255,.16),0 0 0 1px rgba(99,232,255,.34) inset;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  overflow-x:hidden;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}

/* Ambient background */
body::before{
  will-change:background-position;
  animation:proAmbientDrift 34s linear infinite!important;
}
@keyframes proAmbientDrift{
  0%{background-position:0 0,0 0,0 0}
  50%{background-position:120px 70px,-90px 110px,80px -60px}
  100%{background-position:240px 140px,-180px 220px,160px -120px}
}

/* Page entrance */
main,.public-main,.app-shell{
  animation:proPageIn .55s var(--ease-out) both;
}
@keyframes proPageIn{
  from{opacity:0;transform:translateY(12px)}
  to{opacity:1;transform:none}
}

/* Nav */
.public-topnav.final-topnav{
  transition:transform var(--motion-med) var(--ease-out),
             box-shadow var(--motion-med) var(--ease-out),
             border-color var(--motion-med) var(--ease-out)!important;
}
.public-topnav.final-topnav:hover{
  transform:translateY(-1px);
  box-shadow:0 26px 90px rgba(0,0,0,.36),0 0 70px rgba(79,130,255,.12)!important;
}
.public-tab,.public-ghost-btn,.public-cta-btn,.btn,.nav-btn,.pronos-filter,.admin-chip{
  position:relative;
  overflow:hidden;
  transition:
    transform var(--motion-fast) var(--ease-out),
    box-shadow var(--motion-fast) var(--ease-out),
    border-color var(--motion-fast) var(--ease-out),
    background var(--motion-fast) var(--ease-out),
    color var(--motion-fast) var(--ease-out)!important;
}
.public-tab:hover,.public-ghost-btn:hover,.public-cta-btn:hover,.btn:hover,.nav-btn:hover,.pronos-filter:hover,.admin-chip:hover{
  transform:translateY(-2px);
}
.public-tab:active,.public-ghost-btn:active,.public-cta-btn:active,.btn:active,.nav-btn:active,.pronos-filter:active,.admin-chip:active{
  transform:translateY(0) scale(.985);
}

/* Card polish */
.card,.public-card,.omni-card,.admin-panel,.prono-card,.community-match,.achievement-card,.record-card{
  transition:
    transform var(--motion-med) var(--ease-out),
    box-shadow var(--motion-med) var(--ease-out),
    border-color var(--motion-med) var(--ease-out),
    background var(--motion-med) var(--ease-out)!important;
}
.card:hover,.public-card:hover,.omni-card:hover,.admin-panel:hover,.prono-card:hover,.community-match:hover,.achievement-card:hover,.record-card:hover{
  transform:translateY(-3px);
  border-color:rgba(112,205,255,.17)!important;
  box-shadow:0 30px 90px rgba(0,0,0,.27),0 0 50px rgba(79,130,255,.055)!important;
}

/* Inputs */
input,select,textarea{
  transition:
    border-color var(--motion-fast) var(--ease-out),
    box-shadow var(--motion-fast) var(--ease-out),
    background var(--motion-fast) var(--ease-out)!important;
}
input:focus,select:focus,textarea:focus{
  outline:none!important;
  border-color:rgba(99,232,255,.34)!important;
  box-shadow:var(--focus-ring)!important;
}
button:focus-visible,a:focus-visible{
  outline:none!important;
  box-shadow:var(--focus-ring)!important;
}

/* Hero shimmer */
.apex-hero-pro,.pronos-hero,.admin-hero,.admin-login-card,.mp-signup-card,.mp-auth-card{
  position:relative;
  isolation:isolate;
}
.apex-hero-pro::after,.pronos-hero::after,.admin-hero::after,.admin-login-card::after{
  content:"";
  position:absolute;
  inset:-40%;
  z-index:-1;
  background:conic-gradient(from 190deg,transparent,rgba(108,225,255,.055),transparent 22%,rgba(124,91,255,.05),transparent 44%);
  animation:proHaloRotate 18s linear infinite;
}
@keyframes proHaloRotate{to{transform:rotate(360deg)}}

/* Floating emblem */
.public-brand-mark,.final-brand-mark{
  animation:proBrandFloat 5.5s ease-in-out infinite;
  transform-origin:center;
}
@keyframes proBrandFloat{
  0%,100%{transform:translateY(0) rotate(0deg)}
  50%{transform:translateY(-2px) rotate(2deg)}
}

/* Section reveal helpers */
.pro-reveal{
  opacity:0;
  transform:translateY(18px) scale(.992);
}
.pro-reveal.is-visible{
  opacity:1;
  transform:none;
  transition:opacity .55s var(--ease-out),transform .55s var(--ease-out);
}
.pro-reveal-delay-1{transition-delay:70ms!important}
.pro-reveal-delay-2{transition-delay:140ms!important}
.pro-reveal-delay-3{transition-delay:210ms!important}

/* Skeleton */
.pro-skeleton{
  position:relative;
  overflow:hidden!important;
  background:rgba(255,255,255,.025)!important;
}
.pro-skeleton::after{
  content:"";
  position:absolute;
  inset:0;
  transform:translateX(-110%);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.06),transparent);
  animation:proShimmer 1.4s infinite;
}
@keyframes proShimmer{to{transform:translateX(110%)}}

/* Toasts */
.pro-toast-stack{
  position:fixed;
  top:96px;
  right:18px;
  z-index:99999;
  display:grid;
  gap:9px;
  width:min(360px,calc(100vw - 28px));
}
.pro-toast{
  padding:12px 14px;
  border-radius:16px;
  border:1px solid rgba(141,186,255,.12);
  background:rgba(5,16,41,.94);
  backdrop-filter:blur(18px);
  box-shadow:0 20px 60px rgba(0,0,0,.35);
  color:#eaf2ff;
  animation:proToastIn .28s var(--ease-spring) both;
}
.pro-toast.success{border-color:rgba(89,223,168,.20)}
.pro-toast.error{border-color:rgba(255,113,135,.20)}
.pro-toast strong,.pro-toast small{display:block}
.pro-toast small{margin-top:3px;color:#8196b8}
@keyframes proToastIn{
  from{opacity:0;transform:translateX(20px) scale(.97)}
  to{opacity:1;transform:none}
}
.pro-toast.out{
  animation:proToastOut .22s ease forwards;
}
@keyframes proToastOut{to{opacity:0;transform:translateX(20px) scale(.97)}}

/* Progress bar top */
.pro-route-progress{
  position:fixed;
  left:0;top:0;
  z-index:100000;
  height:3px;
  width:0;
  background:linear-gradient(90deg,#7b5cff,#4c86ff,#64eaff);
  box-shadow:0 0 16px rgba(99,232,255,.55);
  transition:width .2s ease;
}

/* Pronostics */
.prono-status.open{
  animation:proOpenPulse 2.2s ease-in-out infinite;
}
@keyframes proOpenPulse{
  0%,100%{box-shadow:0 0 0 0 rgba(89,223,168,.04)}
  50%{box-shadow:0 0 0 5px rgba(89,223,168,.025)}
}
.prono-card.locked{
  filter:saturate(.84);
}
.prono-card.locked .prono-status.locked{
  animation:proLockPop .35s var(--ease-spring) both;
}
@keyframes proLockPop{
  from{transform:scale(.92);opacity:.5}
  to{transform:none;opacity:1}
}

/* Admin dashboard */
.admin-kpi{
  overflow:hidden;
}
.admin-kpi::after{
  content:"";
  position:absolute;
  width:120px;height:120px;
  right:-50px;bottom:-70px;
  border-radius:50%;
  background:rgba(94,224,255,.045);
  filter:blur(8px);
  transition:transform .4s var(--ease-out);
}
.admin-kpi:hover::after{transform:scale(1.35)}
.admin-bar-fill{
  transform-origin:left;
  animation:proBarGrow .8s var(--ease-out) both;
}
@keyframes proBarGrow{
  from{transform:scaleX(0)}
  to{transform:scaleX(1)}
}

/* Avatar preview */
.mp-avatar-preview svg,.mp-avatar-preview img{
  transition:transform .28s var(--ease-out),filter .28s var(--ease-out);
}
.mp-avatar-preview:hover svg,.mp-avatar-preview:hover img{
  transform:scale(1.025) rotate(.4deg);
  filter:drop-shadow(0 18px 28px rgba(80,130,255,.15));
}

/* Chat */
.signature-chat-panel{
  transform-origin:bottom right;
}
.signature-chat-panel[aria-hidden="false"],
.signature-chat-panel.open,
.signature-chat-panel.is-open{
  animation:proChatOpen .28s var(--ease-spring) both;
}
@keyframes proChatOpen{
  from{opacity:0;transform:translateY(14px) scale(.96)}
  to{opacity:1;transform:none}
}
.signature-chat-fab{
  transition:transform var(--motion-fast) var(--ease-out),box-shadow var(--motion-fast) var(--ease-out)!important;
}
.signature-chat-fab:hover{transform:translateY(-3px) scale(1.015)}

/* Reduced motion */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    scroll-behavior:auto!important;
    transition-duration:.01ms!important;
  }
}

/* Responsive refinements */
@media(max-width:900px){
  .public-topnav.final-topnav{border-radius:20px!important}
  .public-topnav-tabs{overflow-x:auto;scrollbar-width:none}
  .public-topnav-tabs::-webkit-scrollbar{display:none}
}
@media(max-width:640px){
  .pro-toast-stack{top:80px;right:8px;width:calc(100vw - 16px)}
  .card:hover,.public-card:hover,.omni-card:hover,.admin-panel:hover,.prono-card:hover,.community-match:hover,.achievement-card:hover,.record-card:hover{
    transform:none;
  }
}