/* contact.css - Page-specific styles only */
/* Shared typography, colors, and base styles are in styles.css */

/* Container & Background */
.contact-container {
  max-width: 600px;
  margin: 0 auto;
  padding: 2rem 1rem;
  background: #ffffff;
  border-radius: 8px;
  text-align: left;
}

/* Center h1 on contact page */
.contact-container h1 {
  text-align: center;
}

/* Labels & Inputs */
.contact-container label {
  display: block;
  margin-top: 1rem;
  font-weight: bold;
  color: #000000;
  font-family: 'DM Sans', sans-serif;
}
.contact-container input,
.contact-container textarea {
  width: 100%;
  padding: 0.5rem;
  margin-top: 0.25rem;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  background: #ffffff;
}

/* Button */
.contact-container button {
  margin-top: 1.5rem;
  padding: 0.75rem 1.5rem;
  font-size: 1rem;
  font-weight: bold;
  background: var(--haiti-red);
  color: #fff;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  width: 100%;
}
.contact-container button:hover {
  background: #b0182a;
}

/* Feedback messages */
#contact-msg {
  margin-top: 1rem;
  font-size: 0.95rem;
  text-align: center;
}
#contact-msg.error {
  color: #f44336;
}
#contact-msg.success {
  color: #4caf50;
}

/* Debug link (when SENDGRID key is missing) */
.debug-info {
  margin-top: 1rem;
  font-size: 0.9rem;
  background: #f0f0f0;
  padding: 0.75rem;
  border-radius: 4px;
  color: #000000;
  word-break: break-all;
}