form.hs-custom-form,
form.hsfc-Form {
  display: flex;
  flex-direction: column;
  gap: 16px;

  & div {
    margin: 0 !important;
  }

  & fieldset,
  div,
  textarea,
  input {
    width: 100% !important;
    max-width: none !important;
  }

  & input,
  textarea {
    margin: 0 !important;
    resize: none !important;
    border-radius: 2px !important;
    padding: 8px 12px !important;
    outline: none !important;
    border: solid 1px #DCDDE5 !important;

    &:focus {
      border: 1px solid #262262 !important;
      outline: none !important;
      box-shadow: none !important;
    }
  }

  & textarea {
    height: 138px !important;
  }

  & label {
    margin-bottom: 4px !important;
    display: inline-block !important;
    font-family: var(--font-body) !important;
    font-weight: 500 !important;
    font-size: 16px !important;
    line-height: 28px !important;
    color: #2B2D38 !important;  
}

& .hs-richtext,
& .legal-consent-container {
  font-family: var(--font-body) !important;
  color: #2B2D38 !important;
}
  & fieldset {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }

  ul[role='alert'] {
    color: #e32424 !important;
    margin-left: 4px;
  }

  /* Errors */
  .hs-error-msg {
    color: #e32424 !important;
  }

 

  /* Checkbox */
  ul label {
    display: flex !important;
    align-items: center !important;

    & span {
      margin-left: 0 !important;
    }

    & input[type='checkbox'] {
      width: 16px !important;
      aspect-ratio: 1 / 1 !important;
      padding: 0 !important;
      margin-right: 8px !important;
      border-radius: 2px !important;
      accent-color: rgb(var(--primary)) !important;
      top:0;

      &:checked {
        background-color: rgb(var(--primary)) !important;
      }
    }
  }

  /* Buttons */
  & input[type='submit'],
  & button {
    padding: 8px 16px !important;
    border-radius: 0px !important;
    border: none !important;
    background-color: #262262 !important;
    color: white !important;
    font-weight: 600 !important;
    font-family: var(--font-body) !important; 
    font-size: 20px !important;
    cursor: pointer !important;
    transition: background-color 0.2s ease !important;

    &:hover {
      background-color: #FF6161 !important;
    }

    &:disabled {
      opacity: 0.6 !important;
      cursor: not-allowed !important;
    }
  }
}

@media (min-width: 710px) {
  form.hs-custom-form,
  form.hsfc-Form {
    fieldset {
      flex-direction: row;
    }
  }
}