/* =========================================
   PREVENT SIDEBAR FLASH
   ========================================= */

/*
   Hide the original menu content immediately
   while the Cotecna logo is being inserted.
*/

.twui-toggle-menu {
    visibility: hidden;
}


/*
   Once our JS finishes setting up the sidebar,
   show the menu again.
*/

.cot-sidebar-ready .twui-toggle-menu {
    visibility: visible;
}


/* Preload logo files through CSS as well */

body::after {
    content:
        url("https://i.imgur.com/fxaf0eD.png")
        url("https://i.imgur.com/iaM1Ynr.png");
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
    visibility: hidden;
}


/* =========================================
   SIDEBAR LOGO
   ========================================= */

.sidebar-custom-logo-container {
    width: 100% !important;

    display: flex !important;
    justify-content: center !important;
    align-items: center !important;

    padding: 12px 15px !important;

    box-sizing: border-box !important;

    overflow: hidden !important;
}


/* =========================================
   SIDEBAR LOGO LINK
   ========================================= */

.sidebar-custom-logo-link {
    width: 100% !important;
    height: 80px !important;

    display: flex !important;
    justify-content: center !important;
    align-items: center !important;

    padding: 0 !important;
    margin: 0 !important;
}


/* =========================================
   FULL SIDEBAR LOGO
   ========================================= */

.sidebar-full-logo {
    display: block !important;

    width: 200px !important;
    height: auto !important;

    max-width: 200px !important;
    max-height: 75px !important;

    object-fit: contain !important;
}


/* =========================================
   SMALL LOGO
   HIDDEN WHILE SIDEBAR IS OPEN
   ========================================= */

.sidebar-small-logo {
    display: none !important;
}


/* =========================================
   COLLAPSED SIDEBAR
   ========================================= */

.sidebar-custom-logo-container.sidebar-logo-collapsed {
    padding: 10px 5px !important;
}


/* Hide full logo */

.sidebar-custom-logo-container.sidebar-logo-collapsed
.sidebar-full-logo {
    display: none !important;
}


/* Show small logo */

.sidebar-custom-logo-container.sidebar-logo-collapsed
.sidebar-small-logo {
    display: block !important;

    width: 45px !important;
    height: 45px !important;

    min-width: 45px !important;
    min-height: 45px !important;

    max-width: 45px !important;
    max-height: 45px !important;

    object-fit: contain !important;
}


/* Smaller clickable area when collapsed */

.sidebar-custom-logo-container.sidebar-logo-collapsed
.sidebar-custom-logo-link {
    width: 55px !important;
    height: 55px !important;
}


/* =========================================
   TOP HEADER
   ========================================= */

header.tw-sticky.twui-old-navbar-replacement {
    background-color: #00ba80 !important;

    background-image:
        url("https://i.imgur.com/ux0dMtB.png") !important;

    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;

    height: 100px !important;
    min-height: 100px !important;
}


header.twui-old-navbar-replacement > div {
    height: 100% !important;
    align-items: center !important;
}


/* =========================================
   SEARCH BAR
   ========================================= */

#searchInputContainer input {
    background-color: #fff !important;
    border-color: #444 !important;
}


#ef-search,
#ef-search .form-group,
#ef-search .form-control {
    background: none !important;
    margin-left: 50px !important;
}


#ef-search input,
#ef-search .form-control {
    background-color: #fff !important;

    color: #000 !important;

    border-color: #fff !important;
}


/* =========================================
   TOP HEADER LOGO
   ========================================= */

.top-header-logo {
    display: block !important;

    width: 220px !important;
    height: auto !important;

    max-width: none !important;
    max-height: none !important;

    object-fit: contain !important;
}


header a:has(.top-header-logo) {
    width: 220px !important;
    max-width: none !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    height: 64px !important;

    padding: 0 !important;
    margin: 0 !important;
}


/* =========================================
   HEADER LANGUAGE / DROPDOWN
   ========================================= */

header.twui-old-navbar-replacement
.twui-dropdown > span:last-child {
    color: #fff !important;
}

/* DO NOT ADD/EDIT AFTER THIS LINE */
#ef-navbar,
#ef-navbar li a.dropdown-toggle[aria-expanded="true"] {
    background-color: #001885;
    border-color: #001885;
}
html.new-ui-html:root {
    --c-brand-primary: #001885;
    --c-brand-primary-darken-5: #001380;
    --c-brand-primary-darken-7: #00117e;
    --c-brand-primary-darken-10: #000e7b;
    --c-brand-primary-darken-15: #000976;
    --c-brand-primary-darken-17: #000774;
    --c-brand-primary-darken-20: #000471;
    --c-brand-primary-darken-25: #00006c;
    --c-brand-primary-lighten-7: #071f8c;
    --c-brand-primary-lighten-40: #2840ad;
}
div.ef-block,
div.dashboard-panel div.panel-body,
body.new-ui,
body.new-ui.learner-user {
    background-color: #ffffff;
    --c-site-primary: #FFFFFF;
}
*.btn.btn-primary,
*.btn.btn-primary:not(.active),
*.btn.btn-primary:hover,
*.btn.btn-primary:hover:not(.active),
*.btn.btn-primary:focus,
*.btn.btn-primary:focus:not(.active) {
    background-color: #01BA80;
    border-color: #01BA80;
}