/* Filter panel — only the bits that are awkward as utilities live here; the rest
   of the styling is Tailwind utility classes built in filter.js (CSP-clean).
   The collapsible advanced panel animates its height via a class toggle (no
   inline styles), so it stays CSP-compliant. */

.flt-panel {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows .2s ease;
}
.flt-panel.flt-open { grid-template-rows: 1fr; }
/* The single child must be able to collapse to 0 height for the grid trick. */
.flt-panel > .flt-panel-inner { overflow: hidden; min-height: 0; }

/* Add-filter / add-order flyouts use the same animation. */
.flt-flyout {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows .18s ease;
}
.flt-flyout.flt-open { grid-template-rows: 1fr; }
.flt-flyout > div { overflow: hidden; min-height: 0; }
