/* Shared Filters toggle (see v2-filter-toggle.js). Uses the app's theme tokens, so it follows light and dark. */
.v2ft-bar{
  grid-column:1/-1;flex:0 0 100%;box-sizing:border-box;width:100%;
  display:flex;align-items:center;gap:10px;min-width:0;min-height:36px;margin:0 0 8px;
}
.v2ft-toggle{
  flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 12px;
  border:1px solid var(--line,#e4e4e6);border-radius:10px;background:var(--surface,#fff);color:var(--ink,#0f0f10);
  font:inherit;font-size:12px;font-weight:700;line-height:1;cursor:pointer;
  transition:border-color .16s ease,background-color .16s ease;
}
.v2ft-toggle:hover{border-color:var(--line-strong,#cfcfd2);background:var(--surface-soft,#f7f7f7)}
.v2ft-toggle:focus-visible,.v2ft-reset:focus-visible{outline:2px solid var(--orange,#ff6b35);outline-offset:2px}
.v2ft-chevron{flex:0 0 auto;transition:transform .18s ease}
.v2ft-bar[data-state="expanded"] .v2ft-chevron{transform:rotate(180deg)}
.v2ft-badge{
  display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;box-sizing:border-box;
  border-radius:9px;background:var(--ink,#0f0f10);color:var(--surface,#fff);font-size:10.5px;font-weight:800;
}
.v2ft-badge[hidden],.v2ft-summary[hidden],.v2ft-reset[hidden]{display:none!important}
.v2ft-summary{
  flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  color:var(--muted,#6b6b6f);font-size:12px;
}
.v2ft-reset{
  flex:0 0 auto;margin-left:auto;height:34px;padding:0 6px;border:0;background:transparent;color:var(--ink,#0f0f10);
  font:inherit;font-size:12px;font-weight:700;text-decoration:underline;text-decoration-color:var(--line-strong,#cfcfd2);text-underline-offset:3px;cursor:pointer;
}
.v2ft-reset:hover{text-decoration-color:currentColor}
.v2ft-summary:not([hidden])~.v2ft-reset{margin-left:0}
.v2ft-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* Collapsed state: the secondary controls leave the layout but stay in the DOM with their values. */
html body [data-v2ft-hidden][data-v2ft-hidden]{display:none!important}
.v2ft-enter{animation:v2ft-in .18s ease both}
@keyframes v2ft-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

@media (max-width:640px){
  .v2ft-bar{gap:8px;margin-bottom:6px}
  .v2ft-toggle{height:36px}
  .v2ft-reset{height:36px}
}
@media (prefers-reduced-motion:reduce){
  .v2ft-enter{animation:none}
  .v2ft-chevron,.v2ft-toggle{transition:none}
}
@media print{.v2ft-bar{display:none}}