﻿/*** loading overlay ***/
.loading-container {
    background-color: black;
    height: 100%;
    left: 0;
    opacity: 0.6;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1100;
}

.loading-container > img.spinner {
    height: 50px;
    left: 50%;
    margin-left: -25px;
    margin-top: -85px;
    position: absolute;
    top: 50%;
    width: 50px;
}

/*** bootstrap overrides and additions ***/

div.navbar-header a.navbar-brand {
    padding: 0 5px 0 0;
}

.dropdown:hover .dropdown-menu {
    display: block !important;
}

.text-danger:hover {
    color: #8a1816 !important;
}

.text-success:hover {
    color: #2b542c !important;
}

/* vertical nav list */
ul.nav.vertical-list-nav {
    cursor: pointer;
    margin-left: 15px;
}

    ul.nav.vertical-list-nav li.list-group-item {
        padding: 10px !important;
    }

        ul.nav.vertical-list-nav li.list-group-item:hover {
            background-color: #eee;
            color: #2c3e50;
        }

        ul.nav.vertical-list-nav li.list-group-item.selected-item {
            background-color: #222;
            border-color: #080808;
            color: #bbb;
        }

            ul.nav.vertical-list-nav li.list-group-item.selected-item:hover {
                background-color: #000;
                border-color: #080808;
                color: #fff;
            }

@media (max-width: 1750px) {
    ul.nav.vertical-list-nav {
        margin-left: 10px;
        width: 5%;
    }

    ul.nav.vertical-list-nav li.list-group-item {
        text-overflow: ellipsis;
    }
}

/* horizontal navbar */

nav.navbar {
    border-radius: 0;
    margin: 0;
}

div.navbar-collapse {
    padding: 0;
}

.navbar-right-anchor {
    cursor: pointer;
}

.navbar .divider-vertical {
    border-left: 1px solid #f4f4f4;
    border-right: 1px solid #ffffff;
    height: 50px;
    margin: 0 9px;
}

.navbar-inverse .divider-vertical-inverse {
    border-left: 1px solid #f2f2f2;
    border-left-color: #111111;
    border-right: 1px solid #ffffff;
    border-right-color: #222222;
    height: 50px;
    margin: 0 9px;
}

.dropdown-menuitem {
    cursor: pointer;
}

.dropdown-menu.dropdown-menu-inverse {
    background-color: #222;
    border-color: #080808;
}

.dropdown-menu.dropdown-menu-inverse > li > a {
    color: #bbb;
}

.dropdown-menu.dropdown-menu-inverse > li > a:hover {
    background-color: #000;
    color: #fff;
}

.dropdown-menu.dropdown-menu-inverse > .divider {
    background-color: #000;
    border-bottom: 1px solid #f2f2f2;
    border-bottom-color: #111111;
    border-top: 1px solid #ffffff;
    border-top-color: #222222;
}

@media (max-width: 767px) {
    .navbar-collapse .nav > .divider-vertical {
        display: none;
    }
}

/* panels */

.panel.panel-primary.panel-black {
    border-color: #080808;
}

    .panel.panel-primary.panel-black > .panel-heading {
        background-color: #222;
        border-color: #080808;
        color: #bbb;
    }

.panel.panel-primary.panel-custom {
    border-color: #7063c7;
}

    .panel.panel-primary.panel-custom > .panel-heading {
        background-color: #8a81c4;
        border-color: #7063c7;
        color: #eee;
    }

/* uib tabs */

uib-tab, uib-tab:focus {
    outline: none;
}

uib-tab-heading div {
    color: #000;
}

.tab-padding {
    padding-top: 5px;
}

/* uib sizes */
.modal-xlg {
    width: 1300px;
}

/* ui grid */

div.ibt-grid {
    font-size: 12px !important;
    height: 600px;
}

div.ibt-grid-large {
    font-size: 12px !important;
    height: 770px;
}

div.ibt-subgrid {
    font-size: 12px !important;
    height: 150px;
}

div.ibt-subgrid-large {
    font-size: 12px !important;
    height: 320px;
}

.canceled .ui-grid-cell {
    background-color: #f8c6c6 !important;
}

.warning .ui-grid-cell {
    background-color: #fcf8e3 !important;
}

.success .ui-grid-cell {
    background-color: #dff0d8 !important;
}

.finished .ui-grid-cell {
    background-color: #c7f8c6 !important;
}

.success.ui-grid-cell-contents {
    background-color: #dff0d8 !important;
}

.highlight.ui-grid-cell-contents {
    background-color: #d1ecf1 !important;
}

div.refreshable-grid {
    float: right;
    margin-right: 5px;
    width: 97%;
}

/* forms */

input.form-control[type="checkbox"] {
    margin: 0;
}

.has-error input {
    background: #f8c6c6;
}

.has-error > div > ol.nya-bs-select > button.btn {
    background: #f8c6c6;
    border-color: #a94442;
}

.form-control, .has-feedback .form-control {
    padding: 6px 6px;
}

.btn:focus {
    outline: dotted;
    outline-color: black;
    outline-width: 1px;
}

.btn.btn-custom {
    background-color: #8a81c4;
    border-color: #7063c7;
    color: #eee;
}

.btn.btn-custom:hover {
    background-color: #7063c7;
    border-color: #5a4ac4;
    color: #fff;
}

.btn.btn-inverse {
    background-color: #222;
    border-color: #080808;
    color: #bbb;
}

.btn.btn-inverse:hover {
    background-color: #000;
    border-color: #080808;
    color: #fff;
}

.btn.btn-refresh {
    float: left;
    margin-left: 25px;
    margin-right: -10px;
}

.btn.btn-vertical-nav {
    margin-left: -20px;
}

label.ibt-radio {
    cursor: pointer;
}

label.unchecked-radio {
    font-weight: normal !important;
}

label.padding-radio {
    padding-left:20px;
}

label.control-label {
    padding-left: 5px !important;
}

.filter-padding {
    padding-left: 15px;
    padding-right: 15px;
}

.clickable-element-cursor {
    cursor: pointer;
}

/* nya bs select */

li.ng-scope.nya-bs-option.active a {
    color: black;
    background-color: transparent;
}

li.ng-scope.nya-bs-option.active a:hover {
    background-color: #f5f5f5;
}

ol.nya-bs-select[disabled] {
    background-color: #ddd;
    border: 1px solid #ccc;
    color: #444;
}

ol.nya-bs-select[disabled]:focus {
    border-color: #66afe9;
    box-shadow: inset 0 1px 1px #000000, 0 0 8px #66afe9;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
    outline: 0;
}

ol.nya-bs-select .dropdown-toggle {
    height: 100%
}

/*** misc very specific css ***/

body {
    padding-top: 65px;
    padding-bottom: 40px;
}

.ibt-fixed-top-filters {
    z-index: 1;
    top: 50px;
    padding-top: 20px;
    border-bottom: 1px solid black;
    background-color: white;
    min-width: 100%;
}

    .ibt-fixed-top-filters .second-row-depth {
        z-index: 1 !important;
    }
    
.ibt-sticky-footer {
        min-height: 25px !important;
        padding-top: 5px;
        text-align: center;
    }

.ibt-main-header {
    background-color: #eee;
    color: #2c3e50;
    font-size: 1.4em;
    padding: 15px 20px;
}

.ibt-info-textbox {
    font-weight: bold;
    line-height: 1.2;
    padding-right: 19%;
}

.clickable-icon, .clickable-icon-inverse {
    cursor: pointer;
}

    .clickable-icon:not(.text-danger):hover {
        color: #000;
    }

    .clickable-icon-inverse:not(.text-danger):hover {
        color: #fff;
    }

.flag-icon {
    margin: 3px;
}

.no-padding-label {
    /* padding 0 pt ca checkboxes din bootstrap par sa aiba niste padding dubios la labels, implicit */
    padding: 0;
}

.no-padding {
    padding: 0;
}

.no-margin {
    margin: 0;
}

.no-x-margin {
    margin-right: 0;
    margin-left: 0;
}

.no-y-margin {
    margin-top: 0;
    margin-bottom: 0;
}

.multi-icon-margin {
    margin-left: 7px;
}

hr {
    margin-bottom: 10px;
    margin-top: 10px;
}

.bold-text {
    font-weight: bold;
}

.small-text {
    font-size: 7pt;
}

.blue-text {
    color: #2339a3
}

table.table th:first-child, table.table td:first-child {
    padding-left: 20px;
}

table.table th:last-child, table.table td:last-child {
    padding-right: 20px;
}

.btn.add-button {
    margin-top: -3px;
}

textarea {
    resize: none;
}

/* file upload */

.ibt-file-upload {
    background-color: #e1e1e1;
    border: 1px solid #ccc;
    cursor: pointer;
    padding: 6px;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
}

/* maps */

/* still TBD, do not like fixed px size */
.ibt-map {
    border: 1px solid;
    border-color: #000;
}

/* table */

.ibt-edit-field {
    min-height: 20px;
    width: 100%;
}

.ibt-edit-area-field {
    min-height: 40px;
    width: 100%;
}

.ibt-panel-row {
    background-color: #fdfdfd;
    padding: 6px 0px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.42857143;
    text-align: left;
    /*white-space: nowrap;*/
    vertical-align: middle;
    /*border-top: 1px solid black;*/
}

.ibt-panel-row.odd {
    background-color:#f3f3f3;
}

.ibt-panel-row:hover {
  color: #333;
  background-color: #d9d9d9;
  /*cursor: pointer;*/
}

.ibt-panel-row.success {
    background-color:#dff0d8;
}

.ibt-panel-row.odd.success {
    background-color:#d1eac8;
}

.ibt-panel-row.success:hover {
    background-color:#c2e2b6;
}

.ibt-panel-row.success.selected {
    background-color:#a4d491;
}

.ibt-panel-row.danger {
    background-color: #f2dede;
}

.ibt-panel-row.odd.danger {
    background-color: #e9c8c8;
}

.ibt-panel-row.danger:hover {
    background-color: #e2b6b6;
}

.ibt-panel-row.collapsable {
    color: #333;
    background-color: #a6a6a6;
    border-bottom: 1px solid black;        
    margin: 0px;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Chrome/Safari/Opera */
    -khtml-user-select: none; /* Konqueror */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                                not supported by any browser */
}

.ibt-panel-row.collapsable:hover {
  color: #333;
  background-color: #a6a6a6;
  cursor: pointer;
}

.ibt-subpanel-header {
    padding: 6px 15px;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: bold;
    line-height: 1.42857143;
    text-align: left;
    white-space: nowrap;
    vertical-align: middle;
    /*background-color: #e1e1ea;*/
    border-top: 1px solid black;
    /*border-bottom: 1px solid #d9d9d9;*/
}

.ibt-subpanel-row {
    padding: 6px 15px;
    word-wrap: break-word;
    overflow: hidden;
    margin-bottom: 0;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.42857143;
    text-align: left;
    white-space: normal;
    vertical-align: middle;
    border-bottom: 1px solid black;
}

.ibt-subpanel-row.success {
    background-color: #dff0d8;
}

.ibt-subpanel-row.odd.success {
    background-color: #d1eac8;
}

.ibt-subpanel-row.success:hover {
    background-color: #c2e2b6;
}

.ibt-subpanel-row.success.selected {
    background-color: #a4d491;
}

.ibt-subpanel-row.danger {
    background-color: #f2dede;
}

.ibt-subpanel-row.odd.danger {
    background-color: #e9c8c8;
}

.ibt-subpanel-row.danger:hover {
    background-color: #e2b6b6;
}

/* special tiny displays */

@media (max-height: 800px) {
    .ibt-map {
        height: 500px !important;
    }
}
@media (max-height: 700px) {
    .ibt-map {
        height: 400px !important;
    }
}
@media (max-height: 600px) {
    .ibt-map {
        height: 300px !important;
    }
}

@media (min-width: 1554px) {
    body, .btn, div, span, input :not(div.popup-label) {
        font-size: 0.75vw !important;
    }
}
@media (max-width: 1554px) {
    body, .btn, div, span, input {
        font-size: 12px !important;
    }

    .btn {
        padding: 6px !important;
    }
    .input-group-addon {
    }
    .input-group-btn .dropdown-toggle {
        padding: 0px 19px 0px 6px !important;
    }
    .input-group-btn input {
        padding: 0px 0px 0px 2px !important;
    }

    .ibt-info-textbox {
        font-weight: bold;
        line-height: 1.2;
        padding-right: 19%;
    }
}
@media (max-width: 1330px) {
    body, .btn, div, span, input {
        font-size: 10px !important;
    }
    br {
        line-height: 1.75;
    }
}
@media (max-width: 1200px) {
    body, .btn, div, span, input {
        font-size: 8px !important;
    }
    br {
        line-height: 1.95;
    }
}