/* =========================================================
   ENQUIRY FORM – FINAL LAYOUT (STRICTLY SCOPED)
   Title row → First+Last → Email → Mobile/Suburb → Comments
   ========================================================= */

/* ---------------------------------------------------------
   1) FORM LAYOUT (ONLY enquiry-form)
   --------------------------------------------------------- */
.form-assembly-wrapper form.enquiry-form {
  display: flex !important;
  flex-wrap: wrap !important;
  column-gap: 32px;
  row-gap: 36px;
}

/* ---------------------------------------------------------
   2) REMOVE TITLE FROM FLEX GROUPING
   --------------------------------------------------------- */
.form-assembly-wrapper form.enquiry-form .page-header {
  flex: 0 0 100% !important;
  width: 100% !important;
  margin-bottom: 24px;
}

.form-assembly-wrapper form.enquiry-form .page-header h1 {
  text-align: left !important;
}

/* ---------------------------------------------------------
   3) KILL LEGACY WIDTH RULES (ENQUIRY FORM ONLY)
   --------------------------------------------------------- */
@media (min-width: 769px) {
  .form-assembly-wrapper form.enquiry-form > div {
    display: block !important;
    /* //width: auto !important; */
  }
}

/* ---------------------------------------------------------
   4) BASE FORM-GROUP SIZING
   --------------------------------------------------------- */
.form-assembly-wrapper form.enquiry-form .form-group {
  flex: 0 0 calc(50% - 16px) !important;
  box-sizing: border-box;
  margin: 0 !important;
  min-width: 0;
}

/* ---------------------------------------------------------
   5) ROW RULES (FIELD-BASED, STABLE)
   --------------------------------------------------------- */

/* First + Last Name → same first row after title */
.form-assembly-wrapper form.enquiry-form
  .form-group:has(input[name="firstName"]),
.form-assembly-wrapper form.enquiry-form
  .form-group:has(input[name="lastName"]) {
  /* flex: 0 0 calc(50% - 16px) !important; */
}

/* Email → full width */
.form-assembly-wrapper form.enquiry-form
  .form-group:has(input[type="email"]),
.form-assembly-wrapper form.enquiry-form
  .form-group:has(input[name="email"]) {
  flex: 0 0 100% !important;
}

/* Comments → full width */
.form-assembly-wrapper form.enquiry-form
  .form-group:has(textarea) {
  flex: 0 0 100% !important;
}

/* ---------------------------------------------------------
   6) LABEL POSITIONING (ENQUIRY FORM ONLY)
   --------------------------------------------------------- */
.form-assembly-wrapper form.enquiry-form .input-wrapper {
  position: relative;
}

.form-assembly-wrapper form.enquiry-form .input-wrapper label {
  position: absolute;
  top: 8px;
  left: 14px;
  font-size: 13px;
  letter-spacing: 0.04em;
  color: black;
  pointer-events: none;
  background-color: #ffffff;
  padding: 0 4px;
}

/* ---------------------------------------------------------
   7) INPUTS & TEXTAREA (LIGHTER BORDERS)
   --------------------------------------------------------- */
.form-assembly-wrapper form.enquiry-form .form-control,
.form-assembly-wrapper form.enquiry-form textarea {
  width: 100%;
  /* height: 54px; */
  /* padding: 22px 14px 12px; */
  font-size: 15px;
  color: #1f1f1f;
  background-color: #ffffff;
  border: 1px solid #d7d7d7 !important;
  box-sizing: border-box;
}

.form-assembly-wrapper form.enquiry-form textarea {
  height: 180px;
  resize: none;
}

.form-assembly-wrapper form.enquiry-form .form-control:focus,
.form-assembly-wrapper form.enquiry-form textarea:focus {
  border-color: #bdbdbd !important;
  outline: none;
  box-shadow: none;
}

/* ---------------------------------------------------------
   8) MOBILE – STACK EVERYTHING
   --------------------------------------------------------- */
@media (max-width: 768px) {
  .form-assembly-wrapper form.enquiry-form {
    column-gap: 0;
    row-gap: 24px;
  }

  .form-assembly-wrapper form.enquiry-form .form-group {
    flex: 0 0 100% !important;
  }
}

/* =========================================================
   FORCE INPUT TEXT COLOR (ALL STATES)
   ========================================================= */
.form-assembly-wrapper form.enquiry-form .form-control,
.form-assembly-wrapper form.enquiry-form textarea {
  color: #1f1f1f !important; /* force visible text */
  -webkit-text-fill-color: #1f1f1f !important; /* Chrome autofill */
}

/* Focus state */
.form-assembly-wrapper form.enquiry-form .form-control:focus,
.form-assembly-wrapper form.enquiry-form textarea:focus {
  color: #1f1f1f !important;
  -webkit-text-fill-color: #1f1f1f !important;
}

main .enquiry-form .input-wrapper {
    border: 2px solid lightgray !important;    
}

/* =========================================================
   FORCE VISIBLE CARET (TEXT CURSOR)
   ========================================================= */
.form-assembly-wrapper form.enquiry-form .form-control,
.form-assembly-wrapper form.enquiry-form textarea {
  caret-color: #1f1f1f !important;
}

/* =========================================================
   SUBMIT BUTTON — FORCE NEW ROW
   ========================================================= */
.form-assembly-wrapper form.enquiry-form .form-submit-border {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start; /* change to center if needed */
  width: 100%;
  margin-top: 24px;
}

/* Ensure the button itself is on its own line */
.form-assembly-wrapper form.enquiry-form .form-submit-border input[type="submit"],
.form-assembly-wrapper form.enquiry-form .form-submit-border button {
  display: block !important;
  margin-top: 16px;
}