/* Only the pieces GoyWebmail's stylesheet does not cover. */

[hidden] { display: none !important; }

.auth_switch {
    display: grid;
    grid-template-columns: 1fr 1fr;
    width: min(52ch, calc(100% - 1em));
    margin: 0.85em auto 0;
    padding: 0.28em;
    background: linear-gradient(180deg, #1b1b1b 0%, #101010 100%);
    border: 1px solid #3d3d3d;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 0.4em 1.1em rgba(0, 0, 0, 0.28);
}

.auth_switch button {
    margin: 0;
    padding: 0.62em 0.7em;
    border: 1px solid transparent;
    background: transparent;
    color: #a3a3a3;
    font: inherit;
    font-size: 0.78em;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    cursor: pointer;
}

.auth_switch button:hover {
    color: #f5f5f5;
}

.auth_switch button[aria-pressed="true"] {
    color: #062006;
    background: linear-gradient(180deg, #c8f7b4 0%, #62d15a 58%, #2f9a34 100%);
    border-color: #174816;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55), 0 0.12em 0.35em rgba(0, 0, 0, 0.35);
}

.auth_switch button:focus-visible,
.login_methods button:focus-visible,
.login_methods input[type="submit"]:focus-visible {
    outline: 2px solid var(--announce-color-accent, #6ee66e);
    outline-offset: 2px;
}

.login_methods button,
.login_methods input[type="submit"] {
    appearance: none;
    box-sizing: border-box;
    padding: 0.42em 0.95em;
    border: 1px solid #5c5c5c;
    background: linear-gradient(180deg, #2e2e2e 0%, #171717 100%);
    color: #f3f3f3;
    font: inherit;
    font-weight: 700;
    letter-spacing: 0.02em;
    cursor: pointer;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.login_methods button:hover,
.login_methods input[type="submit"]:hover {
    border-color: #bdbdbd;
    color: #fff;
}

.login_methods .token_login,
.login_methods input[type="submit"],
.login_methods .register_submit,
.login_methods .issued_login {
    color: #062006;
    background: linear-gradient(180deg, #c8f7b4 0%, #62d15a 58%, #2f9a34 100%);
    border-color: #174816;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

.login_methods .token_login:hover,
.login_methods input[type="submit"]:hover,
.login_methods .register_submit:hover,
.login_methods .issued_login:hover {
    color: #062006;
    border-color: #0d2e0c;
    filter: brightness(1.06);
}

.login_methods button:disabled {
    opacity: 0.55;
    cursor: default;
    filter: none;
}

.auth_off { display: none !important; }

.login_choice input[name="handle"],
.login_choice input[name="captcha_answer"],
.login_choice select[name="domain"],
.issued_token input {
    box-sizing: border-box;
    width: 100%;
    max-width: 26em;
}

.captcha_img {
    display: block;
    width: 100%;
    max-width: 26em;
    height: auto;
    margin-bottom: 0.4em;
    background: #111;
}

.captcha_instruction {
    display: block;
    margin-bottom: 0.35em;
    color: #d8d8d8;
}

.captcha_refresh {
    display: block;
    margin-top: 0.35em;
}

.issued_token {
    margin-top: 0.8em;
}

.issued_jid {
    font-weight: 800;
}

.auth_error {
    margin: 0.6em 0 0;
    color: #ff8080;
}

.login_choice input[name="jid"] {
    box-sizing: border-box;
    width: 100%;
    max-width: 26em;
}

.nojs_webmail { cursor: default; }
.nojs_webmail_title { text-decoration: none; }

.soon {
    display: inline-block;
    margin-left: 0.45em;
    padding: 0.05em 0.45em;
    border-radius: 1em;
    background: var(--announce-color-accent, #6ee66e);
    color: #111;
    font-size: 0.62em;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    vertical-align: 0.15em;
}

.add-contact,
.join-room {
    display: flex;
    flex-direction: column;
    gap: 0.35em;
    margin: 0.4em 0;
}

.add-contact input,
.join-room input,
.account_card .status-text,
.account_card select {
    box-sizing: border-box;
    width: 100%;
}

.message_panel .typing {
    margin: 0;
    padding: 0.4em 0.8em;
    color: #bbb;
    font-style: italic;
}