/* =====================
   BASIC CSS TEMPLATE
   ===================== */

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  background-color: #f8f9fa;     /* Light gray background */
  color: #212529;                /* Dark text color */
  font-family: 'Segoe UI', system-ui, sans-serif;
  line-height: 1.6;
}

/* Main container (optional) */
.container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 2rem;
}

/* Headings */
h1 {
  color: #1a252f;
  background-color: #e9ecef;
  padding: 1rem 1.5rem;
  margin-bottom: 1.5rem;
  border-bottom: 4px solid #0d6efd;
}

h2 {
  color: #2c3e50;
  margin: 2rem 0 1rem 0;
}

h3 {
  color: #34495e;
  margin: 1.8rem 0 0.8rem 0;
}

h4 {
  color: #495057;
}

h5, h6 {
  color: #6c757d;
}

/* Optional: Dark mode support */
@media (prefers-color-scheme: dark) {
  body {
    background-color: #121212;
    color: #e0e0e0;
  }
  a {
    color: #4da6ff;           /* Much softer, less harsh blue */
  }
  
  a:hover {
    color: #80c1ff;
  }
  
  a:visited {
    color: #b38eff;
  }
  h1 {
    color: #f8f9fa;
    background-color: #2c3e50;
  }
  
  h2 { color: #a5b4fc; }
  h3 { color: #c4d0ff; }
}