.login-page{background:linear-gradient(135deg,#f7fafc 0%,#edf2f7 100%);min-height:100vh;padding-top:72px}.login-container{justify-content:center;align-items:center;min-height:calc(100vh - 72px);padding:2rem 1rem;display:flex}.login-card{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fff;border:1px solid #e6f4131a;border-radius:16px;width:100%;max-width:420px;padding:3rem;position:relative;box-shadow:0 20px 60px #024b4f33}.login-card:before{content:"";background:linear-gradient(90deg,#024b4f,#e6f413,#024b4f);border-radius:16px 16px 0 0;height:4px;position:absolute;top:0;left:0;right:0}.login-header{text-align:center;margin-bottom:2rem;position:relative}.login-header:after{content:"";background:linear-gradient(90deg,#024b4f,#e6f413);border-radius:2px;width:60px;height:3px;position:absolute;bottom:-10px;left:50%;transform:translate(-50%)}.login-header h1{color:#024b4f;margin-bottom:.5rem;font-size:2rem;font-weight:700}.login-header p{color:#666;margin:0;font-size:1rem}.success-banner{color:#fff;background:linear-gradient(135deg,#024b4f,#035a5f);border-radius:8px;margin-bottom:2rem;padding:1rem;animation:.5s ease-out slideDown}.success-banner.login-success{background:linear-gradient(135deg,#10b981,#059669);border-left:4px solid #047857;box-shadow:0 4px 12px #10b9814d}.success-content{align-items:flex-start;gap:1rem;display:flex}.success-content span{flex-shrink:0;font-size:1.5rem}.success-content strong{margin-bottom:.25rem;font-size:1.1rem;display:block}.success-content p{opacity:.9;margin:0;font-size:.9rem}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.login-form{margin-bottom:2rem}.form-group{margin-bottom:1.5rem}.form-group label{color:#333;margin-bottom:.5rem;font-size:.95rem;font-weight:600;display:block}.input-wrapper{align-items:center;display:flex;position:relative}.input-icon{color:#666;z-index:2;font-size:1rem;position:absolute;left:1rem}.input-wrapper input{background:#f8f9fa;border:2px solid #e1e5e9;border-radius:8px;width:100%;font-size:1rem;transition:all .3s;padding:.875rem 1rem .875rem 3rem!important}.input-wrapper input:focus{background:#fff;border-color:#024b4f;outline:none;box-shadow:0 0 0 3px #024b4f1a}.input-wrapper input.error{background:#fff5f5;border-color:#dc3545}.password-toggle{color:#666;cursor:pointer;background:0 0;border:none;border-radius:4px;padding:.25rem;transition:color .3s;position:absolute;right:1rem}.password-toggle:hover{color:#024b4f}.form-options{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:2rem;display:flex}.checkbox-label{cursor:pointer;color:#666;align-items:center;font-size:.9rem;display:flex}.checkbox-label input[type=checkbox]{opacity:0;position:absolute}.checkmark{border:2px solid #e1e5e9;border-radius:3px;width:18px;height:18px;margin-right:.5rem;transition:all .3s;position:relative}.checkbox-label input:checked+.checkmark{background:#024b4f;border-color:#024b4f}.checkbox-label input:checked+.checkmark:after{content:"✓";color:#fff;font-size:11px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.forgot-password{color:#024b4f;cursor:pointer;background:0 0;border:none;font-size:.9rem;text-decoration:none;transition:color .3s}.forgot-password:hover{color:#035a5f;text-decoration:underline}.login-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#024b4f,#035a5f);border:none;border-radius:8px;width:100%;margin-bottom:1.5rem;padding:1rem;font-size:1rem;font-weight:600;transition:all .3s;position:relative;overflow:hidden}.login-btn:before{content:"";background:linear-gradient(90deg,#0000,#e6f41333,#0000);width:100%;height:100%;transition:left .5s;position:absolute;top:0;left:-100%}.login-btn:hover:not(:disabled){background:linear-gradient(135deg,#035a5f,#024b4f);transform:translateY(-2px);box-shadow:0 8px 25px #024b4f4d}.login-btn:hover:not(:disabled):before{left:100%}.login-btn:disabled{opacity:.7;cursor:not-allowed;transform:none}.login-btn.success{animation:2s infinite successPulse;opacity:1!important;background:linear-gradient(135deg,#10b981,#059669)!important}@keyframes successPulse{0%,to{box-shadow:0 4px 12px #10b9814d}50%{box-shadow:0 4px 20px #10b98180}}.divider{text-align:center;margin:1.5rem 0;position:relative}.divider:before{content:"";background:#e1e5e9;height:1px;position:absolute;top:50%;left:0;right:0}.divider span{color:#666;background:#fff;padding:0 1rem;font-size:.9rem;position:relative}.social-login{gap:1rem;margin-bottom:2rem;display:flex}.social-btn{cursor:pointer;background:#fff;border:2px solid #e1e5e9;border-radius:8px;flex:1;justify-content:center;align-items:center;gap:.5rem;padding:.75rem;font-size:.9rem;font-weight:500;transition:all .3s;display:flex}.social-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 15px #0000001a}.google-btn{color:#db4437;border-color:#db4437}.google-btn:hover:not(:disabled){color:#fff;background:#db4437}.facebook-btn{color:#4267b2;border-color:#4267b2}.facebook-btn:hover:not(:disabled){color:#fff;background:#4267b2}.social-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.error-message{color:#dc3545;margin-top:.25rem;font-size:.875rem;font-weight:500;display:block}.general-error{color:#1f2937;text-align:center;background:linear-gradient(135deg,#fef2f2,#fef7f7);border:1px solid #fecaca;border-left:4px solid #dc3545;border-radius:8px;margin-bottom:1.5rem;padding:1rem 1.25rem;font-size:.9rem;line-height:1.5;position:relative;box-shadow:0 2px 4px #dc35451a}.general-error:before{content:"⚠️";font-size:1rem;position:absolute;top:1rem;right:1rem}.general-error strong{color:#dc3545;font-weight:600}.auth-links{text-align:center;border-top:1px solid #e1e5e9;padding-top:1.5rem}.auth-links p{color:#666;margin:.75rem 0;font-size:.9rem}.auth-links a{color:#024b4f;font-weight:600;text-decoration:none;transition:all .3s}.auth-links a:hover{color:#e6f413;text-shadow:0 0 8px #e6f4134d;text-decoration:underline}@media (max-width:768px){.login-container{padding:1rem}.login-card{padding:2rem 1.5rem}.login-header h1{font-size:1.75rem}.form-options{flex-direction:column;align-items:flex-start}.social-login{flex-direction:column}}@media (max-width:480px){.login-card{padding:1.5rem 1rem}.login-header h1{font-size:1.5rem}.success-content{text-align:center;flex-direction:column;gap:.5rem}}
