.custom-table thead {
        background: linear-gradient(to right, #004792, #007BFF); /* Gradiente de azul escuro para azul claro */
    }

    .custom-table th {
        border-bottom: 2px solid #ddd;
        padding: 8px;
        text-align: left;
        color: white; /* Mantém o texto do cabeçalho em branco para contraste */
        background: none; /* Isto é importante para que a cor de fundo individual do th não sobrescreva o gradiente do thead */
    }


    .custom-table td {
        padding: 10px 8px;
        border-bottom: 1px solid #e7e7e7;
        color: #333; /* cor de texto mais escura */
    }

    .custom-table tr:last-child td {
        border-bottom: none; /* removendo borda do último item */
    }

    .custom-table tr:hover {
        background-color: #f3f3f3;
        cursor: pointer; /* muda o cursor para indicar que o item pode ser clicado */
    }



    .custom-btn, .custom-table tr:hover, .red-highlight, .card-header {
        transition: background-color 0.3s ease, box-shadow 0.3s ease; /* Aplica transição consistentemente */
    }

/* Utiliza variáveis CSS */
.custom-btn {
    background-color: var(--button-bg-color);
    /* Outras propriedades permanecem inalteradas */
}

    .custom-btn:hover {
        background-color: var(--button-hover-bg-color);
        /* Outras propriedades permanecem inalteradas */
    }

.red-highlight {
    background-color: var(--highlight-bg-color);
    color: var(--highlight-text-color);
}



/*Aqui inicia o div de tabelas*/
.card {
    border: 1px solid #ddd;
    padding: 15px;
    margin: 10px 0;
    border-radius: 5px;
    background-color: #f9f9f9;
}
.card-header {
    background: linear-gradient(to right, #6C3483, #A569BD); /* Gradiente de vinho escuro para vinho claro */
    color: white; /* Cor da fonte alterada para branco para melhor contraste */
    padding: 10px;
    border-radius: 5px 5px 0 0;
    font-weight: bold;
}

.actions {
    display: flex;
    gap: 5px;
    margin-top: 10px;
}

/* Esconde o menu dropdown em telas grandes */
@media (min-width: 992px) {
    .mobile-actions {
        display: none;
    }
}

/* Esconde os botões de ação individuais em telas pequenas */
@media (max-width: 991px) {
    .desktop-actions {
        display: none;
    }
}

:root {
    --blue-start: #004792;
    --blue-end: #007BFF;
    --text-color: #333;
    --table-padding: 10px 8px;
    --button-bg-color: #4A90E2;
    --button-hover-bg-color: #357ABD;
    --highlight-bg-color: #ffe5e5;
    --highlight-text-color: #b30000;
}

.custom-table {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    border-collapse: collapse;
    width: 100%;
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.15);
    font-size: 16px; /* Adicionado */
    box-sizing: border-box; /* Adicionado */
}