/* Efectos del acceso de SistemaVenta, adaptados a la paleta de NOMA. */
.placeholder-motion{position:relative;flex:1;min-width:0}
.placeholder-motion input{display:block;width:100%}
.placeholder-motion input::placeholder{color:transparent}
.animated-placeholder{position:absolute;top:50%;left:0;right:0;transform:translateY(-50%);font:inherit;font-size:13px;color:#a39c90;white-space:pre;pointer-events:none;overflow:hidden;line-height:1.6;padding-top:8px;margin-top:-4px}
.animated-placeholder>span{display:inline-block;opacity:1;transform:translateY(0)}
.placeholder-motion.has-value .animated-placeholder,
.placeholder-motion input:autofill~.animated-placeholder,
.placeholder-motion input:-webkit-autofill~.animated-placeholder{visibility:hidden}
.placeholder-motion:focus-within .animated-placeholder>span{opacity:0;transform:translateY(-16px)}
.motion-ripple-host{position:relative;overflow:hidden}
.motion-ripple{position:absolute;border-radius:50%;background:currentColor;opacity:.15;pointer-events:none;transform:scale(0)}
@media(prefers-reduced-motion:no-preference){
  .login-page{position:relative;isolation:isolate}
  .login-page::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(420px circle at var(--mouse-x,25%) var(--mouse-y,35%),#c4653c12,transparent 75%)}
  .login-top{animation:noma-header-in .6s ease-out both}
  .access-form-card{position:relative;transform:perspective(1000px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition:transform .35s ease-out,box-shadow .35s}
  .access-form-card::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;border-radius:inherit;background:radial-gradient(260px circle at var(--spot-x,50%) var(--spot-y,0%),#c4653c12,transparent 70%)}
  .access-form-card>*{position:relative;z-index:1}
  .access-form-card:focus-within{box-shadow:0 12px 38px #68503d18}
  .access-preview{transform:perspective(1000px) rotate(-2deg) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) translate3d(var(--drift-x,0px),var(--drift-y,0px),0);transition:transform .4s ease-out}
  .preview-days i{transform-origin:bottom;animation:noma-session-in .8s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--session-index,0)*65ms + 250ms)}
  .access-story h1 em{background:linear-gradient(110deg,var(--terra),#866b4e,var(--terra));background-size:200% auto;background-clip:text;-webkit-background-clip:text;color:transparent;animation:noma-text-glow 9s ease-in-out infinite}
  .btn-login,.toggle-password,.back-link,.brand,.access-register a,.access-features span{transition:transform .22s cubic-bezier(.2,.8,.2,1),background .2s,color .2s,box-shadow .22s}
  .btn-login:not(:disabled):hover{transform:translateY(-2px);box-shadow:0 7px 19px #c4653c26}
  .btn-login:not(:disabled):active{transform:scale(.97)}
  .btn-login>span[aria-hidden="true"]:not(.motion-ripple){transition:transform .2s}
  .btn-login:not(:disabled):hover>span[aria-hidden="true"]:not(.motion-ripple){transform:translateX(3px)}
  .toggle-password:hover{transform:scale(1.08)}
  .toggle-password:active{transform:scale(.94)}
  .back-link:hover{transform:translateX(-3px)}
  .brand:hover{transform:translateY(-2px)}
  .access-features span:hover{transform:translateY(-3px);color:var(--terra)}
  .access-input{transition:border-color .22s,box-shadow .22s,background .22s}
  .access-input>svg{transition:color .2s,transform .2s}
  .access-input:focus-within>svg{color:var(--terra);transform:translateY(-1px)}
  .animated-placeholder>span{transition:opacity .2s ease,transform .24s cubic-bezier(.2,.8,.2,1)}
  .placeholder-motion:focus-within .animated-placeholder>span{transition-delay:calc(var(--letter-index,0)*22ms)}
}
@keyframes noma-header-in{from{opacity:0;translate:0 -8px}to{opacity:1;translate:0 0}}
@keyframes noma-session-in{from{transform:scaleY(.15);opacity:.3}to{transform:scaleY(1);opacity:1}}
@keyframes noma-text-glow{0%,100%{background-position:0% center}50%{background-position:100% center}}
@media(hover:none),(pointer:coarse){
  .access-form-card,.access-preview{--tilt-x:0deg!important;--tilt-y:0deg!important;--drift-x:0px!important;--drift-y:0px!important}
}
@media(prefers-reduced-motion:reduce){
  .motion-ripple{display:none}
  .access-form-card{transform:none!important}
  .access-preview{transform:none!important}
  .login-top,.preview-days i,.access-story h1 em{animation:none!important}
  .btn-login,.toggle-password,.back-link,.brand,.access-register a,.access-features span,.access-input,.access-input>svg,.animated-placeholder>span{transition:none!important}
}
