/* Compact Alert Styles for Pending Users */

/* Fix admin panel layout issue - only for alerts, not containers */
.admin-panel-tab > .alert {
    min-height: auto !important;
    height: auto !important;
}

/* Ensure containers maintain their proper height */
.admin-panel-tab > .container,
.admin-panel-tab > .container-fluid {
    /* Remove min-height to prevent vertical stretching */
    min-height: auto !important;
}

/* But override for alerts that are direct children */
.admin-panel-tab > .alert:first-child,
.admin-panel-tab > div.alert {
    min-height: auto !important;
    height: auto !important;
}

/* Admin panel container height fix - prevent page scrolling */
.admin-panel-container {
    max-height: calc(100vh - 134px) !important;  /* 98px from top + 36px bottom spacing */
    height: calc(100vh - 134px) !important;
    margin-top: 1rem !important;
    margin-bottom: 20px !important;
}

/* Ensure the admin panel layout uses flexbox properly */
.admin-panel-row {
    height: 100% !important;
    display: flex !important;
}

/* Make the content area flexible */
.admin-panel-content {
    flex: 1 !important;
    min-height: 0 !important;  /* Important for flexbox overflow */
    overflow: hidden !important;  /* Prevent overflow from affecting parent */
}

/* Adjust tab content to use available space */
.admin-panel-tabs {
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
}

/* Individual tab panes should scroll internally if needed */
/* Removed position: relative override that was breaking absolute positioning pattern */
.admin-panel-tab {
    /* Keep content layout but don't override positioning */
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;  /* Ensure content starts at the top */
    padding: 0 24px 24px 24px !important;  /* Remove top padding to fix whitespace issue */
    /* Scrolling is handled by main.css absolute positioning pattern */
}

/* More specific selector to ensure padding override takes effect */
.tab-pane.admin-panel-tab {
    padding-top: 0 !important;
}

/* CRITICAL: Hide inactive tabs completely - Bootstrap fade class issue fix */
/* Use more specific selectors to ensure inactive tabs are completely hidden */
.tab-pane.fade:not(.show),
.admin-panel-tab.fade:not(.show),
.tab-content .tab-pane:not(.active),
.tab-content .admin-panel-tab:not(.active) {
    display: none !important;
    height: 0 !important;
    max-height: 0 !important;
    min-height: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
    visibility: hidden !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
}

/* Ensure active tabs are properly displayed */
.tab-pane.fade.show.active,
.admin-panel-tab.fade.show.active {
    display: flex !important;
    opacity: 1 !important;
    visibility: visible !important;
    height: auto !important;
    max-height: none !important;
    min-height: auto !important;
}

/* Additional rule to ensure children of inactive tabs are also hidden */
.tab-pane:not(.show) *,
.admin-panel-tab:not(.show) * {
    display: none !important;
}

/* Make manage users tab fill available height properly - ONLY when active */
#v-tabs-manage-admins.show.active {
    flex: 1 1 auto !important;  /* Allow tab to grow and fill container */
    display: flex !important;
    flex-direction: column !important;
    padding: 0 1rem 1rem 1rem !important;  /* Remove top padding to fix whitespace */
    overflow: hidden !important;  /* Prevent outer scrolling */
}

/* Fix the button row positioning - more specific selector - ONLY when tab is active */
#v-tabs-manage-admins.show.active > .row.text-center.justify-content-center {
    flex: 0 0 auto !important;  /* Don't grow or shrink */
    height: auto !important;  /* Prevent height stretching */
    min-height: auto !important;  /* Override any min-height */
    max-height: 60px !important;  /* Limit maximum height */
    margin-bottom: 1rem !important;  /* Space before table */
    align-items: flex-start !important;  /* Prevent vertical stretching */
    overflow: hidden !important;  /* Clip any overflow */
}

/* Ensure inactive users tab doesn't affect layout */
#v-tabs-manage-admins:not(.show),
#v-tabs-manage-admins:not(.active) {
    display: none !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
}

/* Make table container properly visible and sized */
#manage-internal-users-tbl {
    flex: 1 1 auto !important;  /* Fill remaining space */
    margin-top: 0 !important;
    min-height: 400px !important;  /* Ensure minimum height for visibility */
    display: flex !important;  /* Use flex to contain inner content */
    flex-direction: column !important;
}

/* Style the inner table container */
#internal-users-tbl {
    flex: 1 1 auto !important;
    overflow-y: auto !important;
    overflow-x: auto !important;
}

/* Ensure the table itself is properly styled */
#manage-internal-users-tbl table,
#internal-users-tbl table {
    width: 100% !important;
    margin-bottom: 0 !important;
}

/* Fix layout issues for specific tab panels */
#v-tabs-manage-azure-apps,
#v-tabs-manage-colabs,
#v-tabs-producer-site-ui {
    /* Override the general admin-panel-tab padding for these specific tabs */
    padding-top: 0 !important;
}

/* Ensure proper tab isolation and prevent content bleeding */
.tab-pane {
    isolation: isolate;
    z-index: 1;
}

/* Ensure the actual content row has no extra top spacing */
#v-tabs-manage-azure-apps > .row:first-child,
#v-tabs-manage-colabs > :first-child,
#v-tabs-producer-site-ui > :first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Fix all .row elements within these tabs */
#v-tabs-manage-azure-apps .row,
#v-tabs-manage-colabs .row,
#v-tabs-producer-site-ui .row {
    min-height: auto !important;
    height: auto !important;
    align-items: flex-start !important;
}

/* Fix the specific row with excessive margin in apps tab */
#v-tabs-manage-azure-apps .row.my-5 {
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
}

/* Ensure containers don't add extra spacing */
#v-tabs-manage-azure-apps .container-fluid,
#v-tabs-manage-colabs .container-fluid,
#v-tabs-producer-site-ui .container-fluid {
    min-height: auto !important;
    height: auto !important;
    padding-top: 0 !important;
}

/* Ensure the first child col-12 doesn't add spacing */
#v-tabs-manage-azure-apps > .row > .col-12,
#v-tabs-manage-colabs > .row > .col-12,
#v-tabs-producer-site-ui > .row > .col-12 {
    padding-top: 0 !important;
}

/* Notification banner for workspace home */
.alert.py-2 {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
}

.alert.py-2 .btn-sm {
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
}

/* Compact alert for manage users page */
.alert.py-2.mb-3 {
    margin-bottom: 1rem !important;
}

/* Remove excessive spacing in alerts */
.alert .alert-heading {
    margin-bottom: 0.5rem !important;
}

.alert p.mb-2 {
    margin-bottom: 0.5rem !important;
}

.alert .mt-3 {
    margin-top: 0.75rem !important;
}

/* Reduce icon sizes in alerts */
.alert .fs-1 {
    font-size: 1.5rem !important;
}

/* Ensure buttons in alerts are properly aligned */
.alert .d-flex {
    gap: 0.5rem;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .alert .d-flex {
        flex-direction: column;
        align-items: stretch !important;
    }
    
    .alert .d-flex .btn {
        width: 100%;
        margin-bottom: 0.25rem;
    }
}