/* The existing login callbacks still show/hide #loggedInAs. */
#topStatusBar.account-menu {
    display: block;
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    padding: 0;
    margin: 0 0 8px;
    border: 1px solid #92938d;
    border-radius: 6px;
    background: #fff;
    color: #333;
    cursor: default;
    overflow: hidden;
}

#topStatusBar.account-menu[hidden],
#accountMenuPanel[hidden],
#mapStatusMetadata[hidden] {
    display: none !important;
}

#topStatusBar #loggedInAs {
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    text-align: left;
}

#topStatusBar #accountMenuToggle {
    display: flex;
    align-items: center;
    gap: 8px;
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    min-height: 36px;
    margin: 0;
    padding: 6px 9px;
    border: 0;
    border-radius: 0;
    background: #efefec;
    color: #343630;
    font: 14px/1.4 Arial, sans-serif;
    text-align: left;
    cursor: pointer;
}

#topStatusBar #accountMenuToggle:hover,
#topStatusBar #accountMenuToggle[aria-expanded="true"] {
    background: #e0e6d9;
}

#topStatusBar .account-menu-icon {
    flex: 0 0 18px;
    width: 18px;
    height: 22px;
}

#accountEmailPreview {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

#topStatusBar .account-menu-chevron {
    flex: 0 0 6px;
    width: 6px;
    height: 6px;
    margin: -3px 2px 0 0;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
}

#topStatusBar [aria-expanded="true"] .account-menu-chevron {
    margin-top: 3px;
    transform: rotate(225deg);
}

#accountMenuPanel {
    padding: 10px;
    border-top: 1px solid #d5d9cf;
    font: 13px/1.4 Arial, sans-serif;
}

#topStatusBar .account-menu-label {
    margin-bottom: 2px;
    color: #6b6d65;
    font-size: 12px;
}

#topStatusBar #loggedInEmail,
#topStatusBar #invoiceLinks {
    width: auto;
    overflow: visible;
    overflow-wrap: anywhere;
    font-size: 13px;
}

#topStatusBar #loggedInEmail {
    margin-bottom: 10px;
    font-weight: bold;
}

#topStatusBar #clickForInvoices,
#topStatusBar #submitLogout {
    display: block;
    box-sizing: border-box;
    width: 100%;
    min-height: 34px;
    margin: 0;
    padding: 6px 9px;
    border: 1px solid #c4c9bd;
    border-radius: 4px;
    background-color: #f7f8f4;
    color: #3e592f;
    font: 13px/1.4 Arial, sans-serif;
    text-align: left;
    cursor: pointer;
}

#topStatusBar #submitLogout {
    margin-top: 8px;
    padding-left: 34px;
    background-position: 8px center;
    color: #444;
}

#topStatusBar #clickForInvoices:hover,
#topStatusBar #submitLogout:hover {
    border-color: #779b56;
    background-color: #edf3e5;
}

#topStatusBar #invoiceLinks p {
    margin: 8px 0;
}

#topStatusBar #invoiceLinks a {
    display: block;
    padding: 3px 0;
    color: #365ca4;
    text-decoration: underline;
}

#topStatusBar button:focus-visible,
#topStatusBar a:focus-visible {
    outline: 2px solid #5268a4;
    outline-offset: -3px;
}

@media print {
    #topStatusBar.account-menu { display: none; }
}