.my-custom-modal-size .modal-dialog {
    min-height: 600px; /* Ajuste conforme necessário */
}

/**
 * cobrancas-mobile.css
 * Correções de layout mobile para o Painel Financeiro — Cobranças
 * Inclua este arquivo no webpack.mix.js ou via @vite na view correspondente.
 */

/* ── Cards de Totais ─────────────────────────────────────────────────────── */

/* Em telas pequenas, os cards ficam em 2 colunas (não 1 coluna cheia) */
@media (max-width: 575.98px) {
    .card-totais-cobrancas {
        display: grid !important;
        grid-template-columns: 1fr 1fr;
        gap: 0.75rem;
    }

    .card-totais-cobrancas .card {
        margin-bottom: 0 !important;
    }

    /* Fonte menor nos números dos cards em mobile */
    .card-totais-cobrancas .fs-2hx,
    .card-totais-cobrancas .fs-2x {
        font-size: 1.4rem !important;
    }
}

/* ── Filtros da DataTable ────────────────────────────────────────────────── */

/* Em mobile os filtros empilham verticalmente */
@media (max-width: 767.98px) {
    .filtros-cobrancas {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 0.5rem !important;
    }

    .filtros-cobrancas > * {
        width: 100% !important;
        min-width: unset !important;
        max-width: unset !important;
    }

    /* Selects do Select2 ocupam 100% */
    .filtros-cobrancas .select2-container {
        width: 100% !important;
    }
}

/* ── Botões de Exportar / Ações ─────────────────────────────────────────── */

@media (max-width: 767.98px) {
    .toolbar-cobrancas {
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    /* Exportar Planilha e PDF lado a lado, Ações 100% */
    .toolbar-cobrancas .btn-exportar {
        flex: 1 1 calc(50% - 0.25rem);
        justify-content: center;
    }

    .toolbar-cobrancas .btn-acoes-dropdown {
        width: 100%;
        justify-content: center;
    }
}

/* ── DataTable — colunas em mobile ─────────────────────────────────────── */

@media (max-width: 767.98px) {
    /* Esconde colunas menos importantes em telas pequenas */
    /* Metronic já faz isso via responsivo do DataTables, mas garantimos aqui */
    #boletos-table td,
    #boletos-table th {
        white-space: nowrap;
    }

    /* Coluna de ações: botões menores */
    #boletos-table td:last-child .btn-icon {
        width: 28px;
        height: 28px;
    }
}

/* ── Barra de Ações em Lote ──────────────────────────────────────────────  */

#barra_acoes_lote {
    transition: all 0.2s ease;
    position: sticky;
    top: 60px; /* Abaixo do header fixo do Metronic */
    z-index: 99;
}

@media (max-width: 575.98px) {
    #barra_acoes_lote {
        top: 55px;
        border-radius: 0 !important;
        margin-left: -1rem;
        margin-right: -1rem;
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }
}

/* ── Modal de Detalhes — Data correta ───────────────────────────────────── */

/* Garante que datas longas quebram bem em mobile */
#modal_boleto_detalhe_body .fs-6.fw-bold {
    word-break: break-word;
}

/* ── Modal de Histórico — tabela responsiva ──────────────────────────────  */

#modal_historico_body .table-responsive {
    max-height: 60vh;
    overflow-y: auto;
}

/* ── Checkbox da DataTable ───────────────────────────────────────────────── */

.boleto-checkbox {
    cursor: pointer;
    width: 1.15rem;
    height: 1.15rem;
}

/* Alinha verticalmente o checkbox na célula */
#boletos-table td:first-child {
    vertical-align: middle;
}

/* ── Badges de Agendamentos (Schedules) ─────────────────────────────────── */

/* Custom/cron — azul escuro para melhor visibilidade */
.schedule-badge-custom {
    background-color: var(--bs-info-light);
    color: var(--bs-info);
    font-weight: 600;
}

/* Desabilitado — contorno vermelho, sem fundo */
.schedule-badge-disabled {
    background-color: transparent;
    border: 1px solid var(--bs-danger);
    color: var(--bs-danger);
    font-weight: 600;
}

/* Próxima execução calculada — destaque sutil verde */
.schedule-badge-proximo {
    background-color: var(--bs-success-light);
    color: var(--bs-success);
    font-weight: 600;
}