/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." 
   purple color: #B4BEFE
   rose color: #F5E0DC
   soft black (background): #1C1C1C
   soft beige: #F5E8D8
   white chocolate: #ECE6DB
   */

body {
  background-color: #1C1C1C;
  color: #ECE6DB;
  font-family: monospace;
}
a:link {
  color: #FF6F61;
}

/* visited link */
a:visited {
  color: #F5E0DC;
}


/* Styling the form container */
form {
  background-color: #1C1C1C;
  border: 3px double #B4BEFE; /* Misty Lavender double border for a 'bookish' look */
  padding: 20px;
  max-width: 450px;
  /*margin: 20px auto;*/
  color: #ECE6DB;
  font-family: 'Courier New', Courier, monospace; /* Quirky typewriter feel */
}

/* Styling the text inputs */
input[type="text"], input[type="email"], select {
  background-color: #252525;
  border: 1px solid #B4BEFE;
  color: #ECE6DB;
  padding: 8px;
  width: 100%;
  margin-bottom: 15px;
  box-sizing: border-box; /* Keeps everything inside the box */
}

/* The Submit Button with your Burnt Saffron color */
input[type="submit"] {
  background-color: #EBA0AC; /* Burnt Saffron */
  color: #1C1C1C;
  border: none;
  padding: 10px 25px;
  font-weight: bold;
  cursor: pointer;
  text-transform: uppercase;
  letter-spacing: 1px;
}

input[type="submit"]:hover {
  background-color: #FAB387; /* Glows to Terracotta when hovered */
  box-shadow: 0 0 10px #FAB387;
}

/* Accessible Radio Buttons */
input[type="radio"] {
  accent-color: #B4BEFE; /* Colors the radio button itself */
}