/* Layout adaptado de SQDI-1376v2 (b8b91edab). Tema fornecido pela partial White Label. */
.password-change-body {
    --password-header: #140024;
    --password-accent: #b494e8;
    --password-accent-strong: #7d34f3;
    --password-accent-soft: #efe7ff;
    --password-text: #00112c;
    --password-muted: #526b91;
    --password-border: #dfe6f1;
    --password-shadow: 0 22px 45px rgba(15, 24, 44, .12);
    margin: 0;
    min-height: 100vh;
    background: #ffffff !important;
    background-image: none !important;
    color: var(--password-text);
    font-family: "Open Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.password-change-header {
    height: 90px;
    padding: 0 64px;
    background: var(--password-header);
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.password-brand {
    display: flex;
    align-items: center;
    min-width: 160px;
}

.password-brand img {
    display: block;
    max-width: 220px;
    max-height: 48px;
    object-fit: contain;
}

.password-change-shell {
    width: min(1220px, calc(100% - 64px));
    margin: 60px auto;
    display: grid;
    grid-template-columns: 1.05fr .95fr;
    gap: 40px;
}

.password-card {
    min-height: 560px;
    border: 1px solid var(--password-border);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: var(--password-shadow);
}

.password-form-card {
    padding: 42px 40px;
}

.password-card-title {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 38px;
}

.password-card-icon {
    width: 56px;
    height: 56px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 56px;
    background: var(--password-accent-soft);
    color: var(--password-accent-strong);
    font-size: 27px;
    font-weight: 700;
}

.password-card-icon .fa {
    font-family: FontAwesome;
    font-size: 24px;
    font-style: normal;
    font-weight: normal;
}

.password-card-title h1 {
    margin: 0;
    color: var(--password-text);
    font-size: 25px;
    line-height: 1.2;
    font-weight: 800;
}

.password-card-title p {
    margin: 5px 0 0;
    color: var(--password-muted);
    font-size: 16px;
    line-height: 1.4;
}

.password-change-form {
    display: flex;
    flex-direction: column;
    gap: 26px;
}

.password-field {
    display: flex;
    flex-direction: column;
    gap: 9px;
}

.password-field label {
    color: var(--password-text);
    font-size: 16px;
    font-weight: 800;
    margin: 0;
}

.password-input-wrap {
    position: relative;
    display: flex;
    align-items: center;
}

.password-input-wrap input {
    position: relative;
    z-index: 1;
    width: 100%;
    min-height: 53px;
    padding: 14px 54px 14px 22px;
    border: 1px solid var(--password-border);
    border-radius: 16px;
    background: #ffffff;
    color: var(--password-muted);
    font-size: 18px;
    font-family: inherit;
    box-shadow: 0 3px 8px rgba(13, 31, 61, .12);
}

.password-input-wrap input:focus {
    outline: none;
    border-color: var(--password-accent);
    box-shadow: 0 0 0 3px rgba(180, 148, 232, .18), 0 3px 8px rgba(13, 31, 61, .12);
}

.password-change-body .toggle-password {
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
    z-index: 2;
    width: 34px;
    height: 34px;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--password-muted);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 22px;
    pointer-events: auto;
}

.password-change-body .toggle-password .fa {
    font-family: FontAwesome;
    font-size: 16px;
    font-style: normal;
    font-weight: normal;
}

.password-change-body .toggle-password:hover {
    background: var(--password-accent-soft);
    color: var(--password-accent-strong);
}

.password-primary-action {
    width: 100%;
    min-height: 55px;
    margin-top: 0;
    border: 0;
    border-radius: 16px;
    background: var(--password-accent);
    color: #ffffff;
    font-size: 16px;
    font-weight: 800;
    cursor: pointer;
    box-shadow: 0 4px 10px rgba(92, 63, 145, .22);
}

.password-primary-action:hover {
    background: var(--password-accent-strong);
}

.password-secondary-action {
    display: inline-flex;
    margin-top: 18px;
    color: var(--password-accent-strong);
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
}

.password-secondary-action:hover {
    color: var(--password-accent-strong);
    text-decoration: underline;
}

.password-alert {
    margin: -8px 0 0;
    border-radius: 8px;
}

.password-alert p {
    margin: 0;
}

.password-alert-success {
    border: 1px solid #93d9a2;
    background: #eaf8ee;
    color: #167a2f;
}

.password-policy-card {
    padding: 42px 40px 40px;
}

.password-policy-title {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 32px;
}

.password-policy-title span {
    color: var(--password-accent-strong);
    font-size: 27px;
    line-height: 1;
}

.password-policy-title .fa,
.password-policy-section .fa {
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
}

.password-policy-title h2 {
    margin: 0;
    color: var(--password-text);
    font-size: 20px;
    line-height: 1.2;
    font-weight: 800;
}

.password-policy-section {
    margin-top: 28px;
}

.password-policy-section h3,
.password-policy-tips h3 {
    margin: 0 0 14px;
    color: var(--password-muted);
    font-size: 14px;
    font-weight: 800;
    letter-spacing: 0;
}

.password-policy-section p,
.password-policy-tips p {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    margin: 0 0 13px;
    color: var(--password-muted);
    font-size: 16px;
    line-height: 1.4;
}

.password-policy-section p span {
    color: var(--password-muted);
    font-weight: 800;
}

.password-policy-tips {
    margin-top: 30px;
    padding: 20px 22px;
    border-radius: 8px;
    background: var(--password-accent-soft);
    box-shadow: 0 8px 18px rgba(15, 24, 44, .08);
}

.password-policy-tips h3 {
    color: var(--password-accent-strong);
}

.password-policy-tips p {
    margin-bottom: 9px;
}

.password-policy-section ul,
.password-policy-tips ul {
    margin: 0;
    padding-left: 20px;
    color: var(--password-muted);
    font-size: 16px;
    line-height: 1.4;
}

.password-policy-section li,
.password-policy-tips li {
    margin-bottom: 9px;
}

.password-policy-section ul { list-style: none; }
.password-policy-section li { position: relative; }
.password-policy-section li > .fa-check { position: absolute; left: -20px; top: 0.2em; }

@media (max-width: 980px) {
    .password-change-header {
        padding: 0 24px;
    }

    .password-change-shell {
        width: min(680px, calc(100% - 32px));
        grid-template-columns: 1fr;
        margin: 32px auto;
    }

    .password-card {
        min-height: 0;
    }
}

@media (max-width: 520px) {
    .password-change-header {
        height: auto;
        min-height: 82px;
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
        padding: 22px;
    }

    .password-form-card,
    .password-policy-card {
        padding: 26px 22px;
    }

    .password-card-title {
        align-items: flex-start;
        margin-bottom: 28px;
    }

    .password-card-title h1 {
        font-size: 22px;
    }
}
.password-change-body *, .password-change-body *:before, .password-change-body *:after { box-sizing: border-box; }
.password-primary-action:focus-visible,.password-change-body .toggle-password:focus-visible { outline:2px solid var(--password-accent-strong); outline-offset:3px; }
/* Cadastro MFA: mesmos cartoes das senhas, com medidas da referencia visual. */
.password-shield { width:22px; height:22px; flex-shrink:0; color:var(--password-accent-strong); }
.password-change-body.password-mfa-body { background:#f4f2f8 !important; }
.password-mfa-shell { width:calc(100% - 16px); max-width:1080px; grid-template-columns:1fr 1fr; gap:24px; margin:20px auto; }
.password-mfa-shell .password-card { min-height:0; border-radius:16px; padding:28px 24px; }
.password-mfa-shell .password-card-title { gap:12px; margin-bottom:18px; align-items:center; }
.password-mfa-shell .password-card-title h1 { font-size:19px; line-height:1.35; }
.password-mfa-shell .password-card-icon { width:38px; height:38px; flex-basis:38px; border-radius:12px; }
.password-mfa-shell .mfa-introduction { color:var(--password-muted); font-size:12px; line-height:1.6; margin-bottom:18px; }
.mfa-channels { border:0; padding:0; margin:0 0 22px; display:flex; gap:24px; }
.mfa-channels label { display:flex; gap:5px; align-items:center; font-size:12px; }
.mfa-channels input { margin:0; accent-color:var(--password-accent); }
.password-mfa-shell .password-field { gap:4px; }
.password-mfa-shell .password-field label { font-size:12px; font-weight:600; }
.password-mfa-shell .password-input-wrap input { min-height:40px; font-size:13px; padding:10px 42px 10px 12px; border-radius:13px; }
.password-mfa-shell .password-primary-action { min-height:40px; border-radius:13px; font-size:12px; margin-top:16px; background:#a580df; }
.password-mfa-shell .password-primary-action:hover { background:var(--password-accent-strong); }
.password-mfa-shell .password-primary-action:disabled { opacity:.75; cursor:not-allowed; }
.mfa-countdown { min-height:16px; text-align:center; font-size:10px; color:var(--password-muted); margin:10px 0 0; }
.mfa-verification { border-top:1px solid var(--password-border); padding-top:26px; margin-top:24px; }
.mfa-verification > p { font-size:12px; text-align:center; margin-bottom:12px; }
.mfa-verification input[type=password], .mfa-verification input[type=text] { text-align:center; letter-spacing:3px; }
.mfa-feedback { color:var(--password-text); font-size:12px; margin:10px 0; }
.mfa-feedback:empty { display:none; }
.mfa-guide .password-policy-title { gap:10px; margin:0 0 24px; }
.mfa-guide .password-policy-title h2 { font-size:17px; }
.mfa-guide h3 { font-size:11px; letter-spacing:1px; font-weight:600; margin:22px 0 12px; color:var(--password-text); }
.mfa-guide ul { padding-left:16px; margin:0; font-size:12px; line-height:1.5; color:var(--password-text); }
.mfa-guide li { margin-bottom:7px; }
.mfa-guide .mfa-checks { list-style:none; padding-left:0; }
.mfa-checks li { position:relative; padding-left:22px; }
.mfa-checks li:before { content:"✓"; position:absolute; left:0; color:var(--password-accent); }
.mfa-guide .password-policy-tips { margin-top:22px; padding:16px; box-shadow:none; border-radius:14px; }
.mfa-guide .password-policy-tips h3 { margin-top:0; }
@media(max-width:980px) { .password-mfa-shell { grid-template-columns:1fr; } }
@media(min-width:981px) {
    .password-change-body.password-mfa-body { display:flex; flex-direction:column; }
    .password-mfa-body > .password-change-header { flex-shrink:0; }
    .password-mfa-body > .password-mfa-shell { margin:auto; }
}