/* zagdul.de — C64 Retro Gaming */
@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&family=Space+Mono:wght@400;700&family=JetBrains+Mono:wght@400;700&display=swap');

:root {
  --font-body: 'Space Mono', monospace;
  --font-brand: 'Press Start 2P', monospace;
  --font-code: 'JetBrains Mono', monospace;
}

[data-theme=dark] {
  --color-bg: #40318d;
  --color-surface: rgba(0,0,0,0.25);
  --color-border: #6c5eb5;
  --color-text: #e2e0f0;
  --color-text-secondary: #9f97c7;
  --color-text-muted: #6c5eb5;
  --color-primary: #6acfc7;
  --color-secondary: #a78bfa;
  --color-code-bg: rgba(0,0,0,0.35);
}

[data-theme=light] {
  --color-bg: #ede9fe;
  --color-surface: #ffffff;
  --color-border: #c4b5fd;
  --color-text: #2e1065;
  --color-text-secondary: #5b21b6;
  --color-text-muted: #7c3aed;
  --color-primary: #6acfc7;
  --color-secondary: #a78bfa;
  --color-code-bg: #f5f3ff;
}

/* Brand styling: uppercase, C64 cyan underline */
.navbar-brand {
  font-family: var(--font-brand);
  font-size: 1rem;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--color-secondary);
  border-bottom: 2px solid var(--color-primary);
  padding-bottom: 2px;
}

/* Purple-tinted navbar */
[data-theme=dark] .navbar { background: rgba(0,0,0,0.4); }
[data-theme=light] .navbar { background: #ddd6fe; }

/* C64-style: angular cards, pixel border */
.card { border-radius: 4px; }
.post-card { border-top: 3px solid var(--color-primary); border-radius: 4px; }

/* Accent bar: cyan → violet */
.accent-bar { background: linear-gradient(90deg, var(--color-primary), var(--color-secondary)); }

/* Background pattern: CRT scanlines + pixel grid (retro C64) */
[data-theme=dark] body {
  background:
    repeating-linear-gradient(
      0deg,
      transparent,
      transparent 2px,
      rgba(0,0,0,0.12) 2px,
      rgba(0,0,0,0.12) 4px
    ),
    radial-gradient(circle, rgba(106,207,199,0.06) 1px, transparent 1px);
  background-size: 100% 4px, 20px 20px;
  background-color: #40318d;
}
[data-theme=light] body {
  background:
    repeating-linear-gradient(
      0deg,
      transparent,
      transparent 2px,
      rgba(108,94,181,0.04) 2px,
      rgba(108,94,181,0.04) 4px
    ),
    radial-gradient(circle, rgba(108,94,181,0.05) 1px, transparent 1px);
  background-size: 100% 4px, 20px 20px;
  background-color: #ede9fe;
}