/* Terminal Theme - CSS Custom Properties */

:root {
  /* Colors - per user decision */
  --terminal-bg: #000000;        /* Pure black per user decision */
  --terminal-fg-rgb: 0, 255, 0;
  --terminal-fg: rgb(var(--terminal-fg-rgb));        /* Classic green */
  --terminal-fg-dim: rgba(var(--terminal-fg-rgb), 0.7);
  --terminal-accent: #ffffff;    /* White for interactive/highlighted */
  --terminal-scrollbar-bg: #000000;
  --terminal-scrollbar-track: #020902;
  --terminal-scrollbar-thumb: #063506;
  --terminal-scrollbar-thumb-hover: #0a520a;
  --terminal-scrollbar-border: rgb(var(--terminal-fg-rgb));

  /* Typography - using IBM Plex Mono (best terminal feel, open source) */
  --terminal-font: 'IBM Plex Mono', 'Courier New', Consolas, Monaco, monospace;
  --terminal-font-size-base: 1rem;
  --terminal-font-size-mobile: 1rem;  /* 16px minimum per user decision */
  --terminal-line-height: 1.6;

  /* Spacing - spacious modern feel (mobile-first) */
  --terminal-padding-mobile: 1rem;
  --terminal-padding-tablet: 2rem;
  --terminal-padding-desktop: 3rem;
  --terminal-padding: var(--terminal-padding-mobile);
  --terminal-gap: 0.75rem;

  /* CRT Effects */
  --terminal-scanline-opacity: 0.15;  /* Subtle, barely visible */
  --terminal-glow-color: rgba(var(--terminal-fg-rgb), 0.4);
  --terminal-glow-spread: 2px;

  /* Animation */
  --terminal-animation-duration: 0.3s;
}

:root[data-colorblind='true'] {
  --terminal-fg-rgb: 255, 191, 0;
  --terminal-fg: rgb(var(--terminal-fg-rgb));
  --terminal-fg-dim: rgba(var(--terminal-fg-rgb), 0.78);
  --terminal-accent: #ffd580;
  --terminal-scrollbar-track: #120d00;
  --terminal-scrollbar-thumb: #4a3200;
  --terminal-scrollbar-thumb-hover: #6b4600;
  --terminal-scrollbar-border: rgb(var(--terminal-fg-rgb));
  --terminal-glow-color: rgba(var(--terminal-fg-rgb), 0.35);
}

/* Apply base terminal styles to body */
body {
  background-color: var(--terminal-bg);
  color: var(--terminal-fg);
  font-family: var(--terminal-font);
  font-size: var(--terminal-font-size-base);
  line-height: var(--terminal-line-height);
}

/* Responsive breakpoints - mobile-first */

/* Tablet (768px+) */
@media (min-width: 48rem) {
  :root {
    --terminal-padding: var(--terminal-padding-tablet);
    --terminal-font-size-base: 1.0625rem; /* 17px */
  }
}

/* Desktop (1024px+) */
@media (min-width: 64rem) {
  :root {
    --terminal-padding: var(--terminal-padding-desktop);
    --terminal-font-size-base: 1.125rem; /* 18px */
  }
}

/* Accessibility - respect user's motion preference */
@media (prefers-reduced-motion: reduce) {
  :root {
    --terminal-animation-duration: 0s;
    --terminal-scanline-opacity: 0.1; /* Keep subtle static effect */
  }

  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
  :root {
    --terminal-scanline-opacity: 0;
    --terminal-glow-spread: 0;
  }
}