/* Lista própria dos <select> (seletor.js) e menus do mesmo tipo: vidro fosco como no iPhone,
   arredondada e no tema da Nise, no lugar da caixa quadrada nativa. */
:root {
  --vidro-fundo: rgb(30 30 36 / 72%);
  --vidro-borda: rgb(255 255 255 / 10%);
  --vidro-item: rgb(255 255 255 / 8%);
  --vidro-sombra: 0 24px 60px rgb(0 0 0 / 50%), 0 2px 10px rgb(0 0 0 / 30%), inset 0 1px 0 rgb(255 255 255 / 6%);
}
:root[data-theme="light"] {
  --vidro-fundo: rgb(255 255 255 / 76%);
  --vidro-borda: rgb(0 0 0 / 8%);
  --vidro-item: rgb(0 0 0 / 5%);
  --vidro-sombra: 0 24px 60px rgb(0 0 0 / 14%), 0 2px 10px rgb(0 0 0 / 6%), inset 0 1px 0 rgb(255 255 255 / 70%);
}

select { color-scheme: dark; cursor: pointer; }
:root[data-theme="light"] select { color-scheme: light; }
select option { background: var(--fundo-2); color: var(--texto); }
select.sel-aberto { border-color: var(--neon) !important; box-shadow: 0 0 0 3px var(--acento-suave); }

.sel-menu {
  position: fixed; z-index: 2147483000; overflow-y: auto; overscroll-behavior: contain;
  max-width: min(400px, calc(100vw - 16px)); padding: 8px;
  background: var(--vidro-fundo); color: var(--texto);
  -webkit-backdrop-filter: blur(28px) saturate(180%); backdrop-filter: blur(28px) saturate(180%);
  border: 1px solid var(--vidro-borda); border-radius: 18px; box-shadow: var(--vidro-sombra);
  font: 500 14px/1.3 Inter, Manrope, system-ui, sans-serif;
  animation: sel-entra .16s cubic-bezier(.2, .8, .2, 1);
  scrollbar-width: thin;
}
.sel-menu.para-cima { animation-name: sel-entra-cima; }
@keyframes sel-entra { from { opacity: 0; transform: translateY(-6px) scale(.97); } }
@keyframes sel-entra-cima { from { opacity: 0; transform: translateY(6px) scale(.97); } }

.sel-busca { position: sticky; top: -8px; z-index: 1; display: flex; align-items: center; gap: 10px; margin: -8px -8px 6px; padding: 12px 16px; border-bottom: 1px solid var(--vidro-borda); background: inherit; -webkit-backdrop-filter: inherit; backdrop-filter: inherit; border-radius: 18px 18px 0 0; }
.sel-busca svg { width: 18px; height: 18px; fill: none; stroke: var(--texto-2); stroke-width: 2; stroke-linecap: round; flex: none; }
.sel-busca input { flex: 1; min-width: 0; border: 0 !important; background: none !important; box-shadow: none !important; color: var(--texto); font: inherit; font-size: 15px; outline: none; padding: 0 !important; }
.sel-busca input::-webkit-search-cancel-button { display: none; }

.sel-item {
  position: relative; display: grid; gap: 2px; padding: 10px 38px 10px 12px; border-radius: 12px;
  cursor: pointer; user-select: none; min-width: 0;
}
.sel-item > b, .sel-item > small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sel-item > b { font-weight: 600; }
.sel-item > small { color: var(--texto-2); font-size: 12.5px; font-weight: 400; }
.sel-item[hidden], .sel-grupo[hidden] { display: none; }
.sel-item.sel-foco { background: var(--vidro-item); }
.sel-item[aria-selected="true"] > b { color: var(--neon-forte); }
.sel-item[aria-selected="true"]::after {
  content: ""; position: absolute; right: 14px; top: 50%; width: 11px; height: 6px; margin-top: -5px;
  border-left: 2px solid var(--neon-forte); border-bottom: 2px solid var(--neon-forte); transform: rotate(-45deg);
}
.sel-item[aria-disabled="true"] { opacity: .4; cursor: not-allowed; }
.sel-grupo { padding: 10px 12px 4px; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--texto-2); }

:root[data-theme="light"] .sel-item[aria-selected="true"] > b { color: var(--neon-fundo); }
:root[data-theme="light"] .sel-item[aria-selected="true"]::after { border-color: var(--neon-fundo); }
@media (prefers-reduced-motion: reduce) { .sel-menu { animation: none; } }