*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}.auth-card{width:900px;max-width:100%;min-height:580px;border-radius:8px;box-shadow:0 8px 40px #00000026;background:#fff;overflow:hidden;position:relative}.form-container{position:absolute;top:0;width:50%;height:100%;transition:all .6s ease-in-out}.form-container .form-inner{display:flex;flex-direction:column;justify-content:safe center;height:100%;padding:2rem;overflow-y:auto;scrollbar-width:none}.form-container .form-inner:hover{scrollbar-width:thin;scrollbar-color:rgba(90,141,238,.3) transparent}.form-container .form-inner::-webkit-scrollbar{width:4px}.form-container .form-inner::-webkit-scrollbar-track{background:transparent}.form-container .form-inner::-webkit-scrollbar-thumb{background:transparent;border-radius:4px}.form-container .form-inner:hover::-webkit-scrollbar-thumb{background:#5a8dee4d}.form-container .form-inner:hover::-webkit-scrollbar-thumb:hover{background:#5a8dee99}.login-container{left:0;z-index:2;opacity:1}.register-container{left:0;z-index:1;opacity:0}.auth-card.active .login-container{transform:translate(100%);opacity:0;z-index:1}.auth-card.active .register-container{transform:translate(100%);opacity:1;z-index:5}.overlay-container{position:absolute;top:0;right:0;width:50%;height:100%;overflow:hidden;z-index:100;transition:transform .6s ease-in-out}.auth-card.active .overlay-container{transform:translate(-100%)}.overlay{background:linear-gradient(135deg,#1a2a4a,#2c5282);color:#fff;position:relative;width:200%;height:100%;left:-100%;transition:transform .6s ease-in-out}.auth-card.active .overlay{transform:translate(50%)}.overlay-panel{position:absolute;top:0;width:50%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem 2.5rem;text-align:center;transition:transform .6s ease-in-out}.overlay-panel img{max-width:70%;height:auto;margin-bottom:1.5rem;filter:drop-shadow(0 4px 12px rgba(0,0,0,.25))}.overlay-panel h5{font-size:1.25rem;font-weight:700;margin-bottom:.5rem}.overlay-panel p{font-size:.85rem;opacity:.9;margin-bottom:1.5rem;line-height:1.5}.overlay-panel .overlay-brand{font-weight:700;font-size:1.4rem;margin-bottom:.1rem}.overlay-panel .overlay-subtitle{font-size:.8rem;opacity:.8;margin-bottom:1rem}.btn-ghost{display:inline-block;background:transparent;border:2px solid #fff;color:#fff;padding:.55rem 2.5rem;border-radius:25px;font-weight:600;font-size:.9rem;cursor:pointer;transition:all .3s;text-decoration:none}.btn-ghost:hover{background:#fff;color:#2c5282}.overlay-left{left:0;transform:translate(-20%)}.auth-card.active .overlay-left{transform:translate(0)}.overlay-right{right:0;transform:translate(0)}.auth-card.active .overlay-right{transform:translate(20%)}.form-title{font-size:1.4rem;font-weight:600;color:#475f7b;text-align:center;margin-bottom:1.5rem}.form-group{margin-bottom:.85rem}.form-group label{display:block;font-weight:600;color:#475f7b;font-size:.88rem;margin-bottom:.35rem}.form-group label i{margin-right:5px;color:#5a8dee}.form-control{display:block;width:100%;border:1px solid #dfe3e7;border-radius:5px;padding:.6rem .75rem;font-size:.95rem;font-family:inherit;outline:none;transition:border-color .2s,box-shadow .2s}.form-control:focus{border-color:#5a8dee;box-shadow:0 3px 8px #5a8dee33}.form-control.is-invalid{border-color:#ea5455}.password-wrap{position:relative}.password-wrap .form-control{padding-right:40px}.password-wrap .toggle-pw{position:absolute;right:12px;bottom:10px;cursor:pointer;color:#475f7b;font-size:1.1rem;background:none;border:none;padding:0}.password-wrap .toggle-pw:hover{color:#5a8dee}.btn-submit{display:block;width:100%;background:#5a8dee;border:none;color:#fff;font-weight:600;padding:.7rem;border-radius:5px;font-size:1rem;font-family:inherit;cursor:pointer;transition:all .3s;box-shadow:0 2px 10px #5a8dee66}.btn-submit:hover{background:#4a7dd6;box-shadow:0 4px 18px #5a8dee99;transform:translateY(-1px)}.btn-submit i{margin-left:8px}.auth-divider{border:none;border-top:1px solid #dfe3e7;margin:1rem 0}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:.85rem}.pw-match-msg{font-size:.75rem;margin-top:.25rem;display:none}.pw-match-msg.show{display:block}.pw-match-msg.match{color:#28a745}.pw-match-msg.no-match{color:#ea5455}.field-error{font-size:.75rem;color:#ea5455;margin-top:.25rem;display:none}.field-error.show{display:block}.form-control.input-error{border-color:#ea5455}.form-control.input-valid{border-color:#28a745}.form-check{display:flex;align-items:flex-start;gap:8px;margin-bottom:1rem}.form-check input[type=checkbox]{margin-top:3px;width:16px;height:16px;accent-color:#5a8dee;cursor:pointer}.form-check label{font-size:.85rem;color:#475f7b;cursor:pointer;line-height:1.4}.form-check label a{color:#5a8dee;text-decoration:underline}.auth-links{text-align:center;font-size:.88rem;color:#475f7b}.auth-links p{margin:.35rem 0}.auth-links a{color:#5a8dee;text-decoration:none;cursor:pointer}.auth-links a:hover{text-decoration:underline}.toast-container{position:fixed;top:20px;right:20px;z-index:9999;display:flex;flex-direction:column;gap:10px}.toast{min-width:300px;max-width:400px;padding:14px 20px;border-radius:8px;font-size:.88rem;display:flex;align-items:center;gap:10px;box-shadow:0 4px 20px #00000026;animation:slideIn .4s ease,fadeOut .4s ease 4.6s forwards;cursor:pointer}.toast-danger{background:#fff;border-left:4px solid #ea5455;color:#475f7b}.toast-danger i{color:#ea5455;font-size:1.2rem}.toast-success{background:#fff;border-left:4px solid #28a745;color:#475f7b}.toast-success i{color:#28a745;font-size:1.2rem}@keyframes slideIn{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0;transform:translate(50px)}}.terms-modal{display:none;position:fixed;inset:0;z-index:9999;background:#00000080;align-items:center;justify-content:center;padding:20px}.terms-modal-content{background:#fff;border-radius:10px;max-width:750px;width:100%;max-height:90vh;display:flex;flex-direction:column;box-shadow:0 8px 40px #0003}.terms-modal-header{display:flex;align-items:center;justify-content:space-between;padding:1.2rem 1.5rem;border-bottom:1px solid #e2e8f0}.terms-modal-header h3{margin:0;font-size:1.1rem;font-weight:600;color:#1e293b;flex:1}.terms-modal-close{background:none;border:none;font-size:1.5rem;cursor:pointer;color:#64748b;line-height:1}.terms-modal-body{padding:1.5rem;overflow-y:auto;font-size:.9rem;line-height:1.7;color:#334155}.terms-modal-body h4{font-size:1.05rem;font-weight:700;color:#1e293b;margin-bottom:1rem}.terms-modal-body p{margin-bottom:1rem}.terms-modal-footer{padding:1rem 1.5rem;border-top:1px solid #e2e8f0;text-align:right}.terms-modal-footer .btn-close-terms{background:#5a8dee;color:#fff;border:none;padding:.5rem 1.5rem;border-radius:5px;font-weight:600;cursor:pointer}@media(max-width:767px){.auth-card{max-width:420px;min-height:auto}.overlay-container{display:none}.form-container{position:relative;width:100%}.register-container{display:none;opacity:1;transform:none}.auth-card.active .login-container{display:none;transform:none;opacity:1}.auth-card.active .register-container{display:block;transform:none}}body{background:url(/assets/images/auth-bg.jpg) no-repeat center center / cover}.splash-screen{position:fixed;top:0;left:0;width:100%;height:100%;background:#ffffffd9;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:9999;transition:opacity .4s ease,visibility .4s ease}.splash-screen.hidden{opacity:0;visibility:hidden}.splash-logo{width:80px;height:80px;display:flex;align-items:center;justify-content:center;animation:splashPulse 1.5s ease-in-out infinite}.splash-logo img{width:72px;height:72px;object-fit:contain;filter:drop-shadow(0 4px 8px rgba(0,0,0,.15))}.splash-logo span{font-size:2.2rem;font-weight:800;color:#1e40af}.splash-title{color:#1e40af;font-size:1.8rem;font-weight:700;margin-top:1.2rem;letter-spacing:2px}.splash-subtitle{color:#1e40af99;font-size:.8rem;margin-top:.4rem;letter-spacing:.5px}.splash-dots{display:flex;gap:8px;margin-top:2rem}.splash-dots span{width:10px;height:10px;background:#1e40af66;border-radius:50%;animation:dotBounce 1.4s ease-in-out infinite}.splash-dots span:nth-child(2){animation-delay:.2s}.splash-dots span:nth-child(3){animation-delay:.4s}@keyframes splashPulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes dotBounce{0%,80%,to{transform:scale(.6);opacity:.4}40%{transform:scale(1);opacity:1}}
