/* Dark Mode Base Styles */

:root {
  --bg-primary: #1a1a1a;
  --bg-secondary: #2d2d2d;
  --text-primary: #e4e4e4;
  --text-secondary: #a0a0a0;
  --accent: #4a9eff;
  --accent-hover: #6bb0ff;
  --border: #404040;
  --shadow: rgba(0, 0, 0, 0.3);
}

body {
  background-color: var(--bg-primary);
  color: var(--text-primary);
}

img {
    max-width: 800px;
    min-width: 200px;
    width: 100%;
    height: auto;
}

ul {
  list-style-type: disc;
}

/* Typography */
h1, h2, h3, h4, h5, h6 {
  color: var(--text-primary);
}

a {
  color: var(--accent);
  text-decoration: none;
}

a:hover {
  color: var(--accent-hover);
  text-decoration: underline;
}

input, textarea, select {
  background-color: var(--bg-secondary);
  color: var(--text-primary);
}

input:focus, textarea:focus, select:focus {
  outline: none;
  border-color: var(--accent);
}

button {
  background-color: var(--accent);
  color: white;
}

button:hover {
  background-color: var(--accent-hover);
}


/* Code */
code {
  background-color: var(--bg-secondary);
  padding: 2px 6px;
  border-radius: 3px;
  font-family: 'Courier New', monospace;
}