:root {
    --dx-primary: #ea3939;
    --dx-primary-rgb: 234, 57, 57;
    --dx-primary-text-emphasis: #c62828;
    --dx-primary-bg-subtle: rgba(234, 57, 57, 0.15);
    --dx-primary-border-subtle: rgba(234, 57, 57, 0.3);
    --dx-link-color: #ea3939;
    --dx-link-color-rgb: 234, 57, 57;
    --dx-link-hover-color: #c62828;
    --dx-link-hover-color-rgb: 198, 40, 40;
    --dx-focus-ring-color: rgba(234, 57, 57, 0.25);
    --dx-sidebar-bg: #0b0b0b;
    --dx-sidebar-border: #1f1f1f;
    --dx-sidebar-menu-title: #bdbdbd;
    --dx-sidebar-link-color: #f5f5f5;
    --dx-sidebar-link-hover-color: #ea3939;
    --dx-sidebar-link-active-color: #ffffff;
    --dx-sidebar-link-bg-hover-color: rgba(234, 57, 57, 0.16);
    --dx-sidebar-link-bg-active-color: rgba(234, 57, 57, 0.22);
    --dx-sidebar-link-sub-color: #e0e0e0;
    --dx-sidebar-link-sub-hover-color: #ea3939;
    --dx-sidebar-link-sub-active-color: #ffffff;
    --dx-sidebar-link-sub-effect-color: rgba(255, 255, 255, 0.06);
}

/* White background: show logo-sm */
.logos .logo-dark {
    display: inline-block;
}

.logos .logo-light {
    display: none;
}

/* Sidebar black background: show logo-red */
.main-sidebar .navbar-brand .logo-dark {
    display: none !important;
}

.main-sidebar .navbar-brand .logo-light {
    display: inline-block !important;
}

/* Top navbar: light theme white, dark theme black */
.main-topbar {
    background-color: #ffffff !important;
    border-color: #e5e7eb !important;
}

.main-topbar .topbar-link,
.main-topbar .sidebar-toggle,
.main-topbar .navbar-search .icon {
    color: #202322 !important;
}

.main-topbar,
.main-topbar .text-body,
.main-topbar .text-muted,
.main-topbar .dropdown-toggle,
.main-topbar .btn,
.main-topbar .dropdown-item,
.main-topbar .navbar-search input {
    color: #202322 !important;
}

.main-topbar .navbar-search input::placeholder {
    color: #475569 !important;
}

/* Topbar dropdown icons (light: black, dark: white) */
.main-topbar .dropdown-toggle::after,
.main-topbar .dropdown .dropdown-toggle i,
.main-topbar .dropdown .dropdown-toggle svg {
    color: #202322 !important;
}

.main-topbar .dropdown-toggle::after {
    border-top-color: #202322 !important;
    border-right-color: transparent !important;
    border-left-color: transparent !important;
}

/* Topbar profile text (light mode) */
.main-topbar .profile-dropdown .dropdown-toggle .pr-name,
.main-topbar .profile-dropdown .dropdown-toggle .pr-desc,
.main-topbar .profile-dropdown .dropdown-toggle small,
.main-topbar .profile-dropdown .dropdown-toggle .text-muted {
    color: #202322 !important;
}

[data-bs-theme="dark"] .main-topbar {
    background-color: #0b0b0b !important;
    border-color: #1f1f1f !important;
}

[data-bs-theme="dark"] .main-topbar .topbar-link,
[data-bs-theme="dark"] .main-topbar .sidebar-toggle,
[data-bs-theme="dark"] .main-topbar .navbar-search .icon {
    color: #f5f5f5 !important;
}

[data-bs-theme="dark"] .main-topbar,
[data-bs-theme="dark"] .main-topbar .text-body,
[data-bs-theme="dark"] .main-topbar .text-muted,
[data-bs-theme="dark"] .main-topbar .dropdown-toggle,
[data-bs-theme="dark"] .main-topbar .btn,
[data-bs-theme="dark"] .main-topbar .dropdown-item,
[data-bs-theme="dark"] .main-topbar .navbar-search input {
    color: #f5f5f5 !important;
}

[data-bs-theme="dark"] .main-topbar .navbar-search input::placeholder {
    color: #cbd5e1 !important;
}

[data-bs-theme="dark"] .main-topbar .dropdown-toggle::after,
[data-bs-theme="dark"] .main-topbar .dropdown .dropdown-toggle i,
[data-bs-theme="dark"] .main-topbar .dropdown .dropdown-toggle svg {
    color: #f5f5f5 !important;
}

[data-bs-theme="dark"] .main-topbar .dropdown-toggle::after {
    border-top-color: #f5f5f5 !important;
    border-right-color: transparent !important;
    border-left-color: transparent !important;
}

/* Topbar profile text (dark mode) */
[data-bs-theme="dark"] .main-topbar .profile-dropdown .dropdown-toggle .pr-name,
[data-bs-theme="dark"] .main-topbar .profile-dropdown .dropdown-toggle .pr-desc,
[data-bs-theme="dark"] .main-topbar .profile-dropdown .dropdown-toggle small,
[data-bs-theme="dark"] .main-topbar .profile-dropdown .dropdown-toggle .text-muted {
    color: #f5f5f5 !important;
}

/* Topbar logo switch by theme */
.main-topbar .logos .logo-dark {
    display: inline-block !important;
}

.main-topbar .logos .logo-light {
    display: none !important;
}

[data-bs-theme="dark"] .main-topbar .logos .logo-dark {
    display: none !important;
}

[data-bs-theme="dark"] .main-topbar .logos .logo-light {
    display: inline-block !important;
}

/* Login page logo: centered above form and bigger */
.auth-wrapper .login-brand {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}

.auth-wrapper .login-brand img {
    width: clamp(140px, 28vw, 220px);
    height: auto;
    object-fit: contain;
}

/* Sidebar red logo: increase size and keep it crisp */
.main-sidebar .navbar-brand .logo-lg img,
.main-sidebar .navbar-brand .logo-sm img {
    width: auto;
    height: auto;
    object-fit: contain;
}

.main-sidebar .navbar-brand .logo-lg img.logo-light {
    max-height: 42px;
    height: 42px !important;
    /*margin-right:10px;*/
    margin:2px;
}

.main-sidebar .navbar-brand .logo-sm img.logo-light {
    max-height: 34px;
    height: 34px !important;
}

/* Collapsed sidebar (data-sidebar="small"): prevent logo overlap/white half */
html[data-sidebar="small"] .main-sidebar .navbar-brand,
body[data-sidebar="small"] .main-sidebar .navbar-brand {
    /*overflow: hidden;*/
    /*padding-top: 8px !important;*/
    /*padding-bottom: 8px !important;   */
    /*padding-left: 8px !important;*/
    
    overflow: hidden;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    /*padding-left: 8px !important;*/
    max-height: 22px;
    height: 25px !important;
}

html[data-sidebar="small"] .main-sidebar .navbar-brand .logo-lg,
body[data-sidebar="small"] .main-sidebar .navbar-brand .logo-lg {
    display: none !important;
}

html[data-sidebar="small"] .main-sidebar .navbar-brand .logo-sm,
body[data-sidebar="small"] .main-sidebar .navbar-brand .logo-sm {
    display: block !important;
}

html[data-sidebar="small"] .main-sidebar .navbar-brand .logo-dark,
body[data-sidebar="small"] .main-sidebar .navbar-brand .logo-dark {
    display: none !important;
}

html[data-sidebar="small"] .main-sidebar .navbar-brand .logo-light,
body[data-sidebar="small"] .main-sidebar .navbar-brand .logo-light {
    display: inline-block !important;
}

/* Sidebar icons: make them slightly bigger */
.main-sidebar .nav-link .icons i,
.main-sidebar .nav-link .icons svg {
    font-size: 20px;
    width: 20px;
    height: 20px;
}

.main-sidebar .nav-link .icons {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 26px;
}

/* Mobile View: Ensure full width and reset any constraints */
@media (max-width: 991.98px) {
    .main-topbar {
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        margin: 0 !important;
        z-index: 1001 !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
    }
    
    .main-topbar .navbar-brand {
        padding-left: 0 !important;
        margin-right: 0 !important;
    }
}