@import 'variables';
@import 'typography';

html,
body,
.login {
    height: 100%;
}

body > div,
body > div > section {
    height: 100%;
    min-height: 100%;
}

body {
    background-color: $wild-sand;
}

header {
    height: 56px;
}

img {
    &.img-empty-state {
        content: url("../img/empty-state.svg");
    }
    &.img-ring-alt {
        content: url("../img/ring-alt.svg");
    }
    &.img-orchard-logo-white {
        content: url("../img/orchard-logo-white.svg");
    }
    &.img-orchard-text-btn {
        content: url("../img/orchard-text-btn.svg");
    }
    &.img-ma-logo {
        content: url("../img/ma-logo.svg");
    }
    &.img-orchard-logo {
        content: url("../img/orchard-logo.svg");
    }
}

.app-body {
    padding-top: 56px;
    margin-top: -56px;
    .main-content {
        min-height: 100%;
        padding-bottom: 90px;
        margin-bottom: -90px;
        .chart-area {
            padding-left: 20px;
            padding-right: 20px;
            .album-card.col-sm-12 {
                padding-left: 5px;
                padding-right: 5px;
            }
        }
    }
}

footer {
    background-color: white;
    height: 90px;
}

.check-box {
    border: 1px solid $iron;
    height: 25px;
    white-space: nowrap;
    width: 25px;

    input[type=checkbox] {

        display:none;

        + label {
            display: inline-block;
            font-weight: normal;
            height: 25px;
            left: 31px;
            line-height: 22px;
            position: relative;
        }

        + label:before {
            color: green;
            display: inline-block;
            font-family: FontAwesome;
            font-size: 24px;
            height: 25px;
            left: -31px;
            position: absolute;
            width: 25px;
            content: "\00a0";
        }

        &:checked + label:before {
            content: "\f00c";
            letter-spacing: 5px;
        }
    }
}

.btn-primary {
    color: white;
    border-radius: 3px;
    border-color: $sea-buckthorn;
    background: $sea-buckthorn;
    box-shadow: 0px 1px 0px rgba(0,0,0,0.11);

    &:hover {
        border-radius: 3px;
        border-color: $sea-buckthorn;
        background: $sea-buckthorn;
        box-shadow: 0px 5px 10px rgba(0,0,0,0.25);
    }
}

.margin-group {
    margin-bottom: 10px;
}

.no-margin {
    margin-top: 0px;
}

.loading-overlay {
    background:rgba(81,81,81,0.20);
    height:100%;
    left:0;
    position:fixed;
    top:0;
    width:100%;
    z-index:9999;

    .loading-icon {
        left: 50%;
        position: fixed;
        top: 50%;
        transform: translate(-50%, -50%);
    }
}

.range-display {
    color: $dawn;
    font-size: 18px;
    line-height: 25px;
    margin-bottom: 10px;
}

.data-card {
    &.col-sm-6 {
        padding-left: 5px;
        padding-right: 5px;
    }

    hr {
        margin: 0 10px 10px 10px;
    }

    svg {
        margin-bottom: -5px;
    }

    .panel {
        border-radius: 0;
        margin: 0px 0px 10px;
    }
}

.card-header {
    margin: 10px 10px 0 10px;
    min-height: 47px;
    width: inherit;

    > [class="row"] {
        > [class*="col-"] {
            padding-left: 5px !important;
            padding-right: 5px !important;
        }
    }
}

.card-detail {
    color: #2C83CB;
    min-height: 43px;
    width: inherit;
}

.card-title {
    color: $dawn;
    font-size: 14px;
}

.card-total {
    color: $tundora;
    font-size: 22px;
    font-weight: 200;
}