/* ---------------------------------------------------------------------------
   Aba Status (tickets) — handoff `status_operacao`.

   Monta em `gen_layout_operacoes` (`utils/common_operacoes.py`, o esqueleto), nos
   helpers de linha do mesmo arquivo (`badge_status_v2`, `anel_status_v2`,
   `acoes_status_v2`...), em `resumo_status_v2` (`utils/operacoes.py`, o card Resumo) e
   nos callbacks `load_status_op_layout` / `load_subtickets_pages`
   (`callbacks/callbacks_operacoes.py`, as linhas).

   O painel de filtros e o do Historico: a classe `filtros_hist_v2` traz o fundo cinza,
   os rotulos, os campos de 42px e as pills (`tema_historico_v2.css`). Este arquivo
   carrega depois dele (ordem alfabetica, h < s), por isso sobrescreve sem `!important`.

   Tokens: os `--v-*` de `tema_conteudo_v2.css`.
   --------------------------------------------------------------------------- */

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

.tela_status_v2 > * + * {
    margin-top: 14px;
}

/* ============================================================ FILTROS */

.filtros_status_v2 {
    margin-bottom: 0;
}

/* Intervalo de datas ("09-29-2026 – 09-29-2026") nao cabe nos 11rem do select de periodo
   do Historico. */
.campo_dt_status_v2 .mantine-Input-input {
    min-width: 15rem;
}

/* Segmentado (Agrupar por / Ordenar): caixa com borda, item ativo cheio de verde e um
   separador entre os itens. O indicador do Mantine e quem desliza por baixo do ativo. */
.segmentado_status_v2.mantine-SegmentedControl-root {
    padding: 0;
    border: 1px solid var(--v-borda-input);
    border-radius: 10px;
    background: #fff;
    height: 42px;
    align-items: stretch;
}

.segmentado_status_v2 .mantine-SegmentedControl-indicator {
    border-radius: 0;
    background: var(--v-verde-escuro);
    box-shadow: none;
}

.segmentado_status_v2 .mantine-SegmentedControl-control + .mantine-SegmentedControl-control {
    border-left: 1px solid var(--v-borda-input);
}

.segmentado_status_v2 .mantine-SegmentedControl-control::before {
    display: none;
}

.segmentado_status_v2 .mantine-SegmentedControl-label {
    display: flex;
    align-items: center;
    height: 100%;
    padding: 0 16px;
    font: 800 13px Manrope, sans-serif;
    color: var(--v-texto-inativo);
}

.segmentado_status_v2 .mantine-SegmentedControl-label[data-active] {
    color: #fff;
}

.segmentado_pequeno_status_v2.mantine-SegmentedControl-root {
    height: 34px;
}

.segmentado_pequeno_status_v2 .mantine-SegmentedControl-label {
    padding: 0 14px;
    font-size: 12.5px;
}

/* Seletor de tipo de operacao: o desenho do filtro de originador da Agenda
   (`alvo_filtro_og_v2` / `lista_filtro_og_v2`, em `tema_simulador_v2.css`), de escolha
   multipla. Aqui so o que muda: a altura de 42px da linha de filtros, a pilula ao lado
   do nome (la ela e irma do bloco de textos; aqui o callback escreve os dois juntos) e as
   linhas, que sao `dmc.Checkbox` em vez de divs clicaveis. */
.campo_tipos_op_status_v2 .alvo_tipos_op_status_v2 {
    width: 260px;
    height: 42px;
    border-color: var(--v-borda-input);
}

.textos_alvo_tipos_op_status_v2 {
    flex-direction: row;
    align-items: center;
    gap: 8px;
}

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

/* O dropdown do Popover vai para um portal no `body`, fora do painel: as regras de
   checkbox do `filtros_hist_v2` nao chegam aqui. `--checkbox-size` no root, e nao no
   input: o check desenhado le a variavel do root (o mesmo tropeco do radio). */
.item_tipo_op_status_v2.mantine-Checkbox-root {
    --checkbox-size: 17px;
    --checkbox-radius: 5px;
    padding-left: 10px;
    border-radius: 8px;
}

.item_tipo_op_status_v2 .mantine-Checkbox-body {
    align-items: center;
}

.item_tipo_op_status_v2 .mantine-Checkbox-input {
    border-width: 1.5px;
    border-color: var(--v-borda-controle);
    cursor: pointer;
}

/* O `<label>` ocupa a linha toda, com o padding do item: clicar em qualquer ponto da
   linha marca o tipo, e nao so em cima do texto. */
.item_tipo_op_status_v2 .mantine-Checkbox-labelWrapper {
    flex: 1;
}

.item_tipo_op_status_v2 .mantine-Checkbox-label {
    display: block;
    padding: 9px 10px 9px 10px;
    font: 600 13px Manrope, sans-serif;
    color: #1B2B26;
    cursor: pointer;
}

.item_tipo_op_status_v2.mantine-Checkbox-root:hover {
    background: #F2F7F5;
}

.item_tipo_op_status_v2.mantine-Checkbox-root:has(.mantine-Checkbox-input:checked) {
    background: #EAF3F0;
}

.item_tipo_op_status_v2:has(.mantine-Checkbox-input:checked) .mantine-Checkbox-label {
    font-weight: 800;
}

.item_todos_tipo_op_status_v2 .mantine-Checkbox-label {
    font-weight: 800;
    color: var(--v-verde-escuro);
}

/* Rodape: "Todos os tipos" a esquerda (ocupa a sobra, a linha inteira segue clicavel) e
   o "Desmarcar todos" na ponta direita. */
.rodape_tipos_op_status_v2 {
    display: flex;
    align-items: center;
    gap: 8px;
}

.rodape_tipos_op_status_v2 .item_todos_tipo_op_status_v2 {
    flex: 1;
    min-width: 0;
}

.desmarcar_tipos_op_status_v2 {
    flex: none;
    padding: 6px 8px;
    border-radius: 8px;
    font: 600 12px Manrope, sans-serif;
    color: var(--v-tab-texto-sub);
    white-space: nowrap;
    cursor: pointer;
}

.desmarcar_tipos_op_status_v2:hover {
    background: #F2F7F5;
    color: var(--v-destrutivo);
}

/* Buscar ticket: ponta direita do painel. */
.busca_ticket_status_v2 {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-left: auto;
}

.busca_ticket_status_v2 .mantine-TextInput-root {
    width: 260px;
}

.busca_ticket_status_v2 .mantine-Button-root {
    height: 42px;
    padding: 0 16px;
    border-radius: 10px;
    border-color: var(--v-borda-tint);
    background: #fff;
    font: 800 13px Manrope, sans-serif;
}

.busca_ticket_status_v2 .mantine-Button-root:hover {
    background: var(--v-tint);
}

/* O spinner do `dbc.Spinner` mora dentro do "Aplicar filtros"; em branco ele some no
   verde. */
.filtros_status_v2 .btn_atualizar_hist_v2 .spinner-border {
    color: #fff;
}

.resultado_busca_status_v2:not(:has(.mantine-Stack-root, label)) {
    display: none;
}

/* ============================================================ RESUMO */

.resumo_status_v2 {
    background: #fff;
}

.blocos_resumo_status_v2 {
    display: flex;
    flex-wrap: wrap;
    row-gap: 14px;
}

.bloco_resumo_status_v2 {
    min-width: 150px;
    padding: 2px 28px;
    border-left: 1px solid var(--v-tab-divisoria);
}

.bloco_resumo_status_v2:first-child {
    padding-left: 0;
    border-left: 0;
}

.topo_bloco_resumo_status_v2 {
    display: flex;
    align-items: center;
    gap: 8px;
}

.nome_bloco_resumo_status_v2 {
    font: 600 12px Manrope, sans-serif;
    color: var(--v-tab-texto-sub);
}

.base_bloco_resumo_status_v2 {
    display: flex;
    align-items: baseline;
    gap: 6px;
    margin-top: 5px;
}

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

.apoio_bloco_resumo_status_v2 {
    font: 600 12px Manrope, sans-serif;
    color: #93A6A0;
}

.valores_resumo_status_v2 {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid var(--v-tab-divisoria);
}

.titulo_valores_resumo_status_v2 {
    margin-bottom: 10px;
    font: 700 11px Manrope, sans-serif;
    color: var(--v-verde-escuro);
    letter-spacing: .6px;
    text-transform: uppercase;
}

/* ============================================================ TONS DE STATUS */

/* Fundo / borda / texto / ponto, do handoff. O tom sai de `tom_status_v2`. */
.tom_ok_status_v2 { --st-fundo: #EAF3F0; --st-borda: #BFDCD2; --st-texto: #2E8B6F; --st-ponto: #2E8B6F; }
.tom_andamento_status_v2 { --st-fundo: #FCF7EC; --st-borda: #EAD9B0; --st-texto: #8A6A1F; --st-ponto: #D9A13B; }
.tom_erro_status_v2 { --st-fundo: #FDF6F4; --st-borda: #F0D5D0; --st-texto: #C4553F; --st-ponto: #C4553F; }

.ponto_status_v2 {
    flex: none;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--st-ponto);
}

.badge_status_v2 {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border: 1px solid var(--st-borda);
    border-radius: 14px;
    background: var(--st-fundo);
    font: 700 12px Manrope, sans-serif;
    color: var(--st-texto);
    white-space: nowrap;
}

.badge_pequeno_status_v2 {
    padding: 3px 9px;
    border-radius: 12px;
    font-size: 11.5px;
}

/* ============================================================ CARD DA TABELA */

.cartao_tabela_status_v2 {
    border: 1px solid var(--v-borda-clara);
    border-radius: 10px;
    background: #fff;
    overflow: hidden;
}

.tela_status_v2 > .cartao_tabela_status_v2 {
    margin-top: 22px;
}

.cabecalho_tabela_status_v2 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    padding: 16px 22px;
}

.esq_cabecalho_tabela_status_v2,
.dir_cabecalho_tabela_status_v2 {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}

.dir_cabecalho_tabela_status_v2 {
    gap: 10px;
}

.rotulo_ordem_status_v2 {
    font: 600 12px Manrope, sans-serif;
    color: var(--v-tab-texto-sub);
}

/* Chips de status: e um `dbc.RadioItems` (Output de `options`/`value`), entao o radio em
   si some e o `<label>` vira o chip. */
.chips_status_v2 {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.chips_status_v2 .form-check {
    margin: 0;
    padding: 0;
    min-height: 0;
}

.chips_status_v2 .form-check-input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.chips_status_v2 .form-check-label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border: 1px solid var(--v-borda-input);
    border-radius: 14px;
    background: #fff;
    font: 700 12px Manrope, sans-serif;
    color: var(--v-texto-inativo);
    cursor: pointer;
}

.chips_status_v2 .form-check-label:hover {
    border-color: var(--v-verde-escuro);
}

.chips_status_v2 .contagem_chip_status_v2 {
    font-weight: 600;
    color: #93A6A0;
}

.chips_status_v2 .form-check-input:checked + .form-check-label {
    border-color: var(--v-borda-tint);
    background: var(--v-tint);
    color: var(--v-verde-escuro);
}

.chips_status_v2 .form-check-input:checked + .form-check-label .contagem_chip_status_v2 {
    color: #6B9C8B;
}

/* ============================================================ LOADER DA TABELA */

/* `dcc.Loading` em volta da tabela e da paginacao: o spinner e centrado na area, entao
   ela precisa de altura mesmo antes do primeiro filtro (senao o spinner sai por cima do
   cabecalho). */
.loader_tabela_status_v2 {
    position: relative;
    min-height: 140px;
}

/* ============================================================ TABELA */

.rolagem_tabela_status_v2 {
    overflow-x: auto;
}

.grade_tabela_status_v2 {
    min-width: 900px;
}

.header_tabela_status_v2,
.linha_status_v2 {
    display: grid;
    gap: 12px;
    align-items: center;
    padding: 14px 22px;
    border-top: 1px solid var(--v-tab-divisoria);
    text-align: center;
}

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

.linha_status_v2 {
    padding: 16px 22px;
    font: 600 13px Manrope, sans-serif;
    color: var(--v-tab-texto);
}

.linha_status_v2 > *,
.toggle_linha_status_v2 > * {
    min-width: 0;
}

.celula_ticket_status_v2 {
    text-align: left;
}

/* Linha master: o wrapper das celulas do meio e quem recebe o clique (abre/fecha), e
   `display: contents` o tira da grade — as celulas dele continuam colunas da linha. */
.toggle_linha_status_v2 {
    display: contents;
    cursor: pointer;
}

.linha_master_status_v2 {
    padding: 14px 22px;
}

.linha_master_status_v2:hover,
.linha_master_status_v2.aberta_status_v2 {
    background: var(--v-tab-hover);
}

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

.chevron_status_v2 {
    flex: none;
    color: var(--v-tab-texto-sub);
    transition: transform .15s;
}

.aberta_status_v2 .chevron_status_v2 {
    transform: rotate(90deg);
}

.texto_ticket_status_v2 {
    min-width: 0;
}

.linha_ticket_status_v2 {
    display: flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}

.link_ticket_status_v2 {
    margin: 0;
    overflow: hidden;
    font: 700 13px Manrope, sans-serif;
    color: var(--v-verde-escuro);
    white-space: nowrap;
    text-overflow: ellipsis;
    cursor: pointer;
}

.copiar_ticket_status_v2 {
    flex: none;
    color: #93A6A0;
    font-size: 12px;
    cursor: pointer;
}

.copiar_ticket_status_v2:hover {
    color: var(--v-verde-escuro);
}

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

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

.apoio_ticket_status_v2 {
    margin-top: 2px;
    font: 500 11.5px Manrope, sans-serif;
    color: #93A6A0;
}

.destaque_celula_status_v2 {
    font-weight: 800;
}

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

.link_celula_status_v2 {
    margin: 0;
    font: 600 12px Manrope, sans-serif;
    color: var(--v-verde-escuro);
    cursor: pointer;
}

.link_celula_status_v2:hover {
    text-decoration: underline;
}

/* Anel de progresso: `--pct` vem inline do `anel_status_v2`. */
.anel_status_v2 {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: conic-gradient(var(--anel-cor, var(--v-verde-escuro)) var(--pct), var(--v-tab-divisoria) 0);
}

.anel_excedido_status_v2 {
    --anel-cor: var(--v-destrutivo);
}

.miolo_anel_status_v2 {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #fff;
    font: 800 10px Manrope, sans-serif;
    color: var(--anel-cor, var(--v-verde-escuro));
}

/* Checkbox (`dbc.Checkbox`): 16px, radius 4, cheio de verde quando marcado. */
.check_status_v2.form-check {
    display: flex;
    justify-content: center;
    margin: 0;
    padding: 0;
    min-height: 0;
}

.check_status_v2 .form-check-input {
    float: none;
    width: 16px;
    height: 16px;
    margin: 0;
    border: 1.5px solid var(--v-borda-input);
    border-radius: 4px;
    cursor: pointer;
}

.check_status_v2 .form-check-input:checked {
    border-color: var(--v-verde-escuro);
    background-color: var(--v-verde-escuro);
}

.check_status_v2 .form-check-input:focus {
    box-shadow: none;
}

/* ============================================================ ACOES E INFO */

.celula_acoes_status_v2 {
    display: flex;
    justify-content: center;
}

.btn_acoes_status_v2 {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 34px;
    padding: 0 12px;
    border: 1px solid var(--v-borda-tint);
    border-radius: 10px;
    background: #fff;
    font: 800 12.5px Manrope, sans-serif;
    color: var(--v-verde-escuro);
    text-decoration: none;
    box-shadow: none;
}

.btn_acoes_status_v2:hover,
.btn_acoes_status_v2:focus,
.btn_acoes_status_v2[data-expanded] {
    background: var(--v-tint);
    color: var(--v-verde-escuro);
    box-shadow: none;
}

.btn_acoes_status_v2.btn_acoes_neutro_status_v2 {
    gap: 5px;
    height: 30px;
    padding: 0 10px;
    border-color: var(--v-borda-input);
    border-radius: 8px;
    font: 700 12px Manrope, sans-serif;
    color: var(--v-texto-inativo);
}

.btn_acoes_status_v2.btn_acoes_neutro_status_v2:hover,
.btn_acoes_status_v2.btn_acoes_neutro_status_v2:focus,
.btn_acoes_status_v2.btn_acoes_neutro_status_v2[data-expanded] {
    background: var(--v-tab-cabecalho);
    color: var(--v-texto-inativo);
}

.dropdown_acoes_status_v2 {
    min-width: 200px;
    padding: 6px;
    border: 1px solid var(--v-borda-clara);
    border-radius: 10px;
    box-shadow: 0 12px 32px rgba(18, 42, 35, .14);
}

.dropdown_acoes_status_v2 .item_acoes_status_v2 {
    padding: 9px 12px;
    border-radius: 8px;
    font: 600 13px Manrope, sans-serif;
    color: var(--v-tab-texto);
}

.dropdown_acoes_status_v2 .item_acoes_status_v2:hover,
.dropdown_acoes_status_v2 .item_acoes_status_v2[data-hovered] {
    background: var(--v-tab-cabecalho);
    color: var(--v-tab-texto);
}

.dropdown_acoes_status_v2 .item_cancelar_status_v2,
.dropdown_acoes_status_v2 .item_cancelar_status_v2:hover,
.dropdown_acoes_status_v2 .item_cancelar_status_v2[data-hovered] {
    color: var(--v-destrutivo);
}

.btn_info_status_v2 {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 10px;
    background: var(--v-tab-cabecalho);
    color: var(--v-verde-escuro);
}

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

.btn_info_neutro_status_v2 {
    width: auto;
    height: auto;
    background: none;
    color: var(--v-tab-texto-sub);
}

.btn_info_neutro_status_v2:hover {
    background: none;
    color: var(--v-verde-escuro);
}

/* ============================================================ TICKETS SUB (collapse) */

.bloco_sub_status_v2 {
    /* 21px + 1px da borda da `tabela_sub_status_v2` = os 22px da linha master: as linhas
       sub (sem padding lateral) ficam com a mesma largura de grade e as colunas batem. */
    padding: 6px 21px 14px;
    border-top: 1px solid var(--v-tab-divisoria);
    background: var(--v-tab-hover);
}

.cabecalho_sub_status_v2 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 0 8px;
}

.titulo_sub_status_v2 {
    font: 700 11px Manrope, sans-serif;
    color: var(--v-verde-escuro);
    letter-spacing: .6px;
    text-transform: uppercase;
}

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

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

.linha_sub_status_v2 {
    display: grid;
    gap: 12px;
    align-items: center;
    padding: 11px 0;
    font: 600 12.5px Manrope, sans-serif;
    color: var(--v-tab-texto);
    text-align: center;
}

.linha_sub_status_v2 > * {
    min-width: 0;
}

/* Sem padding lateral na linha (alinhamento com a master), o ticket ganha o recuo dentro da
   propria celula quando e a primeira coluna (sem checkbox), para nao encostar na borda. */
.linha_sub_status_v2 > .celula_ticket_status_v2:first-child {
    padding-left: 14px;
}

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

.ticket_sub_status_v2 {
    margin: 0;
    overflow: hidden;
    font: 600 13px Manrope, sans-serif;
    color: var(--v-verde-escuro);
    white-space: nowrap;
    text-overflow: ellipsis;
}

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

.rodape_sub_status_v2 .mantine-Button-root,
.termo_tabela_status_v2 .mantine-Button-root {
    height: 38px;
    border-radius: 10px;
    font: 800 13px Manrope, sans-serif;
}

.rodape_sub_status_v2 .mantine-Button-root[data-variant='outline'] {
    border-color: var(--v-borda-tint);
    background: #fff;
}

/* ============================================================ RODAPE E PAGINACAO */

/* Botao da acao em lote (Gerar termo / Reprocessar / Enviar para assinatura). */
.termo_tabela_status_v2 {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    padding: 14px 22px;
    border-top: 1px solid var(--v-tab-divisoria);
}

.rodape_tabela_status_v2 {
    display: flex;
    justify-content: flex-end;
    padding: 14px 22px;
    border-top: 1px solid var(--v-tab-divisoria);
}

/* A paginacao escondida pelo callback leva o rodape junto. */
.rodape_tabela_status_v2:has(> .hidden) {
    display: none;
}

.tela_status_v2 .pagination {
    gap: 6px;
    margin: 0;
}

.tela_status_v2 .pagination .page-link {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    height: 32px;
    padding: 0 8px;
    border: 1px solid var(--v-borda-input);
    border-radius: 8px;
    background: #fff;
    font: 700 12.5px Manrope, sans-serif;
    color: var(--v-texto-inativo);
    box-shadow: none;
}

.tela_status_v2 .pagination .page-item.active .page-link {
    border-color: var(--v-verde-escuro);
    background: var(--v-verde-escuro);
    color: #fff;
}

.tela_status_v2 .pagination .page-item.disabled .page-link {
    opacity: .5;
}

/* ============================================================ VAZIO */

.vazio_status_v2 {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 36px 22px;
    border-top: 1px solid var(--v-tab-divisoria);
    font: 600 13px Manrope, sans-serif;
    color: var(--v-tab-texto-sub);
}

.vazio_status_v2 svg {
    color: #93A6A0;
}

/* ============================================================ CELULAR */

@media (max-width: 767.98px) {
    /* No celular o painel do Historico e uma coluna so, ordenada por `order`; os campos
       que ele nao conhece subiriam para o topo. */
    .filtros_status_v2 > .campo_tipos_op_status_v2 { order: 3; }
    .filtros_status_v2 > .campo_agrupar_status_v2 { order: 4; }

    .campo_tipos_op_status_v2 .alvo_tipos_op_status_v2 {
        width: 100%;
    }
    .filtros_status_v2 > .busca_ticket_status_v2 { order: 6; }

    .campo_dt_status_v2 .mantine-Input-input {
        min-width: 0;
    }

    .busca_ticket_status_v2 {
        margin-left: 0;
    }

    .busca_ticket_status_v2 .mantine-TextInput-root {
        flex: 1;
        width: auto;
        min-width: 0;
    }

    .bloco_resumo_status_v2 {
        flex: 1 1 45%;
        padding: 2px 0;
        border-left: 0;
    }

    .cabecalho_tabela_status_v2 {
        padding: 14px 16px;
    }

    .bloco_sub_status_v2 {
        padding: 6px 21px 14px;
    }
}

/* Coluna Operacao do sub com os dados do payout (fidc_operacoes_detalhes): o tipo fica
   na linha master e o sub mostra o cedente. */
.cedente_coluna_sub_status_v2 {
    display: grid;
    gap: 2px;
    min-width: 0;
    padding: 0 6px;
}

.nome_cedente_sub_status_v2 {
    overflow: hidden;
    font: 800 13px Manrope, sans-serif;
    color: var(--v-tab-texto);
    white-space: nowrap;
    text-overflow: ellipsis;
}

.doc_cedente_sub_status_v2 {
    font: 600 12px Manrope, sans-serif;
    color: var(--v-tab-texto-sub);
    font-variant-numeric: tabular-nums;
}

.tipo_cedente_sub_status_v2 {
    font: 700 11px Manrope, sans-serif;
    color: var(--v-verde-escuro);
}

/* Coluna Erro do sub: titulo do erro + detalhe (handoff "Com erro"). */
.celula_erro_status_v2 {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
}

.titulo_erro_status_v2 {
    font: 700 13px Manrope, sans-serif;
    color: #C4553F;
}

.detalhe_erro_status_v2 {
    font: 500 12px Manrope, sans-serif;
    color: var(--v-tab-texto-sub);
    font-variant-numeric: tabular-nums;
}

.texto_erro_status_v2 {
    font: 600 12px Manrope, sans-serif;
    color: #C4553F;
}

/* ============================================================ BUSCA DE PAYOUT
   Botao "Filtros" ao lado do "Ordenar por criacao" (so com `transferencia` sozinho no
   tipo), o popover da busca e o chip da busca ativa ao lado das pills de status. */

/* Botao "Filtros": neutro como o `btn_filtros_v2` do Historico (abre um painel, nao
   executa nada), com a altura do segmentado pequeno ao lado. Verde quando aberto. */
.btn_filtros_status_v2 {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 34px;
    padding: 0 13px;
    border: 1px solid transparent;
    border-radius: 10px;
    background: var(--v-tab-cabecalho);
    font: 700 12.5px Manrope, sans-serif;
    color: var(--v-texto-inativo);
    cursor: pointer;
    transition: background .12s, color .12s;
}

.btn_filtros_status_v2:hover,
.btn_filtros_status_v2:focus-visible,
.btn_filtros_status_v2[aria-expanded="true"],
[aria-expanded="true"] > .btn_filtros_status_v2 {
    background: var(--v-tint);
    color: var(--v-verde-escuro);
    outline: none;
}

.btn_filtros_status_v2[aria-expanded="true"],
[aria-expanded="true"] > .btn_filtros_status_v2 {
    border-color: var(--v-borda-tint);
}

/* Cartao do popover: o mesmo do dropdown do filtro de tipo (`dropdown_filtro_og_v2`),
   um pouco mais arredondado e com sombra para ficar acima da tabela. */
.dropdown_filtros_payout_status_v2.mantine-Popover-dropdown {
    padding: 0;
    overflow: hidden;
    border: 1px solid #D5E0DC;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 18px 44px rgba(10, 30, 25, .18), 0 2px 6px rgba(10, 30, 25, .06);
    max-width: calc(100vw - 32px);
}

.cabecalho_filtros_payout_status_v2 {
    padding: 14px 16px 12px;
    border-bottom: 1px solid #E4ECE9;
}

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

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

.corpo_filtros_payout_status_v2 {
    padding: 14px 16px;
}

.corpo_filtros_payout_status_v2 .mantine-Input-input {
    height: 40px;
    border-color: #D5E0DC;
    border-radius: 10px;
    font: 500 13px Manrope, sans-serif;
}

.corpo_filtros_payout_status_v2 .mantine-Input-input:focus {
    border-color: var(--v-verde-escuro);
}

.msg_filtros_payout_status_v2 {
    margin-top: 8px;
    font: 600 12px Manrope, sans-serif;
    color: #C4553F;
}

.msg_filtros_payout_status_v2:empty {
    display: none;
}

.acoes_filtros_payout_status_v2 {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 10px 12px;
    border-top: 1px solid #E4ECE9;
    background: #F7FAF9;
}

.acoes_filtros_payout_status_v2 .mantine-Button-root {
    height: 36px;
    padding: 0 16px;
    border-radius: 10px;
    font: 800 13px Manrope, sans-serif;
}

.btn_limpar_filtros_payout_status_v2.mantine-Button-root {
    color: var(--v-tab-texto-sub);
}

.btn_limpar_filtros_payout_status_v2.mantine-Button-root:hover {
    background: #EDF2F0;
    color: var(--v-tab-texto);
}

.chip_busca_status_v2 {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 6px 4px 11px;
    border: 1px solid #BFDCD2;
    border-radius: 999px;
    background: #EAF3F0;
    font: 700 12px Manrope, sans-serif;
    color: var(--v-verde-escuro);
    white-space: nowrap;
}

.chip_busca_status_v2[hidden] {
    display: none;
}

.x_chip_busca_status_v2 {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    cursor: pointer;
}

.x_chip_busca_status_v2:hover {
    background: #D5EAE2;
}
