:root {
    --bs-primary: rgb(65,105,225);
    --bs-primary-rgb: 65, 105, 225;
    --bs-secondary: #6c757d;
    --bs-secondary-rgb: 108, 117, 125;
    --app-accent-yellow: #FFEE8C;
    --app-on-yellow: #212529;
}

.btn,
a.btn,
a {
    text-decoration: none;
}

/*.btn {
    background-color: white;
    color: var(--bs-primary);
    
}*/

.badge.bg-secondary,
.badge-secondary {
    color: #fff !important;
    background-color: #6c757d !important;
}

.badge.bg-warning,
.badge-warning,
.bg-warning.text-white,
.text-white.bg-warning {
    color: var(--app-on-yellow) !important;
}

.table th {
    border-bottom: 0px solid black; 
}

.table {
    margin-bottom: 0 !important;
}

/*Pink Hover*/
/* Target only the row hover and kill the gray overlay */
.pink-hover-table .table-hover tbody tr:hover {
    /* This overrides the base color variable */
    --bs-table-accent-bg: transparent !important;
    --bs-table-bg-state: transparent !important;
    /* Set your desired pink color here */
    background-color: rgba(255, 192, 203, 0.13) !important;
    /* This removes the "box-shadow" gradient Bootstrap uses for overlays */
    box-shadow: inset 0 0 0 9999px rgba(255, 192, 203, 0.13) !important;
}

    /* Ensure child cells don't try to apply their own background logic */
    .pink-hover-table .table-hover tbody tr:hover > * {
        background-color: transparent !important;
        box-shadow: none !important;
    }