/* ==========================================================================
   Intel 8085 Master Studio & MiniC Compiler - Core Design System & Styles
   ========================================================================== */

/* Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=JetBrains+Mono:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&family=Outfit:wght@400;600;700;800&display=swap');

/* Universal Box-Sizing & Resets */
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

:root {
  --bg-tech: #070a12;
  --bg-surface: #0d1322;
  --bg-card: #121a2d;
  --border-dark: #1e293b;
  --border-light: rgba(255, 255, 255, 0.08);
  
  --cyan-bright: #00f0ff;
  --cyan-dark: #0891b2;
  --pink-bright: #f43f5e;
  --emerald-bright: #10b981;
  --amber-bright: #f59e0b;
  --purple-bright: #a855f7;
  --blue-bright: #3b82f6;
}

html, body {
  background-color: var(--bg-tech);
  color: #f1f5f9;
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

code, pre, .font-mono {
  font-family: 'JetBrains Mono', 'Fira Code', 'Courier New', monospace;
}

.font-display {
  font-family: 'Outfit', 'Inter', sans-serif;
}

/* Custom Scrollbars */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: #070a12; }
::-webkit-scrollbar-thumb { background: #1e293b; border-radius: 6px; }
::-webkit-scrollbar-thumb:hover { background: #0891b2; }

/* Glowing Circuit & Bus Animations */
@keyframes pulseGlowCyan {
  0%, 100% { filter: drop-shadow(0 0 2px rgba(0,240,255,0.4)); opacity: 0.8; }
  50% { filter: drop-shadow(0 0 10px rgba(0,240,255,1)); opacity: 1; }
}
@keyframes pulseGlowPink {
  0%, 100% { filter: drop-shadow(0 0 2px rgba(244,63,94,0.4)); }
  50% { filter: drop-shadow(0 0 10px rgba(244,63,94,1)); }
}
@keyframes pulseGlowAmber {
  0%, 100% { filter: drop-shadow(0 0 2px rgba(245,158,11,0.4)); }
  50% { filter: drop-shadow(0 0 10px rgba(245,158,11,1)); }
}
@keyframes pulseGlowEmerald {
  0%, 100% { filter: drop-shadow(0 0 2px rgba(16,185,129,0.4)); }
  50% { filter: drop-shadow(0 0 10px rgba(16,185,129,1)); }
}

.active-data-bus {
  animation: pulseGlowCyan 0.8s infinite ease-in-out;
  stroke: #00f0ff !important;
  stroke-width: 3.5 !important;
}
.active-alu-bus {
  animation: pulseGlowPink 0.8s infinite ease-in-out;
  stroke: #f43f5e !important;
  stroke-width: 3.5 !important;
}
.active-ctrl-bus {
  animation: pulseGlowAmber 0.8s infinite ease-in-out;
  stroke: #f59e0b !important;
  stroke-width: 3.5 !important;
}
.active-addr-bus {
  animation: pulseGlowEmerald 0.8s infinite ease-in-out;
  stroke: #10b981 !important;
  stroke-width: 3.5 !important;
}

.glow-cyan { box-shadow: 0 0 20px rgba(0, 240, 255, 0.4); border-color: #00f0ff !important; }
.glow-pink { box-shadow: 0 0 20px rgba(244, 63, 94, 0.4); border-color: #f43f5e !important; }
.glow-green { box-shadow: 0 0 20px rgba(16, 185, 129, 0.4); border-color: #10b981 !important; }
.glow-amber { box-shadow: 0 0 20px rgba(245, 158, 11, 0.4); border-color: #f59e0b !important; }

/* Grid Background */
.grid-bg {
  background-size: 32px 32px;
  background-image: 
    linear-gradient(to right, rgba(255, 255, 255, 0.025) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255, 255, 255, 0.025) 1px, transparent 1px);
}

/* Glassmorphism Styles */
.glass-card {
  background: rgba(18, 26, 45, 0.75);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, 0.07);
}

.glass-header {
  background: rgba(13, 19, 34, 0.85);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

/* Line Highlighter */
.line-num-exec {
  color: #00f0ff !important;
  font-weight: 800 !important;
  background: rgba(6, 182, 212, 0.15);
  border-radius: 4px;
}

/* 7-Segment Display Segments */
.seg-off { fill: #1e293b; opacity: 0.25; }
.seg-on { fill: #f43f5e; filter: drop-shadow(0 0 6px rgba(244, 63, 94, 0.9)); opacity: 1; }