/* assets/css/dark-theme.css */
html {
    overflow-y: scroll;
    scrollbar-gutter: stable;
}
body {
    background-color: #121212;
    color: #fff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    overflow-x: hidden;
    /* background-image: url(../images/body-bg.jpg); */
    background-image: url(../images/erp-bg-grayscale.jpg);
    background-size: cover;
    background-attachment: fixed;
}

a {
    transition: all .5s !important;
}

a {
    color: #00ff00;
}

a:hover {
    color: #eaab65;
    transition: all .2s !important;
}

.cursor-pointer {
    cursor: pointer;
}

.back-to-top {
    border: 1px solid #fff;
    width: 30px;
    height: 30px;
    line-height: 0px;
    text-align: center;
    font-size: 15px;
    color: black !important;
    position: fixed;
    border-radius: 10px;
    bottom: 20px;
    right: 12px;
    background-color: lime !important;
    z-index: 1000;
    opacity: 0.7;
    transform: scale(1);
    transition: all 0.5s ease-in-out;
}

.back-to-top:hover {
    opacity: 1;
    transform: scale(1.2);
    transition: all 0.1s ease-in-out;
}

.pace .pace-progress {
    background: #00ff00 !important;
    height: 3px !important;
}

.bg-dark {
    background-color: #212529;
}

/* Sidebar Wrapper */
.sidebar-wrapper {
    width: 250px;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    /* background: #000; */
    border-right: 1px solid #495057;
    z-index: 1000;
    transition: all 0.3s;
}

.sidebar-header {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0px;
    border-bottom: 1px solid #495057;
    width: 250px;
    /* Fixed width to prevent collapsing issues */
    transition: all 0.3s;
}

.logo-text {
    font-size: 20px;
    margin-left: 10px;
    margin-bottom: 0;
    color: #fff;
}

/* MetisMenu Styles */
.metismenu {
    padding: 0;
    margin: 0;
    list-style: none;
    /* background: #000; */
}

.metismenu li {
    display: block;
    width: 100%;
}

.metismenu a {
    position: relative;
    display: flex;
    align-items: center;
    padding: 10px 20px;
    color: #fff;
    text-decoration: none;
    transition: all 0.3s;
    border-left: 3px solid transparent;
}

.metismenu a.has-arrow .parent-icon {
    border: 2px solid #916f4d !important;
    min-width: 35px;
}

.metismenu a.has-arrow[aria-expanded="true"] .parent-icon {
    border-color: #00ff00 !important;
    color: #0d6efd;
}

.metismenu a.has-arrow[aria-expanded="false"] .parent-icon {
    background-color: transparent;
}


.metismenu a:hover,
.metismenu a.active,
.metismenu a[aria-expanded="true"] {
    color: #fff;
    background: #1e1e1e;
    border-left-color: #0d6efd;
}

/* Prevent FOUC: Hide submenus by default */
.metismenu ul:not(.mm-show):not(.mm-collapsing) {
    display: none;
}

.parent-icon {
    margin-right: 10px;
    text-align: center;
    border-radius: 50%;
    font-size: 22px;
    line-height: 1;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.menu-title {
    font-size: 15px;
    text-transform: uppercase;
}

.menu-label {
    padding: 10px 20px;
    color: #6c757d;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 600;
}

/* Content Wrapper */
#page-content-wrapper {
    margin-left: 250px;
    width: calc(100% - 250px);
    transition: all 0.3s;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

/* 
   DESKTOP TOGGLED STATE 
   (Collapsed to icons, expands on hover)
   Only apply on large screens
*/
@media (min-width: 1200px) {
    body.toggled:not(.sidebar-hovered) .sidebar-wrapper {
        width: 70px;
    }

    body.toggled:not(.sidebar-hovered) .sidebar-wrapper .sidebar-header {
        width: 70px;
        padding: 0;
        justify-content: center;
    }

    body.toggled:not(.sidebar-hovered) .sidebar-wrapper .sidebar-header .logo-text,
    body.toggled:not(.sidebar-hovered) .sidebar-wrapper .sidebar-header .toggle-icon,
    body.toggled:not(.sidebar-hovered) .sidebar-wrapper .sidebar-header #xjmExchangeRate {
        display: none;
    }

    body.toggled:not(.sidebar-hovered) .sidebar-wrapper .metismenu .menu-title,
    body.toggled:not(.sidebar-hovered) .sidebar-wrapper .metismenu .menu-label,
    body.toggled:not(.sidebar-hovered) .sidebar-wrapper .metismenu .has-arrow::after {
        display: none;
    }

    body.toggled:not(.sidebar-hovered) .sidebar-wrapper .metismenu a {
        justify-content: center;
        padding: 10px;
    }

    body.toggled:not(.sidebar-hovered) .sidebar-wrapper .metismenu a .parent-icon {
        margin-right: 0;
    }

    body.toggled:not(.sidebar-hovered) #page-content-wrapper {
        margin-left: 70px;
        width: calc(100% - 70px);
    }

    /* Hover State when Toggled (Expands back to normal) */
    body.toggled.sidebar-hovered .sidebar-wrapper {
        width: 250px;
        box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.5);
    }
}

/* Cards & Tables */
.card {
    background-color: #1e1e1e;
    border: 1px solid #333;
    color: #fff;
}

.form-control {
    background-color: #2c2c2c;
    border: 1px solid #444;
    color: #fff;
}

.form-control:focus {
    background-color: #2c0b0e;
    border-color: #666;
    color: #fff;
    box-shadow: none;
}

.table {
    color: #fff;
}

.table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, .05);
}

.table-hover tbody tr:hover {
    color: #fff;
    background-color: rgba(255, 255, 255, .1);
}

a {
    text-decoration: none;
}

.card {
    margin-bottom: 1.5rem;
    border: 1px solid #aaaaaa;
}

.card-body {
    flex: 1 1 auto;
    padding: 1rem;
}

.xjmBoxes {
    transition: all 0.5s ease-in-out;
}

.xjmBoxes:hover {
    transform: scale(1.05);
    transition: all 0.1s ease-in-out;
}

.card {
    background-color: rgb(0 0 0 / 30%);
}

.page-content {
    /* min-height: 100vh; */
    flex: 1;
    /* This makes it fill all available remaining space */
}

.xjm-text-shadow-220 {
    text-shadow: 2px 2px 0px rgba(0, 0, 0, 0.3);
}

.btn-dark {
    color: white;
    margin: 10px 0;
    font-size: 1em;
    min-width: 225px;
    max-width: 500px;
    border-color: white;
    text-shadow: 2px 2px 0px rgba(0, 0, 0, 0.3);
}

.btn:hover {
    border: 1px solid white;
    box-shadow: 0 0 10px 5px rgba(0, 255, 0, .9);
    transition: all 0.2s ease-in-out;
}

/* Disable the global .btn:hover effect ONLY inside this group */
.xjmButtonGroup .btn:hover,
.xjmButtonGroup .btn:focus,
.xjmButtonGroup .btn:active {
    /* border-color: transparent !important; */
    border-color: #ffffff !important;
    box-shadow: none !important;
}

.xjmButtonGroup .btn {
    transition: transform 140ms cubic-bezier(.2, .8, .2, 1);
    transform-origin: center;
}

.navbar {
    box-shadow: 0px 2px 18px 0px rgba(0, 0, 0, 0.7);
}

.nav-link {
    color: #fff !important;
}

.nav-link:focus,
.nav-link:hover {
    color: #00ff00 !important;
}

.xjmCloseButton {
    transform: scale(1);
    transition: all 0.5s ease-in-out;
}

.xjmCloseButton:hover {
    transform: scale(1.2);
    transition: all 0.2s ease-in-out;
}

/* Apply Primary Color to Key Elements */
.btn-primary {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
}

.text-primary {
    color: var(--bs-primary) !important;
}

.bg-primary {
    background-color: var(--bs-primary);
}

.bg-purple {
    background-color: #923eb9 !important;
}

.bg-yellow {
    background-color: #ffff00 !important;
}

.bg-orange {
    background-color: #bd6014 !important;
}

.bg-gray {
    background-color: #707070 !important;
}

.bg-green-dk {
    background-color: #0c4802 !important;
}

.bg-maroon {
    background-color: #800000 !important;
}

.bg-darkred {
    background-color: #8b0000 !important;
}

.bg-lime {
    background-color: #00ff00 !important;
}

.bg-blue {
    background-color: #0000ff !important;
}

.bg-md-blue {
    background-color: #1c47aa !important;
}

.bg-teal {
    background-color: teal !important;
}

.bg-pink {
    background-color: pink !important;
}

.xjmBlink01s {
    animation: blinking-01s .1s infinite;
}

@keyframes blinking-01s {
    50% {
        opacity: 0.9;
    }
}

.xjmBlink02s {
    animation: blinking-02s .2s infinite;
}

@keyframes blinking-02s {
    50% {
        opacity: 0.3;
    }
}

.xjmBlink05s {
    animation: blinking-05s .5s infinite;
}

@keyframes blinking-05s {
    50% {
        opacity: 0.3;
    }
}

.xjmBlink1s {
    animation: blinking-1s 1s infinite;
}

@keyframes blinking-1s {
    50% {
        opacity: 0.5;
    }
}

.xjmBlink2s {
    animation: blinking-2s 2s infinite;
}

@keyframes blinking-2s {
    50% {
        opacity: 0.5;
    }
}

.xjmBlink3s {
    animation: blinking-3s 3s infinite;
}

@keyframes blinking-3s {
    50% {
        opacity: 0.5;
    }
}

#xjmLoginButton {
    background-color: #135298;
    color: #ffffff;
    text-transform: uppercase;
    font-size: 16px;
    letter-spacing: 1px;
    text-shadow: 0em 0.1em 0.1em rgba(0, 0, 0, 0.4);
    padding-bottom: 3px;
    transition: all .5s ease !important;
}

#xjmLoginButton:hover {
    background-color: #E06648;
    box-shadow: none !important;
    transition: all .2s ease !important;
}

.apexcharts-tooltip-marker {
    border: 1px solid white !important;
}
.apexcharts-menu {
    background: #ffffff !important;
    border: 1px solid #ccc !important;
}

.apexcharts-menu-item {
    color: #000000 !important;
}

.apexcharts-menu-item:hover {
    background: #f2f2f2 !important;
    color: #000000 !important;
}
.apexcharts-menu-item.exportSVG::before {
    content: "\f1c5"; /* fa-file-image */
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    margin-right: 8px;
}

.apexcharts-menu-item.exportPNG::before {
    content: "\f1c5";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    margin-right: 8px;
}

.apexcharts-menu-item.exportCSV::before {
    content: "\f6dd"; /* fa-file-csv */
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    margin-right: 8px;
}

.xjmFormControl {
    border: 0px solid white;
    /* border: none; */
    background-color: #212529;
    color: white;
}

.border-lime {
    border-color: #00ff00 !important;
}

/* Mobile Responsiveness */
@media (max-width: 1199px) {
    .sidebar-wrapper {
        left: -250px;
    }

    #page-content-wrapper {
        margin-left: 0;
        width: 100%;
    }

    /* Mobile Toggled State (Show Sidebar) */
    body.toggled .sidebar-wrapper {
        left: 0;
        width: 250px;
        /* Ensure full width */
    }

    body.toggled #page-content-wrapper {
        margin-left: 0;
        width: 100%;
    }

    /* Overlay effect for mobile */
    body.toggled #page-content-wrapper::before {
        content: "";
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.5);
        z-index: 999;
    }
}

/* Navbar Sticky Behavior */
.navbar {
    background-color: #1e1e1e;
    border-bottom: 1px solid #333;
    position: sticky;
    top: 0;
    z-index: 999;
    transition: transform 0.3s ease-in-out;
}

.navbar-hidden {
    transform: translateY(-100%);
}

/* Form elements */
/* .form-select {
    border: 1px solid white;
    color: white;
} */
.input-group-text,
.form-control,
.form-select {
    border: 1px solid white;
    color: white;
}

/* xjmBeat Animation */
.xjmBeat:hover {
    animation-name: fa-beat;
    animation-delay: var(--fa-animation-delay, 0s);
    animation-direction: var(--fa-animation-direction, normal);
    animation-duration: var(--fa-animation-duration, 1s);
    animation-iteration-count: var(--fa-animation-iteration-count, infinite);
    animation-timing-function: var(--fa-animation-timing, ease-in-out);
}

@keyframes fa-beat {

    0%,
    90% {
        transform: scale(1);
    }

    45% {
        transform: scale(1.25);
    }
}

/* Ported from original ERP dark-theme-xjm.css */

table.dataTable thead>tr>th.sorting:before,
table.dataTable thead>tr>th.sorting_asc:before,
table.dataTable thead>tr>th.sorting_desc:before,
table.dataTable thead>tr>th.sorting_asc_disabled:before,
table.dataTable thead>tr>th.sorting_desc_disabled:before,
table.dataTable thead>tr>td.sorting:before,
table.dataTable thead>tr>td.sorting_asc:before,
table.dataTable thead>tr>td.sorting_desc:before,
table.dataTable thead>tr>td.sorting_asc_disabled:before,
table.dataTable thead>tr>td.sorting_desc_disabled:before,
table.dataTable thead>tr>th.sorting:after,
table.dataTable thead>tr>th.sorting_asc:after,
table.dataTable thead>tr>th.sorting_desc:after,
table.dataTable thead>tr>th.sorting_asc_disabled:after,
table.dataTable thead>tr>th.sorting_desc_disabled:after,
table.dataTable thead>tr>td.sorting:after,
table.dataTable thead>tr>td.sorting_asc:after,
table.dataTable thead>tr>td.sorting_desc:after,
table.dataTable thead>tr>td.sorting_asc_disabled:after,
table.dataTable thead>tr>td.sorting_desc_disabled:after {
    color: lime !important;
}

table.dataTable thead>tr>th.sorting:before,
table.dataTable thead>tr>th.sorting:after,
table.dataTable thead>tr>th.sorting_asc:before,
table.dataTable thead>tr>th.sorting_asc:after,
table.dataTable thead>tr>th.sorting_desc:before,
table.dataTable thead>tr>th.sorting_desc:after,
table.dataTable thead>tr>th.sorting_asc_disabled:before,
table.dataTable thead>tr>th.sorting_asc_disabled:after,
table.dataTable thead>tr>th.sorting_desc_disabled:before,
table.dataTable thead>tr>th.sorting_desc_disabled:after,
table.dataTable thead>tr>td.sorting:before,
table.dataTable thead>tr>td.sorting:after,
table.dataTable thead>tr>td.sorting_asc:before,
table.dataTable thead>tr>td.sorting_asc:after,
table.dataTable thead>tr>td.sorting_desc:before,
table.dataTable thead>tr>td.sorting_desc:after,
table.dataTable thead>tr>td.sorting_asc_disabled:before,
table.dataTable thead>tr>td.sorting_asc_disabled:after,
table.dataTable thead>tr>td.sorting_desc_disabled:before,
table.dataTable thead>tr>td.sorting_desc_disabled:after {
    position: absolute;
    display: block;
    opacity: .3;
    right: 10px;
    line-height: 12px !important;
    font-size: .8em;
}


table.dataTable thead>tr>th.sorting_asc:before,
table.dataTable thead>tr>th.sorting_desc:after,
table.dataTable thead>tr>td.sorting_asc:before,
table.dataTable thead>tr>td.sorting_desc:after {
    opacity: 1;
    color: lime !important;
}

tbody,
td,
tfoot,
th,
thead,
tr {
    color: #fff !important;
}

table {
    --bs-table-bg: rgb(0 0 0 / 30%);
    background-color: rgb(0 0 0 / 30%);
}

table.dataTable {
    clear: both;
    margin-top: 6px !important;
    margin-bottom: 6px !important;
    max-width: none !important;
    border-collapse: separate !important;
    border-spacing: 0;
    --bs-table-bg: rgb(0 0 0 / 20%);
    background-color: rgb(0 0 0 / 20%);
}

table.xjmTableBG {
    --bs-table-bg: rgb(0 0 0 / 0%);
    background-color: rgb(0 0 0 / 0%);
}

table tbody tr.odd {
    background-color: rgb(255 255 255 / 10%);
}

table tbody tr.even {
    background-color: rgb(255 255 255 / 10%);
}

table tbody td {
    border-bottom: 1px solid rgb(255 255 255 / 25%);
    border-bottom-width: 1px !important;
}

table thead tr th {
    border-bottom: 1px solid lime !important;
    background: rgba(255, 255, 255, 0.2) !important;
    text-align: center !important;
}

table tfoot tr th {
    border-top: 1px solid lime !important;
    background: rgba(255, 255, 255, 0.01) !important;
    text-align: center !important;
}

table tfoot tr {
    border-top: 2px solid lime !important;
    background: rgba(255, 255, 255, 0.2) !important;
    text-align: center !important;
}

.btn-outline-secondary {
    color: white;
}

table.dataTable>thead .sorting_asc:before,
table.dataTable>thead .sorting_desc:after {
    color: lime;
}


/* FOR PLANILLA DATATABLE */
td.xjmLimeHover {
    cursor: pointer;
}

td.xjmLimeHover:hover {
    box-shadow: inset 0px 0px 0px 2px lime !important;
}


#xjmStatus.form-switch .form-check-input:checked,
.xjmStatus.form-switch .form-check-input:checked {
    background-position: left center !important;
    --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e") !important;
}

#xjmStatus.form-switch .form-check-input,
.xjmStatus.form-switch .form-check-input {
    background-position: right center !important;
    --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e") !important;
}

#xjmStatus.form-switch .form-check-input:not(:checked):not(:focus),
.xjmStatus.form-switch .form-check-input:not(:checked):not(:focus) {
    --bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e") !important;
}

/* Pace.js Custom Styles */
.pace {
    -webkit-pointer-events: none;
    pointer-events: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    transition: opacity 0.2s ease-out;
}

.pace-inactive {
    opacity: 0;
}

.pace .pace-progress {
    background: #00ff00 !important;
    position: fixed;
    z-index: 2000;
    top: 0;
    right: 100%;
    width: 100%;
    height: 3px !important;
}

.pace .pace-progress-inner {
    display: block;
    position: absolute;
    right: 0;
    width: 100px;
    height: 100%;
    box-shadow: 0 0 10px #00ff00, 0 0 5px #00ff00;
    opacity: 1;
    transform: rotate(3deg) translate(0, -4px);
}

.pace .pace-activity {
    display: block;
    position: fixed;
    z-index: 2000;
    top: 50%;
    right: 50%;
    width: 50px;
    height: 50px;
    border: solid 5px transparent;
    border-top-color: #00ff00;
    border-left-color: #00ff00;
    border-radius: 50%;
    animation: pace-spinner 400ms linear infinite;
}

@keyframes pace-spinner {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

body.pace-running::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3);
    z-index: 1999;
    /* Place it behind the pace bar but in front of content */
}

.lobibox-notify.lobibox-notify-success {
    background-color: #008000 !important;
    border: 1px solid #fff !important;
    -webkit-box-shadow: 0px 0px 10px #000 !important;
    box-shadow: 0px 0px 10px #000 !important;
}

.lobibox-notify.lobibox-notify-info {
    background-color: #094aa9 !important;
    border: 1px solid #fff !important;
    -webkit-box-shadow: 0px 0px 10px #000 !important;
    box-shadow: 0px 0px 10px #000 !important;
}

.lobibox-notify.lobibox-notify-warning {
    background-color: #9b5810 !important;
    border: 1px solid #fff !important;
    -webkit-box-shadow: 0px 0px 10px #000 !important;
    box-shadow: 0px 0px 10px #000 !important;
}

.lobibox-notify.lobibox-notify-error {
    background-color: #CA2121 !important;
    border: 1px solid #fff !important;
    -webkit-box-shadow: 0px 0px 10px #000 !important;
    box-shadow: 0px 0px 10px #000 !important;
}

.xjmAlertBox1 {
    text-align: center;
    border-radius: .375rem;
    padding: 10px;
    margin: 1.3em 0 0;
    border: 1px solid white;
    background: #f00000;
    font-weight: bold;
    color: white;
}

.border-aaa {
    border-color: #aaa !important;
}

.nav-pills .nav-link.active,
.nav-pills .show>.nav-link {
    background-color: var(--bs-primary);
}

.page-item.active .page-link {
    background-color: var(--bs-primary);
    border-color: var(--bs-primary);
}

/* --- XJM THEMES (Generated) --- */

[data-theme="blue"] {
    --bs-primary: #0d6efd;
    --bs-primary-rgb: 13, 110, 253;
}

[data-theme="red"] {
    --bs-primary: #dc3545;
    --bs-primary-rgb: 220, 53, 69;
}

[data-theme="green"] {
    --bs-primary: #198754;
    --bs-primary-rgb: 25, 135, 84;
}

[data-theme="purple"] {
    --bs-primary: #6f42c1;
    --bs-primary-rgb: 111, 66, 193;
}

[data-theme="brown"] {
    --bs-primary: #795548;
    --bs-primary-rgb: 121, 85, 72;
}

[data-theme="dark"] {
    --bs-primary: #adb5bd;
    --bs-primary-rgb: 173, 181, 189;
}

/* xjmBG1 (Red) */
[data-xjmbg=xjmBG1] .modal-content {
    background-color: #140000;
}

[data-xjmbg=xjmBG1] .sidebar-wrapper .metismenu .mm-active>a .parent-icon,
[data-xjmbg=xjmBG1] .sidebar-wrapper .metismenu a:hover .parent-icon,
[data-xjmbg=xjmBG1] .sidebar-wrapper .metismenu a:active .parent-icon {
    color: #ffffff;
    background: #7c1415;
    border-color: #7c1415;
    transition: ease-out .3s;
}

[data-xjmbg=xjmBG1] .sidebar-wrapper .sidebar-nav,
[data-xjmbg=xjmBG1] .sidebar-wrapper .sidebar-header,
[data-xjmbg=xjmBG1] .sidebar-wrapper .sidebar-bottom,
[data-xjmbg=xjmBG1] .sidebar-wrapper,
[data-xjmbg=xjmBG1] .navbar,
[data-xjmbg=xjmBG1] #xjmFooter.page-footer {
    background: #140000;
}

[data-xjmbg=xjmBG1] .sidebar-wrapper .metismenu .mm-active>a .parent-icon,
[data-xjmbg=xjmBG1] .sidebar-wrapper .metismenu a:hover .parent-icon,
[data-xjmbg=xjmBG1] .sidebar-wrapper .metismenu a.active .parent-icon {
    background-color: #7c1415;
    border-color: #7c1415;
}

[data-xjmbg=xjmBG1] .sidebar-wrapper .metismenu .mm-active>a,
[data-xjmbg=xjmBG1] .sidebar-wrapper .metismenu a:hover {
    color: #fd576d;
}

[data-xjmbg=xjmBG1] .page-content {
    background-size: 200% 200%;
    background-image: linear-gradient(-45deg, #140000 0%, #140000 25%, rgba(68, 2, 2, 0.3) 50%, #140000 75%, #140000 100%);
    -webkit-animation: AnimateBG 20s ease infinite;
    animation: AnimateBG 20s ease infinite;
}
[data-xjmbg=xjmBG1] .xjmBoxes {
    background: linear-gradient(to top right, #e6cece 0%, #ffffff 50%, #ffffff 100%);
}

/* xjmBG2 (Blue) */
[data-xjmbg=xjmBG2] .modal-content {
    background-color: #031633;
}

[data-xjmbg=xjmBG2] .sidebar-wrapper .metismenu .mm-active>a .parent-icon,
[data-xjmbg=xjmBG2] .sidebar-wrapper .metismenu a:hover .parent-icon,
[data-xjmbg=xjmBG2] .sidebar-wrapper .metismenu a:active .parent-icon {
    color: #ffffff;
    text-decoration: none;
    background: #0d6efd;
    border-color: #0d6efd;
    transition: ease-out .3s;
}

[data-xjmbg=xjmBG2] .sidebar-wrapper .sidebar-nav,
[data-xjmbg=xjmBG2] .sidebar-wrapper .sidebar-header,
[data-xjmbg=xjmBG2] .sidebar-wrapper .sidebar-bottom,
[data-xjmbg=xjmBG2] .sidebar-wrapper,
[data-xjmbg=xjmBG2] .navbar,
[data-xjmbg=xjmBG2] #xjmFooter.page-footer {
    background: #000914;
}

[data-xjmbg=xjmBG2] .sidebar-wrapper .metismenu .mm-active>a .parent-icon,
[data-xjmbg=xjmBG2] .sidebar-wrapper .metismenu a:hover .parent-icon,
[data-xjmbg=xjmBG2] .sidebar-wrapper .metismenu a.active .parent-icon {
    background-color: #0d6efd;
    border-color: #0d6efd;
}

[data-xjmbg=xjmBG2] .sidebar-wrapper .metismenu .mm-active>a,
[data-xjmbg=xjmBG2] .sidebar-wrapper .metismenu a:hover {
    color: #80c9ff;
}

[data-xjmbg=xjmBG2] .page-content {
    background-size: 200% 200%;
    /* background-image: linear-gradient(-45deg, #000914 0%, #000914 25%, rgba(2, 40, 68, 0.502) 50%, #000914 75%, #000914 100%); */
    background-image: linear-gradient(-45deg, #020517 0%, #020517 25%, rgb(28 92 206 / 30%) 50%, #020517 75%, #020517 100%);
    -webkit-animation: AnimateBG 20s ease infinite;
    animation: AnimateBG 20s ease infinite;
}
[data-xjmbg=xjmBG2] .xjmBoxes {
    background: linear-gradient(to top right, #c3d0db 0%, #ffffff 50%, #ffffff 100%);
}

/* xjmBG3 (Green) */
[data-xjmbg=xjmBG3] .modal-content {
    background-color: #001400;
}

[data-xjmbg=xjmBG3] .sidebar-wrapper .metismenu .mm-active>a .parent-icon,
[data-xjmbg=xjmBG3] .sidebar-wrapper .metismenu a:hover .parent-icon,
[data-xjmbg=xjmBG3] .sidebar-wrapper .metismenu a:active .parent-icon {
    color: #ffffff;
    background: #198754;
    border-color: #198754;
    transition: ease-out .3s;
}

[data-xjmbg=xjmBG3] .sidebar-wrapper .sidebar-nav,
[data-xjmbg=xjmBG3] .sidebar-wrapper .sidebar-header,
[data-xjmbg=xjmBG3] .sidebar-wrapper .sidebar-bottom,
[data-xjmbg=xjmBG3] .sidebar-wrapper,
[data-xjmbg=xjmBG3] .navbar,
[data-xjmbg=xjmBG3] #xjmFooter.page-footer {
    background: #001400;
}

[data-xjmbg=xjmBG3] .sidebar-wrapper .metismenu .mm-active>a .parent-icon,
[data-xjmbg=xjmBG3] .sidebar-wrapper .metismenu a:hover .parent-icon,
[data-xjmbg=xjmBG3] .sidebar-wrapper .metismenu a.active .parent-icon {
    background-color: #198754;
    border-color: #198754;
}

[data-xjmbg=xjmBG3] .sidebar-wrapper .metismenu .mm-active>a,
[data-xjmbg=xjmBG3] .sidebar-wrapper .metismenu a:hover {
    color: #a3cfbb;
}

[data-xjmbg=xjmBG3] .page-content {
    background-size: 200% 200%;
    background-image: linear-gradient(-45deg, #001400 0%, #001400 25%, rgba(7, 68, 2, 0.3) 50%, #001400 75%, #001400 100%);
    -webkit-animation: AnimateBG 20s ease infinite;
    animation: AnimateBG 20s ease infinite;
}
[data-xjmbg=xjmBG3] .xjmBoxes {
    background: linear-gradient(to top right, #c7ddc7 0%, #ffffff 50%, #ffffff 100%);
}

/* xjmBG4 (Brown) */
[data-xjmbg=xjmBG4] .modal-content {
    background-color: #141000;
}

[data-xjmbg=xjmBG4] .sidebar-wrapper .metismenu .mm-active>a .parent-icon,
[data-xjmbg=xjmBG4] .sidebar-wrapper .metismenu a:hover .parent-icon,
[data-xjmbg=xjmBG4] .sidebar-wrapper .metismenu a:active .parent-icon {
    color: #ffffff;
    background: #876019;
    border-color: #876019;
    transition: ease-out .3s;
}

[data-xjmbg=xjmBG4] .sidebar-wrapper .sidebar-nav,
[data-xjmbg=xjmBG4] .sidebar-wrapper .sidebar-header,
[data-xjmbg=xjmBG4] .sidebar-wrapper .sidebar-bottom,
[data-xjmbg=xjmBG4] .sidebar-wrapper,
[data-xjmbg=xjmBG4] .navbar,
[data-xjmbg=xjmBG4] #xjmFooter.page-footer {
    background: #141400;
}

[data-xjmbg=xjmBG4] .sidebar-wrapper .metismenu .mm-active>a .parent-icon,
[data-xjmbg=xjmBG4] .sidebar-wrapper .metismenu a:hover .parent-icon,
[data-xjmbg=xjmBG4] .sidebar-wrapper .metismenu a.active .parent-icon {
    background-color: #876019;
    border-color: #876019;
}

[data-xjmbg=xjmBG4] .sidebar-wrapper .metismenu .mm-active>a,
[data-xjmbg=xjmBG4] .sidebar-wrapper .metismenu a:hover {
    color: #cfcea3;
}

[data-xjmbg=xjmBG4] .page-content {
    background-size: 200% 200%;
    background-image: linear-gradient(-45deg, #141000 0%, #141000 25%, rgba(68, 56, 2, 0.3) 50%, #141000 75%, #141000 100%);
    -webkit-animation: AnimateBG 20s ease infinite;
    animation: AnimateBG 20s ease infinite;
}
[data-xjmbg=xjmBG4] .xjmBoxes {
    background: linear-gradient(to top right, #e7d9bc 0%, #ffffff 50%, #ffffff 100%);
}

/* xjmBG5 (Orange) */
[data-xjmbg=xjmBG5] .modal-content {
    background-color: #140800;
}

[data-xjmbg=xjmBG5] .sidebar-wrapper .metismenu .mm-active>a .parent-icon,
[data-xjmbg=xjmBG5] .sidebar-wrapper .metismenu a:hover .parent-icon,
[data-xjmbg=xjmBG5] .sidebar-wrapper .metismenu a:active .parent-icon {
    color: #ffffff;
    background: #874e19;
    border-color: #874e19;
    transition: ease-out .3s;
}

[data-xjmbg=xjmBG5] .sidebar-wrapper .sidebar-nav,
[data-xjmbg=xjmBG5] .sidebar-wrapper .sidebar-header,
[data-xjmbg=xjmBG5] .sidebar-wrapper .sidebar-bottom,
[data-xjmbg=xjmBG5] .sidebar-wrapper,
[data-xjmbg=xjmBG5] .navbar,
[data-xjmbg=xjmBG5] #xjmFooter.page-footer {
    background: #140800;
}

[data-xjmbg=xjmBG5] .sidebar-wrapper .metismenu .mm-active>a .parent-icon,
[data-xjmbg=xjmBG5] .sidebar-wrapper .metismenu a:hover .parent-icon,
[data-xjmbg=xjmBG5] .sidebar-wrapper .metismenu a.active .parent-icon {
    background-color: #874e19;
    border-color: #874e19;
}

[data-xjmbg=xjmBG5] .sidebar-wrapper .metismenu .mm-active>a,
[data-xjmbg=xjmBG5] .sidebar-wrapper .metismenu a:hover {
    color: #a3cfbb;
}

[data-xjmbg=xjmBG5] .page-content {
    background-size: 200% 200%;
    background-image: linear-gradient(-45deg, #140800 0%, #140800 25%, rgba(68, 34, 2, 0.3) 50%, #140800 75%, rgb(20, 8, 0) 100%);
    -webkit-animation: AnimateBG 20s ease infinite;
    animation: AnimateBG 20s ease infinite;
}
[data-xjmbg=xjmBG5] .xjmBoxes {
    background: linear-gradient(to top right, #f1d5bf 0%, #ffffff 50%, #ffffff 100%);
}

/* xjmBG6 (Purple) */
[data-xjmbg=xjmBG6] .modal-content {
    background-color: #140012;
}

[data-xjmbg=xjmBG6] .sidebar-wrapper .metismenu .mm-active>a .parent-icon,
[data-xjmbg=xjmBG6] .sidebar-wrapper .metismenu a:hover .parent-icon,
[data-xjmbg=xjmBG6] .sidebar-wrapper .metismenu a:active .parent-icon {
    color: #ffffff;
    background: #6d1987;
    border-color: #6d1987;
    transition: ease-out .3s;
}

[data-xjmbg=xjmBG6] .sidebar-wrapper .sidebar-nav,
[data-xjmbg=xjmBG6] .sidebar-wrapper .sidebar-header,
[data-xjmbg=xjmBG6] .sidebar-wrapper .sidebar-bottom,
[data-xjmbg=xjmBG6] .sidebar-wrapper,
[data-xjmbg=xjmBG6] .navbar,
[data-xjmbg=xjmBG6] #xjmFooter.page-footer {
    background: #140012;
}

[data-xjmbg=xjmBG6] .sidebar-wrapper .metismenu .mm-active>a .parent-icon,
[data-xjmbg=xjmBG6] .sidebar-wrapper .metismenu a:hover .parent-icon,
[data-xjmbg=xjmBG6] .sidebar-wrapper .metismenu a.active .parent-icon {
    background-color: #6d1987;
    border-color: #6d1987;
}

[data-xjmbg=xjmBG6] .sidebar-wrapper .metismenu .mm-active>a,
[data-xjmbg=xjmBG6] .sidebar-wrapper .metismenu a:hover {
    color: #cfa3c6;
}

[data-xjmbg=xjmBG6] .page-content {
    background-size: 200% 200%;
    background-image: linear-gradient(-45deg, #140012 0%, #140012 25%, rgba(66, 2, 68, 0.3) 50%, #140012 75%, #140012 100%);
    -webkit-animation: AnimateBG 20s ease infinite;
    animation: AnimateBG 20s ease infinite;
}
[data-xjmbg=xjmBG6] .xjmBoxes {
    background: linear-gradient(to top right, #ebd5ec 0%, #ffffff 50%, #ffffff 100%);
}

@-webkit-keyframes AnimateBG {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

@keyframes AnimateBG {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}


/* Mobile Header Menu Styling */
@media (max-width: 991.98px) {

    .mobile-header-menu.show,
    .mobile-header-menu.collapsing {
        background-color: #0c482c !important;
        background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
        border-bottom-left-radius: var(--bs-border-radius) !important;
        border-bottom-right-radius: var(--bs-border-radius) !important;
        border: 1px solid white !important;
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-around !important;
        padding: 0.5rem;
        margin-top: 0.5rem;
        overflow: hidden;
        /* Prevent content spill during animation */
    }

    .mobile-header-menu.show .navbar-nav,
    .mobile-header-menu.collapsing .navbar-nav {
        flex-direction: row !important;
        width: 100%;
        justify-content: space-around;
        margin-top: 0 !important;
        /* Override mt-2 */
    }

    .mobile-header-menu.show .nav-item,
    .mobile-header-menu.collapsing .nav-item {
        margin: 0 5px;
    }
}

/* Hide Quote of Day when sidebar is toggled */
body.toggled #quoteOfDay {
    display: none;
}

/* Show it again when hovered */
body.toggled.sidebar-hovered #quoteOfDay {
    display: block;
}

.xjmClientCardLink, .xjmClientCardLink a {
    color: rgba(0, 0, 0, .7);
}

.xjmClientCardLink:hover, .xjmClientCardLink a:hover {
    color: #880000 !important;
    transition: all .2s !important;
}

.xjmCard {
    /* background: linear-gradient(to top right, #c3d0db 0%, #ffffff 50%, #ffffff 100%); */
    color: #212529;
    border: 1px solid #aaaaaa;
    border-radius: 0.375rem;
    margin-bottom: 1rem;
    overflow: hidden !important;
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .1) !important;
}
.xjmCardBody {
    color: #212529;
    padding: 1rem;
    /* border: 1px solid #aaaaaa;
    border-radius: 0.375rem; */
}

/* =========================================================
   xjmBG1 = RED
========================================================= */
[data-xjmbg=xjmBG1] .xjmCard, [data-xjmbg=xjmBG1] .xjmCardBody {
    background: linear-gradient(to top right, #e6cece 0%, #ffffff 50%, #ffffff 100%);
}
/* [data-xjmbg=xjmBG1] .sidebar-wrapper .sidebar-nav, [data-xjmbg=xjmBG1] .sidebar-wrapper .sidebar-header, [data-xjmbg=xjmBG1] .sidebar-wrapper .sidebar-bottom, [data-xjmbg=xjmBG1] .sidebar-wrapper, [data-xjmbg=xjmBG1] .navbar, [data-xjmbg=xjmBG1] #xjmFooter.page-footer {
    background: #240202;
} */
[data-xjmbg=xjmBG1] .sidebar-wrapper,
[data-xjmbg=xjmBG1] .navbar {
    background: #240202;
    background:
        radial-gradient(
            ellipse 180% 110% at top center,
            rgba(255, 120, 120, 0.40) 0%,
            rgba(180, 60, 60, 0.20) 28%,
            rgba(90, 20, 20, 0.04) 55%,
            rgba(0,0,0,0) 75%
        ),
        linear-gradient(
            180deg,
            #5f1414 0%,
            #482020 45%,
            #2f0808 100%
        );
}
[data-xjmbg=xjmBG1] #xjmFooter {
    background: #240202;
}

/* =========================================================
   xjmBG2 = BLUE
========================================================= */
[data-xjmbg=xjmBG2] .xjmCard, [data-xjmbg=xjmBG2] .xjmCardBody {
    background: linear-gradient(to top right, #c3d0db 0%, #ffffff 50%, #ffffff 100%);
}
[data-xjmbg=xjmBG2] .sidebar-wrapper, [data-xjmbg=xjmBG2] .navbar {
    background: #081b30;
    background: radial-gradient(ellipse 180% 110% at top center, rgba(85, 120, 255, 0.42) 0%, rgba(50, 80, 200, 0.20) 28%, rgba(20, 35, 90, 0.04) 55%, rgba(0, 0, 0, 0) 75%), linear-gradient(180deg, #14395f 0%, #0c3048 45%, #081a2f 100%);
}
[data-xjmbg=xjmBG2] #xjmFooter {
    background: #081b30;
}

/* =========================================================
   xjmBG3 = GREEN
========================================================= */
[data-xjmbg=xjmBG3] .xjmCard {
    background: linear-gradient(to top right, #c7ddc7 0%, #ffffff 50%, #ffffff 100%);
}
[data-xjmbg=xjmBG3] .sidebar-wrapper,
[data-xjmbg=xjmBG3] .navbar {
    background: #102818;
    background:
        radial-gradient(
            ellipse 180% 110% at top center,
            rgba(120, 255, 170, 0.35) 0%,
            rgba(50, 170, 90, 0.18) 28%,
            rgba(20, 70, 35, 0.04) 55%,
            rgba(0,0,0,0) 75%
        ),
        linear-gradient(
            180deg,
            #145f38 0%,
            #10482c 45%,
            #081f16 100%
        );
}
[data-xjmbg=xjmBG3] #xjmFooter {
    background: #102818;
}

/* =========================================================
   xjmBG4 = BROWN
========================================================= */
[data-xjmbg=xjmBG4] .xjmCard {
    background: linear-gradient(to top right, #e7d9bc 0%, #ffffff 50%, #ffffff 100%);
}
[data-xjmbg=xjmBG4] .sidebar-wrapper,
[data-xjmbg=xjmBG4] .navbar {
    background: #2d2416;
    background:
        radial-gradient(
            ellipse 180% 110% at top center,
            rgba(255, 210, 120, 0.35) 0%,
            rgba(190, 140, 50, 0.18) 28%,
            rgba(90, 65, 20, 0.04) 55%,
            rgba(0,0,0,0) 75%
        ),
        linear-gradient(
            180deg,
            #6a5120 0%,
            #4d3918 45%,
            #24180a 100%
        );
}
[data-xjmbg=xjmBG4] #xjmFooter {
    background: #2d2416;
}

/* =========================================================
   xjmBG5 = ORANGE / PEACH
========================================================= */
[data-xjmbg=xjmBG5] .xjmCard {
    background: linear-gradient(to top right, #f1d5bf 0%, #ffffff 50%, #ffffff 100%);
}
[data-xjmbg=xjmBG5] .sidebar-wrapper,
[data-xjmbg=xjmBG5] .navbar {
    background: #2f1d10;
    background:
        radial-gradient(
            ellipse 180% 110% at top center,
            rgba(255, 180, 120, 0.38) 0%,
            rgba(210, 110, 50, 0.20) 28%,
            rgba(90, 45, 15, 0.04) 55%,
            rgba(0,0,0,0) 75%
        ),
        linear-gradient(
            180deg,
            #6a3418 0%,
            #4d2714 45%,
            #241208 100%
        );
}
[data-xjmbg=xjmBG5] #xjmFooter {
    background: #2f1d10;
}

/* =========================================================
   xjmBG6 = PURPLE
========================================================= */
[data-xjmbg=xjmBG6] .xjmCard {
    background: linear-gradient(to top right, #ebd5ec 0%, #ffffff 50%, #ffffff 100%);
}
[data-xjmbg=xjmBG6] .sidebar-wrapper,
[data-xjmbg=xjmBG6] .navbar {
    background: #241028;
    background:
        radial-gradient(
            ellipse 180% 110% at top center,
            rgba(220, 140, 255, 0.38) 0%,
            rgba(140, 70, 200, 0.20) 28%,
            rgba(60, 20, 90, 0.04) 55%,
            rgba(0,0,0,0) 75%
        ),
        linear-gradient(
            180deg,
            #4a1c68 0%,
            #35164d 45%,
            #180824 100%
        );
}
[data-xjmbg=xjmBG6] #xjmFooter {
    background: #241028;
}

/* LETTER SPACING CSS */
.ls-1 { letter-spacing: 0.5px; }
.ls-2 { letter-spacing: 1px; }
.ls-3 { letter-spacing: 1.5px; }
.ls-4 { letter-spacing: 2px; }

#xjmClientHero,
#xjmContainer {
    will-change: opacity;
    backface-visibility: hidden;
    transform: translateZ(0);
}
#xjmContainer {
    transition: opacity .25s ease, transform .25s ease;
}

#xjmClientActivityTabs .nav-link, #accountingTabs .nav-link {
    color: #212529 !important;
    padding: 0px;
    background-color: rgba(108, 117, 125, 0.1) !important;
}
#xjmClientActivityTabs .nav-link.active *, #accountingTabs .nav-link.active * {
    color: #ffffff !important;
}
#xjmClientActivityTabs .nav-link:focus,
#xjmClientActivityTabs .nav-link:hover,
#xjmClientActivityTabs .nav-pills .nav-link.active, 
#xjmClientActivityTabs .nav-pills .show>.nav-link, 
#accountingTabs .nav-link:hover,
#accountingTabs .nav-link.active, 
#accountingTabs .show>.nav-link {
    color: #ffffff !important;
    background-color: #1c47aa !important;
}

.xjm-activity-card {
    background: rgba(255,255,255,1);
    border-radius: var(--bs-border-radius) !important;
    border: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
    position: relative !important;
}
.badge {
    text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.3)!important;
    min-width: 85px;
}


/* FULL CALENDAR STYLING */
.fc table {
    background-color: #dfdfdf !important;
}
.fc .fc-list-event td {
    background-color: #dfdfdf !important;
    color: #000 !important;
}
.fc .fc-list-event:hover td {
    background-color: #f5f5f5 !important;
}
.fc-list-day-cushion.fc-theme-bootstrap5-shaded {
    background-color: #0c4802 !important;
    background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0)) !important;
}
.fc-list.fc-list-sticky.fc-listMonth-view.fc-view {
    border-radius: var(--bs-border-radius) !important;
    overflow: hidden !important;
}

.xjmActivityPopover {
    width: 300px !important;
    --bs-popover-max-width: 300px;
    --bs-popover-border-color: #444;
    --bs-popover-bg: #222;
    --bs-popover-header-bg: transparent; /* Set dynamically via JS */
    --bs-popover-header-color: #fff;
    --bs-popover-body-color: #eee;
    box-shadow: 0 8px 25px rgba(0,0,0,0.5);
    border: 1px solid #444 !important;
}
.xjmActivityPopover .popover-header {
    border-bottom: 1px solid rgba(255,255,255,0.1);
    text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
}
.xjmActivityPopover .popover-body {
    background-color: transparent !important;
    color: #eee !important;
}
.xjmLegendChevron.rotated,
.xjmClientTechInfoChevron.rotated {
    transform: rotate(180deg);
}

.tox-tinymce {
    border-radius: 5px !important;
}

/* Icon Loader Container */
#shadowbox-loader-container {
    display: none; /* Initially hidden */
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6); /* Slightly lighter backdrop */
    backdrop-filter: blur(5px); /* Premium blur effect */
    -webkit-backdrop-filter: blur(5px);
    z-index: 10000; /* Ensure it stays above modals (BS modals use 1050+) */
}
#shadowbox-loader { /* Infinity Loader Graphic */
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); /* Center horizontally & vertically */
}
/* Icon Loader Container */


.xjm-rounded-table {
    border: 1px solid #aaa;
    border-radius: 7px;
    overflow: hidden;
    background-color: #212529; /* matches dark invoice row */
}

.xjm-rounded-table .table {
    border: 0;
    margin-bottom: 0 !important;
    border-collapse: collapse;
}

.xjm-rounded-table .table thead tr:first-child th {
    border-top: 0;
}

.xjm-rounded-table .table tr th:first-child,
.xjm-rounded-table .table tr td:first-child {
    border-left: 0;
}

.xjm-rounded-table .table tr th:last-child,
.xjm-rounded-table .table tr td:last-child {
    border-right: 0;
}

.xjm-rounded-table .table tbody tr:last-child td {
    border-bottom: 0 !important;
}

.xjm-rounded-table thead th {
    border-bottom-color: #aaa !important;
}


.table-maroon {
    --bs-table-color: #000;
    --bs-table-bg: #800000;
    --bs-table-border-color: #dfc2c4;
    --bs-table-striped-bg: #eccccf;
    --bs-table-striped-color: #000;
    --bs-table-active-bg: #800000;
    --bs-table-active-color: #000;
    --bs-table-hover-bg: #800000;
    --bs-table-hover-color: #000;
    color: var(--bs-table-color);
    border-color: var(--bs-table-border-color);
}