/* Global compact theme — reduce font sizes and padding for density */

/* Hide History button on all change forms */
a[href*="/history/"] { display: none !important; }

/* Shrink base font size */
html { font-size: 13px; }

/* Tighter table rows in list views */
#result_list td, #result_list th {
    padding-top: 0.3rem;
    padding-bottom: 0.3rem;
    font-size: 0.8rem;
    line-height: 1.3;
}

/* Compact table headers — left-aligned */
#result_list thead th {
    padding-top: 0.4rem;
    padding-bottom: 0.4rem;
    font-size: 0.75rem;
    text-align: left !important;
}

#result_list thead th .flex {
    justify-content: flex-start !important;
}

#result_list thead th .text {
    text-align: left !important;
}

/* Hide sort-remove X button and sort priority numbers on column headers */
#result_list thead .sortremove,
#result_list thead .sortpriority {
    display: none !important;
}

/* Keep sort arrows visible and prevent overflow */
#result_list thead th {
    overflow: visible !important;
}

#result_list thead th .material-symbols-outlined {
    font-size: 0.85rem !important;
}

/* Row link cells (th in tbody) stay left-aligned */
#result_list tbody th {
    text-align: left !important;
}

/* Align sidebar and main header divider lines */
#nav-sidebar > div:first-child {
    height: 64px !important;
    margin-bottom: 0 !important;
}
#nav-sidebar > div:first-child > div:first-child {
    height: 63px !important;
}
.border-b.mb-6:has(#header-inner),
#main > .border-b:first-child {
    margin-bottom: 0 !important;
}
#main > .border-b:first-child > div {
    height: 64px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    box-sizing: border-box !important;
}
/* Restore spacing below header for page content */
#main > .border-b:first-child + * {
    margin-top: 1.5rem !important;
}

/* Compact sidebar nav links — fit all items without scroll */
#nav-sidebar nav a {
    font-size: 0.875rem;
    height: 32px !important;
    min-height: 32px !important;
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
}


/* Profile dropdown — constrain to sidebar width, no overflow */
.border-t nav.absolute {
    overflow: hidden !important;
    max-width: calc(200px - 8px) !important;
}

.border-t nav.absolute a,
.border-t nav.absolute button {
    height: auto !important;
    min-height: auto !important;
    font-size: 0.8rem !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

nav ol, nav ul {
    gap: 0 !important;
}

nav li {
    margin: 0 !important;
}

/* Narrow the sidebar */
#nav-sidebar,
div.w-\[288px\] {
    width: 200px !important;
}

/* Sidebar section titles */
nav h2, nav h3, nav [class*="uppercase"] {
    margin-top: 0.4rem !important;
    margin-bottom: 0.15rem !important;
    font-size: 0.75rem !important;
}

/* Compact form fields in change forms */
.field-line {
    padding-top: 0.35rem;
    padding-bottom: 0.35rem;
}

/* Compact fieldset labels */
.form-row label {
    font-size: 0.8rem;
}

/* Shrink form inputs */
input[type="text"], input[type="email"], input[type="url"],
input[type="number"], input[type="password"], select, textarea {
    font-size: 0.8rem;
    padding: 0.3rem 0.5rem;
}

/* Disable textarea resize handle — let it use available width */
textarea {
    resize: vertical !important;
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Table layout — fixed widths, no horizontal scroll (unconditional) */
#result_list.result-list {
    table-layout: fixed !important;
    width: 100% !important;
}

#result_list.result-list ~ *,
#result_list.result-list,
.overflow-x-auto:has(#result_list) {
    overflow-x: hidden !important;
}

#result_list td, #result_list th {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    padding-left: 0.4rem;
    padding-right: 0.4rem;
}

/* Checkbox column — minimal on ALL list views */
#result_list .action-checkbox-column,
#result_list .action-checkbox,
#result_list th.action-checkbox-column.lg\:w-10,
#result_list td.action-checkbox {
    width: 2rem !important;
    min-width: 2rem !important;
    max-width: 2rem !important;
    padding-left: 0.25rem !important;
    padding-right: 0.25rem !important;
}

/* Individuals columns */
#result_list .column-first_name,
#result_list .field-first_name { width: 14% !important; }
#result_list .column-last_name,
#result_list .field-last_name { width: 14% !important; }
#result_list .column-email,
#result_list .field-email { width: 25% !important; }
#result_list .column-institution,
#result_list .field-institution { width: 20% !important; }
#result_list .column-lifecycle_stage,
#result_list .field-lifecycle_stage { width: 13% !important; }
#result_list .column-display_last_contacted,
#result_list .field-display_last_contacted { width: 12% !important; }

/* Notifications columns */
#result_list .column-display_read,
#result_list .field-display_read { width: 8% !important; }
#result_list .column-title,
#result_list .field-title { width: 35% !important; }
#result_list .column-display_event_type,
#result_list .field-display_event_type { width: 20% !important; }
#result_list .column-actor,
#result_list .field-actor { width: 20% !important; }
#result_list .column-created_at,
#result_list .field-created_at { width: 15% !important; }

/* Row data stays left-aligned */
#result_list td {
    text-align: left !important;
}

/* ── ZOOM STABILITY ──
   Kill all responsive layout changes. Zoom = magnifier only.
   Page layout never rearranges regardless of viewport size.
   NOT inside @media — applies unconditionally. */

/* 1. Container: lock to xl breakpoint (1280px), never shrink to smaller ones */
.container {
    max-width: 80rem !important;
}

/* 2. Sidebar: always visible, fixed size, never grows with zoom */
.hidden.xl\:relative.xl\:block {
    display: block !important;
    position: relative !important;
    flex-shrink: 0 !important;
    width: 200px !important;
    max-width: 200px !important;
}
#nav-sidebar {
    width: 200px !important;
    max-width: 200px !important;
    position: static !important;
    max-height: none !important;
    height: auto !important;
    top: auto !important;
    bottom: auto !important;
}
/* Sidebar inner nav and app list: no height constraints */
#nav-sidebar-inner {
    min-height: 100vh !important;
    height: auto !important;
}
#nav-sidebar-apps {
    height: auto !important;
    flex-grow: 1 !important;
    overflow: visible !important;
}

/* 3. Toggle icons: always desktop, never mobile */
.hidden\!.xl\:block\! { display: inline-flex !important; }
.block\!.xl\:hidden\! { display: none !important; }
/* Mobile close (X) button and mobile toggle — hide unconditionally */
.xl\:hidden\! { display: none !important; }

/* 4. Page: enforce minimum width so content scrolls, never wraps */
html {
    min-width: 1280px !important;
    overflow-x: auto !important;
}

/* 5. Content area scrolls independently — sidebar stays pinned */
#main {
    overflow-x: auto !important;
    min-width: 0 !important;
}

/* Even padding on content area — left and right match */
#main > .px-4 {
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
}

/* Change form inputs — use available width, not narrow defaults */
.change-form input[type="text"],
.change-form input[type="email"],
.change-form input[type="url"],
.change-form input[type="number"],
.change-form select {
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Constrain TinyMCE editor and error notifications to form width */
.tox-tinymce,
.tox-notifications-container,
.tox-notification,
.tox-notification--warning,
.tox-notification--error {
    max-width: 48rem !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

