/*=====================================================
  GCA SELECT — componente padrão do Design System (2026-07-29)

  Substitui a aparência do <select> nativo em todo o sistema. Motivo:
  o CAMPO FECHADO de um <select> já é 100% estilizável via CSS (e já
  estava correto nos dois temas), mas a LISTA DE OPÇÕES ABERTA é
  desenhada pelo sistema operacional/navegador — fora do alcance do
  CSS da página. `color-scheme:dark` (já em uso) ajuda em alguns
  navegadores, mas não em todos; o resultado inconsistente (populares
  reportados: Assembleias, Carteira Inteligente, Comissões) foi
  considerado inaceitável pelo usuário.

  Arquitetura (ver js/gca-select.js): o <select> ORIGINAL continua no
  DOM, intacto e funcional (mesmo id, mesmas <option>, .value/
  .selectedIndex/change continuam funcionando exatamente como antes —
  nenhum código existente precisou mudar) — só fica visualmente
  escondido (.gca-select-nativo). Por cima dele, um botão
  (.gca-select-trigger) mostra o valor atual, e uma lista própria
  (.gca-select-menu) substitui o popup nativo, 100% estilizável.

  Escopo: todo <select> do sistema, EXCETO <select multiple> (os 2
  seletores de membros de equipe em Administrador) — esses usam o
  atributo `size`, que já renderiza como uma caixa inline (não um
  popup do SO), então nunca tiveram o problema que este componente
  resolve; continuam nativos de propósito.
=====================================================*/

.gca-select{
    position:relative;
    display:block;
    width:100%;
}

/* O <select> original — mantido no DOM (todo o JS existente que lê/
   escreve .value, .selectedIndex, options, ou escuta "change" continua
   funcionando sem nenhuma mudança), só invisível. display:none não
   impede leitura/escrita de propriedades nem o disparo de eventos via
   dispatchEvent — só tira da renderização. */
.gca-select-nativo{
    display:none !important;
}

.gca-select-trigger{
    width:100%;
    height:46px;

    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;

    padding:0 14px;

    border:1px solid #d9d9d9;
    border-radius:10px;
    background:#fff;

    font-size:15px;
    font-family:inherit;
    color:#2F3640;
    text-align:left;

    cursor:pointer;
    transition:.2s;
}

.gca-select-trigger:hover{
    border-color:#bbb;
}

.gca-select-trigger:focus-visible{
    outline:2px solid #8B1E3F;
    outline-offset:1px;
}

.gca-select-trigger.aberto{
    border-color:#8B1E3F;
}

.gca-select-trigger:disabled{
    background:#f5f5f5;
    color:#888;
    cursor:not-allowed;
}

.gca-select-valor{
    flex:1;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.gca-select-valor.gca-select-placeholder{
    color:#999;
}

.gca-select-seta{
    width:16px;
    height:16px;
    flex-shrink:0;
    color:#999;
    transition:transform .15s ease;
}

.gca-select-trigger.aberto .gca-select-seta{
    transform:rotate(180deg);
}

.gca-select-menu{
    position:absolute;
    z-index:60;

    top:calc(100% + 6px);
    left:0;
    right:0;

    max-height:264px;
    overflow-y:auto;

    margin:0;
    padding:6px;

    list-style:none;

    background:#fff;
    border:1px solid #e2e2e2;
    border-radius:10px;
    box-shadow:0 14px 30px rgba(0,0,0,.14);

    animation:gcaSelectAbrir .12s ease;
}

@keyframes gcaSelectAbrir{
    from{ opacity:0; transform:translateY(-4px); }
    to{ opacity:1; transform:translateY(0); }
}

.gca-select-menu[hidden]{
    display:none;
}

/* Abre pra cima quando não há espaço embaixo (classe aplicada via JS,
   ver calcularDirecaoMenu em js/gca-select.js). */
.gca-select-menu.gca-select-para-cima{
    top:auto;
    bottom:calc(100% + 6px);
}

.gca-select-opcao{
    padding:9px 12px;
    border-radius:7px;

    font-size:14px;
    color:#2F3640;

    cursor:pointer;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.gca-select-opcao:hover,
.gca-select-opcao.gca-select-destacada{
    background:#f5f5f5;
}

.gca-select-opcao.gca-select-selecionada{
    background:#fbe1e6;
    color:#8B0000;
    font-weight:600;
}

.gca-select-opcao[aria-disabled="true"]{
    color:#bbb;
    cursor:not-allowed;
    background:transparent;
}

.gca-select-vazio{
    padding:12px;
    font-size:13px;
    color:#999;
    text-align:center;
}


/* ===========================
   DARK PREMIUM
=========================== */

[data-theme="dark-premium"] .gca-select-trigger{
    background:var(--gca-fundo-elevado);
    border-color:var(--gca-borda-sutil);
    color:var(--gca-texto-principal);
}

[data-theme="dark-premium"] .gca-select-trigger:hover{
    border-color:var(--gca-borda-sutil);
    background:var(--gca-fundo-elevado-hover);
}

[data-theme="dark-premium"] .gca-select-trigger.aberto{
    border-color:#E63950;
}

[data-theme="dark-premium"] .gca-select-trigger:disabled{
    background:var(--gca-fundo-app);
    color:var(--gca-texto-terciario);
}

[data-theme="dark-premium"] .gca-select-valor.gca-select-placeholder{
    color:var(--gca-texto-terciario);
}

[data-theme="dark-premium"] .gca-select-seta{
    color:var(--gca-texto-terciario);
}

[data-theme="dark-premium"] .gca-select-menu{
    background:var(--gca-fundo-flutuante);
    border-color:var(--gca-borda-sutil);
    box-shadow:0 20px 44px rgba(0,0,0,.5);
}

[data-theme="dark-premium"] .gca-select-opcao{
    color:var(--gca-texto-principal);
}

[data-theme="dark-premium"] .gca-select-opcao:hover,
[data-theme="dark-premium"] .gca-select-opcao.gca-select-destacada{
    background:var(--gca-fundo-elevado-hover);
}

[data-theme="dark-premium"] .gca-select-opcao.gca-select-selecionada{
    background:rgba(230,57,80,.18);
    color:#f28b9b;
}

[data-theme="dark-premium"] .gca-select-opcao[aria-disabled="true"]{
    color:var(--gca-texto-terciario);
}

[data-theme="dark-premium"] .gca-select-vazio{
    color:var(--gca-texto-terciario);
}