/* Forever database browse hubs (/wow-forever/items/, /wow-forever/npcs/): filter form, result
   table, quality colours, pager. Palette tokens only (docs/ui-ux/17-blizzard-palette.md). */
.fdb-form { display: flex; flex-wrap: wrap; gap: 0.6rem 0.8rem; align-items: flex-end; margin: 0.9rem 0 0.2rem; }
.fdb-field { display: flex; flex-direction: column; gap: 0.2rem; font-size: 0.8rem; min-width: 8rem; }
.fdb-field > span { opacity: 0.75; }
.fdb-field--wide { flex: 1 1 14rem; }
.fdb-field--num { min-width: 5.5rem; max-width: 7rem; }
.fdb-field--check { flex-direction: row; align-items: center; gap: 0.4rem; min-width: 0; }
.fdb-field input, .fdb-field select {
  background: var(--wgf-bg-2); color: inherit; border: 1px solid var(--wgf-border);
  padding: 0.35rem 0.5rem; font: inherit; font-size: 0.9rem; max-width: 100%;
}
.fdb-field--num input { width: 100%; }
.fdb-reset { font-size: 0.85rem; align-self: center; }
.fdb-count { margin: 0.2rem 0 0.4rem; opacity: 0.8; }
.fdb-table td.fdb-n, .fdb-table th:nth-child(2), .fdb-table th:nth-child(3) { white-space: nowrap; }
.fdb-table td.fdb-n { text-align: right; font-variant-numeric: tabular-nums; }
.fdb-name img { border-radius: 2px; }
.fdb-title { opacity: 0.7; font-size: 0.85em; }
.fdb-new {
  display: inline-block; font-size: 0.7rem; padding: 0 0.35rem; margin-left: 0.3rem; vertical-align: 1px;
  border: 1px solid var(--wgf-gold-primary, #ffd100); color: var(--wgf-gold-primary, #ffd100); text-transform: uppercase;
  letter-spacing: 0.04em;
}
a.fdb-q0 { color: var(--q-poor, #9d9d9d); }
a.fdb-q1 { color: var(--q-common, #ffffff); }
a.fdb-q2 { color: var(--q-uncommon, #1eff00); }
a.fdb-q3 { color: var(--q-rare, #0070dd); }
a.fdb-q4 { color: var(--q-epic, #a335ee); }
a.fdb-q5 { color: var(--q-legendary, #ff8000); }
a.fdb-q6 { color: var(--q-artifact, #e6cc80); }
a.fdb-q7 { color: var(--q-heirloom, #00ccff); }
.fdb-pager { display: flex; flex-wrap: wrap; gap: 0.35rem; margin: 0.8rem 0 0.2rem; align-items: center; }
.fdb-pager a, .fdb-pager__cur { padding: 0.15rem 0.55rem; border: 1px solid var(--wgf-border); }
.fdb-pager__cur { border-color: var(--wgf-gold-primary, #ffd100); }
.fdb-pager__gap { opacity: 0.6; }
.fdb-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 0 1.5rem; }
.fdb-cols h3 { margin: 0.6rem 0 0.3rem; font-size: 1rem; }
@media (max-width: 640px) {
  .fdb-field { min-width: 45%; }
  .fdb-field--num { max-width: none; }
  .fdb-table th:nth-child(4), .fdb-table td:nth-child(4) { display: none; }
}