.auth-header {
    flex: 0 0 auto;
    border-bottom: var(--rp-border-width-standard) solid var(--rp-color-border, var(--line));
    background: var(--rp-color-surface, var(--surface));
}

.auth-header-inner,
.auth-footer-inner {
    width: min(100%, var(--rp-content-width-standard));
    margin-inline: auto;
    padding-inline: var(--rp-page-gutter);
}

.auth-header-inner {
    display: flex;
    min-height: calc(var(--rp-control-height-touch) + var(--rp-space-16));
    align-items: center;
}

.auth-brand,
.auth-brand picture {
    display: inline-flex;
    align-items: center;
    line-height: 0;
}

.auth-brand img {
    display: block;
    width: var(--rp-auth-brand-width);
    max-height: var(--rp-space-32);
    object-fit: contain;
    object-position: left center;
}

.auth-app-shell {
    width: min(100%, calc(var(--rp-content-width-reading) + (2 * var(--rp-space-48))));
    margin-inline: auto;
    padding: var(--rp-space-48) var(--rp-page-gutter);
}

.auth-app-shell > .flash,
.auth-app-shell > .error-list {
    width: min(100%, var(--rp-content-width-reading));
    margin-inline: auto;
}

.auth-app-shell .auth-shell {
    min-height: 0;
    padding: 0;
    place-items: start center;
}

.auth-app-shell .auth-panel {
    width: min(100%, var(--rp-auth-panel-width));
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: var(--rp-elevation-none);
}

.auth-app-shell .auth-panel.wide-auth,
.auth-app-shell .organization-setup-panel {
    width: min(100%, var(--rp-content-width-reading));
    max-width: none;
}

.auth-app-shell .registration-panel {
    width: min(100%, var(--rp-auth-registration-width));
}

.auth-app-shell .auth-panel h1 {
    margin: 0 0 var(--rp-space-24);
}

.auth-app-shell .registration-heading {
    max-width: none;
}

.auth-app-shell .registration-heading h1 {
    margin-bottom: var(--rp-space-16);
}

.auth-app-shell .registration-role-grid .account-type-option,
.auth-app-shell .organization-mode-options,
.auth-app-shell .organization-mode-option {
    box-shadow: var(--rp-elevation-none);
}

.auth-app-shell .registration-role-grid .account-type-option:has(input:checked),
.auth-app-shell .organization-mode-option:has(input:checked) {
    box-shadow: var(--rp-elevation-none);
}

.auth-footer {
    flex: 0 0 auto;
    margin-top: auto;
    border-top: var(--rp-border-width-standard) solid var(--rp-color-border, var(--line));
    background: var(--rp-color-surface, var(--surface));
}

.auth-footer-inner {
    display: flex;
    min-height: calc(var(--rp-control-height-standard) + var(--rp-space-16));
    align-items: center;
    justify-content: space-between;
    gap: var(--rp-space-12) var(--rp-space-24);
    padding-block: var(--rp-space-16);
}

.auth-footer p {
    margin: 0;
    color: var(--rp-color-text-muted, var(--muted));
    font-size: var(--rp-font-size-14);
}

.auth-footer nav {
    display: flex;
    flex-wrap: wrap;
    gap: var(--rp-space-8) var(--rp-space-16);
}

.auth-footer a {
    color: var(--rp-color-link, var(--link-color));
    font-size: var(--rp-font-size-14);
    text-decoration: none;
}

.auth-footer a:hover {
    text-decoration: underline;
}

@media (max-width: 560px) {
    .auth-header-inner {
        min-height: calc(var(--rp-control-height-touch) + var(--rp-space-8));
    }

    .auth-brand img {
        width: var(--rp-auth-brand-mobile-width);
        max-height: calc(var(--rp-space-24) + var(--rp-space-4));
    }

    .auth-app-shell {
        padding-block: var(--rp-space-32) var(--rp-space-48);
    }

    .auth-footer-inner {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (forced-colors: active) {
    .auth-header,
    .auth-footer {
        border-color: CanvasText;
    }
}