/* Reset-password only. Shared typography/outlined field tokens come from account-management.css. */
.account-reset-layout {
    width: 100%;
    display: grid;
    grid-template-columns: minmax(280px, 380px) minmax(0, 1fr);
    gap: 24px;
    align-items: start;
    box-sizing: border-box;
}

    .account-reset-layout > * {
        min-width: 0;
    }

.account-reset-guide, .account-reset-card {
    border: 1px solid #dae6f2;
    border-radius: 22px;
    box-shadow: 0 14px 40px #224c7d09, inset 0 1px 0 #fff;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
}

.account-reset-guide {
    padding: clamp(24px, 2.5vw, 36px);
    background: linear-gradient(145deg, #edf4fff0, #ffffffe0 58%, #e8f9f1e6);
}

.account-reset-admin {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #22644f;
    background: #e1f4ec;
    border: 1px solid #cbe8dc;
    border-radius: 24px;
    padding: 6px 10px;
    font-size: .62rem;
    font-weight: 700;
    letter-spacing: .09em;
}

    .account-reset-admin .mud-icon-root {
        font-size: 16px;
    }

.account-reset-emblem {
    display: grid;
    place-items: center;
    width: 76px;
    height: 76px;
    margin: 30px 0 22px;
    border-radius: 24px;
    background: linear-gradient(130deg, #dbe9ff, #ddf7ee);
    border: 2px solid #fff;
    color: #2463dc;
    box-shadow: 0 8px 24px #245ef412;
}

    .account-reset-emblem .mud-icon-root {
        font-size: 36px;
    }

.account-reset-guide h2 {
    font-size: clamp(1.4rem, 1.15rem + .5vw, 1.75rem);
    letter-spacing: -.035em;
}

.account-reset-guide > p {
    margin-top: 14px;
    color: #5d7087;
    font-size: .88rem;
}

.account-reset-steps {
    list-style: none;
    padding: 0;
    margin: 30px 0 0;
}

    .account-reset-steps li {
        display: flex;
        gap: 13px;
        padding: 17px 0;
        border-top: 1px solid #dfe8f1;
    }

        .account-reset-steps li > span {
            display: grid;
            place-items: center;
            flex: 0 0 28px;
            height: 28px;
            border-radius: 9px;
            background: #edf3ff;
            color: #3363b8;
            font-size: .7rem;
            font-weight: 700;
        }

    .account-reset-steps strong {
        font-size: .86rem;
        font-weight: 650;
    }

    .account-reset-steps p {
        margin-top: 3px;
        color: #5d7087;
        font-size: .79rem;
    }

.account-reset-card {
    padding: clamp(24px, 3vw, 40px);
    background: #ffffffd9;
}

.account-reset-heading {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 30px;
}

    .account-reset-heading > span {
        display: grid;
        place-items: center;
        flex: 0 0 44px;
        height: 44px;
        border-radius: 13px;
        background: #e5f6ef;
        color: #008566;
    }

    .account-reset-heading p {
        color: #5d7087;
        font-size: .88rem;
        margin-top: 5px;
    }

.account-reset-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 26px 20px;
}

.account-reset-full {
    grid-column: 1 / -1;
}

.account-reset-result {
    margin-top: 32px;
    padding: 22px;
    border: 1px dashed #cadbea;
    border-radius: 14px;
    background: #f5f9ffc4;
}

.account-reset-result-title {
    display: flex;
    align-items: center;
    gap: 9px;
    color: #3f617f;
}

    .account-reset-result-title > .mud-icon-root {
        color: #497dcc;
        flex-shrink: 0;
        font-size: 21px;
    }

    .account-reset-result-title strong {
        font-size: .87rem;
        font-weight: 650;
    }

    .account-reset-result-title > span {
        margin-left: auto;
        color: #667b94;
        font-size: .58rem;
        font-weight: 700;
        letter-spacing: .08em;
    }

.account-reset-result > p {
    font-size: .8rem;
    color: #5d7087;
    margin-top: 10px;
}

.account-reset-result-ready {
    background: #eefaf4d9;
    border: 1px solid #c7e7d7;
}

    .account-reset-result-ready .account-reset-result-title, .account-reset-result-ready .account-reset-result-title > span, .account-reset-result-ready .mud-icon-root {
        color: #08775e;
    }

.account-reset-secret {
    margin-top: 22px !important;
}

    .account-reset-secret input {
        font-family: "Cascadia Code", Consolas, monospace;
        letter-spacing: .1em;
        font-size: 1.05rem;
    }

.account-reset-footer {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    margin-top: 30px;
    padding-top: 24px;
    border-top: 1px solid #e4ecf4;
}

.account-design .account-reset-submit, .account-design .account-reset-back {
    min-height: 44px;
    padding: 10px 20px;
    border-radius: 10px;
    text-transform: none;
    font-size: .86rem;
    font-weight: 650;
}

.account-design .account-reset-submit {
    background: linear-gradient(120deg, #00896c, #00765b);
    color: #fff;
    box-shadow: 0 4px 12px #00856624;
}

    .account-design .account-reset-submit:hover {
        background: #006c54;
    }

    .account-design .account-reset-submit:disabled {
        background: #e1eae6;
        color: #60796c;
        box-shadow: none;
    }

.account-design .account-reset-back {
    border-color: #cbdbe9;
    color: #3f5e7b;
    background: #ffffffa6;
}

    .account-design .account-reset-back:hover {
        background: #edf4ff;
        border-color: #9fbce0;
    }

.account-reset-alert {
    margin-bottom: 24px;
    border-radius: 12px;
}

@supports not (backdrop-filter: blur(1px)) {
    .account-reset-guide, .account-reset-card {
        background: #fff;
    }
}

@media (max-width: 960px) {
    .account-reset-layout {
        grid-template-columns: minmax(0, 1fr);
        gap: 18px;
    }

    .account-reset-guide {
        padding: 24px;
    }

    .account-reset-emblem {
        float: right;
        margin: 0 0 12px 20px;
        width: 60px;
        height: 60px;
        border-radius: 18px;
    }

    .account-reset-guide h2 {
        margin-top: 16px;
    }

        .account-reset-guide h2 br {
            display: none;
        }

    .account-reset-steps {
        display: flex;
        gap: 20px;
        margin-top: 20px;
        clear: both;
    }

        .account-reset-steps li {
            flex: 1;
            min-width: 0;
        }
}

@media (max-width: 600px) {
    .account-reset-guide, .account-reset-card {
        border-radius: 15px;
        padding: 22px 16px;
    }

    .account-reset-fields {
        grid-template-columns: minmax(0, 1fr);
    }

    .account-reset-steps {
        display: block;
    }

        .account-reset-steps li {
            padding: 12px 0;
        }

    .account-reset-footer {
        flex-direction: column-reverse;
    }

        .account-reset-footer .mud-button-root {
            width: 100%;
        }

    .account-reset-result {
        padding: 18px 14px;
    }

    .account-reset-result-title {
        flex-wrap: wrap;
    }

        .account-reset-result-title > span {
            width: 100%;
            margin-left: 30px;
        }
}