/* Dark Mode Styles */
html.dark-mode,
html.dark-mode body {
    background-color: #1a1a1a;
    color: #e0e0e0;
}

html.dark-mode .card,
body.dark-mode .card {
    background-color: #2d2d2d;
    border-color: #3d3d3d;
    color: #e0e0e0;
}

body.dark-mode .card-header {
    background-color: #252525;
    border-color: #3d3d3d;
    color: #e0e0e0;
}

body.dark-mode .form-control,
body.dark-mode .form-select {
    background-color: #333333;
    border-color: #444444;
    color: #e0e0e0;
}

body.dark-mode .form-control:focus,
body.dark-mode .form-select:focus {
    background-color: #3a3a3a;
    border-color: #0d6efd;
    color: #e0e0e0;
}

body.dark-mode .table {
    color: #e0e0e0;
}

body.dark-mode .table thead th {
    background-color: #2d2d2d;
    border-color: #3d3d3d;
}

body.dark-mode .table tbody tr {
    background-color: #252525;
    border-color: #3d3d3d;
}

body.dark-mode .table tbody tr:hover {
    background-color: #2d2d2d;
}

body.dark-mode .list-group-item {
    background-color: #2d2d2d;
    border-color: #3d3d3d;
    color: #e0e0e0;
}

body.dark-mode .list-group-item.active {
    background-color: #0d6efd;
    border-color: #0d6efd;
}

body.dark-mode .badge {
    background-color: #3d3d3d;
    color: #e0e0e0;
}

body.dark-mode .alert {
    background-color: #2d2d2d;
    border-color: #3d3d3d;
    color: #e0e0e0;
}

body.dark-mode .modal-content {
    background-color: #2d2d2d;
    color: #e0e0e0;
}

body.dark-mode .modal-header,
body.dark-mode .modal-footer {
    border-color: #3d3d3d;
}

body.dark-mode .text-muted {
    color: #a0a0a0 !important;
}

body.dark-mode .breadcrumb {
    background-color: #2d2d2d;
}

body.dark-mode .breadcrumb-item.active {
    color: #a0a0a0;
}

/* Compact Mode Styles */
body.compact-mode .card {
    margin-bottom: 0.75rem;
}

body.compact-mode .card-body {
    padding: 0.75rem;
}

body.compact-mode .form-group,
body.compact-mode .mb-3 {
    margin-bottom: 0.75rem !important;
}

body.compact-mode .btn {
    padding: 0.25rem 0.75rem;
    font-size: 0.875rem;
}

body.compact-mode h1, body.compact-mode .h1 {
    font-size: 1.75rem;
}

body.compact-mode h2, body.compact-mode .h2 {
    font-size: 1.5rem;
}

body.compact-mode h3, body.compact-mode .h3 {
    font-size: 1.25rem;
}

body.compact-mode h4, body.compact-mode .h4 {
    font-size: 1.1rem;
}

body.compact-mode h5, body.compact-mode .h5 {
    font-size: 1rem;
}

body.compact-mode .table td,
body.compact-mode .table th {
    padding: 0.5rem;
}

body.compact-mode .list-group-item {
    padding: 0.5rem 1rem;
}