/*!
 * BhnSelect — estilos (prefixo "bhs-", sem conflito com Bootstrap/AdminLTE/multiselect-bs4).
 */
.bhs {
    --bhs-bg: #ffffff;
    --bhs-borda: #d9d7d0;
    --bhs-borda-hover: #b9b6ad;
    --bhs-texto: #1f1f1d;
    --bhs-mudo: #898781;
    --bhs-hover: #f3f2ee;
    --bhs-sel: #eaf2fc;
    --bhs-acc: #2a78d6;
    --bhs-sombra: 0 10px 30px rgba(0, 0, 0, .14);
    position: relative;
    width: 100%;
    font-size: .8rem;
}
body.dark-mode .bhs {
    --bhs-bg: #2b2f33;
    --bhs-borda: #454a50;
    --bhs-borda-hover: #5d636a;
    --bhs-texto: #f1f1f1;
    --bhs-mudo: #a5a8ab;
    --bhs-hover: #353a3f;
    --bhs-sel: #24364d;
    --bhs-acc: #3987e5;
    --bhs-sombra: 0 10px 30px rgba(0, 0, 0, .45);
}
.bhs [hidden] { display: none !important; }
select.bhs-nativo { display: none !important; }

/* ---------- gatilho ---------- */
.bhs-gatilho {
    width: 100%;
    height: 31px;
    display: flex;
    align-items: center;
    gap: .4rem;
    padding: 0 .55rem 0 .7rem;
    background: var(--bhs-bg);
    border: 1px solid var(--bhs-borda);
    border-radius: 8px;
    color: var(--bhs-texto);
    font-size: inherit;
    text-align: left;
    cursor: pointer;
    transition: border-color .15s, box-shadow .15s;
}
.bhs-gatilho:hover { border-color: var(--bhs-borda-hover); }
.bhs-gatilho:focus, .bhs.aberto .bhs-gatilho { outline: none; border-color: var(--bhs-acc); box-shadow: 0 0 0 3px var(--bhs-anel); }
.bhs-valor { flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 500; }
.bhs-valor.bhs-ph { color: var(--bhs-mudo); font-weight: 400; }
.bhs-badge { display: inline-block; min-width: 20px; padding: 0 6px; margin-left: 5px; border-radius: 9px; background: var(--bhs-grad); color: #fff; font-size: .66rem; font-weight: 700; line-height: 17px; text-align: center; vertical-align: 1px; }
.bhs-limpar { flex: 0 0 auto; width: 18px; height: 18px; border-radius: 50%; color: var(--bhs-mudo); font-size: 1rem; line-height: 17px; text-align: center; }
.bhs-limpar:hover { color: var(--bhs-texto); background: var(--bhs-hover); }
.bhs-seta { flex: 0 0 auto; width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 5px solid var(--bhs-mudo); transition: transform .15s; }
.bhs.aberto .bhs-seta { transform: rotate(180deg); }
.bhs.bhs-tem-valor .bhs-gatilho { border-color: var(--bhs-borda-valor); }

/* ---------- painel ---------- */
.bhs-painel {
    position: absolute;
    left: 0;
    top: calc(100% + 4px);
    z-index: 1060;
    min-width: 100%;
    width: max-content;
    max-width: 420px;
    background: var(--bhs-bg);
    border: 1px solid var(--bhs-borda);
    border-radius: 10px;
    box-shadow: var(--bhs-sombra);
    overflow: hidden;
    animation: bhsAbre .14s ease-out;
}
.bhs-painel.acima { top: auto; bottom: calc(100% + 4px); }
.bhs-painel.direita { left: auto; right: 0; }
@keyframes bhsAbre { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }

.bhs-busca { position: relative; padding: .5rem .5rem .35rem; }
.bhs-busca > i { position: absolute; left: 1rem; top: 50%; transform: translateY(-38%); color: var(--bhs-mudo); font-size: .72rem; }
.bhs-busca-input { width: 100%; height: 30px; padding: 0 1.8rem; border: 1px solid var(--bhs-borda); border-radius: 6px; background: var(--bhs-bg); color: var(--bhs-texto); font-size: .78rem; }
.bhs-busca-input:focus { outline: none; border-color: var(--bhs-acc); box-shadow: 0 0 0 2px var(--bhs-anel); }
.bhs-busca-limpar { position: absolute; right: .85rem; top: 50%; transform: translateY(-38%); border: 0; background: none; color: var(--bhs-mudo); font-size: 1rem; line-height: 1; cursor: pointer; }

.bhs-acoes { display: flex; align-items: center; gap: .2rem; padding: 0 .5rem .35rem; border-bottom: 1px solid var(--bhs-hover); }
.bhs-acao { border: 0; background: none; color: var(--bhs-acc); font-size: .7rem; font-weight: 600; padding: .12rem .4rem; border-radius: 4px; cursor: pointer; }
.bhs-acao:hover { background: var(--bhs-sel); }
.bhs-contagem { margin-left: auto; font-size: .66rem; color: var(--bhs-mudo); white-space: nowrap; }

.bhs-lista { max-height: 300px; overflow-y: auto; padding: .25rem 0 .35rem; }
.bhs-grupo + .bhs-grupo, .bhs-opcao + .bhs-grupo { border-top: 1px solid var(--bhs-hover); margin-top: .2rem; padding-top: .2rem; }
.bhs-grupo-cab { display: flex; align-items: center; gap: .5rem; padding: .3rem .7rem; font-size: .64rem; font-weight: 700; text-transform: uppercase; letter-spacing: .35px; color: var(--bhs-mudo); cursor: pointer; outline: none; }
.bhs-unico .bhs-grupo-cab { cursor: default; }
.bhs-grupo-cont { margin-left: auto; font-weight: 600; letter-spacing: 0; }
.bhs-opcao { display: flex; align-items: center; gap: .55rem; padding: .32rem .7rem; color: var(--bhs-texto); white-space: nowrap; cursor: pointer; outline: none; }
.bhs-opcao[data-g] { padding-left: 1.35rem; }
.bhs-opcao:hover, .bhs-opcao.foco, .bhs-grupo-cab:hover, .bhs-grupo-cab.foco { background: var(--bhs-hover); }
.bhs-opcao.sel { background: var(--bhs-sel); }
.bhs-opcao.sel:hover, .bhs-opcao.sel.foco { background: var(--bhs-sel-forte); }
.bhs-opcao.desab { opacity: .45; pointer-events: none; }
.bhs-texto mark { background: rgba(250, 178, 25, .38); color: inherit; padding: 0; border-radius: 2px; }
.bhs-vazio { padding: .8rem; text-align: center; color: var(--bhs-mudo); font-size: .75rem; }

/* ---------- caixinha (check) ---------- */
.bhs-check { position: relative; flex: 0 0 16px; width: 16px; height: 16px; border: 1.5px solid var(--bhs-borda-hover); border-radius: 4px; background: var(--bhs-bg); transition: background .12s, border-color .12s; }
.bhs-unico .bhs-check { border-radius: 50%; }
.bhs-opcao.sel > .bhs-check, .bhs-grupo-cab.tudo > .bhs-check { background: var(--bhs-grad); border-color: transparent; }
.bhs-opcao.sel > .bhs-check::after, .bhs-grupo-cab.tudo > .bhs-check::after { content: ''; position: absolute; left: 4.5px; top: 1.5px; width: 4px; height: 8px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.bhs-unico .bhs-opcao.sel > .bhs-check::after { left: 3.5px; top: 3.5px; width: 6px; height: 6px; border: 0; border-radius: 50%; background: #fff; transform: none; }
.bhs-grupo-cab.parte > .bhs-check { border-color: var(--bhs-acc); }
.bhs-grupo-cab.parte > .bhs-check::after { content: ''; position: absolute; left: 3px; right: 3px; top: 5.5px; height: 2px; border-radius: 1px; background: var(--bhs-acc); }

/* ---------- v2: recolher grupos, "só este", ver marcados, inverter, balão do +N ---------- */
.bhs-grupo-seta { flex: 0 0 auto; width: 14px; height: 14px; margin: 0 -2px 0 -4px; border-radius: 3px; position: relative; cursor: pointer; }
.bhs-grupo-seta::before { content: ''; position: absolute; left: 4px; top: 3px; width: 5px; height: 5px; border: solid var(--bhs-mudo); border-width: 0 1.5px 1.5px 0; transform: rotate(45deg); transition: transform .15s; }
.bhs-grupo-seta:hover { background: var(--bhs-borda); }
.bhs-grupo.recolhido .bhs-grupo-seta::before { transform: rotate(-45deg); left: 3px; top: 4px; }
.bhs-grupo.recolhido .bhs-opcao { display: none; }
.bhs-painel.filtrando .bhs-grupo.recolhido .bhs-opcao:not([hidden]) { display: flex; }

.bhs-opcao .bhs-texto { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.bhs-so { flex: 0 0 auto; visibility: hidden; border: 0; background: var(--bhs-bg); color: var(--bhs-acc); font-size: .64rem; font-weight: 700; padding: 1px 7px; border-radius: 9px; box-shadow: 0 0 0 1px var(--bhs-borda-valor); cursor: pointer; }
.bhs-opcao:hover .bhs-so, .bhs-opcao.foco .bhs-so { visibility: visible; }
.bhs-so:hover { background: var(--bhs-grad); color: #fff; }

.bhs-ver-marcados { margin-left: auto; color: var(--bhs-mudo); font-weight: 500; }
.bhs-ver-marcados .bhs-contagem { margin: 0; }
.bhs-ver-marcados.ativo { background: var(--bhs-grad); color: #fff; }
.bhs-ver-marcados:disabled { opacity: .5; cursor: default; background: none; }

.bhs-pop { position: absolute; left: 0; top: calc(100% + 6px); z-index: 1061; min-width: 220px; max-width: 360px; padding: .45rem .6rem; background: var(--bhs-bg); border: 1px solid var(--bhs-borda); border-radius: 8px; box-shadow: var(--bhs-sombra); font-size: .74rem; color: var(--bhs-texto); pointer-events: none; animation: bhsAbre .12s ease-out; }
.bhs-pop-tit { font-size: .62rem; font-weight: 700; text-transform: uppercase; letter-spacing: .3px; color: var(--bhs-mudo); margin-bottom: .2rem; }
.bhs-pop-grupo { padding: .12rem 0; border-top: 1px dashed var(--bhs-hover); line-height: 1.35; }
.bhs-pop-grupo b { display: block; font-size: .64rem; color: var(--bhs-mudo); text-transform: uppercase; letter-spacing: .3px; }

/* balão só no "+N": o badge vira o alvo (com ⓘ) */
.bhs-badge { cursor: help; }
.bhs-badge i { margin-left: 3px; font-size: .58rem; opacity: .85; }
.bhs-badge:hover { filter: brightness(.9); }

/* ---------- temas de cor (data-cor no select ou opção "cor") ----------
   Variáveis usadas: --bhs-acc (cor de texto/borda), --bhs-grad (preenchimento: caixinha, +N,
   botões ativos), --bhs-sel / --bhs-sel-forte (fundo da linha marcada), --bhs-anel (foco),
   --bhs-borda-valor (borda do gatilho com seleção). Cor livre (#hex) é aplicada inline pelo JS. */
.bhs {
    --bhs-grad: linear-gradient(135deg, #2a78d6, #3f8be0);
    --bhs-sel-forte: rgba(42, 120, 214, .16);
    --bhs-anel: rgba(42, 120, 214, .16);
    --bhs-borda-valor: rgba(42, 120, 214, .45);
}
.bhs.bhs-cor-quente {
    --bhs-acc: #d9480f;
    --bhs-grad: linear-gradient(135deg, #e03131 0%, #f76707 50%, #fab005 100%);
    --bhs-sel: #fff4e6;
    --bhs-sel-forte: #ffe8cc;
    --bhs-anel: rgba(247, 103, 7, .18);
    --bhs-borda-valor: rgba(247, 103, 7, .5);
}
.bhs.bhs-cor-frio {
    --bhs-acc: #1c4f8f;
    --bhs-grad: linear-gradient(135deg, #0b3d79 0%, #2a78d6 55%, #74b3f2 100%);
    --bhs-sel: #e7f1fc;
    --bhs-sel-forte: #d3e5f8;
    --bhs-anel: rgba(28, 79, 143, .18);
    --bhs-borda-valor: rgba(28, 79, 143, .45);
}
.bhs.bhs-cor-verde {
    --bhs-acc: #1f7a3a;
    --bhs-grad: linear-gradient(135deg, #0d5c2c 0%, #2f9e44 55%, #8ce99a 100%);
    --bhs-sel: #ebfbee;
    --bhs-sel-forte: #d3f9d8;
    --bhs-anel: rgba(47, 158, 68, .18);
    --bhs-borda-valor: rgba(47, 158, 68, .5);
}
body.dark-mode .bhs.bhs-cor-quente { --bhs-acc: #ff922b; --bhs-sel: #3a2a1c; --bhs-sel-forte: #4a321d; }
body.dark-mode .bhs.bhs-cor-frio { --bhs-acc: #74b3f2; --bhs-sel: #1d2e44; --bhs-sel-forte: #22395a; }
body.dark-mode .bhs.bhs-cor-verde { --bhs-acc: #69db7c; --bhs-sel: #1c3324; --bhs-sel-forte: #20402b; }

/* ---------- árvore: filhos recuados sob o nome do grupo + linha-guia ----------
   Cabeçalho do grupo: padding .7rem + seta (14px, margens -4/-2) + gap .5rem → caixinha do pai
   começa em ~27px (centro ~35px) e o nome em ~51px. Os filhos alinham a caixinha com o nome do pai. */
.bhs-opcao[data-g] { position: relative; padding-left: 3.2rem; }
.bhs-opcao[data-g]::before {            /* linha vertical saindo da caixinha do pai */
    content: '';
    position: absolute;
    left: 35px;
    top: 0;
    bottom: 0;
    border-left: 1.5px solid var(--bhs-borda);
}
.bhs-opcao[data-g]::after {             /* cotovelo até a caixinha do filho */
    content: '';
    position: absolute;
    left: 35px;
    top: 50%;
    width: 11px;
    border-top: 1.5px solid var(--bhs-borda);
}
.bhs-grupo .bhs-opcao[data-g]:last-of-type::before { bottom: 50%; }   /* último filho fecha a linha */
.bhs-unico .bhs-opcao[data-g] { padding-left: 2.6rem; }
.bhs-unico .bhs-opcao[data-g]::before, .bhs-unico .bhs-opcao[data-g]::after { left: 20px; }

/* ---------- ✓ centralizado na caixinha ---------- */
.bhs-opcao.sel > .bhs-check::after, .bhs-grupo-cab.tudo > .bhs-check::after {
    left: 50%;
    top: 50%;
    width: 4.5px;
    height: 8.5px;
    transform: translate(-50%, -58%) rotate(45deg);
}
.bhs-grupo-cab.parte > .bhs-check::after { left: 50%; right: auto; top: 50%; width: 8px; transform: translate(-50%, -50%); }

/* balão do +N: um item por linha, 2 colunas em grupos grandes */
.bhs-pop { min-width: 240px; max-width: 460px; }
.bhs-pop-grupo b small { font-weight: 600; letter-spacing: 0; text-transform: none; }
.bhs-pop-lista { list-style: none; margin: .15rem 0 .1rem; padding: 0; display: grid; grid-template-columns: 1fr; gap: 1px .9rem; }
.bhs-pop-lista.duas { grid-template-columns: 1fr 1fr; }
.bhs-pop-lista li { position: relative; padding-left: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.45; }
.bhs-pop-lista li::before { content: ''; position: absolute; left: 1px; top: 50%; width: 6px; height: 6px; margin-top: -3px; border-radius: 50%; background: var(--bhs-grad); }
.bhs-pop-mais { margin-top: .25rem; padding-top: .2rem; border-top: 1px dashed var(--bhs-hover); font-size: .66rem; color: var(--bhs-mudo); }

/* painel flutuante (portal no <body>): posição calculada pelo JS, nunca cortado por overflow */
.bhs.bhs-portal { position: fixed; left: 0; top: 0; width: 0; height: 0; z-index: 1070; }
.bhs.bhs-portal > .bhs-painel { position: fixed; right: auto; bottom: auto; }

/* ---------- tamanho alinhado ao form-control do Bootstrap 4 ----------
   padrão = .form-control (38px · 1rem · raio .25rem); .bhs-sm = .form-control-sm (31px);
   .bhs-lg = .form-control-lg (48px). O componente lê a classe do <select> original. */
.bhs { --bhs-alt: calc(2.25rem + 2px); --bhs-fonte: 1rem; --bhs-raio: .25rem; --bhs-pad: .75rem; font-size: .875rem; }
.bhs.bhs-sm { --bhs-alt: calc(1.5em + .5rem + 2px); --bhs-fonte: .875rem; --bhs-raio: .2rem; --bhs-pad: .5rem; font-size: .8rem; }
.bhs.bhs-lg { --bhs-alt: calc(1.5em + 1rem + 2px); --bhs-fonte: 1.25rem; --bhs-raio: .3rem; --bhs-pad: 1rem; font-size: 1rem; }
.bhs-gatilho { height: var(--bhs-alt); font-size: var(--bhs-fonte); border-radius: var(--bhs-raio); padding: 0 calc(var(--bhs-pad) - .2rem) 0 var(--bhs-pad); }
/* "Todos" (nenhum filtro) é um estado válido: cor normal de texto, como o select nativo */
.bhs-valor.bhs-ph { color: var(--bhs-texto); }
.bhs-valor { font-weight: 400; }   /* mesmo peso do texto do form-control nativo */

/* ---------- painel com tamanho de leitura fixo (não cresce com o form-control) ---------- */
.bhs-painel { font-size: .8rem; }
.bhs.bhs-lg .bhs-painel, .bhs.bhs-portal.bhs-lg > .bhs-painel { font-size: .875rem; }

/* ---------- escolha única: lista simples, linha escolhida destacada + ✓ à direita ---------- */
.bhs-unico .bhs-opcao { padding-right: .7rem; }
.bhs-unico .bhs-opcao.sel { color: var(--bhs-acc); font-weight: 600; }
.bhs-marca { flex: 0 0 auto; margin-left: auto; font-size: .7rem; color: var(--bhs-acc); visibility: hidden; }
.bhs-unico .bhs-opcao.sel .bhs-marca { visibility: visible; }
.bhs-unico .bhs-opcao[data-g] { padding-left: 2rem; }
.bhs-unico .bhs-opcao[data-g]::before, .bhs-unico .bhs-opcao[data-g]::after { left: 16px; }
.bhs-unico .bhs-opcao[data-g]::after { width: 8px; }

/* ---------- tipografia do painel (meio-termo): o grupo nunca fica menor que os itens ---------- */
.bhs-painel { font-size: .82rem; }
.bhs.bhs-lg .bhs-painel, .bhs.bhs-portal.bhs-lg > .bhs-painel { font-size: .9rem; }
.bhs-grupo-cab { font-size: .78rem; letter-spacing: .25px; color: var(--bhs-texto); opacity: .78; padding-top: .38rem; padding-bottom: .38rem; }
.bhs-grupo-cab:hover, .bhs-grupo-cab.tudo, .bhs-grupo-cab.parte { opacity: 1; }
.bhs-grupo-cont { font-size: .72rem; color: var(--bhs-mudo); }
.bhs-busca-input { font-size: .82rem; }
.bhs-acao { font-size: .74rem; }
.bhs-contagem { font-size: .7rem; }
.bhs-so { font-size: .66rem; }
.bhs-pop { font-size: .78rem; }
.bhs-pop-tit, .bhs-pop-grupo b { font-size: .7rem; }
.bhs-grupo-nome mark { background: rgba(250, 178, 25, .38); color: inherit; padding: 0; border-radius: 2px; }
