/* Place this in a separate CSS file loaded via UNFOLD['STYLES'] */

/* ############################################################################## */ 
/* Container Widths to Full Page*/
/* ############################################################################## */ 

.change-form .container {
    width: 100% !important;
    max-width: none !important;
}

.container {
    width: 100% !important;
    max-width: none !important;
}

/* ############################################################################## */ 
/* Page title section (the one that contains the sidebar icon and the main buttons on the right) */
/* ############################################################################## */ 

/* Reduces fixed height from 64px,  Minimizes top and bottom padding */
/* #main > .bg-white.border-b.mb-6.px-4.z-40 > .flex.items-center {
    height: 40px !important;   
    padding-top: 4px !important; 
    padding-bottom: 4px !important;
} */

/* ############################################################################## */ 
/* Navbar */
/* ############################################################################## */ 




/* ############################################################################## */ 
/* Useless area between the navbar and the buttons/grid */
/* ############################################################################## */ 

.px-4 > .mb-6.mx-auto.-my-3.lg\:mb-12 {
    margin-top: -0.75rem !important;   /* Restore negative margin */
    margin-bottom: 8px !important;     /* Reduce bottom margin */
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}


/* ############################################################################## */ 
/* Confirmation messages, like the ones shown when a record is updated or deleted */
/* Remove margin/padding below the confirmation message */
/* ############################################################################## */ 

/* Target only the confirmation message UL and its children within .px-4 */
.px-4 > div.mx-auto > ul.flex.flex-col.gap-4.mb-8 {
    margin-bottom: 0 !important;  /* Remove bottom margin after the entire message list */
    gap: 0 !important;           /* Eliminate vertical gaps between list items */
}
.px-4 > div.mx-auto > ul.flex.flex-col.gap-4.mb-8 > li > div.mb-3 {
    margin-bottom: 0 !important; /* Remove bottom margin on the inner message DIV */
}

/* Limit height of the green confirmation message, only for this context */
.px-4 > div.mx-auto > ul > li > div.bg-green-100.text-green-700 {
    height: 36px !important;
    min-height: 36px !important;
    max-height: 36px !important;
    overflow: hidden !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    display: flex !important;
    align-items: center !important;
}