html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

html {
    position: relative;
    min-height: 100%;
}

body {
    margin-bottom: 60px;
    background-color: #fff !important;
}

.btn-primary {
    --bs-btn-color: #fff;
    --bs-btn-bg: #ed1c24;
    --bs-btn-border-color: #ed1c24;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #023f88;
    --bs-btn-hover-border-color: #023f88;
    --bs-btn-focus-shadow-rgb: 65, 65, 90;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #023f88;
    --bs-btn-active-border-color: #023f88;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #023f88;
    --bs-btn-disabled-border-color: #023f88;
}

.btn-secondary {
    --bs-btn-color: #fff;
    --bs-btn-bg: #023f88 !important;
    --bs-btn-border-color: #023f88 !important;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #ed1c24;
    --bs-btn-hover-border-color: #ed1c24;
    --bs-btn-focus-shadow-rgb: 95, 186, 85;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #ed1c24;
    --bs-btn-active-border-color: #ed1c24;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #023f88 !important;
    --bs-btn-disabled-border-color: #023f88 !important;
}

#client-card-btn .btn:hover {
    background-color: #023f88 !important;
    border-color: #023f88 !important;
}

.btn:hover {
    background-color: #ed1c24 !important;
    border-color: #ed1c24 !important;
}

.btn:first-child:active,
:not(.btn-check)+.btn:active {
    background-color: #ed1c24 !important;
    border-color: #ed1c24 !important;
}

.btn-outline-secondary {
    --bs-btn-color: #ed1c24 !important;
    --bs-btn-border-color: #ed1c24 !important;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #ed1c24 !important;
    --bs-btn-hover-border-color: #ed1c24 !important;
    --bs-btn-focus-shadow-rgb: 67, 174, 55;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #ed1c24 !important;
    --bs-btn-active-border-color: #ed1c24 !important;
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #ed1c24 !important;
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: #ed1c24 !important;
    --bs-gradient: none;
}

.bg-secondary {
    background-color: #ed1c24 !important;
}

#entryApp {
    background-color: #ed1c24 !important;
}

/* ===== Sidebar: background & menu item colours ===== */

/* Sidebar container background */
.vertical-menu,
#sidebar-menu,
.navbar-brand-box,
.sidebar-menu-scroll {
    /*    background-color: #023f88 !important;*/
    background-color: #0b4da2 !important;
}

/* Default menu link colour → white */
#sidebar-menu ul li a,
#sidebar-menu ul li a i {
    color: #ffffff !important;
}

/* Default link hover → slightly brighter white */
#sidebar-menu ul li a:hover,
#sidebar-menu ul li a:hover i {
    color: #ffffff !important;
    background-color: rgba(255, 255, 255, 0.12) !important;
}

/* Sub-menu links */
#sidebar-menu ul li ul.sub-menu li a {
    color: rgba(255, 255, 255, 0.80) !important;
}

#sidebar-menu ul li ul.sub-menu li a:hover {
    color: #ffffff !important;
}

/* Menu section title */
#sidebar-menu .menu-title {
    color: rgba(255, 255, 255, 0.55) !important;
}

/* Active (mm-active) parent item */
.mm-active,
.mm-active>i {
    color: #ffffff !important;
}

/* Active link: faint gray/white highlight, white text */
.mm-active>a,
body[data-sidebar=dark] .mm-active>a {
    background-color: rgba(255, 255, 255, 0.15) !important;
    /* faint gray tint */
    color: #ffffff !important;
    border-radius: 4px;
}

.mm-active>a>i,
body[data-sidebar=dark] .mm-active>a>i {
    color: #ffffff !important;
}

/* Nested active link */
.mm-active .active,
body[data-sidebar=dark] .mm-active .active {
    color: #ffffff !important;
}

.mm-active .active i,
body[data-sidebar=dark] .mm-active .active i {
    color: #ffffff !important;
}

/* Header title and heading colors */
.header-title,
h1,
h2,
h3,
h4,
h5,
th {
    color: #023f88 !important;
}

/* ===== Collapsed Sidebar Styles ===== */

/* Text color when collapsed */
body.vertical-collpsed #sidebar-menu ul li>a,
body[data-sidebar-size="sm"] #sidebar-menu ul li>a {
    color: #023f88 !important;
}

/* Icon color when collapsed */
body.vertical-collpsed #sidebar-menu ul li>a i,
body[data-sidebar-size="sm"] #sidebar-menu ul li>a i {
    color: #ffffff !important;
}

/* Background for pop-up menu items when collapsed */
body.vertical-collpsed .vertical-menu #sidebar-menu ul li:hover>ul.sub-menu,
body.vertical-collpsed .vertical-menu #sidebar-menu ul li:hover>a,
body[data-sidebar-size="sm"] .vertical-menu #sidebar-menu ul li:hover>ul.sub-menu,
body[data-sidebar-size="sm"] .vertical-menu #sidebar-menu ul li:hover>a {
    background-color: #0b4da2 !important;
}

/* Text color for pop-up items */
body.vertical-collpsed .vertical-menu #sidebar-menu ul li:hover>a,
body.vertical-collpsed .vertical-menu #sidebar-menu ul li:hover>a i,
body.vertical-collpsed .vertical-menu #sidebar-menu ul li ul.sub-menu li a,
body[data-sidebar-size="sm"] .vertical-menu #sidebar-menu ul li:hover>a,
body[data-sidebar-size="sm"] .vertical-menu #sidebar-menu ul li:hover>a i,
body[data-sidebar-size="sm"] .vertical-menu #sidebar-menu ul li ul.sub-menu li a {
    color: #ffffff !important;
}

/* Hover on pop-up sub-menu items */
body.vertical-collpsed .vertical-menu #sidebar-menu ul li ul.sub-menu li a:hover,
body[data-sidebar-size="sm"] .vertical-menu #sidebar-menu ul li ul.sub-menu li a:hover {
    background-color: rgba(255, 255, 255, 0.15) !important;
}

/* Hide help box when sidebar is collapsed */
body.vertical-collpsed .sidebar-help-box,
body[data-sidebar-size="sm"] .sidebar-help-box {
    display: none !important;
}

/* ===== Hamburger Menu Styles ===== */
/* White when the menu is expanded */
.vertical-menu-btn,
.vertical-menu-btn i {
    color: #ffffff !important;
}

/* Blue #023f88 when the menu is collapsed */
body.vertical-collpsed .vertical-menu-btn,
body.vertical-collpsed .vertical-menu-btn i,
body[data-sidebar-size="sm"] .vertical-menu-btn,
body[data-sidebar-size="sm"] .vertical-menu-btn i {
    color: #023f88 !important;
}

/* ===== Mobile / Small Screens Styles ===== */
@media (max-width: 991.98px) {
    /* Hide the empty blue brand/logo box in the top bar on mobile */
    #page-topbar .navbar-brand-box {
        display: none !important;
    }

    /* Ensure the brand/logo box inside the vertical menu is displayed on mobile */
    .vertical-menu .navbar-brand-box {
        display: block !important;
        background-color: #0b4da2 !important; /* Keep the beautiful blue background */
    }

    /* Force the logo to be visible inside the vertical menu on mobile */
    .vertical-menu .navbar-brand-box .logo-dark,
    .vertical-menu .navbar-brand-box .logo-lg {
        display: block !important;
    }
    
    .vertical-menu .navbar-brand-box .logo-lg img {
        display: block !important;
    }

    /* Always keep the hamburger button and its icon blue on mobile and prevent it turning red */
    .vertical-menu-btn,
    .vertical-menu-btn i {
        color: #023f88 !important;
        background-color: transparent !important;
        border-color: transparent !important;
    }

    .vertical-menu-btn:hover,
    .vertical-menu-btn:active,
    .vertical-menu-btn:focus,
    .vertical-menu-btn:first-child:active,
    :not(.btn-check)+.vertical-menu-btn:active,
    .vertical-menu-btn:hover i,
    .vertical-menu-btn:active i,
    .vertical-menu-btn:focus i {
        color: #023f88 !important;
        background-color: rgba(2, 63, 136, 0.1) !important; /* Elegant light blue hover background instead of red */
        border-color: transparent !important;
    }
}