*{margin:0;padding:0;box-sizing:border-box}body{background-size:cover;background-attachment:fixed;min-height:100vh;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}body:before{content:"";position:absolute;inset:0;background-size:400% 400%;animation:gradientShift 15s ease infinite;z-index:-1}@keyframes gradientShift{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.login-container{background:#ffffff26;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.2);border-radius:18px;box-shadow:0 18px 36px #00000024,0 0 0 1px #ffffff14;overflow:hidden;width:100%;max-width:820px;min-height:520px;display:flex;position:relative;animation:slideUp .6s ease-out}.login-container.flipped{flex-direction:row-reverse}.login-container.transitioning{pointer-events:none}@keyframes slideUp{0%{opacity:0;transform:translateY(50px)}to{opacity:1;transform:translateY(0)}}.login-left{flex:1;background:linear-gradient(135deg,#1e5799e6,#207ccae6);color:#fff;padding:2.25rem 1.75rem;display:flex;flex-direction:column;justify-content:center;text-align:center;position:relative;overflow:hidden;transition:all .8s cubic-bezier(.4,0,.2,1)}.login-right{flex:1;padding:2.25rem 1.75rem;display:flex;flex-direction:column;justify-content:center;background:#fffffff2;transition:all .8s cubic-bezier(.4,0,.2,1)}.form-container{position:relative;width:100%;height:100%;min-height:360px}.login-form,.forgot-form{position:absolute;width:100%;transition:all .6s cubic-bezier(.4,0,.2,1);opacity:1;transform:translate(0)}.login-form.slide-out-left{opacity:0;transform:translate(-100%)}.forgot-form{opacity:0;transform:translate(100%)}.forgot-form.slide-in{opacity:1;transform:translate(0)}.forgot-form.slide-out{opacity:0;transform:translate(-100%)}.branding-content{transition:all .6s cubic-bezier(.4,0,.2,1);opacity:1;transform:translateY(0)}.branding-content.fade-out{opacity:0;transform:translateY(-20px)}.forgot-branding{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);opacity:0;transition:all .6s cubic-bezier(.4,0,.2,1);text-align:center;width:100%}.forgot-branding.fade-in{opacity:1}.login-left:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 1000"><defs><radialGradient id="a" cx="50%" cy="50%" r="50%"><stop offset="0%" style="stop-color:rgba(255,255,255,0.1);stop-opacity:1" /><stop offset="100%" style="stop-color:rgba(255,255,255,0);stop-opacity:0" /></radialGradient></defs><circle cx="20%" cy="20%" r="10%" fill="url(%23a)" /><circle cx="80%" cy="30%" r="8%" fill="url(%23a)" /><circle cx="30%" cy="70%" r="12%" fill="url(%23a)" /><circle cx="70%" cy="80%" r="6%" fill="url(%23a)" /></svg>') no-repeat;background-size:cover;animation:float 20s ease-in-out infinite;opacity:.3;z-index:0}@keyframes float{0%,to{transform:translate(0) rotate(0)}33%{transform:translate(30px,-30px) rotate(120deg)}66%{transform:translate(-20px,20px) rotate(240deg)}}.clinic-logo{width:80px;height:80px;background:#ffffff40;border:2px solid rgba(255,255,255,.3);border-radius:50%;margin:0 auto 1.25rem;display:flex;align-items:center;justify-content:center;font-size:2rem;font-weight:700;position:relative;z-index:1;transition:all .3s ease;animation:pulse 3s ease-in-out infinite}@keyframes pulse{0%,to{transform:scale(1);box-shadow:0 0 #fff6}50%{transform:scale(1.05);box-shadow:0 0 0 20px #fff0}}.login-left h1{font-size:2rem;margin-bottom:.75rem;font-weight:700;position:relative;z-index:1;text-shadow:0 2px 4px rgba(0,0,0,.1)}.login-left p{font-size:1rem;opacity:.95;line-height:1.5;position:relative;z-index:1;font-weight:400}.login-form h2{color:#1a1a1a;margin-bottom:.5rem;font-size:1.75rem;font-weight:700;text-align:center}.login-subtitle{color:#6b7280;font-size:.95rem;text-align:center;margin-bottom:1.5rem;font-weight:400}.form-group{margin-bottom:1.25rem;position:relative}.form-group label{position:absolute;left:2.5rem;top:.9rem;color:#9ca3af;font-size:.9rem;font-weight:500;transition:all .3s ease;pointer-events:none;background:transparent;z-index:1}.form-group.focused label,.form-group.filled label{transform:translateY(-2rem) scale(.85);color:#1e5799;background:#ffffffe6;padding:0 .35rem;border-radius:4px}.input-wrapper{position:relative;display:flex;align-items:center}.input-icon{position:absolute;left:.9rem;color:#9ca3af;font-size:1rem;z-index:2;transition:color .3s ease}.form-control{width:100%;padding:.875rem .875rem .875rem 2.5rem;border:1.5px solid #e5e7eb;border-radius:10px;font-size:.95rem;font-weight:400;transition:all .3s ease;outline:none;background:#ffffffd9}.form-control:focus{border-color:#1e5799;background:#fffffff2;box-shadow:0 0 0 4px #1e57991a;transform:translateY(-1px)}.form-control:focus+.input-icon{color:#1e5799}.password-toggle{position:absolute;right:.5rem;top:50%;transform:translateY(-50%);background:none;border:none;color:#9ca3af;cursor:pointer;font-size:1.1rem;transition:all .3s ease;z-index:3;padding:.6rem;border-radius:6px;min-width:2.5rem;min-height:2.5rem;display:flex;align-items:center;justify-content:center}.password-toggle:hover{color:#1e5799;background:#3b82f61a;transform:translateY(-50%) scale(1.05)}.password-toggle:focus{outline:none;color:#1e5799;background:#3b82f626;box-shadow:0 0 0 2px #3b82f64d}.password-toggle:active{transform:translateY(-50%) scale(.95);background:#3b82f633}.password-field-wrapper{position:relative}.password-field-wrapper .form-control{padding-right:3.5rem}.checkbox-wrapper{display:flex;align-items:center;gap:.5rem;margin:1rem 0}.custom-checkbox{position:relative;display:flex;align-items:center;cursor:pointer}.custom-checkbox input{position:absolute;opacity:0;cursor:pointer}.checkmark{height:20px;width:20px;background:#fffc;border:2px solid #e5e7eb;border-radius:4px;transition:all .3s ease;display:flex;align-items:center;justify-content:center}.custom-checkbox input:checked~.checkmark{background:#1e5799;border-color:#1e5799}.checkmark:after{content:"✓";font-family:inherit;font-weight:700;color:#fff;font-size:12px;opacity:0;transition:opacity .3s ease}.custom-checkbox input:checked~.checkmark:after{opacity:1}.btn-login{width:100%;padding:.9rem;background:linear-gradient(135deg,#1e5799,#207cca);color:#fff;border:none;border-radius:10px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease;margin-top:.75rem;position:relative;overflow:hidden;text-transform:uppercase;letter-spacing:.5px}.btn-login:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s ease}.btn-login:hover{transform:translateY(-2px);box-shadow:0 10px 25px #1e579966}.btn-login:hover:before{left:100%}.btn-login:active{transform:translateY(0)}.alert{padding:1rem 1.5rem;border-radius:12px;margin-bottom:2rem;border:none;font-weight:500}.alert-danger{background:linear-gradient(135deg,#ef44441a,#dc26261a);border:1px solid rgba(239,68,68,.2);color:#dc2626;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.forgot-password,.back-to-login{text-align:center;margin-top:2rem}.forgot-password a,.back-to-login a{color:#1e5799;text-decoration:none;font-size:.95rem;font-weight:500;transition:all .3s ease;position:relative}.forgot-password a:after,.back-to-login a:after{content:"";position:absolute;width:0;height:2px;bottom:-2px;left:50%;background:#1e5799;transition:all .3s ease;transform:translate(-50%)}.forgot-password a:hover:after,.back-to-login a:hover:after{width:100%}.forgot-password a:hover,.back-to-login a:hover{color:#207cca}.btn-login.loading{pointer-events:none;opacity:.7;position:relative}.btn-login.loading:after{content:"";position:absolute;width:16px;height:16px;margin:auto;border:2px solid transparent;border-top:2px solid #ffffff;border-radius:50%;animation:spin 1s linear infinite;top:50%;left:50%;transform:translate(-50%,-50%)}.btn-login.loading .btn-text{opacity:0}@keyframes spin{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}.alert-success{background:linear-gradient(135deg,#22c55e1a,#16a34a1a);border:1px solid rgba(34,197,94,.2);color:#16a34a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.alert-warning{background:linear-gradient(135deg,#f59e0b1a,#d977061a);border:1px solid rgba(245,158,11,.2);color:#d97706;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.processing-message{text-align:center;color:#6b7280;font-size:.85rem;margin-top:.5rem;opacity:0;transition:opacity .3s ease}.processing-message.show{opacity:1}@media (max-width: 768px){body{overflow-y:auto;align-items:flex-start;background-attachment:scroll}.login-container{flex-direction:column;margin:1rem auto;width:92%;max-width:540px;min-height:auto;border-radius:16px;overflow:visible}.login-left{padding:1.5rem 1.125rem;min-height:220px;align-items:center;text-align:center}.login-right{padding:1.5rem 1.125rem;display:flex;flex-direction:column;align-items:center}.login-left h1{font-size:1.6rem}.clinic-logo{width:64px;height:64px;font-size:1.5rem}.form-control{padding:.8rem .8rem .8rem 2.25rem;font-size:.95rem;border-radius:10px}.btn-login{padding:.8rem;font-size:.95rem;border-radius:10px}.form-container{min-height:initial;height:auto;width:100%;max-width:480px;margin:0 auto}.login-form,.forgot-form{position:static;transition:opacity .3s ease,max-height .3s ease,transform .3s ease}.login-form{opacity:1;max-height:1000px;transform:translate(0)}.forgot-form{opacity:0;max-height:0;overflow:hidden;pointer-events:none;transform:translate(10px)}.forgot-form.slide-in{opacity:1;max-height:1000px;pointer-events:auto;transform:translate(0)}.login-form.slide-out-left{opacity:0;max-height:0;pointer-events:none;transform:translate(-10px)}.login-container.flipped{flex-direction:column}.login-left .branding-content,.login-left .forgot-branding{transition:opacity .3s ease,transform .3s ease}.login-left .branding-content{opacity:1;transform:none;display:block}.login-left .forgot-branding{opacity:0;transform:none;display:none}.login-container.flipped .login-left .branding-content{opacity:0;display:none}.login-container.flipped .login-left .forgot-branding{opacity:1;display:block}.login-left .branding-content,.login-left .forgot-branding{width:100%}.login-left .forgot-branding{position:static;top:auto;left:auto;transform:none}}@media (max-width: 480px){.login-container{margin:.5rem auto;width:94%;max-width:380px;border-radius:14px;overflow:visible}.form-container{min-height:320px}.login-left{padding:1rem .875rem;min-height:200px}.login-right{padding:1rem .875rem}.login-form h2,.login-left h1{font-size:1.45rem}.login-left p:nth-of-type(2),.forgot-branding p:nth-of-type(2){display:none}.form-group{margin-bottom:.875rem}.form-group label{left:2rem;top:.7rem;font-size:.85rem}.form-control{padding:.7rem .75rem .7rem 2rem;font-size:.9rem;border-radius:9px}.input-icon{left:.75rem;font-size:.95rem}.btn-login{padding:.75rem;font-size:.9rem;border-radius:9px}}@media (max-width: 360px){.login-container{width:96%;max-width:320px;margin:.5rem auto;overflow:visible}.form-container{min-height:300px}.clinic-logo{width:56px;height:56px;font-size:1.3rem}.login-form h2,.login-left h1{font-size:1.3rem}.form-control{padding:.65rem .65rem .65rem 1.85rem;font-size:.875rem;border-radius:8px}.btn-login{padding:.7rem;font-size:.875rem;border-radius:8px}}