/*
 *  Copyright 2016 Adobe Systems Incorporated
 *
 *  Licensed under the Apache License, Version 2.0 (the "License");
 *  you may not use this file except in compliance with the License.
 *  You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 *  Unless required by applicable law or agreed to in writing, software
 *  distributed under the License is distributed on an "AS IS" BASIS,
 *  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 *  See the License for the specific language governing permissions and
 *  limitations under the License.
 */

.form-inline {
    label + .form-control {
        margin-left: @padding-base-horizontal;
    }

    .btn-action {
        margin-left: @padding-small-horizontal;
    }
}

label {
    font-size: 13px;

    text-transform: uppercase;

    .radio &,
    .radio-inline &,
    .checkbox &,
    .checkbox-inline & {
        padding-left: 30px;

        font-weight: 700;

        text-transform: none;
    }

    &.h2 {
        vertical-align: middle;

        margin: auto;

        line-height: 42px;
    }
}

.form-control {
    padding-right: 15px;
    padding-left: 15px;

    border-width: 2px;

    box-shadow: none;

    font-weight: 700;
    font-style: italic;
    font-size: 16px;

    &:focus {
        box-shadow: none;
    }
}

.radio input[type=radio],
.radio-inline input[type=radio],
.checkbox input[type=checkbox],
.checkbox-inline input[type=checkbox] {
    transition: background-color @transition-default;

    //appearance: none;
    .appearance(none);

    width: 16px;
    height: 16px;

    border: 2px solid fade(@gray-base, 10);

    //margin-top: 3px;
    margin-left: -30px;

    line-height: (13px * @line-height-base);

    &:checked {
        border-color: @brand-primary;

        background-color: @brand-primary;
    }

     .form-control-focus();
    &:focus {
        box-shadow: none;
    }
}

.radio input[type=radio],
.radio-inline input[type=radio] {
    border-radius: 50%;

    line-height: 9px;

    text-align: center;

    &:checked {
        &::after {
            content: '';

            display: inline-block;

            width: 4px;
            height: 4px;

            border-radius: 50%;

            background-color: #fff;
        }
    }
}

.checkbox input[type=checkbox],
.checkbox-inline input[type=checkbox] {
    &:checked {
        line-height: 12px;

        text-align: center;

        &::after {
            content: @we-Icon--var-check;

            display: inline-block;

            font: normal normal normal 11px/14px "we-icons";
            color: #fff;
        }
    }
}