/* ============================================================
   Eloqua Form Override CSS
   Matches the clean, large-field design with orange focus state
   ============================================================ */

/* roc-grotesk for all form text by default */
.elq-form {
  font-family: "roc-grotesk", sans-serif !important;
}

/* Hide default labels (placeholder text acts as field label) */
.elq-form .elq-label {
  display: none !important;
}

/* Show the label for fields where it should appear above (e.g. Company Activity) */
/* If you need a specific label visible, use:
   #formElement6 .elq-label { display: block !important; } */

/* Base input / select / textarea styling */
.elq-form .elq-item-input,
.elq-form .elq-item-select,
.elq-form .elq-item-textarea {
  width: 100% !important;
  height: auto !important;
  min-height: auto !important;
  padding: 26px 30px !important;
  background-color: #ffffff !important;
  border: 1px solid transparent !important;
  border-radius: 5px !important;
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: 16px !important;
  line-height: 17px !important;
  color: #333 !important;
  box-shadow: 0px 0 19px 0px rgb(142 147 151 / 28%) !important;
  outline: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
  transition: border-color 0.2s ease !important;
}

/* Placeholder color */
.elq-form .elq-item-input::placeholder,
.elq-form .elq-item-textarea::placeholder {
  color: #aaa !important;
  font-size: 16px !important;
}

/* Select placeholder / default option color */
.elq-form .elq-item-select {
  color: #aaa !important;
}

.elq-form .elq-item-select option:not([value=""]) {
  color: #333 !important;
}

/* Orange focus border */
.elq-form .elq-item-input:focus,
.elq-form .elq-item-select:focus,
.elq-form .elq-item-textarea:focus {
  border: 1px solid #e8820c !important;
  background-color: #ffffff !important;
  outline: none !important;
  color: #333 !important;
}

/* Textarea — allow vertical growth */
.elq-form .elq-item-textarea {
  line-height: 1.5 !important;
  min-height: 200px !important;
}

/* Form layout — vertical flex stack with gap */
.elq-form .layout.container-fluid {
  display: flex !important;
  flex-direction: column !important;
  gap: 40px !important;
}

.elq-form .layout.container-fluid > .row {
  display: block !important;
}

/* Field wrapper spacing */
.elq-form .elq-field-style {
  padding-bottom: 16px !important;
}

.elq-form .form-element-layout {
  padding: 0 !important;
}

/* Remove inner row margins that add unwanted spacing */
.elq-form .field-control-wrapper {
  padding: 0 !important;
}

/* Submit button — pill shape, outlined in orange, white fill */
.elq-form .submit-button-style,
.elq-form input[type="submit"] {
  height: 56px !important;
  padding: 0 48px !important;
  background-color: #ffffff !important;
  border: 1px solid #e8820c !important;
  border-radius: 100px !important;
  box-shadow: rgb(78 51 17 / 14%) 0px 3px 0 !important;
  color: #111111 !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  transition: background-color 0.2s ease, color 0.2s ease !important;
  -webkit-appearance: button !important;
}

.elq-form .submit-button-style:hover,
.elq-form input[type="submit"]:hover {
  background-color: #e8820c !important;
  color: #ffffff !important;
}

/* Validation error state */
.LV_invalid_field,
input.LV_invalid_field:active,
input.LV_invalid_field:hover,
textarea.LV_invalid_field:active,
textarea.LV_invalid_field:hover {
  border: 2px solid #d0021b !important;
  outline: none !important;
}

.LV_invalid {
  color: #d0021b !important;
  font-size: 12px !important;
  margin-top: 4px !important;
  display: block !important;
}

/* Required asterisk (when label is shown) */
.elq-form .elq-required {
  color: #d0021b !important;
}