﻿/* Document Version: 20260816061000 | Last Author: CA-I */
/* CE : CA-I 20260430063430 */

/* Base desktop nav */
#header_contents {
    position: relative;
}

#portal_header_nav.portal-nav {
    position: absolute;
    right: 10px;
    top: 20px;
    display: flex;
    align-items: center;
    font-size: 12px;
    z-index: 110;
}

.portal-nav__toggle {
    display: none;
}

#portalNavList,
.portal-nav__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    gap: 12px;
}

.portal-nav__item {
    position: relative;
    white-space: nowrap;
    border-bottom: 2px solid transparent;
}

.portal-nav__link,
.portal-nav__link--parent {
    text-decoration: none;
    color: #3A749E;
    cursor: pointer;
}

.portal-nav__link--parent {
    background: none;
    border: none;
    padding: 0;
    font: inherit;
}

.portal-nav__item--active > .portal-nav__link,
.portal-nav__item.current-page > .portal-nav__link,
.portal-nav__item.current-page > button,
.portal-nav__item.current-page > a {
    font-weight: bold;
    color: #0a9ad9 !important;
}

.portal-nav__item.current-page {
    border-bottom-color: #0a9ad9;
}

/* Desktop dropdowns */
.portal-nav__submenu {
    position: absolute;
    left: 0;
    top: 100%;
    min-width: 180px;
    margin: 0;
    padding: 8px 0;
    list-style: none;
    display: none;
    background: #fff !important;
    border: 1px solid #E8E8E8;
    border-left: 2px solid #0a9ad9;
    box-shadow: -1px 2px 2px rgba(0, 0, 0, .3);
    z-index: 1000;
}

.portal-nav__item--has-submenu:focus-within > .portal-nav__submenu,
.portal-nav__item--open > .portal-nav__submenu {
    display: block;
}

.portal-nav__submenu-group {
    position: relative;
}

.portal-nav__submenu-group:hover {
    background: #f4f4f4 !important;
}

.portal-nav__submenu-group:hover span {
    color: #333 !important;
}

.portal-nav__submenu-group-label {
    display: block;
    padding: 7px 16px;
    font-weight: bold;
    color: #0F2B49;
    cursor: default;
}

/* CE : CA-I 20260726073000 - Direct-link group (Resources) — same level as Reporting */
.portal-nav__submenu-group--direct > a.portal-nav__submenu-group-label {
    cursor: pointer;
    text-decoration: none;
    color: #0F2B49;
}

.portal-nav__submenu-group--direct > .portal-nav__submenu-group-label:after {
    content: none !important;
    display: none !important;
}

.portal-nav__submenu-items {
    list-style: none;
    margin: 0;
    padding: 4px 0;
    position: absolute;
    top: 0;
    left: 100%;
    min-width: 200px;
    display: none;
    background: #fff !important;
    border: 1px solid #E8E8E8;
    box-shadow: -1px 2px 2px rgba(0, 0, 0, .3);
}

.portal-nav__submenu-group:focus-within > .portal-nav__submenu-items,
.portal-nav__submenu-group--open > .portal-nav__submenu-items {
    display: block;
}

/* CE : CA-I 20260811052500 - Nested groups under System (System Admin / Testing) fly out above siblings */
.portal-nav__submenu-items > .portal-nav__submenu-group--nested {
    position: relative;
    z-index: 2;
}

.portal-nav__submenu-items > .portal-nav__submenu-group--nested > .portal-nav__submenu-items {
    z-index: 3;
}

.portal-nav__submenu-item > a {
    display: block;
    padding: 7px 16px;
    text-decoration: none;
    color: #3A749E;
    white-space: nowrap;
}

.portal-nav__submenu-item > a:hover {
    background: #F5F5F5;
}

/* Chevron icons */
li.portal-nav__item--has-submenu:after,
.portal-nav__submenu-group-label:after {
    content: '\e85a';
    font-family: iconfont_clsportal;
    font-size: 11px;
    font-weight: normal;
    opacity: .5;
    margin-left: 6px;
    width: 10px;
    line-height: 18px;
    text-align: center;
    display: inline-block;
    vertical-align: text-bottom;
    float: right;
}

/* CE : CA-I 20260618142100 - Desktop hover menus only above tablet-portrait responsive breakpoint. */
@media (hover: hover) and (pointer: fine) and (min-width: 901px) {
    .portal-nav__item--has-submenu:hover > .portal-nav__submenu {
        display: block;
    }

    .portal-nav__submenu-group:hover > .portal-nav__submenu-items {
        display: block;
    }

    li.portal-nav__item--has-submenu:hover:after {
        content: '\e85c';
    }
}

.portal-nav a:before,
.portal-nav button:before {
    margin-right: 4px;
}

.portal-nav li[class*="dashboard"] a:before {
    margin-right: 5px;
}

ul.portal-nav__submenu[class*="languages"] li a {
    padding-top: 5px;
    padding-bottom: 6px;
}

body[data-theme="cls-slo-br1"] #portal_header_nav li a,
body[data-theme="cls-slo-br1"] #portal_header_nav li button {
    font-family: noto-sans, sans-serif !important;
}

/* CE : CA-I 20260430085900 */
@media (min-width: 768px) {
    body[data-theme="cls-slo-br1"] #portal_header_nav li a,
    body[data-theme="cls-slo-br1"] #portal_header_nav li button {
        text-transform: none;
        font-size: 13px;
    }

    #portal_header_nav.portal-nav {
        top: 39px;
        right: 39px;
    }
}

.portal-nav__submenu-item *:before {
    margin-left: -5px !important;
    margin-right: 5px !important;
}

/* Responsive nav behavior */
/* CE : CA-I 20260618142100 - Include tablet portrait (768x1024) in tap accordion menu. */
@media (max-width: 900px) {
    /* CE : CA-I 20260430063430 */
    #portal_header_nav.portal-nav {
        right: 8px;
        top: 8px;
        z-index: 2100;
    }

    .portal-nav__toggle {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        margin-left: auto;
        border: 1px solid #d6dbe1;
        border-radius: 10px;
        background: #fff;
        color: #1e4467;
        cursor: pointer;
        z-index: 2101;
    }

    #portalNavList,
    #portal_header_nav .portal-nav__list {
        display: none !important;
        position: absolute;
        top: calc(100% + 8px);
        right: 0;
        width: min(92vw, 360px);
        max-height: 80vh;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        background: #fff;
        border: 1px solid #d6dbe1;
        border-radius: 12px;
        box-shadow: 0 10px 28px rgba(0, 0, 0, 0.16);
        padding: 8px 0;
        margin: 0;
        z-index: 2100;
        flex-direction: column;
        align-items: stretch !important;
        gap: 0 !important;
    }

    #portal_header_nav.is-open #portalNavList,
    #portal_header_nav.is-open .portal-nav__list {
        display: flex !important;
    }

    #portal_header_nav .portal-nav__item {
        width: 100%;
        margin: 0;
        border-bottom: 1px solid #e8e8e8;
        white-space: normal !important;
        height: auto !important;
        flex-shrink: 0;
        overflow: visible;
    }

    /* CE : CA-I 20260816061000 - Beat portal-menu-v1 21px height so Language accordion does not overlay FAQ/Log out */
    body[data-theme="cls-slo-br1"] #portal_header_nav > ul > li.portal-nav__item,
    #portal_header_nav.is-open #portalNavList > .portal-nav__item {
        height: auto !important;
        flex-shrink: 0;
        overflow: visible;
    }

    #portal_header_nav .portal-nav__link,
    #portal_header_nav .portal-nav__link--parent {
        display: flex;
        align-items: center;
        width: 100%;
        padding: 12px 14px !important;
        line-height: 1.35 !important;
        font-size: 15px !important;
        text-align: left;
        box-sizing: border-box;
        min-height: 44px !important;
        height: auto !important;
        white-space: normal !important;
        word-break: break-word;
    }

    /* In-flow mobile accordion */
    #portal_header_nav .portal-nav__submenu {
        position: static !important;
        display: none !important;
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 2px 0 6px 0 !important;
        border: 0 !important;
        box-shadow: none !important;
        background: #f7f9fb !important;
        overflow: visible !important;
        border-left: 0 !important;
    }

    #portal_header_nav .portal-nav__item--open > .portal-nav__submenu {
        display: block !important;
    }

    /* Keep submenu stable while pointer/focus moves within open item */
    #portal_header_nav .portal-nav__item--open:hover > .portal-nav__submenu,
    #portal_header_nav .portal-nav__item--open:focus-within > .portal-nav__submenu {
        display: block !important;
    }

    #portal_header_nav .portal-nav__submenu-group {
        display: block !important;
        position: static !important;
        width: 100%;
        border-bottom: 1px solid #e8e8e8;
    }

    #portal_header_nav .portal-nav__submenu-group-label {
        display: block;
        width: 100%;
        padding: 10px 14px !important;
        line-height: 1.45 !important;
        font-size: 14px !important;
        font-weight: 600;
        margin: 0;
        border-top: 1px solid #eef1f4;
        cursor: pointer;
        box-sizing: border-box;
        height: auto !important;
        min-height: 0 !important;
        white-space: normal !important;
        overflow: visible !important;
    }

    #portal_header_nav .portal-nav__submenu-items {
        display: none !important;
        position: static !important;
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 0 6px 0 !important;
        border: 0 !important;
        box-shadow: none !important;
        background: transparent !important;
        overflow: visible !important;
    }

    #portal_header_nav .portal-nav__submenu-group--open > .portal-nav__submenu-items {
        display: block !important;
    }

    #portal_header_nav .portal-nav__submenu-group--open:hover > .portal-nav__submenu-items,
    #portal_header_nav .portal-nav__submenu-group--open:focus-within > .portal-nav__submenu-items {
        display: block !important;
    }

    #portal_header_nav .portal-nav__submenu-item > a {
        display: block;
        padding: 10px 14px 10px 22px !important;
        line-height: 1.45 !important;
        border-top: 1px solid #eef1f4;
        white-space: normal;
        height: auto !important;
        min-height: 0 !important;
        overflow: visible !important;
    }

    #portal_header_nav .portal-nav__item span,
    #portal_header_nav .portal-nav__item a,
    #portal_header_nav .portal-nav__item button {
        text-transform: none !important;
        line-height: 1.45 !important;
        height: auto !important;
    }

    #portal_header_nav .portal-nav__submenu-group-label:after,
    #portal_header_nav li.portal-nav__item--has-submenu:after {
        float: right;
        content: '\e85a';
        font-family: iconfont_clsportal;
        opacity: .6;
        margin-left: 6px;
    }

    /* CE : CA-I 20260430083330 */
    #portal_header_nav .portal-nav__submenu-group-label:after,
    #portal_header_nav li.portal-nav__item--has-submenu:after {
        position: absolute;
        right: 16px;
        top: 13px;
        margin: 0;
        font-size: 15px;
    }

    #portal_header_nav .portal-nav__item--has-submenu .portal-nav__submenu-group,
    #portal_header_nav .portal-nav__item--has-submenu {
        position: relative !important;
    }

    #portal_header_nav .portal-nav__item--open:after,
    .portal-nav__submenu-group--open .portal-nav__submenu-group-label:after {
        content: '\e85c' !important;
        right: 19px !important;
    }

    /* CE : CA-I 20260816053000 - Keep hamburger panel in front; swap icon when open; indent nested groups */
    #header,
    #header_contents {
        overflow: visible !important;
    }

    body[data-theme*="cls-slo-br1"].admin_mode #header h1,
    body[data-theme*="cls-slo-br1"] #header h1 {
        max-width: calc(100% - 72px);
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 16px;
    }

    #portal_header_nav.is-open .portal-nav__toggle {
        background: #0F2B49;
        border-color: #0F2B49;
        color: #fff;
    }

    #portal_header_nav.is-open .portal-nav__toggle:before {
        content: '\e822';
        color: #fff;
    }

    #portal_header_nav .portal-nav__submenu-items .portal-nav__submenu-group-label {
        padding-left: 22px !important;
    }

    #portal_header_nav .portal-nav__submenu-items .portal-nav__submenu-item > a {
        padding-left: 30px !important;
    }

    #portal_header_nav .portal-nav__submenu-items .portal-nav__submenu-items .portal-nav__submenu-item > a {
        padding-left: 38px !important;
    }

    #portal_header_nav .portal-nav__submenu-group--direct > a.portal-nav__submenu-group-label:after {
        content: none !important;
        display: none !important;
    }

    #portal_header_nav .portal-nav__submenu--languages,
    #portal_header_nav .portal-nav__submenu--languages li,
    #portal_header_nav .portal-nav__submenu--languages a {
        position: static !important;
        float: none !important;
        height: auto !important;
    }
}

@media (max-width: 480px) {
    #portalNavList,
    #portal_header_nav .portal-nav__list {
        width: min(95vw, 360px);
    }
}