.impersonation-banner {
    align-items: center;
    background: #0c4a6e;
    border-bottom: 2px solid #38bdf8;
    color: #f8fafc;
    display: flex;
    gap: 1rem;
    justify-content: center;
    left: 0;
    min-height: 44px;
    padding: .35rem 1rem;
    position: fixed;
    right: 0;
    top: var(--environment-banner-height, 0px);
    z-index: 1099;
}

.impersonation-banner__message {
    align-items: center;
    display: inline-flex;
    flex-wrap: wrap;
    gap: .4rem;
}

.impersonation-banner strong { letter-spacing: .06em; }
.impersonation-banner form { margin: 0; }

.impersonation-banner__exit {
    background: #f8fafc;
    border: 1px solid #f8fafc;
    border-radius: .5rem;
    color: #0c4a6e;
    cursor: pointer;
    font: inherit;
    font-weight: 700;
    min-height: 36px;
    padding: .35rem .8rem;
}

.impersonation-banner__exit:hover,
.impersonation-banner__exit:focus-visible { background: #e0f2fe; }

body.ec-dark.impersonating {
    --impersonation-banner-height: 44px;
    padding-top: calc(var(--environment-banner-height, 0px) + var(--impersonation-banner-height));
}

body.ec-dark.impersonating .header,
body.ec-dark.impersonating .sidebar,
body.ec-dark.impersonating .sidebar-backdrop,
body.ec-dark.impersonating .modal,
body.ec-dark.impersonating .offcanvas {
    top: calc(var(--environment-banner-height, 0px) + var(--impersonation-banner-height));
}

body.ec-dark.impersonating .modal {
    height: calc(100% - var(--environment-banner-height, 0px) - var(--impersonation-banner-height));
}

body.ec-dark.impersonating #main {
    min-height: calc(100vh - var(--header-height) - var(--environment-banner-height, 0px) - var(--impersonation-banner-height));
}

body.ea.impersonating .wrapper { padding-top: 44px; }

@media (max-width: 640px) {
    .impersonation-banner {
        align-items: stretch;
        flex-direction: column;
        gap: .25rem;
        min-height: 72px;
        text-align: center;
    }
    body.ec-dark.impersonating { --impersonation-banner-height: 72px; }
    body.ea.impersonating .wrapper { padding-top: 72px; }
    .impersonation-banner__message { justify-content: center; }
    .impersonation-banner__exit { min-height: 36px; width: 100%; }
}
