/**
 * Licensed to the Apache Software Foundation (ASF) under one
 * or more contributor license agreements.  See the NOTICE file
 * distributed with this work for additional information
 * regarding copyright ownership.  The ASF licenses this file
 * to you under the Apache License, Version 2.0 (the
 * "License"); you may not use this file except in compliance
 * with the License.  You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

 @import 'common.less';

 #top-nav {
   .navbar.navbar-static-top {
     background: #fff;
     border-top: 1px solid #e3e3e3;
     border-bottom: 1px solid #e3e3e3;
     margin-bottom: 10px;
 
     .navbar-header {
       padding: @navbar-header-vertical-padding @navbar-header-padding-right @navbar-header-vertical-padding @navbar-header-padding-left;
       margin-top: -5px;
       font-size: @navbar-header-font-size;
       width: ~"calc(100% - 440px)";
       a {
         color: #313D54;
         cursor: pointer;
       }
       a.disabled {
         cursor: default;
         color: #999;
       }
       .icon {
         font-size: @default-font-size;
         margin: 0 4px;
         vertical-align: baseline;
       }
     }
     .app-navbar {
       align-items: center;
       margin-left: -50px;
       display: flex;
       flex-direction: row-reverse;
     }
     .service-dropdown {
       inset: 0px auto auto 0px !important;
     }
 
     .cluster-notifications {
       display: flex;
       flex-direction: row;
     }
     .navbar-text.brand-wrapper {
       margin-top: 17px;
     }
     .navbar-text.brand-wrapper, .cluster-notifications {
       color: @top-nav-brand-color;
       font-size: 16px;
       font-weight: normal;
 
       a, a:hover, a:active, a:visited {
         color: @top-nav-brand-color;
         text-decoration: none;
         line-height: 20px;
         vertical-align: middle;
         position: relative;
       }
 
       span.alerts-label {
         line-height: 20px;
         cursor: pointer;
       }
 
       .numberCircle {
         border-radius: 50%;
         min-width: 20px;
         height: 20px;
         padding: 0 4px;
         color: @top-nav-ops-count-color;
         background-color: @top-nav-ops-count-bg-color;
         text-align: center;
         font-size: 12px;
         display: inline-block;
         position: relative;
         top: -2px;
 
         &.operations-count {
           .infoPulse();
         }
         &.alert-crit-count {
           background-color: @health-status-red;
         }
         &.alert-warn-count {
           background-color: @health-status-orange;
         }
         &.alerts-none-count {
           cursor: default;
         }
       }
       .cluster-name, .bg-label, .alerts-label {
         margin: 0px 15px 0px 5px;
         .glyphicon {
           font-size: 20px;
           top: 4px;
           left: 2px;
         }
       }
       .ops-count {
         margin-right: -1px;
         color: #006DCC;
         .infoPulseInner();
       }
     }
     a:hover {
       text-decoration: none;
     }
     .top-nav-user {
       button {
         text-transform: none;
       }
     }
     .ambari-views {
       padding: 0 20px 0 10px;
       .icon-th::after{
         display:none;
       }
       .notifications-dropdown.dropdown-menu {
         right: -28px;
         position:absolute;
         min-width: 200px;
         max-width: 300px;
         min-height: 100px;
         li  {
           padding: 2px 5px;
           a {
             font-size: 12px;
             color: @top-nav-menu-views-menu-color;
           }
         }
       }
       i {
         font-size: 20px;
         color: @top-nav-menu-views-menu-color;
         cursor: pointer;
       }
     }
   }
 
   #notifications-dropdown.dropdown-menu {
     .popup-arrow-up {
       right: 75px;
     }
     .notifications-body .table-controls .state-filter .form-control.filter-select {
       height: 34px;
     }
   }
 }
 .services-dropdown {
   inset: 0px auto auto 0px !important;
   position:fixed!important;
   top:auto!important;
   left:auto!important;
   transform:none!important;
 }
 