body{margin:0;padding:0}.login-container{height:120%;display:flex;align-items:center;justify-content:center;margin-top:35px;padding:40px 20px;background:url(/image/bg-main.png) center / cover no-repeat;position:relative}.login-wrapper{width:100%;max-width:1200px;background:#fff;border-radius:30px;box-shadow:0 10px 40px #00000026;overflow:hidden;display:flex;flex-direction:row}.login-image-section{flex:1;min-height:500px;position:relative;overflow:hidden;background:#fff;padding:20px;display:flex;align-items:center;justify-content:center}.login-image-section img{width:100%;height:100%;object-fit:cover;display:block;border-radius:20px}.login-form-section{flex:1;padding:60px;display:flex;flex-direction:column;justify-content:center;background:#fff}.login-header{text-align:center;margin-bottom:10px}.login-header h2{color:#c2185b;font-size:32px;font-weight:700;margin-bottom:15px;font-family:CHULALONGKORN}.login-subtitle{color:#c2185b;font-size:20px;margin-bottom:15px;border-bottom:2px dotted #e0e0e0;padding-bottom:20px}.form-group{margin-bottom:25px!important;position:relative!important}.form-group label{display:block;color:#c2185b;font-weight:600;margin-bottom:10px;font-size:14px;text-transform:uppercase}.form-control{width:100%;padding:12px 50px 12px 16px!important;border:1px solid #e0e0e0;border-radius:50px;font-size:20px;transition:all .3s ease;background:#f5f5f5}.form-control:focus{outline:none;border-color:#f48fb1!important;background:#fff!important;box-shadow:0 0 0 3px #f48fb11a!important}.form-control::placeholder{color:#bdbdbd}.form-control.is-invalid{border:2px solid #dc3545!important;padding-right:50px!important;background-color:#fff!important;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e")!important;background-repeat:no-repeat!important;background-position:right 15px center!important;background-size:20px 20px!important}.form-control.is-valid{border:2px solid #198754!important;padding-right:50px!important;background-color:#fff!important;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e")!important;background-repeat:no-repeat!important;background-position:right 15px center!important;background-size:20px 20px!important}.validation-message{color:#dc3545!important;font-size:14px!important;margin-top:8px!important;margin-left:16px!important;display:none!important;font-weight:600!important;line-height:1.5!important}.validation-message.show{display:block!important;animation:fadeIn .2s ease-in!important;visibility:visible!important;opacity:1!important}@keyframes fadeIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}.position-relative{position:relative!important}.password-toggle{position:absolute!important;right:18px!important;top:50%!important;transform:translateY(-50%)!important;cursor:pointer!important;color:#6c757d!important;z-index:100!important;transition:color .15s ease-in-out!important;font-size:20px!important;width:24px!important;height:24px!important;display:flex!important;align-items:center!important;justify-content:center!important;pointer-events:auto!important}.password-toggle:hover{color:#c2185b!important}.password-toggle i{font-size:20px!important;pointer-events:none!important}.alert{position:relative!important;display:flex!important;align-items:flex-start!important;padding:1rem 3rem 1rem 1rem!important;margin-bottom:1.5rem!important;border:none!important;border-radius:20px!important;animation:slideDown .3s ease-out!important}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.alert-danger{background-color:#fff5f5!important;border-left:4px solid #dc3545!important;color:#721c24!important}.alert-success{background-color:#f0fff4!important;border-left:4px solid #28a745!important;color:#155724!important}.alert-warning{background-color:#fff3cd!important;border-left:4px solid #ffc107!important;color:#856404!important}.alert-content{flex:1!important;display:flex!important;align-items:center!important;gap:.5rem!important}.alert-content i{flex-shrink:0!important;font-size:1.1rem!important}.alert-content span{flex:1!important;line-height:1.5!important}.alert .btn-close{position:absolute!important;top:50%!important;right:1rem!important;transform:translateY(-50%)!important;width:1.5rem!important;height:1.5rem!important;padding:0!important;background:transparent!important;border:none!important;cursor:pointer!important;opacity:.5!important;transition:opacity .15s ease-in-out!important;display:flex!important;align-items:center!important;justify-content:center!important;font-size:1.25rem!important;font-weight:700!important;line-height:1!important;color:inherit!important}.alert .btn-close:hover{opacity:1!important}.alert .btn-close:focus{outline:2px solid currentColor!important;outline-offset:2px!important;opacity:1!important}.text-danger{color:#dc3545!important}.mb-0{margin-bottom:0!important}.me-2{margin-right:.5rem!important}.btn-wrapper{background:linear-gradient(135deg,#f5f5f5,#e0e0e0);padding:30px;border-radius:20px;margin-top:20px;display:flex;justify-content:center;align-items:center}.btn-login{width:100%;max-width:400px;padding:15px 20px;background:linear-gradient(90deg,#df5c8e,#53186e);color:#fff;border:none;border-radius:50px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #ec407a4d;position:relative}.btn-login:hover{background:linear-gradient(90deg,#df5c8e,#53186e);box-shadow:0 6px 20px #ec407a66;transform:translateY(-2px);color:#fff}.btn-login:active{transform:translateY(0)}.btn-login:disabled{opacity:.65!important;cursor:not-allowed!important}.btn-login .btn-text,.btn-login .btn-loading{display:flex!important;align-items:center!important;justify-content:center!important}.btn-login.loading .btn-text{display:none!important}.btn-login.loading .btn-loading{display:flex!important}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.fa-spinner{animation:spin 1s linear infinite!important}@media(max-width:992px){.login-wrapper{flex-direction:column}.login-image-section{min-height:300px}.login-form-section{padding:40px 30px}}@media(max-width:576px){.login-form-section{padding:30px 20px}.login-header h2{font-size:24px}.login-subtitle{font-size:14px}.form-control{font-size:16px!important}.password-toggle{right:15px!important;font-size:18px!important}}.wave-decoration{position:absolute;bottom:0;left:0;right:0;height:100px;background:linear-gradient(to top,rgba(255,255,255,.9),transparent);pointer-events:none}.input-wrapper{position:relative!important;width:100%}.input-wrapper .form-control{width:100%;padding:12px 50px 12px 16px!important}.input-wrapper .password-toggle{position:absolute!important;right:18px!important;top:50%!important;transform:translateY(-50%)!important;cursor:pointer!important;color:#6c757d!important;z-index:10!important;font-size:20px!important;display:flex!important;align-items:center!important;justify-content:center!important}.input-wrapper .password-toggle:hover{color:#c2185b!important}.input-wrapper .validation-message{position:relative!important;margin-top:8px!important}