/* Shared employer/candidate header. Loaded after the existing portal styles. */
body.sh-portal .shp-topbar .shp-brand-logo {
    display: block;
    width: 150px;
    max-width: 100%;
    height: auto;
    max-height: none;
    object-fit: contain;
    object-position: left center;
}

.shp-topbar--quick-navigation .shp-header-start {
    display: flex;
    align-items: center;
    gap: 20px;
    min-width: 0;
}

.shp-topbar--quick-navigation .shp-brand-group {
    min-width: 0;
    flex: 0 1 auto;
}

.shp-brand-identity {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 4px;
    min-width: 0;
}

.shp-topbar .shp-brand-identity .shp-brand {
    min-height: 0;
    min-width: 0;
}

.shp-dashboard-identifier {
    display: block;
    margin: 0;
    color: #637069;
    font: 500 10px/1.3 Roboto, Arial, sans-serif;
    letter-spacing: .02em;
    white-space: nowrap;
}

.shp-quick-navigation {
    position: relative;
    flex: none;
    font-family: Roboto, Arial, sans-serif;
}

.shp-quick-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 40px;
    padding: 9px 12px;
    border: 1px solid #E1E7E3;
    border-radius: 10px;
    background: #EEF3F0;
    color: #003A20;
    white-space: nowrap;
    cursor: pointer;
    touch-action: manipulation;
    transition: background-color .14s ease, border-color .14s ease;
}

.shp-quick-navigation > .shp-quick-trigger {
    font: 600 12px/1.5 Roboto, Arial, sans-serif;
}

.shp-quick-trigger:hover,
.shp-quick-navigation.is-open > .shp-quick-trigger {
    border-color: #006837;
    background: #E3EEE7;
}

.shp-quick-icon {
    display: block;
    width: 20px;
    height: 20px;
    max-width: none;
    flex: 0 0 auto;
    object-fit: contain;
}

.shp-quick-icon[hidden],
.shp-quick-panel[hidden],
.shp-company-switcher-check[hidden],
.shp-company-switcher-spinner[hidden] {
    display: none !important;
}

/* SVG replacements keep the existing shell controls on one baseline. */
.shp-topbar .shp-popover > a,
.shp-topbar .shp-bell-messages-all {
    display: flex;
    align-items: center;
    gap: 8px;
}

.shp-topbar--quick-navigation .shp-popover {
    max-height: calc(100dvh - var(--shp-bar) - 24px);
}

.shp-topbar--quick-navigation .shp-notifications .shp-popover {
    max-height: min(580px, calc(100dvh - var(--shp-bar) - 24px));
}

.shp-account > summary > .shp-quick-icon,
.shp-company-switcher .shp-quick-icon.shp-company-switcher-chevron {
    width: 10px;
    height: 10px;
}

.shp-company-switcher-check > .shp-quick-icon,
.shp-sidebar-bottom .shp-quick-icon,
.shp-posting-back .shp-quick-icon {
    width: 16px;
    height: 16px;
}

body.sh-portal .shp-nav > a[aria-current="page"] .shp-nav-icon {
    background: #DCEAE1;
}

body.sh-portal .shp-sidebar :is(a, button):focus-visible {
    outline: 3px solid #006837;
    outline-offset: 3px;
}

body.sh-portal .shp-company-switcher-spinner {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    padding: 2px;
    flex: none;
}

.shp-company-switcher-spinner::before {
    content: "";
    display: block;
    width: 14px;
    height: 14px;
    flex: none;
    border: 2px solid #D1E4D8;
    border-top-color: #006837;
    border-radius: 50%;
    animation: shp-header-spinner .65s linear infinite;
}

@keyframes shp-header-spinner {
    to { transform: rotate(360deg); }
}

.shp-quick-trigger .shp-quick-chevron {
    width: 10px;
    height: 10px;
    margin-inline-start: 2px;
    transition: transform .14s ease;
}

.shp-quick-navigation.is-open > .shp-quick-trigger .shp-quick-chevron {
    transform: rotate(180deg);
}

body.sh-portal .shp-topbar--quick-navigation :is(a, button, summary):focus-visible {
    outline: 3px solid #006837;
    outline-offset: 3px;
}

.shp-quick-panel {
    --shp-quick-panel-width: 340px;
    position: fixed;
    z-index: 92;
    display: flex;
    flex-direction: column;
    width: var(--shp-quick-panel-width);
    max-width: calc(100vw - 24px);
    max-height: calc(100dvh - var(--shp-bar) - 24px);
    overflow: hidden;
    border: 1px solid #2E4537;
    border-radius: 14px;
    background: #14271D;
    color: #FFFFFF;
    box-shadow: 0 16px 40px rgba(0, 58, 32, .22), 0 3px 10px rgba(0, 0, 0, .08);
    opacity: 0;
    transform: translateY(-6px);
    transform-origin: top left;
    pointer-events: none;
    transition: opacity .14s ease, transform .14s ease;
}

.shp-quick-navigation.is-open > .shp-quick-panel {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

.shp-quick-panel-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex: none;
    padding: 15px 16px 13px;
    border-bottom: 1px solid rgba(225, 231, 227, .14);
    color: #FFFFFF;
    font: 700 12px/1.4 Roboto, Arial, sans-serif;
}

.shp-quick-panel-heading small {
    color: #AFC2B6;
    font-size: 10px;
    font-weight: 400;
    line-height: 1.4;
    text-align: right;
}

.shp-quick-content {
    min-height: 0;
    flex: 1 1 auto;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 10px;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: #577363 #14271D;
    scroll-padding-block: 10px;
}

.shp-quick-section + .shp-quick-section {
    margin-top: 8px;
    padding-top: 10px;
    border-top: 1px solid rgba(225, 231, 227, .12);
}

.shp-quick-section-title {
    margin: 0 0 6px;
    padding: 0 10px;
    color: #AFC2B6;
    font: 700 9px/1.5 Roboto, Arial, sans-serif;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.shp-quick-link {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    min-height: 40px;
    margin: 2px 0;
    padding: 10px;
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent;
    color: #FFFFFF;
    font: 500 12px/1.45 Roboto, Arial, sans-serif;
    text-decoration: none;
    touch-action: manipulation;
    transition: background-color .14s ease, color .14s ease, border-color .14s ease;
}

.shp-quick-label {
    min-width: 0;
    flex: 1 1 auto;
    overflow-wrap: anywhere;
}

.shp-quick-panel .shp-quick-icon--utility,
.shp-quick-panel .shp-quick-external {
    filter: brightness(0) invert(1);
    opacity: .72;
}

.shp-quick-link .shp-quick-external {
    width: 13px;
    height: 13px;
    margin-inline-start: auto;
    opacity: .58;
}

.shp-quick-link:hover {
    border-color: rgba(225, 231, 227, .09);
    background: #243D2F;
    color: #FFFFFF;
}

.shp-quick-link[aria-current="page"] {
    border-color: #EEF3F0;
    background: #EEF3F0;
    color: #006837;
}

.shp-quick-link[aria-current="page"] :is(.shp-quick-icon--utility, .shp-quick-external) {
    filter: none;
    opacity: 1;
}

body.sh-portal .shp-topbar--quick-navigation .shp-quick-link:focus-visible {
    outline: 2px solid #006837;
    outline-offset: 1px;
    box-shadow: 0 0 0 3px #EEF3F0;
}

@media (max-width: 1280px) {
    .shp-topbar--quick-navigation .shp-header-start {
        gap: 14px;
    }

    body.sh-portal .shp-topbar--quick-navigation .shp-top-actions {
        gap: 10px;
    }

    .shp-topbar--quick-navigation .shp-tool-search > summary {
        min-width: 0;
        width: 40px;
        height: 40px;
        justify-content: center;
        padding: 0;
        border-color: transparent;
        background: transparent;
    }

    .shp-topbar--quick-navigation .shp-tool-search summary span,
    .shp-topbar--quick-navigation .shp-tool-search kbd {
        display: none;
    }
}

@media (max-width: 1100px) {
    .shp-quick-trigger {
        width: 42px;
        min-height: 42px;
        padding: 10px;
    }

    .shp-quick-trigger-label,
    .shp-quick-trigger .shp-quick-chevron {
        display: none;
    }

    .shp-topbar--quick-navigation .shp-account-name,
    .shp-topbar--quick-navigation .shp-account > summary > .shp-quick-chevron,
    .shp-topbar--quick-navigation .shp-account > summary > .shp-quick-icon,
    .shp-topbar--quick-navigation .shp-account > summary > i {
        display: none;
    }

    .shp-quick-panel {
        --shp-quick-panel-width: 320px;
    }
}

@media (max-width: 800px) {
    .shp-topbar--quick-navigation .shp-header-start {
        gap: 10px;
    }

    body.sh-portal .shp-topbar--quick-navigation .shp-top-actions {
        gap: 5px;
    }

    .shp-topbar--quick-navigation .shp-icon-button,
    .shp-topbar--quick-navigation .shp-account > summary {
        min-width: 40px;
        min-height: 40px;
    }

    .shp-topbar--quick-navigation .shp-account > summary {
        justify-content: center;
    }
}

@media (max-width: 520px) {
    body.sh-portal:not(.sh-portal--focused-posting) {
        --shp-bar: 108px;
    }

    .shp-topbar.shp-topbar--quick-navigation {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: 48px 40px;
        align-content: center;
        justify-content: stretch;
        gap: 4px;
        padding: 8px 12px;
    }

    .shp-topbar--quick-navigation .shp-header-start {
        width: 100%;
        gap: 8px;
        justify-content: space-between;
    }

    .shp-topbar--quick-navigation .shp-brand-group {
        min-width: 0;
        gap: 8px;
    }

    .shp-topbar--quick-navigation .shp-brand-identity {
        gap: 3px;
    }

    .shp-dashboard-identifier {
        font-size: 9px;
    }

    .shp-quick-trigger {
        width: 44px;
        min-height: 44px;
        padding: 11px;
    }

    body.sh-portal .shp-topbar--quick-navigation .shp-top-actions {
        grid-column: 1;
        width: 100%;
        min-width: 0;
        justify-content: flex-end;
        gap: 8px;
    }

    .shp-topbar--quick-navigation .shp-icon-button,
    .shp-topbar--quick-navigation .shp-tool-search > summary {
        width: 40px;
        height: 40px;
        min-width: 40px;
        min-height: 40px;
    }

    .shp-topbar--quick-navigation .shp-help > summary {
        display: grid;
    }

    body.sh-portal .shp-topbar--quick-navigation .shp-company-switcher {
        width: 40px;
        flex: 0 0 40px;
    }

    body.sh-portal .shp-topbar--quick-navigation .shp-company-switcher summary {
        width: 40px;
        min-height: 40px;
        padding: 4px;
    }

    .shp-topbar--quick-navigation .shp-account > summary {
        width: 40px;
        height: 40px;
        padding: 0;
    }

    .shp-quick-link {
        min-height: 44px;
        padding-block: 11px;
        font-size: 13px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .shp-quick-trigger,
    .shp-quick-chevron,
    .shp-quick-panel,
    .shp-quick-link {
        transition: none;
    }

    .shp-company-switcher-spinner::before {
        animation: none;
    }
}

@media print {
    .shp-topbar.shp-topbar--quick-navigation {
        display: none;
    }
}
