﻿/*Classes identified with the ID selector are for styles that never change. The .profile-navbar and .profile-navbar-inverse classes are toggled as appropriate, so should only contain styles pertinent to them*/
:root {
	--ck-profile-navbar-height:50px;

}
/*
	 colors defined here just so we know what to override on local stylesheets
*/

#profile_navbar {
    height: var(--ck-profile-navbar-height);
    z-index: 1030; /* needs to stay below sidr menu (1040) and below BS modal (1050)*/
    position: sticky;
    top: 0;
    background-color: var(--bs-light);
    border-color: var(--bs-light); /*changes in script to have dark line after scroll past nav*/
}

    #profile_navbar .nav-link {
        color: var(--bs-primary);
    }

        #profile_navbar .nav-link:hover {
            color: var(--ck-primary-comp);
        }

    #profile_navbar.profile-navbar-inverse {
        background-color: var(--bs-primary);
        border-color: var(--bs-primary);
        color: #fff;
    }

        #profile_navbar.profile-navbar-inverse .nav-link {
            color: #FFFFFF;
        }

            #profile_navbar.profile-navbar-inverse .nav-link:hover {
                color: var(--ck-primary-comp);
            }



    #profile_navbar #profile_navbar_logo {
        height: 30px;
        max-height: 30px;
        display: none;
    }
	#profile_navbar.profile-navbar-inverse #profile_navbar_logo {
		display: block;
	}


    #profile_navbar .navbar-icons .badge {
        font-weight: normal;
        font-size: 0.6em;
        vertical-align: top;
        margin-left: -3px; /*appear over top the affected icon*/
        margin-top: -3px;
    }


	

#social_onlineStatus_icons {
}
	#social_onlineStatus_icons li img {
		width: 35px;
		height: 35px;
		text-align:center;
	}

.profile-navbar-inverse #social_onlineStatus_icons {
    color: #FFF;
    background-color: rgba(var(--bs-primary-rgb),var(--bs-bg-opacity,1)) !important;
}



#profile_menu_offcanvas {
    width: 350px;
    box-shadow: inset 10px 10px 20px -19px rgba(0,0,0,1);
    border-left:1px solid #FFF;
}

    #profile_menu_offcanvas .offcanvas-header {
        align-items:start;
    }

UL.profile-menu-offcanvas-items {
    list-style: none outside none;
    display: block;
    margin: 0 0 15px;
    padding: 0;
}
    ul.profile-menu-offcanvas-items .divider {
        height: 1px;
        margin: 9px 0px;
        background-color:#CFCFCF;
        overflow: hidden;
    }
    ul.profile-menu-offcanvas-items .header {
        display: block;
        padding: 3px 20px;
        font-size: 0.875rem;
        color:#999999;
    }

    UL.profile-menu-offcanvas-items > li > a {
        color: #252525;
    }

    UL.profile-menu-offcanvas-items > li:hover {
        background-color: #FAFAFA;
    }

    UL.profile-menu-offcanvas-items > li > a:hover {
        text-decoration: none;
    }

    UL.profile-menu-offcanvas-items li a,
    UL.profile_menu_offcanvas-items li span {
        padding: 5px 15px;
        display: block;
        text-decoration: none;
    }
    UL.profile-menu-offcanvas-items li ul {
        border-bottom: 0;
        margin: 0
    }
        UL.profile-menu-offcanvas-items li ul li a,
        UL.profile-menu-offcanvas-items li ul li span {
            padding-left: 30px;
        }



#admin_nav .nav-link {
    border: 1px solid #ddd;
    border-radius: 0.375rem;
    margin-right: 0.25rem;
    margin-left: 0.25rem;
    background-color:#FFF;
}

/*admin side*/
@media (max-width: 991.98px) {
    .admin-nav-tooltip {
        display: none !important;
    }


    #admin_nav .nav-item {
        border-bottom:1px solid #E0E0E0;
        --bs-nav-link-padding-y:0.75rem;
    }
        #admin_nav .nav-item .dropdown-menu {
            border:0;
            border-left:1px solid #F0F0F0;
            border-radius:0;
            margin-left:0.75rem;
            font-size:0.9rem;
            margin-bottom:1rem;
        }

    #admin_nav .nav-link {
        border: 0;
        margin:0;
    }
        #admin_nav .nav-link.dropdown-toggle:after {
            position: absolute;
            right: 0.5rem;
            top: 1rem;
        }

    #admin_nav_offcanvas {
        width: 350px;
        box-shadow: inset 10px 10px 20px -19px rgba(0,0,0,1);
        border-left: 1px solid #FFF;
    }
}



/*Public side is always offcanvas, so do not show borders at any time and always show link text. The trigger is the navbar-expand-lg class which is only present on intranet */
#admin_nav:not(.navbar-expand-lg) .nav-item {
    border-bottom: 1px solid #E0E0E0;
    --bs-nav-link-padding-y: 0.75rem;
}

    #admin_nav:not(.navbar-expand-lg) .nav-item .dropdown-menu {
        border: 0;
        border-left: 1px solid #F0F0F0;
        border-radius: 0;
        margin-left: 0.75rem;
        font-size: 0.9rem;
        margin-bottom: 1rem;
    }

#admin_nav:not(.navbar-expand-lg) .admin_nav_offcanvas {
    width: 350px;
    box-shadow: inset 10px 10px 20px -19px rgba(0,0,0,1);
    border-left: 1px solid #FFF;
}
#admin_nav:not(.navbar-expand-lg) .nav-link {
    border:0;
    margin:0;
}
#admin_nav:not(.navbar-expand-lg) .nav-link.dropdown-toggle:after {
    position:absolute;
    right:0.5rem;
    top: 1rem;
}

#admin_nav:not(.navbar-expand-lg) .nav-link-label {
    display:inline !important;
}
#admin_nav:not(.navbar-expand-lg) .navbar-brand {
    display: none;
}
#admin_nav:not(.navbar-expand-lg) .navbar-toggler {
    display: none;
}


