/**
* Copyright (C) 2009-2014:
*    Gabes Jean, naparuba@gmail.com
*    Gerhard Lausser, Gerhard.Lausser@consol.de
*    Gregory Starck, g.starck@gmail.com
*    Hartmut Goebel, h.goebel@goebel-consult.de
*    Andreas Karfusehr, andreas@karfusehr.de
*    Frederic Mohier, frederic.mohier@gmail.com
*    Guillaume Subiron, maethor@subiron.org
*
* This file is part of Shinken.
*
* Shinken is free software: you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* Shinken is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
* GNU Affero General Public License for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with Shinken.  If not, see <http://www.gnu.org/licenses/>.
*
**/


/*
 * ---
 * Backported from shinken-webui.css
 *
 */
html, body {
    background: #f8f8f8;
}

body {
    padding-top: 70px;
    padding-bottom: 70px;
}

.page-header .fas {
    margin-right: 10px;
}

.breadcrumb {
    margin:0;
}

.table-invisible > thead > tr > th,
.table-invisible > tbody > tr > th,
.table-invisible > tfoot > tr > th,
.table-invisible > thead > tr > td,
.table-invisible > tbody > tr > td,
.table-invisible > tfoot > tr > th {
    border-top: 0;
}
.table-invisible {
    margin:0;
}

.table-w-condensed {
    width: auto !important;
}

.table-w-condensed td {
    padding: 5px 10px !important;
}

.tooltip-inner {
    white-space:pre;
    max-width:none;
}

.panel > table tr:first-child td,
.panel > table tr:first-child th {
    border-top: 0;
}

.panel > table tr td:first-child {
    padding-left: 20px !important;
}

.panel > table tr td:last-child {
    padding-right: 20px !important;
}

.table-title {
    color: #7F7F7F;
    /*padding-left: 30px;*/
    margin: 30px 0 20px 20px;
    /*font-size: 0.917em;*/
}

.table-title a {
    color: #7F7F7F;
    cursor: pointer;
}

.table-title a:hover {
    text-decoration: none;
}

/*
 * ------------------------------------------------------------------------
 * Page layout
 * ------------------------------------------------------------------------
 */

/*
 * Services / impacts tree
 */
.services-tree ul {
   padding-top: 0;  padding-bottom:0; border: 0;
}
.services-tree ul li{
   background-color: transparent;
   padding-top: 0;  padding-bottom:0; border: 0;
}

/*
 * Popover
 */
.popover {
   max-width: 640px;
/*
   white-space: nowrap; word-wrap: break-word;
*/
}

.popover-medium {
   max-width: 480px;
}

.popover-large {
   max-width: 1024px;
}

/*
 * Table with ellipsis for text too large in columns
 */
.table-nowrap {
   table-layout:fixed;
}

.table-nowrap td {
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
}

td .ellipsis {
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}

td .ellipsis > .long-output {
    display:none;
}

/*
 * ------------------------------------------------------------------------
 * Page layout
 * ------------------------------------------------------------------------
 */

/*
 * Side bar menu is configured in sb-admin-2.css!
 */

@media(max-height:600px) {
    .sidebar li  a {
        height: 30px;
    }
}

#side-filters {
    padding: 0 10px;
    margin: 0 10px;
    border: none;
}
#side-filters form {
    background-color: #ccc;
    border: none;
    margin-top: 0;
    margin-bottom: 0;
}

/*
 * Navigation bar, company logo
 */
.header .navbar-brand {
  padding: 1px;
}
.header .navbar-brand img {
  height: 48px;
  padding: 5px;
  margin: 0;
}

.fas.fa-striked:after {
    position: absolute;
    content: "/";
    font-weight: bold;
    font-size: 2em;
    left: 16px;
    top: 7px;
}

.navbar-inverse {
    margin-bottom: 0;
    background-color: #3371B7;
    border-bottom: none;
}

.navbar-inverse-2 {
    background-color: #6398d4 !important;
}

.navbar-inverse .navbar-top-links>li>a {
    color: white;
}

#sidebar-search,
#search,
.navbar-nav .input-group-addon {
    background-color: #4D95BE;
    color: white;
    height: 32px;
    border: none;
    box-shadow: none;
}

#search {
    font-size: 16px;
}
#sidebar-search {
    font-size: 14px;
}


.navbar-nav #search:hover,
.navbar-nav #search:hover + .input-group-addon {
    background-color: #60a0c5;
}

.navbar-nav #search:focus {
    background-color: white;
    color: black;
}

.nav .input-group-addon .open>a,
.nav .input-group-addon .open>a:hover,
.nav .input-group-addon .open>a:focus {
    background-color: transparent;
}

.navbar-nav .btn {
    background-color: #4D95BE;
    color: #fff;
    padding: 6px 12px;
    font-size: 16px;
    font-weight: 400;
    border-radius: 4px;
    min-height: 0px;
    border: none;
}

.navbar-nav > li .btn {
    margin: 8px 4px;
}

.navbar-nav > li .btn:hover,
.navbar-nav > li .btn:focus,
.navbar-nav > li .btn.focus,
.navbar-nav > li .btn:active,
.navbar-nav > li .btn.active {
    color: #fff;
    background-color: #4188b1;
}

.navbar-nav > li a.btn:hover,
.navbar-nav > li a.btn:focus,
.navbar-nav > li a.btn.focus,
.navbar-nav > li a.btn:active,
.navbar-nav > li a.btn.active {
    background-color: #4188b1 !important;
}

.navbar-nav .btn-ico {
    font-size: 16px;
    width: 32px;
    height: 32px;
    text-align: center;
    line-height: 1.33;
}

.navbar-nav > li .btn-badge {
    width: 48px;
    height: 32px;
}

.navbar-nav > li.divider {
    width: 10px;
    height: 32px;
}


/*.navbar-nav > li > .btn-ico.js-toggle-sound-alert {*/
    /*padding: 0;*/
/*}*/

.navbar-nav > li .btn-ico:not(.btn-action) {
    padding: 5px 8px;
}

.navbar-inverse-2 .btn {
    background-color: #555;
}

.navbar-inverse-2 .btn-action,
.btn-action {
    background: none;
    padding: 6px;
}

.navbar-inverse-2 .navbar-text {
    color: white;
}

.navbar-inverse-2 .btn-action:active,
.navbar-inverse-2 .btn-action.active,
.navbar-inverse-2 .btn-action:focus,
.navbar-inverse-2 .btn-action.focus,
.btn-action:active,
.btn-action.active,
.btn-action:focus,
.btn-action.focus {
    background: #ddd !important;
    border-radius: 20px;
    color: #555 !important;
}

.btn-action:hover,
.navbar-inverse-2 .btn-action:hover {
    background: none;
    color: black;
}


.navbar-inverse-2 .btn-action .far,
.btn-action .far {
    font-size: 20px;
    height: 22px;
    width: 22px;
}

.navbar-nav > li > .btn-user {
    border-radius: 17px;
}

.user-avatar > a {
    color: inherit;
}

.user-avatar > a:hover {
    cursor: pointer;
    text-decoration: none;
}

.user-avatar > a:hover > img {
    opacity: 0.8;
}

/*
 * Navigation bar, responsive input field
 */
#sidebar-search {
    /*width: 250px;*/
}
#search {
    width: 140px;
}
@media (min-width: 768px) {
    #search {
        /*width: 170px;*/
        width: calc(100vw - 500px);
    }
}
@media (min-width: 992px) {
    #search {
        /*width: 360px;*/
        width: calc(100vw - 700px);
    }
}
@media (min-width: 1280px) {
    #search {
        /*width: 50vw;*/
        width: calc(100vw - 800px);
    }
}

/*
 * Navigation bar, state displays
 */
.navbar-top-links li .popover a {
    padding: 0px;
}

.navbar-top-links li .popover a:hover {
    text-decoration: none;
}

/*
 * Footer - make footer bar smaller than usual ...
 */
footer nav {
    /*height: 25px;*/
    min-height: 25px !important;
}

/*
 * Actions menu - used on the dashboard for the widgets selector and on the element view for the actions
 */
#action-menu, #action-btn {
    margin: 0;
    margin-bottom: 25px;
    position: fixed;
    width: 200px;
    left: 0;
    bottom: 0;
}
#action-menu li {
    height: 25px;
    border-bottom: 1px solid #e7e7e7;
}
#action-menu li a {
    font-size: small;
}
#action-menu li .fas,
#action-menu li .far {
    padding: 1px;
    margin: 1px;
}
@media(max-width:768px) {
    #action-menu {
        width: 100%;
        border: none;
        background: none;
        text-align: center;
    }
    #nav-actions {
        position: fixed;
        top: 0;
        left: 50%;
        transform: translateX(-50%);

        margin: 0; padding: 0;
    }

    #nav-actions ul, #action-menu ul {
        list-style: none;
    }

    #action-menu li {
        height: 40px;
        border: 1px solid #e7e7e7;
        background: #ccc;
        display: inline;
        margin: 2px;
        padding: 5px;
        font-size: 16px;
    }

    #nav-actions li {
        display: inline;
    }

    #nav-actions li a, #action-menu li a {
        display: inline;
    }
}

/*
 * Breadcrumb
 */
.breadcrumb {
  background: none;
}

/*
 * Login page
 */
.form-signin {
  max-width: 330px;
  padding: 15px;
  margin: 0 auto;
}
.form-signin .form-control {
  position: relative;
  height: auto;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
  padding: 10px;
  font-size: 16px;
}
.form-signin .form-control:focus {
  z-index: 2;
}
.form-signin input[name="login"] {
  margin-bottom: -1px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.form-signin input[name="password"] {
  margin-bottom: 10px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

/*
 * Status lead
 */
.status-lead {
    margin-bottom: 20px;
    font-size: 14px;
    font-weight: 300;
    line-height: 1.4;
}
.status-lead samp {
    font-size: 80%;
    color: #777;
}
.status-lead a {
    color: #333;
}
.status-lead a:hover {
    text-decoration: underline;
}
@media (min-width: 768px) {
  .status-lead {
    font-size: 16px;
  }
}

.info {
    cursor: help;
}

/*
 * Shinken basics
 */

.font-ok, .font-up {
  color: #5bb75b !important;
}

.font-warning, .font-unreachable {
  color: #faa732 !important;
}

.font-critical, .font-down {
  color: #da4f49 !important;
}

.font-unknown, .font-pending {
  color: #49afcd !important;
}

.font-problem {
  color: #800080 !important;
}

.font-ack, .font-downtime {
  color: #777 !important;
}

.font-greyed {
  color: #ccc !important;
}


.background-ok, .background-up {
  background-color: #5bb75b !important;
}

.background-warning, .background-unreachable {
  background-color: #faa732 !important;
}

.background-critical, .background-down {
  background-color: #da4f49 !important;
}

.background-unknown, .background-pending {
  background-color: #49afcd !important;
}

.background-ack, .background-downtime {
  background-color: #777 !important;
}

.background-greyed {
  background-color: #ccc !important;
}


/*
 * Special font styles (Font Color)
 */
.font-white {color: #FFFFFF;}

.font-black {color: #000000;}

.font-green {color: #468847;}

.font-yellow {color: #FFEE00;}

.font-orange {color: #F89406;}

.font-red {color: #DA4F49;}

.font-green {color: #51A351;}

.font-grey {color: #505050;}

.font-lightgrey {color: #EBEBEB;}

.font-darkgrey {color: #535456;}

.font-blue {color: #3A87AD;}


/*
 * Special background colors
 */
.bg-white {background-color: #FFFFFF;}

.bg-black {background-color: #000000;}

.bg-green {background-color: #468847;}

.bg-yellow {background-color: #FFEE00;}

.bg-orange {background-color: #F89406;}

.bg-red {background-color: #DA4F49;}

.bg-green {background-color: #51A351;}

.bg-grey {background-color: #505050;}

.bg-lightgrey {background-color: #EBEBEB;}

.bg-darkgrey {background-color: #535456;}

.bg-blue {background-color: #3A87AD;}

/*  Special background colors (for hosts/services/contacts tags)
    ------------------------------------------------------- */
.bg-host {
  color: #f9f9f9 !important;
  background-color: #85144b !important;
}
.bg-service {
  color: #f9f9f9 !important;
  background-color: #004f3f !important;
}
.bg-contact {
  color: #f9f9f9 !important;
  background-color: #f56954 !important;
}
.bg-host:hover, .bg-service:hover, .bg-contact:hover {
  color: #000 !important;
  background-color: #fff !important;
}


.daterange-title {
    margin: 20px 0 8px;
    padding: 0 24px;
    color: #777;
    line-height: 24px;
}

.comment-time {
    color: #7F7F7F;
    font-size: 0.917em;
}

/* Override the default bootstrap badge */
.badge {
    font-size: 10px;
    font-weight: 800;
    color: #fff !important;
    line-height: 0.9;
    top: -8px !important;
    left: -8px !important;
    border-radius: 5px;
}
.badge-warning {
  background-color: #faa732 !important;
}

.badge-critical {
  background-color: #da4f49 !important;
}