/* WMKG Custom Theme Colors */
/* Update these colors based on your logo */

:root {
    /* Primary Colors - Orange from logo (replaces purple/blue) */
    --bs-primary: #FF6B35 !important;
    --bs-primary-rgb: 255, 107, 53 !important;
    --bs-primary-subtle: rgba(255, 107, 53, 0.1) !important;
    
    /* Secondary Colors */
    --bs-secondary: #6c757d;
    --bs-secondary-rgb: 108, 117, 125;
    
    /* Success, Warning, Danger, Info - Keep or adjust */
    --bs-success: #13deb9;
    --bs-warning: #ffae1f;
    --bs-danger: #fa896b;
    --bs-info: #539bff;
    
    /* Sidebar Background */
    --sidebar-bg: #ffffff;
    --sidebar-text: #2a3547;
    
    /* Dark mode adjustments */
    --dark-sidebar-bg: #2a3547;
    --dark-sidebar-text: #ffffff;
}

/* Dark Mode Colors */
[data-bs-theme="dark"] {
    --bs-primary: #FF8C42 !important;
    --bs-primary-subtle: rgba(255, 140, 66, 0.15) !important;
    --sidebar-bg: #2a3547;
    --sidebar-text: #ffffff;
}

/* Logo visibility based on theme */
[data-bs-theme="light"] .light-logo {
    display: none !important;
}

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

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

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

/* Preloader logo */
.preloader img {
    max-height: 50px;
}

/* Custom brand colors - Adjust based on your logo */
.bg-primary {
    background-color: var(--bs-primary) !important;
}

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

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

.btn-primary:hover {
    background-color: #E55100;
    border-color: #E55100;
}

/* Badge primary */
.badge.bg-primary {
    background-color: var(--bs-primary) !important;
}

/* Links */
a.text-primary:hover {
    color: rgba(30, 136, 229, 0.8) !important;
}

/* Sidebar active state */
.sidebar-item .sidebar-link.active {
    background-color: var(--bs-primary-subtle);
    color: var(--bs-primary);
}

/* Mini nav active state */
.mini-nav-item.active {
    background-color: var(--bs-primary-subtle);
    border-left: 3px solid var(--bs-primary);
}

.mini-nav-item.active a {
    color: var(--bs-primary) !important;
}

/* Sidebar item parent active state */
.sidebar-item.active > .sidebar-link {
    background-color: var(--bs-primary-subtle);
    color: var(--bs-primary);
}

/* 
INSTRUCTIONS TO UPDATE COLORS:
1. Open your logo.png in an image editor or color picker
2. Extract the main colors (primary, secondary, accent)
3. Update the CSS variables above with your logo colors
4. Replace the hex values in --bs-primary and related variables

Example:
If your logo main color is #FF5722 (orange):
    --bs-primary: #FF5722;
    --bs-primary-rgb: 255, 87, 34;
    --bs-primary-subtle: rgba(255, 87, 34, 0.1);
*/