input.wp-block-search__input,
input[type='text'],
input[type='email'],
input[type='url'],
input[type='password'],
input[type='search'],
input[type='number'],
input[type='tel'],
input[type='range'],
input[type='date'],
input[type='month'],
input[type='week'],
input[type='time'],
input[type='datetime'],
input[type='datetime-local'],
input[type='color'],
textarea,
select {
  -webkit-appearance: none;
  padding: var(--wp--custom--form--spacing--padding);
  width: 100%;
  background-color: var(--wp--custom--form--color--background);
  border: var(--wp--custom--form--border--style) var(--wp--custom--form--border--width)
    var(--wp--custom--form--border--color);
  transition: all 0.15s ease-in-out;
  border-radius: var(--wp--custom--form--border--radius);

  &:focus {
    outline: none;
    border-color: var(--wp--preset--color--primary);
  }
}

select {
  background: var(--wp--custom--form--color--background)
    url("data:image/svg+xml;utf8,<svg viewBox='0 0 140 140' width='16' height='16' xmlns='http://www.w3.org/2000/svg'><g><path d='m121.3,34.6c-1.6-1.6-4.2-1.6-5.8,0l-51,51.1-51.1-51.1c-1.6-1.6-4.2-1.6-5.8,0-1.6,1.6-1.6,4.2 0,5.8l53.9,53.9c0.8,0.8 1.8,1.2 2.9,1.2 1,0 2.1-0.4 2.9-1.2l53.9-53.9c1.7-1.6 1.7-4.2 0.1-5.8z' fill='black'/></g></svg>")
    no-repeat;
  background-position: right 0.8rem top 50%;
  background-repeat: no-repeat;
}

[type='submit'] {
  border: none !important;
  font-family: var(--wp--custom--button--typography--font-family);
  font-size: var(--wp--custom--button--typography--font-size);
  line-height: var(--wp--custom--button--typography--line-height);
  font-weight: var(--wp--custom--button--typography--font-weight);
  color: #ffffff;
  display: inline-block;
  border-radius: var(--wp--custom--button--border--radius);
  border: var(--wp--custom--button--border--style) var(--wp--custom--button--border--width)
    var(--wp--custom--button--border--color);
  padding: var(--wp--custom--button--spacing--padding--top) var(--wp--custom--button--spacing--padding--right)
    var(--wp--custom--button--spacing--padding--bottom) var(--wp--custom--button--spacing--padding--left);
  font-size: var(--wp--preset--font-size--normal);
  background: var(--wp--preset--color--primary);
}

[type='radio'] {
  -webkit-appearance: none;
  position: relative;
  border: var(--wp--custom--form--border--style) var(--wp--custom--form--border--width)
    var(--wp--custom--form--border--color);
  background-color: var(--wp--custom--form--color--background);
  height: 1.5rem;
  width: 1.5rem;
  border-radius: 100%;
  outline: 0;
  vertical-align: middle;
  transform: translateY(-0.15rem);

  &:focus {
    outline: none;
    border-color: var(--wp--preset--color--primary);
  }

  &:checked:before {
    position: absolute;
    line-height: 0;
    top: 55%;
    left: 30%;
    content: '\2022';
    color: var(--unison--preset--primary-body-color);
  }
}

[type='checkbox'] {
  -webkit-appearance: none;
  border: var(--wp--custom--form--border--style) var(--wp--custom--form--border--width)
    var(--wp--custom--form--border--color);
  border-radius: var(--wp--custom--form--border--radius);
  background-color: var(--wp--custom--form--color--background);
  height: 1.5rem;
  width: 1.5rem;
  outline: 0;
  vertical-align: middle;
  transform: translateY(-0.15rem);

  &:focus {
    outline: none;
    border-color: var(--wp--preset--color--primary);
  }

  &:checked {
    background: var(--wp--custom--form--color--background)
      url('data:image/svg+xml;utf8,<svg enable-background="new 0 0 100 100" viewBox="0 0 100 125" xmlns="http://www.w3.org/2000/svg"><path d="m26 26h48v48h-48z" fill="none"/><path d="m33.3 71.3-22.3-22.3-7.6 7.5 29.9 29.9 64.1-64.1-7.5-7.5z"/></svg>')
      no-repeat;
    background-size: 1rem;
    background-position: top 0.1rem left 50%;
  }
}