:root {
    --bs-body-bg: #121212;
    --bs-body-color: #E0E0E0;
    --bs-secondary-color: #A0A0A0;
    --surface-bg: #1E1E1E;
    --primary-accent: #00A8FF;
}

body {
    font-family: 'Inter', sans-serif;
}

.bg-surface {
    background-color: var(--surface-bg) !important;
}

.navbar-brand, .nav-link {
    color: var(--bs-body-color) !important;
}

.nav-link:hover, .nav-link.active {
    color: var(--primary-accent) !important;
}

.hero .lead {
    color: var(--bs-secondary-color) !important;
}

.card {
    border: 1px solid #333;
    border-radius: 0.5rem;
}

.card-header {
    background-color: rgba(255, 255, 255, 0.03);
    border-bottom: 1px solid #333;
}

.table {
    --bs-table-bg: transparent;
    --bs-table-hover-bg: rgba(255, 255, 255, 0.04);
    --bs-table-color: var(--bs-body-color);
}

.table thead th {
    border-bottom: 2px solid #444;
    color: var(--bs-secondary-color);
    font-weight: 500;
}

.table td, .table th {
    border-top: 1px solid #333;
}

.table-hover tbody tr:hover {
    color: var(--bs-body-color);
}

.progress {
    background-color: #444;
    border-radius: 0.25rem;
}

.progress-bar {
    background-color: var(--primary-accent);
    font-weight: 600;
    color: #121212;
}

.badge {
    border-radius: 0.25rem;
    padding: 0.3em 0.6em;
}

.btn-primary {
    background-color: var(--primary-accent);
    border-color: var(--primary-accent);
}

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

i[data-feather] {
    width: 16px;
    height: 16px;
    vertical-align: text-bottom;
}