// Form control sizing
//
// Relative text size, padding, and border-radii changes for form controls. For
// horizontal sizing, wrap controls in the predefined grid classes. `<select>`
// element gets special love because it's special, and that's a fact!
// [converter] $parent hack
@mixin input-size($parent, $input-height, $padding-vertical, $padding-horizontal, $font-size, $line-height) {
    #{$parent} {
        padding: $padding-vertical $padding-horizontal;
        font-size: $font-size;
        line-height: $line-height;
    }
    select#{$parent} {
        min-height: $input-height;
        line-height: $input-height;
        padding: 0;
    }
    textarea#{$parent},
    select[multiple]#{$parent} {
        height: auto;
    }
}

@mixin radio-checkbox-base {
    content: '';
    width: 2.4rem;
    height: 2.4rem;
    border: solid .2rem $gray-medium-light;
    display: inline-block;
    z-index: 2;
    cursor: pointer;
    margin: 0 1.6rem 0 0;
}

@mixin disabled {
    cursor: initial;
    .checkbox-label:before,
    .radio-label:before {
        border: solid .2rem $gray-light !important;
        cursor: initial;
    }
    input {
        cursor: initial;
    }
    label {
        color: $gray-light !important;
        cursor: initial;
    }
}

@mixin select_arrow {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    right: 0;
    top: .8rem;
    border-top: solid 8px $gray-medium-light;
    border-left: .6rem solid transparent;
    border-right: .6rem solid transparent;
    border-top: solid .7rem $gray-medium-light;
}

@mixin arrow_disabled {
    border-top: solid 7px $gray-light;
}