/*-----------------------------------
-------------------------------------
FORMS
Styles for form elements, search forms, password-protected content forms,
and Gravity Forms integration.
-------------------------------------
-----------------------------------*/
input,
select,
textarea {
  background-color: var(--wp--preset--color--base);
  border: 1px solid var(--wp--preset--color--contrast);
  border-radius: 0;
  color: var(--wp--preset--color--contrast);
  font-family: var(--wp--preset--font-family--primary);
  font-size: var(--wp--preset--font-size--medium);
  font-weight: var(--wp--custom--font-weight--light);
  line-height: var(--wp--custom--line-height--body);
  padding: 10px 20px;
  width: 100%;
}

input:focus,
textarea:focus {
  background-color: var(--wp--preset--color--neutral);
  outline: none;
}

input[type="checkbox"],
input[type="image"],
input[type="radio"] {
  width: auto;
}

input[type="button"],
input[type="email"],
input[type="search"],
input[type="submit"],
input[type="text"],
textarea {
  -webkit-appearance: none;
}

::placeholder {
  color: var(--wp--preset--color--contrast);
  font-size: var(--wp--preset--font-size--small);
  opacity: 0.5;
}

/* Search */
.search-form {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--wp--preset--spacing--5);
}

.search-form > label {
  flex-grow: 1;
}

.search-form > label > input {
  width: 100%;
}

/* Password Form */
.post-password-form {
  padding-top: var(--header-height);
  margin-top: var(--wp--preset--spacing--6) !important;
}

:where(.post-password-form) :is(input[type=submit], input[type=button], [type='reset']) {
  margin-top: var(--wp--preset--spacing--5) !important;
}

/* Gravity Forms */
.gform_wrapper .gf_clear,
.gform_required_legend,
.gfield--type-honeypot {
  display: none !important;
}

.gform_wrapper{
  width: 100%;
}

.gform_wrapper .gf_progressbar_wrapper {
  margin-bottom: var(--wp--preset--spacing--6);
}

.gform_wrapper .gf_progressbar_wrapper .gf_progressbar_title {
  font-size: var(--wp--preset--font-size--x-small);
}

.gform_wrapper .gf_progressbar_wrapper .gf_progressbar {
  background-color: #e5e7eb;
  overflow: hidden;
}

.gform_wrapper .gf_progressbar_wrapper .gf_progressbar .gf_progressbar_percentage {
  background-color: var(--wp--preset--color--primary);
  text-align: right;
  padding-left: var(--wp--preset--spacing--2);
  padding-right: var(--wp--preset--spacing--2);
  padding-top: var(--wp--preset--spacing--1);
  padding-bottom: var(--wp--preset--spacing--1);
  font-size: var(--wp--preset--font-size--x-small);
}

.gform_wrapper .gform_fields {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: var(--wp--preset--spacing--4);
  row-gap: var(--wp--preset--spacing--4);
}

.gform_wrapper fieldset,
.gform_wrapper .gfield {
  margin: 0;
  padding: 0;
  border: none;
  grid-column: span 12 / span 12;
  display: flex;
  flex-direction: column;
}

.gform_wrapper fieldset.hidden_label label,
.gform_wrapper .gfield.hidden_label label {
  display: none !important;
}

.gform_wrapper fieldset.gfield--type-choice.inline .ginput_container > div,
.gform_wrapper .gfield.gfield--type-choice.inline .ginput_container > div {
  display: flex;
  gap: var(--wp--preset--spacing--5);
}

.gform_wrapper legend,
.gform_wrapper label:not(.gform-field-label--type-sub, .gform-field-label--type-inline) {
  font-size: var(--wp--preset--font-size--small);
  font-weight: 500;
  margin-top: var(--wp--preset--spacing--1);
  margin-bottom: var(--wp--preset--spacing--1);
}

.gform_wrapper label.gform-field-label--type-sub {
  font-size: var(--wp--preset--font-size--x-small);
  color: #6b7280;
  margin-top: var(--wp--preset--spacing--1);
}

.gform_wrapper .gfield_required {
  display: inline-block;
  margin-left: 0.2em;
}

.gform_wrapper .gfield_description {
  margin-bottom: var(--wp--preset--spacing--2);
  font-size: var(--wp--preset--font-size--x-small);
  line-height: var(--wp--custom--line-height-x-small);
  color: var(--wp--preset--color--gray-500);
}

.gform_wrapper .gfield_description.ginput_counter {
  font-size: var(--wp--preset--font-size--x-small);
  color: #6b7280;
}

.gform_wrapper .ginput_complex > * {
  display: flex;
  flex-direction: column;
}

.gform_wrapper input:not(.gform_button),
.gform_wrapper textarea,
.gform_wrapper select {
  border-width: 1px;
  border-style: solid;
  border-color: #9ca3af;
  font-size: var(--wp--preset--font-size--base);
  padding-top: var(--wp--preset--spacing--3);
  padding-bottom: var(--wp--preset--spacing--3);
  padding-left: var(--wp--preset--spacing--4);
  padding-right: var(--wp--preset--spacing--4);
}

.gform_wrapper input:not(.gform_button):focus,
.gform_wrapper textarea:focus,
.gform_wrapper select:focus {
  border-color: var(--wp--preset--color--primary);
}

.gform_wrapper .ginput_complex {
    display: grid;
    gap: var(--wp--preset--spacing--4);
  }

.gform_wrapper .ginput_container > * {
  width: 100%;
}

.gform_wrapper .gform_footer,
.gform_wrapper .gform-page-footer {
  margin-top: var(--wp--preset--spacing--6);
}

.gform_wrapper .gform-page-footer {
  display: flex;
  gap: var(--wp--preset--spacing--4);
}

.gform_wrapper input.gform_button,
.gform_wrapper input.gform-theme-button,
#wp-submit {
  background-color: var(--wp--preset--color--dark) !important;
  border-color: var(--wp--preset--color--dark) !important;
  color: white !important;
  font-weight: 400;
  font-size: var(--wp--preset--font-size--small);
  width: auto;
  line-height: 1;
  padding-block: var(--wp--custom--button-padding-y);
  padding-inline: var(--wp--custom--button-padding-x);
  text-transform: uppercase;
}

.gform_wrapper input.gform_button.gform_previous_button,
.gform_wrapper input.gform-theme-button.gform_previous_button {
  background-color: #e5e7eb !important;
  border-color: #e5e7eb !important;
}

/* Gravity Form List Repeater */
.gfield_list_header{
  font-weight: bold;
  margin-top: 1rem;
  color: white;
  background-color: var(--wp--preset--color--secondary);
  padding: 0.5rem;
}

.gfield_list_groups{
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin: 1rem 0 0 0;
}

.gform-grid-row {
  display: flex;
  gap: 1rem;
  align-items: center;
}

.gform-grid-col{
  flex-grow: 1;
}

.gfield_list_icons,
.gfield_header_item--icons{
  text-align: right;
  width: 6.25rem;
  flex-grow: 0;
}

/* Messages */
.gform_confirmation_message {
  background-color: #dcfce7;
  color: #14532d;
  padding-top: var(--wp--preset--spacing--4);
  padding-bottom: var(--wp--preset--spacing--4);
  padding-left: var(--wp--preset--spacing--4);
  padding-right: var(--wp--preset--spacing--4);
  font-size: var(--wp--preset--font-size--small);
}

.gform_wrapper .gform_validation_errors, 
.gfield_validation_message {
  margin-bottom: var(--wp--preset--spacing--6);
  background-color: #fee2e2;
  color: #7f1d1d;
  padding-top: var(--wp--preset--spacing--3);
  padding-bottom: var(--wp--preset--spacing--3);
  padding-left: var(--wp--preset--spacing--4);
  padding-right: var(--wp--preset--spacing--4);
  font-size: var(--wp--preset--font-size--small);
}

.gfield_validation_message{
  margin-top: var(--wp--preset--spacing--3);
}

.gform_wrapper .gform_validation_errors > *:first-child,
.gfield_validation_message > *:first-child {
  margin-top: 0 !important;
}

.gform_wrapper .gform_validation_errors > *:last-child,
.gfield_validation_message > *:last-child {
  margin-bottom: 0 !important;
}

.gform_wrapper .gform_validation_errors h2,
.gfield_validation_message h2 {
  font-size: var(--wp--preset--font-size--small) !important;
  color: #7f1d1d !important;
}

.gform_wrapper .gform_validation_errors a,
.gfield_validation_message a {
  text-decoration: none !important;
  color: #7f1d1d !important;
}

/* Subscribe */
#gform_wrapper_1 {
  margin-top: 0;
}

@media screen and (min-width: 768px){

  .gform_wrapper fieldset.gfield--width-half,
  .gform_wrapper .gfield.gfield--width-half {
    grid-column: span 6 / span 6;
  }

  .gform_wrapper fieldset.gfield--width-third,
  .gform_wrapper .gfield.gfield--width-third {
    grid-column: span 4 / span 4;
  }

  .gform_wrapper fieldset.gfield--width-quarter,
  .gform_wrapper .gfield.gfield--width-quarter {
    grid-column: span 3 / span 3;
  }

  .gform_wrapper .ginput_complex {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #gform_1 {
    display: flex;
    align-items: stretch;
    padding: var(--wp--preset--spacing--3) var(--wp--preset--spacing--4);
    gap: var(--wp--preset--spacing--5);
    position: relative;
    background-color: var(--wp--preset--color--white);
    
    .gform_body {
      flex-grow: 1;
    }
    
    .gform_fields {
      height: 100%;
    }

    .gfield {
      justify-content: center;
    }
    
    /* Input */
    .ginput_container_email {
      display: flex;
      align-items: center;

      input {
        padding: 0;
        border-radius: 0 !important;
        border: none;

        &:focus, &:focus-within {
          background-color: initial !important;
        }
      }

      &::before {
        content: url("data:image/svg+xml,%3Csvg width='18' height='14' viewBox='0 0 18 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath opacity='0.5' d='M2.25 1.6875C1.93359 1.6875 1.6875 1.96875 1.6875 2.25V3.05859L7.73438 8.01562C8.47266 8.61328 9.49219 8.61328 10.2305 8.01562L16.3125 3.05859V2.25C16.3125 1.96875 16.0312 1.6875 15.75 1.6875H2.25ZM1.6875 5.23828V11.25C1.6875 11.5664 1.93359 11.8125 2.25 11.8125H15.75C16.0312 11.8125 16.3125 11.5664 16.3125 11.25V5.23828L11.3203 9.31641C9.94922 10.4414 8.01562 10.4414 6.67969 9.31641L1.6875 5.23828ZM0 2.25C0 1.01953 0.984375 0 2.25 0H15.75C16.9805 0 18 1.01953 18 2.25V11.25C18 12.5156 16.9805 13.5 15.75 13.5H2.25C0.984375 13.5 0 12.5156 0 11.25V2.25Z' fill='black'/%3E%3C/svg%3E%0A");
        margin: 0 var(--wp--preset--spacing--4);
      }
    }

    /* Form Footer */
    .gform_footer {
      margin: 0;
      padding: 0;
      
      /* Submit Button */
      input.gform_button {
      }
    }
  }

}