/*
 * auth.css — shared styling for the logged-out members pages: login
 * (view/main.php), password recovery (view/recover.php) and registration
 * (view/register.php).
 *
 * Visual only: the design language (dark #0A011A/#180640 hero, lavender copy,
 * #AC70EF→#F27FBE→#FFB681 gradient CTA, rounded white card) mirrors the new
 * public site. Selectors are scoped under #login-page / #register-page so they
 * override the legacy rules main.min.css applies to the same ids. Functional
 * hooks (#form-login, #recovery-login, #recovery-updatepassword,
 * #register-login, #status, #captcha_wrap, input ids/names) are untouched.
 */

#login-page,
#register-page {
    position: fixed;
    inset: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 28px;
    padding: 24px;
    box-sizing: border-box;
    overflow-y: auto;
    font-family: "Inter", Helvetica, Arial, sans-serif;
    background:
        radial-gradient(1200px 600px at 50% -10%, #2A0B63 0%, rgba(42, 11, 99, 0) 60%),
        linear-gradient(180deg, #180640 0%, #0A011A 100%);
}

#login-page .login-logo,
#register-page .login-logo {
    display: block;
    width: 168px;
    height: auto;
}

#login-page #form,
#register-page #form {
    width: 100%;
    max-width: 420px;
    box-sizing: border-box;
    background: #FFFFFF;
    border-radius: 24px;
    padding: 40px 36px;
    box-shadow: 0 30px 60px rgba(10, 1, 26, 0.45);
    text-align: left;
}

/* Neutralise the legacy panel styling main.min.css puts on the forms. */
#login-page #form form,
#register-page #form form {
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

#login-page h1,
#register-page h1 {
    margin: 0;
    color: #0A011A;
    font-size: 26px;
    font-weight: 700;
    line-height: 32px;
}

#login-page .subtitle,
#register-page .subtitle {
    margin: 8px 0 28px;
    color: #71658B;
    font-size: 15px;
    line-height: 22px;
}

#login-page label,
#register-page label {
    display: block;
    margin-bottom: 8px;
    color: #0A011A;
    font-size: 14px;
    font-weight: 500;
}

#login-page .field,
#register-page .field {
    margin-bottom: 20px;
}

#login-page .input-wrap,
#register-page .input-wrap {
    position: relative;
}

#login-page .input-wrap input.text-input,
#register-page .input-wrap input.text-input {
    padding-left: 46px;
}

#login-page .input-wrap svg,
#register-page .input-wrap svg {
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
    color: #AC70EF;
}

#login-page input.text-input,
#register-page input.text-input {
    width: 100%;
    box-sizing: border-box;
    padding: 20px 16px;
    border: 1px solid #EEE;
    border-radius: 16px;
    background: #FFF;
    color: #0A011A;
    font-family: inherit;
    font-size: 16px;
    font-weight: 500;
    line-height: normal;
    transition: border-color 0.15s ease;
}

#login-page input.text-input:focus,
#register-page input.text-input:focus {
    outline: none;
    border-color: #AC70EF;
}

#login-page input.text-input::placeholder,
#register-page input.text-input::placeholder {
    color: #A79FB8;
    font-weight: 400;
}

#login-page #status,
#register-page #status {
    display: block;
    margin: 4px 0 18px;
    min-height: 1px;
    font-size: 14px;
}

#login-page #status:empty,
#register-page #status:empty {
    margin: 0;
}

#login-page .alert,
#register-page .alert {
    border-radius: 12px;
    padding: 12px 14px;
    font-size: 14px;
    line-height: 20px;
}

#login-page .alert p,
#register-page .alert p {
    margin: 0;
}

#login-page .alert.red,
#register-page .alert.red {
    background: #FDECEC;
    color: #C0392B;
}

#login-page .alert.green,
#register-page .alert.green {
    background: #E9F9F0;
    color: #0E8A50;
}

#login-page .buttons,
#register-page .buttons {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

#login-page input[type="submit"].button-a,
#register-page input[type="submit"].button-a {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    border: 0;
    cursor: pointer;
    padding: 17px 24px;
    border-radius: 16px;
    color: #FFFFFF;
    font-family: inherit;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    background: linear-gradient(90deg, #AC70EF 0%, #F27FBE 50%, #FFB681 100%);
}

#login-page input[type="submit"].button-a:hover,
#register-page input[type="submit"].button-a:hover {
    opacity: 0.94;
}

#login-page .secondary-links,
#register-page .secondary-links {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin-top: 22px;
    padding-top: 20px;
    border-top: 1px solid #F0EEF5;
}

#login-page .secondary-links.single,
#register-page .secondary-links.single {
    justify-content: center;
}

#login-page .secondary-links a,
#register-page .secondary-links a {
    color: #71658B;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
}

#login-page .secondary-links a:hover,
#register-page .secondary-links a:hover {
    color: #AC70EF;
    text-decoration: underline;
}

/* Captcha block (recover + register when enabled in setup). */
#login-page #captcha_wrap,
#register-page #captcha_wrap {
    margin-bottom: 8px;
    padding-top: 0;
}

#login-page #captcha_wrap #captcha-image,
#register-page #captcha_wrap #captcha-image {
    display: block;
    float: none;
}

#login-page #captcha_wrap img.form_captcha,
#register-page #captcha_wrap img.form_captcha {
    display: block;
    border-radius: 12px;
    border: 1px solid #EEE;
}

/* Reset the legacy sprite (refresh.png, text-indent, float) to a text link. */
#login-page #captcha_wrap #refresh-captcha,
#register-page #captcha_wrap #refresh-captcha,
#login-page #captcha_wrap #refresh-captcha:hover,
#register-page #captcha_wrap #refresh-captcha:hover {
    display: inline-block;
    float: none;
    width: auto;
    height: auto;
    background: none;
    text-indent: 0;
    margin: 6px 0 0;
    color: #71658B;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
}

#login-page #captcha_wrap #refresh-captcha:hover,
#register-page #captcha_wrap #refresh-captcha:hover {
    color: #AC70EF;
}

/* Neutralise the legacy flex/bordered field wrappers on the register page. */
#register-page #user-field,
#register-page #password-field,
#register-page #confirm-password-field,
#register-page #email-field {
    display: block;
    margin: 0 0 20px;
    border: 0;
    border-radius: 0;
}

/* Register-only notices (registrations closed / ancient browser). */
#register-page #content-header h1 {
    font-size: 18px;
    line-height: 26px;
    margin-bottom: 12px;
}

#register-page #content-header ul {
    margin: 0 0 16px;
    padding-left: 20px;
    color: #71658B;
    font-size: 14px;
}