@tailwind base;
@tailwind components;
@tailwind utilities;

/* Light mode (default) */
:root {
  --terminal-bg: #f0f0f0;
  --terminal-cyan: #0891b2;
  --terminal-magenta: #a21caf;
  --terminal-green: #16a34a;
  --terminal-yellow: #ca8a04;
  --terminal-red: #dc2626;
  --terminal-blue: #2563eb;
  --terminal-white: #1a1a1a;
  --terminal-muted: #6b7280;
  --terminal-border: #d4d4d4;
}

/* Dark mode */
.dark {
  --terminal-bg: #0a0a0a;
  --terminal-cyan: #00ffff;
  --terminal-magenta: #ff00ff;
  --terminal-green: #00ff00;
  --terminal-yellow: #ffff00;
  --terminal-red: #ff4444;
  --terminal-blue: #0088ff;
  --terminal-white: #ffffff;
  --terminal-muted: #666666;
  --terminal-border: #333333;
}

* { scrollbar-width: thin; scrollbar-color: var(--terminal-cyan) var(--terminal-bg); }
*::-webkit-scrollbar { width: 8px; }
*::-webkit-scrollbar-track { background: var(--terminal-bg); }
*::-webkit-scrollbar-thumb { background: var(--terminal-cyan); border-radius: 4px; }

::selection { background: var(--terminal-cyan); color: var(--terminal-bg); }
:focus-visible { outline: 2px solid var(--terminal-cyan); outline-offset: 2px; }