/* Dark cards for admin tables */
.page-users .card,
.page-users .card-header,
.page-users .card-body {
    background: #0f1114;
    color: #fff;
    border-color: #2a2e35;
}
.page-users .form-control,
.page-users .form-select {
    background-color: #111;
    color: #fff;
    border: 1px solid #333;
}

.page-users .form-control:focus,
.page-users .form-select:focus {
    background-color: #111;
    color: #fff;
    border-color: #e10600;
    box-shadow: 0 0 0 0.15rem rgba(225,6,0,.25);
}

/* Dropdown options */
.page-users select option {
    background: #111;
    color: #fff;
}
.page-users .form-check-input {
    background-color: #111;
    border: 1px solid #444;
}

.page-users .form-check-input:checked {
    background-color: #e10600;
    border-color: #e10600;
}
/* =======================
   Dark mode for Drivers
======================= */
.page-drivers .card,
.page-drivers .card-header,
.page-drivers .card-body {
    background-color: #0f1114;
    color: #fff;
    border-color: #2a2e35;
}

/* Inputs & selects */
.page-drivers .form-control,
.page-drivers .form-select {
    background-color: #111;
    color: #fff;
    border: 1px solid #333;
}

.page-drivers .form-control:focus,
.page-drivers .form-select:focus {
    background-color: #111;
    color: #fff;
    border-color: #e10600;
    box-shadow: 0 0 0 0.15rem rgba(225,6,0,.25);
}

/* Dropdown options */
.page-drivers select option {
    background-color: #111;
    color: #fff;
}

/* Checkboxes */
.page-drivers .form-check-input {
    background-color: #111;
    border: 1px solid #444;
}

.page-drivers .form-check-input:checked {
    background-color: #e10600;
    border-color: #e10600;
}

/* Buttons */
.page-drivers .btn-outline-secondary {
    color: #aaa;
    border-color: #444;
}

.page-drivers .btn-outline-secondary:hover {
    background-color: #222;
    color: #fff;
}
/* =======================
   Dark mode for Races page
======================= */
.page-races .card,
.page-races .card-header,
.page-races .card-body {
    background-color: #0f1114;
    color: #fff;
    border-color: #2a2e35;
}

/* Inputs & selects */
.page-races .form-control,
.page-races .form-select {
    background-color: #111;
    color: #fff;
    border: 1px solid #333;
}

.page-races .form-control:focus,
.page-races .form-select:focus {
    background-color: #111;
    color: #fff;
    border-color: #e10600;
    box-shadow: 0 0 0 0.15rem rgba(225,6,0,.25);
}

/* Dropdown options */
.page-races select option {
    background-color: #111;
    color: #fff;
}

/* Checkboxes */
.page-races .form-check-input {
    background-color: #111;
    border: 1px solid #444;
}

.page-races .form-check-input:checked {
    background-color: #e10600;
    border-color: #e10600;
}

/* Buttons */
.page-races .btn-outline-secondary {
    color: #aaa;
    border-color: #444;
}

.page-races .btn-outline-secondary:hover {
    background-color: #222;
    color: #fff;
}
/* =======================
   Dark mode for Results page
======================= */
.page-results .card,
.page-results .card-header,
.page-results .card-body {
    background-color: #0f1114;
    color: #fff;
    border-color: #2a2e35;
}

/* Tables */
.page-results .table {
    background-color: #111;
    color: #fff;
}

.page-results .table th,
.page-results .table td {
    vertical-align: middle;
    border-color: #2a2e35;
}

/* Inputs and selects */
.page-results .form-control,
.page-results .form-select,
.page-results .form-select-sm {
    background-color: #111;
    color: #fff;
    border: 1px solid #333;
}

.page-results .form-control:focus,
.page-results .form-select:focus {
    background-color: #111;
    color: #fff;
    border-color: #e10600; /* F1 red */
    box-shadow: 0 0 0 0.15rem rgba(225,6,0,.25);
}

/* Dropdown options */
.page-results select option {
    background-color: #111;
    color: #fff;
}

/* Buttons */
.page-results .btn-outline-secondary {
    color: #aaa;
    border-color: #444;
}

.page-results .btn-outline-secondary:hover {
    background-color: #222;
    color: #fff;
}

/* Small spacing for table forms */
.page-results .form-select-sm {
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
    font-size: 0.875rem;
}
/* =======================
   Dark mode for User Groups
======================= */
.page-userGroups .card,
.page-userGroups .card-header,
.page-userGroups .card-body {
    background-color: #0f1114;
    color: #fff;
    border-color: #2a2e35;
}

/* Tables */
.page-userGroups .table {
    background-color: #111;
    color: #fff;
}

.page-userGroups .table th,
.page-userGroups .table td {
    border-color: #2a2e35;
    vertical-align: middle;
}

/* Inputs and selects */
.page-userGroups .form-control,
.page-userGroups .form-select,
.page-userGroups .form-select-sm {
    background-color: #111;
    color: #fff;
    border: 1px solid #333;
}

.page-userGroups .form-control:focus,
.page-userGroups .form-select:focus {
    background-color: #111;
    color: #fff;
    border-color: #e10600; /* F1 red */
    box-shadow: 0 0 0 0.15rem rgba(225,6,0,.25);
}

/* Dropdown options */
.page-userGroups select option {
    background-color: #111;
    color: #fff;
}

/* Buttons */
.page-userGroups .btn-outline-secondary {
    color: #aaa;
    border-color: #444;
}

.page-userGroups .btn-outline-secondary:hover {
    background-color: #222;
    color: #fff;
}

/* Small spacing for table forms */
.page-userGroups .form-select-sm {
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
    font-size: 0.875rem;
}
/* =========================
   Dark mode for Admin Users
========================= */
.page-adminUsers .card,
.page-adminUsers .card-header,
.page-adminUsers .card-body {
    background-color: #0f1114;
    color: #fff;
    border-color: #2a2e35;
}

/* Tables */
.page-adminUsers .table {
    background-color: #111;
    color: #fff;
}

.page-adminUsers .table th,
.page-adminUsers .table td {
    border-color: #2a2e35;
    vertical-align: middle;
}

/* Inputs and selects */
.page-adminUsers .form-control,
.page-adminUsers .form-select,
.page-adminUsers .form-control-sm {
    background-color: #111;
    color: #fff;
    border: 1px solid #333;
}

.page-adminUsers .form-control:focus,
.page-adminUsers .form-select:focus {
    background-color: #111;
    color: #fff;
    border-color: #e10600; /* F1 red accent */
    box-shadow: 0 0 0 0.15rem rgba(225,6,0,.25);
}

/* Dropdown options */
.page-adminUsers select option {
    background-color: #111;
    color: #fff;
}

/* Checkboxes */
.page-adminUsers .form-check-input {
    background-color: #111;
    border-color: #444;
}

/* Buttons */
.page-adminUsers .btn-outline-secondary {
    color: #aaa;
    border-color: #444;
}

.page-adminUsers .btn-outline-secondary:hover {
    background-color: #222;
    color: #fff;
}
/* =========================
   Admin Panel Dark Mode
   Applies to Drivers, Races, Results,
   User Groups, Admin Users, Groups
========================= */

/* ---------- Containers & Cards ---------- */
.container-fluid {
    background-color: #0f1114;
    color: #fff;
}

.card,
.card-header,
.card-body {
    background-color: #0f1114;
    color: #fff;
    border-color: #2a2e35;
}

/* ---------- Tables ---------- */
.table {
    background-color: #111;
    color: #fff;
}

.table th,
.table td {
    border-color: #2a2e35;
    vertical-align: middle;
}

.table-striped tbody tr:nth-of-type(odd) {
    background-color: #121314;
}

/* ---------- Inputs, selects, textareas ---------- */
.form-control,
.form-control-sm,
.form-select,
.form-select-sm,
input[type="password"] {
    background-color: #111;
    color: #fff;
    border: 1px solid #333;
}

.form-control:focus,
.form-select:focus {
    background-color: #111;
    color: #fff;
    border-color: #e10600; /* F1 red accent */
    box-shadow: 0 0 0 0.15rem rgba(225,6,0,.25);
}

/* Dropdown options */
select option {
    background-color: #111;
    color: #fff;
}

/* ---------- Checkboxes & Radio Buttons ---------- */
.form-check-input {
    background-color: #111;
    border-color: #444;
}

/* ---------- Buttons ---------- */
.btn-primary {
    background: linear-gradient(135deg, #0d3b66, #1f4e8c);
    border: none;
    color: #ffffff;
    box-shadow: 0 4px 10px rgba(31, 78, 140, 0.4);
    transition: all 0.2s ease;
}

.btn-primary:hover {
    background: linear-gradient(135deg, #0a2f52, #163d73);
    transform: translateY(-1px);
    box-shadow: 0 6px 14px rgba(31, 78, 140, 0.5);
}
.btn-success {
    background: linear-gradient(135deg, #1b5e20, #2e7d32);
    border: none;
    color: #ffffff;
    box-shadow: 0 4px 10px rgba(46, 125, 50, 0.4);
    transition: all 0.2s ease;
}

.btn-success:hover {
    background: linear-gradient(135deg, #144d18, #256628);
    transform: translateY(-1px);
}

.btn-danger {
    background: linear-gradient(135deg, #7a1f14, #b33939);
    border: none;
    color: #ffffff;
    box-shadow: 0 4px 10px rgba(179, 57, 57, 0.4);
    transition: all 0.2s ease;
}

.btn-danger:hover {
    background: linear-gradient(135deg, #5a0f0f, #922b2b);
    transform: translateY(-1px);
}

.btn-outline-secondary {
    color: #9aa4b2;
    border: 1px solid #444c5c;
    background: transparent;
    transition: all 0.2s ease;
}

.btn-outline-secondary:hover {
    background: #1f2937;
    color: #ffffff;
    border-color: #5c6b80;
}
/* ---------- Badge ---------- */
.badge {
    background-color: #444;
    color: #fff;
}

/* ---------- Misc ---------- */
.text-muted {
    color: #aaa !important;
}

.table-responsive {
    overflow-x: auto;
}

/* Optional: scrollbars for dark mode */
.table-responsive::-webkit-scrollbar {
    height: 8px;
}

.table-responsive::-webkit-scrollbar-thumb {
    background-color: #333;
    border-radius: 4px;
}
/* ---------- Buttons ---------- */
.btn-primary {
    background-color: #e10600; /* F1 red */
    border-color: #e10600;
    color: #fff;
}

.btn-primary:hover {
    background-color: #c10500;
    border-color: #c10500;
}

.btn-success { /* Save */
    background-color: #28a745; /* bright green */
    border-color: #28a745;
    color: #fff;
}

.btn-success:hover {
    background-color: #218838;
    border-color: #1e7e34;
}

.btn-danger { /* Delete */
    background-color: #b71c1c; /* darker red */
    border-color: #b71c1c;
    color: #fff;
}

.btn-danger:hover {
    background-color: #991a1a;
    border-color: #880e0e;
}

.btn-outline-secondary {
    color: #aaa;
    border-color: #444;
}

.btn-outline-secondary:hover {
    background-color: #222;
    color: #fff;
}

/* ---------- Badges ---------- */
.badge-success {
    background-color: #28a745;
    color: #fff;
}

.badge-danger {
    background-color: #b71c1c;
    color: #fff;
}

.badge-info {
    background-color: #17a2b8;
    color: #fff;
}

/* ---------- Checkboxes ---------- */
.form-check-input:checked {
    background-color: #28a745; /* green for active/save */
    border-color: #28a745;
}

.form-check-input:indeterminate {
    background-color: #ffc107; /* amber for warning/partial */
    border-color: #ffc107;
}

/* ---------- Table hover & selection ---------- */
.table-hover tbody tr:hover {
    background-color: rgba(40, 167, 69, 0.1); /* subtle green for hover Save-friendly */
}

.table-dark th, .table-dark td {
    vertical-align: middle;
}
/* ---------- Save / Update Buttons ---------- */
.btn-save, .btn-update, .btn-success {
    background-color: #28a745; /* bright green */
    border-color: #28a745;
    color: #fff;
}

.btn-save:hover, .btn-update:hover, .btn-success:hover {
    background-color: #218838;
    border-color: #1e7e34;
}

/* ---------- Delete Buttons ---------- */
.btn-delete, .btn-danger {
    background-color: #b71c1c; /* darker red */
    border-color: #b71c1c;
    color: #fff;
}

.btn-delete:hover, .btn-danger:hover {
    background-color: #991a1a;
    border-color: #880e0e;
}

/* ---------- Table hover cues ---------- */
.table-hover tbody tr:hover {
    background-color: rgba(40, 167, 69, 0.08); /* subtle green hint */
}

/* ---------- Checkboxes ---------- */
.form-check-input:checked {
    background-color: #28a745; /* green for active */
    border-color: #28a745;
}