/* ========================================
   Gravity Forms
======================================== */

/*
   Rawls visual integration for Gravity Forms.

   Gravity Forms owns:
   - markup
   - validation
   - accessibility
   - form behavior

   Rawls owns presentation.

   Framework-level styling uses Gravity Forms'
   CSS custom properties where practical.

   Direct selectors are kept narrowly scoped to
   presentation details that need stronger control.
*/

/* ========================================
   Gravity Forms Theme Framework
======================================== */

.rawls-gravity-form .gform-theme--framework {
  /* ----------------------------------------
     Brand
  ---------------------------------------- */

  --gf-color-primary: var(--rawls-green);

  /* ----------------------------------------
     Typography
  ---------------------------------------- */

  --gf-font-family-primary: var(--font-body);

  --gf-ctrl-label-font-family-primary: var(--font-heading);
  --gf-ctrl-label-font-family-secondary: var(--font-heading);

  --gf-ctrl-label-color-primary: rgb(31 42 42 / 0.85);
  --gf-ctrl-label-color-secondary: rgb(31 42 42 / 0.72);

  --gf-ctrl-desc-color: rgb(31 42 42 / 0.72);

  /* ----------------------------------------
     Text Controls
  ---------------------------------------- */

  --gf-ctrl-bg-color: #fff;

  --gf-ctrl-border-color: rgb(31 42 42 / 0.32);
  --gf-ctrl-border-color-hover: rgb(31 42 42 / 0.42);
  --gf-ctrl-border-color-focus: var(--rawls-green);

  --gf-ctrl-radius: 0.125rem;

  --gf-ctrl-padding-block: 0.65rem;
  --gf-ctrl-padding-inline: 1rem;

  /* ----------------------------------------
     Form Rhythm
  ---------------------------------------- */

  --gf-form-gap-y: 1.25rem;

  /* ----------------------------------------
     Choice Controls
  ---------------------------------------- */

  --gf-field-choice-gap: 0.75rem;
  --gf-ctrl-choice-size: 1rem;
  --gf-ctrl-choice-check-color: var(--rawls-green);

  /* ----------------------------------------
     Primary Button
  ---------------------------------------- */

  --gf-ctrl-btn-bg-color-primary: var(--rawls-green);
  --gf-ctrl-btn-color-primary: #fff;
  --gf-ctrl-btn-radius: 0.125rem;
}

/* ========================================
   Required Labels
======================================== */

.rawls-gravity-form .gfield_required,
.rawls-gravity-form .gfield_required_text {
  color: var(--rawls-green) !important;

  font-family: var(--font-heading);
  font-size: 0.75rem;
  font-weight: 600;
}

/* ========================================
   Name / Complex Field Sublabels
======================================== */

.rawls-gravity-form .ginput_complex label {
  font-family: var(--font-heading);
  font-size: 0.75rem;
  font-weight: 500;

  color: rgb(31 42 42 / 0.72);
}

/* ========================================
   Text Inputs
======================================== */

.rawls-gravity-form .gform-theme--framework input[type="text"],
.rawls-gravity-form .gform-theme--framework input[type="email"],
.rawls-gravity-form .gform-theme--framework input[type="tel"],
.rawls-gravity-form .gform-theme--framework input[type="url"],
.rawls-gravity-form .gform-theme--framework input[type="number"],
.rawls-gravity-form .gform-theme--framework input[type="password"],
.rawls-gravity-form .gform-theme--framework select,
.rawls-gravity-form .gform-theme--framework textarea {
  font-family: var(--font-body);

  border: 1px solid rgb(31 42 42 / 0.32) !important;

  transition:
    border-color 200ms ease-out,
    box-shadow 200ms ease-out;
}

.rawls-gravity-form .gform-theme--framework input[type="text"]:hover,
.rawls-gravity-form .gform-theme--framework input[type="email"]:hover,
.rawls-gravity-form .gform-theme--framework input[type="tel"]:hover,
.rawls-gravity-form .gform-theme--framework input[type="url"]:hover,
.rawls-gravity-form .gform-theme--framework input[type="number"]:hover,
.rawls-gravity-form .gform-theme--framework input[type="password"]:hover,
.rawls-gravity-form .gform-theme--framework select:hover,
.rawls-gravity-form .gform-theme--framework textarea:hover {
  border-color: rgb(31 42 42 / 0.42) !important;
}

.rawls-gravity-form .gform-theme--framework input[type="text"]:focus,
.rawls-gravity-form .gform-theme--framework input[type="email"]:focus,
.rawls-gravity-form .gform-theme--framework input[type="tel"]:focus,
.rawls-gravity-form .gform-theme--framework input[type="url"]:focus,
.rawls-gravity-form .gform-theme--framework input[type="number"]:focus,
.rawls-gravity-form .gform-theme--framework input[type="password"]:focus,
.rawls-gravity-form .gform-theme--framework select:focus,
.rawls-gravity-form .gform-theme--framework textarea:focus {
  border-color: var(--rawls-green) !important;

  box-shadow: 0 0 0 1px var(--rawls-green) !important;

  outline: none;
}

.rawls-gravity-form textarea {
  min-height: 11rem;
  line-height: 1.7;
  resize: vertical;
}

/* ========================================
   Radio Buttons / Checkboxes
======================================== */

.rawls-gravity-form .gfield_radio {
  gap: 0.35rem;
}

.rawls-gravity-form .gfield_checkbox {
  gap: 0.75rem;
}

.rawls-gravity-form .gchoice {
  margin: 0;
}

.rawls-gravity-form .gchoice label {
  font-family: var(--font-heading);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.55;

  color: rgb(31 42 42 / 0.82);
}

.rawls-gravity-form .gform-theme--framework input[type="radio"],
.rawls-gravity-form .gform-theme--framework input[type="checkbox"] {
  accent-color: var(--rawls-green) !important;
}

.rawls-gravity-form .gform-theme--framework input[type="radio"]:focus,
.rawls-gravity-form .gform-theme--framework input[type="radio"]:focus-visible,
.rawls-gravity-form .gform-theme--framework input[type="checkbox"]:focus,
.rawls-gravity-form
  .gform-theme--framework
  input[type="checkbox"]:focus-visible {
  outline: none !important;

  box-shadow:
    0 0 0 2px #fff,
    0 0 0 4px var(--rawls-green) !important;
}

/* ========================================
   Supporting Text / Counters
======================================== */

.rawls-gravity-form .gfield_description,
.rawls-gravity-form .ginput_counter {
  font-size: 0.75rem;
  line-height: 1.6;

  color: rgb(31 42 42 / 0.72);
}

/* ========================================
   Submit Button
======================================== */

.rawls-gravity-form .gform_footer input[type="submit"],
.rawls-gravity-form .gform_footer button[type="submit"],
.rawls-gravity-form .gform_button {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: auto;

  margin: 0;

  border: 0 !important;
  border-radius: 0.125rem !important;

  background: var(--rawls-green) !important;

  padding: 0.75rem 1.5rem !important;

  font-family: var(--font-heading) !important;
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;

  color: #fff !important;

  cursor: pointer;

  transition:
    opacity 200ms ease-out,
    box-shadow 200ms ease-out;
}

.rawls-gravity-form .gform_footer input[type="submit"]:hover,
.rawls-gravity-form .gform_footer button[type="submit"]:hover,
.rawls-gravity-form .gform_button:hover {
  opacity: 0.9;
}

.rawls-gravity-form .gform_footer input[type="submit"]:focus-visible,
.rawls-gravity-form .gform_footer button[type="submit"]:focus-visible,
.rawls-gravity-form .gform_button:focus-visible {
  outline: none !important;

  box-shadow:
    0 0 0 2px #fff,
    0 0 0 4px var(--rawls-gold) !important;
}

/* ========================================
   Mobile Complex Fields
======================================== */

@media (max-width: 639px) {
  .rawls-gravity-form .ginput_complex {
    grid-template-columns: 1fr !important;
  }
}

/* ========================================
   Validation Summary
======================================== */

/*
   Keep Gravity Forms' accessible validation
   summary and field links, but present it as a
   restrained notice rather than an alert box.
*/

.rawls-gravity-form .gform_validation_errors {
  margin: 0 0 1.5rem !important;

  border: 0 !important;
  border-left: 3px solid rgb(162 61 45 / 0.72) !important;
  border-radius: 0 !important;

  outline: 0 !important;
  box-shadow: none !important;

  background: rgb(162 61 45 / 0.045) !important;

  padding: 1rem 1.125rem !important;
}

.rawls-gravity-form .gform_validation_errors::before,
.rawls-gravity-form .gform_validation_errors::after {
  display: none !important;
}

.rawls-gravity-form .gform_validation_errors > h2,
.rawls-gravity-form .gform_validation_errors .gform_submission_error {
  margin: 0 !important;

  font-family: var(--font-heading) !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;

  color: rgb(125 46 35 / 0.95) !important;
}

.rawls-gravity-form .gform_validation_errors .gform-icon {
  color: rgb(162 61 45 / 0.6) !important;
}

.rawls-gravity-form .gform_validation_errors ol,
.rawls-gravity-form .gform_validation_errors ul {
  margin: 0.75rem 0 0 1.25rem !important;
  padding: 0 !important;
}

.rawls-gravity-form .gform_validation_errors li {
  margin: 0.35rem 0 !important;

  font-family: var(--font-body) !important;
  font-size: 0.8125rem !important;
  line-height: 1.55 !important;

  color: rgb(125 46 35 / 0.88) !important;
}

.rawls-gravity-form .gform_validation_errors a {
  color: inherit !important;

  text-decoration-thickness: 1px;
  text-underline-offset: 0.16em;
}

.rawls-gravity-form .gform_validation_errors a:hover {
  color: rgb(94 35 27) !important;
}

/* ========================================
   Field Validation
======================================== */

.rawls-gravity-form .gfield_error input[type="text"],
.rawls-gravity-form .gfield_error input[type="email"],
.rawls-gravity-form .gfield_error input[type="tel"],
.rawls-gravity-form .gfield_error input[type="url"],
.rawls-gravity-form .gfield_error input[type="number"],
.rawls-gravity-form .gfield_error input[type="password"],
.rawls-gravity-form .gfield_error select,
.rawls-gravity-form .gfield_error textarea {
  border-color: rgb(162 61 45 / 0.65) !important;
}

.rawls-gravity-form .gfield_error input[type="text"]:focus,
.rawls-gravity-form .gfield_error input[type="email"]:focus,
.rawls-gravity-form .gfield_error input[type="tel"]:focus,
.rawls-gravity-form .gfield_error input[type="url"]:focus,
.rawls-gravity-form .gfield_error input[type="number"]:focus,
.rawls-gravity-form .gfield_error input[type="password"]:focus,
.rawls-gravity-form .gfield_error select:focus,
.rawls-gravity-form .gfield_error textarea:focus {
  border-color: rgb(162 61 45 / 0.82) !important;

  box-shadow: 0 0 0 1px rgb(162 61 45 / 0.5) !important;
}

.rawls-gravity-form .validation_message,
.rawls-gravity-form .gfield_validation_message {
  margin-top: 0.45rem !important;

  border: 0 !important;
  background: transparent !important;

  padding: 0 !important;

  font-family: var(--font-heading) !important;
  font-size: 0.75rem !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;

  color: rgb(145 52 39 / 0.92) !important;
}

/* ========================================
   Confirmation
======================================== */

/*
   Gravity Forms may wrap custom confirmation
   markup inside its own confirmation container.

   The outer Gravity Forms wrapper owns the panel.
   Any inner .rawls-confirmation markup remains
   purely structural so the result never appears
   double-boxed.
*/

.rawls-gravity-form .gform_confirmation_wrapper {
  max-width: 48rem;
}

.rawls-gravity-form .gform_confirmation_message {
  max-width: 48rem;

  margin: 0;

  border: 0;
  border-left: 3px solid var(--rawls-green);

  background: rgb(4 70 75 / 0.05);

  padding: 1.5rem 1.75rem;

  box-shadow: none;
}

.rawls-gravity-form .gform_confirmation_message .rawls-confirmation,
.rawls-confirmation {
  max-width: none;

  margin: 0;

  border: 0;
  background: transparent;

  padding: 0;

  box-shadow: none;
}

.rawls-gravity-form .gform_confirmation_message h2,
.rawls-confirmation h2 {
  margin: 0;

  font-family: var(--font-heading);
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.3;

  color: var(--rawls-green);
}

.rawls-gravity-form .gform_confirmation_message p,
.rawls-confirmation p {
  margin-top: 0.75rem;

  font-family: var(--font-body);
  font-size: 0.95rem;
  line-height: 1.7;

  color: rgb(31 42 42 / 0.82);
}

.rawls-gravity-form .gform_confirmation_message p:first-child,
.rawls-confirmation p:first-child {
  margin-top: 0;
}
