/* Minimal custom styles — Tailwind CDN handles the rest */

/* Sidebar active state */
.nav-active {
    background-color: rgba(59, 130, 246, 0.15);
    border-left: 3px solid #3b82f6;
    color: #3b82f6;
    font-weight: 600;
}

/* Table hover */
.data-table tbody tr:hover {
    background-color: rgba(59, 130, 246, 0.05);
}

/* Sort indicator */
th.sortable { cursor: pointer; user-select: none; }
th.sortable::after { content: ' ↕'; opacity: 0.3; font-size: 0.75rem; }
th.sort-asc::after { content: ' ↑'; opacity: 1; }
th.sort-desc::after { content: ' ↓'; opacity: 1; }

/* Pulse dot for connection status */
.pulse-dot {
    width: 10px; height: 10px; border-radius: 50%;
    display: inline-block;
}
.pulse-dot.ok { background: #22c55e; box-shadow: 0 0 6px #22c55e; }
.pulse-dot.err { background: #ef4444; box-shadow: 0 0 6px #ef4444; }

/* Severity badges */
.badge-warning { background: #fbbf24; color: #78350f; }
.badge-info { background: #60a5fa; color: #1e3a5f; }
.badge-error { background: #f87171; color: #7f1d1d; }

/* Loading spinner */
.spinner {
    border: 3px solid #e5e7eb;
    border-top-color: #3b82f6;
    border-radius: 50%;
    width: 24px; height: 24px;
    animation: spin 0.6s linear infinite;
    display: inline-block;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* Scrollable table container */
.table-container {
    overflow-x: auto;
    max-height: calc(100vh - 220px);
    overflow-y: auto;
}

/* Diff styling */
.diff-added { background: #dcfce7; }
.diff-removed { background: #fee2e2; }
.diff-changed { background: #fef9c3; }