/* Global fixes for fade and visibility issues */
.fade {
    opacity: 1 !important;
    visibility: visible !important;
    transition: none !important;
}

/* Login page specific fixes */
.login-page {
    opacity: 1 !important;
    visibility: visible !important;
}

.login-page .login-content {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    color: #000 !important;
    z-index: 1000;
    position: relative;
    padding: 30px;
    width: 100%;
    margin: 0 auto;
}

.login-page .form-group {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.login-page input {
    color: #000 !important;
    background: #fff !important;
}

.login-page label {
    color: #000 !important;
}

.fade.in,
.fade.show {
    opacity: 1 !important;
    display: block !important;
}

#page-container {
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
}

/* The legacy theme uses .page-header-fixed { padding-top: 54px }.
   Our header is 60px tall, so align the container padding to the header
   and avoid double-pushing the content down. */
#page-container.page-header-fixed {
    padding-top: 60px !important;
}

.content {
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
}

/* Override any template fade transitions */
[class*="fade-"] {
    opacity: 1 !important;
    visibility: visible !important;
}

/* Ensure proper display of modal dialogs */
.modal {
    display: none;
}

.modal.show,
.modal.in {
    display: block !important;
    opacity: 1 !important;
}

.modal-backdrop {
    display: none;
}

.modal-backdrop.show,
.modal-backdrop.in {
    display: block !important;
    opacity: 0.5 !important;
}

/* Ensure form elements are always visible */
form,
.form-group,
input,
select,
textarea {
    opacity: 1 !important;
    visibility: visible !important;
}

/*
  Bootstrap 5 sets `.nav { display:flex; }` which can break the legacy sidebar/top-menu
  markup that relies on block-level list rendering. Ensure the portal navigation stays visible.
*/
#sidebar .nav,
.sidebar .nav,
#top-menu .nav,
.top-menu .nav {
    display: block !important;
}

#sidebar .nav > li,
.sidebar .nav > li,
#top-menu .nav > li,
.top-menu .nav > li {
    width: 100%;
}

/* Fix for Sidebar Active/Hover "Gap" */
.sidebar .nav > li > a,
#sidebar .nav > li > a {
    display: block !important;
    padding: 10px 20px !important; /* Adjust if too much spacing */
    width: 100% !important;
    text-decoration: none !important;
    margin: 0 !important;
}

/* Ensure flex/block confusion doesn't hide text */
.sidebar .nav > li > a span,
#sidebar .nav > li > a span {
    display: inline !important;
}


#sidebar,
.sidebar {
    opacity: 1 !important;
    visibility: visible !important;
    z-index: 1031 !important;
    padding-top: 0 !important; /* Remove top padding to close gaps */
}

/* Ensure list items have no margins */
.sidebar .nav > li, #sidebar .nav > li {
    margin: 0 !important;
    padding: 0 !important;
}


.sidebar-bg {
    z-index: 1030 !important;
}

/* FORCE SIDEBAR GEOMETRY (Standard State) */
body:not(.page-sidebar-minified) #page-container:not(.page-sidebar-minified) #sidebar,
body:not(.page-sidebar-minified) #page-container:not(.page-sidebar-minified) .sidebar {
    width: 220px !important;
    top: 60px !important; /* Below new header height */
    bottom: 0 !important;
    left: 0 !important;
    position: fixed !important;
    display: block !important;
    overflow: visible !important; 
}

/* Ensure sidebar background follows the rule */
body:not(.page-sidebar-minified) #page-container:not(.page-sidebar-minified) .sidebar-bg {
    width: 220px !important;
    position: fixed !important;
    top: 60px !important; /* Below new header height */
    bottom: 0 !important;
    left: 0 !important;
    background-color: #2d353c !important;
    display: block !important;
}

/* FIXED: Allow minified sidebar to work */
body.page-sidebar-minified #page-container #sidebar,
body.page-sidebar-minified #page-container .sidebar,
.page-sidebar-minified #page-container #sidebar,
.page-sidebar-minified #page-container .sidebar,
#page-container.page-sidebar-minified #sidebar,
#page-container.page-sidebar-minified .sidebar {
    width: 60px !important;
    top: 60px !important; /* Below new header height */
    bottom: 0 !important;
    left: 0 !important;
    position: fixed !important;
    display: block !important;
    z-index: 1031 !important;
    overflow: visible !important; /* Required for submenus to pop out */
}

body.page-sidebar-minified #page-container .sidebar-bg,
.page-sidebar-minified #page-container .sidebar-bg,
#page-container.page-sidebar-minified .sidebar-bg {
    width: 60px !important;
    top: 60px !important; /* Below new header height */
    z-index: 1030 !important;
    background-color: #2d353c !important;
}


/* Ensure content isn't 0 height due to scrollbar plugin failure */
#sidebar [data-scrollbar="true"],
.sidebar [data-scrollbar="true"] {
    height: 100% !important;
    overflow-y: auto !important; 
}

/* 
   CONTENT SPACING FIX 
   Align content closely with sidebar and header.
*/
@media (min-width: 768px) {
    /* No sidebar at all */
    body.page-without-sidebar #page-container .content,
    #page-container.page-without-sidebar .content {
        margin-left: 0 !important;
    }

    /*
       App bundle still applies legacy offsets:
       - .content { margin-left: 220px }
       - .page-sidebar-minified .content { margin-left: 60px }
       We explicitly neutralize both so content doesn't leave a gap.
    */
    body:not(.page-without-sidebar) #page-container .content {
        margin-left: 0 !important;
    }

    /* Non-minified sidebar (220px) - only when neither body nor #page-container is minified */
    body:not(.page-sidebar-minified) #page-container:not(.page-sidebar-minified):not(.page-without-sidebar) .content {
        
        padding-left: 10px !important;
        padding-right: 15px !important;
        padding-top: 15px !important;
    }

    /* Minified sidebar (60px) - when either body OR #page-container has the minified class */
    body.page-sidebar-minified #page-container:not(.page-without-sidebar) .content,
    #page-container.page-sidebar-minified:not(.page-without-sidebar) .content {
        
        padding-left: 10px !important;
        padding-right: 15px !important;
        padding-top: 15px !important;
    }
}

/*
   Hide uploader *Debug Messages* UI globally
   - Do NOT hide uploaded file state/containers (users need upload completion feedback)
*/
#debug,
ul#debug,
.uploader-debug-messages {
    display: none !important;
}

/*
   dmUploader UI stabilization
   - Prevent native file input (Browse / No file selected) from showing/overlapping
   - Keep button label readable and clickable across all modals/pages
*/
.dm-uploader .btn {
    position: relative !important;
    overflow: hidden !important;
}

.dm-uploader .btn,
.dm-uploader .btn > span {
    white-space: nowrap;
}

.dm-uploader .btn > span {
    position: relative;
    z-index: 1;
    pointer-events: none;
}

.dm-uploader .btn input[type="file"] {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    opacity: 0 !important;
    cursor: pointer !important;
}

/*
   Panel header icon buttons (BS5 + legacy btn-xs shims)
   Some pages add a Bootstrap 3 compatible .btn-xs rule which can add padding.
   That breaks ColorAdmin-style .btn-icon buttons and makes icons overflow.
*/
.btn.btn-icon.btn-xs,
.btn-icon.btn-xs {
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
}

.btn.btn-icon.btn-xs > i,
.btn.btn-icon.btn-xs > svg,
.btn-icon.btn-xs > i,
.btn-icon.btn-xs > svg {
    display: block !important;
    line-height: 1 !important;
}


/* Footer Duplication Fix: Force hide any footer inside content or page-container */
.content .footer, 
#content .footer,
#page-container .footer {
    display: none !important; 
}

/* Only allow the global footer outside page-container to show */
body > #footer {
    display: block !important;
}

/* Ensure global footer is only shown once and aligned */
#footer {
    display: block !important;
    margin-left: 220px !important; 
    padding: 10px 20px;
    background: #fff; 
    border-top: 1px solid #eee;
}

#page-container.page-sidebar-minified #footer,
body.page-sidebar-minified #footer,
.page-sidebar-minified #footer {
    margin-left: 60px !important;
}

#page-container.page-without-sidebar #footer {
    margin-left: 0 !important;
}






/* Header Z-Index fix: Must be very high to overlay top menu (1030) */
#header {
    z-index: 2000 !important;
    height: 60px !important; /* Fixed height to match sidebar top */
    min-height: 60px !important; 
    background: #fff !important; 
    display: flex !important;
    align-items: center !important;
    overflow: visible !important; /* Critical for dropdowns to escape */
}

/* Ensure Dropdowns in header and menus stay above bars
   but let Bootstrap control visibility and positioning. */
#header .dropdown-menu,
.navbar .dropdown-menu,
.nav .dropdown-menu,
.navbar-nav .dropdown-menu,
#navbarNav .dropdown-menu,
#top-menu .dropdown-menu {
    z-index: 2005 !important;
}

.dropdown-menu.show {
    z-index: 2005 !important;
}

/* 
   TOP MENU VISIBILITY 
*/
#top-menu {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    background: #2d353c;
    width: 100%;
    position: fixed;
    top: 60px !important; /* Move down below header height */
    left: 0;
    right: 0;
    z-index: 1020 !important; /* Lower than header (2000) */
}

/* Ensure no min-height forces blue bar to be taller than single row items */
#top-menu,
#top-menu .nav {
    min-height: 0 !important;
}

#page-container.page-with-top-menu {
    padding-top: 110px !important; /* Header (60) + TopMenu height (approx 50) */
}

/* Top menu items need to be inline-block or flex, but legacy was likely floats or inline-block */
#top-menu .nav > li {
    display: block !important;
    float: left !important;
    width: auto !important; 
    margin: 0 !important;
    padding: 0 !important;
}

#top-menu .nav > li > a {
    display: block !important;
    padding: 10px 20px !important;
    color: #fff;
    text-decoration: none;
    line-height: 20px;
}

/* Sidebar Minified: Hide Text */
body.page-sidebar-minified #page-container .sidebar .nav > li > a > span,
body.page-sidebar-minified #page-container #sidebar .nav > li > a > span,
.page-sidebar-minified #page-container .sidebar .nav > li > a > span,
.page-sidebar-minified #page-container #sidebar .nav > li > a > span,
#page-container.page-sidebar-minified .sidebar .nav > li > a > span,
#page-container.page-sidebar-minified #sidebar .nav > li > a > span {
    display: none !important;
}


#top-menu .nav > li > a {
    display: block !important;
    padding: 10px 20px !important;
    color: #fff;
    text-decoration: none;
    line-height: 20px; /* Force line-height for consistent size */
}

/* Sidebar Minified: Hide Text */
#page-container.page-sidebar-minified .sidebar .nav > li > a > span,
#page-container.page-sidebar-minified #sidebar .nav > li > a > span {
    display: none !important;
}





/* Legacy footer overrides removed; see earlier block for
    footer duplication fix and alignment rules. */