/**
 * Elysium Login — Login page styles
 */

#elysium-login-container {
    max-width: 400px;
    margin: 0 auto;
    padding: 20px;
}

#elysium-login-container h3 {
    margin-bottom: 10px;
    color: #1d2327;
    font-size: 18px;
}

#elysium-qr-container img {
    border: 1px solid #c3c4c7;
    border-radius: 4px;
    background: #fff;
}

#elysium-status,
.elysium-message {
    margin: 10px 0;
    padding: 8px 12px;
    border-radius: 3px;
}

#elysium-status .error,
.elysium-message .error {
    color: #d63638;
    background: #fcf0f1;
    border: 1px solid #d63638;
}

#elysium-status .updated,
.elysium-message .updated {
    color: #00a32a;
    background: #edfaef;
    border: 1px solid #00a32a;
}

#elysium-register-section {
    display: none; /* hidden by default, shown via toggle */
}

#elysium-register-section h3 {
    color: #1d2327;
    font-size: 18px;
    margin-bottom: 15px;
}

#elysium-register-form .form-table {
    margin: 10px auto;
    text-align: left;
    width: 100%;
    max-width: 320px;
}

#elysium-register-form .form-table th,
#elysium-register-form .form-table td {
    padding: 4px 8px;
}

#elysium-register-form .elysium-code-field {
    margin: 15px 0;
}

#elysium-register-form .elysium-code-field input {
    text-align: center;
    font-size: 18px;
    letter-spacing: 4px;
    width: 120px;
}

#elysium-qr-approval {
    margin: 20px 0;
}

#elysium-qr-approval img {
    border: 1px solid #c3c4c7;
    border-radius: 4px;
    background: #fff;
}

#elysium-switch-to-login,
#elysium-switch-to-register,
#elysium-switch-to-email {
    color: #3c434a;
    text-decoration: none;
}

#elysium-switch-to-login:hover,
#elysium-switch-to-register:hover,
#elysium-switch-to-email:hover {
    color: #2271b1;
}

.elysium-register-submit {
    margin-top: 10px;
}