/**
 * Traders page refinements.
 *
 * These rules are enqueued only for the Trader Hub page.
 */

/* Keep the top gutter compact at every breakpoint. */
.traders-page-content {
  padding-top: 40px;
}

/* Keep the page intro compact while retaining the larger bottom gutter. */
.traders-page-content > .max-w-screen-lg > .prose > .ven-block:first-child {
  padding-top: 0;
  padding-bottom: 0;
}

/* Keep the Traders contact form aligned consistently with surrounding copy. */
#gform_wrapper_12,
#gform_wrapper_12 .gform_heading,
#gform_wrapper_12 .gform_fields,
#gform_wrapper_12 .gfield,
#gform_wrapper_12 .ginput_container {
  text-align: left;
}

/* Match the mailing-list opt-in to the consent checkbox above it. */
#gform_wrapper_12 #input_12_13 {
  margin: 0;
  padding: 0;
  list-style: none;
}

#gform_wrapper_12 #input_12_13 .gchoice_12_13 {
  margin: 0;
  padding: 0;
}

#gform_wrapper_12 #label_12_13 {
  display: block;
  margin: 0 0 8px;
  color: inherit;
  font-family: inherit;
  font-size: 16px;
  font-weight: 500;
  line-height: 24px;
  vertical-align: middle;
}

/* Match the native select to the text, email, phone, and textarea controls. */
#gform_wrapper_12 #input_12_10 {
  display: block;
  width: 100%;
  height: 52px;
  padding: 14px 16px;
  border: 1px solid var(--color-shape-button-line-hover, #f0b1cd);
  border-radius: 4px;
  background-color: transparent;
  color: inherit;
  font: inherit;
}

/* Present the attachment field as an intentional, full-width upload area. */
#gform_wrapper_12 #field_12_11 .ginput_container_fileupload {
  display: block;
  padding: 20px;
  border: 1px dashed var(--color-shape-button-line-hover, #f0b1cd);
  border-radius: 8px;
  background: rgba(250, 137, 195, 0.08);
  transition:
    border-color 200ms ease,
    background-color 200ms ease;
}

#gform_wrapper_12 #field_12_11 .ginput_container_fileupload::before {
  content: "Add a file";
  display: block;
  margin-bottom: 4px;
  padding-left: 30px;
  background: no-repeat left center / 20px 20px
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 16V4m0 0L7.5 8.5M12 4l4.5 4.5'/%3E%3Cpath d='M5 13v5a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2v-5'/%3E%3C/svg%3E");
  font-weight: 700;
}

#gform_wrapper_12 #field_12_11 .ginput_container_fileupload::after {
  content: "Choose a file from your device to include with your enquiry.";
  display: block;
  margin-top: 10px;
  color: rgba(0, 0, 0, 0.65);
  font-size: 14px;
}

#gform_wrapper_12 #field_12_11 .ginput_container_fileupload:hover,
#gform_wrapper_12 #field_12_11 .ginput_container_fileupload:focus-within {
  border-color: #fa89c3;
  background: rgba(250, 137, 195, 0.14);
}

#gform_wrapper_12 #input_12_11 {
  display: block;
  width: 100%;
  min-height: 52px;
  margin-top: 14px;
  padding: 6px;
  border: 1px solid var(--color-shape-button-line-hover, #f0b1cd);
  border-radius: 4px;
  background-color: #fff;
  color: inherit;
  font: inherit;
  cursor: pointer;
}

#gform_wrapper_12 #input_12_11::file-selector-button {
  min-height: 38px;
  margin-right: 14px;
  padding: 8px 16px;
  border: 0;
  border-radius: 4px;
  background: #000;
  color: #fff;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 200ms ease;
}

#gform_wrapper_12 #input_12_11::file-selector-button:hover {
  background: #333;
}

#gform_wrapper_12 #field_12_11 .gform_fileupload_rules {
  display: block;
  margin-top: 10px;
  color: rgba(0, 0, 0, 0.65);
  font-size: 13px;
}

@media (max-width: 640px) {
  #gform_wrapper_12 #field_12_11 .ginput_container_fileupload {
    padding: 16px;
  }

  #gform_wrapper_12 #input_12_11 {
    font-size: 14px;
  }

  #gform_wrapper_12 #input_12_11::file-selector-button {
    margin-right: 10px;
    padding-inline: 12px;
  }
}
