html:not(.dark-style) {
    --bg-side: #FFF !important;
    --border-rgba-color: 243, 243, 243, 1;
    --shadow: 0,0,0,.1
}

html.dark-style .logo-light {
    display: none;
}

html:not(.dark-style) .logo-dark {
    display: none;
}

html {
    --bg-side: #000 !important;
    --border-rgba-color: 255, 255, 255, 0.1;
    --shadow: 255,255,255,.1
}

    html.dark-style body {
        background: rgb(14,14,14) !important;
    }

.bg-menu-theme, #layout-menu {
    background-color: var(--bg-side) !important;
    border-inline-end: 1px solid rgba(var(--border-rgba-color)) !important
}

.app-brand {
    border-bottom: 1px solid rgba(var(--border-rgba-color)) !important
}

.content-footer {
    background-color: var(--bg-side) !important;
    box-shadow: 0 .25rem 1rem rgba(var(--shadow)) !important;
}

.layout-navbar {
    background-color: var(--bg-side) !important;
    border-radius: 0 !important;
    border-bottom: 1px solid rgba(var(--border-rgba-color)) !important
}

.layout-navbar-fixed .layout-navbar.navbar-detached {
    width: calc(100% - 16.25rem) !important;
    padding-inline: 1rem !important;
}

.layout-navbar-fixed.layout-menu-collapsed .layout-navbar.navbar-detached {
    width: calc(100% - 5rem) !important;
    padding-inline: 1rem !important;
}

@media (max-width: 991.98px) {
    #layout-navbar {
        width: 100% !important;
        padding-inline: 1rem !important;
    }
}

@media (max-width: 1199.98px) {
    #layout-navbar {
        width: calc(100% ) !important;
        padding-inline: 1rem !important;
    }
}


select.is-invalid + .dropdown-toggle {
    border-color: #ff4d49 !important; /* Adjust border color */
    border-width: 2px !important; /* Adjust border width */
}

.disabled {
    pointer-events: none; /* Prevent interaction */
    opacity: 0.5; /* Visual indication of being disabled */
}

.template-customizer-open-btn{
    display: none !important;
}

.bg-orange {
    background-color: orange;
}

.bg-label-orange {
    background-color: orange;
}

[dir="rtl"] .bootstrap-select .dropdown-toggle .filter-option{
    margin-left: unset !important;
}

@media (min-width: 768px) {
    .w-md-50 {
        width: 50% !important;
    }
}

.overflow-y-auto{
    overflow-y : auto !important;
}

.filter-option-inner-inner {
    text-transform: initial !important;
}

.footer-platform-image{
    max-height : 20px;
}