/* Flexbox Header Refactor */
#header.flex-header, header {
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center !important;
    width: 100% !important;
    padding: 0 10px !important;
    box-sizing: border-box !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 9998 !important;
}
.header-zone {
    display: flex !important;
    align-items: center !important;
    height: 100% !important;
    position: static !important;
}
.header-left {
    flex: 1 1 0% !important;
    justify-content: flex-start !important;
}
.header-center {
    flex: 0 0 auto !important; 
    justify-content: center !important;
}
.header-right {
    flex: 1 1 0% !important;
    justify-content: flex-end !important;
    display: flex !important;
    align-items: center !important;
}

#logo-group {
    width: auto !important;
    margin: 0 !important;
    float: none !important;
    position: static !important; 
    display: flex !important;
    align-items: center !important;
}

#logo {
    display: inline-block !important;
    margin: 0 !important;
    width: auto !important;
}

#hide-menu {
    float: none !important;
    position: static !important;
    margin-right: 15px !important;
}

.theme-switcher {
    float: none !important;
    position: static !important;
    margin-right: 15px !important;
    font-size: 18px !important;
    display: flex !important;
    align-items: center !important;
}

#hide-menu span, .theme-switcher span {
    display: flex !important;
    align-items: center !important;
}

#top-right, .top-right-wrapper, #top-right .pull-right {
    display: flex !important;
    align-items: center !important;
    float: none !important;
    position: static !important;
    margin: 0 !important;
}

/* Sidebar Overlay Refactor Instead of Content Push */
body #main, body.minified #main, body.hidden-menu #main, #main[role="main"] {
    margin-left: 0 !important;
    padding-left: 0 !important;
    padding-top: 49px !important; /* Protects content below fixed header */
}
#left-panel {
    position: fixed !important;
    z-index: 9999 !important;
    top: 49px !important;
    left: 0 !important;
    height: calc(100vh - 49px) !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    transition: transform 0.2s ease-in-out !important;
    display: block !important;
    transform: translateX(-100%) !important;
    box-sizing: border-box !important;
    scrollbar-width: none !important; /* Firefox */
    -ms-overflow-style: none !important; /* IE/Edge */
}
#left-panel::-webkit-scrollbar {
    display: none !important; /* Chrome/Safari */
    width: 0 !important;
}
/* Prevent nested smartadmin defaults from forcing scrollbars */
#left-panel nav, #left-panel ul {
    overflow: hidden !important;
}
/* Reconfigure appended collapse icons to sit adjacent to text as [+] */
#left-panel nav ul li a b.collapse-sign {
    position: static !important;
    float: none !important;
    display: inline-block !important;
    margin-left: 8px !important;
}
#left-panel nav ul li a b.collapse-sign em {
    display: none !important;
}
#left-panel nav ul li a b.collapse-sign::before {
    content: '[+]' !important;
    font-weight: bold;
}
#left-panel nav ul li.open > a > b.collapse-sign::before {
    content: '[-]' !important;
}
body.ceelho-menu-open #left-panel {
    transform: translateX(0) !important;
}



/* Simple Light/Dark Theme Variable System */
:root {
    --bg-color: #ffffff;
    --text-color: #333333;
    --header-bg: #f3f3f3;
    --panel-bg: #2d3135;
    --card-bg: #ffffff;
    --border-color: #cccccc;
    --accent-color: #0056b3;
    --danger-color: #cc0000;
}

html[data-theme='dark'] {
    --bg-color: #222222;
    --text-color: #f1f1f1;
    --header-bg: #1c1c1c;
    --panel-bg: #111111;
    --card-bg: #2d2d2d;
    --border-color: #444444;
    --accent-color: #4da6ff;
    --danger-color: #ff6666;
}

body, html, #main, body.smart-style-0, body.smart-style-1, body.smart-style-2, body.smart-style-3, body.smart-style-4, body.smart-style-5, body.smart-style-6 {
    background-color: var(--bg-color) !important;
    background-image: none !important;
    color: var(--text-color) !important;
}

/* Archive Page Fluid Grid */
.responsive-archive-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    width: 100%;
}

@media (max-width: 992px) {
    .responsive-archive-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 576px) {
    .responsive-archive-grid {
        grid-template-columns: 1fr;
    }
}

.responsive-archive-card {
    background-color: var(--card-bg) !important;
    border: 1px solid var(--border-color) !important;
    padding: 15px;
    border-radius: 8px;
    text-align: center;
}

/* Fix inline hardcoded colors for Dark Theme */
[style*="color:blue"], [style*="color: blue"], .list__label, .sect-1-dash {
    color: var(--accent-color) !important;
}

[style*="color:red"], [style*="color: red"] {
    color: var(--danger-color) !important;
}

/* Dashboard Container Fixes for Dark Theme */
html[data-theme='dark'] .container-dash {
    background-color: transparent !important;
}

html[data-theme='dark'] .horizontal-scroll {
    background-color: var(--panel-bg) !important;
    border-color: var(--border-color) !important;
}

html[data-theme='dark'] .gray-box {
    background-color: var(--card-bg) !important;
    border-color: var(--border-color) !important;
}

html[data-theme='dark'] .list-view-name {
    color: var(--text-color) !important;
}