/**
 * Chrome-free embed document.
 *
 * Visuals match acf-contact-form-example-section form controls
 * (48px square fields, 2-col name/email, yellow primary submit).
 *
 * WPForms 2.0 modern CSS loads after wp_head and uses CSS variables.
 * We set those variables here, then override with high-specificity
 * rules. class-embed.php also reprints this file in wp_footer so
 * these rules win the cascade.
 */

/* This file only loads on the chrome-free embed document. */
html {
  overflow: visible;
  block-size: auto;
}

.pls-corporate-form-embed {
  margin: 0;
  overflow: visible;
  background: #ffffff;
  color: #000000;
  font-family: "Roboto", system-ui, sans-serif;
  font-size: 16px;
  line-height: 1.5;
  accent-color: #03400f;
}

.pls-corporate-form-embed *,
.pls-corporate-form-embed *::before,
.pls-corporate-form-embed *::after {
  box-sizing: border-box;
}

.pls-corporate-form-embed__inner {
  inline-size: 100%;
  max-inline-size: 100%;
  min-inline-size: 0;
  /* Room for the native checkbox and the button outline. */
  padding-block: 2px 12px;
  padding-inline: 2px;
}

.pls-corporate-form-embed__error {
  margin: 0 0 0.75rem;
}

/*
 * WPForms modern theme tokens. Changing these is the supported way
 * to recolor the 2.0 stylesheet (button, field radius, label size).
 */
.pls-corporate-form-embed .wpforms-container,
.pls-corporate-form-embed .wpforms-container-full,
.wpforms-container.pls-corporate-wpforms {
  --wpforms-field-border-radius: 0px;
  --wpforms-field-border-color: rgb(0 0 0 / 0.5);
  --wpforms-field-border-color-spare: rgb(0 0 0 / 0.5);
  --wpforms-field-background-color: #ffffff;
  --wpforms-field-text-color: #000000;
  --wpforms-field-size-input-height: 48px;
  --wpforms-field-size-padding-h: 12px;
  --wpforms-field-size-font-size: 16px;
  --wpforms-field-size-line-height: 24px;
  --wpforms-field-size-input-spacing: 24px;
  --wpforms-field-size-checkbox-size: 18px;
  --wpforms-label-color: #000000;
  --wpforms-label-size-font-size: 14px;
  --wpforms-label-size-line-height: 21px;
  --wpforms-button-background-color: #ffdc27;
  --wpforms-button-background-color-alt: #ffdc27;
  --wpforms-button-text-color: #03400f;
  --wpforms-button-border-color: #033e40;
  --wpforms-button-border-radius: 8px;
  --wpforms-button-border-style: none;
  --wpforms-button-size-height: 40px;
  --wpforms-button-size-padding-h: 20px;
  --wpforms-button-size-font-size: 16px;
  --wpforms-button-size-margin-top: 0px;
  margin: 0 !important;
  inline-size: 100% !important;
  max-inline-size: 100% !important;
}

/* Two-column grid — same as the ACF example form */
.pls-corporate-form-embed .wpforms-field-container {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
  inline-size: 100%;
  max-inline-size: 100%;
  min-inline-size: 0;
}

/* WPForms clearfix becomes a third grid item and shifts columns. */
.pls-corporate-form-embed .wpforms-field-container::before,
.pls-corporate-form-embed .wpforms-field-container::after {
  content: none !important;
  display: none !important;
}

.pls-corporate-form-embed .wpforms-field,
.pls-corporate-form-embed div.wpforms-container-full .wpforms-one-half,
.pls-corporate-form-embed div.wpforms-container-full .wpforms-first {
  display: flex;
  flex-direction: column;
  gap: 8px;
  float: none !important;
  clear: none !important;
  inline-size: 100% !important;
  width: 100% !important;
  max-inline-size: 100% !important;
  min-inline-size: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Full-width rows: everything that is not first/last or email/phone */
.pls-corporate-form-embed .wpforms-field:not(.wpforms-one-half),
.pls-corporate-form-embed .wpforms-submit-container {
  grid-column: 1 / -1;
}

/* WPForms adds 24px under each label via --wpforms-field-size-input-spacing.
   The field already uses an 8px gap, so that margin is extra. */
.pls-corporate-form-embed div.wpforms-container-full .wpforms-field-label,
.pls-corporate-form-embed div.wpforms-container-full .wpforms-field-label-inline {
  margin: 0;
  font-size: 0.875rem !important;
  font-weight: 400 !important;
  line-height: 1.5;
  color: #000000 !important;
}

.pls-corporate-form-embed .wpforms-required-label {
  color: #000000;
}

/*
 * Square 48px controls. !important beats WPForms modern
 * div.wpforms-container-full input rules.
 */
.pls-corporate-form-embed div.wpforms-container-full input[type="text"],
.pls-corporate-form-embed div.wpforms-container-full input[type="email"],
.pls-corporate-form-embed div.wpforms-container-full input[type="tel"],
.pls-corporate-form-embed div.wpforms-container-full input[type="number"],
.pls-corporate-form-embed div.wpforms-container-full select,
.pls-corporate-form-embed div.wpforms-container-full textarea,
.pls-corporate-form-embed .wpforms-field input[type="text"],
.pls-corporate-form-embed .wpforms-field input[type="email"],
.pls-corporate-form-embed .wpforms-field input[type="tel"],
.pls-corporate-form-embed .wpforms-field input[type="number"],
.pls-corporate-form-embed .wpforms-field select,
.pls-corporate-form-embed .wpforms-field textarea {
  display: block;
  inline-size: 100% !important;
  max-inline-size: none !important;
  block-size: 48px !important;
  min-block-size: 48px !important;
  padding: 12px !important;
  border: 1px solid rgb(0 0 0 / 0.5) !important;
  border-radius: 0 !important;
  background-color: #ffffff !important;
  background-image: none;
  font-family: "Roboto", system-ui, sans-serif !important;
  font-size: 1rem !important;
  font-weight: 400;
  line-height: 1.5 !important;
  color: #000000 !important;
  box-shadow: none !important;
}

.pls-corporate-form-embed div.wpforms-container-full textarea,
.pls-corporate-form-embed .wpforms-field textarea {
  block-size: 180px !important;
  min-block-size: 180px !important;
  resize: vertical;
}

/* Custom forest chevron — same SVG as the ACF example form */
.pls-corporate-form-embed div.wpforms-container-full select,
.pls-corporate-form-embed .wpforms-field select {
  appearance: none;
  -webkit-appearance: none;
  background-color: #ffffff !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M7 10l5 5 5-5' stroke='%2303400f' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 12px center !important;
  background-size: 24px 24px !important;
  padding-inline-end: 44px !important;
}

.pls-corporate-form-embed .wpforms-field input:focus-visible,
.pls-corporate-form-embed .wpforms-field select:focus-visible,
.pls-corporate-form-embed .wpforms-field textarea:focus-visible {
  outline: 2px solid #03400f;
  outline-offset: 1px;
}

/* SMS opt-in: label beside an 18px forest checkbox */
.pls-corporate-form-embed .wpforms-field-checkbox ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.pls-corporate-form-embed .wpforms-field-checkbox {
  padding-block-end: 16px !important;
}

.pls-corporate-form-embed .wpforms-field-checkbox li,
.pls-corporate-form-embed .wpforms-field-checkbox label {
  display: flex;
  align-items: center;
  gap: 8px;
}

.pls-corporate-form-embed .wpforms-field-checkbox input[type="checkbox"] {
  block-size: 18px !important;
  inline-size: 18px !important;
  min-block-size: 18px !important;
  min-inline-size: 18px !important;
  margin: 0;
  padding: 0 !important;
  flex-shrink: 0;
  overflow: visible;
  accent-color: #03400f;
}

.pls-corporate-form-embed .wpforms-submit-container {
  display: flex;
  justify-content: center;
  margin: 0 !important;
  padding-block: 8px 4px;
  overflow: visible;
}

/*
 * Yellow marketing button. Match .bpa-button--primary.
 * WPForms hover paints a dark overlay on the variable color —
 * that looks muddy on yellow, so hover is an explicit cream.
 */
.pls-corporate-form-embed div.wpforms-container-full button[type="submit"],
.pls-corporate-form-embed div.wpforms-container-full .wpforms-submit,
.pls-corporate-form-embed .wpforms-submit {
  min-inline-size: 215px !important;
  min-block-size: 40px !important;
  padding: 8px 20px !important;
  border: none !important;
  border-radius: 8px !important;
  outline: 1px solid #033e40 !important;
  outline-offset: 0 !important;
  background: #ffdc27 !important;
  background-image: none !important;
  color: #03400f !important;
  font-family: "Roboto", system-ui, sans-serif !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;
  box-shadow: none !important;
  cursor: pointer;
}

.pls-corporate-form-embed div.wpforms-container-full button[type="submit"]:hover,
.pls-corporate-form-embed div.wpforms-container-full button[type="submit"]:active,
.pls-corporate-form-embed div.wpforms-container-full button[type="submit"]:focus,
.pls-corporate-form-embed div.wpforms-container-full button[type="submit"]:focus-visible,
.pls-corporate-form-embed .wpforms-submit:hover,
.pls-corporate-form-embed .wpforms-submit:focus-visible {
  background: #fff9db !important;
  background-image: none !important;
  color: #03400f !important;
}

/* Thank You confirmation */
.pls-form-confirm--thanks {
  overflow: hidden;
  border: 1px solid #d8d8d8;
}

.pls-form-confirm__banner {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  background: #1b8f2a;
  color: #ffffff;
}

.pls-form-confirm__banner-title {
  margin: 0;
  font-size: 1.25rem;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.pls-form-confirm--thanks .pls-form-confirm__body {
  padding: 28px 20px 32px;
  text-align: center;
}

/* Coming Soon confirmation */
.pls-form-confirm--soon {
  padding: 8px 8px 24px;
  text-align: center;
}

.pls-form-confirm__soon-bar {
  padding: 8px 0 16px;
  border-block-end: 1px solid #d8d8d8;
}

.pls-form-confirm__soon-brand {
  margin: 0;
  font-weight: 600;
}

.pls-form-confirm__soon-title {
  margin: 20px 0 12px;
  color: #03400f;
  font-size: 1.25rem;
  font-weight: 700;
}

.pls-form-confirm__van {
  display: block;
  inline-size: min(100%, 640px);
  block-size: auto;
  margin: 12px auto 20px;
}

@media (max-width: 639px) {
  .pls-corporate-form-embed .wpforms-field-container {
    grid-template-columns: 1fr;
  }

  .pls-corporate-form-embed .wpforms-field.wpforms-one-half {
    grid-column: 1 / -1;
  }

  .pls-corporate-form-embed div.wpforms-container-full button[type="submit"],
  .pls-corporate-form-embed .wpforms-submit {
    inline-size: 100% !important;
  }
}