.header-section-top {
    width: 100%;
    /*min-height: 66px;*/
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    /*padding: 10px 18px;*/
    background: #ffffff;
    position: relative;
    z-index: 1000;
}

/* ========================================================= LEFT NAVIGATION ========================================================= */
.btns-header-top-left {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-right: auto;
}

/* ========================================================= NAV BUTTON ========================================================= */
.top-nav-btn {
    position: relative;
    min-height: 39px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 7px;
    border-radius: 10px;
    text-decoration: none !important;
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
    /*border: 1px solid transparent;*/
    transition: all .25s ease;
}

/* Icon */
.top-nav-icon {
    width: 27px;
    height: 27px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 7px;
    font-size: 11px;
    transition: transform .25s ease, background .25s ease;
}

.top-nav-btn:hover .top-nav-icon {
    transform: scale(1.08) rotate(-3deg);
}

/* ========================================================= MASTERS ========================================================= */
.masters-btn {
    color: #1456A0;
    background: #EEF4FF;
    border-color: #DCE8FA;
}

.masters-btn .top-nav-icon {
    background: #DCEAFF;
    color: #1456A0;
}

.masters-btn:hover {
    color: #fff;
    background: #1456A0;
    border-color: #1456A0;
    box-shadow: 0 7px 18px rgba(20, 86, 160, .18);
}

.masters-btn:hover .top-nav-icon {
    background: rgba(255, 255, 255, .18);
    color: #fff;
}

/* ========================================================= GENERAL SETTINGS ========================================================= */
.settings-btn {
    color: #A76A00;
    background: #FFF7E8;
    border-color: #F5E5BF;
}

.settings-btn .top-nav-icon {
    background: #FFECC5;
    color: #A76A00;
}

.settings-btn:hover {
    color: #fff;
    background: #D98B00;
    border-color: #D98B00;
    box-shadow: 0 7px 18px rgba(217, 139, 0, .18);
}

.settings-btn:hover .top-nav-icon {
    background: rgba(255, 255, 255, .18);
    color: #fff;
}

/* ========================================================= FIND COURSES ========================================================= */
.courses-btn {
    color: #087A67;
    background: #EAF9F5;
    border-color: #D1F0E8;
}

.courses-btn .top-nav-icon {
    background: #D4F1E9;
    color: #087A67;
}

.courses-btn:hover {
    color: #fff;
    background: #087A67;
    border-color: #087A67;
    box-shadow: 0 7px 18px rgba(8, 122, 103, .18);
}

.courses-btn:hover .top-nav-icon {
    background: rgba(255, 255, 255, .18);
    color: #fff;
}

/* ========================================================= UNIVERSITY ========================================================= */
.university-btn {
    color: #6742A5;
    background: #F3EDFF;
    border-color: #E4D9FA;
}

.university-btn .top-nav-icon {
    background: #E7DCFF;
    color: #6742A5;
}

.university-btn:hover {
    color: #fff;
    background: #6742A5;
    border-color: #6742A5;
    box-shadow: 0 7px 18px rgba(103, 66, 165, .18);
}

.university-btn:hover .top-nav-icon {
    background: rgba(255, 255, 255, .18);
    color: #fff;
}

/* ========================================================= Report ========================================================= */
.report-top-btn {
       color: #dc35c7;
    background: #dc35c71a;
    border-color: #E4D9FA;
}

.report-top-btn .top-nav-icon {
    background: #f5caee;
    color: #dc35c7;
}

.report-top-btn:hover {
    color: #fff;
    background: #e024c8;
    border-color: #e024c8;
    box-shadow: 0 7px 18px rgba(103, 66, 165, .18);
}

.report-top-btn:hover .top-nav-icon {
    background: rgba(255, 255, 255, .18);
    color: #fff;
}

/* ========================================================= RIGHT ACTIONS ========================================================= */
.header-icon-btns-cs {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
}

/* ========================================================= ALL ICON BUTTONS ========================================================= */
.header-action-btn,
.headertogle {
    position: relative;
    width: 40px;
    height: 40px;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    text-decoration: none !important;
    border: 1px solid #E5EAF0;
    transition: transform .25s ease, color .25s ease, background .25s ease, border-color .25s ease, box-shadow .25s ease;
}

.header-action-btn i,
.headertogle i {
    font-size: 16px;
    line-height: 1;
    transition: transform .25s ease;
}

.header-action-btn:hover,
.headertogle:hover {
    transform: translateY(-2px);
}

.header-action-btn:hover i,
.headertogle:hover i {
    transform: scale(1.08);
}

/* ========================================================= NOTIFICATION ========================================================= */
.notification-btn {
    color: #D94350;
    background: #FFF2F3;
    border-color: #F7DADD;
}

.notification-btn:hover {
    color: #fff;
    background: #D94350;
    border-color: #D94350;
    box-shadow: 0 8px 20px rgba(217, 67, 80, .20);
}

/* Notification badge */
#notificationCount {
    top: -5px !important;
    right: -5px !important;
    left: auto !important;
    transform: none !important;
    min-width: 17px;
    height: 17px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
    border: 2px solid #fff;
    font-size: 8px;
    font-weight: 700;
}

/* ========================================================= CHAT ========================================================= */
.chat-btn {
    color: #087BA8;
    background: #EEF9FF;
    border-color: #D6EFF9;
}

.chat-btn:hover {
    color: #fff;
    background: #087BA8;
    border-color: #087BA8;
    box-shadow: 0 8px 20px rgba(8, 123, 168, .20);
}

#chatCount {
    top: -5px !important;
    right: -5px !important;
    min-width: 16px;
    height: 16px;
    padding: 0;
    border: 2px solid #fff;
}

/* ========================================================= PROFILE ========================================================= */
.profile-btn {
    color: #6947AA;
    background: #F1EEFF;
    border-color: #E2DBFF;
}

.profile-btn:hover {
    color: #fff;
    background: #6947AA;
    border-color: #6947AA;
    box-shadow: 0 8px 20px rgba(105, 71, 170, .20);
}

/* ========================================================= SIDEBAR TOGGLE ========================================================= */
.sidebar-toggle {
    margin-left: 5px;
    color: #012A6B;
    background: #EEF4FF;
    border-color: #DCE8FB;
    cursor: pointer;
}

.sidebar-toggle:hover {
    color: #fff;
    background: #012A6B;
    border-color: #012A6B;
    box-shadow: 0 8px 20px rgba(1, 42, 107, .20);
}

/* ========================================================= SEPARATOR BEFORE SIDEBAR ========================================================= */
.sidebar-toggle::before {
    content: "";
    position: absolute;
    left: -9px;
    width: 1px;
    height: 24px;
    background: #E2E7ED;
}

/* ========================================================= LOGOUT ========================================================= */
.logout-btn {
    color: #D63F4C;
    background: #FFF1F1;
    border-color: #F7D8DB;
}

.logout-btn:hover {
    color: #fff;
    background: #D63F4C;
    border-color: #D63F4C;
    box-shadow: 0 8px 20px rgba(214, 63, 76, .20);
}

/* Logout form */
.logout-btn form {
    width: 100%;
    height: 100%;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Logout button */
.logout-btn form button {
    width: 100% !important;
    height: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none !important;
    outline: none !important;
    background: transparent !important;
    color: inherit !important;
    cursor: pointer;
}

/* ========================================================= NOTIFICATION DROPDOWN ========================================================= */
.notification-dropdown {
    width: 360px;
    max-height: 430px;
    margin-top: 10px !important;
    padding: 0 !important;
    overflow-y: auto;
    border: 1px solid #E5EAF0;
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 20px 50px rgba(16, 42, 80, .15);
}

/* Header */
.notification-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    background: #F8FAFD;
    border-bottom: 1px solid #EDF0F4;
}

.notification-title {
    display: flex;
    align-items: center;
    gap: 9px;
}

.notification-title strong {
    color: #102A50;
    font-size: 13px;
    font-weight: 700;
}

.notification-title-icon {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background: #FFF0F1;
    color: #D94350;
}

.notification-status {
    padding: 4px 8px;
    border-radius: 50px;
    background: #EAF9F5;
    color: #087A67;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .5px;
}

/* Empty notification */
.empty-notification-icon {
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 10px;
    border-radius: 50%;
    background: #F4F7FA;
    color: #9AA7B8;
    font-size: 17px;
}

#notificationList .text-muted {
    color: #8997A8 !important;
    font-size: 12px;
}

/* ========================================================= BADGE PULSE ========================================================= */
#notificationCount:not([style*="display:none"]) {
    animation: notificationPulse 1.8s infinite;
}

@keyframes notificationPulse {
    0% {
        box-shadow: 0 0 0 0 rgba(220, 53, 69, .35);
    }

    70% {
        box-shadow: 0 0 0 7px rgba(220, 53, 69, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(220, 53, 69, 0);
    }
}









.sidebar-latest-ui {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: 290px;
    z-index: 996;
   background: #092949;
    border-right: 1px solid #e8edf3;
    box-shadow: 4px 0 25px rgba(15, 23, 42, 0.04);
    transition: all 0.3s ease;
    z-index: 999;
}

.sidebar-latest-ui-inner {
    height: 100%;
}

.sidebar-cont {
    height: 100%;
    display: flex;
    flex-direction: column;
}


/* =========================================================
   LOGO
========================================================= */

.app-logo {
    /*height: 76px;*/
    padding: 12px 20px;
    display: flex;
    align-items: center;
    justify-content: center;

    background: #092949;
    border-bottom: 1px solid #edf0f466;
}

/*.app-logo .logo {*/
/*    width: 100%;*/
/*    height: 100%;*/
/*    justify-content: flex-start;*/
/*}*/

.app-logo img {
    max-width: 165px;
    max-height: 48px;
    width: auto;
    height: auto;
    object-fit: contain;
}


/* =========================================================
   NAVIGATION
========================================================= */

.sidebar-nav-ui {
    list-style: none;
    padding: 14px 11px 30px;
    margin: 0;

    overflow-y: auto;
    overflow-x: hidden;
}

.sidebar-nav-ui::-webkit-scrollbar {
    width: 5px;
}

.sidebar-nav-ui::-webkit-scrollbar-track {
    background: transparent;
}

.sidebar-nav-ui::-webkit-scrollbar-thumb {
    background: #dce2ea;
    border-radius: 20px;
}

.sidebar-nav-ui::-webkit-scrollbar-thumb:hover {
    background: #c4ccd7;
}


/* =========================================================
   MAIN MENU ITEM
========================================================= */

.sidebar-nav-ui > .nav-item {
    margin-bottom: 5px;
}

.sidebar-nav-ui > .nav-item > .nav-link {
    position: relative;

    min-height: 48px;

    display: flex;
    align-items: center;

    gap: 11px;

    padding: 7px 11px;

    border-radius: 11px;

    color: #fff;
    background: transparent;

    font-size: 13.5px;
    font-weight: 400;

    text-decoration: none;

    transition:
        background 0.2s ease,
        color 0.2s ease,
        transform 0.2s ease,
        box-shadow 0.2s ease;
}


/* =========================================================
   MAIN MENU HOVER
========================================================= */

.sidebar-nav-ui > .nav-item > .nav-link:hover {
    color: #012a6b;
    background: #f6f8fb;
    transform: translateX(2px);
}


/* =========================================================
   ICON BOX
========================================================= */

.sidebar-menu-icon {
    width: 36px;
    min-width: 36px;
    height: 36px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border-radius: 10px;

    font-size: 15px;

    transition:
        all 0.25s ease;
}


/* =========================================================
   ICON COLORS
========================================================= */

/* Dashboard */
.dashboard-icon {
    color: #3157c8;
    background: #eef2ff;
}

/* Applicants */
.applicants-icon {
    color: #087a67;
    background: #eaf9f5;
}

/* Staff */
.staff-icon {
    color: #7c3aed;
    background: #f3edff;
}

/* Programs */
.programs-icon {
    color: #b76e00;
    background: #fff6e6;
}

/* Applications */
.applications-icon {
    color: #2563eb;
    background: #edf4ff;
}

/* CRM */
.crm-icon {
    color: #b83268;
    background: #fff0f6;
}

/* Registration */
.registration-icon {
    color: #0891b2;
    background: #ecfbff;
}

/* Accounts */
.accounts-icon {
    color: #15803d;
    background: #ecfdf3;
}

/* Documents */
.documents-icon {
    color: #a16207;
    background: #fff8e7;
}

/* Reports */
.reports-icon {
    color: #b83268;
    background: #fff0f6;
}


/* =========================================================
   HOVER ICON
========================================================= */

.sidebar-nav-ui > .nav-item > .nav-link:hover .sidebar-menu-icon {
    transform: translateY(-1px) scale(1.03);
}


/* =========================================================
   ACTIVE / OPEN MAIN MENU
========================================================= */

.sidebar-nav-ui > .nav-item > .nav-link:not(.collapsed) {
    color: #012a6b;
    background: #eef4ff;
    box-shadow: inset 3px 0 0 #012a6b;
}

.sidebar-nav-ui > .nav-item > .nav-link:not(.collapsed) .sidebar-menu-icon {
    color: #ffffff;
    background: #012a6b;
    box-shadow: 0 6px 14px rgba(1, 42, 107, 0.20);
}


/* =========================================================
   ACTIVE SINGLE LINK
========================================================= */

.sidebar-nav-ui > .nav-item > .nav-link:not([data-bs-toggle]):not(.collapsed) {
    background: #eef4ff;
}


/* =========================================================
   COUNT BADGE
========================================================= */

.sidebar-nav-ui .count {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 27px;
    height: 20px;

    padding: 0 6px;
    margin-left: 4px;

    border-radius: 20px;

    background: #f1f4f8;
    color: #667085;

    font-size: 9px;
    font-weight: 700;

    vertical-align: middle;

    transition: all 0.2s ease;
}

.sidebar-nav-ui .nav-link:hover .count,
.sidebar-nav-ui .nav-link:not(.collapsed) .count {
    background: #dce9ff;
    color: #012a6b;
}


/* =========================================================
   CHEVRON
========================================================= */

.sidebar-arrow {
    width: 24px;
    height: 24px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    color: #98a2b3;

    font-size: 10px;

    transition: transform 0.25s ease, color 0.2s ease;
}

.sidebar-nav-ui .nav-link:not(.collapsed) .sidebar-arrow {
    color: #012a6b;
    transform: rotate(180deg);
}


/* =========================================================
   SUBMENU CONTAINER
========================================================= */

.sidebar-nav-ui .nav-content {
    position: relative;

    list-style: none;

    margin: 5px 0 7px 18px;
    padding: 5px 0 5px 15px;

    border-left: 1px solid #e2e7ee5c;
}

.sidebar-nav-ui .nav-content li {
    margin: 2px 0;
}


/* =========================================================
   SUBMENU LINKS
========================================================= */

.sidebar-nav-ui .nav-content li > a {
    min-height: 38px;

    display: flex;
    align-items: center;

    gap: 10px;

    padding: 6px 9px;

    border-radius: 8px;

    color: #667085;
    background: transparent;

    font-size: 12.5px;
    font-weight: 500;

    text-decoration: none;

    transition:
        background 0.2s ease,
        color 0.2s ease,
        padding 0.2s ease;
}


/* =========================================================
   SUBMENU ICON
========================================================= */

.sidebar-nav-ui .nav-content li > a > i:first-child {
    width: 25px;
    min-width: 25px;
    height: 25px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border-radius: 7px;

    background: #f5f7fa;
    color: #436db4;

    font-size: 10px;

    transition: all 0.2s ease;
}


/* =========================================================
   SUBMENU HOVER
========================================================= */

.sidebar-nav-ui .nav-content li > a:hover {
    color: #012a6b;
    background: #f6f8fc;
    padding-left: 13px;
}

.sidebar-nav-ui .nav-content li > a:hover > i:first-child {
    color: #012a6b;
    background: #eaf2ff;
}


/* =========================================================
   SUBMENU ACTIVE
========================================================= */

.sidebar-nav-ui .nav-content li > a.active {
    color: #012a6b;
    background: #eef4ff;
    font-weight: 700;
}

.sidebar-nav-ui .nav-content li > a.active > i:first-child {
    color: #ffffff;
    background: #012a6b;
    box-shadow: 0 4px 10px rgba(1, 42, 107, 0.15);
}


/* =========================================================
   SUBMENU ICON COLORS
========================================================= */

.sidebar-nav-ui .fa-user-shield {
    color: #3157c8;
}

.sidebar-nav-ui .fa-user-tie {
    color: #7c3aed;
}

.sidebar-nav-ui .fa-headset {
    color: #0891b2;
}

.sidebar-nav-ui .fa-shield-halved {
    color: #b83268;
}

.sidebar-nav-ui .fa-plus {
    color: #15803d;
}

.sidebar-nav-ui .fa-list-check {
    color: #2563eb;
}

.sidebar-nav-ui .fa-file-circle-plus {
    color: #15803d;
}

.sidebar-nav-ui .fa-folder-open {
    color: #2563eb;
}

.sidebar-nav-ui .fa-bullhorn {
    color: #c26a00;
}

.sidebar-nav-ui .fa-tags {
    color: #7c3aed;
}

.sidebar-nav-ui .fa-signal {
    color: #0891b2;
}

.sidebar-nav-ui .fa-link {
    color: #b83268;
}

.sidebar-nav-ui .fa-list {
    color: #2563eb;
}

.sidebar-nav-ui .fa-money-bill-transfer {
    color: #15803d;
}

.sidebar-nav-ui .fa-building-columns {
    color: #2563eb;
}

.sidebar-nav-ui .fa-hand-holding-dollar {
    color: #087a67;
}

.sidebar-nav-ui .fa-hourglass-half {
    color: #c26a00;
}

.sidebar-nav-ui .fa-file-shield {
    color: #7c3aed;
}

.sidebar-nav-ui .fa-chart-line {
    color: #2563eb;
}

.sidebar-nav-ui .fa-money-bill-trend-up {
    color: #15803d;
}

.sidebar-nav-ui .fa-chart-pie {
    color: #7c3aed;
}

.sidebar-nav-ui .fa-clock-rotate-left {
    color: #c26a00;
}

.sidebar-nav-ui .fa-user-clock {
    color: #0891b2;


/* =========================================================
   REPORTS SPECIAL STYLE
========================================================= */

.sidebar-nav-ui .reports-icon {
    background: #fff0f6;
    color: #b83268;
}

.sidebar-nav-ui .nav-link:not(.collapsed) .reports-icon {
    background: #b83268;
    color: #ffffff;
}


/* =========================================================
   CRM SETTINGS
========================================================= */

.sidebar-nav-ui .crm-settings-icon {
    width: 30px;
    min-width: 30px;
    height: 30px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border-radius: 8px;

    background: #f3f6fa;
    color: #667085;

    font-size: 12px;
}


/* =========================================================
   NESTED SUBMENU
========================================================= */

.sidebar-nav-ui .nav-content .nav-content {
    margin-left: 8px;
    padding-left: 13px;
}


/* =========================================================
   NESTED NAV LINK
========================================================= */

.sidebar-nav-ui .nav-content .nav-link {
    min-height: 38px;
    padding: 6px 9px;

    background: transparent;
    color: #667085;

    font-size: 12px;
}

.sidebar-nav-ui .nav-content .nav-link:hover {
    background: #f6f8fc;
    color: #012a6b;
}


/* =========================================================
   FOCUS
========================================================= */

.sidebar-nav-ui a:focus-visible {
    outline: 2px solid rgba(1, 42, 107, 0.35);
    outline-offset: 2px;
}


/* =========================================================
   SMOOTH COLLAPSE
========================================================= */

.sidebar-nav-ui .collapse {
    transition: height 0.25s ease;
}
























