/* The dropdown: a native <details> over links (catalog filters, the sign-in account switch). */
.wf-dd { position: relative; }
.wf-dd__btn { display: flex; align-items: center; gap: var(--wf-s2); min-block-size: var(--wf-tap); padding-inline: var(--wf-s4);
  border: 2px solid var(--wf-line-strong); border-radius: var(--wf-r-pill); background: var(--wf-paper);
  list-style: none; font-weight: 700; cursor: pointer; user-select: none; }
.wf-dd__btn::-webkit-details-marker { display: none; }
.wf-dd__btn:hover { border-color: var(--wf-ink); }
.wf-dd__btn::after { content: ""; flex: none; inline-size: .45em; block-size: .45em; margin-inline-start: auto;
  rotate: 45deg; translate: 0 -.15em; }
[dir] .wf-dd__btn::after { border: solid; border-width: 0 2px 2px 0; }   /* a chevron is physical: it points down */
.wf-dd[open] .wf-dd__btn::after { rotate: 225deg; translate: 0 .15em; }
.wf-dd__k { font-weight: 600; color: var(--wf-ink-2); }
.wf-dd__v { min-inline-size: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wf-dd__btn[data-on] { background: var(--wf-lemon); border-color: var(--wf-btn-edge); color: var(--wf-dark); }
.wf-dd__btn[data-on] .wf-dd__k { color: inherit; opacity: .7; }
.wf-dd__menu { position: absolute; z-index: 20; inset-inline-start: 0; inset-block-start: calc(100% + 6px); min-inline-size: 100%;
  display: grid; padding: var(--wf-s2); border: 1px solid var(--wf-line); border-radius: var(--wf-r-m); background: var(--wf-paper);
  box-shadow: 0 18px 40px -16px rgb(30 20 60 / .45); max-block-size: 20rem; overflow: auto; }
.wf-dd__opt { display: flex; align-items: center; min-block-size: 40px; padding-inline: var(--wf-s3); border-radius: var(--wf-r-s);
  color: var(--wf-ink); font-weight: 600; text-decoration: none; white-space: nowrap; }
.wf-dd__opt:hover { background: var(--wf-ground); }
.wf-dd__opt[aria-current] { background: var(--wf-lemon); color: var(--wf-dark); }
.wf-switch { display: flex; margin-block-end: var(--wf-s4); max-inline-size: 100%; }
.wf-switch .wf-dd { min-inline-size: 0; max-inline-size: 100%; }
.wf-switch .wf-dd__menu { max-inline-size: calc(100vw - 2rem); }
.wf-switch .wf-dd__opt { white-space: normal; }
