html[data-theme="light"] {
    color-scheme: light;
    --tm-body-bg: #ffffff;
    --tm-body-color: #212529;
    --tm-text-muted: #6c757d;
    --tm-text-secondary: #5a6268;
    --tm-surface: #ffffff;
    --tm-surface-2: #f8f9fa;
    --tm-surface-muted: #fafbfc;
    --tm-border: #dee2e6;
    --tm-border-strong: #ced4da;
    --tm-card-header-bg: linear-gradient(180deg, #f0f6fc 0%, #e8f1fa 100%);
    --tm-card-header-border: #c5d9ed;
    --tm-link: #006bb7;
    --tm-accent: #1b6ec2;
    --tm-accent-shadow: rgba(27, 110, 194, 0.12);
    --tm-hover-overlay: rgba(0, 0, 0, 0.03);
    --tm-input-bg: #ffffff;
    --tm-input-color: #212529;
    --tm-input-border: #ced4da;
    --tm-code-bg: #f8f9fa;
    --tm-error-ui-bg: lightyellow;
    --tm-focus-ring-inner: #ffffff;
    --tm-alert-warning-bg: #fff3cd;
    --tm-alert-warning-color: #664d03;
    --tm-alert-warning-border: #ffecb5;
    --tm-alert-info-bg: #cff4fc;
    --tm-alert-info-color: #055160;
    --tm-alert-info-border: #b6effb;
    --tm-alert-success-bg: #d1e7dd;
    --tm-alert-success-color: #0f5132;
    --tm-alert-success-border: #badbcc;
    --tm-alert-danger-bg: #f8d7da;
    --tm-alert-danger-color: #842029;
    --tm-alert-danger-border: #f5c2c7;
    --tm-row-selected-bg: #e8f1fa;
    --tm-sla-breach-bg: #f8d7da;
    --tm-orphan-bg: #ffe0b2;
    --tm-note-internal-bg: #fff8e6;
    --tm-note-internal-border: #ffc107;
    --tm-note-discussion-bg: #f0f6fc;
    --tm-note-discussion-border: #1b6ec2;
}

html[data-theme="dark"] {
    color-scheme: dark;
    --tm-body-bg: #121212;
    --tm-body-color: #e8eaed;
    --tm-text-muted: #9aa0a6;
    --tm-text-secondary: #bdc1c6;
    --tm-surface: #1e1e1e;
    --tm-surface-2: #252525;
    --tm-surface-muted: #202020;
    --tm-border: #3c4043;
    --tm-border-strong: #5f6368;
    --tm-card-header-bg: linear-gradient(180deg, #1a2a3a 0%, #152030 100%);
    --tm-card-header-border: #2a4a6a;
    --tm-link: #8ab4f8;
    --tm-accent: #4a9eed;
    --tm-accent-shadow: rgba(74, 158, 237, 0.2);
    --tm-hover-overlay: rgba(255, 255, 255, 0.05);
    --tm-input-bg: #2d2d2d;
    --tm-input-color: #e8eaed;
    --tm-input-border: #5f6368;
    --tm-code-bg: #252525;
    --tm-error-ui-bg: #4a3c00;
    --tm-focus-ring-inner: #121212;
    --tm-alert-warning-bg: #332701;
    --tm-alert-warning-color: #ffda6a;
    --tm-alert-warning-border: #664d03;
    --tm-alert-info-bg: #032830;
    --tm-alert-info-color: #6edff6;
    --tm-alert-info-border: #055160;
    --tm-alert-success-bg: #051b11;
    --tm-alert-success-color: #75b798;
    --tm-alert-success-border: #0f5132;
    --tm-alert-danger-bg: #2c0b0e;
    --tm-alert-danger-color: #ea868f;
    --tm-alert-danger-border: #842029;
    --tm-row-selected-bg: #1a2a3a;
    --tm-sla-breach-bg: #5a2a30;
    --tm-orphan-bg: #6b4518;
    --tm-note-internal-bg: #2a2205;
    --tm-note-internal-border: #ffc107;
    --tm-note-discussion-bg: #16212e;
    --tm-note-discussion-border: #4a9eed;
}

html, body {
    background-color: var(--tm-body-bg);
    color: var(--tm-body-color);
}

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

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

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

/* Cards */

.card {
    background-color: var(--tm-surface);
    border-color: var(--tm-border);
    color: var(--tm-body-color);
}

.card-header {
    background: var(--tm-card-header-bg);
    border-bottom-color: var(--tm-card-header-border);
    color: var(--tm-body-color);
    font-weight: 600;
}

.card-footer {
    background-color: var(--tm-surface-2);
    border-top-color: var(--tm-border);
}

/* Forms */

.form-control,
.form-select {
    background-color: var(--tm-input-bg);
    color: var(--tm-input-color);
    border-color: var(--tm-input-border);
}

.form-control:focus,
.form-select:focus {
    background-color: var(--tm-input-bg);
    color: var(--tm-input-color);
    border-color: var(--tm-accent);
    box-shadow: 0 0 0 0.2rem var(--tm-accent-shadow);
}

.form-control::placeholder {
    color: var(--tm-text-muted);
}

.form-control:disabled,
.form-select:disabled {
    background-color: var(--tm-surface-2);
    color: var(--tm-text-muted);
}

.form-check-input {
    background-color: var(--tm-input-bg);
    border-color: var(--tm-border-strong);
}

.form-check-input:checked {
    background-color: var(--tm-accent);
    border-color: var(--tm-accent);
}

.input-group-text {
    background-color: var(--tm-surface-2);
    border-color: var(--tm-input-border);
    color: var(--tm-body-color);
}

/* Tables */

.table {
    --bs-table-bg: transparent;
    --bs-table-color: var(--tm-body-color);
    color: var(--tm-body-color);
    border-color: var(--tm-border);
}

.table > :not(caption) > * > * {
    background-color: transparent;
    border-bottom-color: var(--tm-border);
}

.table thead th {
    background-color: var(--tm-surface-2);
    color: var(--tm-body-color);
    border-bottom-color: var(--tm-border-strong);
    font-weight: 600;
}

.table-hover > tbody > tr:hover > * {
    background-color: var(--tm-hover-overlay);
    color: var(--tm-body-color);
}

/* Buttons */

.btn-outline-secondary {
    color: var(--tm-body-color);
    border-color: var(--tm-border-strong);
}

.btn-outline-secondary:hover {
    background-color: var(--tm-hover-overlay);
    color: var(--tm-body-color);
    border-color: var(--tm-border-strong);
}

/* Alerts */

.alert-warning {
    background-color: var(--tm-alert-warning-bg);
    color: var(--tm-alert-warning-color);
    border-color: var(--tm-alert-warning-border);
}

.alert-info {
    background-color: var(--tm-alert-info-bg);
    color: var(--tm-alert-info-color);
    border-color: var(--tm-alert-info-border);
}

.alert-success {
    background-color: var(--tm-alert-success-bg);
    color: var(--tm-alert-success-color);
    border-color: var(--tm-alert-success-border);
}

.alert-danger {
    background-color: var(--tm-alert-danger-bg);
    color: var(--tm-alert-danger-color);
    border-color: var(--tm-alert-danger-border);
}

/* Misc surfaces */

.list-group-item {
    background-color: var(--tm-surface);
    border-color: var(--tm-border);
    color: var(--tm-body-color);
}

.modal-content,
.dropdown-menu {
    background-color: var(--tm-surface);
    border-color: var(--tm-border);
    color: var(--tm-body-color);
}

.dropdown-item {
    color: var(--tm-body-color);
}

.dropdown-item:hover,
.dropdown-item:focus {
    background-color: var(--tm-hover-overlay);
    color: var(--tm-body-color);
}

.modal-header,
.modal-footer {
    border-color: var(--tm-border);
}

.nav-tabs {
    border-bottom-color: var(--tm-border);
}

.nav-tabs .nav-link {
    color: var(--tm-text-secondary);
    border-color: transparent;
}

.nav-tabs .nav-link:hover {
    border-color: var(--tm-border);
    background-color: var(--tm-hover-overlay);
}

.nav-tabs .nav-link.active {
    background-color: var(--tm-surface);
    border-color: var(--tm-border) var(--tm-border) var(--tm-surface);
    color: var(--tm-body-color);
}

code, pre {
    background-color: var(--tm-code-bg);
    color: var(--tm-body-color);
}

hr {
    border-color: var(--tm-border);
}

.badge.bg-light {
    background-color: var(--tm-surface-2) !important;
    color: var(--tm-body-color) !important;
}