/**
* A general toggle element with less-class markup for forms
*/
.toggle-hide {
  legend {
    @include create-color-section($grayColor, none, $legendFontWeight);
  }

  .toggle-trigger, a[data-toggle] {
    @include interface();
    i:before {
      margin-left: 3px;
      transition: transform $globalShortEaseTime ease;
    }
    &.active > i:before {
      transform: rotate(90deg);
    }
  }
  padding-bottom: 0 !important;
  .toggle-container {
    display: none;
  }

  &.active {
    .toggle-container {
      display: block;
      @include animate(fadeIn);
    }
  }
}

fieldset.toggle-hide {
  &.active {
    padding-bottom: $formMargin !important;
  }
  &:last-of-type {
    margin-bottom: -$legendMargin;
  }
}

@media #{$mediaDesktop} {
  fieldset.toggle-hide {
    &.active {
      padding-bottom: $formMarginDesktop !important;
    }
    &:last-of-type {
      margin-bottom: -$legendMarginDesktop;
    }
  }
}