/*
 * TEMA WHMCS MAXIMUM 1.0.45
 * Login OAuth / OpenID Connect padronizado.
 * Escopo deliberadamente restrito à tela oauth/login.tpl.
 */

/* O layout OAuth padrão continua existindo, mas nesta tela o cabeçalho e rodapé
   são apenas ocultados visualmente. Isso evita alterar o mecanismo global do OAuth. */
body:has(.maximum-oauth-login-shell) {
    margin: 0 !important;
    background: #ffffff !important;
    color: #0f172a;
}

body:has(.maximum-oauth-login-shell) #header,
body:has(.maximum-oauth-login-shell) #footer {
    display: none !important;
}

body:has(.maximum-oauth-login-shell) #content {
    min-height: 100vh !important;
    min-height: 100dvh !important;
    display: flex !important;
    align-items: stretch !important;
    justify-content: stretch !important;
    margin: 0 !important;
    padding: 24px !important;
    background: #ffffff !important;
    box-sizing: border-box !important;
}

.maximum-oauth-login-shell {
    width: 100%;
    max-width: 520px;
    margin: auto;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: center;
    gap: 22px;
}

.maximum-oauth-brand {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}

.maximum-oauth-brand img {
    display: block;
    width: min(100%, 260px);
    height: auto;
    max-height: 82px;
    object-fit: contain;
}

.maximum-oauth-login-form {
    width: 100%;
    margin: 0;
}

.maximum-oauth-auth-card {
    width: 100%;
    margin: 0 !important;
    overflow: hidden;
    border: 1px solid #e6ece9 !important;
    border-radius: 26px !important;
    background: #ffffff !important;
    box-shadow: 0 28px 80px rgba(15,23,42,.11) !important;
}

.maximum-oauth-auth-card .card-body {
    padding: 34px 34px 28px;
}

.maximum-oauth-auth-card .maximum-auth-heading {
    margin-bottom: 27px;
}

.maximum-oauth-auth-card .maximum-auth-heading > span {
    display: block;
    margin-bottom: 5px;
    color: #13b967;
    font-size: 11px;
    font-weight: 950;
    letter-spacing: .055em;
    text-transform: uppercase;
}

.maximum-oauth-auth-card .maximum-auth-heading h2 {
    margin: 0;
    color: #0f172a;
    font-size: 29px;
    line-height: 1.15;
    font-weight: 950;
    letter-spacing: -.025em;
}

.maximum-oauth-auth-card .maximum-auth-heading p {
    margin: 7px 0 0;
    color: #667085;
    font-size: 13px;
    line-height: 1.5;
}

.maximum-oauth-auth-card .form-group {
    margin-bottom: 20px;
}

.maximum-oauth-auth-card .form-control-label {
    margin-bottom: 8px;
    color: #111827;
    font-size: 13px;
    font-weight: 850;
}

.maximum-oauth-auth-card .input-group {
    min-height: 46px;
}

.maximum-oauth-auth-card .input-group-text {
    min-width: 44px;
    justify-content: center;
    border-color: #dce4e7;
    background: #f7faf9;
    color: #81909d;
}

.maximum-oauth-auth-card .form-control {
    min-height: 46px;
    border-color: #dce4e7;
    color: #344054;
    box-shadow: none !important;
}

.maximum-oauth-auth-card .form-control:focus {
    border-color: #13b967;
    box-shadow: 0 0 0 3px rgba(19,185,103,.10) !important;
}

.maximum-oauth-auth-card .btn-reveal-pw {
    min-width: 46px;
    border-color: #dce4e7;
    background: #fff;
    color: #344054;
}

.maximum-oauth-auth-card .maximum-forgot-link {
    color: #1267c4 !important;
    font-size: 12px;
    font-weight: 800;
}

.maximum-oauth-auth-card .maximum-login-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 8px;
}

.maximum-oauth-auth-card .maximum-remember {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    color: #5d6873;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
}

.maximum-oauth-auth-card .maximum-remember input {
    width: 16px;
    height: 16px;
    accent-color: #13b967;
}

.maximum-oauth-auth-card .maximum-login-button {
    min-width: 150px;
    min-height: 48px !important;
    padding: 10px 22px !important;
    border: 0 !important;
    border-radius: 14px !important;
    background: linear-gradient(135deg, #20ca74 0%, #079657 100%) !important;
    color: #ffffff !important;
    font-weight: 900;
    box-shadow: 0 10px 24px rgba(7,150,87,.20);
}

.maximum-oauth-auth-card .maximum-login-button:hover,
.maximum-oauth-auth-card .maximum-login-button:focus {
    background: linear-gradient(135deg, #16b968 0%, #07874f 100%) !important;
    color: #ffffff !important;
}

.maximum-oauth-auth-card .maximum-auth-footer {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 50px;
    padding: 13px 18px;
    border-top: 1px solid #edf1f2;
    background: #fbfdfc;
    text-align: center;
}

.maximum-oauth-auth-card .maximum-auth-footer small {
    color: #344054;
}

.maximum-oauth-auth-card .maximum-auth-footer a {
    color: #078f53;
    font-weight: 900;
}

/* Alertas de autenticação ficam dentro do mesmo DNA visual. */
.maximum-oauth-auth-card .alert {
    margin-bottom: 20px;
    border-radius: 14px;
    font-size: 13px;
}

@media (max-width: 575.98px) {
    body:has(.maximum-oauth-login-shell) #content {
        padding: 18px 14px !important;
    }

    .maximum-oauth-login-shell {
        max-width: 100%;
        gap: 17px;
    }

    .maximum-oauth-brand img {
        width: min(100%, 210px);
        max-height: 68px;
    }

    .maximum-oauth-auth-card {
        border-radius: 22px !important;
    }

    .maximum-oauth-auth-card .card-body {
        padding: 28px 22px 24px;
    }

    .maximum-oauth-auth-card .maximum-auth-heading {
        margin-bottom: 23px;
    }

    .maximum-oauth-auth-card .maximum-auth-heading h2 {
        font-size: 27px;
    }

    .maximum-oauth-auth-card .maximum-login-actions {
        align-items: stretch;
        flex-direction: column-reverse;
        gap: 14px;
    }

    .maximum-oauth-auth-card .maximum-login-button {
        width: 100%;
    }

    .maximum-oauth-auth-card .maximum-remember {
        justify-content: center;
    }
}

@media (max-width: 359.98px) {
    body:has(.maximum-oauth-login-shell) #content {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    .maximum-oauth-auth-card .card-body {
        padding-left: 18px;
        padding-right: 18px;
    }
}


/* ---------- 1.0.46 | Rodapé informativo de segurança do login OAuth ---------- */
.maximum-oauth-auth-card .maximum-auth-security-footer {
    justify-content: center;
    gap: 11px;
    min-height: 68px;
    padding: 13px 18px;
}

.maximum-oauth-auth-card .maximum-auth-security-icon {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    color: #f59a00;
    font-size: 18px;
    line-height: 1;
}

.maximum-oauth-auth-card .maximum-auth-security-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    text-align: left;
}

.maximum-oauth-auth-card .maximum-auth-security-copy strong {
    color: #0f172a;
    font-size: 12px;
    line-height: 1.35;
    font-weight: 900;
}

.maximum-oauth-auth-card .maximum-auth-security-copy small {
    color: #667085;
    font-size: 10.5px;
    line-height: 1.4;
}

@media (max-width: 575.98px) {
    .maximum-oauth-auth-card .maximum-auth-security-footer {
        gap: 9px;
        padding-left: 14px;
        padding-right: 14px;
    }

    .maximum-oauth-auth-card .maximum-auth-security-icon {
        width: 28px;
        height: 28px;
        font-size: 17px;
    }

    .maximum-oauth-auth-card .maximum-auth-security-copy strong {
        font-size: 11.5px;
    }

    .maximum-oauth-auth-card .maximum-auth-security-copy small {
        font-size: 10px;
    }
}


/* ---------- 1.0.47 | Rodapé OAuth simplificado ---------- */
.maximum-oauth-auth-card .maximum-auth-security-footer {
    min-height: 54px;
    gap: 8px;
    padding-top: 10px;
    padding-bottom: 10px;
}

.maximum-oauth-auth-card .maximum-auth-security-copy {
    display: block;
    text-align: center;
}

.maximum-oauth-auth-card .maximum-auth-security-copy strong {
    color: #667085;
    font-size: 13px;
    line-height: 1.5;
    font-weight: 400;
    white-space: normal;
}

/* ---------- 1.0.52 | Campos OAuth idênticos ao login da Central ---------- */
.maximum-oauth-auth-card .form-control {
    font-size: 14px;
    line-height: 1.5;
    font-weight: 400;
    color: #0f172a;
}

.maximum-oauth-auth-card .form-control::placeholder {
    color: #6c757d;
    opacity: 1;
}

.maximum-oauth-auth-card .form-control::-webkit-input-placeholder {
    color: #6c757d;
    opacity: 1;
}

.maximum-oauth-auth-card .form-control::-moz-placeholder {
    color: #6c757d;
    opacity: 1;
}


/* ---------- 1.0.53 | Espelhamento técnico do login da Central ---------- */
/*
 * Fonte de verdade: templates/maximum/css/custom.css do login normal da Central.
 * Estes overrides reproduzem os mesmos valores, sem estimativa visual.
 */
body:has(.maximum-oauth-login-shell),
.maximum-oauth-login-shell,
.maximum-oauth-auth-card,
.maximum-oauth-auth-card input,
.maximum-oauth-auth-card button,
.maximum-oauth-auth-card label,
.maximum-oauth-auth-card a {
    font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif !important;
}

body:has(.maximum-oauth-login-shell) {
    color: #2a363f;
    font-size: 14px;
    line-height: 1.55;
}

/* Cabeçalho: exatamente o padrão .maximum-auth-heading da Central. */
.maximum-oauth-auth-card .maximum-auth-heading {
    margin-bottom: 27px;
}
.maximum-oauth-auth-card .maximum-auth-heading > span {
    display: block;
    margin-bottom: 5px;
    color: #28c76f;
    font-size: 11px;
    font-weight: 950;
    line-height: 1.55;
    letter-spacing: .055em;
    text-transform: uppercase;
}
.maximum-oauth-auth-card .maximum-auth-heading h2 {
    margin: 0;
    color: #0f172a;
    font-size: 29px;
    font-weight: 950;
    line-height: 1.2;
    letter-spacing: -.025em;
}

/* Formulários: cópia dos valores de .maximum-whmcs do tema principal. */
.maximum-oauth-auth-card .form-group {
    margin-bottom: 1rem;
}
.maximum-oauth-auth-card label,
.maximum-oauth-auth-card .form-control-label {
    color: #344054;
    font-size: 12.5px;
    font-weight: 850;
    line-height: 1.55;
}
.maximum-oauth-auth-card .form-control {
    min-height: 46px;
    padding: .375rem .75rem;
    border: 1px solid #dfe6e9;
    border-radius: 12px;
    background-color: #fff;
    color: #0f172a;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    box-shadow: none !important;
    transition: border-color .16s ease, box-shadow .16s ease;
}
.maximum-oauth-auth-card .form-control::placeholder,
.maximum-oauth-auth-card .form-control::-webkit-input-placeholder,
.maximum-oauth-auth-card .form-control::-moz-placeholder {
    color: #6c757d;
    font-size: 14px;
    font-weight: 400;
    opacity: 1;
}
.maximum-oauth-auth-card .form-control:focus {
    border-color: rgba(25,113,194,.62);
    box-shadow: 0 0 0 4px rgba(25,113,194,.085) !important;
}
.maximum-oauth-auth-card .input-group {
    min-height: 46px;
}
.maximum-oauth-auth-card .input-group .form-control {
    min-height: 46px;
}
.maximum-oauth-auth-card .input-group-text {
    min-width: 44px;
    justify-content: center;
    border-color: #dfe6e9;
    background: #f8faf9;
    color: #8a98a3;
    font-size: 14px;
    line-height: 1.5;
}
.maximum-oauth-auth-card .btn-reveal-pw {
    min-width: 46px;
    min-height: 40px;
    border-color: #dde5e7;
    border-radius: 12px;
    background: #fff;
    color: #536070;
    font-weight: 850;
    box-shadow: none;
}
.maximum-oauth-auth-card .btn-reveal-pw:hover,
.maximum-oauth-auth-card .btn-reveal-pw:focus {
    border-color: #c9ded5;
    background: #f7fbf9;
    color: #087f5b;
}

/* Link e ações: mesmos valores da Central. */
.maximum-oauth-auth-card .maximum-forgot-link {
    color: #1971c2 !important;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.55;
}
.maximum-oauth-auth-card .maximum-login-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 8px;
}
.maximum-oauth-auth-card .maximum-remember {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    color: #5d6873;
    font-size: 12.5px;
    font-weight: 850;
    line-height: 1.55;
    cursor: pointer;
}
.maximum-oauth-auth-card .maximum-remember input {
    width: 16px;
    height: 16px;
    accent-color: #28c76f;
}

/* Botão: mesmas regras .btn/.btn-primary/.maximum-login-button da Central. */
.maximum-oauth-auth-card .maximum-login-button {
    min-width: 150px;
    min-height: 48px !important;
    padding: .375rem .75rem !important;
    border: 1px solid #28c76f !important;
    border-radius: 14px !important;
    background: linear-gradient(135deg,#28c76f,#087f5b) !important;
    color: #fff !important;
    font-weight: 850;
    box-shadow: none;
    transition: .16s ease;
}
.maximum-oauth-auth-card .maximum-login-button:hover,
.maximum-oauth-auth-card .maximum-login-button:focus {
    border-color: #087f5b !important;
    background: linear-gradient(135deg,#31cf78,#087f5b) !important;
    color: #fff !important;
    transform: translateY(-1px);
    box-shadow: 0 11px 24px rgba(8,127,91,.16) !important;
}

/* Card: mesmos valores estruturais do login normal. */
.maximum-oauth-auth-card {
    margin: 0 !important;
    border-radius: 26px !important;
    box-shadow: 0 28px 80px rgba(15,23,42,.11) !important;
}
.maximum-oauth-auth-card .card-body {
    padding: 34px 34px 28px;
}

@media (max-width: 575.98px) {
    .maximum-oauth-auth-card .card-body {
        padding: 28px 24px 24px;
    }
    .maximum-oauth-auth-card .maximum-auth-heading h2 {
        font-size: 27px;
    }
    .maximum-oauth-auth-card .maximum-login-button {
        width: 100%;
    }
    .maximum-oauth-auth-card .maximum-remember {
        justify-content: center;
    }
}
