@keyframes terminal-flicker {
    0%, 100% { opacity: 0.8; }
    50% { opacity: 1; }
}

@keyframes scanline {
    0% { background-position: 0 -100px; }
    100% { background-position: 0 100%; }
}

.terminal-effect {
    position: relative;
}

.terminal-effect::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(
        rgba(18, 16, 16, 0) 50%, 
        rgba(0, 0, 0, 0.25) 50%
    );
    background-size: 100% 4px;
    pointer-events: none;
    animation: scanline 4s linear infinite;
    z-index: 10;
}

.terminal-effect::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(16, 16, 16, 0.1);
    pointer-events: none;
    animation: terminal-flicker 0.1s infinite;
    z-index: 11;
}
/* Role-specific styles */
[data-role="scientist"] {
  --text-font: "Playfair Display", serif;
  --code-font: "JetBrains Mono", monospace;
}

[data-role="annotator"] {
  --primary-accent: #EF4444;
}

/* Role context colors */
.role-engineering { color: #3B82F6; }
.role-operator { color: #A855F7; }
.role-auditor { color: #F97316; }
.role-scientist { color: #22C55E; }
.role-annotator { color: #EF4444; }
/* Tooltip styles */
.tooltip {
  position: relative;
}

.tooltip::after {
  content: attr(data-tooltip);
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(0,0,0,0.8);
  color: white;
  padding: 0.25rem 0.5rem;
  border-radius: 0.25rem;
  font-size: 0.75rem;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease;
}

.tooltip:hover::after {
  opacity: 1;
}

/* Chart view toggle */
.workflow-metrics.chart-view {
  grid-template-columns: 1fr !important;
}

.workflow-metrics.chart-view > div {
  grid-column: span 1 !important;
}

/* Custom scrollbar */
::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    background: #1a1a1a;
}

::-webkit-scrollbar-thumb {
    background: #333;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #444;
}

/* Terminal cursor animation */
.xterm-cursor {
    animation: blink 1s infinite;
}
@keyframes blink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0; }
}
/* Animation for semantic explorer */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animate-fade-in-up {
  animation: fadeInUp 0.5s ease forwards;
}

/* Form elements */
select, input {
  background: rgba(30, 41, 59, 0.5);
  border: 1px solid rgba(71, 85, 105, 0.3);
  color: #f0f0f0;
  outline: none;
  transition: all 0.2s ease;
}

select:focus, input:focus {
  border-color: #3B82F6;
  box-shadow: 0 0 0 1px #3B82F6;
}

/* Status indicators */
#stream-status, #model-status {
  font-weight: 500;
}

#stream-status[data-status="error"] {
  color: #EF4444;
}

#stream-status[data-status="success"] {
  color: #22C55E;
}
