:root {
  --dark-slate-blue: #3c5f97;
  --midnight-blue: #213058;
  --red: #f04b4c;
  --white: #efefef;
  --gray: #f5f5f5;
  --metal: #3a3a3a;
}

body {
  background-color: var(--gray);
  font-family: 'Montserrat', sans-serif;
}

h1 {
  font-family: 'Montserrat', serif;
  color: var(--dark-slate-blue);
}

.btn-indigo {
  background-color: var(--dark-slate-blue);
  color: var(--white);
}

.btn-indigo:hover {
  background-color: #1b2748;
}

#results-modal {
  background-color: rgba(0, 0, 0, 0.1);
}

.modal-content {
  max-height: 90vh;
  overflow-y: auto;
}

.results-container {
  max-height: 45vh;
  overflow-y: auto;
}

.modal-footer {
  position: sticky;
  bottom: 0;
  background: white;
  border-top: 1px solid #e2e8f0;
}

.btn-red {
  background-color: var(--red);
  color: var(--white);
}

.btn-red:hover {
  background-color: #d43b3c;
}

/* Button Styles */
a {
  display: inline-block;
  color: white;
  text-decoration: none;
}

a:hover {
  text-decoration: none;
}

a:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.5);
}

/* Agent Name Styles */
h2 {
  color: #213058;
}