:root {
  --bg-body: #1a1a2e;
  --bg-card: #16213e;
  --bg-table: #0f3460;
  --text-primary: #e0e0e0;
  --accent: #00d4ff;
}

body {
  background: var(--bg-body);
  color: var(--text-primary);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  font-size: 0.85rem;
}

/* Navbar */
.navbar { background: var(--bg-card) !important; }
.navbar-brand { color: var(--accent) !important; font-weight: 700; }
.nav-link.active { color: var(--accent) !important; }

/* Log table */
.table-logs { font-size: 0.8rem; }
.table-logs th { position: sticky; top: 0; z-index: 10; background: var(--bg-card); white-space: nowrap; }
.table-logs td { vertical-align: top; max-width: 400px; word-break: break-word; }
.table-logs tr:hover { background: rgba(0, 212, 255, 0.05); }

/* Level badges */
.badge-error { background: #dc3545 !important; }
.badge-warn { background: #ffc107 !important; color: #000 !important; }
.badge-info { background: #0d6efd !important; }

/* Transform badges */
.badge-ice { background: #e83e8c !important; }
.badge-timeout { background: #fd7e14 !important; }

/* Tag badges */
.badge-tag {
  background: #6c757d;
  cursor: pointer;
  margin: 1px;
  font-weight: normal;
}
.badge-tag:hover { background: var(--accent); color: #000; }
.badge-tag.active { background: var(--accent); color: #000; }

/* Clickable cells */
.clickable { cursor: pointer; color: var(--accent); }
.clickable:hover { text-decoration: underline; }

/* Filters bar */
.filters-bar {
  background: var(--bg-card);
  border-radius: 8px;
  padding: 12px;
  margin-bottom: 12px;
}
.filters-bar .form-control,
.filters-bar .form-select {
  background: var(--bg-body);
  border-color: #333;
  color: var(--text-primary);
  font-size: 0.8rem;
}
.filters-bar label { font-size: 0.75rem; color: #999; }

/* Level filter buttons */
.level-btn { border-radius: 20px; font-size: 0.75rem; padding: 2px 10px; }
.level-btn.active { box-shadow: 0 0 0 2px var(--accent); }

/* SSE indicator */
.sse-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  display: inline-block;
  margin-right: 4px;
}
.sse-dot.connected { background: #28a745; }
.sse-dot.disconnected { background: #dc3545; }

/* Messages column */
.log-messages { font-family: monospace; font-size: 0.78rem; }
.log-url { font-size: 0.75rem; }

/* Date column */
.log-date { white-space: nowrap; font-size: 0.75rem; color: #aaa; }

/* Delete button */
.btn-delete {
  padding: 0 4px;
  font-size: 0.7rem;
  opacity: 0.4;
}
.btn-delete:hover { opacity: 1; }

/* Login */
.login-container {
  max-width: 360px;
  margin: 120px auto;
}

/* Simple version hides columns */
.simple-version .col-level,
.simple-version .col-ua,
.simple-version .col-user,
.simple-version .col-userid,
.simple-version .col-connid { display: none; }

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

/* Stats table */
.stats-table td { font-family: monospace; font-size: 0.78rem; }

/* Material symbols size */
.material-symbols-outlined { font-size: 18px; vertical-align: middle; }

/* Active filter indicator */
.filter-active { border-color: var(--accent) !important; box-shadow: 0 0 0 1px var(--accent); }