.center-wrapper {height: 100vh;display: flex;align-items: center;justify-content: center;}
.form-container {background-color: var(--interface-main);padding: 20px;box-shadow: 0px 6px 20px var(--shadow-color);width: 100%;max-width: 550px;border-radius: 15px;border: 1px solid var(--border-color);display: flex;}
.form-container .version { width: 100%; text-align: right; font-size: 10px; margin: -20px 0 10px 0; }
.form-container label { display: block; margin-bottom: 5px; }
.mobile { text-align: center; }
.form-container input[type="text"], .form-container input[type="password"] { width: 100%; padding: 7px; margin-bottom: 10px; background-color: var(--input-background); box-sizing: border-box; border-radius: 5px; border: 1px solid var(--border-color); color: var(--font-main);}
.form-container input[type="text"]:focus, .form-container input[type="password"]:focus { border-color: var(--input-main) !important; outline: none; }
.form-container input[type="checkbox"] { margin-right: 10px; accent-color: var(--input-main); }
.form-container input[type="submit"] { width: 100%; padding: 10px; background-color: var(--input-main); border: none; color: var(--container-bg-color); cursor: pointer; transition: background-color 0.3s; border-radius: 5px; }
.form-container input[type="submit"]:hover { background-color: var(--input-main_focus); }
.checkbox-container { display: flex; align-items: center; margin-bottom: 15px; }
.column { flex: 1; padding: 5px; box-sizing: border-box; }
.column img { height: 200px; }
.error { width: 100%; max-width: 300px; text-align: center; color: var(--font-warning); }


/* ------------------------------------------------------------------------------------------------------------------------ MOBILE -----------------------------------------------------------  */
@media only screen and (max-width: 768px) {

.form-container { width: 80%; }
.mobile { display: none; }   


}