@creativecommons/vocabulary/scss/form.scss

$input-color: $color-dark-slate-gray;
$input-border-color: $color-light-gray;
$input-shadow: none;

$input-focus-box-shadow-color: none;
$input-focus-border-color: $color-gray;
$input-hover-border-color: $color-gray;
$input-active-border-color: $color-gray;

$input-disabled-border-color: $color-gray;

@import "bulma/sass/form/_all.sass";

// Form control
@mixin form_control {
  font-family: $family-source-sans-pro;
  font-weight: 600;

  line-height: 1.3;

  border-width: 0.125rem;
}

// Input
.input {
  @include form_control;
  box-sizing: border-box;
  height: 2.5em;
  padding-left: $space-small;

  &.is-medium {
    font-size: 1.43rem;
    height: 3.875rem;
    padding-left: $space-normal;
  }

  &.is-large {
    font-size: 1.75rem;
    height: 5.063rem;
    padding-left: $space-big;
  }
}

// Textarea
.textarea {
  @include form_control;
  box-sizing: border-box;
  min-height: 6.875em;
  resize: both;
}

// Select
.select {
  select {
    @include form_control;

    option {
      font-weight: 400;
    }
  }

  &:not(.is-multiple):not(.is-loading)::after {
    background: linear-gradient(45deg, $color-black 50%, transparent 50%);

    border: none;
    border-radius: 0;
  }
}