/* Default = Light */
:root {
    --bg: #f8f9fa;
    --card: #ffffff;
    --text: #212529;
    --muted: #6c757d;
    --border: rgba(0,0,0,.125);
    --link: #0d6efd;
}

html[data-theme="dark"] {
    --bg: #0f1216;
    --card: #171b21;
    --text: #e9ecef;
    --muted: #adb5bd;
    --border: rgba(255,255,255,.12);
    --link: #7ab8ff;
}

/* Apply across app */
body {
    background: var(--bg) !important;
    color: var(--text) !important;
}

a {
    color: var(--link);
}

.card {
    background: var(--card) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}

.text-muted {
    color: var(--muted) !important;
}

.table {
    color: var(--text) !important;
}

    .table thead th {
        color: var(--muted) !important;
    }

    .table td, .table th {
        border-color: var(--border) !important;
    }

.btn-light {
    background: var(--card) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}