/* ============================================================================
   account.css — page-scoped styles for the sign-in / register / reset / profile
   pages. Loaded per-page via {{append . "moreStyles" "app/account.css"}}.
   Builds on app-ui.css tokens; does NOT touch global chrome.
   ========================================================================== */

.account-wrap {
    min-height: 72vh;
    padding-top: 2.5rem;
    padding-bottom: 3rem;
}

/* Raised card: white in light (pops on the tinted canvas), lifted charcoal in dark. */
.account-card {
    background: var(--bs-body-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: var(--app-radius);
    box-shadow: var(--app-shadow);
}
[data-bs-theme="dark"] .account-card {
    background: var(--bs-tertiary-bg);
}

/* Overlay the "Forgot?" link onto the password field (source .input-group-over). */
.input-group-over { position: relative; }
.input-group-over .reset-link {
    position: absolute;
    top: .9rem;
    right: .95rem;
    z-index: 5;
    font-size: .78rem;
    font-weight: 600;
    text-decoration: none;
    color: var(--app-accent);
}
.input-group-over .reset-link:hover { text-decoration: underline; }

/* Quiet inline links under the forms. */
.link-normal { font-size: .85rem; text-decoration: none; color: var(--app-accent); }
.link-normal:hover { text-decoration: underline; }

/* Profile tab bar (pill buttons). */
.profile-nav { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: 1.25rem; }
.profile-nav .nav-pill {
    border: 1px solid var(--bs-border-color);
    background: var(--bs-tertiary-bg);
    color: var(--bs-secondary-color);
    font-size: .82rem;
    font-weight: 600;
    padding: .45rem .9rem;
    border-radius: 999px;
    cursor: pointer;
    transition: background-color .15s ease, color .15s ease;
}
.profile-nav .nav-pill:hover { color: var(--app-accent); }
.profile-nav .nav-pill.is-active {
    background: var(--bs-primary);
    color: #fff;
    border-color: transparent;
    box-shadow: 0 .35rem .9rem rgba(87, 79, 236, .30);
}

/* Tab panes — JS toggles .is-active (profile.js). */
.profile-section { display: none; }
.profile-section.is-active { display: block; }

/* Danger zone. */
.danger-zone {
    border: 1px solid var(--bs-danger);
    border-radius: var(--app-radius);
    padding: 1.1rem 1.25rem;
}