:root {
    --brand-red: #BE1918;
    --brand-blue: #254B93;
    --brand-yellow: #FEDA36;
    --brand-green: #499E44;
    --text-color: #999999;
}

/* Base styles for Light Mode */
body {
    color: var(--text-color);
}

/* Override EasyAdmin / Bootstrap Primary Colors for Light Mode */
:root {
    --primary: var(--brand-red);
    --accent: var(--brand-blue);
}

/* Ensure buttons use brand red */
.btn-primary {
    background-color: var(--brand-red) !important;
    border-color: var(--brand-red) !important;
    color: #fff !important;
}

.btn-primary:hover, .btn-primary:focus {
    background-color: #a01514 !important;
    border-color: #a01514 !important;
}

/* Link and other elements */
a {
    color: var(--brand-blue);
}

a:hover {
    color: var(--brand-red);
}

.content-header .title, .main-header .navbar-brand {
    color: var(--brand-blue) !important;
}

/* Sidebar and Brand Area adjustments */
.sidebar {
    background-color: var(--sidebar-bg) !important;
}

.sidebar-brand {
    background-color: var(--sidebar-brand-bg) !important;
    padding: 10px 15px;
}

.sidebar .menu-item, .sidebar .menu-header, .sidebar-brand-title {
    color: var(--sidebar-text) !important;
}

.sidebar .menu-item:hover {
    background-color: var(--sidebar-menu-hover-bg) !important;
    color: var(--brand-yellow) !important;
}

.sidebar .menu-item.active {
    /*background-color: var(--brand-blue) !important;*/
    color: #ffffff !important;
}

/* Logo styling */
.main-header .navbar-brand .logo, .sidebar-brand .logo {
    display: flex;
    align-items: center;
    height: 40px;
    overflow: visible; /* Prevent cutting off */
}

.main-header .navbar-brand .logo img, .sidebar-brand .logo img {
    height: 35px; /* Slightly smaller than container to prevent clipping */
    width: auto;
    margin-right: 10px;
}
/* Theme-specific logo handling */
/* By default, hide both. We will show the correct one based on the theme. */
.logo-dark, .logo-light {
    display: none !important;
}

/* Light Mode: Show light logo when data-bs-theme is NOT dark or explicitly light */
[data-bs-theme=light] .logo-light {
    display: inline-block !important;
}
[data-bs-theme=light] .logo-dark {
    display: none !important;
}

/* Dark Mode: Show dark logo when data-bs-theme is dark */
[data-bs-theme=dark] .logo-dark {
    display: inline-block !important;
}
[data-bs-theme=dark] .logo-light {
    display: none !important;
}

/* Light Mode Sidebar (Default) */
:root {
    --sidebar-bg: #f8f9fa;
    --sidebar-brand-bg: #ffffff;
    --sidebar-text: #333333;
    --sidebar-menu-hover-bg: rgba(0, 0, 0, 0.05);
}

/* Dark Mode Overrides */
[data-bs-theme='dark'] {
    --sidebar-bg: #1e1e1e;
    --sidebar-brand-bg: #121212;
    --sidebar-text: #ffffff;
    --sidebar-menu-hover-bg: rgba(255, 255, 255, 0.1);
    --primary: var(--brand-red);
}

[data-bs-theme='dark'] .btn-primary {
    background-color: var(--brand-red) !important;
    border-color: var(--brand-red) !important;
}