/* KESHO mobile header account state — scoped to KESHO-owned semantic classes. */
#brx-header .ksh-header-profile-icon,
#brx-header .ksh-header-profile-icon::before,
#brx-header .ksh-profile-icon,
#brx-header .ksh-profile-icon::before {
    color: #8F9492 !important;
    fill: #8F9492 !important;
    -webkit-text-fill-color: #8F9492 !important;
}

body.kesho-logged-in #brx-header .ksh-header-profile-icon,
body.kesho-logged-in #brx-header .ksh-header-profile-icon::before,
body.kesho-logged-in #brx-header .ksh-profile-icon,
body.kesho-logged-in #brx-header .ksh-profile-icon::before,
#brx-header .ksh-header-profile-icon--active,
#brx-header .ksh-header-profile-icon--active::before {
    color: #5D9A88 !important;
    fill: #5D9A88 !important;
    -webkit-text-fill-color: #5D9A88 !important;
}

body.kesho-logged-in #brx-header .ksh-header-profile-icon,
body.kesho-logged-in #brx-header .ksh-profile-icon,
#brx-header .ksh-header-profile-icon--active {
    cursor: pointer !important;
}

#brx-header .ksh-header-mobile-menu-nav .bricks-mobile-menu {
    box-sizing: border-box;
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 100%;
    width: 100%;
}

#brx-header .ksh-header-mobile-menu-account {
    align-items: flex-start;
    background: #FFFFFF;
    color: #31554A;
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    gap: 2px;
    padding: 30px 20px 18px;
    text-align: right;
}

#brx-header .ksh-header-mobile-menu-name {
    font-size: 16px;
    font-weight: 600;
    line-height: 1.5;
}

#brx-header .ksh-header-mobile-menu-mobile {
    color: #4A4A4A;
    direction: ltr;
    font-size: 13px;
    font-variant-numeric: tabular-nums;
    font-weight: 500;
    line-height: 1.45;
    unicode-bidi: isolate;
}

#brx-header .ksh-header-mobile-menu-divider {
    background: rgba(49, 85, 74, 0.16);
    display: block;
    flex: 0 0 1px;
    height: 1px;
    margin-right: 20px;
    margin-left: 20px;
    padding: 0;
}

#brx-header .ksh-header-mobile-menu-divider--top {
    margin-bottom: 8px;
}

#brx-header .ksh-header-mobile-menu-divider--bottom {
    margin-top: auto;
}

#brx-header .ksh-header-mobile-menu-nav .bricks-mobile-menu > li:not([data-ksh-header-account-item="true"]) > a,
#brx-header .ksh-header-mobile-menu-account-link {
    align-items: center;
    display: flex;
    gap: 11px;
}

#brx-header .ksh-header-mobile-menu-account-link,
#brx-header .ksh-header-mobile-menu-login,
#brx-header .ksh-header-mobile-menu-logout {
    box-sizing: border-box;
    font-size: 15px;
    line-height: 1.5;
    min-height: 50px;
    padding: 12px 20px;
    width: 100%;
}

#brx-header .ksh-header-mobile-menu-account-link,
#brx-header .ksh-header-mobile-menu-login {
    font-weight: 500;
}

#brx-header .ksh-header-mobile-menu-icon {
    color: currentColor;
    display: inline-flex;
    flex: 0 0 20px;
    height: 20px;
    width: 20px;
}

#brx-header .ksh-header-mobile-menu-icon svg {
    fill: none;
    height: 100%;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.7;
    width: 100%;
}

#brx-header .ksh-header-mobile-menu-logout-item {
    background: #FFFFFF;
    flex: 0 0 auto;
    margin: 0;
    padding: 0;
}

#brx-header .ksh-header-mobile-menu-logout {
    align-items: center;
    appearance: none;
    background: #FFFFFF;
    border: 0;
    border-radius: 0;
    cursor: pointer;
    display: flex;
    font: inherit;
    font-size: 15px;
    font-weight: 500;
    gap: 11px;
    min-height: 50px;
    padding: 12px 20px;
    text-align: right;
    width: 100%;
}

#brx-header .ksh-header-mobile-menu-login {
    align-items: center;
    color: #F58B4B;
    display: flex;
    gap: 11px;
}

#brx-header .ksh-header-mobile-menu-logout {
    color: #E77836;
}

#brx-header .ksh-header-mobile-menu-logout:hover,
#brx-header .ksh-header-mobile-menu-logout:focus-visible {
    background: #F7F7F5;
    color: #E77836;
}

#brx-header .ksh-header-mobile-menu-login:hover,
#brx-header .ksh-header-mobile-menu-login:focus-visible {
    color: #E77836;
}

#brx-header .ksh-header-mobile-menu-login:focus-visible,
#brx-header .ksh-header-mobile-menu-logout:focus-visible {
    outline: 2px solid #31554A;
    outline-offset: -4px;
}

#brx-header .ksh-header-mobile-menu-logout[aria-busy="true"] {
    cursor: wait;
    opacity: 0.65;
}


/* KESHO_AUTH_HEADER_VISUAL_V3_START */

/*
 * Auth entry / account state in Header.
 * Presentation only.
 */

#brx-header .ksh-header-profile-icon,
#brx-header .ksh-header-profile-icon::before,
#brx-header .ksh-profile-icon,
#brx-header .ksh-profile-icon::before {

    color:
        #73858A
        !important;

    fill:
        #73858A
        !important;

    -webkit-text-fill-color:
        #73858A
        !important;
}


body.kesho-logged-in
#brx-header
.ksh-header-profile-icon,

body.kesho-logged-in
#brx-header
.ksh-header-profile-icon::before,

body.kesho-logged-in
#brx-header
.ksh-profile-icon,

body.kesho-logged-in
#brx-header
.ksh-profile-icon::before,

#brx-header
.ksh-header-profile-icon--active,

#brx-header
.ksh-header-profile-icon--active::before {

    color:
        #06748D
        !important;

    fill:
        #06748D
        !important;

    -webkit-text-fill-color:
        #06748D
        !important;
}


#brx-header
.ksh-header-mobile-menu-account,

#brx-header
.ksh-header-mobile-menu-logout-item,

#brx-header
.ksh-header-mobile-menu-logout {

    background:
        #FEF8EF;
}


#brx-header
.ksh-header-mobile-menu-account {

    color:
        #092C34;

    gap: 3px;

    padding:
        26px
        20px
        16px;
}


#brx-header
.ksh-header-mobile-menu-name {

    color:
        #092C34;

    font-size: 16px;

    font-weight: 600;

    line-height: 1.5;
}


#brx-header
.ksh-header-mobile-menu-mobile {

    color:
        #4B6268;

    font-size: 13px;

    font-weight: 500;

    line-height: 1.45;
}


#brx-header
.ksh-header-mobile-menu-divider {

    background:
        rgba(
            6,
            116,
            141,
            0.16
        );
}


#brx-header
.ksh-header-mobile-menu-account-link,

#brx-header
.ksh-header-mobile-menu-login,

#brx-header
.ksh-header-mobile-menu-logout {

    min-height: 50px;

    padding:
        12px
        20px;

    font-size: 15px;

    line-height: 1.5;
}


#brx-header
.ksh-header-mobile-menu-account-link,

#brx-header
.ksh-header-mobile-menu-login {

    color:
        #06748D;

    font-weight: 500;
}


#brx-header
.ksh-header-mobile-menu-logout {

    color:
        #C43D36;

    font-weight: 500;
}


#brx-header
.ksh-header-mobile-menu-login:hover,

#brx-header
.ksh-header-mobile-menu-login:focus-visible {

    color:
        #055F73;

    background:
        rgba(
            6,
            116,
            141,
            0.06
        );
}


#brx-header
.ksh-header-mobile-menu-logout:hover,

#brx-header
.ksh-header-mobile-menu-logout:focus-visible {

    color:
        #C43D36;

    background:
        rgba(
            196,
            61,
            54,
            0.06
        );
}


#brx-header
.ksh-header-mobile-menu-login:focus-visible,

#brx-header
.ksh-header-mobile-menu-logout:focus-visible {

    outline:
        2px solid
        #06748D;

    outline-offset: -3px;
}

/* KESHO_AUTH_HEADER_VISUAL_V3_END */
