/* #contact-page {
  padding: 2rem 1rem;
} */

.contact-form-section {
  background: #fff;
  padding: 2rem 1rem;
  border-radius: 8px;
}

#contact-form {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

#contact-feedback {
  margin-top: 1rem;
  font-weight: 500;
}

#contact-feedback.success {
  color: #1a7f37;
}

#contact-feedback.error {
  color: #d1242f;
}

/* Honeypot */
input[name="website"] {
  display: none;
}

/* Validation */
input.invalid,
textarea.invalid {
  border: 2px solid #c0392b;
}

input.valid,
textarea.valid {
  border: 2px solid #27ae60;
}

#message-counter {
  font-size: 0.85rem;
  margin-top: 4px;
  color: #666;
}

#message-counter.invalid {
  color: #c0392b; /* strong but not harsh */
}

/* Disabled button styles */
button:disabled {
  opacity: 0.6;            /* dimmed */
  cursor: not-allowed;     /* no pointer */
  background-color: #0077cc; /* keep base color or slightly muted */
  color: #fff;
}

/* Ensure hover does not override disabled styling */
button:disabled:hover {
  background-color: #0077cc;
  color: #fff;
}

.error-message {
  font-size: 0.85rem;
  line-height: 1.4;
  color: #a93226;
}