/* ============================================
   AcornPets — Contact Form 7 Styling
   Matches design tokens. Loaded on all pages
   where CF7 forms are used.
   ============================================ */

.acornpets-cf7-form,
.acornpets-cf7-form-dark {
  font-family: var(--font-body);
  font-size: var(--text-body);
  line-height: var(--leading-relaxed);
}

/* Form containers */
.acornpets-cf7-form .wpcf7 {
  background: var(--ivory-highlight);
  border: 1px solid var(--gray-200);
  border-radius: 1rem;
  padding: 2rem;
}
.acornpets-cf7-form-dark .wpcf7 {
  background: transparent;
  border: none;
  padding: 0;
}

/* Labels */
.acornpets-cf7-form .wpcf7-form-control-wrap + br,
.acornpets-cf7-form-dark .wpcf7-form-control-wrap + br {
  display: none;
}

.acornpets-cf7-form label,
.acornpets-cf7-form-dark label {
  display: block;
  margin-bottom: 0.375rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--gray-700);
}
.acornpets-cf7-form-dark label {
  color: var(--cream-white);
}
.acornpets-cf7-form-dark label .wpcf7-form-control-wrap {
  margin-bottom: 1rem;
}

/* Required asterisk */
.acornpets-cf7-form .wpcf7-validates-as-required::after,
.acornpets-cf7-form-dark .wpcf7-validates-as-required::after {
  content: " *";
  color: var(--error);
  font-weight: 700;
}
.acornpets-cf7-form-dark .wpcf7-form-control-wrap[data-name] label::after {
  color: var(--error);
}

/* Inputs */
.acornpets-cf7-form input[type="text"],
.acornpets-cf7-form input[type="email"],
.acornpets-cf7-form input[type="tel"],
.acornpets-cf7-form input[type="url"],
.acornpets-cf7-form select,
.acornpets-cf7-form textarea,
.acornpets-cf7-form-dark input[type="text"],
.acornpets-cf7-form-dark input[type="email"],
.acornpets-cf7-form-dark input[type="tel"],
.acornpets-cf7-form-dark input[type="url"],
.acornpets-cf7-form-dark select,
.acornpets-cf7-form-dark textarea {
  width: 100%;
  height: var(--input-height-md);
  padding: 0 0.75rem;
  border: 1px solid var(--gray-300);
  border-radius: 0.375rem;
  font-family: var(--font-body);
  font-size: 0.875rem;
  color: var(--gray-800);
  background: #fff;
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
  box-sizing: border-box;
}
.acornpets-cf7-form textarea,
.acornpets-cf7-form-dark textarea {
  height: auto;
  min-height: 7rem;
  padding: 0.625rem 0.75rem;
  resize: vertical;
}

.acornpets-cf7-form select,
.acornpets-cf7-form-dark select {
  appearance: auto;
}

/* Focus */
.acornpets-cf7-form input:focus,
.acornpets-cf7-form select:focus,
.acornpets-cf7-form textarea:focus,
.acornpets-cf7-form-dark input:focus,
.acornpets-cf7-form-dark select:focus,
.acornpets-cf7-form-dark textarea:focus {
  outline: none;
  border-color: var(--acorn-brown);
  box-shadow: 0 0 0 3px rgba(140, 80, 50, 0.1);
}

/* CF7 grid helper — makes inline columns work */
.acornpets-cf7-form .wpcf7 .grid,
.acornpets-cf7-form-dark .wpcf7 .grid {
  display: grid;
  gap: 1rem;
}
@media (min-width: 640px) {
  .acornpets-cf7-form .wpcf7 .sm\:grid-cols-2 { grid-template-columns: repeat(2, 1fr); }
  .acornpets-cf7-form .wpcf7 .sm\:grid-cols-3 { grid-template-columns: repeat(3, 1fr); }
  .acornpets-cf7-form-dark .wpcf7 .sm\:grid-cols-2 { grid-template-columns: repeat(2, 1fr); }
  .acornpets-cf7-form-dark .wpcf7 .sm\:grid-cols-3 { grid-template-columns: repeat(3, 1fr); }
}

/* Submit button */
.acornpets-cf7-form .wpcf7-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  font-family: var(--font-body);
  font-weight: 700;
  letter-spacing: 0.3px;
  transition: all 150ms ease;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  background: var(--acorn-brown);
  color: #fff;
  font-size: 1rem;
  font-weight: 700;
  padding: 0 2rem;
  min-height: 52px;
  border: none;
  border-radius: 9999px;
  box-shadow: var(--shadow-primary);
}
.acornpets-cf7-form .wpcf7-submit:hover {
  background: #6B3D26;
  transform: translateY(-1px);
}
.acornpets-cf7-form .wpcf7-submit:active {
  transform: translateY(0);
}

.acornpets-cf7-form-dark .wpcf7-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  font-family: var(--font-body);
  font-weight: 700;
  letter-spacing: 0.3px;
  transition: all 150ms ease;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  background: var(--acorn-gold);
  color: var(--acorn-dark);
  font-size: 1rem;
  font-weight: 700;
  padding: 0 2.5rem;
  min-height: 52px;
  border: none;
  border-radius: 9999px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.12);
}
.acornpets-cf7-form-dark .wpcf7-submit:hover {
  background: #D4A84A;
  transform: translateY(-1px);
}
.acornpets-cf7-form-dark .wpcf7-submit:active {
  transform: translateY(0);
}

/* CF7 Response messages */
.acornpets-cf7-form .wpcf7-response-output,
.acornpets-cf7-form-dark .wpcf7-response-output {
  margin: 1.5rem 0 0;
  padding: 1rem;
  border-radius: 0.5rem;
  font-size: 0.875rem;
  font-weight: 600;
  text-align: center;
  border: none;
}
.acornpets-cf7-form .wpcf7-mail-sent-ok,
.acornpets-cf7-form .wpcf7 form.sent .wpcf7-response-output {
  background: rgba(34, 166, 108, 0.1);
  color: var(--success);
}
.acornpets-cf7-form-dark .wpcf7 form.sent .wpcf7-response-output {
  background: rgba(34, 166, 108, 0.15);
  color: #22A66C;
}
.acornpets-cf7-form .wpcf7-validation-errors,
.acornpets-cf7-form .wpcf7 form.invalid .wpcf7-response-output {
  background: rgba(216, 74, 74, 0.1);
  color: var(--error);
}

/* Validation error on field */
.acornpets-cf7-form .wpcf7-not-valid,
.acornpets-cf7-form-dark .wpcf7-not-valid {
  border-color: var(--error) !important;
}
.acornpets-cf7-form .wpcf7-not-valid-tip,
.acornpets-cf7-form-dark .wpcf7-not-valid-tip {
  color: var(--error);
  font-size: 0.75rem;
  margin-top: 0.25rem;
}

/* Spacing between form rows */
.acornpets-cf7-form .wpcf7 p,
.acornpets-cf7-form-dark .wpcf7 p {
  margin-bottom: 1rem;
}

/* Hide CF7 default spacing BRs */
.acornpets-cf7-form .wpcf7 br,
.acornpets-cf7-form-dark .wpcf7 br {
  display: none;
}