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

@layer base {
  :root {
    /* Pure Black & Green Terminal Theme - HSL Values */
    /* #000000 */
    --background: 0 0% 0%;
    /* #33ff00 - Phosphor Green */
    --foreground: 108 100% 50%;

    /* #050505 */
    --card: 0 0% 2%;
    --card-foreground: 108 100% 50%;

    /* #000000 */
    --popover: 0 0% 0%;
    --popover-foreground: 108 100% 50%;

    /* #33ff00 */
    --primary: 108 100% 50%;
    --primary-foreground: 0 0% 0%;

    /* #002200 */
    --secondary: 120 100% 7%;
    --secondary-foreground: 108 100% 50%;

    /* #001100 */
    --muted: 120 100% 3%;
    --muted-foreground: 120 100% 27%;

    /* #003300 */
    --accent: 120 100% 10%;
    --accent-foreground: 108 100% 50%;

    /* #cc0000 */
    --destructive: 0 100% 40%;
    --destructive-foreground: 0 0% 0%;

    /* #004400 */
    --border: 120 100% 13%;
    --input: 120 100% 13%;
    --ring: 108 100% 50%;

    --radius: 0rem;
  }

  .dark {
    --background: 0 0% 0%;
    --foreground: 108 100% 50%;
    --card: 0 0% 2%;
    --card-foreground: 108 100% 50%;
    --popover: 0 0% 0%;
    --popover-foreground: 108 100% 50%;
    --primary: 108 100% 50%;
    --primary-foreground: 0 0% 0%;
    --secondary: 120 100% 7%;
    --secondary-foreground: 108 100% 50%;
    --muted: 120 100% 3%;
    --muted-foreground: 120 100% 27%;
    --accent: 120 100% 10%;
    --accent-foreground: 108 100% 50%;
    --destructive: 0 100% 40%;
    --destructive-foreground: 0 0% 0%;
    --border: 120 100% 13%;
    --input: 120 100% 13%;
    --ring: 108 100% 50%;
  }
}

@layer base {
  * {
    @apply border-border outline-ring/50;
  }
  body {
    @apply bg-background text-foreground font-mono antialiased selection:bg-primary selection:text-primary-foreground;
  }

  /* Retro Terminal Scrollbar */
  ::-webkit-scrollbar {
    width: 14px;
  }
  ::-webkit-scrollbar-track {
    background: #000000;
    border-left: 1px solid #003300;
  }
  ::-webkit-scrollbar-thumb {
    background: #003300;
    border: 1px solid #33ff00;
    box-shadow: inset 0 0 4px rgba(51, 255, 0, 0.5);
  }
  ::-webkit-scrollbar-thumb:hover {
    background: #33ff00;
    box-shadow: 0 0 10px #33ff00;
  }
}

/* CRT Scanline Effect */
.scanline {
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0),
    rgba(255, 255, 255, 0) 50%,
    rgba(0, 0, 0, 0.2) 50%,
    rgba(0, 0, 0, 0.2)
  );
  background-size: 100% 4px;
  position: fixed;
  pointer-events: none;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 9999;
  opacity: 0.3;
}

/* Text Glow */
.glow-text {
  text-shadow: 0 0 5px rgba(51, 255, 0, 0.7);
}