/* Picker — campo de seleção com a lista em HTML. Padrão canônico do LIA.
   "NUNCA USAR menu feio" — Dirceu, 22/08/2026: appearance:none conserta a CAIXA,
   mas a lista que o <select> abre é desenhada pelo sistema operacional e nenhum
   CSS alcança. Aqui a lista é HTML e segue o tema do app.

   Os tokens têm fallback de propósito: cada app do LIA nomeia os seus de um jeito
   (--border/--border-strong, --card/--panel/--surface). Assim este arquivo entra
   em qualquer um sem edição; onde o token existe, ele manda. */
.picker { position: relative; width: 100%; }
.picker select {
  position: absolute; left: 0; top: 0; width: 1px !important; height: 1px;
  opacity: 0; pointer-events: none; margin: 0; padding: 0; border: 0; min-width: 0 !important;
}
.picker-btn {
  width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 8px;
  font-family: inherit; font-size: 14px; padding: 9px 11px; text-align: left; cursor: pointer;
  border: 1px solid var(--border-strong, var(--border, #cbd5e1));
  border-radius: var(--radius-sm, 8px);
  background: var(--input-bg, var(--surface, var(--card, #fff)));
  color: var(--text, #0f172a);
}
.picker-btn:hover:not(:disabled) { border-color: var(--primary, var(--blue, #2563eb)); }
.picker-btn:focus-visible, .picker.open .picker-btn {
  outline: none; border-color: var(--primary, var(--blue, #2563eb));
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .15);
}
.picker-btn:disabled { opacity: .6; cursor: not-allowed; }
.picker-val { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.picker-val.vazio { color: var(--muted, var(--text-soft, #64748b)); }
.picker-btn svg { flex-shrink: 0; transition: transform .15s; }
.picker.open .picker-btn svg { transform: rotate(180deg); }
.picker-menu {
  position: fixed; z-index: 12000; display: none; overflow-y: auto; padding: 5px; min-width: 180px;
  background: var(--card, var(--surface, var(--panel, #fff)));
  border: 1px solid var(--border-strong, var(--border, #cbd5e1));
  border-radius: 10px; box-shadow: 0 10px 30px rgba(15, 23, 42, .18);
}
.picker.open .picker-menu { display: block; }
.picker-opt {
  padding: 8px 10px; border-radius: 7px; font-size: 13.5px; cursor: pointer;
  display: flex; align-items: center; gap: 8px; color: var(--text, #0f172a);
}
.picker-opt:hover, .picker-opt.marcado { background: var(--row-hover, var(--hover-soft, #f1f5f9)); }
.picker-opt[aria-selected="true"] { color: var(--primary, var(--blue, #2563eb)); font-weight: 600; }
.picker-opt.desabilitada { opacity: .45; cursor: not-allowed; }
.picker-opt-txt { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.picker-grupo {
  padding: 7px 9px 3px; font-size: 10.5px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .05em; color: var(--label-text, var(--muted, #64748b));
}
