/* =============================================================
   LAB THEME EXTENSION (No explicit brand names)
   =============================================================
   Purpose: Futuristic, research-focused visual layer to layer
   atop base tokens. Avoids explicit brand references.
   ============================================================= */
:root {
  /* Neutral adjustments */
  --lab-bg: linear-gradient(145deg, #0d1117 0%, #121a24 50%, #0d1117 100%);
  --lab-surface: #161f28;
  --lab-surface-alt: #1d2732;
  --lab-grid-line: rgb(255 255 255 / 5%);
  --lab-accent-1: #3b82f6; /* cool data glow */
  --lab-accent-2: #06b6d4; /* cyan secondary */
  --lab-accent-3: #f43f5e; /* signal alert */
  --lab-accent-glow: 0 0 0 1px rgb(59 130 246 / 40%), 0 0 12px rgb(59 130 246 / 30%);
  --lab-focus-ring: 0 0 0 2px rgb(6 182 212 / 60%);
  --lab-radius-sm: 4px;
  --lab-radius-md: 8px;
  --lab-radius-lg: 14px;
}

/* Page background layer */
html[data-theme="dark"] body {
  background: var(--lab-bg);
  background-attachment: fixed;
}

/* Subtle grid overlay for analytical feel */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background-image: linear-gradient(to right, var(--lab-grid-line) 1px, transparent 1px),
    linear-gradient(to bottom, var(--lab-grid-line) 1px, transparent 1px);
  background-size: 60px 60px;
  mix-blend-mode: overlay;
  opacity: 0.35;
  z-index: -1;
}

/* Data cards refinement */
.metric-card,
.explorer-card,
.action-item,
.quick-link-card,
.table-container {
  background: radial-gradient(circle at top left, rgb(255 255 255 / 4%), transparent 70%),
    var(--lab-surface);
  border: 1px solid rgb(255 255 255 / 8%);
  box-shadow: 0 4px 14px -3px rgb(0 0 0 / 60%), 0 0 0 1px rgb(255 255 255 / 4%);
}

.metric-card.primary {
  background: linear-gradient(135deg, rgb(249 115 22 / 15%), rgb(168 85 247 / 15%)), var(--lab-surface);
}

/* Hover analytical glow */
.metric-card:hover,
.explorer-card:hover,
.action-item:hover,
.quick-link-card:hover {
  box-shadow: var(--lab-accent-glow);
  border-color: rgb(59 130 246 / 40%);
}

/* Refined badges */
.badge,
.status-badge,
.service-tag {
  backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  border: 1px solid rgb(255 255 255 / 10%);
}

/* Focus states */
:where(button, a, input, select, textarea):focus-visible {
  outline: none;
  box-shadow: var(--lab-focus-ring);
}

/* Analytical headings */
.heading-1, h1 {
  letter-spacing: -0.5px;
  text-shadow: 0 2px 12px rgb(0 0 0 / 50%);
}

.heading-2, h2 {
  letter-spacing: -0.25px;
}

/* Compact table tweaks */
.data-table th,
.data-table td {
  white-space: nowrap;
}

/* Mini trend placeholders (can be replaced later) */
.trend-up { color: #10b981; }
.trend-flat { color: #9ca3af; }
.trend-down { color: #ef4444; }

/* Explorer type badge override */
.badge.badge-state {
  background: rgb(59 130 246 / 18%);
  color: #60a5fa;
  border-color: rgb(59 130 246 / 35%);
}

/* Service tags subtle glow */
.service-tag {
  box-shadow: 0 0 0 1px rgb(6 182 212 / 30%), 0 0 8px -2px rgb(6 182 212 / 40%);
}

/* Reduce large empty vertical spans in sections */
.section.section-sm + .section.section-sm { margin-top: 1.5rem; }

/* Ultra-wide density adjustment */
@media (width >= 1400px) {
  .explorer-grid { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }
  .metrics-grid { grid-template-columns: repeat(4, 1fr); }
}

/* Print adjustments (keep neutral) */
@media print {
  body::before { display: none; }
}