/* ---------------------------------------------------------------------------
   Filtros dos "Originadores cadastrados" — `originadores_cad_layout`
   (`layouts/erp/originadores_fidc.py`), usado na aba Cadastros da Gestao FIDC e na
   tela Originadores. O mesmo painel veste os filtros da aba Processamento das
   Antecipacoes gerenciais (`load_coll`, `callbacks_antecipacoes_gerenciais.py`), que
   tambem ganha aqui o cartao de acoes (fim do arquivo).

   O cartao e os chips sao os da aba Processamento (`.painel_filtros_caixa_v2`,
   `.chips_caixa_v2`, em `tema_gestao_caixa_v2.css`) e os botoes do cabecalho sao os
   `.btn_filtros_v2` do Historico. Aqui entra so o que o painel de la nao tem: os
   campos sao `dbc.Input` (o de la so veste Mantine), o bloco do adm e o rodape.

   Carrega depois de `tema_gestao_caixa_v2.css` e `tema_historico_v2.css` (ordem
   alfabetica), entao pode refinar as classes de la sem `!important`.
   --------------------------------------------------------------------------- */

/* Os mesmos 40px / radius 10 dos inputs Mantine do painel da Processamento. */
.painel_filtros_og_v2 .form-control {
    height: 40px;
    border-radius: 10px;
    border-color: var(--v-borda-input);
    background: #fff;
    font: 600 13px Manrope, sans-serif;
    color: var(--v-tab-texto);
}

.painel_filtros_og_v2 .form-control::placeholder {
    color: #93A6A0;
}

/* Sem o `hidden`, os dois campos do adm viram itens da grade do painel, como se
   fossem filhos diretos — assim eles fluem junto com os outros em vez de ocupar uma
   linha propria. O `[hidden]` do bootstrap e `!important`, entao continua vencendo. */
.filtros_adm_og_v2 {
    display: contents;
}

/* Os quatro chips de situacao nao cabem numa coluna de 220px. */
.campo_largo_og_v2 {
    grid-column: span 2;
}

.rodape_filtros_og_v2 {
    grid-column: 1 / -1;
    display: flex;
    justify-content: flex-end;
}

/* Estreito: a grade cai para uma coluna e o `span 2` abriria uma coluna implicita. */
@media (max-width: 575px) {
    .campo_largo_og_v2 {
        grid-column: auto;
    }
}

/* ============================================================ ACOES DO PROCESSAMENTO

   Antecipacoes gerenciais, aba Processamento: tres grupos (webhooks, configuracoes,
   forcar processamento) lado a lado, separados por divisoria, que empilham quando a
   linha nao comporta. Cartao branco com borda — e o `cartao_resumo_v2` sem o titulo —
   para nao se confundir com o painel de filtros tintado logo abaixo. */
.cartao_acoes_ag_v2 {
    display: flex;
    flex-wrap: wrap;
    gap: 18px 0;
    padding: 16px 0;
    border: 1px solid var(--v-borda-clara);
    border-radius: 10px;
}

.grupo_acao_ag_v2 {
    display: flex;
    flex-direction: column;
    padding: 0 22px;
}

.grupo_acao_ag_v2 + .grupo_acao_ag_v2 {
    border-left: 1px solid var(--v-tab-divisoria);
}

.nota_acao_ag_v2 {
    margin: -2px 0 10px;
}

.botoes_acao_ag_v2 {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

/* Forma do `btn_acao_hist_v2` em 38px: aqui sao varios lado a lado. A cor vem do
   `.btn-primary` / `.btn-outline-primary` do tema. */
.btn_acao_ag_v2.btn {
    display: inline-flex;
    align-items: center;
    height: 38px;
    padding: 0 16px;
    border-radius: 10px;
    font: 800 13px Manrope, sans-serif;
}

/* Estreito: sem divisoria vertical, que ficaria pendurada na ponta de cada linha. */
@media (max-width: 767.98px) {
    .grupo_acao_ag_v2 + .grupo_acao_ag_v2 {
        border-left: 0;
        padding-top: 16px;
        border-top: 1px solid var(--v-tab-divisoria);
    }

    .cartao_acoes_ag_v2 {
        flex-direction: column;
        gap: 16px;
    }
}

/* ============================================================ AVISOS (Atencao)

   `cartao_aviso_v2` ambar nos dois avisos das Antecipacoes gerenciais: o de convenio
   nao configurado (`load_warnings_originadores`, acima das sub-abas) e o de pedidos /
   KYIV I (`load_status_pedidos`, dentro do Processamento). O cartao ocupa a largura
   toda — sem isto ele encolhe para o tamanho do texto. */
.aviso_ag_v2 {
    width: 100%;
    box-sizing: border-box;
}

.aviso_ag_v2 .corpo_aviso_v2,
.aviso_ag_v2 > div:not(.icone_aviso_v2) {
    flex: 1;
    min-width: 0;
}

/* Mensagem + "Ver": o botao na ponta direita da linha, como acao da mensagem. */
.linha_aviso_ag_v2 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.linha_aviso_ag_v2 + .linha_aviso_ag_v2 {
    padding-top: 8px;
    border-top: 1px solid var(--v-aviso-borda);
}

.btn_aviso_ag_v2.btn {
    height: 30px;
    padding: 0 14px;
    border-radius: 8px;
    background: #fff;
    font: 800 12px Manrope, sans-serif;
}

/* ---------------------------------------------------------------------------
   Modal de config do originador — `modal_actions_layout` em
   `load_originadores_cadastrados` (`callbacks_originadores_fidc.py`). Handoff
   `handoff_modal_termo`.

   A casca e a do modal de Remessas (`.painel_modal_remessas_v2`,
   `.cabecalho_modal_remessas_v2`, em `tema_solicitacoes_v2.css`): corpo em fundo cinza.
   Para adm, as sub-abas sao as chips do `gen_inner_tabs_layout`; cada sub-aba — ou o
   modal inteiro, para quem nao e adm — e um cartao branco com os blocos separados por
   borda (Spread, Conta atual, Termo de cessao, Representantes).
   --------------------------------------------------------------------------- */

.conteudo_config_og_v2 {
    font-family: Manrope, sans-serif;
}

/* Vazio ate o `load_body_modal_actions` responder: sem altura o loader do `dcc.Loading`
   nao teria onde aparecer, e o modal abriria como uma faixa fina. */
.corpo_modal_og_v2:empty {
    min-height: 320px;
}

/* Conta e termo carregam em callbacks proprios, depois do corpo: a altura minima guarda
   o lugar do loader de cada um. */
.corpo_conta_og_v2:empty {
    min-height: 46px;
}

.corpo_termo_og_v2:empty {
    min-height: 140px;
}

.cartao_config_og_v2 {
    padding: 22px;
    border: 1px solid var(--v-borda-clara);
    border-radius: 10px;
    background: #fff;
}

/* `+` e nao `:not(:first-child)`: bloco que nao existe nem entra no DOM, entao a borda
   aparece so entre os que existem. */
.cartao_config_og_v2 > .bloco_config_og_v2 + .bloco_config_og_v2 {
    margin-top: 22px;
    padding-top: 22px;
    border-top: 1px solid var(--v-tab-divisoria);
}

/* ------------------------------------------------ Configuracoes (spread e cia.) */

/* O divisor e o mesmo do simulador (`.cartao_v2 > div ~ div > .cabecalho_secao_v2`,
   `tema_simulador_v2.css`), estendido para este container. */
.secoes_config_og_v2 > div:not(.hidden) ~ div:not(.hidden) > .cabecalho_secao_v2 {
    border-top: 1px solid var(--v-tab-divisoria);
    margin-top: 22px;
    padding-top: 22px;
}

.grupo_rebate_og_v2 {
    max-width: 24rem;
}

.aviso_secao_og_v2 {
    display: block;
    margin-bottom: 10px;
    font: 500 12.5px Manrope, sans-serif;
    color: var(--v-erro-texto);
}

/* ------------------------------------------------ campos e botoes do Bootstrap */

/* No desenho do handoff (42px, raio 10, Manrope), como os `.form_conta_v2` do cadastro.
   So o estado padrao: o `btn-success`/`btn-danger` que os callbacks de salvar poem
   depois do clique continua com a cor do Bootstrap. */
.conteudo_config_og_v2 .form-control,
.conteudo_config_og_v2 .form-select,
.conteudo_config_og_v2 .input-group-text {
    height: 42px;
    font: 600 14px Manrope, sans-serif;
}

.conteudo_config_og_v2 .form-control,
.conteudo_config_og_v2 .form-select {
    border-color: var(--v-borda-input);
    border-radius: 10px;
    color: var(--v-tab-texto);
}

.conteudo_config_og_v2 .form-control:focus,
.conteudo_config_og_v2 .form-select:focus {
    border-color: var(--v-verde-escuro);
    box-shadow: 0 0 0 3px var(--v-tint);
}

.conteudo_config_og_v2 .input-group-text {
    border-color: var(--v-borda-input);
    background: var(--v-tab-cabecalho);
    font-size: 13px;
    color: var(--v-texto-inativo);
}

.conteudo_config_og_v2 .input-group > .form-control {
    border-radius: 10px 0 0 10px;
}

.conteudo_config_og_v2 .btn-primary {
    height: 42px;
    padding: 0 18px;
    border-color: var(--v-verde-escuro);
    border-radius: 10px;
    background: var(--v-verde-escuro);
    font: 800 13.5px Manrope, sans-serif;
}

.conteudo_config_og_v2 .input-group > .btn-primary {
    border-radius: 0 10px 10px 0;
}

.conteudo_config_og_v2 .btn-primary:hover,
.conteudo_config_og_v2 .btn-primary:focus {
    border-color: var(--v-marca-hover);
    background: var(--v-marca-hover);
}

/* ------------------------------------------------ termo de cessao */

.cabecalho_termo_og_v2 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}

.titulo_termo_og_v2 {
    display: flex;
    align-items: center;
    gap: 10px;
}

.badge_termo_og_v2 {
    display: inline-flex;
    align-items: center;
    padding: 5px 10px;
    border: 1px solid;
    border-radius: 14px;
    font: 700 12px Manrope, sans-serif;
    white-space: nowrap;
}

.badge_pend_og_v2 {
    border-color: var(--v-aviso-borda);
    background: var(--v-aviso-fundo);
    color: #8A6A1F;
}

.badge_ok_og_v2 {
    border-color: var(--v-borda-tint);
    background: var(--v-tint);
    color: var(--v-verde-escuro);
}

.link_termo_og_v2 {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font: 700 13px Manrope, sans-serif;
    color: var(--v-verde-escuro);
    text-decoration: none;
    white-space: nowrap;
}

.link_termo_og_v2:hover {
    color: var(--v-marca-hover);
}

.subtitulo_termo_og_v2 {
    margin: 0;
    font: 700 12px Manrope, sans-serif;
    color: var(--v-texto-inativo);
}

.linha_select_termo_og_v2 {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 14px;
}

.select_termo_og_v2 {
    flex: 1;
    max-width: 480px;
}

.vazio_termo_og_v2 {
    font: 500 13px Manrope, sans-serif;
    color: #93A6A0;
}

.flex_1_og_v2 {
    flex: 1;
    min-width: 0;
}

/* callouts */

.callout_aviso_og_v2,
.callout_ok_og_v2 {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 18px 20px;
    border: 1px solid;
    border-radius: 10px;
}

.callout_aviso_og_v2 {
    border-color: var(--v-aviso-borda);
    background: var(--v-aviso-fundo);
}

.callout_compacto_og_v2 {
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
    padding: 14px 18px;
}

.callout_ok_og_v2 {
    align-items: center;
    flex-wrap: wrap;
    padding: 16px 20px;
    border-color: var(--v-borda-tint);
    background: var(--v-tint);
}

.icone_aviso_og_v2 {
    flex: none;
    margin-top: 2px;
    color: var(--v-aviso-icone);
}

.callout_compacto_og_v2 .icone_aviso_og_v2 {
    margin-top: 0;
}

.icone_ok_og_v2 {
    flex: none;
    color: var(--v-verde-escuro);
}

.titulo_callout_og_v2 {
    font: 800 14px Manrope, sans-serif;
    color: var(--v-tab-texto);
}

.titulo_callout_og_v2.aviso_og_v2 {
    color: var(--v-aviso-forte);
}

.texto_aviso_og_v2 {
    margin-top: 4px;
    font: 500 13px/1.55 Manrope, sans-serif;
    color: var(--v-aviso-texto);
}

.callout_compacto_og_v2 .texto_aviso_og_v2 {
    margin-top: 0;
}

.texto_aviso_og_v2 b {
    color: var(--v-aviso-forte);
}

.texto_ok_og_v2 {
    margin-top: 2px;
    font: 500 12.5px Manrope, sans-serif;
    color: var(--v-texto-inativo);
}

/* signatario (avatar + nome + papel + e-mail) */

.signatario_termo_og_v2 {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    text-align: left;
}

.avatar_termo_og_v2 {
    display: flex;
    flex: none;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: var(--v-tint);
    font: 800 12px Manrope, sans-serif;
    color: var(--v-verde-escuro);
}

.avatar_g_og_v2 {
    width: 38px;
    height: 38px;
    font-size: 13px;
}

.dados_signatario_og_v2 {
    min-width: 0;
}

.nome_termo_og_v2 {
    font: 800 13px Manrope, sans-serif;
    color: var(--v-tab-texto);
}

.avatar_g_og_v2 + .dados_signatario_og_v2 .nome_termo_og_v2 {
    font-size: 13.5px;
}

.papel_termo_og_v2 {
    margin-left: 4px;
    font: 600 11.5px Manrope, sans-serif;
    color: var(--v-tab-texto-sub);
}

/* Na tabela do adm o papel e uma linha propria: nome // papel // e-mail. */
.papel_linha_og_v2 {
    margin: 1px 0 0;
    text-transform: capitalize;
}

.email_termo_og_v2 {
    margin-top: 2px;
    overflow: hidden;
    font: 500 12px Manrope, sans-serif;
    color: var(--v-tab-texto-sub);
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* pendente - visao cedente */

.linha_pendente_og_v2 {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
    margin-top: 16px;
    padding: 12px 14px;
    border: 1px solid var(--v-aviso-borda);
    border-radius: 10px;
    background: #fff;
}

.linha_pendente_og_v2 .signatario_termo_og_v2 {
    flex: 1;
}

.gerado_termo_og_v2 {
    font: 500 12px Manrope, sans-serif;
    color: #93A6A0;
    white-space: nowrap;
}

.acoes_pendente_og_v2 {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 14px;
}

.btn_prim_og_v2 {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 40px;
    padding: 0 16px;
    border-radius: 10px;
    background: var(--v-verde-escuro);
    font: 800 13px Manrope, sans-serif;
    color: #fff;
    text-decoration: none;
}

.btn_prim_og_v2:hover {
    background: var(--v-marca-hover);
    color: #fff;
}

.icone_branco_og_v2 {
    color: #fff;
}

.btn_sec_og_v2 {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 40px;
    margin: 0;
    padding: 0 14px;
    border: 1px solid var(--v-borda-tint);
    border-radius: 10px;
    background: #fff;
    font: 800 13px Manrope, sans-serif;
    color: var(--v-verde-escuro);
    cursor: pointer;
    white-space: nowrap;
}

.btn_sec_og_v2:hover {
    background: var(--v-tint);
}

.btn_p_og_v2 {
    height: 34px;
    padding: 0 12px;
    font-size: 12.5px;
}

/* Lembrete ja enviado: o callback desabilita o botao e troca o texto por "Enviado". */
.btn_enviado_og_v2,
.btn_enviado_og_v2:hover {
    border-color: var(--v-borda-tint);
    background: var(--v-tint);
    color: var(--v-verde-escuro);
    cursor: default;
}

/* O `dcc.Clipboard` fica invisivel por cima do botao inteiro: clicar em qualquer ponto
   copia. O icone e o do botao (Tabler) — o do Clipboard e Font Awesome, que o portal
   nao carrega. */
.btn_copiar_og_v2 .clip_og_v2 {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
}

.acoes_ok_og_v2 {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}

.url_termo_og_v2 {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    font: 500 12px Manrope, sans-serif;
    color: #93A6A0;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* pendente - visao adm: tabela de signatarios */

.tabela_sig_og_v2 {
    overflow: hidden;
    border: 1px solid var(--v-tab-divisoria);
    border-radius: 10px;
}

.linha_sig_og_v2 {
    display: grid;
    grid-template-columns: 1.6fr 1fr 1fr 1.1fr 1fr;
    gap: 12px;
    align-items: center;
    padding: 14px 18px;
    border-top: 1px solid var(--v-tab-divisoria);
    font: 600 13px Manrope, sans-serif;
    color: var(--v-tab-texto);
    text-align: center;
}

.linha_sig_og_v2 > div:not(.signatario_termo_og_v2) {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.cabecalho_sig_og_v2 {
    padding: 12px 18px;
    border-top: 0;
    background: var(--v-tab-cabecalho);
    font: 800 13px Manrope, sans-serif;
    color: var(--v-verde-escuro);
}

.cabecalho_sig_og_v2 > div:first-child {
    align-items: center;
}

.auth_sig_og_v2 {
    font: 600 12.5px Manrope, sans-serif;
    color: var(--v-texto-inativo);
}

.hora_sig_og_v2 {
    margin-top: 2px;
    font: 500 12px Manrope, sans-serif;
    color: var(--v-tab-texto-sub);
}

.acoes_sig_og_v2 {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}

.acoes_sig_og_v2 .link_termo_og_v2 {
    font-size: 12px;
}

/* alterar autenticacao (adm) */

.auth_termo_og_v2 {
    margin-top: 16px;
}

.linha_auth_og_v2 {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 8px;
}

.campo_auth_og_v2 {
    flex: 1 1 220px;
    max-width: 320px;
}

/* ------------------------------------------------ representantes (adm) */

.link_editar_rep_og_v2 {
    display: inline-block;
    margin-top: 14px;
}

.form_rep_og_v2 {
    margin-top: 14px;
    padding: 18px;
    border: 1px solid var(--v-tab-divisoria);
    border-radius: 10px;
    background: var(--v-tab-hover);
}

.rotulo_campo_og_v2 {
    display: block;
    margin-bottom: 6px;
    font: 700 12px Manrope, sans-serif;
    color: var(--v-texto-inativo);
}

.grade_rep_og_v2 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 14px;
    margin-bottom: 14px;
}

/* Tabela de representantes (`dbc.Table.from_dataframe` do `update_table_rep_originadores`). */
.conteudo_config_og_v2 .table {
    overflow: hidden;
    margin-bottom: 0;
    border: 1px solid var(--v-tab-divisoria);
    border-radius: 10px;
    border-collapse: separate;
    border-spacing: 0;
    font: 600 13px Manrope, sans-serif;
}

.conteudo_config_og_v2 .table th {
    border: 0;
    background: var(--v-tab-cabecalho);
    font: 800 13px Manrope, sans-serif;
    color: var(--v-verde-escuro);
}

.conteudo_config_og_v2 .table td {
    border-width: 1px 0 0;
    border-color: var(--v-tab-divisoria);
    color: var(--v-tab-texto);
}

@media (max-width: 767.98px) {
    .cartao_config_og_v2 {
        padding: 16px;
    }

    .linha_sig_og_v2 {
        grid-template-columns: 1fr;
        text-align: left;
    }

    .linha_sig_og_v2 > div:not(.signatario_termo_og_v2) {
        align-items: flex-start;
    }

    .cabecalho_sig_og_v2 {
        display: none;
    }

    .grade_rep_og_v2 {
        grid-template-columns: 1fr;
    }
}
