/* Econt Status Column - Prevent long status text from making columns too wide */
.econt-status-text {
    max-width: 400px;
    word-wrap: break-word;
    white-space: normal;
    display: inline-block;
}

/* AdminLTE Timeline Styles */
.timeline {
    position: relative;
    margin: 0 0 30px 0;
    padding: 0;
    list-style: none;
}

.timeline:before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    width: 4px;
    background: #ddd;
    left: 31px;
    margin: 0;
}

.timeline > li {
    position: relative;
    margin-right: 10px;
    margin-bottom: 15px;
}

.timeline > li:before,
.timeline > li:after {
    content: " ";
    display: table;
}

.timeline > li:after {
    clear: both;
}

.timeline > li > .timeline-item {
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
    border-radius: 3px;
    margin-top: 0;
    background: #fff;
    color: #444;
    margin-left: 60px;
    margin-right: 15px;
    padding: 0;
    position: relative;
}

.timeline > li > .timeline-item > .time {
    color: #999;
    float: right;
    padding: 10px;
    font-size: 12px;
}

.timeline > li > .timeline-item > .timeline-header {
    margin: 0;
    color: #555;
    border-bottom: 1px solid #f4f4f4;
    padding: 10px;
    font-size: 16px;
    line-height: 1.1;
}

.timeline > li > .timeline-item > .timeline-body {
    padding: 10px;
}

.timeline > li > .fa,
.timeline > li > .fas,
.timeline > li > .far,
.timeline > li > .fab,
.timeline > li > .ion {
    width: 30px;
    height: 30px;
    font-size: 15px;
    line-height: 30px;
    position: absolute;
    color: #666;
    background: #d2d6de;
    border-radius: 50%;
    text-align: center;
    left: 18px;
    top: 0;
}

/* Fix for Bootstrap 5 btn-close in Bootstrap 4/AdminLTE environment */
.btn-close {
    box-sizing: content-box;
    width: 1em;
    height: 1em;
    padding: 0.25em 0.25em;
    color: #000;
    background: transparent;
    border: 0;
    border-radius: 0.25rem;
    opacity: 0.5;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1;
}

.btn-close:hover {
    color: #000;
    text-decoration: none;
    opacity: 0.75;
}

.btn-close:focus {
    outline: 0;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
    opacity: 1;
}

/* Only add × if button is empty (no span inside) */
.btn-close:empty::before {
    content: "×";
    display: block;
}

/* ============================================
   CUSTOM MODERN COLOR THEME OVERRIDES
   Using CSS Variables for easy maintenance
   Tailwind-inspired modern colors (2025)
   ============================================ */

:root {
    /* Base Theme Variables */
    --lte-dark: #0f172a;
    --lte-border-color: #e2e8f0;
    --lte-bg: #f4f6f9;
    
    /* Primary Colors - Modern Vibrant Blue (Tailwind Blue-500) */
    --color-primary: #3b82f6;
    --color-primary-hover: #2563eb;
    
    /* Success - Emerald Green (Tailwind Emerald-500) */
    --color-success: #10b981;
    --color-success-hover: #059669;
    
    /* Info - Sky Blue (Tailwind Sky-500) */
    --color-info: #0ea5e9;
    --color-info-hover: #0284c7;
    
    /* Warning - Amber (Tailwind Amber-500) */
    --color-warning: #f59e0b;
    --color-warning-hover: #d97706;
    
    /* Danger - Rose Red (Tailwind Red-500) */
    --color-danger: #ef4444;
    --color-danger-hover: #dc2626;
    
    /* Secondary - Slate Gray (Tailwind Slate-500) */
    --color-secondary: #64748b;
    --color-secondary-hover: #475569;
    
    /* Linking LTE vars to our theme vars for consistency */
    --lte-primary: var(--color-primary);
    --lte-secondary: var(--color-secondary);
    --lte-success: var(--color-success);
    --lte-danger: var(--color-danger);
    --lte-warning: var(--color-warning);
}

body {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Helvetica Neue', Arial, sans-serif;
    background-color: var(--lte-bg);
    color: #334155;
}

/* Primary Color - Modern Blue */
.bg-primary,
.btn-primary,
.badge-primary {
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
    color: #ffffff !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    background-color: var(--color-primary-hover) !important;
    border-color: var(--color-primary-hover) !important;
    color: #ffffff !important;
}

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

/* Success Color - Modern Green */
.bg-success,
.btn-success,
.badge-success {
    background-color: var(--color-success) !important;
    border-color: var(--color-success) !important;
    color: #ffffff !important;
}

.btn-success:hover,
.btn-success:focus {
    background-color: var(--color-success-hover) !important;
    border-color: var(--color-success-hover) !important;
    color: #ffffff !important;
}

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

/* Info Color - Modern Sky */
.bg-info,
.btn-info,
.badge-info {
    background-color: var(--color-info) !important;
    border-color: var(--color-info) !important;
    color: #ffffff !important;
}

.btn-info:hover,
.btn-info:focus {
    background-color: var(--color-info-hover) !important;
    border-color: var(--color-info-hover) !important;
    color: #ffffff !important;
}

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

/* Warning Color - Modern Amber */
.bg-warning,
.btn-warning,
.badge-warning {
    background-color: var(--color-warning) !important;
    border-color: var(--color-warning) !important;
    color: #ffffff !important;
}

.btn-warning:hover,
.btn-warning:focus {
    background-color: var(--color-warning-hover) !important;
    border-color: var(--color-warning-hover) !important;
    color: #ffffff !important;
}

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

/* Danger Color - Modern Red */
.bg-danger,
.btn-danger,
.badge-danger {
    background-color: var(--color-danger) !important;
    border-color: var(--color-danger) !important;
    color: #ffffff !important;
}

.btn-danger:hover,
.btn-danger:focus {
    background-color: var(--color-danger-hover) !important;
    border-color: var(--color-danger-hover) !important;
    color: #ffffff !important;
}

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

/* Secondary Color - Modern Slate */
.bg-secondary,
.btn-secondary,
.badge-secondary {
    background-color: var(--color-secondary) !important;
    border-color: var(--color-secondary) !important;
    color: #ffffff !important;
}

.btn-secondary:hover,
.btn-secondary:focus {
    background-color: var(--color-secondary-hover) !important;
    border-color: var(--color-secondary-hover) !important;
    color: #ffffff !important;
}

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

/* Card Headers - Modern backgrounds */
.card-primary .card-header {
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
}

.card-success .card-header {
    background-color: var(--color-success) !important;
    border-color: var(--color-success) !important;
}

.card-info .card-header {
    background-color: var(--color-info) !important;
    border-color: var(--color-info) !important;
}

.card-warning .card-header {
    background-color: var(--color-warning) !important;
    border-color: var(--color-warning) !important;
}

.card-danger .card-header {
    background-color: var(--color-danger) !important;
    border-color: var(--color-danger) !important;
}

/* Alert boxes - Modern Subtle Backgrounds (Tailwind-inspired) */
.alert-primary {
    background-color: #eff6ff !important; /* Blue-50 */
    border-color: #bfdbfe !important;     /* Blue-200 */
    color: #1e40af !important;            /* Blue-800 */
}

.alert-success {
    background-color: #ecfdf5 !important; /* Emerald-50 */
    border-color: #a7f3d0 !important;     /* Emerald-200 */
    color: #065f46 !important;            /* Emerald-800 */
}

.alert-info {
    background-color: #f0f9ff !important; /* Sky-50 */
    border-color: #bae6fd !important;     /* Sky-200 */
    color: #075985 !important;            /* Sky-800 */
}

.alert-warning {
    background-color: #fffbeb !important; /* Amber-50 */
    border-color: #fde68a !important;     /* Amber-200 */
    color: #92400e !important;            /* Amber-800 */
}

.alert-danger {
    background-color: #fef2f2 !important; /* Red-50 */
    border-color: #fecaca !important;     /* Red-200 */
    color: #991b1b !important;            /* Red-800 */
}

/* ============================================
   SIDEBAR - MODERN SLATE THEME (2025)
   Deep slate with subtle gradients
   ============================================ */

/* Main sidebar - Deep slate gradient */
.main-sidebar {
    background: #0f172a !important;
    background: linear-gradient(180deg, #0f172a 0%, #1e293b 100%) !important;
    box-shadow: 4px 0 24px rgba(0, 0, 0, 0.05) !important;
    position: fixed !important;
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    z-index: 1050 !important; /* Ensure it stays above content */
    overflow: hidden !important; /* Prevent any overflow issues */
}

/* Sidebar scrolling fix for all resolutions */
.sidebar {
    overflow-y: auto !important;
    overflow-x: hidden !important;
    height: 100% !important;
    -webkit-overflow-scrolling: touch;
    display: flex !important;
    flex-direction: column !important;
    padding-bottom: 80px !important; /* Extra space at bottom for scrolling */
}

/* Custom scrollbar for sidebar */
.sidebar::-webkit-scrollbar {
    width: 6px;
}

.sidebar::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.02);
}

.sidebar::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.1);
    border-radius: 3px;
}

.sidebar::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.2);
}

/* Nav link default state - Light gray text */
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link {
    color: #cbd5e1 !important;
    border-radius: 8px !important;
    margin: 2px 10px !important;
    padding: 10px 15px !important;
    transition: all 0.2s ease !important;
    font-weight: 500 !important;
}

/* Nav icons - Subtle opacity */
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link .nav-icon {
    opacity: 0.7;
    transition: all 0.2s ease !important;
}

/* Hover state - Subtle highlight */
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link:hover {
    background-color: rgba(255, 255, 255, 0.05) !important;
    color: white !important;
}

.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link:hover .nav-icon {
    opacity: 1;
    color: #60a5fa !important;
}

/* Active state - Glowing blue */
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active {
    background: rgba(59, 130, 246, 0.15) !important;
    color: #60a5fa !important;
    font-weight: 600 !important;
}

.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active .nav-icon {
    color: #60a5fa !important;
    opacity: 1 !important;
}

/* Submenu items - Lighter text */
.sidebar-dark-primary .nav-treeview > .nav-item > .nav-link {
    color: #94a3b8 !important;
    font-size: 0.85rem !important;
    padding-left: 50px !important;
}

.sidebar-dark-primary .nav-treeview > .nav-item > .nav-link:hover {
    color: white !important;
    background-color: rgba(255, 255, 255, 0.03) !important;
}

.sidebar-dark-primary .nav-treeview > .nav-item > .nav-link.active {
    color: #60a5fa !important;
    background-color: rgba(59, 130, 246, 0.1) !important;
    font-weight: 500 !important;
}

/* Brand link area - Darker with subtle border */
.brand-link {
    background: #0f172a !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    padding: 1.5rem 1.5rem !important;
}

/* Menu section headers - Uppercase subtle */
.nav-header {
    color: #475569 !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    font-size: 0.75rem !important;
    letter-spacing: 1px !important;
    padding: 1rem 1.2rem 0.5rem 1.2rem !important;
}

/* Sidebar user panel */
.user-panel {
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
}

.user-panel .info {
    color: white !important;
}

/* Arrow icons - Point right by default, rotate down when expanded */
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link .right {
    transition: transform 0.2s ease !important;
}

.sidebar-dark-primary .nav-sidebar > .nav-item.menu-is-opening > .nav-link .right,
.sidebar-dark-primary .nav-sidebar > .nav-item.menu-open > .nav-link .right {
    transform: rotate(90deg) !important;
}

/* Mobile responsive - No changes needed, fixed positioning handles it */
@media (max-width: 768px) {
    /* Sidebar already uses fixed positioning with top:0 bottom:0 */
}

/* ============================================
   DARK MODE SUPPORT
   Ensure custom styles work with AdminLTE dark mode
   ============================================ */

/* Dark mode adjustments for custom sidebar */
.dark-mode .main-sidebar {
    background: linear-gradient(180deg, #0f172a 0%, #1e293b 100%) !important;
}

/* Dark mode - keep sidebar styles consistent */
.dark-mode .sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link {
    color: #cbd5e1 !important;
}

.dark-mode .sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link:hover {
    background-color: rgba(255, 255, 255, 0.05) !important;
    color: white !important;
}

.dark-mode .sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active {
    background: rgba(59, 130, 246, 0.15) !important;
    color: #60a5fa !important;
}

/* Dark mode - navbar adjustments */
.dark-mode .navbar-dark {
    background-color: #1e293b !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}

/* Dark mode - content background */
.dark-mode .content-wrapper {
    background-color: #0f172a !important;
}

/* Dark mode - cards */
.dark-mode .card {
    background-color: #1e293b !important;
    color: #cbd5e1 !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

.dark-mode .card-header {
    background-color: #334155 !important;
    border-bottom-color: rgba(255, 255, 255, 0.1) !important;
}

/* Dark mode - nested cards (for leaves and other nested structures) */
.dark-mode .card .card {
    background-color: #0f172a !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
}

/* Dark mode - card body backgrounds */
.dark-mode .card-body {
    background-color: transparent !important;
}

/* Dark mode - ensure white backgrounds become dark */
.dark-mode .bg-white {
    background-color: #1e293b !important;
    color: #e2e8f0 !important;
}

/* Dark mode - card headers with bg-white */
.dark-mode .card-header.bg-white {
    background-color: #334155 !important;
    color: #e2e8f0 !important;
}

/* Dark mode - department card headers specifically */
.dark-mode .dept-header.bg-white {
    background-color: #334155 !important;
}

.dark-mode .dept-header.bg-white .dept-title,
.dark-mode .dept-header.bg-white .font-weight-bold {
    color: #e2e8f0 !important;
}

/* Dark mode - tables */
.dark-mode .table {
    color: #cbd5e1 !important;
}

.dark-mode .table-hover tbody tr:hover {
    background-color: rgba(255, 255, 255, 0.05) !important;
}

/* Dark mode - footer */
.dark-mode .main-footer {
    background-color: #1e293b !important;
    border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: #94a3b8 !important;
}

/* Dark mode - small info boxes (dashboard cards) - Override AdminLTE gradients */
.dark-mode .info-box,
.dark-mode .small-box {
    opacity: 0.9 !important;
}

.dark-mode .bg-gradient-info,
.dark-mode .info-box.bg-gradient-info,
.dark-mode .small-box.bg-gradient-info {
    background: #0e7490 !important; /* Darker cyan - no gradient */
}

.dark-mode .bg-gradient-success,
.dark-mode .info-box.bg-gradient-success,
.dark-mode .small-box.bg-gradient-success {
    background: #047857 !important; /* Darker green - no gradient */
}

.dark-mode .bg-gradient-warning,
.dark-mode .info-box.bg-gradient-warning,
.dark-mode .small-box.bg-gradient-warning {
    background: #b45309 !important; /* Darker amber/orange - no gradient */
}

.dark-mode .bg-gradient-primary,
.dark-mode .info-box.bg-gradient-primary,
.dark-mode .small-box.bg-gradient-primary {
    background: #1e40af !important; /* Darker blue - no gradient */
}

.dark-mode .bg-gradient-danger,
.dark-mode .info-box.bg-gradient-danger,
.dark-mode .small-box.bg-gradient-danger {
    background: #b91c1c !important; /* Darker red - no gradient */
}

/* Dark mode - chart text and legends */
.dark-mode .chartjs-render-monitor,
.dark-mode canvas {
    filter: brightness(1.2) !important;
}

.dark-mode .legend,
.dark-mode .chart-legend,
.dark-mode .chartjs-legend,
.dark-mode .legend-item,
.dark-mode .apexcharts-legend-text {
    color: #e2e8f0 !important;
}

/* Dark mode - text colors for better readability */
.dark-mode .text-muted {
    color: #cbd5e1 !important; /* Lighter gray for better readability */
}

.dark-mode .text-secondary {
    color: #e2e8f0 !important; /* Even lighter */
}

/* Dark mode - badges */
.dark-mode .badge {
    color: #ffffff !important;
}

.dark-mode .badge-light,
.dark-mode .badge-secondary {
    background-color: #475569 !important;
    color: #ffffff !important;
}

.dark-mode .badge-primary {
    background-color: var(--color-primary) !important;
}

.dark-mode .badge-success {
    background-color: var(--color-success) !important;
}

.dark-mode .badge-warning {
    background-color: var(--color-warning) !important;
}

.dark-mode .badge-danger {
    background-color: var(--color-danger) !important;
}

.dark-mode .badge-info {
    background-color: var(--color-info) !important;
}

/* Dark mode - small text */
.dark-mode small,
.dark-mode .small {
    color: #cbd5e1 !important;
}

/* Dark mode - ensure all text is readable */
.dark-mode .card-body,
.dark-mode .card-text,
.dark-mode p,
.dark-mode span:not(.badge) {
    color: #e2e8f0 !important;
}

/* Dark mode - links */
.dark-mode a:not(.btn):not(.nav-link):not(.dropdown-item) {
    color: #60a5fa !important;
}

.dark-mode a:not(.btn):not(.nav-link):not(.dropdown-item):hover {
    color: #93c5fd !important;
}

/* Navbar - Cleaner look */
.navbar-white {
    background-color: #f8f9fa !important;
    border-bottom: 1px solid #e0e0e0 !important;
}

/* Table hover - Softer highlight */
.table-hover tbody tr:hover {
    background-color: #f5f8fa !important;
}

/* ============================================
   ESTABLISHMENTS PAGE STYLES
   ============================================ */

/* Establishment card with colored top border */
.establishment-card {
    border-radius: 8px;
    border-top-width: 4px;
    border-top-style: solid;
}

/* Establishment header */
.establishment-header {
    padding: 1.5rem;
}

/* Badge container with gap */
.establishment-badges {
    gap: 0.5rem;
}

/* Info badges */
.info-badge {
    font-weight: 500;
    padding: 6px 10px;
}

/* Department card */
.dept-card {
    border-radius: 8px;
    transition: transform 0.2s, box-shadow 0.2s;
}

.dept-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
}

/* Department header */
.dept-header {
    padding: 1rem;
}

/* Department icon circle */
.dept-icon-circle {
    width: 40px;
    height: 40px;
    background-color: #eff6ff;
    color: #3b82f6;
}

.dark-mode .dept-icon-circle {
    background-color: rgba(59, 130, 246, 0.2);
    color: #60a5fa;
}

/* Department title */
.dept-title {
    font-size: 1.05rem;
    line-height: 1.2;
}

/* Department code */
.dept-code {
    font-size: 0.75rem;
}

/* Department body */
.dept-body {
    padding: 0 1rem 1rem 1rem;
}

/* Status indicator container */
.status-indicator {
    background-color: #f8f9fa;
    border-radius: 6px;
    font-size: 0.85rem;
    padding: 0.5rem;
}

.dark-mode .status-indicator {
    background-color: rgba(255, 255, 255, 0.05);
}

/* Status dot */
.status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.status-dot.open {
    background-color: #22c55e;
    box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.2);
}

.status-dot.closed {
    background-color: #ef4444;
}

/* Status text */
.status-text {
    line-height: 1.1;
}

/* Schedule divider */
.schedule-divider {
    border-top: 1px dashed #e2e8f0;
    padding-top: 0.5rem;
    margin-top: 0.75rem;
}

.dark-mode .schedule-divider {
    border-top-color: rgba(255, 255, 255, 0.1);
}

/* Schedule table */
.schedule-table {
    font-size: 0.85rem;
}

/* Today row in schedule */
.schedule-today {
    background: rgba(59, 130, 246, 0.05);
}

.dark-mode .schedule-today {
    background: rgba(59, 130, 246, 0.1);
}

/* Card body light background */
.card-body-light {
    background-color: #f8f9fa;
    padding: 1.5rem;
}

.dark-mode .card-body-light {
    background-color: transparent;
}

/* Cursor pointer utility */
.cursor-pointer {
    cursor: pointer;
}

/* Department edit button */
.dept-edit-btn {
    font-size: 0.9rem;
}

/* Progress bars - Modern colors */
.progress-bar {
    background-color: var(--color-primary) !important;
}

.progress-bar-success {
    background-color: var(--color-success) !important;
}

.progress-bar-info {
    background-color: var(--color-info) !important;
}

.progress-bar-warning {
    background-color: var(--color-warning) !important;
}

.progress-bar-danger {
    background-color: var(--color-danger) !important;
}

/* Small info boxes - Modern colors */
.small-box.bg-primary {
    background-color: var(--color-primary) !important;
}

.small-box.bg-success {
    background-color: var(--color-success) !important;
}

.small-box.bg-info {
    background-color: var(--color-info) !important;
}

.small-box.bg-warning {
    background-color: var(--color-warning) !important;
}

.small-box.bg-danger {
    background-color: var(--color-danger) !important;
}

/* Links - Modern blue */
a {
    color: var(--color-primary);
}

a:hover {
    color: var(--color-primary-hover);
}

/* Form controls focus - Modern glow */
.form-control:focus {
    border-color: var(--color-primary) !important;
    box-shadow: 0 0 0 0.2rem rgba(58, 123, 200, 0.25) !important;
}

/* Buttons outline variants */
.btn-outline-primary {
    color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
}

.btn-outline-primary:hover {
    background-color: var(--color-primary) !important;
    border-color: var(--color-primary) !important;
    color: #fff !important;
}

.btn-outline-success {
    color: var(--color-success) !important;
    border-color: var(--color-success) !important;
}

.btn-outline-success:hover {
    background-color: var(--color-success) !important;
    border-color: var(--color-success) !important;
    color: #fff !important;
}

.btn-outline-info {
    color: var(--color-info) !important;
    border-color: var(--color-info) !important;
}

.btn-outline-info:hover {
    background-color: var(--color-info) !important;
    border-color: var(--color-info) !important;
    color: #fff !important;
}

.btn-outline-warning {
    color: var(--color-warning) !important;
    border-color: var(--color-warning) !important;
}

.btn-outline-warning:hover {
    background-color: var(--color-warning) !important;
    border-color: var(--color-warning) !important;
    color: #fff !important;
}

.btn-outline-danger {
    color: var(--color-danger) !important;
    border-color: var(--color-danger) !important;
}

.btn-outline-danger:hover {
    background-color: var(--color-danger) !important;
    border-color: var(--color-danger) !important;
    color: #fff !important;
}

/* Brand Logo Override - Force responsive logo sizing */
.main-sidebar .brand-link {
    padding: 15px 10px !important;
    display: block !important;
    height: 80px !important;
    text-align: center !important;
    line-height: normal !important;
}

.main-sidebar .brand-link .brand-image {
    max-width: 100% !important;
    max-height: 100% !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    float: none !important;
    margin: 0 auto !important;
    display: block !important;
}

/* Collapsed sidebar logo */
.sidebar-collapse .main-sidebar .brand-link {
    padding: 10px 5px !important;
    height: 60px !important;
}

.sidebar-collapse .main-sidebar .brand-link .brand-image {
    max-width: 100% !important;
    max-height: 100% !important;
}