@import"https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap";.login-page-container{margin:0;box-sizing:border-box;font-family:Poppins,sans-serif;display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:100vh;background:#1a1a2e;padding:20px;width:100vw;position:fixed;top:0;left:0;z-index:9999}.login-page-container *{color:#00d4ffe6;box-sizing:border-box}.login-page-container .footer{margin-top:30px;text-align:center;padding:15px;font-size:14px;color:#00d4ffcc}.login-page-container .footer a{color:#00d4ff;text-decoration:none;font-weight:600;transition:.3s;text-shadow:0 0 5px rgba(0,212,255,.3)}.login-page-container .footer a:hover{text-decoration:underline;color:#00b8d4;text-shadow:0 0 8px rgba(0,212,255,.5)}.auth-wrapper{position:relative;width:100%;max-width:900px;height:680px;border:2px solid #00d4ff;box-shadow:0 0 25px #00d4ff;overflow:hidden;border-radius:20px}.auth-wrapper .credentials-panel{position:absolute;top:0;width:50%;height:100%;display:flex;justify-content:center;flex-direction:column}.credentials-panel.signin{left:0;padding:0 40px}.credentials-panel.signin .slide-element{transform:translate(0);transition:.7s;opacity:1}.credentials-panel.signin .slide-element:nth-child(1){transition-delay:2.1s}.credentials-panel.signin .slide-element:nth-child(2){transition-delay:2.2s}.credentials-panel.signin .slide-element:nth-child(3){transition-delay:2.3s}.credentials-panel.signin .slide-element:nth-child(4){transition-delay:2.4s}.credentials-panel.signin .slide-element:nth-child(5){transition-delay:2.5s}.auth-wrapper.toggled .credentials-panel.signin .slide-element{transform:translate(-120%);opacity:0}.auth-wrapper.toggled .credentials-panel.signin .slide-element:nth-child(1){transition-delay:0s}.auth-wrapper.toggled .credentials-panel.signin .slide-element:nth-child(2){transition-delay:.1s}.auth-wrapper.toggled .credentials-panel.signin .slide-element:nth-child(3){transition-delay:.2s}.auth-wrapper.toggled .credentials-panel.signin .slide-element:nth-child(4){transition-delay:.3s}.auth-wrapper.toggled .credentials-panel.signin .slide-element:nth-child(5){transition-delay:.4s}.credentials-panel.signup{right:0;padding:0 60px}.credentials-panel.signup .slide-element{transform:translate(120%);transition:.7s ease;opacity:0;filter:blur(10px)}.credentials-panel.signup .slide-element:nth-child(1){transition-delay:0s}.credentials-panel.signup .slide-element:nth-child(2){transition-delay:.1s}.credentials-panel.signup .slide-element:nth-child(3){transition-delay:.2s}.credentials-panel.signup .slide-element:nth-child(4){transition-delay:.3s}.credentials-panel.signup .slide-element:nth-child(5){transition-delay:.4s}.credentials-panel.signup .slide-element:nth-child(6){transition-delay:.5s}.auth-wrapper.toggled .credentials-panel.signup .slide-element{transform:translate(0);opacity:1;filter:blur(0px)}.auth-wrapper.toggled .credentials-panel.signup .slide-element:nth-child(1){transition-delay:1.7s}.auth-wrapper.toggled .credentials-panel.signup .slide-element:nth-child(2){transition-delay:1.8s}.auth-wrapper.toggled .credentials-panel.signup .slide-element:nth-child(3){transition-delay:1.9s}.auth-wrapper.toggled .credentials-panel.signup .slide-element:nth-child(4){transition-delay:1.9s}.auth-wrapper.toggled .credentials-panel.signup .slide-element:nth-child(5){transition-delay:2s}.auth-wrapper.toggled .credentials-panel.signup .slide-element:nth-child(6){transition-delay:2.1s}.credentials-panel h2{font-size:32px;text-align:center;margin-bottom:30px;font-weight:700;color:#00d4ff;text-shadow:0 0 10px rgba(0,212,255,.3)}.credentials-panel .field-wrapper{position:relative;width:100%;min-height:60px;margin-top:20px;margin-bottom:5px}.field-wrapper input{width:100%;height:100%;background:#00d4ff14;border:2px solid rgba(0,212,255,.3);border-radius:12px;outline:none;font-size:16px;color:#00d4ff;font-weight:500;padding:12px 45px 12px 15px;transition:all .3s ease}.field-wrapper input::-moz-placeholder{color:#00d4ff80}.field-wrapper input::placeholder{color:#00d4ff80}.field-wrapper input:focus{background:#00d4ff1f;border-color:#00d4ff;box-shadow:0 0 0 3px #00d4ff33;color:#00d4ff}.field-wrapper input:valid{border-color:#00d4ff80;color:#00d4ff}.field-wrapper label{position:absolute;top:50%;left:15px;transform:translateY(-50%);font-size:15px;color:#00d4ffb3;transition:all .3s ease;pointer-events:none;background:transparent;padding:0 4px}.field-wrapper input:not(:-moz-placeholder)~label{top:-10px;left:12px;color:#00d4ff;font-size:12px;font-weight:600;background:#1a1a2e}.field-wrapper input:focus~label,.field-wrapper input:valid~label,.field-wrapper input:not(:placeholder-shown)~label{top:-10px;left:12px;color:#00d4ff;font-size:12px;font-weight:600;background:#1a1a2e}.field-wrapper i{position:absolute;top:50%;right:15px;font-size:18px;transform:translateY(-50%);color:#00d4ffb3;transition:color .3s ease;z-index:2;display:flex;align-items:center;justify-content:center;pointer-events:none}.field-wrapper input:focus~i,.field-wrapper input:valid~i{color:#00d4ff}.field-wrapper .password-toggle-icon{pointer-events:auto;cursor:pointer;z-index:10;padding:5px;transition:all .3s ease;border-radius:6px}.field-wrapper .password-toggle-icon:hover{color:#00d4ff!important;background:#00d4ff1a}.remember-me-wrapper{display:flex;align-items:center;gap:10px;margin-top:10px;margin-bottom:5px;height:auto;min-height:auto}.remember-me-wrapper input[type=checkbox]{width:20px;height:20px;accent-color:#00d4ff;cursor:pointer;border-radius:6px;flex-shrink:0}.remember-me-label{font-size:14px;color:#00d4ffe6;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;transition:color .3s ease}.remember-me-label:hover{color:#00d4ff}.submit-button{position:relative;width:100%;height:50px;background:linear-gradient(135deg,#00d4ff,#00b8d4);border-radius:12px;cursor:pointer;font-size:16px;font-weight:600;border:none;overflow:hidden;z-index:1;margin-top:15px;color:#fff;transition:all .3s ease;box-shadow:0 4px 15px #00d4ff4d}.submit-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #00d4ff66;background:linear-gradient(135deg,#00b8d4,#00d4ff)}.submit-button:active:not(:disabled){transform:translateY(0)}.submit-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.switch-link{font-size:14px;text-align:center;margin:20px 0 10px;color:#00d4ffcc}.switch-link a{text-decoration:none;color:#00d4ff;font-weight:600;cursor:pointer;transition:all .3s ease;text-shadow:0 0 5px rgba(0,212,255,.3)}.switch-link a:hover{text-decoration:underline;color:#00b8d4;text-shadow:0 0 8px rgba(0,212,255,.5)}.google-login-button{width:100%;display:flex;align-items:center;justify-content:center;gap:12px;padding:12px 20px;background:#fff;color:#1a1a2e;border-radius:12px;font-size:15px;font-weight:600;border:none;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 10px #0000001a;margin-top:10px}.google-login-button:hover:not(:disabled){background:#f5f5f5;transform:translateY(-2px);box-shadow:0 4px 15px #00000026}.google-login-button:active:not(:disabled){transform:translateY(0)}.google-login-button:disabled{opacity:.6;cursor:not-allowed}.google-icon{width:20px;height:20px}.welcome-section{position:absolute;top:0;height:100%;width:50%;display:flex;justify-content:center;flex-direction:column}.welcome-section.signin{right:0;text-align:right;padding:0 40px 60px 150px}.welcome-section.signin .slide-element{transform:translate(0);transition:.7s ease;opacity:1;filter:blur(0px)}.welcome-section.signin .slide-element:nth-child(1){transition-delay:2s}.welcome-section.signin .slide-element:nth-child(2){transition-delay:2.1s}.auth-wrapper.toggled .welcome-section.signin .slide-element{transform:translate(120%);opacity:0;filter:blur(10px)}.auth-wrapper.toggled .welcome-section.signin .slide-element:nth-child(1){transition-delay:0s}.auth-wrapper.toggled .welcome-section.signin .slide-element:nth-child(2){transition-delay:.1s}.welcome-section.signup{left:0;text-align:left;padding:0 150px 60px 38px;pointer-events:none}.welcome-section.signup .slide-element{transform:translate(-120%);transition:.7s ease;opacity:0;filter:blur(10PX)}.welcome-section.signup .slide-element:nth-child(1){transition-delay:0s}.welcome-section.signup .slide-element:nth-child(2){transition-delay:.1s}.auth-wrapper.toggled .welcome-section.signup .slide-element{transform:translate(0);opacity:1;filter:blur(0)}.auth-wrapper.toggled .welcome-section.signup .slide-element:nth-child(1){transition-delay:1.7s}.auth-wrapper.toggled .welcome-section.signup .slide-element:nth-child(2){transition-delay:1.8s}.welcome-section h2{text-transform:uppercase;font-size:36px;line-height:1.3;color:#00d4ff;text-shadow:0 0 15px rgba(0,212,255,.5)}.auth-wrapper .background-shape{position:absolute;right:0;top:-5px;height:800px;width:950px;background:linear-gradient(45deg,#1a1a2e,#00d4ff);transform:rotate(10deg) skewY(40deg);transform-origin:bottom right;transition:1.5s ease;transition-delay:1.6s}.auth-wrapper.toggled .background-shape{transform:rotate(0) skewY(0);transition-delay:.5s}.auth-wrapper .secondary-shape{position:absolute;left:250px;top:100%;height:800px;width:950px;background:#1a1a2e;border-top:3px solid #00d4ff;transform:rotate(0) skewY(0);transform-origin:bottom left;transition:1.5s ease;transition-delay:.5s}.auth-wrapper.toggled .secondary-shape{transform:rotate(-11deg) skewY(-41deg);transition-delay:1.2s}@media (max-width: 768px){.login-page-container{padding:10px}.footer{margin-top:20px;font-size:13px}.auth-wrapper{height:auto;min-height:500px;flex-direction:column}.auth-wrapper .credentials-panel,.welcome-section{width:100%;position:relative}.credentials-panel.signin,.credentials-panel.signup{padding:40px 30px;left:0;right:0;z-index:50;pointer-events:auto}.credentials-panel.signin{display:flex;animation:fadeInUp .6s ease forwards}.credentials-panel.signup{display:none}.auth-wrapper.toggled .credentials-panel.signin{display:none;animation:fadeOutDown .6s ease forwards}.auth-wrapper.toggled .credentials-panel.signup{display:flex;animation:fadeInUp .6s ease forwards}.credentials-panel.signin .slide-element,.credentials-panel.signup .slide-element{transform:translateY(0);opacity:1;filter:blur(0);animation:slideInUp .5s ease forwards}.credentials-panel.signin .slide-element:nth-child(1),.credentials-panel.signup .slide-element:nth-child(1){animation-delay:.1s;opacity:0}.credentials-panel.signin .slide-element:nth-child(2),.credentials-panel.signup .slide-element:nth-child(2){animation-delay:.2s;opacity:0}.credentials-panel.signin .slide-element:nth-child(3),.credentials-panel.signup .slide-element:nth-child(3){animation-delay:.3s;opacity:0}.credentials-panel.signin .slide-element:nth-child(4),.credentials-panel.signup .slide-element:nth-child(4){animation-delay:.4s;opacity:0}.credentials-panel.signin .slide-element:nth-child(5),.credentials-panel.signup .slide-element:nth-child(5){animation-delay:.5s;opacity:0}.credentials-panel.signup .slide-element:nth-child(6){animation-delay:.6s;opacity:0}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeOutDown{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(30px)}}@keyframes slideInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.welcome-section{display:none!important}.credentials-panel h2{font-size:28px;margin-bottom:25px}.auth-wrapper .background-shape,.auth-wrapper .secondary-shape{display:none}.field-wrapper{margin-top:20px;min-height:55px}.field-wrapper input{padding:10px 40px 10px 12px;font-size:15px}.submit-button{height:48px;font-size:15px}.google-login-button{padding:10px 16px;font-size:14px}}@media (max-width: 480px){.credentials-panel.signin,.credentials-panel.signup{padding:30px 20px}.credentials-panel h2{font-size:24px}.field-wrapper input,.field-wrapper label{font-size:14px}.field-wrapper input{padding:10px 35px 10px 12px;z-index:60;position:relative}.field-wrapper i{right:12px;font-size:16px}.submit-button{font-size:14px;height:46px;z-index:100;pointer-events:auto;margin-top:12px}.google-login-button{font-size:13px;padding:10px 14px}.switch-link{font-size:13px;margin:15px 0 8px}.remember-me-wrapper{margin-top:8px}.remember-me-label{font-size:13px}}
