/* ── Sidebar ─────────────────────────────────────────────────────────────── */

.sidebar {
    background: var(--bs-body-bg);
    position: sticky;
    top: 56px; /* navbar height */
    height: calc(100vh - 56px);
    overflow-y: auto;
    flex-shrink: 0;
}

.sidebar-run-item {
    transition: background 0.15s;
    cursor: pointer;
}

.sidebar-run-item:hover {
    background: var(--bs-tertiary-bg);
}

/* Active nav link */
.sidebar .nav-link {
    color: var(--bs-body-color);
    border-radius: 0.375rem;
    padding: 0.35rem 0.6rem;
}

.sidebar .nav-link.active {
    font-weight: 600;
    color: var(--bs-primary);
    background: var(--bs-primary-bg-subtle);
}

.sidebar .nav-link:hover:not(.active) {
    background: var(--bs-tertiary-bg);
}

/* ── Log viewer ──────────────────────────────────────────────────────────── */

#log-output {
    background: var(--bs-dark-bg-subtle);
    color: var(--bs-body-color);
    font-family: 'Courier New', Courier, monospace;
    font-size: 0.8rem;
    white-space: pre-wrap;
    word-break: break-all;
    min-height: 300px;
    max-height: 600px;
    overflow-y: auto;
}

/* ── Tables ──────────────────────────────────────────────────────────────── */

.table th {
    white-space: nowrap;
    font-size: 0.85rem;
    font-weight: 600;
}

.table td {
    font-size: 0.875rem;
    vertical-align: middle;
}

/* Sortable column header */
.sortable {
    cursor: pointer;
    user-select: none;
}

.sortable:hover {
    background: var(--bs-tertiary-bg);
}

/* ── Cards ───────────────────────────────────────────────────────────────── */

.card-header {
    font-weight: 600;
    font-size: 0.9rem;
}

/* ── Navbar ──────────────────────────────────────────────────────────────── */

.navbar {
    position: sticky;
    top: 0;
    z-index: 1030;
    background: var(--bs-body-bg);
}

/* ── Metric value display ────────────────────────────────────────────────── */

.metric-good   { color: var(--bs-success); }
.metric-bad    { color: var(--bs-danger);  }
.metric-neutral{ color: var(--bs-body-color); }

/* ── Responsive: hide sidebar on small screens ───────────────────────────── */

@media (max-width: 768px) {
    .sidebar {
        display: none;
    }
    main {
        padding-left: 1rem !important;
    }
}