/* Shared profile navigation: the view places this card after the profile header. */
.profile-tabs-card {
    display: block;
    width: fit-content;
    max-width: 100%;
    /* Equal above and below: with a margin only underneath, the gap above was whatever
       the card before it happened to end with, so the row never sat centred between the
       header card and the tab content. */
    margin: 16px 0;
    padding: 4px;
    border: 1px solid #e9edf1;
    border-radius: 999px;
    background: #fff;
    box-shadow: 0 1px 3px rgb(19 42 76 / 4%);
}

.profile-tabs-card > .profile-tabs.nav.nav-pills {
    display: flex;
    flex-wrap: nowrap;
    gap: 4px;
    max-width: 100%;
    margin: 0;
    padding: 0 !important;
    overflow-x: auto;
    border: 0;
    border-radius: inherit;
    background: transparent;
    box-shadow: none;
}

.profile-tabs-card > .profile-tabs > .nav-item {
    flex: 0 0 auto;
    margin: 0 !important;
}

.profile-tabs-card > .profile-tabs > .nav-item > .nav-link {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 8px 14px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: #6b7570;
    font-size: .82rem;
    font-weight: 600 !important;
    line-height: 1.4;
    white-space: nowrap;
    box-shadow: none;
}

.profile-tabs-card > .profile-tabs > .nav-item > .nav-link i {
    margin: 0 !important;
    color: #9aa3a0;
}

.profile-tabs-card > .profile-tabs > .nav-item > .nav-link:hover {
    background: #f7fbf9;
    color: #101615;
}

.profile-tabs-card > .profile-tabs > .nav-item > .nav-link.active,
.profile-tabs-card > .profile-tabs > .nav-item > .nav-link[aria-selected="true"] {
    background: #0a100e !important;
    color: #fff !important;
}

.profile-tabs-card > .profile-tabs > .nav-item > .nav-link.active i,
.profile-tabs-card > .profile-tabs > .nav-item > .nav-link[aria-selected="true"] i {
    color: #fff !important;
}

.profile-tabs-card > .profile-tabs > .nav-item > .nav-link:focus-visible {
    outline: 2px solid #067a45;
    outline-offset: -2px;
}