@import "https://fonts.googleapis.com/css?family=Poppins:400,500,600,700&display=swap";*{box-sizing:border-box;margin:0;padding:0;font-family:Poppins,sans-serif}html,body{background:linear-gradient(90deg,#2b0138,#3d0150,#550273,#6d0394,#8a2be2);justify-content:center;align-items:center;width:100%;height:100%;min-height:100%;display:flex}::selection{color:#fff;background:#550273}.wrapper{scrollbar-width:none;-ms-overflow-style:none;background:#fff;border-radius:15px;max-width:390px;max-height:100vh;padding:20px;overflow:hidden auto;box-shadow:0 15px 20px #0000001a}.wrapper::-webkit-scrollbar{display:none}.wrapper .title-text{width:200%;display:flex}.wrapper .title{text-align:center;width:50%;font-size:20px;font-weight:600;transition:all .6s cubic-bezier(.68,-.55,.265,1.55)}.wrapper .slide-controls{border:1px solid #d3d3d3;border-radius:15px;justify-content:space-between;width:100%;height:50px;margin:20px 0;display:flex;position:relative;overflow:hidden}.slide-controls .slide{color:#fff;text-align:center;cursor:pointer;z-index:1;width:100%;height:100%;font-size:18px;font-weight:500;line-height:48px;transition:all .6s}.slide-controls label.signup{color:#000}.slide-controls .slider-tab{z-index:0;background:#550273;border-radius:15px;width:50%;height:100%;transition:all .6s cubic-bezier(.68,-.55,.265,1.55);position:absolute;left:0}input[type=radio]{display:none}#signup:checked~.slider-tab{left:50%}#signup:checked~label.signup{color:#fff;cursor:default;-webkit-user-select:none;user-select:none}#signup:checked~label.login,#login:checked~label.signup{color:#000}#login:checked~label.login{cursor:default;-webkit-user-select:none;user-select:none}.wrapper .form-container{width:100%;overflow:hidden}.form-container .form-inner{width:200%;display:flex}.form-container .form-inner>form,.form-container .form-inner>.signup-panel{flex-shrink:0;width:50%;transition:all .6s cubic-bezier(.68,-.55,.265,1.55)}.signup-panel>form{width:100%}.form-inner form .field{width:100%;height:40px}.form-inner form .field input{border:1px solid #d3d3d3;border-bottom-width:2px;border-radius:8px;outline:none;width:100%;height:100%;padding-left:15px;font-size:14px;transition:all .3s}.form-inner form .field input:focus{border-color:#550273}.form-inner form .field input::placeholder{color:#999;transition:all .3s}.name{gap:10px;display:flex}.form-inner form .pass-link{margin-top:0}.form-inner form .signup-link{text-align:center;margin-top:20px;font-size:15px}.form-inner form .pass-link a,.form-inner form .signup-link a{color:#550273;font-size:15px;text-decoration:none}.form-inner form .pass-link a:hover,.form-inner form .signup-link a:hover{text-decoration:underline}.btn-cont{flex-direction:row-reverse;justify-content:space-between;align-items:center;margin-top:20px;display:flex}.btn-cont2{align-items:center;margin-top:20px;display:flex}.login-btn{z-index:1;color:#fff;cursor:pointer;background:#550273;border:none;border-radius:8px;height:40px;padding:0 24px;font-size:18px;font-weight:500;position:relative}.signup-btn{z-index:1;color:#fff;cursor:pointer;background:#550273;border:none;border-radius:8px;width:100%;height:40px;font-size:18px;font-weight:500;position:relative}.progress-container{background:#e5e5e5;border-radius:20px;width:100%;height:8px;margin-top:25px;margin-bottom:25px;overflow:hidden}.progress-bar{background:#550273;border-radius:20px;height:100%;transition:all .4s}.step-title{color:#222;margin-bottom:20px;font-size:18px;font-weight:600}.option-card{text-align:center;cursor:pointer;border:2px solid #ddd;border-radius:8px;margin-bottom:15px;padding:9px;font-size:15px;transition:all .3s}.option-card:hover,.option-card.active-option{background:#f8f1fb;border-color:#550273}.buttons{justify-content:space-between;display:flex}.prev-btn,.next-btn{color:#fff;cursor:pointer;background:#550273;border:none;border-radius:15px;padding:10px 20px;font-size:16px}.field.btn{height:auto!important}.google-login{width:100%;margin-top:20px}.google-login a{color:#000;text-decoration:none}.google-btn{cursor:pointer;background:#fff;border:1px solid #ddd;border-radius:8px;justify-content:center;align-items:center;gap:10px;width:100%;height:45px;font-size:16px;font-weight:500;transition:all .3s;display:flex}.google-btn:hover{background:#faf7fc;border-color:#550273}.google-btn img{width:20px;height:20px}.or-divider{align-items:center;gap:15px;width:100%;display:flex;margin-top:30px!important}.or-divider span{background:#ccc;flex:1;height:1px}.or-divider p{color:#777;margin:0;font-size:14px}.logo{width:100%;max-width:100px;height:auto}.alert-error{color:#991b1b;background:#fef2f2;border:1px solid #fecaca;border-radius:8px;margin-top:12px;padding:10px 14px;font-size:13px;line-height:1.5}.alert-success{color:#166534;background:#f0fdf4;border:1px solid #bbf7d0;border-radius:8px;margin-top:12px;padding:10px 14px;font-size:13px;line-height:1.5}.alert-warning{color:#92400e;background:#fffbeb;border:1px solid #facc15;border-radius:8px;margin-top:12px;padding:10px 14px;font-size:13px;line-height:1.5}.field-wrap.is-warning .field input{background:#fffbeb;border-color:#eab308}.field-wrap{margin-top:15px}.field-wrap .field{margin-top:0}.field-wrap .field-error{color:#dc2626;min-height:16px;margin-top:3px;padding-left:4px;font-size:11px;display:none}#wrap-first,#wrap-last{padding-bottom:18px}#wrap-first.has-error,#wrap-last.has-error{padding-bottom:0}.field-wrap.has-error .field input{border-color:#dc2626}.field-wrap.has-error .field-error{display:block}.field-wrap.is-valid .field input{border-color:#16a34a}.field input.is-invalid{border-color:#dc2626}.login-btn:disabled,.signup-btn:disabled,.next-btn:disabled{opacity:.65;cursor:not-allowed}.login-btn,.signup-btn,.next-btn,.prev-btn{transition:all .3s}.login-btn:hover,.signup-btn:hover,.next-btn:hover,.prev-btn:hover{background:#6d0394;transform:translateY(-2px);box-shadow:0 5px 10px #55027333}.checking-email{color:#888;margin-top:3px;padding-left:4px;font-size:11px;display:none}.otp-info{color:#666;margin-bottom:15px;font-size:14px;line-height:1.6}.otp-field input{letter-spacing:6px;text-align:center;font-size:20px;font-weight:600}@media (width<=600px){html,body{padding:0 10px}}#wrap-brand{margin-top:4px!important}.remember-me{color:#555;margin-top:15px;margin-bottom:10px;padding-left:3px;font-size:16px}.remember-me label{cursor:pointer;align-items:center;gap:8px;display:flex}.remember-me input[type=checkbox]{cursor:pointer;accent-color:#550273;width:16px!important;height:16px!important}.remember-me span{-webkit-user-select:none;user-select:none}
