/* ==========================================================================
   Gravity Forms Custom Theme — "RSVP / Elegant Invitation"
   Matches: serif-italic labels, underline-only inputs, all-caps heading,
   solid terracotta button.
   Add this via: Appearance > Customize > Additional CSS,
   or enqueue as a separate stylesheet after gravityforms.min.css
   ========================================================================== */

:root {
  --rsvp-color-heading: #2e3440;
  --rsvp-color-accent: #c08a6b;
  --rsvp-color-accent-dark: #b07a5c;
  --rsvp-color-border: #e3ded9;
  --rsvp-font-serif: "EB Garamond", "Cormorant Garamond", Georgia, "Times New Roman", serif;
}

/* Form title */
body .gform_wrapper.gravity-theme .gform_title,
body .gform_wrapper .gform_title {
  font-family: var(--rsvp-font-serif) !important;
  font-weight: 400 !important;
  font-style: normal !important;
  text-transform: uppercase !important;
  letter-spacing: 0.35em !important;
  font-size: 28px !important;
  color: var(--rsvp-color-heading) !important;
  text-align: center !important;
  margin-bottom: 0.3em !important;
}

/* Hide the "indicates required fields" legend entirely */
body .gform_wrapper.gravity-theme .gform_required_legend,
body .gform_wrapper .gform_required_legend {
  display: none !important;
}

/* Remove default Gravity Forms field borders/backgrounds entirely */
body .gform_wrapper.gravity-theme input[type="text"],
body .gform_wrapper input[type="text"],
body .gform_wrapper.gravity-theme input[type="email"],
body .gform_wrapper input[type="email"],
body .gform_wrapper.gravity-theme input[type="tel"],
body .gform_wrapper input[type="tel"],
body .gform_wrapper.gravity-theme input[type="number"],
body .gform_wrapper input[type="number"],
body .gform_wrapper.gravity-theme select,
body .gform_wrapper select,
body .gform_wrapper.gravity-theme textarea,
body .gform_wrapper textarea {
  font-family: var(--rsvp-font-serif) !important;
  font-style: italic !important;
  font-size: 17px !important;
  color: var(--rsvp-color-accent) !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: none !important;
  border-bottom: 1px solid var(--rsvp-color-border) !important;
  border-radius: 0 !important;
  padding: 10px 2px !important;
  box-shadow: none !important;
  width: 100% !important;
  text-align: center !important;
}

body .gform_wrapper.gravity-theme input::placeholder,
body .gform_wrapper input::placeholder,
body .gform_wrapper.gravity-theme textarea::placeholder,
body .gform_wrapper textarea::placeholder {
  font-family: var(--rsvp-font-serif) !important;
  font-style: italic !important;
  color: var(--rsvp-color-accent) !important;
  opacity: 1 !important;
}

body .gform_wrapper.gravity-theme input:focus,
body .gform_wrapper input:focus,
body .gform_wrapper.gravity-theme select:focus,
body .gform_wrapper select:focus,
body .gform_wrapper.gravity-theme textarea:focus,
body .gform_wrapper textarea:focus {
  outline: none !important;
  border-bottom-color: var(--rsvp-color-accent) !important;
  box-shadow: none !important;
}

/* Field labels (used if "Name"/"E mail" are labels, not placeholders) */
body .gform_wrapper.gravity-theme .gfield_label,
body .gform_wrapper .gfield_label {
  font-family: var(--rsvp-font-serif) !important;
  font-style: italic !important;
  font-weight: 400 !important;
  font-size: 17px !important;
  color: var(--rsvp-color-accent) !important;
  margin-bottom: 8px !important;
  text-align: center !important;
  width: 100% !important;
}

/* Hide "required field" indicators (asterisk or "(Required)" text) */
body .gform_wrapper.gravity-theme .gfield_required,
body .gform_wrapper .gfield_required {
  display: none !important;
}

/* Field spacing */
body .gform_wrapper.gravity-theme .gfield,
body .gform_wrapper .gfield {
  margin-bottom: 1.6em !important;
}

/* Radio / checkbox labels */
body .gform_wrapper.gravity-theme .gfield_radio label,
body .gform_wrapper .gfield_radio label,
body .gform_wrapper.gravity-theme .gfield_checkbox label,
body .gform_wrapper .gfield_checkbox label {
  font-family: var(--rsvp-font-serif) !important;
  font-style: italic !important;
  color: var(--rsvp-color-accent) !important;
  font-size: 16px !important;
}

body .gform_wrapper.gravity-theme .gfield_radio input[type="radio"],
body .gform_wrapper .gfield_radio input[type="radio"],
body .gform_wrapper.gravity-theme .gfield_checkbox input[type="checkbox"],
body .gform_wrapper .gfield_checkbox input[type="checkbox"] {
  accent-color: #3a7bd5 !important;
  width: 16px !important;
  height: 16px !important;
}

/* Footer container — centers the button inside it */
body .gform_wrapper.gravity-theme .gform_footer,
body .gform_wrapper .gform_footer {
  text-align: center !important;
}

/* Submit button */
body .gform_wrapper.gravity-theme .gform_footer input[type="submit"],
body .gform_wrapper .gform_footer input[type="submit"],
body .gform_wrapper.gravity-theme .gform_button,
body .gform_wrapper .gform_button {
  font-family: var(--rsvp-font-serif) !important;
  font-style: italic !important;
  text-transform: uppercase !important;
  letter-spacing: 0.15em !important;
  font-size: 16px !important;
  color: #ffffff !important;
  background-color: var(--rsvp-color-accent) !important;
  background-image: none !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 16px 40px !important;
  cursor: pointer !important;
  transition: background-color 0.2s ease !important;
  display: inline-block !important;
  float: none !important;
}

body .gform_wrapper.gravity-theme .gform_footer input[type="submit"]:hover,
body .gform_wrapper .gform_footer input[type="submit"]:hover,
body .gform_wrapper.gravity-theme .gform_button:hover,
body .gform_wrapper .gform_button:hover {
  background-color: var(--rsvp-color-accent-dark) !important;
}

/* Overall wrapper */
body .gform_wrapper.gravity-theme,
body .gform_wrapper {
  max-width: 460px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  float: none !important;
}

/* Also center the outer form tag / container some themes wrap around it */
body form.gform_wrapper,
body .gform_anchor + form,
body div[id^="gform_wrapper_"] {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Disclaimer text (added via the form's Description field in the GF editor) */
body .gform_wrapper.gravity-theme .gform_description,
body .gform_wrapper .gform_description {
  font-family: var(--rsvp-font-serif) !important;
  font-style: italic !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  color: var(--rsvp-color-heading) !important;
  text-align: center !important;
  margin-top: 0.5em !important;
  margin-bottom: 2em !important;
  opacity: 0.85;
}

/* ==========================================================================
   Mobile overrides — adds side padding and forces centering, since some
   themes ship their own mobile-only rules that can win over the general
   rules above at narrow viewports.
   ========================================================================== */
@media screen and (max-width: 600px) {

  html body .gform_wrapper.gravity-theme,
  html body .gform_wrapper {
    max-width: 100% !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
    box-sizing: border-box !important;
  }

  html body .gform_wrapper.gravity-theme .gfield_label,
  html body .gform_wrapper .gfield_label,
  html body .gform_wrapper.gravity-theme .gform_description,
  html body .gform_wrapper .gform_description {
    text-align: center !important;
  }

  html body .gform_wrapper.gravity-theme input[type="text"],
  html body .gform_wrapper input[type="text"],
  html body .gform_wrapper.gravity-theme input[type="tel"],
  html body .gform_wrapper input[type="tel"] {
    text-align: center !important;
  }

  html body .gform_wrapper.gravity-theme .gform_footer,
  html body .gform_wrapper .gform_footer {
    text-align: center !important;
    display: block !important;
  }

  html body .gform_wrapper.gravity-theme .gform_footer input[type="submit"],
  html body .gform_wrapper .gform_footer input[type="submit"],
  html body .gform_wrapper.gravity-theme .gform_button,
  html body .gform_wrapper .gform_button {
    display: inline-block !important;
    float: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}