/* 1kamas: the dropdowns of the items and accounts pages (/objets/dofus/ and /comptes/dofus/: the server
   filter and the sort) as the homepage quick order's lists. 1k-select.js puts the quick order's
   button before each <select> of the listing (#k1-market) and opens the same list in <body>; both are
   styled by the quick order's own rules (k1-dd__*, in 1k-hero.css, linked by every page), so a change
   there shows here too. This sheet only fits them into these pages: the quick order's purple, the
   hidden <select>, the chosen server and the sort's width. Nothing here applies to a field that
   1k-select.js has not marked (.k1-dd--select): without the script the pages keep their <select>. */

/* ---------- The quick order's purple ----------
   The quick order and its lists re-declare the full purple brand (1k-hero.css) while the rest of the
   page uses the muted violet: the fields get it too, so their hover, focus ring and chosen server
   are the quick order's (the list already has it) */
.k1-dd--select { --brand: 124 92 191; --brand-dark: 106 74 173; --brand-soft: 243 238 251; --brand-tint: 247 244 251; }
html[data-theme="dark"] .k1-dd--select { --brand: 184 153 232; --brand-dark: 158 122 216; --brand-soft: 47 36 64; --brand-tint: 41 32 56; }

/* The page's <select> stays (the pages read and set it, the button reads it) but is never shown */
.k1-dd--select > select { display: none !important; }

/* ---------- Server: the button fills the filter column, as the field did ----------
   Once a server is chosen, purple border and name, as before */
#k1-market .k1m-select.is-set .k1-dd__btn { border-color: rgb(var(--brand)); color: rgb(var(--brand)); }

/* ---------- Sort: a field like the quick order's, its icon before the choice ----------
   On the right of the results bar, wide enough for its longest choice so the bar doesn't move when
   the choice changes; on phones, as wide as the choice shown */
#k1-market .k1m-sort.k1-dd--select { height: auto; }
#k1-market .k1m-sort .k1-dd__btn { width: auto; min-width: 210px; }
.k1-dd__icon { flex: none; display: flex; color: rgb(var(--muted)); }
@media (max-width: 559px) {
  #k1-market .k1m-sort .k1-dd__btn { min-width: 0; }
}