.toggle-password{position:absolute;right:8px;font-size:20px;color:#fff;line-height:57px;cursor:pointer}.toggle-password:hover{color:#f60}*{box-sizing:border-box;padding:0;margin:0;-webkit-tap-highlight-color:transparent}body{display:flex;justify-content:center;align-items:center;min-height:100vh;background-size:cover;background-position:center;background-repeat:no-repeat;position:relative;overflow:hidden}body:before,body:after{content:"";position:fixed;top:0;left:0;width:100vw;height:100vh;background-size:cover;background-position:center;z-index:-1;opacity:0;transition:opacity 1s ease-in-out;will-change:opacity,background-image}body.show-before:before{opacity:1}body.show-after:after{opacity:1}body:before{background-image:var(--bg-before)}body:after{background-image:var(--bg-after)}@media(max-height:600px){body{align-items:flex-start;overflow-y:auto;padding:20px 0}}#background-fader{position:fixed;top:0;left:0;width:100vw;height:100vh;background-size:cover;background-position:center;z-index:-1;opacity:0;transition:opacity 1s ease-in-out;pointer-events:none;will-change:opacity,background-image}.login-box{width:480px;min-height:450px;padding:30px 0;border:1px solid #fff;border-radius:20px;display:flex;flex-direction:column;justify-content:center;align-items:center;background:linear-gradient(to bottom,#0000001f,#00000045);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);transition:all .35s ease}.login-box form.hidden{opacity:0;pointer-events:none;position:absolute}.login-box:has(#forgotForm:not(.hidden)){min-height:330px}@media(max-height:600px){.login-box{margin:40px 0}}@media(max-width:320px){.login-box{width:280px}}@media(max-width:375px){.login-box{width:300px}}@media(max-width:576px){.login-box{width:350px}}@media(min-width:576px)and (max-width:768px){.login-box{width:380px}}.logo-container{text-align:center;margin-bottom:20px}.logo{width:180px;height:auto;display:block;margin:0 auto}@media(max-width:320px){.logo{width:80px}}@media(max-width:375px){.logo{width:100px}}@media(max-width:576px){.logo{width:120px}}@media(min-width:576px)and (max-width:768px){.logo{width:130px}}.input-box{position:relative;width:310px;margin:30px 0;border-bottom:2px solid #fff;padding-bottom:1px}.input-box label{position:absolute;top:50%;left:5px;transform:translateY(-50%);color:#fff;font-size:16px;transition:all .5s ease;pointer-events:none}.input-box input{width:100%;height:50px;background:transparent;border:none;outline:none;font-size:1em;color:#fff;padding:0 35px 0 5px}.input-box input:focus~label,.input-box input:not(:placeholder-shown)~label{opacity:0;visibility:hidden}.input-box .icon{position:absolute;right:8px;font-size:20px;color:#fff;line-height:57px}@media(max-width:375px){.input-box{width:275px}}@media(max-width:320px){.input-box{width:250px}}.remember-forgot{color:#fff;display:flex;justify-content:space-between}.remember-forgot label,.remember-forgot a{margin:-15px 0 15px}.remember-forgot label input{margin-right:3px}.remember-forgot a{color:#fff;text-decoration:none}.remember-forgot a:hover{text-decoration:underline}button{width:100%;height:40px;color:#000;background-color:#fff;border-radius:20px;cursor:pointer;font-size:16px;font-weight:700;border:1px solid #fff;transition:all .3s ease}button:hover{background-color:transparent;color:#fff}.link{margin-top:20px;color:#fff;text-align:center}.link a{color:#fff;text-decoration:none;font-weight:600}.link a:hover{text-decoration:underline}.general-error{background-color:#ff000069;border:1px solid #ff6b6b;color:#fff;padding:10px;border-radius:5px;margin-bottom:20px;text-align:center}.error{color:#ff6b6b;font-size:14px;margin-top:8px;display:block;position:absolute;bottom:0;left:5px}.input-box.has-error input{border-bottom-color:#ff6b6b}h2{color:#fff;font-size:2rem;text-align:center}.general-success{background-color:#00800069;border:1px solid #4caf50;color:#fff;padding:10px;border-radius:5px;margin-bottom:20px;text-align:center}.input-box label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:calc(100% - 40px);font-size:clamp(12px,1vw + 10px,16px)}button{font-size:clamp(12px,1vw + 10px,16px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.remember-forgot{flex-wrap:wrap;gap:8px;width:310px}.remember-forgot label,.remember-forgot a{font-size:clamp(11px,1vw + 9px,14px);white-space:nowrap}@media(max-width:375px){.remember-forgot{width:275px}}@media(max-width:320px){.remember-forgot{width:250px}}
