/* ══ COMBOBOX — brand/type searchable dropdown ══ */

.combobox-wrap { position: relative; }

.combobox-dropdown {
  display: none;
  position: absolute; top: calc(100% + 4px); left: 0; right: 0;
  background: #141820; border: 1px solid #2a3040; border-radius: 8px;
  z-index: 500; max-height: 200px; overflow-y: auto;
  box-shadow: 0 8px 24px rgba(0,0,0,0.5);
}
.combobox-dropdown.open { display: block; }
.combobox-dropdown::-webkit-scrollbar       { width: 4px; }
.combobox-dropdown::-webkit-scrollbar-thumb { background: #1f2530; border-radius: 2px; }

.combobox-option {
  padding: 9px 12px; font-family: 'Barlow', sans-serif; font-size: 13px;
  color: #8899aa; cursor: pointer; transition: background 0.1s, color 0.1s;
  border-bottom: 1px solid #1a1f28;
}
.combobox-option:last-child              { border-bottom: none; }
.combobox-option:hover,
.combobox-option.highlighted             { background: #1f2530; color: #dce3ed; }
.combobox-option span.match              { color: #d4f542; font-weight: 600; }
.combobox-option-badge {
  font-size: 9px; font-weight: 700; letter-spacing: 0.5px; text-transform: uppercase;
  color: #5a6678; background: #1a1f28; border: 1px solid #2a3040;
  border-radius: 3px; padding: 1px 4px; flex-shrink: 0;
}

/* ── Light mode ── */
body.light-mode .combobox-dropdown { background: #ffffff; border-color: #dde2ec; box-shadow: 0 8px 24px rgba(0,0,0,0.1); }
body.light-mode .combobox-dropdown::-webkit-scrollbar-thumb { background: #dde2ec; }
body.light-mode .combobox-option { color: #6b7a8d; border-bottom-color: #eef0f5; }
body.light-mode .combobox-option:hover,
body.light-mode .combobox-option.highlighted { background: #f0f3f8; color: #1a2030; }
body.light-mode .combobox-option span.match { color: #5a7a00; }