body {
  margin: 0;
  font-family: 'Courier New', monospace;
  background-color: #0d0d0d;
  color: #00ff00;
  padding: 20px;
  font-size: 16px;
  line-height: 1.5;
  max-width: 800px;
  margin: auto;
  /* Only show scrollbar when needed */
  overflow-y: auto;
  scrollbar-color: #00ff00 #0d0d0d;
  scrollbar-width: thin;
}

.output {
  white-space: pre-wrap;
  word-break: break-word;
}

.prompt {
  color: #00ff00;
  font-weight: bold;
}

.input-line {
  display: flex;
  align-items: center;
  margin-top: 10px;
  word-break: break-word;
}

input {
  background: transparent;
  border: none;
  color: #00ff00;
  font: inherit;
  outline: none;
  flex: 1;
  padding: 5px;
  font-size: 18px;
  width: 100%;
}

a {
  color: #00ff00;
  text-decoration: none;
}

.project-link:hover, .contact-link:hover, .source-link:hover {
  background-color: #00ff00;
  color: #1e1e1e;
  text-decoration: none; /* Remove underline */
}

/* Scrollbar Styling for WebKit (Chrome, Edge, Safari) */
::-webkit-scrollbar {
  width: 10px;
}

::-webkit-scrollbar-track {
  background: #0d0d0d; /* Dark track */
}

::-webkit-scrollbar-thumb {
  background-color: #00ff00; /* Neon green thumb */
  border-radius: 10px;
  border: 2px solid #0d0d0d; /* Matches background */
}

.clickable {
  cursor: pointer;
  padding: 2px 6px;
  user-select: none;
  transition: background-color 0.3s ease, color 0.3s ease;
  color: #00ff00; /* terminal green text */
}

.clickable:hover {
  background-color: #00ff00;
  color: #1e1e1e; /* dark background color, text changes for contrast */
  text-decoration: none;
}

.clickable:active {
  background-color: #008000; /* darker green */
  color: #ffffff;
}

::selection {
  background: #00ff00; /* Neon green background */
  color: #1e1e1e;      /* Terminal background color as font color */
}

/* ASCII Art Banner */
.ascii-art {
  font-family: monospace;
  white-space: pre;
  line-height: 1.2;
  color: #00ff00;
  margin: 0;
}

/* Color styles */
.info-text {
  color: #87ff65;
  font-weight: bold;
}

.error-text {
  color: #ff4b4b;
  font-weight: bold;
}

.welcome-text {
  color: #ffa500;
  font-weight: bold;
}

.command-text {
  color: #00f5ff;
  font-weight: bold;
}

.question-text {
  color: #bdbdfc;
  font-weight: bold;
}

.warning-text {
  color: #ffff66;
  font-weight: bold;
}

.section-header {
  font-weight: bold;
  font-family: monospace;
  margin-top: 1em;
  margin-bottom: 0.5em;
  display: block;
  color: #00f5ff;
}

/* Link styles */
.project-link, .contact-link, .source-link {
  color: #00ff00;
  text-decoration: none;
  cursor: pointer;
  padding: 2px 6px;
  transition: background-color 0.3s ease, color 0.3s ease;
}

@keyframes flicker {
  0%, 18%, 22%, 25%, 53%, 57%, 100% {
    text-shadow:
      0 0 2px #00ff00,
      0 0 5px #00cc00,
      0 0 10px #009900;
  }
  20%, 24%, 55% {
    text-shadow:
      0 0 1px #007700,
      0 0 2px #004400;
  }
}

.permanent-flicker {
  font-family: monospace;
  white-space: pre;
  color: #00ff00;
  animation: flicker 3s linear infinite;
  opacity: 1;
}

.boot-line {
  white-space: pre; /* preserve spaces */
}
.prefix {
  color: #66d9ef; /* cyan for prefix */
  font-weight: bold;
}
.status {
  color: #a6e22e; /* green for status */
  font-weight: bold;
  margin-left: 5px;
}

* {
  box-sizing: border-box;
}

.section-title {
  font-weight: bold;
  color: #00ff00; /* Terminal green */
  margin-top: 1rem;
  margin-bottom: 0.5rem;
  font-family: 'Courier New', Courier, monospace;
  white-space: pre; /* To preserve spacing */
}