.card-gap-1 {
    margin: 1px !important;
}

.card {
}
/* --------------------------------- COLOR FOR THE TABLE INSIDE THE CARD ----------------------------------------------------- */
[data-bs-theme="light"] .card .card-body .table td {
    color: var(--navbarbackground-hover) !important;
}

[data-bs-theme="light"] .card .card-body .table .alternateRow td {
    color: var(--white) !important;
}

[data-bs-theme="light"] .card.card-body,
[data-bs-theme="light"] .card.card-body .text-end {
    color: var(--default-a-link-color) !important;
}
/* --------------------------------- COLOR FOR THE TABLE NOT INSIDE THE CARD ----------------------------------------------------- */

[data-bs-theme="light"] .table td {
    color: var(--navbarbackground-hover) !important;
}

[data-bs-theme="light"] .table .alternateRow td {
    color: var(--white) !important;
}

/* --------------------------------- END ----------------------------------------------------- */

/* Card header base colors already defined elsewhere; add hover tweaks */
.card.card-navbar {
    border: 1px solid var(--card-navbar) !important;
}

    .card.card-navbar > .card-header {
        background-color: var(--card-navbar) !important;
        color: #fff !important;
    }

        .card.card-navbar > .card-header:hover {
            /*background-color: var(--navbarbackground-hover) !important;*/
        }

.card.card-primary {
    border: 1px solid var(--card-primary) !important;
}

    .card.card-primary > .card-header {
        background-color: var(--card-primary) !important;
        color: #fff !important;
        /*margin: 2px 2px 0px 2px !important;*/
    }

        .card.card-primary > .card-header:hover {
            /*background-color: #02325b !important;*/
        }

.card.card-success {
    border: 1px solid var(--card-success) !important;
}

    .card.card-success > .card-header {
        background-color: var(--card-success) !important;
        color: #fff !important;
        /*margin: 2px 2px 0px 2px !important;*/
        /*margin: 0.1rem 0.1rem 0 0.1rem !important;*/
    }

        .card.card-success > .card-header:hover {
            /*background-color: #024f2b !important;*/
        }

.card.card-info {
    border: 1px solid var(--card-info) !important;
}

    .card.card-info > .card-header {
        background-color: var(--card-info) !important;
        color: #fff !important;
        /*margin: 2px 2px 0px 2px !important;*/
    }

        .card.card-info > .card-header:hover {
            /*background-color: #056f90 !important;*/
        }

.card.card-warning {
    border: 1px solid var(--card-warning) !important;
}

    .card.card-warning > .card-header {
        background-color: var(--card-warning) !important;
        color: #fff !important;
    }

        .card.card-warning > .card-header:hover {
            /*background-color: #d84300 !important;*/
        }

.card.card-danger {
    border: 1px solid var(--card-danger) !important;
}

    .card.card-danger > .card-header {
        background-color: var(--card-danger) !important;
        color: #fff !important;
        /*margin: 2px 2px 0px 2px !important;*/
    }

        .card.card-danger > .card-header:hover {
            /*background-color: #8c0000 !important;*/
        }

.card.card-default {
    border: 1px solid var(--card-default) !important;
}

    .card.card-default > .card-header {
        background-color: var(--card-default) !important;
        color: #fff !important;
    }

        .card.card-default > .card-header:hover {
            /*background-color: #5c5c5c !important;*/
        }

.card.card-defaultgray {
    border: 1px solid var(--card-defaultgray) !important;
}

    .card.card-defaultgray > .card-header {
        background-color: var(--card-defaultgray) !important;
        color: #fff !important;
    }

        .card.card-defaultgray > .card-header:hover {
            /*background-color: #4a4a4a !important;*/
        }

.card.card-darkred {
    border: 1px solid var(--card-darkred) !important;
}

    .card.card-darkred > .card-header {
        background-color: var(--card-darkred) !important;
        color: #fff !important;
    }

        .card.card-darkred > .card-header:hover {
            /*background-color: #4a4a4a !important;*/
        }

/* ========== CARD LINK / NAV PILL TWEAKS ========== */
.card a:not(.btn) {
    color: var(--card-link-color) !important;
    text-decoration: none !important;
}

    .card a:not(.btn):hover {
        color: var(--card-link-hover) !important;
        text-decoration: underline !important;
    }

/* Override specifically for card-header */
.card-header a:not(.btn) {
    color: var(--white) !important;
}

    .card-header a:not(.btn):hover {
        color: var(--white) !important;
        text-decoration: underline !important;
    }

html[data-bs-theme="light"] .card .card-body p, html[data-bs-theme="light"] .card .card-body span, html[data-bs-theme="light"] .card .card-body div {
    /*color: #024070 !important;*/
}


.card-header-with-tabs {
    display: flex !important; /* same as d-flex */
    align-items: center !important; /* same as align-items-center */
    justify-content: space-between !important; /* same as justify-content-between */
    flex-wrap: wrap !important; /* same as flex-wrap */
}

/* Light mode: inactive tab text colour */
[data-bs-theme="light"] .card-header .nav-tabs .nav-link {
    color: #fff !important;
}

    /* Light mode: active tab text colour (optional) */
    [data-bs-theme="light"] .card-header .nav-tabs .nav-link.active, [data-bs-theme="light"] .card-header .nav-tabs .nav-link:active {
        color: #024070 !important; /* or keep Bootstrap default if you want */
    }

/* Dark mode: keep white as default (Bootstrap handles it) */
[data-bs-theme="dark"] .card-header .nav-tabs .nav-link {
    color: #fff !important;
}

/* Dropdown inside card headers styled like navbar ================= PILLS/tabs */
/* Tabs / Pills styled like Offcanvas + Mega Menu */
.card .nav-pills .nav-link {
    background: transparent !important;
    color: var(--white) !important;
    border-radius: 4px !important;
    transition: background-color .2s ease, color .2s ease;
    padding: .5rem .75rem !important;
    margin: 0 .15rem !important;
}

    /* Active tab matches Offcanvas active */
    .card .nav-pills .nav-link.active {
        background-color: var(--card-header-tabs-pills) !important;
        color: #024070 !important;
    }

    /* Hover effect matches Offcanvas + Mega Menu */
    .card .nav-pills .nav-link:hover {
        background-color: var(--card-header-tabs-pills) !important;
        color: #024070 !important;
        text-decoration: none !important;
    }

/* Optional: separators like Mega Menu */
.card .nav-pills .nav-item + .nav-item {
    border-left: 1px solid rgba(255,255,255,0.06);
}

html[data-bs-theme="light"] .card .nav-pills .nav-item + .nav-item {
    border-left: 1px solid rgba(0,0,0,0.06);
}
/* Dropdown inside card headers styled like Navbar ================= */
.card .dropdown-menu {
    background-color: var(--navbarbackground) !important;
    border: 1px solid #14508d !important;
    padding: 0 !important;
    margin-top: .25rem !important;
}

    .card .dropdown-menu .dropdown-item {
        color: var(--white) !important;
        padding: .5rem 1rem !important;
        background: transparent !important;
        transition: background-color .2s ease, color .2s ease;
    }

        .card .dropdown-menu .dropdown-item:hover {
            background-color: var(--nav-link-background-hover) !important;
            color: var(--nav-link-hover-color) !important;
        }

        .card .dropdown-menu .dropdown-item.active {
            background-color: var(--nav-link-background-active) !important;
            color: var(--white) !important;
        }
/* Force dropdown menu to match toggle span width */
.card .nav-item.dropdown .dropdown-menu {
    min-width: unset !important;
    width: auto !important;
}

    .card .nav-item.dropdown .dropdown-menu.show {
        width: calc( var(--bs-dropdown-min-width, auto) ) !important;
    }

.card .nav-item.dropdown .dropdown-toggle span {
    display: inline-block;
    min-width: 100px; /* adjust as needed */
    text-align: left;
}

.card .nav.nav-pills.card-header-pills .nav-item.dropdown .dropdown-menu {
    width: max-content !important;
    min-width: 100% !important;
}

.card-header .nav.nav-pills.card-header-pills .nav-link,
.card-header .nav.nav-pills.card-header-pills .dropdown-item {
    text-decoration: none !important;
}

    .card-header .nav.nav-pills.card-header-pills .nav-link:hover,
    .card-header .nav.nav-pills.card-header-pills .dropdown-item:hover {
        text-decoration: none !important;
    }