/* Un vocabulaire commun, avec les couleurs propres à chaque espace. */
.brand-select {
  --dropdown-bg: var(--forum-surface, #fafaf8);
  --dropdown-field: var(--forum-bg, #fafaf8);
  --dropdown-text: var(--forum-text, #33322f);
  --dropdown-muted: var(--forum-muted, #797875);
  --dropdown-border: var(--forum-input-border, #d4d2cb);
  --dropdown-accent: var(--forum-accent, #343432);
  --dropdown-selected: var(--forum-selected, #efeee9);
  display: inline-block;
  position: relative;
  width: 100%;
  min-width: 0;
  vertical-align: middle;
}
select.brand-select-native {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  opacity: 0;
  clip-path: inset(50%);
  pointer-events: none;
}
.brand-select .brand-select__trigger {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  width: 100%;
  min-height: 46px;
  margin: 0;
  padding: 10px 12px;
  border: 1px solid var(--dropdown-border);
  border-radius: 0;
  background: var(--dropdown-field);
  color: var(--dropdown-text);
  font: inherit;
  font-size: 13px;
  line-height: 1.5;
  text-align: left;
  cursor: pointer;
  transition: border-color .15s, background-color .15s;
  -webkit-tap-highlight-color: transparent;
}
.brand-select .brand-select__trigger:hover { border-color: #b1b0ad; background: var(--dropdown-bg); color: var(--dropdown-text); }
.brand-select .brand-select__trigger:is(:focus-visible, [aria-expanded=true]) {
  border-color: var(--dropdown-accent);
  background: var(--dropdown-bg);
  box-shadow: none;
}
.brand-select .brand-select__trigger[aria-invalid=true] { border-color: #9a6551; }
.brand-select__error { display: block; margin-top: 6px; color: #9a6551; font-size: 12px; line-height: 1.5; }
.brand-select__error[hidden] { display: none; }
.brand-select .brand-select__trigger:disabled { opacity: .5; cursor: default; }
.brand-select__value { min-width: 0; overflow-wrap: anywhere; }
.brand-select__arrow {
  display: grid;
  place-items: center;
  width: 16px;
  height: 16px;
  color: var(--dropdown-muted);
  flex: 0 0 auto;
}
.brand-select__arrow::after {
  content: '';
  width: 6px;
  height: 6px;
  border-right: 1px solid currentColor;
  border-bottom: 1px solid currentColor;
  transform: translateY(-2px) rotate(45deg);
  transition: transform .15s;
}
[aria-expanded=true] > .brand-select__arrow::after { transform: translateY(1px) rotate(225deg); }
.brand-select-menu {
  box-sizing: border-box;
  position: fixed;
  inset: auto;
  z-index: 1000;
  margin: 0;
  padding: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: var(--dropdown-border) transparent;
  border: 1px solid var(--dropdown-border);
  border-radius: 0;
  background: var(--dropdown-bg);
  color: var(--dropdown-text);
  box-shadow: none;
  font: inherit;
  font-size: 13px;
  line-height: 1.5;
}
.brand-select-menu[hidden] { display: none !important; }
.brand-select__option {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: 40px;
  box-sizing: border-box;
  padding: 10px 12px;
  border-radius: 0;
  cursor: pointer;
  overflow-wrap: anywhere;
}
.brand-select__option + .brand-select__option { border-top: 1px solid var(--dropdown-border); }
.brand-select__option.is-active { background: var(--forum-selected, #f1f0ed); }
.brand-select__option[aria-selected=true] { color: var(--dropdown-accent); background: var(--dropdown-selected); }
.brand-select__check {
  display: grid;
  place-items: center;
  width: 19px;
  height: 19px;
  color: currentColor;
  flex-shrink: 0;
  opacity: 0;
  font-size: 11px;
}
[aria-selected=true] > .brand-select__check { opacity: 1; }
.brand-select__option[aria-disabled=true] { color: var(--dropdown-muted); opacity: .5; cursor: default; }
.directory-filters .brand-select__trigger { min-height: 43px; padding: 10px 0; border: 0; border-bottom: 1px solid var(--dropdown-border); background: transparent; font-size: 13px; }
.directory-filters .brand-select__trigger:is(:hover, :focus-visible, [aria-expanded=true]) { border-color: var(--dropdown-accent); background: transparent; }
.reader-controls .brand-select { width: auto; min-width: 160px; }
.reader-controls .brand-select__trigger { min-height: 44px; font-size: 12px; }
.sidebar form > .brand-select { grid-column: 1 / -1; }
.sidebar .brand-select__trigger { font-size: 12px; }
.sort-label .brand-select { width: auto; min-width: 180px; }
.science-search .brand-select { width: 200px; flex: 0 0 200px; align-self: center; margin: 4px; }
.science-search .brand-select__trigger { min-height: 42px; font-size: 12px; }
.forum-filters .brand-select { width: auto; max-width: 48%; }
.forum-filters .brand-select__trigger { min-width: 220px; min-height: 44px; font-size: 12px; }
.forum-page dialog .brand-select__trigger { min-height: 47px; font-size: 14px; }
.researchers-field .brand-select__trigger { min-height: 47px; }
@media (max-width: 680px) {
  .brand-select .brand-select__trigger { font-size: 14px; gap: 12px; }
  .brand-select-menu { font-size: 14px; }
  .brand-select__option { min-height: 44px; }
  .science-search .brand-select { width: 155px; flex-basis: 155px; }
  .science-search .brand-select__trigger { padding: 8px 10px; font-size: 12px; }
  .forum-filters .brand-select { max-width: 100%; }
  .forum-filters .brand-select__trigger { min-width: 0; font-size: 12px; }
  .reader-controls .brand-select { min-width: 0; width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .brand-select__trigger, .brand-select__arrow::after { transition: none !important; }
}