@charset "UTF-8";
@import 'libs/_lib';

button.btn-selectpicker, 
button.btn-selectpicker.form-control, 
input[type="text"], 
input[type="text"].form-control, 
input[type="number"], 
input[type="number"].form-control, 
input[type="search"], 
input[type="search"].form-control, 
input[type="password"], 
input[type="password"].form-control, 
input[type="email"], 
input[type="email"].form-control, 
input[type="color"], 
input[type="color"].form-control, 
select, 
select.form-control, 
textarea, 
textarea.form-control {
    display: block;
    width: 100%;
    padding: 0 15px;
    border-radius: 0;
    @include eqbox(34px);
    border: 0;
    background-color: $input-background-color;
    color: #ffffff;
    font-size: 14px;
    @include outline-remove;
    @include placeholder {
        color: #ffffff;

    }
    .filter-content & {
        background-color: #000000;

    }

}
input[type="number"], 
input[type="number"].form-control {
    &::-webkit-inner-spin-button,
    &::-webkit-outer-spin-button {
        -webkit-appearance: none; 
        margin: 0;

    }

}
textarea, 
textarea.form-control {
    height: auto;
    min-height: 120px;
    resize: vertical;
    line-height: 1.2;
    padding: 10px;

}
select[multiple], 
select[multiple].form-control {
    height: 150px;

}
input.hidden-field {
    display: none;

}

.form-col {
    form,
    .pseudo-form {
        display: flex;
        flex-flow: row wrap;
        max-width: 700px;
        margin: 0 auto;
        > .row {
            flex-basis: 100%;

        }

    }

}

.form-block {
    &.-edit-profile {
        display: flex;
        width: 100%;

    }

}

.form-item {
    flex: 0 1 auto;
    margin-bottom: 15px;
    position: relative;
    &.-full {
        flex-basis: 100%;

    }
    &.-half {
        flex-basis: 50%;

    }
    &.-links {
        flex-basis: 100%;
        text-align: center;
        a {
            display: block;
            color: $theme-color-1;
            font-weight: 700;
            font-size: 13px;
            &:hover {
                color: lighten($theme-color-1, 10%);

            }
            & + a,
            & + .btn {
                margin-top: 10px;

            }

        }

    }
    &.-actions {
        flex-basis: 100%;
        margin-bottom: 0;
        text-align: center;
        font-size: 0;
        .btn {
            font-size: 13px;
            @include eqbox(40px);
            & + .btn {
                margin-left: 10px;

            }

        }

    }
    > label, > .label {
        display: block;
        font-size: 14px;
        color: #8c8c8c;
        line-height: 1;
        .filter-content & {
            color: rgba(#ffffff, .8);

        }

    }

}

.captcha-wrapper {
    display: flex;
    align-items: center;
    flex-flow: row nowrap;
    img {
        flex: 0 0 auto;
        height: 34px;
        margin-right: 10px;

    }
    input[type="text"] {
        flex: 1 0 0;

    }

}

.checkbox,
.radio {
    display: block;
    label {
        position: relative;
        input[type="checkbox"],
        input[type="radio"] {
            position: absolute;
            width: 0;
            height: 0;
            visibility: hidden;

        }
        .sub-label {
            position: relative;
            padding-left: 25px;
            display: block;
            line-height: 24px;
            &::before {
                content: "";
                display: block;
                width: 18px;
                height: 18px;
                position: absolute;
                top: 50%;
                left: 0;
                transform: translateY(-50%);
                border: 2px solid darken($gray, 10%);

            }
            &::after {
                content: "";
                display: block;
                width: 8px;
                height: 8px;
                position: absolute;
                top: 50%;
                left: 5px;
                transform: translateY(-50%);
                background-color: $theme-color-1;
                opacity: 0;
                transition: opacity $trans-time $trans-type;

            }

        }
        input[type="checkbox"]:checked + .sub-label::after,
            input[type="radio"]:checked + .sub-label::after {
            opacity: 1;

        } 
        a {
            color: $theme-color-1;
            &:hover {
                color: lighten($theme-color-1, 10%);

            }

        }

    }

}
.radio {
    label {
        .sub-label {
            &::before,
            &::after {
                border-radius: 50%;

            }

        }

    }

}

.bootstrap-select {
    select {
        display: none;

    }
    > .dropdown-toggle {
        position: relative;


    }
    .dropdown-menu {
        background-color: #ffffff;
        &.inner {
            display: block;

        }
        &.show {
            display: block;

        }
        a {
            font-size: 14px;
            font-weight: 400;
            color: #333333;
            text-transform: none;
            &:hover {
                color: #333333;
                background-color: $gray;

            }

        }

    }

}

.fake-upload {
    display: block;
    position: relative;
    input[type="file"] {
        display: none;
        
    }
    
}