.login{--primary-color:#007bff;--text-color:#333;--border-color:#ccc;--background-color:#ffffff60;--shadow-color:rgba(0,0,0,.1)}.login--dark{--primary-color:#1d4ed8;--text-color:#fff;--background-color:#051b2d;--border-color:#444;--shadow-color:hsla(0,0%,100%,.1)}.login{background-color:var(--background-color);height:100vh}.login,.login__container{display:flex;justify-content:center;align-items:center}.login__container{background-color:#fff;height:50%;width:100%;max-width:900px;box-shadow:4px 4px 10px var(--shadow-color);overflow:hidden}.login__image-container{flex:1;display:none;height:100%}.login__background-image{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.login__form-container{flex:1;padding:40px 30px;display:flex;flex-direction:column;justify-content:center;height:100%}.login__title{font-size:24px;font-weight:700;margin-bottom:30px;color:var(--text-color)}.login__label{display:block;margin-bottom:10px;font-size:14px;color:var(--text-color)}.login__button{width:100%;padding:20px 16px;background-color:var(--primary-color);color:#fff;border:none;border-radius:5px;font-size:16px;cursor:pointer}@media (min-width:768px){.login__image-container{display:block}}@media (max-width:768px){.login__container{height:90%;flex-direction:column;max-width:90%}.login__form-container{width:100%}}