/* ==========================================================================
   Umbraco Forms — styled to match the 144 Edward Street contact form
   (source: ContactForm.vue — rounded full-width inputs, labels, black pill submit)
   ========================================================================== */

.umbraco-forms-form { width: 100%; }

/* Hide Forms' internal hidden elements (honeypot, etc.) — the default Forms
   stylesheet normally does this, but we've disabled it (disableDefaultStylesheet). */
.umbraco-forms-form .umbraco-forms-hidden,
.umbraco-forms-hidden { display: none !important; }

/* Grid: the default theme emits Bootstrap-ish col-md-* inside a .row-fluid row
   (fieldset > .row-fluid > .col-md-*). Flex the ROW so col-md-6 fields pair up. */
.umbraco-forms-form .umbraco-forms-fieldset { display: block; }
.umbraco-forms-form .row-fluid {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -0.75rem;
  width: auto;
}
.umbraco-forms-form .umbraco-forms-container {
  padding: 0 0.75rem;
  box-sizing: border-box;
  width: 100%;
  flex: 0 0 100%;
}
.umbraco-forms-form .umbraco-forms-container.col-md-6 { width: 50%; flex: 0 0 50%; }
.umbraco-forms-form .umbraco-forms-container.col-md-12 { width: 100%; flex: 0 0 100%; }
@media (max-width: 768px) {
  .umbraco-forms-form .umbraco-forms-container.col-md-6 { width: 100%; flex: 0 0 100%; }
}

/* Field + label */
.umbraco-forms-form .umbraco-forms-field { margin-top: 1.5rem; }
.umbraco-forms-form .umbraco-forms-label {
  display: block;
  font-weight: 400;
}
/* Mandatory indicator (*) — subdued, like the source's text-gray-500 asterisk */
.umbraco-forms-form .umbraco-forms-label .umbraco-forms-indicator,
.umbraco-forms-form .umbraco-forms-mandatory {
  color: #6b7280;
  font-weight: 400;
}
.umbraco-forms-form .umbraco-forms-field-wrapper { margin-top: 0.5rem; }

/* Inputs / textareas / selects */
.umbraco-forms-form input.text,
.umbraco-forms-form input[type="text"],
.umbraco-forms-form input[type="email"],
.umbraco-forms-form input[type="tel"],
.umbraco-forms-form input[type="number"],
.umbraco-forms-form textarea,
.umbraco-forms-form select {
  width: 100%;
  background: #fff;
  border: 1px solid #d1d5db; /* gray-300 */
  border-radius: 0.375rem;   /* rounded-md */
  padding: 0.5rem 0.75rem;
  outline: 0;
  box-shadow: none;
  font: inherit;
  color: inherit;
}
.umbraco-forms-form textarea { min-height: 100px; resize: vertical; }
.umbraco-forms-form input.text:focus,
.umbraco-forms-form textarea:focus,
.umbraco-forms-form select:focus {
  border-color: #000;
  outline: 0;
  box-shadow: none;
}

/* Data-consent checkbox row */
.umbraco-forms-form .dataconsent .umbraco-forms-field-wrapper {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  font-size: 0.875rem;
}
.umbraco-forms-form .dataconsent input[type="checkbox"] { margin-top: 0.25rem; }

/* Validation */
.umbraco-forms-form .field-validation-error,
.umbraco-forms-form .field-validation-error span {
  color: #ef4444;
  font-size: 0.875rem;
  margin-top: 0.5rem;
  display: block;
}
.umbraco-forms-form .umbraco-forms-field.error input.text,
.umbraco-forms-form .umbraco-forms-field.error textarea { border-color: #ef4444; }

/* Submit button — black pill, matching .btn-primary */
.umbraco-forms-form .umbraco-forms-navigation { margin-top: 2.5rem; }
.umbraco-forms-form .btn.primary,
.umbraco-forms-form button[type="submit"],
.umbraco-forms-form input[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  padding: 0.75rem 1.5rem;
  font-weight: 700;
  font-size: 1rem;
  background: #000;
  color: #fff;
  border: 2px solid #000;
  cursor: pointer;
  transition: background-color 0.2s ease, color 0.2s ease;
}
.umbraco-forms-form .btn.primary:hover,
.umbraco-forms-form button[type="submit"]:hover,
.umbraco-forms-form input[type="submit"]:hover {
  background: #fff;
  color: #000;
}

/* Success / submit message */
.umbraco-forms-form .umbraco-forms-submitmessage { font-size: 1.125rem; }