/* ── Terminal Resume ── CRT-style interactive terminal ────────────── */

/* Color themes */
[data-color="green"] {
  --term-fg: #00ff41;
  --term-dim: #00aa2a;
  --term-bright: #7dffab;
  --term-glow: rgba(0, 255, 65, 0.15);
  --term-glow-strong: rgba(0, 255, 65, 0.25);
  --term-prompt: #00cc33;
  --term-error: #ff4444;
  --term-accent: #00ff41;
}
[data-color="amber"] {
  --term-fg: #ffb000;
  --term-dim: #cc8800;
  --term-bright: #ffd966;
  --term-glow: rgba(255, 176, 0, 0.15);
  --term-glow-strong: rgba(255, 176, 0, 0.25);
  --term-prompt: #ffb000;
  --term-error: #ff4444;
  --term-accent: #ffd966;
}
[data-color="cyan"] {
  --term-fg: #00e5ff;
  --term-dim: #00a0b2;
  --term-bright: #80f0ff;
  --term-glow: rgba(0, 229, 255, 0.15);
  --term-glow-strong: rgba(0, 229, 255, 0.25);
  --term-prompt: #00c8dd;
  --term-error: #ff4444;
  --term-accent: #80f0ff;
}

/* Container */
.terminal-container {
  position: relative;
  height: 100vh;
  background: #0a0a0a;
  font-family: 'JetBrains Mono', 'Fira Code', 'Courier New', monospace;
  font-size: 14px;
  line-height: 1.6;
  color: var(--term-fg);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

/* CRT scanlines */
.terminal-container::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: repeating-linear-gradient(
    0deg,
    transparent,
    transparent 1px,
    rgba(0, 0, 0, 0.15) 1px,
    rgba(0, 0, 0, 0.15) 2px
  );
  z-index: 10;
}

/* CRT screen glow */
.terminal-container::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  box-shadow:
    inset 0 0 120px var(--term-glow),
    inset 0 0 60px var(--term-glow);
  z-index: 9;
}

/* Window chrome */
.terminal-header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  background: #1a1a1a;
  border-bottom: 1px solid #2a2a2a;
  flex-shrink: 0;
  z-index: 11;
}

.terminal-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
}
.terminal-dot--red { background: #ff5f57; }
.terminal-dot--yellow { background: #febc2e; }
.terminal-dot--green { background: #28c840; }

.terminal-header-title {
  flex: 1;
  text-align: center;
  color: #666;
  font-size: 12px;
  letter-spacing: 0.5px;
}

.terminal-header-exit {
  font-size: 11px;
  color: #555;
  text-decoration: none;
  transition: color 0.2s;
}
.terminal-header-exit:hover {
  color: var(--term-fg);
}

/* Terminal body (scrollable output area) */
.terminal-body {
  flex: 1;
  overflow-y: auto;
  padding: 20px 20px 0;
  z-index: 11;
  position: relative;
}

/* Scrollbar */
.terminal-body::-webkit-scrollbar { width: 6px; }
.terminal-body::-webkit-scrollbar-track { background: transparent; }
.terminal-body::-webkit-scrollbar-thumb {
  background: #333;
  border-radius: 3px;
}
.terminal-body::-webkit-scrollbar-thumb:hover { background: #555; }

/* Output lines */
.term-line {
  white-space: pre-wrap;
  word-wrap: break-word;
  min-height: 1.6em;
}
.term-dim { color: var(--term-dim); }
.term-bright { color: var(--term-bright); }
.term-error { color: var(--term-error); }
.term-accent { color: var(--term-accent); }
.term-prompt-echo { color: var(--term-prompt); }
.term-header {
  color: var(--term-bright);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.term-separator {
  color: #333;
}
.term-label {
  color: var(--term-dim);
}
.term-value {
  color: var(--term-fg);
}

/* ASCII art */
.term-ascii {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px;
  line-height: 1.15;
  color: var(--term-bright);
  margin: 0;
  white-space: pre;
  overflow-x: auto;
  text-shadow: 0 0 10px var(--term-glow-strong);
}

@media (min-width: 640px) {
  .term-ascii { font-size: 13px; }
}

@media (min-width: 768px) {
  .term-ascii { font-size: 16px; }
}

/* Input area */
.terminal-input-area {
  display: flex;
  align-items: center;
  padding: 8px 20px 20px;
  flex-shrink: 0;
  z-index: 11;
  position: relative;
}

.terminal-prompt {
  color: var(--term-prompt);
  white-space: nowrap;
  margin-right: 8px;
  user-select: none;
}

.terminal-input {
  flex: 1;
  background: transparent;
  border: none;
  outline: none;
  color: var(--term-fg);
  font-family: 'JetBrains Mono', 'Fira Code', 'Courier New', monospace;
  font-size: 14px;
  caret-color: var(--term-fg);
  padding: 0;
}

/* Blinking cursor (shown when input is empty) */
.terminal-cursor {
  display: inline-block;
  width: 8px;
  height: 16px;
  background: var(--term-fg);
  animation: cursor-blink 1s step-end infinite;
  vertical-align: text-bottom;
  margin-left: -2px;
}

.terminal-input:focus ~ .terminal-cursor {
  display: none;
}

@keyframes cursor-blink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0; }
}

/* Section dividers for resume output */
.term-box-top,
.term-box-bottom {
  color: #333;
}

/* Skills chips */
.term-skill-list {
  color: var(--term-dim);
}
.term-skill-list strong {
  color: var(--term-fg);
  font-weight: normal;
}

/* Typing animation for boot */
.term-typing {
  overflow: hidden;
  border-right: 2px solid var(--term-fg);
  white-space: nowrap;
  animation: typing-cursor 0.7s step-end infinite;
}

@keyframes typing-cursor {
  0%, 100% { border-color: var(--term-fg); }
  50% { border-color: transparent; }
}

/* Flicker on boot */
@keyframes flicker {
  0% { opacity: 0.1; }
  2% { opacity: 1; }
  4% { opacity: 0.3; }
  8% { opacity: 1; }
  70% { opacity: 0.7; }
  100% { opacity: 1; }
}

.term-flicker {
  animation: flicker 0.3s ease-in-out;
}

/* CRT turn-on effect */
@keyframes crt-on {
  0% {
    transform: scaleY(0.005) scaleX(0.3);
    filter: brightness(30);
  }
  10% {
    transform: scaleY(0.005) scaleX(1);
  }
  30% {
    transform: scaleY(1) scaleX(1);
    filter: brightness(1.5);
  }
  100% {
    transform: scaleY(1) scaleX(1);
    filter: brightness(1);
  }
}

.terminal-container.booting {
  animation: crt-on 0.6s ease-out;
}

/* Mobile adjustments */
@media (max-width: 639px) {
  .terminal-container { font-size: 12px; }
  .terminal-body { padding: 12px 12px 0; }
  .terminal-input-area { padding: 8px 12px 16px; }
  .terminal-input { font-size: 12px; }
}