/*
    Forms
    Created on 11/20/2017 by Corey O'Brien.
*/

/* ++++ Form and Form Controls ++++ */
form {
    height: 100%;
}

label {
    font-size: 0.75rem;
    font-family: $base-font-medium;
    &+.read-only-field {
        margin-top: -0.3rem;
        font-size: 0.9rem;
        line-height: 1rem;
        &.expand {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            &:hover {
                overflow: visible;
                white-space: normal;
                width: auto;
                cursor: ns-resize;
            }
        }
    }
    span {
        &.optional {
            color: $orange;
            font-family: $base-font-light;
            font-size: 0.7rem;
            margin-left: 0.3rem;
        }
    }
}

.form-group {
    .input-group {
        .input-group-btn {
            button {
                background: $light_gray;
                border: 0.0625rem solid darken($light_gray, 10%);
                color: $charcoal;
                cursor: pointer;
                height: 2.125rem;
                i {
                    top: -0.18rem;
                    position: relative;
                    margin-right: 0;
                }
                &:hover,
                &:active,
                &:focus {
                    background: $light_gray;
                }
            }
        }
    }
}

input.form-control,
textarea.form-control,
select.form-control {
    font-family: $base-font;
    font-size: 0.875rem;
    color: $charcoal;
    border-radius: 0.125rem;
}

input.form-control, button.form-control {
    min-height: 2.25rem;
}

fieldset {
    margin-top: 0.4rem;
    margin-bottom: 0.4rem;
    legend {
        font-size: 0.75rem;
        font-family: $base-font-medium;
        margin-bottom: 0.85rem;
        span {
            &.optional {
                color: $orange;
                font-family: $base-font-light;
                font-size: 0.7rem;
                margin-left: 0.3rem;
            }
        }
    }
}

.required {
    color: $rusted_red;
    font-family: $base-font-medium;
    font-size: 0.55rem;
    margin-left: 0.3rem;
}

.invalid-feedback {
    display: block;
}

.accumulator-list {
    overflow-y: auto;
    height: 12.5rem;
    margin-bottom: 0.625rem;
}

/* ++++ Buttons ++++ */
.btn-bar {
    margin-left: -0.625rem;
    margin-bottom: 1.3125rem;
}

.btn {
    font-size: 0.875rem;
    font-family: $base-font;
    letter-spacing: 0.05rem;
    padding: 0.5rem 0.75rem 0.4rem 0.75rem;
    border-radius: 0.1875rem;
    margin-left: 0.625rem;
    min-width: 7rem;
    cursor: pointer;
    i {
        margin-right: 0.3rem;
        font-size: 1.3rem;
        position: relative;
        top: 0.1rem;
        &.fa-smaller {
            font-size: 1.15rem;
        }
    }
    &.btn-primary {
        border-color: darken($sky_blue, 5%);
        background: $sky_blue;
        &:hover,
        &:active,
        &:focus {
            border-color: darken($navy, 5%);
            background: darken($navy, 10%);
            color: $white;
        }
    }
    &.btn-secondary {
        border-color: $sky_blue;
        background: $white;
        color: $sky_blue;
        &:hover,
        &:active,
        &:focus {
            border-color: darken($navy, 5%);
            background: $white;
            color: $navy;
        }
    }
    &.btn-link {
        color: $sky-blue;
        margin-left: 0;
        &[disabled]:hover {
            text-decoration: none;
            cursor: default;
        }
    }
}