/* List screens — one shape for every list in the product.
 *
 * Linked from includes/site-css-bootstrap-5.3.3.html AFTER volt.css. Two of the
 * rules below tie volt on specificity and win only on source order, exactly as
 * help-tip.css does; moving the <link> up the file silently un-fixes them.
 */

/* volt.css declares `.dropdown-menu span { width: 30px }` unconditionally — not
 * inside a media query, not scoped to the navbar. Any <span> inside a dropdown is
 * crushed to 30px, which is what clipped the colour-scheme menu's captions once
 * already. The tags emit no spans; this is the guard for markup a screen adds. */
.dropdown-menu.list-filter-menu span,
.dropdown-menu.list-actions-menu span { width: auto; }

/* Bootstrap sets `.dropdown-item { white-space: nowrap }`. A disabled item carries
 * its reason on a second line underneath, and that line has to wrap. */
.list-actions-menu .dropdown-item { white-space: normal; }
.list-actions-menu { min-width: 13rem; }
.list-filter-menu  { min-width: 17rem; max-width: 22rem; }

.list-action-reason { white-space: normal; font-size: .75rem; }

/* The rightmost cell holds one control and should not take width from the data. */
.list-actions-cell { width: 1%; white-space: nowrap; }

/* The row menu's trigger is an ICON AFFORDANCE, not one of the screen's actions,
 * so it sits outside UI.md's btn-primary/btn-secondary mapping for the same reason
 * the `✕` chip control does. It still has to read as pressable and show focus. */
.list-actions-toggle {
  color: #4B5563;
  padding: .25rem .55rem;
  line-height: 1;
  text-decoration: none;
}
.list-actions-toggle:hover,
.list-actions-toggle:focus,
.list-actions-toggle[aria-expanded="true"] {
  color: #1F2937;
  background-color: #F3F4F6;
  text-decoration: none;
}
.list-actions-toggle:focus-visible {
  outline: 2px solid #1F2937;
  outline-offset: 2px;
}

/* volt sizes `.dropdown-icon` at 1.25rem square, which is what lines the labels up
 * into a column. A Font Awesome <i> is inline by default and ignores the width. */
.list-actions-menu .dropdown-icon,
.list-filter-menu .dropdown-icon {
  display: inline-block;
  text-align: center;
}

/* The filter popup is a form, not a menu of links: it must survive a click on its
 * own checkboxes. That is `data-bs-auto-close="outside"` on the toggle; this only
 * gives the form room to breathe. */
.list-filter-menu .list-filter-group + .list-filter-group { margin-top: .75rem; }
.list-filter-menu legend { font-size: .8125rem; margin-bottom: .25rem; }