/* Django 4.2 Admin Layout Fix - Restore Vertical Stacking */
/* This fixes the issue where admin changelist modules appear side-by-side instead of vertically stacked */
/* while keeping filters on the right side where they belong */

/* Hide the left navigation sidebar on the main admin dashboard */
.dashboard #nav-sidebar {
    display: none !important;
}

/* Hide the toggle button for navigation sidebar on dashboard */
.dashboard .toggle-nav-sidebar {
    display: none !important;
}

/* Ensure main content takes full width when sidebar is hidden on dashboard */
.dashboard .main > .content {
    max-width: 100% !important;
}

/* Remove any margin adjustments for the hidden sidebar on dashboard */
.dashboard .main.shifted > .content {
    max-width: 100% !important;
}

/* Fix object-tools positioning - compact positioning in top-right corner */
#content-main .object-tools {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 10 !important;
    width: auto !important;
    height: auto !important;
    float: none !important;
    clear: none !important;
}

/* Make object-tools list horizontal and compact */
#content-main .object-tools li {
    display: inline-block !important;
    margin: 0 0 0 10px !important;
    float: none !important;
}

/* Ensure content-main has relative positioning for absolute positioning of object-tools */
#content-main {
    position: relative !important;
    padding-top: 45px !important; /* Add padding to prevent overlap with object-tools */
}

/* ===== FILTERED CHANGELISTS (with filters) ===== */
/* Simple approach - use traditional float layout for filtered changelists */
.module.filtered#changelist {
    display: block !important;
    position: relative !important;
    overflow: visible !important; /* Allow filters to extend beyond changelist content */
    margin-top: 0 !important;
    min-height: calc(100vh - 150px) !important; /* Ensure enough space for long filters */
}

/* Float the filter to the right and position it to start at searchbar level */
.module.filtered #changelist-filter {
    float: right !important;
    width: 240px !important;
    margin: 0 0 0 30px !important;
    position: absolute !important;
    right: 0 !important;
    top: 0 !important;
    z-index: 5 !important;
    /* Let JavaScript control height and overflow for hide/show functionality */
}

/* Give all main content elements a right margin to make space for the filter - ONLY when filters exist */
.module.filtered#changelist > *:not(#changelist-filter) {
    margin-right: 270px !important;
    display: block !important;
    width: auto !important;
    clear: left !important;
}

/* Specifically target the changelist form - ONLY when filters exist */
.module.filtered #changelist-form {
    margin-right: 270px !important;
    display: block !important;
    width: auto !important;
    clear: left !important;
}

/* Target search form - this should align with filter top - ONLY when filters exist */
.module.filtered #changelist .search-form {
    margin-right: 270px !important;
    margin-bottom: 15px !important;
    clear: left !important;
    position: relative !important;
    z-index: 1 !important;
}

/* Target date hierarchy - ONLY when filters exist */
.module.filtered #changelist .toplinks {
    margin-right: 270px !important;
    margin-bottom: 15px !important;
    clear: left !important;
}

/* ===== NON-FILTERED CHANGELISTS (no filters) ===== */
/* For non-filtered changelists, ensure full width layout */
#changelist:not(.module.filtered) {
    display: block !important;
    width: 100% !important;
}

/* Ensure non-filtered changelist form takes full width */
#changelist:not(.module.filtered) #changelist-form {
    margin-right: 0 !important;
    width: 100% !important;
    display: block !important;
}

/* Ensure non-filtered search form takes full width */
#changelist:not(.module.filtered) .search-form {
    margin-right: 0 !important;
    width: 100% !important;
    margin-bottom: 15px !important;
}

/* Ensure non-filtered toplinks take full width */
#changelist:not(.module.filtered) .toplinks {
    margin-right: 0 !important;
    width: 100% !important;
    margin-bottom: 15px !important;
}

/* ===== COMMON RULES FOR ALL CHANGELISTS ===== */
/* Ensure the results table has proper spacing */
#changelist-form .results {
    width: auto !important;
    overflow-x: auto !important;
}

/* Ensure pagination has proper spacing */
#changelist .paginator {
    clear: left !important;
}

/* Ensure actions have proper spacing */
#changelist .actions {
    clear: left !important;
}

/* Clear floats after changelist */
.module.filtered#changelist::after {
    content: "" !important;
    display: table !important;
    clear: both !important;
}

/* Ensure dashboard modules stack vertically on the admin index page */
.dashboard #content-main .module {
    display: block !important;
    float: none !important;
    width: auto !important;
    margin-bottom: 30px !important;
}

/* Dashboard doesn't need the extra padding */
.dashboard #content-main {
    padding-top: 0 !important;
}

/* MINIMAL FIX: Ensure page is tall enough to accommodate filters */
/* This only adds minimum height to page containers without interfering with filter hide/show */
html, body {
    min-height: 100vh !important;
}

.main {
    min-height: 100vh !important;
}

/* Mobile responsiveness */
@media (max-width: 1024px) {
    .module.filtered #changelist-filter {
        float: none !important;
        position: static !important;
        width: 100% !important;
        margin: 30px 0 0 0 !important;
        right: auto !important;
        top: auto !important;
    }

    .module.filtered#changelist > *:not(#changelist-filter),
    .module.filtered #changelist-form,
    .module.filtered #changelist .search-form,
    .module.filtered #changelist .toplinks {
        margin-right: 0 !important;
    }

    #content-main .object-tools {
        position: static !important;
        float: none !important;
        margin-bottom: 15px !important;
        width: 100% !important;
    }

    #content-main .object-tools li {
        display: block !important;
        margin: 5px 0 !important;
    }

    #content-main {
        padding-top: 0 !important;
    }
}

/* Fix any table width issues */
#changelist table {
    width: 100% !important;
    table-layout: auto !important;
}