/*
    * Start Bootstrap - Simple Sidebar (http://startbootstrap.com/)
    * Copyright 2013-2016 Start Bootstrap
    * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap/blob/gh-pages/LICENSE)
    */

body,
html {
    height: 100%;
    /* this important will override for example material.min.css which uses Helvetica etc */
    font-family: 'Open sans', sans-serif !important;
    overflow-x: hidden !important;
    /* overflow-y:hidden!important; */
}


fix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}

.save-select {
    text-align: center;
    padding: 8px 10px;
    border-radius: 4px;
    color: #FFF;
    font-size: 12px;
    background-color: #444;
}

.clearfix {
    display: inline-block;
}

/* start commented backslash hack \*/

* html .clearfix {
    height: 1%;
}

.clearfix {
    display: block;
}

.format-qlik-header .qv-object .qv-object-title {
    font-weight: 100;
    margin: 0px;
    margin-bottom: -5px;
}

body.main-welcome .qv-listbox-popover {
    min-width: 360px;
}

/* close commented backslash hack */

.m-tooltip {
    display: none;
    position: absolute;
    border: 1px solid #333;
    background-color: #161616;
    border-radius: 5px;
    padding: 10px;
    color: #fff;
    font-size: 14px;
    z-index: 8888;
}

.dtsearch-wrapper {
    /* display: none; */
    background-color: white;
    /* Not necessary is it? position:absolute */
    /* position: absolute; */
    /* Full width */
    /* left: 0; */
    /* right: 0; */
    /* So it appears above the "Create sheet" button */
    z-index: 3;
}

.dtsearch-table-wrapper {
    max-height: 500px;
    overflow-y: scroll;
}

.dtsearch-action-wrapper {
    padding: 10px;
    font-weight: bolder;
    border-bottom: 2px solid #dedede;
}

.dtsearch-table-wrapper td:hover {
    cursor: pointer;
}

.dtsearch-table-wrapper .highlighted,
.highlighted {
    /* Once the "mark" and "datatables mark" plugin for datatables did the highlighting:
            So the old Whyzen code targeted "mark"
            Bootstrap also targets a "mark"; makes its text black:
            mark { */
    background: #8cc63f;
    color: black;
    padding: 0px 1px;
    /* }	 
    
            And bootstrap would do the color:black; */
}

.dtsearch-table-wrapper table {
    /* 
    https://stackoverflow.com/a/4470128/1175496
    Table overflowing outside of div
     */
    table-layout: fixed;
}

.dtsearch-table-wrapper td {
    overflow: hidden;
}

.dtsearch-table-wrapper .no-records {
    text-align: center;
    padding: 1em;
}

a {
    cursor: pointer;
    /* pointer: cursor; */
}

span.selection::before {
    height: 100% !important;
}

a,
a:hover,
a:visited,
a:active,
.btn-link:hover,
.btn-link:visited {
    color: #fff;
    text-decoration: none;
    /* important was too strong ; "hides" (white on white) the header_image text (beneath logo in upper-left) and the links in docs-template */
    /* color: #fff !important;
            text-decoration: none !important;
            */
}

.compact-btn-link {
    padding-left: 18px;
    line-height: 40px;
    font-weight: 200;
}

.compact-btn-link:hover {
    background: rgba(255, 255, 255, 0.2) !important;
}

.bhi-logout-link,
.bhi-logout-link a,
.user-info a {
    color: #005081 !important;
}

.info-list a {
    color: #255779;
    text-decoration: underline;
}

.welcome-col .info-list a {
    color: white !important;
}

.select2-container {
    width: 100% !important;
}

span.select2.select2-container.select2-container--default {
    padding: 2px;
    overflow: visible;
}

span.select2.select2-container.select2-container--default .selection {
    padding: 0px;
}

/* from select2.css */
.select2-container--default.select2-container--focus .select2-selection--multiple {
    padding-right: 30px;
}

.session-selections-ui-panel .qvobject {
    /* height: 100px !important; */
    /* min-height: 100px !important; */
    /* max-height: 100px !important; */
    min-height: 140px;
    max-height: 140px;
    width: 100%;
    /* width: 255px; */
    width: 100%;
    margin-top: 5px;
}

.select2-container--default .select2-selection--multiple .select2-selection__rendered {
    overflow-y: scroll !important;
    /* enough height to fit up to 3 selections */
    max-height: 100px;
}

.to-welcome-message {
    position: fixed;
    top: 36%;
    left: calc(50% - 260px);
    font-size: 24px;
    padding: 18px;
    background: #255779;
    border-radius: 7px;
    color: #fff;
    width: 540px;
    text-align: center;
    line-height: 44px;
    /* mobile fix */
    /*z-index: 800;*/
}

.to-welcome-message a {
    text-decoration: underline;
}


/* Replacing fa-glob, fa-film, and fa-bookmark with Qlik Sense Icons */

/* .lui-icon--slide-show:before {
            content: "\C7";
          } */
/* .fa-film:before {
            font-family: 'LUI icons';
            content: "\00C7" !important;
        } */

/* .lui-icon--sheet:before {
            content: "4";
          } */
/* .fa-globe:before {
            font-family: 'LUI icons';
            content: "4" !important;
        } */

/* .lui-icon--bookmark:before {
            content: ">";
          } */
/* .fa-bookmark:before {
            font-family: 'LUI icons';
            content: ">" !important;
        } */

/* END Replacing fa-glob, fa-film, and fa-bookmark with Qlik Sense Icons */

/* show hide animation for iframes and also panel wrappers which are targeted using the selector "span[ng-show] div:first-child" */

span[ng-show] div:first-child,
iframe {
    transition: none;
}

.panel-story.ng-hide,
.panel-bookmark.ng-hide,
.panel-sheet.ng-hide {
    transition: 0.3s linear all;
    opacity: 0;
}

/* Toggle Styles */

#bhi-wrapper,

/* https://jira.bluehealthintelligence.com/browse/WYSD-1881
Landing Page 2.0 UI: Loading/Landing Sheet: "Inert" sheet or ability to bypass (pin sheet) */
.page-hider.load-indicate.includes-summary-sheet,
.includes-summary-sheet.toggled .iframe-container {
    padding-left: 0;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

/* is_detail_app_dont_auto_open_just_show_inert_config_app_loading_sheet */
#sidebar-wrapper {
    padding-top: 22px;
    z-index: 1000;
    position: fixed;
    left: 0px;
    width: 0;
    height: 100%;
    /* margin-left: -250px; */
    overflow-y: scroll;
    overflow-x: hidden;
    background: #014979;
    background: #969696;
    background: #7d7d7d;
    background: #193b54;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    display: flex;
    flex-direction: column;

}

#sidebar-wrapper .whyzen-deploy-config-select {
    order: 1;
}

#sidebar-wrapper .account-name {
    order: 2;
}

#sidebar-wrapper .search-report-wrapper {
    order: 3;
}

#sidebar-wrapper .report-links-container {
    order: 4;
}

#sidebar-wrapper .app-objects {
    order: 5;
}

#sidebar-wrapper .resources {
    order: 6;
}

#sidebar-wrapper .sidebar-nav {
    font-size: 19px;
}

#sidebar-wrapper.is_use_compact_salesdemo_style .nav-link-divider {
    border-bottom: #8FCAE7 1px solid;
    margin-left: 15px;
    margin-right: 15px;
    margin-top: 10px;
    margin-bottom: 10px;
}

#sidebar-wrapper.is_use_compact_salesdemo_style .search-report-wrapper {
    order: 4;
    padding-top: 0px;
}

#sidebar-wrapper.is_use_compact_salesdemo_style .report-links-container {
    order: 3;
}

[ui-view] {
    height: 100%;
}

#page-content-wrapper {
    width: 100%;
    height: 100%;
    padding: 0px;
    /* so the inner iframe can size width relative */
    position: relative;
}

#page-content-wrapper.iframe-activated {
    overflow: hidden !important;
}

#sidebar-wrapper table a,
#sidebar-wrapper table i {
    color: #0262a1 !important;
}

#sidebar-wrapper table i {
    margin-right: 5px;
}

#sidebar-wrapper table th {
    padding-left: 7px;
    padding-right: 7px;
    font-size: 14px;
}

#sidebar-wrapper table th input {
    margin-right: 4px;
}

#sidebar-wrapper .search-report-wrapper {
    padding: 15px;
    margin: 10px;
    /* border: 1px solid #fff; */
    border-radius: 12px;
    /* padding-top: 0px;
            padding-left: 5px;
            padding-bottom: 0px; */
}

#sidebar-wrapper .top-level {
    color: #a1d3d6;
    color: #a2eef3;
}

h3.top-level {
    margin-top: 16px;
}

.panel-sheet {
    border-color: #0262a1;
}

.panel-sheet>.panel-heading {
    color: #ffffff;
    background-color: #0262a1;
    background-color: rgba(2, 98, 161, 0.6);
    border-color: #0262a1;
    display: flex;
}

.panel-sheet>.panel-heading+.panel-collapse>.panel-body {
    border-top-color: #0262a1;
}

.panel-sheet>.panel-heading .badge {
    color: #0262a1;
    background-color: #ffffff;
}

.panel-sheet>.panel-footer+.panel-collapse>.panel-body {
    border-bottom-color: #0262a1;
}

.panel-bookmark {
    border-color: #288dc6;
}

.panel-bookmark>.panel-heading {
    color: #ffffff;
    background-color: #288dc6;
    background-color: rgba(40, 141, 198, 0.6);
    border-color: #288dc6;
}

.panel-bookmark>.panel-heading+.panel-collapse>.panel-body {
    border-top-color: #288dc6;
}

.panel-bookmark>.panel-heading .badge {
    color: #288dc6;
    background-color: #ffffff;
}

.panel-bookmark>.panel-footer+.panel-collapse>.panel-body {
    border-bottom-color: #288dc6;
}

.panel-story {
    border-color: #55d0f1;
}

.panel-story>.panel-heading {
    color: #ffffff;
    background-color: #55d0f1;
    background-color: rgba(85, 208, 241, 0.6);
    border-color: #55d0f1;
}

.panel-story>.panel-heading+.panel-collapse>.panel-body {
    border-top-color: #55d0f1;
}

.panel-story>.panel-heading .badge {
    color: #55d0f1;
    background-color: #ffffff;
}

.panel-story>.panel-footer+.panel-collapse>.panel-body {
    border-bottom-color: #55d0f1;
}

mark {
    padding: 0;
    background: #f1c40f;
}

.qv-object-kpi .ellips-text {
    overflow: visible;
}

/*HUB PAGE */

/*page-content-wrapper
        */

/*changing angular ng-hide classes to display block to make sure the iframe renders */

iframe.content-iframe.ng-hide:not(.ng-hide-animate) {
    display: block !important;
    opacity: 0;
    z-index: -1 !important;
}

iframe {
    background-color: #fff;
}

#page-content-wrapper [ui-view] {
    padding-top: 67px;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}

/* #page-content-wrapper [ui-view] */

#page-content-wrapper [ui-view]>.container-fluid {
    flex: 1;
}

/*   
        Thought this was cause, but no...
        https://jira.bluehealthintelligence.com/browse/WHYZ-1677
        */

iframe.content-iframe:after {
    content: "";
    background-color: #fff;
    position: absolute;
    left: 0px;
    z-index: 7000 !important;
    width: 100%;
    height: calc(100% - 67px);
    border: none;
    border-bottom: 1px solid #005081;
    top: 66px;
}

#CurrentSelections {
    position: absolute;
    top: 66px;
    left: 0px;
    right: 0px;
}

iframe.content-iframe.is-whyzen-shows-current-selections {
    /* top:110px; */
    top: 104px;
    height: calc(100% - 104px);
}

.content-iframe {
    position: absolute;
    left: 0px;
    z-index: 100;
    width: 100%;
    /*height: calc(100% - 100px);*/
    /*height: 100%;*/
    height: calc(100% - 66px);
    border: none;
    /* border-bottom: 1px solid #005081; */
    top: 66px;
}

.content-iframe-native {
    /*height: 100%; */
    /*height: calc(100% - 200px);*/
    height: calc(100% - 67px);
}

.hub-page {
    overflow-y: scroll;
    height: 100%;
    background-color: transparent;
    padding: 20px;
}

.container-fluid {
    width: 100%;
}

i.nav-panel-icon {
    font-size: 19px;
}

.panel-title i.nav-panel-icon {
    margin-right: 8px;
}

.hub-page .measure-title {
    display: none;
}

.hub-page .qlik-kpi-panel .qv-object {
    overflow: visible;
}

.hub-page .panel-qlik.qlik-kpi-panel .panel-body,
.includes-summary-info .panel-qlik.qlik-kpi-panel .panel-body {
    background: #f5f5f5;
    color: #288dc6 !important;
    text-align: center;
    border: 1px solid #288dc6;
    border: 1px solid #d3d3d3;
    border-radius: 4px;
}

.hub-page .panel-heading,
.includes-summary-info .panel-heading {
    /* removing padding here, instead using on the title 
            since added a "ellipsis" more menu icon */
    /* padding: 8px; */
    padding: 0px !important;
    height: 3.7em;
}

.hub-page .panel-title,
.includes-summary-info .panel-title {
    font-size: 14px;
    font-weight: 400;
}

body,
.page-hider.includes-summary-info {
    background-image: url("../images/hub-bg.jpg");
    background-repeat: no-repeat;
    background-position: top center;
    background-attachment: fixed;
    background-size: cover;
}

.disclaimer-footer-row {
    order: 2000;
    color: #999999;
    background: #fff;
    font-size: 10px;
    padding: 10px;
    /* So can function as a row with cols adjacent */
    clear: both;
    width: 100%;
    margin: 0px;
}

.disclaimer-footer-row .whyzen-logo {
    /*
            Changing whyzen logos as part of 
            https://jira.bluehealthintelligence.com/browse/WHYZ-1397
            https://confluence.bluehealthintelligence.com/display/DV/Whyzen+-+Late+October+Account+Selection+Improvements
            */
    /* was once width:65 px wide  */
    width: 100px;
    margin-bottom: 10px;
}


.includes-summary-sheet,
.includes-summary-sheet iframe {
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;

    /*
      Introduced in Internet Explorer 10.
      See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/
    */
    -ms-user-select: none;
    user-select: none;
}

.includes-summary-sheet .row {
    display: none;
}

.includes-summary-sheet.toggled .iframe-container {
    width: calc(100% - 320px);
}

.includes-summary-sheet .iframe-container {

    position: absolute;
    /* - 42px - 40px - 46px */
    width: 100%;
    height: calc(100% - 65px);
    top: calc(65px);
    display: flex;
    flex-direction: column;
    /* padding-bottom: to modify size of iframe, so the "single" sheet API, dissolves nicely / as closely aligned as possible to the Whyzen detail sheet underneath */
    padding-bottom: 12px;

}

.includes-summary-sheet iframe[name="includesSummarySheet"] {
    width: 100%;
    /* the header should be there */
    border: 0px;
    flex: 1;
}

.includes-summary-sheet .iframe-part {
    width: 100%;
}

.includes-summary-sheet .iframe-part.qs-header {
    height: 42px;
    background-color: white;
}

.includes-summary-sheet .iframe-part.qvt-selections {
    /* height:40px; */
    /* min-height:38px  */
    /* min-height: 38px; */
    /*due to box-sizing:border-box; */
    min-height: 40px;
    /* background: #f2f2f2; */
    /* .bright.qv-panel-current-selections .wrap */
    background-color: #e6e6e6;
    /* border-top:1px solid  */
    border-top: 1px solid #dcdcdc;
    border-bottom: 1px solid #dcdcdc;
}

.includes-summary-sheet .iframe-part.sheet-title-container {
    background: #e7eaf0 !important;
    padding-top: 5px;
    padding-bottom: 5px;
    /* height: 36px; */
    /* gotta use 46px due to box-sizing:border-box; */
    height: 46px;

}

.includes-summary-sheet .circle__wrapper {
    /* Adjsut */
    top: 152px !important;
}

.includes-summary-info iframe,
.includes-summary-info .iframe-part {
    display: none;
}


.includes-summary-info .summary-info-kpi-row {
    /* To position KPIs as close as possible to match underlying .hub-page */
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 150px;
}

.summary-info-loading-message {
    font-size: 1.5em;
    text-align: center;
    /* Same color as the loading bubbles*/
    color: #255779;
}

span[ng-click],
li[ng-click],
h2[ng-click],
a[ng-click],
h3[ng-click],
div.panel[ng-click],
#sidebar-wrapper td[ng-click],
/* since Nate removed the [ng-click] from outer layer to allow for new sheet menu*/
.app-object-list .panel {
    cursor: pointer;
}

input[type="checkbox"] {
    cursor: pointer;
}

.object-thumb {
    height: 5vw;
    min-height: 50px;
    margin: 0px auto;
    width: auto;
    max-width: 100%;
    display: block;
}

.row.match-my-cols {
    overflow: hidden;
}

.row.match-my-cols [class*="col-"] {
    margin-bottom: -99999px;
    padding-bottom: 99999px;
}

.hub-page h2 {
    font-size: 22px;
    margin-bottom: 20px;
}

/* start alter native qlik sense table on welcome page, most of these CSS rules are copied and pasted from native qlik sense CSS sheets so that they will overide those rules properly*/

/*shorten the table row becuase theyre way too big*/

.main-welcome .qv-object.qv-object-table header {
    display: none;
}

.main-welcome .qv-st-fade-out,
.main-welcome .qv-st-fade-out-bgr-expr,
/* 
        TFS Issue 20843 
        https://jira.bluehealthintelligence.com/projects/WHYZ/issues/WHYZ-793
        */
.main-welcome td.qv-st-data-cell .qv-st-value {
    max-height: 1.69230769em !important;
}

/*
        https://jira.bluehealthintelligence.com/projects/WHYZ/issues/WHYZ-797
        Fix their size, we don't want Qlik's presumptuous responsiveness trying to change this size:;
        */

.qv-media-tool-html [size="5"] {
    font-size: 2em !important;
}

.qv-media-tool-html [size="4"] {
    font-size: 1.5em !important;
}

/* Hide empty spacers, if you want space at the bottom of the KPI just change the font-size above 
        These <br> probably represent extra carriage returns that were left in the Qlik KPI objects ; in the Qlik app itself
        */

.qv-object-text-image .qv-media-tool-html br {
    display: none;
}

/*
        https://jira.bluehealthintelligence.com/projects/WHYZ/issues/WHYZ-797
        We'll try to make sure the content always fits in the window 
        */

.qv-object-text-image .qv-media-tool-html {
    overflow: hidden;
}

/* fix the table's scroll bar */

.main-welcome .scrollbar-track {
    background: #fff !important;
    opacity: 1 !important;
    padding-right: 10px !important;
    /* missing vendor prefixes for border radius */
    border-radius: 0;
    position: absolute;
    right: 0px;
    z-index: 9999;
}

.main-welcome .qv-st.align-column-picker {
    width: auto !important;
}

.main-welcome .qv-st table {
    table-layout: auto !important;
    /* width: 100%; */
}

.main-welcome .qv-st table td:nth-child(1) {
    width: 100%;
    min-width: 100%;
    max-width: 100%;
}

.main-welcome .qv-st table td:not(:nth-child(1)) {
    opacity: 0;
    width: 0px;
    max-width: 0px;
    min-width: 0px;
}

.main-welcome .panel table th:not(:nth-child(1)) .qv-st-header-cell-wrapper {
    display: none;
}

.main-welcome .qv-st-header table th {
    width: 0px;
    max-width: 0px;
    min-width: 0px;
    pointer-events: none;
}

.main-welcome .qv-st-header table th:nth-child(1) {
    width: 85%;
    min-width: 85%;
    max-width: 85%;
    pointer-events: auto;
}

/* postprod  change 1-23-2017 */

.main-welcome .qv-st-header table th:nth-child(2) {
    position: absolute;
    width: 5%;
    max-width: 5%;
    min-width: 5%;
    left: 182px;
    pointer-events: auto;
    cursor: pointer !important;
}


.bhi-current-acct {
    display: inline-block;
    font-weight: bold;
    text-transform: uppercase;
    font-weight: normal;
    /* 
            font-family: 'Gruppo';
            https://confluence.bluehealthintelligence.com/display/DV/20181115+Nate+Whyzen?preview=/21561790/21561792/image2018-11-15_11-12-56.png
            */
    /* font-family: 'Open sans', sans-serif;     */
    font-size: 14px;
    max-width: 238px;
    text-overflow: ellipsis;
    overflow: hidden;
    max-height: 30px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

/* end postprod  change 1-23-2017 */

.bhi-current-acct:hover {
    text-decoration: underline;
}

header a:hover {
    text-decoration: underline;
}

.main-welcome th.qv-st-header-cell:nth-child(2):after {
    content: "";
    background: #fff;
    width: 35px;
    height: 35px;
    position: absolute;
    right: -21px;
    top: 0px;
    /*	pointer-events: none;
        */
}

.main-welcome .column-width-adjust-column {
    display: none !important;
}

.main-welcome .qv-st-column-picker {
    display: none !important;
}

/* end alter native qlik sense table on welcome page */

.column-width-adjust-line {
    pointer-events: none;
}

/*
        .main-welcome .row:nth-child(1) {
        height: 20%;
        }
        */

.main-welcome tr.qv-grid-object-data-first-row.qv-grid-object-data-last-row,
tr.qv-st-data-row:only-child {
    background-color: #8cc63f;
}

.main-welcome .qv-st-data-cell.qv-st-data-cell-selected-highlighted {
    background-color: #8cc63f;
}

.main-welcome {
    height: 100%;
}

.main-welcome .panel-default {
    /*background: #7dc7d9;*/
    background: #255779;
    border: none;
    color: #fff;
}

.main-welcome .panel-default table,
.main-welcome table {
    color: #595959;
}

.main-welcome .panel-default button:not([disabled]):hover {
    opacity: 0.9;
}

/* styles for '...' fake ellipsis overflow fix */

.hub-page .panel-heading h3,
.two-line-limit {
    /* hide text if it is more than N lines  */
    overflow: hidden;
    /* for set '...' in absolute position */
    position: relative;
    /* use this value to count block height */
    line-height: 1.3em;
    /* max-height = line-height (1.2) * lines max number (3) */
    max-height: 2.6em;
    min-height: 100%;
    padding: 8px;
    /* fix problem when last visible word doesn't adjoin right side  */
    /* text-align: justify; */
    /* place for '...' */
    /* Only if */
    /* padding-right: 1em; */
    max-width: 100%;
    background-color: transparent;
    /* always flex */
    flex: 1;
}

.app-object-list.is-show-app-object-more-menu .my-work .panel-sheet .panel-heading h3,
.app-object-list.is-show-app-object-more-menu .my-work .panel-sheet .two-line-limit {
    padding-right: 0px;
}

/* hide ... if we have text, which is less than or equal to max lines */

.hub-page .panel-heading h3:after,
.two-line-limit:after {
    /* points in the end */
    /* No ellipsis... ! Use text-overflow:ellipsis in CSS! */
    /* content: '...'; */
    background: rgba(2, 98, 161, 1);
    /* absolute position */
    position: absolute;
    /* set position to right bottom corner of text */
    right: -3px;
    bottom: 4px;
    color: rgba(2, 98, 161, 1);
    /* set width and height */
    width: 1em;
    height: 1em;
    margin-top: 0.2em;
    /* bg color = bg color under block */
    background: transparent;
}

.hub-page .panel-bookmark .panel-heading h3:after {
    color: #288dc6;
    color: rgba(40, 141, 198, 1);
}

.hub-page .panel-sheet .panel-heading h3:after {
    color: #0262a1;
    color: rgba(2, 98, 161, 1);
}

.hub-page .panel-story .panel-heading h3:after {
    color: #55d0f1;
    color: rgba(85, 208, 241, 1);
}

.hub-page .panel-heading h3:before,
.two-line-limit:before {
    /* content: '...'; */
    position: absolute;
    right: 0;
    bottom: 0;
    background-color: inherit;
}

/*.hub-page .panel-heading h3:after, .two-line-limit:after {
        content: '';
        position: absolute;
        right: 0;
        width: 1em;
        height: 1em;
        margin-top: 0.2em;
        background: inherit;
        }
        */

/*animation ngAnimate*/

.sample-show-hide {
    transition: all linear 0.5s;
}

/* BHI run 2 styles */

.panel-default.no-border,
.no-border {
    border-color: transparent;
    -webkit-box-shadow: 0px 0px 7px 0px rgba(191, 191, 191, 1);
    -moz-box-shadow: 0px 0px 7px 0px rgba(191, 191, 191, 1);
    box-shadow: 0px 0px 7px 0px rgba(191, 191, 191, 1);
}

/*End BHI run 2 styles */

h1 {
    font-size: 28px;
    padding-left: 20px;
}

.bhi-wrapper,
.product-main {
    height: 100%;
}

.bhi-user-id {
    max-width: 176px;
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1;
}

/* BHI Nav bar Colors include Dark Blue #0064A2 and Light Blue #2f92d0 */

.hide-qlik-header .qv-object .qv-inner-object {
    overflow: visible;
}

.dark-button {
    color: #ffffff;
    background-color: #193b54;
    border-color: #fdfdfd;
    padding: 11px 12px 11px 12px;
    border-radius: 5px;
    max-width: 225px;
    white-space: normal;
    line-height: 14px;
    font-size: 12px;
}

.navbar {
    position: relative;
    min-height: 65px;
    margin-bottom: 0px;
}

.navbar-default .navbar-nav>.active>a {
    color: #0064A2;
    background-color: transparent;
    /*border-bottom: 5px solid #0064A2;*/
}

.navbar-default .navbar-nav>.active>a:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 8px;
    background: #0064A2;
    left: 0px;
    bottom: -6px;
    z-index: 1000;
}

.navbar-default .navbar-nav>li>a:hover,
.navbar-default .navbar-nav>li>a:focus {
    color: #0064A2;
    background-color: transparent;
    /*border-bottom: 5px solid #0064A2;*/
}

.navbar-default .navbar-nav>.active>a,
.navbar-default .navbar-nav>.active>a:hover {
    color: #0064A2;
    background-color: transparent;
}

.navbar-brand,
.navbar-nav,
.navbar-nav>li,
.navbar-nav>li a {
    height: 65px
        /* change rule iframe[name="includesSummarySheet"] */
    ;
}

.navbar-default .navbar-nav>li>a {
    color: #2f92d0;
    font-weight: 500;
    font-size: 18px;
    padding-top: 22px;
}

.navbar-default .navbar-nav>li.nav-logout>a {
    font-size: 12px;
    padding-top: 41px;
    padding-left: 10px;
    padding-right: 35px;
}

.navbar-default {
    background-color: #fff;
    border-color: transparent;
    border-width: 0;
    background: rgb(255, 255, 255);
    /* background: -moz-linear-gradient(left, rgba(255, 255, 255, 1) 255px, rgba(219, 219, 219, 1) 100%);
            background: -webkit-linear-gradient(left, rgba(255, 255, 255, 1) 255px, rgba(219, 219, 219, 1) 100%);
            background: linear-gradient(to right, rgba(255, 255, 255, 1) 255px, rgba(219, 219, 219, 1) 100%);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dbdbdb', GradientType=1); */
    -moz-box-shadow: -1px 6px 5px -7px rgba(158, 158, 158, 1);
    -webkit-box-shadow: 0px 5px 20px -10px rgba(0, 0, 0, 1);
    -moz-box-shadow: 0px 5px 20px -10px rgba(0, 0, 0, 1);
    box-shadow: 0px 5px 20px -10px rgba(0, 0, 0, 0.2);
}

.navbar-default .container-fluid {
    padding-left: 20px;
}

.main-welcome .navbar-default {
    background: #fff;
}

.navbar-default .navbar-nav>.open>a,
.navbar-default .navbar-nav>.open>a:hover,
.navbar-default .navbar-nav>.open>a:focus {
    color: #fff;
    background-color: #2f92d0;
}

.nav .has-nav-button {
    padding: 8px;
    padding-top: 12px;
}

.nav .has-nav-button .btn {
    font-size: 18px;
}

.in-nav-btn-icn {
    margin-left: 21px;
}

/* END BHI Nav bar Colors include Dark Blue #0064A2 and Light Blue #2f92d0 */

.nav button {
    display: none;
}

.navbar-default .navbar-nav>.active>a:focus {
    color: #0064A2;
    background-color: #fff;
}

.gosense {
    position: absolute;
    left: 0px;
    top: 65px;
    background-color: #fff;
    width: 100%;
    height: 100%;
    z-index: 9999;
    display: none;
}

.bhi-kpi-title {
    clear: both;
    margin: 0px 0px 0px 18px;
    position: relative;
    top: -10px;
    color: rgb(68, 119, 170);
    font-weight: normal;
    font-size: 15px;
}

.qlik-filter-panel div.panel-body {
    border: 2px solid #2f92d0;
    /*-webkit-border-radius: 3px;
            -moz-border-radius: 3px;
            border-radius: 3px;*/
}

.panel {
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}

.panel-body {
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}

/* Add custom shadow to the panel body for the qlik panel types that do not have a heading */

.panel-qlik.qlik-filter-panel .panel,
.panel-qlik.qlik-kpi-panel .panel {
    -webkit-box-shadow: 0px 0px 15px 5px rgba(221, 221, 221, 0.4);
    -moz-box-shadow: 0px 0px 15px 5px rgba(221, 221, 221, 0.4);
    box-shadow: 0px 0px 15px 5px rgba(221, 221, 221, 0.4);
}

.navbar-collapse {
    height: 100%;
}

/* Start custom filter-pane, these styles alter the native qlik sense object filter-pane  */

.qv-collapsed-listbox .title {
    height: 32px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    color: #255779;
}

.qv-collapsed-listbox .icon-triangle-right {
    position: absolute;
    top: 50%;
    right: 4px;
    margin-top: -17px;
    font-size: 24px;
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    color: #255779;
}

.qui-immidiateContextual .content {
    background: #ffffff;
    border-left: 2px solid #255779;
    border-right: 2px solid #255779;
    box-shadow: 0 4px 8px -1px #787878;
    border-top: 10px solid #255779;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    border-bottom: 10px solid #255779;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    display: block;
    box-sizing: border-box;
}

th.qv-st-header-cell.ng-scope.qv-st-header-cell-search:after {
    content: "";
    /* color: white; */
    position: absolute;
    width: 30px;
    background: #fff;
    height: 3000px;
    left: calc(100% - 27px);
    z-index: 9999;
}

/* We are serving arrow from the Qlik Sense server's content library below */

/*
        .qv-listbox-popover.qui-immidiateContextual .immidiate-contextual-arrow {
        background-image: url(//bhinqs01vwd.bluehealthintelligence.com/content/mashup-content/arrow.gif);
        }
        */

.qv-collapsed-listbox:hover {
    border: 2px solid #fff;
}

.qv-collapsed-listbox {
    border: 2px solid #fff;
}

/* End custom filter-pane, these styles alter the native qlik sense object filter-pane */

/* .main-content area */

.main-content-area {
    margin: 0px 0px;
    background: #d3dfe6;
}

.main-content-area.resources {
    background: transparent;
}

.main-content-area.filters-open {
    margin-right: 308px;
}

.filter-right-sidebar.closed {
    margin-right: -300px;
}

.main-about,
.main-docs,
.main-contact {
    height: 100%;
    background-color: #ffffff;
    background-image: url("../images/hub-bg.jpg");
    background-repeat: no-repeat;
    background-position: top center;
    background-attachment: fixed;
    background-size: 100% auto;
}

.main-contact ul.contact-list {
    list-style: none;
}

.main-contact .panel.info-list .panel-body ul li {
    list-style: none;
}

.main-contact ul.contact-list li {
    border-bottom: 1px solid #ddd;
}

.main-contact .contact-list .fa {
    font-size: 24px;
}

.spacer-row-200 {
    min-height: 200px;
}

.spacer-row-100 {
    min-height: 100px;
}

.spacer-row-50 {
    min-height: 30px;
}

.main-docs {
    padding-top: 2em;
}

.main-docs ol,
.main-docs ul {
    list-style: none;
}

.main-docs li {
    /* Overriding whatever */
    padding: 2px !important;
}

/* Adjust bootstrap panels for qlik filter pane objects */

.panel-qlik.qlik-filter-panel.panel,
.panel-qlik.qlik-kpi-panel.panel {
    background: transparent;
    border: none;
}

.panel-qlik.qlik-filter-panel .panel-body {
    background: #fff;
    height: 35px;
    padding: 0px;
}

/* Adjust bootstrap panels for qlik kpi objects */

/*.qlik-kpi-panel.panel {
        background: transparent;
        }*/

.panel-qlik.qlik-kpi-panel .panel-body {
    background: #fff;
    height: 150px;
    padding: 0px;
}

.panel-qlik.qlik-kpi-panel .panel-body .qvobject {
    width: 60%;
    height: 100px;
    color: #255779 !important;
    margin-right: 0px;
    font-size: 16px !important;
    margin-left: 20%;
    margin-top: 10px;
}

.qlik-kpi-panel .measure-wrapper {
    display: none;
}

.panel-qlik.qlik-kpi-panel .panel-body .kpi-icon,
.kpi-icon {
    width: 40%;
    background-color: #ffffff;
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: scroll;
    background-size: 100px 100px;
    height: 120px;
    padding-top: 10px;
}

.kpi {
    justify-content: flex-start;
}

.kpi .ellips-text {
    overflow: visible;
}

.kpi>div.value-wrapper>div:nth-of-type(1) {
    overflow: visible;
    margin-bottom: 10px;
}

.kpi>div.value-wrapper {
    margin: 10px;
}

.kpi-row>div .qvobject .value-wrapper.center>div:nth-child(1)>div>div.kpi-value>div.ellips-text>span {
    font-size: 38px;
}

.kpi-row>div .qvobject .value-wrapper.center>.secondary-wrapper .kpi-value span {
    font-size: 19px;
}

.kpi-row>div:nth-of-type(1) .qvobject .value-wrapper {
    flex-direction: column;
    align-items: flex-end;
    padding-right: 10px;
}

.kpi-row>div:nth-of-type(1) .qvobject .value-wrapper .secondary-wrapper .kpi-value {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.kpi-row>div:nth-of-type(1) .qvobject .value-wrapper .secondary-wrapper .glyph-wrapper {
    display: none;
}

.kpi-row>div:nth-of-type(2) .qvobject .value-wrapper {
    flex-direction: column;
    align-items: flex-end;
    padding-right: 10px;
}

.kpi-row>div:nth-of-type(2) .qvobject .value-wrapper .secondary-wrapper .kpi-value {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.kpi-row>div:nth-of-type(2) .qvobject .value-wrapper .secondary-wrapper .glyph-wrapper {
    display: none;
}

.kpi-row>div:nth-of-type(3) .qvobject .value-wrapper {
    flex-direction: column;
    align-items: flex-end;
    padding-right: 10px;
}

.kpi-row>div:nth-of-type(3) .qvobject .value-wrapper .secondary-wrapper .kpi-value {
    flex-direction: column;
    align-items: flex-end;
}

.kpi-row>div:nth-of-type(3) .qvobject .value-wrapper .secondary-wrapper .glyph-wrapper {
    display: none;
}

.kpi-row>div:nth-of-type(4) .qvobject .value-wrapper {
    flex-direction: column;
    align-items: flex-end;
    padding-right: 10px;
}

.kpi-row>div:nth-of-type(4) .qvobject .value-wrapper .secondary-wrapper .kpi-value {
    flex-direction: column;
    align-items: flex-end;
}

.kpi-row>div:nth-of-type(4) .qvobject .value-wrapper .secondary-wrapper .glyph-wrapper {
    display: none;
}

.kpi-value {
    max-height: 40px;
}

#QV05 .kpi-value {
    max-height: 60px;
}

.kpi-1 {
    background-image: url("../images/kpi-darkblue.jpg");
}

.kpi-2 {
    background-image: url("../images/kpi-orange.jpg");
}

.kpi-3 {
    background-image: url("../images/kpi-green.jpg");
}

.kpi-4 {
    background-image: url("../images/kpi-lightblue.jpg");
}

.panel-default .panel-heading {
    background: #fff;
    border-bottom: 0;
    font-size: 20px;
    font-weight: 500;
    border-bottom: 1px solid #ddd;
    /*border: 2px solid #ddd;
            */
}

.panel-default {
    border: 2px solid #ddd;
}

.panel-default.qlik-filter-panel {
    border: 0px solid #ddd;
}

/*.panel-qlik .panel-heading {
        background: #fff;
        border-bottom: 0;
        font-size: 20px;
        font-weight: 500;
        }
        */

.panel-qlik .fa-qlik {
    color: #999;
    font-size: 26px;
    float: right;
    margin-left: 27px;
}

/*
        .fa-qlik.fa-expand {
        position:relative;
        width:0px;
        top:-10px;
        
        }
        */

.fa-qlik:hover {
    cursor: pointer;
    color: #0064A2;
}

.fa-qlik.fa-expand {
    cursor: zoom-in;
}

.kpi.link {
    cursor: pointer;
    box-sizing: border-box;
}

.touch-off .kpi.link:hover {
    border: none;
    border-radius: 6px;
}

.touch-off .kpi.link:active {
    border: none;
}

/* Tabs */

.nav-tabs>li>a {
    border: none;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    opacity: 0.85;
    /*text-transform: uppercase;*/
    color: #535858;
    padding: 6px 10px;
    font-size: 15px;
}

.nav-tabs>li>a:hover {
    border-color: transparent;
}

.nav-tabs>li.active>a,
.nav-tabs>li.active>a:hover,
.nav-tabs>li.active>a:focus {
    border: none;
    border-bottom: 2px solid #009be0;
    color: #009be0;
    opacity: 1;
}

/* Other Classes */

.qvobject {
    width: 100%;
    /*	height: 200px;
            */
    height: 100%;
}

.panel-qlik .panel-body {
    height: 270px;
}

.table-panel-body {
    height: 400px;
}

.panel-title {
    font-size: 16px;
    font-weight: 400;
}

.filter-panel-group .panel-body {
    padding: 0px;
}

.qvobject header,
.filter-panel-group .qv-object-header {
    /* hide qlik sense list object (filter) headers */
    display: none;
}

.fa-filter {
    margin: 0px 20px 0px 13px;
    font-weight: 100;
    color: #009be1;
    cursor: pointer;
}

.panel-group {
    margin-top: 40px;
}

.q-listobject-wrap {
    height: 200px;
}

/*Information list in panel */

.panel.info-list .panel-body {
    padding: 20px;
    font-size: 18px;
}

.panel.info-list .panel-body li {
    padding-top: 10px;
    padding-bottom: 10px;
}

.panel.info-list .panel-body ul li {
    list-style: disc inside;
}

.panel.info-list .panel-body ul ul li {
    list-style: circle inside;
    padding-left: 40px;
}

/* Start: Altering the native Qlik Sense Current Selection bar 
        #CurrentSelections {
    
            border-top: 8px solid #fff;
            border-bottom: 4px solid #fff;
            -webkit-box-shadow: 0px 8px 15px 5px rgba(221, 221, 221, 0.333);
            -moz-box-shadow: 0px 8px 15px 5px rgba(221, 221, 221, 0.333);
            box-shadow: 0px 8px 15px 5px rgba(221, 221, 221, 0.333);
        }
        */

/*
        .qv-panel-current-selections {
            background: #fff;
        }
    
        .qv-panel-current-selections .buttons .qv-subtoolbar-button, .qv-panel-current-selections .buttons-end .qv-subtoolbar-button {
            background: #fff;
        }
    
        .qv-panel-current-selections .buttons, .qv-panel-current-selections .buttons-end {
            background: #fff;
        }
    
        .qv-panel-current-selections .wrap, .qv-panel-current-selections .buttons .qv-subtoolbar-button {
            position: relative;
            overflow: hidden;
            overflow-y: hidden !important;
            border-bottom-color: #fff;
        }
    
        .qv-panel-current-selections .name {
            margin-top: 1px;
            font-weight: bold;
            height: auto;
            line-height: auto;
            width: 270px;
        }
    
        .qv-panel-current-selections .remove, .qv-panel-current-selections .unlock, .qv-panel-current-selections .lock, .qv-panel-current-selections .item {
            color: #0064A2 !important;
        }
    
        .qv-panel-current-selections .buttons .qv-subtoolbar-button, .qv-panel-current-selections .buttons-end .qv-subtoolbar-button {
            color: #2f92d0;
        }
    
        .qv-panel-current-selections .buttons .qv-subtoolbar-button:disabled, .qv-panel-current-selections .buttons-end .qv-subtoolbar-button:disabled {
            cursor: default;
            color: #d3dfe6;
        }
    
        .qv-panel-current-selections .buttons-end .qv-subtoolbar-button:hover:enabled {
            background: #2f92d0;
            color: #ffffff;
        }
    
        .qv-panel-current-selections .buttons .qv-subtoolbar-button:hover:enabled, .qv-panel-current-selections .buttons-end .qv-subtoolbar-button:hover:enabled {
            background: #2f92d0;
            color: #ffffff;
        }
    
        .touch-off .qv-panel-current-selections .item:hover {
            background: #2f92d0;
            color: #ffffff;
        }
    
        .qv-panel-current-selections .no-selection {
            color: #959595;
        }
    
        .qv-panel-current-selections .buttons-end {
            border-left: 0px solid #fff;
            box-shadow: none;
        }
    
        .qv-panel-current-selections .buttons-end .qv-subtoolbar-button {
            border-bottom: 0px solid #fff;
        }
        */

button {
    cursor: pointer;
}

.buttons-end button.qv-subtoolbar-button:not(.global-search-button) {
    display: none;
}

.global-search-button {
    border-bottom: 0px solid #fff;
}

/*  NATE REMOVED THESE, dont think they are helpful
        .qv-global-search {
            top: auto;
        }
    
        .qv-search-input {
            height: 55px
        }
    
        .qv-global-search {
            background-color: #0064A2;
        }
    
        .qv-global-search .qv-global-search-input {
            background: #0064A2;
        }
    
        .qv-search-input .search-field-area .search-field {
            width: 95%;
            border: 2px solid #d1d1d1;
        }
    
        .qv-search-input {
            position: relative;
            height: 128px;
            border-bottom: 0px solid #e6e6e6;
        } */

#userid,
#pwd {
    border: 2px solid #2f92d0;
}

#login {
    width: 100%;
}

.qv-selection-toolbar {
    z-index: 9999;
    -ms-border-radius: 0;
    border-radius: 0;
}

/* Fix for miss-placed selection toolbar seen above charts while making a selection */

.sel-toolbar-card {
    margin-top: 49px;
    margin-left: 22px;
}

/* Fix for miss-placed icons in side selection toolbar seen above charts while making a selection */

.sel-toolbar-span-icon {
    top: -3px;
}

.qv-object.qv-selections-active {
    -ms-border-radius: 0;
    border-radius: 0;
}

.qvt-chart-tooltip table {
    color: #ffffff;
}

.indicator {
    font-size: 20px;
    margin-top: -2px;
}

.qv-object {
    border: 0;
}

.scroll-locked {
    border: 1px solid #009be1;
}

.panel-body {
    padding: 5px;
}

.col-no-pad {
    padding-left: 0px;
    padding-right: 0px;
}

.whyzen-logo-welcome {
    /*
            Changing whyzen logos as part of 
            https://jira.bluehealthintelligence.com/browse/WHYZ-1397
            https://confluence.bluehealthintelligence.com/display/DV/Whyzen+-+Late+October+Account+Selection+Improvements
            */
    /* was once width:100px  */
    width: 120px;
    position: relative;
    top: 4px;
    right: 100px;
    z-index: 999;
    float: right;
}

.login-page label {
    font-weight: normal;
    color: #595959;
}

.login-page .panel-body button {
    margin-bottom: 25px;
}

.login-page .panel-body a {
    color: #005081;
    text-decoration: underline;
}

.navbar-brand {
    overflow: hidden;
}

.no-left-padding {
    padding-left: 0px;
}

.main-welcome .qv-selection-toolbar.qvt-selection-toolbar.ng-scope.sel-toolbar-card {
    display: none;
}

.sub-account-filter-at-top .qv-object .cancel-overlay {
    height: 114%;
}

.hub-page .check-box-wrap {
    width: 100%;
    border-radius: 4px;
    padding: 3px 6px 3px 6px;
    font-size: 13px;
    border: 1px solid;
    background: transparent;
    border-color: #b3b3b3;
    margin-right: 10px;
    color: #288dc6;
    color: #595959;
}

.hub-home-check-wrap {
    text-align: right;
}

/* hamburger buttons 
        Nate: not using .menu-toggle class because that's what determins the click listener
        Removing .menu-toggle to prevent listening*/

#menu-toggle,
#menu-toggle-2 {
    cursor: pointer;
    font-size: 32px !important;
    color: #8cc63f;
}

#menu-toggle {
    margin: 22px;
    margin-left: 15px;
}

#menu-toggle-2 {
    margin-left: -31px;
    float: left;
    margin-top: 7px;
    margin-right: 25px;
}

.sidebar-progress-bar {
    /* #sidebar-wrapper .whyzen-progress-bar { */
    position: absolute;
    top: 0;
    left: 0px;
    /* to get higher than the #sidebar-wrapper itself */
    z-index: 1001;

}


.whyzen-progress-bar.sidebar-progress-bar {
    /* size as sidebar!*/
    /* overriding the  .whyzen-progress-bar */
    width: 320px !important;
    /* fixed position so that it will always be visible at the top, despite scroll state of the #sidebar-wrapper */
    position: fixed !important;
}

#sidebar-wrapper {
    /* #sidebar-wrapper { Ctrl+F */
    min-width: 320px;
}

#bhi-wrapper {
    padding-left: 0px;
}

#bhi-wrapper.toggled,
.page-hider.load-indicate.includes-summary-sheet.toggled {
    padding-left: 320px;
}

#bhi-wrapper.toggled #sidebar-wrapper {
    margin-left: 0px;
}

#sidebar-wrapper {
    margin-left: -320px;
}

/*
        dynamic-period-text
        */

.dynamic-period-text .qv-object-text-image .qv-media-tool-html {
    font-size: 18px;
    text-align: right;
}

/* user info and logout link placement */

.user-info {
    right: 18px;
    position: fixed;
    line-height: 1;
    margin-top: 12px;
    top: 5px;
}


/* Sidebar Styles */

.sidebar-nav li li {
    font-size: 16px;
}


.sidebar-nav li a {
    /* This gives it the "Title Case" even if the text is not title case */
    text-transform: capitalize;
    display: block;
    text-decoration: none;
    color: #ffffff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 200;
    /* */
    display: flex;
}


.sidebar-nav li a>span {
    flex: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.sidebar-nav li ul {
    background: #6a6969;
}

.sidebar-nav li a {
    text-transform: capitalize;
    /* padding-left: 12px; */
    padding-left: 20px;
}

.sidebar-nav,
.sidebar-nav ul,
.sidebar-nav ol {
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
}

.sidebar-nav li {
    color: white;
}


.sidebar-nav li a:hover {
    background: rgba(255, 255, 255, 0.2);
}

.sidebar-nav li a:active,
.sidebar-nav li a:focus,
.sidebar-nav li a:hover {
    text-decoration: none;
}

ul ul.sidebar-nav li a {
    color: #fff;
    padding-left: 24px;
    display: flex;
    align-items: center;
    user-select: none;
}

ul.sidebar-nav li a,
ul.sidebar-nav li a .fa {
    line-height: 40px;
}

ul.sidebar-nav li.ext-heading {
    line-height: 40px;
    margin-left: 10px;
    color: inherit !important;
}

li.sorted-groups:not([data-folder="NO_FOLDER"]) li.ext-heading {
    padding-left: 8px;
}

ul [data-folder] ul.sidebar-nav li a,
.is_include_navigation_base_sheet_subcategory_and_order ul [data-subcategory] ul.sidebar-nav li a {
    padding-left: 36px;
}



/* ul [data-folder] ul.sidebar-nav li.is-in-sub-category a[alt] { */
/* Ctrl+F is-sub-category */
/* user-select-none */
ul [data-folder] ul.sidebar-nav li.is-in-sub-category a:not(.sub-category-header),
.is_include_navigation_base_sheet_subcategory_and_order ul [data-folder] ul.sidebar-nav li.is-in-sub-category a:not(.sub-category-header) {
    /* indent even further! */
    padding-left: 54px;
    /* 
    !important;
    */
}

ul [data-folder="NO_FOLDER"] li a,
ul [data-folder="everything_from_community_nav"] li a,
.is_include_navigation_base_sheet_subcategory_and_order ul [data-subcategory="NO_SUBCATEGORY"] li a {
    padding-left: 24px !important;
}

.sidebar-nav [data-folder="NO_FOLDER"],
.sidebar-nav [data-folder="everything_from_community_nav"],
/* // https://jira.bluehealthintelligence.com/browse/WYSD-1388
// UI - Left Navigation with sheets and their categories (and subcategories / sub-category) */
.is_include_navigation_base_sheet_subcategory_and_order .sidebar-nav [data-subcategory="NO_SUBCATEGORY"] {
    border-top: 2px solid #3f3f3f;
}

.sidebar-nav>.sidebar-brand {
    height: 65px;
    font-size: 18px;
    line-height: 60px;
}

.sidebar-nav>.sidebar-brand a {
    color: #999999;
}

.sidebar-nav>.sidebar-brand a:hover {
    color: #fff;
    background: none;
}

/* https://jira.bluehealthintelligence.com/browse/WHYZ-856 */

.selections-button,
.selections-button:hover {
    width: 24px;
    height: 24px;
    margin-right: 15px;
    /* its parent must have position:relative */
    position: absolute;
    top: 0;
    right: 15px;
    /* Overrides the 
            .navbar button.download-selections, .navbar button, .navbar input
            */
    /* padding: 5px; The icon will be full-size */
    padding: 0px;
    border-width: 0px;
    /* Overrides the above rule, as well as:
            bootstrap.css  .btn-warning which gives an orange background...
            */
    background-color: transparent;
    color: #193b54;
}

.selections-button.selections-warning {
    /* right:60px; */

    right: 54px;
    color: #ff9b00;
    background: black;

    border-radius: 30px;
    /* font-size: 10px; */
    color: white;
    background-color: #ff7f00;
    width: 24px;
    height: 24px;
}

.selections-button.selections-warning .fa {
    font-size: 16px;
}

.selections-button[disabled],
.selections-button:hover[disabled] {
    opacity: 0.25;
}

.selections-button .label {
    /* We only want to see the .fa child , we dont need to see text */
    display: none;
}

.selections-button .fa {
    font-size: 24px;
}

/* This appears inside the whyzen-navigation drawer  at smaller sizes */

#menu-toggle {
    display: none;
}

.main-welcome .disclaimer-footer-row {
    background-color: transparent;
    margin-top: 100px;
}

.fixed {
    position: fixed;
}

header.row.fixed {
    width: 100%;
    background: #fff;
    z-index: 999;
}

.hide-qlik-header .qv-object header {
    display: none;
}

/*
        @media(min-width:768px) {
    
    
        }
    
    
        */

#sidebar-wrapper .search-report-wrapper h3.top-level {
    /* font-size: 17px; */
    /* margin: 0px 0px 10px 0px; */
    margin: 0px;
    padding-bottom: 10px;
    /* letter-spacing: 0px; */
    /* text-transform: none; */
}

#sidebar-wrapper .search-report-wrapper {
    /* margin: 32px 10px 16px; */
    margin: 0px;
    position: relative;
}

/* See whyzen_environment_config.whyzen.is_hide_selected_account_name_text */
#sidebar-wrapper .account-select.ng-hide+.search-report-wrapper {
    margin: 0px 10px !important;
}

input[name="dtsearch"] {
    border-radius: 0px !important;
    width: 100%;
    font-size: 19px;
    border-radius: 8px;
}

.advanced-search-icon {
    display: none;
    color: #a2eef3;
    position: absolute;
    right: 10px;
    cursor: pointer;
    /* For inside */
    padding: 4px 10px;
    color: black;
    right: 18px;
    line-height: 24px;
    font-weight: bolder;
    opacity: 0.5;
    /* For correct bototm-alignment */
    bottom: 14px;
}

.advanced-search-icon:hover {
    opacity: 1;
}

.search-report-wrapper.is-advanced-search-enabled input[name="dtsearch"] {
    width: calc(100% - 20px);
    /* For inside */
    /*    width: 100%;*/
    /*
            calc(100% - 20px);
            */
}

.search-report-wrapper.is-advanced-search-enabled .advanced-search-icon {
    display: block;
}

#sidebar-wrapper .top-level.selected-account {
    color: #fff;
    /* text-transform: uppercase; */
    font-size: 27px;
    height: auto !important;
    font-size: 22px;
    /* consistent with   #sidebar-wrapper .top-level , letter-spacing */
    /* Nah let's keep it narrower, letter-spacing :0px; so it remains more compact */
    /* letter-spacing: 3px; */
    /* font-family: 'Gruppo';
        font-family: 'Open sans', sans-serif;   
        https://confluence.bluehealthintelligence.com/display/DV/20181115+Nate+Whyzen?preview=/21561790/21561792/image2018-11-15_11-12-56.png
        */
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: 0px;
}

#sidebar-wrapper .top-level.selected-account .hub-home-account {
    color: #fff;
}

table.datatables-table.dataTable thead {
    /* border-bottom-color: aliceblue; */
    border-bottom: none !important;
}

#sidebar-wrapper table th {
    border-bottom: 1px solid #dddddd;
    background: #ffffff;
    /* color: white; */
}

#sidebar-wrapper .top-level {
    font-size: 19px;
    letter-spacing: 3px;
    text-transform: uppercase;
}

table.dataTable.no-footer {
    border-bottom: 1px solid #dddddd !important;
}

#sidebar-wrapper h3.top-level.account-select {
    padding-left: 15px;
    text-transform: none;
    text-decoration: underline;
    letter-spacing: 0px;
    /* text-align: right; */
    margin: 0px 0px 0px 0px;
}

/* SWITCHERY CSS */

/* The switch - the box around the slider */

.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
}

/* Hide default HTML checkbox */

.switch input {
    display: none;
}

/* The slider */

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

.slider:before {
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

input[disabled]+.slider {
    opacity: 0.5;
}

input:checked+.slider {
    background-color: #2196F3;
}

input:focus+.slider {
    box-shadow: 0 0 1px #2196F3;
}

input:checked+.slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}

/* Rounded sliders */

.slider.round {
    border-radius: 34px;
}

.slider.round:before {
    border-radius: 50%;
}

/* END SWITCHERY CSS */

/* Nate;  The sync  button */

.btn.sync {
    /* Turned it into a button so that qlik-sstyles would color it the dark-green-grey  */
    /* color: #193b54; */
    background-color: #f9f9f9;
    border-color: #ababab;
    font-size: 14px;
    padding: 1em;
    float: right;
    /* Positioned same distance from `top` , and with enough clearance on the `right` so it doesn't hit the "select-box" (containing Sheet Selections, Session Selections, etc)
            */
    position: fixed;
    top: 12px;
    right: 600px;
    /* Q - the size of the Sync Mgr button is slightly taller than the selections button - I thought they were the same at one point.  Any chance we can get that Sync Mgr button same height?*/
    line-height: 22px;
    font-size: 13px;
    font-weight: bolder;
    padding: 10px;
}

.btn.portfolio {
    background-color: #f9f9f9;
    border-color: #ababab;
    font-size: 14px;
    padding: 1em;
    line-height: 22px;
    font-size: 13px;
    font-weight: bolder;
    padding: 10px;
    margin-top: 12px;
    margin-left: 3px;
}

.section-header {
    line-height: 22px;
}

/* Nate; the animation  for the Whyzen "3 dots" loading screen*/

@-webkit-keyframes growUp {
    0% {
        -webkit-transform: scale(1);
    }

    50% {
        -webkit-transform: scale(0.5);
    }

    100% {
        -webkit-transform: scale(1);
    }

}

@-moz-keyframes growUp {
    0% {
        -moz-transform: scale(1);
    }

    50% {
        -moz-transform: scale(0.5);
    }

    100% {
        -moz-transform: scale(1);
    }

}

@-o-keyframes growUp {
    0% {
        -o-transform: scale(1);
    }

    50% {
        -o-transform: scale(0.5);
    }

    100% {
        -o-transform: scale(1);
    }

}

@-ms-keyframes growUp {
    0% {
        -ms-transform: scale(1);
    }

    50% {
        -ms-transform: scale(0.5);
    }

    100% {
        -ms-transform: scale(1);
    }

}

@keyframes growUp {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(0.5);
    }

    100% {
        transform: scale(1);
    }

}

/* Prevents a FOUC , esp for the new KPI loading window  */

.notransition,
.bhi-wrapper.notransition .page-hider {
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -o-transition: none !important;
    transition: none !important;
}

.page-hider {
    opacity: 0;
    position: absolute;
    /* fixed seems to cause more problems */
    /* position: fixed; */
    /* But that requires .page-hider appears *above* .main-content-area 
            Setting higher z-index*/
    /* z-index: 1001; */
    /* Because page-hider is visible ; but opacity:0;
                it would intercept all users' clicks
                so we turn pointer-events off 
                */
    z-index: 1021;
    /* width: 100%;
            height: 100%; */
    top: 0px;
    bottom: 0px;
    left: 0px;
    right: 0px;
    background-color: #fff;
    /* Instead of transitioning the .main-content-area; transition the page-hider
    
            
                */
    -webkit-transition-timing-function: ease;
    -o-transition-timing-function: ease;
    transition-timing-function: ease;
    -webkit-transition-duration: .35s;
    -o-transition-duration: .35s;
    transition-duration: .35s;
    pointer-events: none;
}

.lui-popover-container {

    /* https://jira.bluehealthintelligence.com/browse/WYSD-1881
    Landing Page 2.0 UI: Loading/Landing Sheet: "Inert" sheet or ability to bypass (pin sheet) */
    z-index: 1022;
}

.page-hider.return-to-welcome {
    /* Higher than, for example, loading screens */
    z-index: 1050;
}

.page-hider.includes-summary-sheet,
.page-hider.includes-summary-sheet iframe {
    /* the body element on welcome-template AND the bhi_sui_whyzen_theme.zip background color */
    background-color: #e7eaf0;

}

.basic-page-hider.is-detail-app-ready {
    /*
    https://jira.bluehealthintelligence.com/browse/WYSD-1881
    Landing Page 2.0 UI: Loading/Landing Sheet: "Inert" sheet or ability to bypass (pin sheet)
    */
    /* (or make it transparent) */
    display: none;
}

.page-hider.load-indicate.includes-summary-sheet.is-detail-app-ready,
.page-hider.load-indicate.includes-summary-sheet.is-detail-app-ready iframe,
.basic-page-hider.is-detail-app-ready {
    /* allowing left-padding to show through, top whyzen-header to show through */
    background: transparent;

    /* to allow "click through" */
    /* https://stackoverflow.com/questions/3680429/click-through-div-to-underlying-elements */
    /* https://jira.bluehealthintelligence.com/browse/WYSD-1881
    Landing Page 2.0 UI: Loading/Landing Sheet: "Inert" sheet or ability to bypass (pin sheet) */
    pointer-events: none;
}

.page-hider.load-indicate.includes-summary-sheet.is-detail-app-ready .whyzen-header,
.page-hider.load-indicate.includes-summary-sheet.is-detail-app-ready .summary-info-loading-message {
    /* fall through to the detail apps' header
    but dont show the detail apps' current selection  bar, yet 
    https://jira.bluehealthintelligence.com/browse/WYSD-1881
    Landing Page 2.0 UI: Loading/Landing Sheet: "Inert" sheet or ability to bypass (pin sheet)
    */
    display: none !important;
}

.page-hider #menu-toggle-2 {
    display: none;
}

.circle__wrapper {
    position: fixed;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.circle__wrapper p.circle {
    display: inline-block;
    height: 16px;
    width: 16px;
    border: 3px solid #255779;
    background-color: transparent;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    animation-iteration-count: 9000;
    margin-right: 4px;
}

.circle__wrapper .crl1 {
    -webkit-animation: growUp 1.25s 0s;
    -moz-animation: growUp 1.25s 0s;
    -ms-animation: growUp 1.25s 0s;
    -o-animation: growUp 1.25s 0s;
    animation: growUp 1.25s 0s;
}

.circle__wrapper .crl2 {
    -webkit-animation: growUp 1.25s 0.25s;
    -moz-animation: growUp 1.25s 0.25s;
    -ms-animation: growUp 1.25s 0.25s;
    -o-animation: growUp 1.25s 0.25s;
    animation: growUp 1.25s 0.25s;
}

.circle__wrapper .crl3 {
    -webkit-animation: growUp 1.25s 0.5s;
    -moz-animation: growUp 1.25s 0.5s;
    -ms-animation: growUp 1.25s 0.5s;
    -o-animation: growUp 1.25s 0.5s;
    animation: growUp 1.25s 0.5s;
}

/* When positioned inside a .hint element which already has the positioning */
.hint .circle__wrapper {
    position: relative;
    top: auto;
    left: 50%;
    display: block;
    /* Extra margin */
    margin-top: 10px;
}

.hint .circle__wrapper .circle {
    border-color: grey;
}

.page-hider.is-active {
    opacity: 1;
    pointer-events: inherit;
    /*
            Not allowed:
            pointer-events:initial;
            */
}

.qv-object {
    background-color: transparent;
}

/* Competing with #sidebar-wrapper table a, #sidebar-wrapper table i */

/* 
    tr.has-app-object-folder {
        height: 42px; 
    } 
    */

tr.has-app-object-folder td {
    position: relative;
    /* padding-bottom: 0px !important; */
    /* padding-top:12px!important; */
    /* padding-top: 24px !important */
}

.dtsearch-wrapper .app-object-folder-label {
    /* position: absolute; */
    /* top: 6px; */
    font-size: 12px;
    /* left: 8px; */
    font-weight: bolder;
    /* top: 8px; */
    /* top: 6px; */

    /* https://jira.bluehealthintelligence.com/browse/WYSD-1442?focusedCommentId=60377&page=com.atlassian.jira.plugin.system.issuetabpanels%3Acomment-tabpanel#comment-60377
    Q Nate Anderson - when a user has published to more than 3 (I think it's a wrap thing) CC's take a look at what I see
    */
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    /* max-width: calc(100% - 8px); */
    /* */
    display: block;
}

.dtsearch-wrapper .app-object-folder-sub-category-label {

    color: black;
    font-style: italic;
    opacity: 0.8;

}

tr.has-app-object-folder .fa-globe {
    margin-left: 20px;
}


.has-selection,
#sidebar-wrapper .has-selection td a i,
.has-selection td a span {
    /* this green overrides even the striped rows in search table */
    background-color: #028c5f !important;
    /* The Whyzen nav on left; the grouped list is already white-on-greenBu tthe search results are blue-on-green;
            use white for legibility*/
    color: white !important;
}

.sheet-selection-popover p {
    font-weight: bolder;
}

.sheet-selection-popover p,
.sheet-selection-popover li {
    padding: 1em;
}

.sheet-selection-popover li {
    border-top: 1px solid #e2e2e2;
    cursor: pointer;
}

.sheet-selection-popover li:hover {
    background-color: #e2e2e2;
    /*
            color:white;
            */
}

.sheet-selection-popover ul {
    list-style: none;
}

.load-indicate .kpi-row {
    display: flex;
    width: 100%;
}

.load-indicate .kpi-row>div {
    flex: 1;
    background-color: #f3f3f3;
    margin: 1em;
    text-align: center;
}

.load-indicate .kpi-row>div>[id] {
    width: 100%;
    height: 100px;
}

/* Text in the welcome paragraphs of welcome page */

.whyzen-color {
    color: #7dc7d9;
}

.load-indicate .kpi-wrapper {
    margin-top: 2em;
}

.load-indicate .kpi-wrapper h1 {
    margin-top: 1em;
    text-align: center;
    font-size: 2em;
}

.load-indicate .kpi-wrapper p {
    margin: 0px;
}

/* whether in hub template or index.html template (summary loading screen) */

.whyzen-header {
    width: 100%;
    /* to appear above the iframe */
    z-index: 1000;
}

.whyzen-header,
.whyzen-header navbar {
    max-height: 52px;
}

.whyzen-header .navbar-brand {
    padding: 0px;
}

.whyzen-header .navbar-header {
    margin-left: 25px;
}

.includes-summary-info #menu-toggle-2 {
    /* the menu won't work */
    opacity: 0;
}

/* https://jira.bluehealthintelligence.com/browse/WHYZ-1118 */

.cr-schedule-report svg rect,
.cr-schedule-report svg path {
    fill: white;
}

.whyzen-item-tooltip {
    /*
            //Notice the min-width:
            //Need it wide-enough to accommodate the selection_definition
            */
    min-width: 300px;
    background-color: #193b54;
    padding: 10px
}

/*
    .whyzen-item-tooltip .lui-tooltip__arrow {
            
            //Notice the left-arrow is always 18px from the top;
            //Because Qlik /Leonardo UI will position the tooltip based on its initial size;
            //Its initial size , height especially does not include the <table> worth of information, because Angular hasn't rendered it yet
            //So the height  (i.e. no rows) is quite short; 
            //but once angular fills out the <table> with <tr ng-repeat>, the height grows; the arrow's top:50% causes the arrow sinks down
            //
            //top:15px;
            // want it to be halfway from top in the one-line case
            top:15px;
            top:18px;
            Not necessary, now we get pretty selection *before* we create tooltip controller; 
            so the array should be ready; so angular should render, 
            and tooltip should wait on height
        }
        */

.whyzen-item-tooltip .lui-tooltip__arrow--right:after {
    border-left-color: #193b54;
}

.whyzen-item-tooltip .lui-tooltip__arrow--top:after {
    border-bottom-color: #193b54;
}

.whyzen-item-tooltip .lui-tooltip__arrow--left:after {
    border-right-color: #193b54;
}

.whyzen-item-tooltip .lui-tooltip__arrow--bottom:after {
    border-top-color: #193b54;
}

.whyzen-item-tooltip td {

    padding: 5px;
}

.whyzen-item-tooltip td div {

    /* https://jira.bluehealthintelligence.com/browse/WYSD-1704?focusedCommentId=64462&page=com.atlassian.jira.plugin.system.issuetabpanels%3Acomment-tabpanel#comment-64462*/
    max-width: 200px;
    max-height: 100px;
}

.whyzen-item-tooltip td.whyzen-field div {

    /* https://jira.bluehealthintelligence.com/browse/WYSD-1704?focusedCommentId=64462&page=com.atlassian.jira.plugin.system.issuetabpanels%3Acomment-tabpanel#comment-64462*/
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.whyzen-item-tooltip td.whyzen-value div {
    /* https://jira.bluehealthintelligence.com/browse/WYSD-1704?focusedCommentId=64462&page=com.atlassian.jira.plugin.system.issuetabpanels%3Acomment-tabpanel#comment-64462*/
    overflow-y: scroll;
    /* text-overflow: ellipsis; */
    /* display: block; */
}

.whyzen-item-tooltip .label {
    font-weight: bolder;
    font-size: 1.15em;
    display: block;
    margin-bottom: 0.25em;
    text-align: left;
}

.whyzen-item-tooltip tr:nth-child(odd) td {
    background-color: rgba(255, 255, 255, 0.2);
}

.whyzen-item-tooltip tr:first-child td {
    background-color: transparent;
    font-weight: bolder;
}

.whyzen-item-tooltip table {
    width: 100%;
}

#listSelections {
    width: 100%;
    /* height: 75%; */
    /* Regardless of the number of selections user has */
    height: 150px;
    max-height: 150px;
    margin-bottom: 1em;
    overflow-y: scroll;
    background-color: white;
    border: 1px solid grey;
    overflow-x: hidden;
    display: block;
}

#listSelections [selected] {
    background-color: #d5d5d5;
}

/*
        https://jira.bluehealthintelligence.com/browse/WHYZ-1397
    
        */

.account-config-search-container {
    /* background-color:white; */
    position: relative;
    background-color: white;
}

.account-config-search-container .lui-icon {
    color: grey;
    position: absolute;
    line-height: 3em;
    font-size: 1em;
}

.account-config-search-container .lui-icon--close {
    right: 10px;
    cursor: pointer;
}

.account-config-search-container .lui-icon--search {
    pointer-events: none;
    left: 10px;
}

.account-config-search-container input {
    border: transparent;
    background-color: transparent;
    font-size: 1em;
    padding: 0.8em;
    width: 100%;
    border-bottom: 1px solid #c7c7c7;
    /* grey */
    padding-left: 3em;
    cursor: pointer;
    background-color: white;
}

.account-config-search-container md-progress-circular {
    position: absolute;
    top: 60%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.account-config-search-container md-progress-circular svg path {
    /* stroke:white; */
    stroke: grey;
}

.account-config-search-container .no-config-object {
    color: transparent;
    background-color: #ececec;
    display: block;
    width: 40%;
}

.account-config-search-container md-virtual-repeat-container {
    height: 100%;
    display: block;
    width: 100%;
}

.account-config-search-container .account-config-item-results {
    /* The md-virtual-container will handle the scrolling */
    /* overflow-y: scroll; */
    max-height: 200px;
    min-height: 200px;
    height: 200px;
}

.account-config-search-container .account-config-item {
    padding: 0.6em;
    border-bottom: 1px solid #dddddd;
    color: black;
    font-size: 13px;
    background: #ffffff;
    padding-left: 1em;
    position: relative;
    /* .noselect { */
    -webkit-touch-callout: none;
    /* iOS Safari */
    -webkit-user-select: none;
    /* Safari */
    -khtml-user-select: none;
    /* Konqueror HTML */
    -moz-user-select: none;
    /* Firefox */
    -ms-user-select: none;
    /* Internet Explorer/Edge */
    user-select: none;
    /* Non-prefixed version, currently
                                        supported by Chrome and Opera */
    /* } */
}

.account-config-search-container .account-config-item .lui-icon {
    position: absolute;
    line-height: 22px;
    font-size: 1em;
    right: 10px;
    color: white;
}

/* .account-config-search-container  .account-config-item.selected .lui-icon { */

/* color:white; */

/* } */

.account-config-search-container .highlighted,
.account-config-search-container .selected,
.continue-button {
    background: #8cc63f;
    color: white;
}

.continue-button[disabled] {
    background: rgb(147, 147, 147);
    cursor: not-allowed;
    /* #8cc63f; */
}

/* .account-config-search-container  .continue-button, */

.continue-button {
    color: white;
    margin-top: 20px;
    padding: 12px 100px 12px 100px;
    border-radius: 6px;
    border: none;
    font-size: 19px;
    width: 100%;
}

.account-config-search-container .no-results,
.account-config-search-container .loading {
    text-align: center;
    color: grey;
    font-size: 1em;
    /* padding-top: 3em; */
    margin: auto;
    /* padding: 5em; */
    position: absolute;
    width: 100%;
    top: calc(50% + 1em);
    padding: 0em 2em;
    /* .account-config-search-container  .loading { */
    /* width: 100%; */
    /* height: 100%; */
    /* color: #505050; */
    /* position: absolute; */
    /* top: 0; */
    /* bottom: 0; */
    /* left: 0; */
    /* right: 0; */
    /* text-align: center; */
    /* padding-top: 20%; */
    /* } */
}

.account-config-search-container .account-config-item:hover {
    cursor: pointer;
    background-color: #efefef;
    /* still want to override the .select
            Nah just give it darker green background; see next rule */
    /* color:black; */
}

.account-config-search-container .selected:hover {
    /* nah give it green */
    background-color: #8abd45;
}

.account-config-search-container .highlighted {
    padding: 2px 4px;
}

.account-config-search-container .selected .highlighted {
    padding: 0px;
    /* No need for highlighting ? */
    background-color: transparent;
}

/* .main-welcome .btn-primary { */

/* color: #ffffff; */

/* background-color: #939393; */

/* border-color: #939393; */

/* } */

.welcome-row {
    /* replaces a .spacer-row*/
    padding-top: 100px;
}

@media(max-width:992px) {
    .hub-page .check-box-wrap {
        margin-bottom: 10px;
    }

    .hub-page .check-box-wrap {
        text-align: center;
    }

    .page-hider.includes-summary-info,
    .welcome-row {
        /*
            Ctrl+F
            .main-welcome {  */
        /* .main-welcome .welcome-row{ */
        display: flex;
        flex-direction: column;
    }

    .welcome-row {
        padding-top: 25px;
        /* So that the display: flex; can work */
        height: calc(100% - 65px);
    }

    .includes-summary-info .summary-info-kpi-row {
        /* These maybe shouldonly kick in at certain...?*/
        flex: 1;
        /* max-height: 80%; */
        overflow-y: scroll;
        width: 100%;
        padding-left: 0px;
        padding-right: 0px;
        margin: 0px;
        padding-top: 150px;
        /* padding-top: 150px; */
    }

    .welcome-col {
        display: none;
    }

    .account-config-col {
        flex: 1;
    }

    .main-welcome .disclaimer-footer-row {
        /* dont fix it , isntead use display:flex on .main-welcome*/
        /* position: fixed; */
        /* bottom: 0px; */
        margin-top: 0px;
    }

    .account-config-search-container .account-config-item-results {
        /* The md-virtual-container will handle the scrolling */
        /* overflow-y: scroll; */
        max-height: 250px;
        min-height: 250px;
        /* font-size:1.25em; */
    }

    .account-config-search-container .account-config-item {
        font-size: 16px;
    }
}

/*
        Nate says:
        Periodically fonts which should come from qsstage , the header would not include Access-Control-Allow-Origin
        Therefore browser blocks our IIS domain (i.e. sandbox) from loading from the Qlik domain (i.e. qssandbox)
        https://confluence.bluehealthintelligence.com/display/DV/20181107+Nate+Whyzen?preview=/21561618/21561639/image2018-11-7_14-46-37.png
    
        I don't know why the font would fail to have an Access-Control-Allow-Origin header coming back from Qlik;
        The easier thing is to just load the fonts in the browser ourself:
    
        */

@font-face {
    font-family: 'QlikView Sans';
    src: url('../fonts/qlikview-sans.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'QlikView Sans';
    src: url('../fonts/qlikview-sans-bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'QlikView Sans';
    src: url('../fonts/qlikview-sans-italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'QlikView Sans';
    src: url('../fonts/qlikview-sans-bold-italic.ttf') format('truetype');
    font-weight: bold;
    font-style: italic;
}


.account-config-search-container:before {
    /* use the QlikView Sans font;
            we don't want to see the font affecting the welcome page (at leas tnot as of 11/9/2018); 
            i.e. we are targeting :before;
            However we need to load the font! So browser triggers download from a more foolproof domain*/
    font-family: 'QlikView Sans';
    content: " ";
}

.whyzen-icon-button {
    /* Otherwise looks rectangular*/
    padding: 0px 5px !important;
    /* padding: 0px!important; */
    min-width: 30px !important;
    text-align: center;
    /* pointer-events:none;
            cursor:auto; */
    border: 0px !important;
}

.whyzen-icon-button .lui-button__icon,
.whyzen-icon-button .lui-button__text {
    margin-left: 0px !important;
    margin-right: 0px !important;
}

.btn.sync .whyzen-icon-button {
    /* Parent .btn.sync is position:fixed */
    position: absolute;
    top: -10px;
    right: -10px;
}

.subtle-instructions {
    padding-top: 1em;
    margin-top: 1em;
    border-top: 1px solid #f3c7c759;
}

.subtle-instructions p {
    margin: 0;
    margin-bottom: 0.25em;
    color: grey;
    font-style: italic;
    font-size: 0.9em;
}

.bhi-app-object-manager-dialog .target-apps-detail .results-list {
    max-height: 350px;
    min-height: 350px;
}

.bhi-app-object-manager-dialog .results-footer {
    padding: 1em;
}

.bhi-app-object-manager-dialog .has-selected .all-app-summary .results-loading {
    /* Will be shorter, flexed*/
    padding-top: 65px;
}

/* Loader will go in one of these */

.results-list,
.results {
    position: relative;
}

.results-list-item {
    height: 47px;
}

.results-loading {
    background-color: rgba(218, 218, 218, 0.5);
    text-align: center;
    /* padding-left: 45%; */
    /* line-height: 500px; */
    /* padding-top:30%; */
    padding-top: 185px;
    /* 200px; */
    font-size: 40px;
    position: absolute;
    width: 100%;
    /* top: 30px; */
    top: 0px;
    bottom: 0px;
    display: none;
    z-index: 1;
}

.is-loading .results-loading {
    display: block !important;
}

.results-header>div {
    background-color: grey;
    color: white;
    padding: 0.25em;
    font-size: 1.25em;
}

.results-header {
    /* To prevent display:flex from distorting*/
    min-height: 32px;
}

.results-header,
.results-list-item {
    display: flex;
}

.results-header>*,
.results-list-item>* {
    flex: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.results-list {
    /*
            max-height: 300px;
            max-height:500px;
            */
    overflow-y: scroll;
}

.results-list-item>* {
    padding: 10px;
}

.results-list-item:nth-child(odd) {
    /*
        Using transparent background color so it works against a grey as well as  a white
        */
    background-color: rgba(175, 175, 175, 0.271);
}

.results-list-item.is-selected,
.results-list-item.is-selected:nth-child(odd) {
    background-color: #52a2cc;
    color: white;
}

/* .bhi-app-object */

.inline-lui-icon {
    /* Gotta defeat the -6 px margins on either side */
    margin: 0px 5px !important;
}

.global-filters-ui-wrap {
    height: 44px;
    /* right: 300px; */
    right: 280px;
    position: fixed;
    width: 275px;
    top: 12px;
    overflow: hidden;
    border: 1px solid #b3b3b3;
    border-radius: 4px;
    padding: 10px;
    z-index: 1000;
    background: #f5f5f5;
}

.global-filters-ui-wrap.is-selections-dropdown-expanded {
    height: auto;
    /* Almost whole width of page (?) */
    width: 300px !important;
}

.global-filters-ui-panel {
    width: 100%;
    overflow: hidden;
    margin-top: 12px;
    padding-top: 3px;
    position: relative;
    /* padding-bottom:20px; */
}

.global-filters-ui-panel-header {
    cursor: pointer;
    padding-left: 1em;
    padding-bottom: 8px;
}

.user-info .lui-icon,
/* Not all lui icons */
.global-filters-ui-wrap .lui-icon--select-alternative,
/*  for Jun2020*/
.global-filters-ui-wrap .lui-icon--settings {
    display: none;
    cursor: pointer;
}

.user-info .lui-icon:before {
    font-size: 28px;
}

.global-filters-ui-wrap .lui-icon--select-alternative,
/*  for Jun2020*/
.global-filters-ui-wrap .lui-icon--settings {
    float: right;
    margin-right: 10px;
}

.global-filters-ui-wrap .lui-icon--select-alternative:before,
.global-filters-ui-wrap .lui-icon--settings:before {
    font-size: 20px;
    width: 40px !important;
    /* float: left; */
}

.navbar-brand img {
    display: block;
    height: 44px;
    width: auto;
    padding: 0px;
    margin-left: 10px;
    margin-top: 5px;
}

.navbar-brand img+.logo-subtext {
    font-size: 11px;
    display: block;
    height: 16px;
    width: auto;
    padding: 0px;
    margin: 0px;
    margin-left: 10px;
    cursor: default;
}

[connect-report-url] {
    background-color: #255779;
    border: none;
    position: fixed;
    top: 12px;
    margin-left: 20px;
    padding: 9px 12px;
}


#saveAs {
    display: none;
    border-radius: 4px;
    background-color: rgba(0, 0, 0, .5);
    z-index: 1500;
    position: absolute;
    left: 37%;
    top: 25%;
    padding: 10px;
    width: 25%;
    height: auto;
}

/* Start row-extra-padding define a new column type that has extra padding in between members but not at start and end */

@media (max-width:1400px) {

    /* This leaves enough space for the sync-manager and report-scheduler buttons, before they disappear ~ 950px */
    #bhi-wrapper.toggled {
        padding-left: 0px !important;
    }

    #sidebar-wrapper {
        /* padding-top: 60px; */
        /* From Brad 10-22-2019 */
        /* 3)	The left navigation menu is under the top navigation and things are cut off.  Can we do something to address that? */
        padding-top: 80px;
    }
}

@media (max-width:1100px) {

    .main-welcome .disclaimer-footer-row,
    .page-hider .disclaimer-footer-row,
    .hub-page+.disclaimer-footer-row {
        max-height: 200px;
        overflow-y: scroll;
        /* position: fixed; */
        /* bottom: 0; */
        /* overflow-y: scroll; */
    }

    .hub-page+.disclaimer-footer-row {
        max-height: 200px;
        overflow-y: scroll;
    }

    .disclaimer-footer-row .whyzen-logo {
        /* top:-40px; */
        /* peg the logo where it's at */
        position: fixed;
    }

    /* https://jira.bluehealthintelligence.com/browse/WHYZ-1605?focusedCommentId=22328&page=com.atlassian.jira.plugin.system.issuetabpanels%3Acomment-tabpanel#comment-22328 */
    .disclaimer-footer-row [class*="col"]:last-child {
        /* clear the logo on the left*/
        padding-left: 144px;
    }

    .to-welcome-message {
        width: 80%;
        left: 10%;
    }

    #saveAs {
        width: 80% !important;
        left: 10% !important;
    }

    .toggled .user-divider,
    .toggled .bhi-user-id,
    .toggled .bhi-current-acct,
    .toggled .download-selections-elem {
        display: none !important;
    }

    a[ng-click="qLogout()"] {
        display: inline;
    }

    a[ng-click="qLogout()"]:hover {
        text-decoration: underline;
    }

    /* more responsive design; the KPIs take up too much of the space there, 
            so move KPIs up to the top  */
    .page-hider .circle__wrapper {
        top: 120px;
        /* width:100%; */
    }

    .page-hider .circle__wrapper p:not(.circle) {
        min-width: 300px;
    }

    .user-info .lui-icon--log-out,
    .global-filters-ui-wrap .lui-icon--select-alternative,
    /*  for Jun2020*/
    .global-filters-ui-wrap .lui-icon--settings {
        display: block;
    }

    .user-info .lui-icon--log-out~*,
    .global-filters-ui-wrap .hide-when-small {
        display: none;
        /* Put a logout button instead? */
    }

    .global-filters-ui-wrap {
        right: 10px !important;
        /* width: 100px!important; */
        width: 80px !important;
        /* Need more width to accommodate the "Download" button (?) 
                Or just hide the button ? */
        /* width: 120px!important; */
        top: 6px;
        right: 60px !important;
    }

    /******SYNC MANAGER BUTTON/LINK 
            https://jira.bluehealthintelligence.com/browse/WHYZ-1605?focusedCommentId=22326&page=com.atlassian.jira.plugin.system.issuetabpanels%3Acomment-tabpanel#comment-22326
            **********/
    /* dont show the button, instead show the item int he selection dropdown*/
    .btn.sync {
        display: none;
    }

    /* 
            Dont display sync-manager button unless the sync-manager dialog is responsive,
            .global-filters-ui-panel.sync-manager  {
                display: block;
            }
            */
    /******CONNECT REPORT BUTTON/LINK 
            https://jira.bluehealthintelligence.com/browse/WHYZ-1605?focusedCommentId=22326&page=com.atlassian.jira.plugin.system.issuetabpanels%3Acomment-tabpanel#comment-22326
            **********/
    .global-filters-ui-panel.connect-report {
        display: block;
    }

    [connect-report-url] {
        display: none;
    }

    /* Oerlaps with the menu opener */
    .selections-button {
        display: none;
    }

    /* dont show the button, instead show the item int he selection dropdown*/
    .btn.cr-schedule-report {
        display: none;
    }

    /* we dont want to hide all the buttons */
    .global-filters-ui-panel .btn.cr-schedule-report {
        display: block;
    }
}

@media (max-width:550px) {
    .navbar-brand img {
        height: 38px;
        margin-top: 10px;
    }

    .navbar-brand span {
        position: fixed;
        top: 64px;
        left: 0px;
        /* At small sizes */
        display: none !important;
    }

    /* .hub-page { */
    /* No padding */
    /* padding-top:37px; */
    /* } */

    #menu-toggle-2 {
        margin-right: 0px;
    }

    .whyzen-logo-welcome {
        display: none;
    }

    /* hide the chart options icons in mobile view*/
    .fa-qlik {
        display: none;
    }

    .user-info {
        position: absolute !important;
        line-height: 1;
        left: initial;
        /* top: 15px; */
        top: 0px;
        right: 10px;
        /* Ugh */
        /* margin-top:15px; */
    }

    .download-selections-wrapper {
        display: none;
    }

    [title="Export Current Selections"] {
        margin-right: 48px;
    }

    .selections-button {
        /* So the save selections button clears the first line */
        margin-top: 4px;
    }
}

@media (max-width:365px) {
    #sidebar-wrapper img.whyzen-logo-sidebar {
        position: absolute;
        right: 23px;
        top: 6px;
    }

    #menu-toggle {
        display: block;
    }
}

/*********MIN *************/

/* Start row-extra-padding define a new column type that has extra padding in between members but not at start and end */

@media (min-width:992px) {

    .includes-summary-info .disclaimer-footer-row,
    .hub-page .disclaimer-footer-row {
        position: fixed;
        bottom: 0px;
    }

    .navbar-default .navbar-nav>li.nav-logout>a {
        padding-right: 50px;
    }

    .row.row-extra-padding div.panel {
        padding-left: 20px;
        padding-right: 45px;
        padding-top: 15px;
        padding-bottom: 15px;
        box-shadow: none;
    }

    .row.row-extra-padding div[class^="col-"]:first-child div.panel {
        padding-left: 0px;
    }

    .row.row-extra-padding div[class^="col-"]:last-child div.panel {
        padding-right: 0px;
    }

    .row.row-extra-padding div[class^="col-"]:first-child .panel {
        margin-right: 30px;
    }

    .row.row-extra-padding div[class^="col-"]:last-child .panel {
        margin-left: 30px;
    }

    .nav button {
        display: inline-block;
    }
}

/* For the migration page, trying to make it responsive, but I think it's in  */

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

.migration body {
    background-position-x: right;
    background-repeat: no-repeat;
    /* Should already be at cover */
    /* background-size:cover */
}

/* Start row-extra-padding define a new column type that has extra padding in between members but not at start and end */

@media (min-width:992px) {
    .migration div#divErrorPageContainer {
        width: 100%;
    }

    .migration .roundShadowContainer {
        width: 80%;
    }
}

/* https://jira.bluehealthintelligence.com/browse/WHYZ-1652 */

.is-hide-read-bookmarks .bookmark-filter {
    display: none;
}

.no-bookmark-filler-at-top {
    display: none;
}

.is-hide-read-bookmarks .no-bookmark-filler-at-top {
    display: block;
}

.is-hide-read-bookmarks .sub-account-filter-at-top {
    display: none;
}

.dynamic-period-text {
    /* min-height:50px; */
    /* Gotta give it an explicit height */
    height: 50px;
}

body {
    /* https://jira.bluehealthintelligence.com/browse/WHYZ-1605?focusedCommentId=22328&page=com.atlassian.jira.plugin.system.issuetabpanels%3Acomment-tabpanel#comment-22328 */
    /* Avoid double-scrollbars */
    overflow: hidden;
}

.lui-tooltip-container {
    /* So these tooltip container appear *above* any popover containers */
    z-index: 100000;
}

@media (max-height:800px) {
    .account-config-item-results {
        max-height: 150px !important;
        min-height: 150px !important;
        height: 150px !important;
    }

    .main-welcome .disclaimer-footer-row,
    .page-hider .disclaimer-footer-row,
    .hub-page+.disclaimer-footer-row {
        max-height: 100px;
        /* max-height:140px; */
        overflow-y: scroll;
    }

    .account-config-col {
        flex: 1;
        /* Scroll */
        overflow-y: scroll;
    }
}

.selections-options-header {
    cursor: pointer;
    font-weight: bolder;
    position: relative;
}

.selections-options-header:after {
    content: "";
    clear: both;
    display: table;
}

.mdl-data-table .mdl-data-table__bhi_header {
    /* .mdl-data-table thead { */
    padding-bottom: 3px;
    border-bottom: 1px solid #cecece;
    /* } */
}

.mdl-data-table .mdl-data-table__bhi_body .mdl-data-table__bhi_row {
    /* .mdl-data-table tbody tr */
    position: relative;
    height: 48px;
    transition-duration: .28s;
    transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    transition-property: background-color;
}

.mdl-data-table .mdl-data-table__bhi_body .mdl-data-table__bhi_row:hover {
    /* .mdl-data-table tbody tr:hover { */
    background-color: #eee;
}

.mdl-data-table .mdl-data-table__bhi_cell {
    /* .mdl-data-table td, .mdl-data-table td .mdl-data-table__select */
    vertical-align: middle;
    /* to align, or else give all cells which should flex, a layout attribute */
    display: flex;
}

.mdl-data-table .mdl-data-table__bhi_cell .mdl-button--icon {
    /* bump up a bit */
    margin-top: -5px;
}

.mdl-data-table .mdl-data-table__bhi_header_cell {
    /* .mdl-data-table th */
    position: relative;
    vertical-align: bottom;
    text-overflow: ellipsis;
    font-weight: 700;
    line-height: 24px;
    letter-spacing: 0;
    height: 48px;
    font-size: 12px;
    color: rgba(0, 0, 0, .54);
    padding-bottom: 8px;
    box-sizing: border-box;
}

.mdl-data-table .mdl-data-table__bhi_header_cell {
    /* padding: 0 18px 12px 18px; */
    /* necessary now that the cell is no longer display:table-cell */
    padding: 12px 18px;
    text-align: right;
    /* to align its children */
    /*( instead use layout */
    /* display: flex; */
}

/* .mdl-data-table__cell--non-numeric.mdl-data-table__cell--non-numeric */

.mdl-data-table .mdl-data-table__bhi_cell:first-of-type,
.mdl-data-table .mdl-data-table__bhi_header_cell:first-of-type {
    /* .mdl-data-table td, .mdl-data-table td .mdl-data-table__select */
    padding-left: 24px;
}

.mdl-data-table .mdl-data-table__bhi_cell {
    /* .mdl-data-table td */
    position: relative;
    height: 48px;
    border-top: 1px solid rgba(0, 0, 0, .12);
    border-bottom: 1px solid rgba(0, 0, 0, .12);
    padding: 12px 18px;
    box-sizing: border-box;
}

/* NEW */

.mdl-data-table .mdl-data-table__bhi_row {
    display: flex;
}

.mdl-data-table .mdl-data-table__bhi_cell,
.mdl-data-table .mdl-data-table__bhi_header_cell {
    flex: 1;
}

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

.mdl-textfield.mdl-js-textfield.mdl-textfield--floating-label {
    width: 100%;
    display: flex;
}

.mdl-textfield.mdl-js-textfield.mdl-textfield--floating-label label.mdl-textfield__label {
    /* left: 30px; throws  off the "focus" line appearing beneath */
    padding-left: 30px;
}

.mdl-data-table .mdl-data-table__bhi_body {
    overflow-y: scroll;
    /* let the ui-scroll-viewport handle the scrolling */
    /* even this is overkill, causes menus to be clipped */
    /* overflow-y: hidden; */
}

.mdl-data-table .mdl-data-table__bhi_body .mdl-data-table__bhi_scroll_container {
    overflow-y: scroll;
}

.mdl-data-table .mdl-data-table__bhi_body .mdl-data-table__bhi_spinner {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.mdl-data-table .mdl-data-table__bhi_body .mdl-spinner {
    width: 100px;
    height: 100px;
    /* margin: 30px auto; */
    /* more centered */
    margin: 200px auto;
    display: none;
}

.mdl-data-table .mdl-spinner.is-active {
    display: block;
}

.mdl-textfield__label:after {
    /* a little lower*/
    bottom: 18px;
}

.hint {
    padding: 10px;
    text-align: center;
    font-size: 1.25em;
}

/* */

.hint-body {
    padding-top: 40px;
}

.hint-icon {
    font-size: 64px !important;
    height: 48px;
    margin: 0.5em;
    width: auto;
    margin: 0px;
    opacity: 0.5;
}

.mdl-menu {
    width: 300px;
    /* will  clip to the  */
}

[layout="column"] {
    display: flex;
    flex-direction: column;
}

[layout="row"] {
    display: flex;
    flex-direction: row;
}

[flex] {
    flex: 1;
}

[de-flex] {
    flex: 0 !important;
}

.bhi-menu__item_instruction {
    padding: 0px 10px;
    /* cursor: none; */
}

.mdl-data-table {
    display: flex;
    flex-direction: column;
}

/* USE a specific Material Design Lite theme with your preferred colors configured into it 
        Temporarily just using CSS to override:*/

.mdl-button--colored {
    background: #259dc0 !important;
}

.app-object-groups .mdl-chip {
    background-color: #259dc0 !important;
    color: white !important;
    font-weight: bolder;
    transition: all 0.5s ease-in-out;
}

.app-object-groups .mdl-chip.error {
    background-color: red !important;
}

.error-color {
    color: red !important;
}

.mdl-menu__item.info {
    font-size: 12px;
    height: 40px;
}

.narrow {
    max-width: 100px;
}

.mdl-data-table__bhi_header_cell--numeric {
    text-align: right;
}

.mdl-data-table__bhi_footer_info {
    padding: 0px 5px;
}

.app-object-label-group {
    display: flex;
    gap: 5px;
    align-items: center;
}

.app-object-label {
    flex-grow: 1;
}

.app-object-list {
    display: flex;
    flex-direction: column;
    display: -ms-flexbox;
    padding-bottom: 150px;
}

.app-object-list [data-folder] h4,
.sidebar-nav [data-folder] h4 {
    cursor: pointer;
    /* Give some space 
            No it's no longer clickable; give the *child* the space*/
    /* padding: 8px 0px 16px 0px; */
    clear: both;
    display: flex;
}

.app-object-list [data-folder] h4>*,
.sidebar-nav [data-folder] h4>* {
    padding-top: 8px;
    padding-bottom: 16px;
}

.app-object-list .fa,
.sidebar-nav .fa {
    padding-right: 10px;
    /* Overkill, hard to click */
    /* max-width: 10px; */
}

.app-object-list .fa-ellipsis-v,
.sidebar-nav .fa-ellipsis-v,
.app-object-list [class*="fa-caret"],
.sidebar-nav [class*="fa-caret"] {
    padding-left: 10px;
    /* for consistent width of the caret */
    min-width: 30px;
}

.app-object-list [data-folder] h4>span,
.sidebar-nav [data-folder] h4>span {
    flex: 1;
    text-indent: 0;
    /* white-space: nowrap; */
    /* For a long name like "everything_from_community_nav" */
    text-overflow: ellipsis;
    overflow: hidden;
}

.app-object-list [data-folder="NO_FOLDER"] h4,
.sidebar-nav [data-folder="NO_FOLDER"] h4,
.app-object-list [data-folder="everything_from_community_nav"] h4,
.sidebar-nav [data-folder="everything_from_community_nav"] h4 {
    display: none !important;
}

.app-object-list [data-folder] {
    padding-left: 3em;
}

.app-object-list [data-folder="NO_FOLDER"],
.app-object-list [data-folder="everything_from_community_nav"] {
    padding-left: 0 !important;
}


.sidebar-nav [data-folder="NO_FOLDER"] li a,
.sidebar-nav [data-folder="everything_from_community_nav"] li a,
.sidebar-nav [data-folder] h4 {
    /* Not the 39 spx */
    /*text-indent:12px!important; */
    /* text-indent:22px!important; */
    /* padding-left: 36px; */
    /*  compare to padding on .sidebar-nav li a { */
    padding-left: 18px;
    text-indent: 0px;
    margin: 0px;
}

/* because user cannot "delete" the NO_FOLDER folder... */
.app-object-list [data-folder="NO_FOLDER"] .no-results-hint,
.app-object-list [data-folder="everything_from_community_nav"] .no-results-hint {
    display: none;
}

.app-object-list .fa-ellipsis-v,
/* to hide the feature */
.sidebar-nav .fa-ellipsis-v {
    display: none;
}

.app-object-list.is-show-app-object-more-menu .fa-ellipsis-v,
.is-show-app-object-more-menu .fa-ellipsis-v,
.is-show-report-builder-upload-file-menu .fa-ellipsis-v {
    /* display:initial!important; */
    display: inherit !important;
}

.app-object-list.is-show-app-object-more-menu .panel .fa-ellipsis-v {
    display: block !important;
    cursor: pointer;
    width: 24px;
    text-align: center;
    /* too much */
    /* padding: 10px 20px; */
    padding: 10px;
}

.whyzen-sheet-management button {
    /* This whole button will disappear? */
    clear: both;
    display: block;
    /* center-aligned:*/
    /* width: 80%;
                margin: auto;
                height: 36px;
                margin-top: 20px;
                margin-bottom: 10px; */
    /* under the refresh category icon; clear icon: */
    width: calc(100% - 6em);
    /* margin-left: 2em; */
    margin-left: 20px;
    margin-top: 10px;
    margin-bottom: 10px;
    /* Otherwise appears above the search results */
    /* No, then it becomes unclickable: */
    /* z-index: -1; */
}

/* Sleeker ; go darker */
.sidebar-nav li ul {
    background: #031b34;
}

.nav-panel-right-icon {
    /* color:white!important; */
    margin-right: 10px !important;
    /* seemed to confuse users */
    display: none;
}

.nav-panel-right-icon.is-show-icon {
    display: block;
    font-size: 12px !important;
    color: white !important;
}


/* Donna noticed and documentation refers to the green nav menu; removing */
/* #menu-toggle, #menu-toggle-2 {
                color: #52a2cc!important;
            } */


.info-area {
    background-color: #f2f2f2;
    text-align: center;
    padding: 1em;
    font-size: 1.25em;
    margin: 0em 0.25em;
    font-weight: bolder;
    /* \
                because the dialog itself is constrained in width 5/23/2019 \
                max-width:600px; \
                */
}


/* Current-selection bar adjustments */
.qv-global-selections {
    top: 104px;
}

.selections-options-loading {
    display: none;
    position: absolute;
    top: 0px;
    right: 0px;
    left: 0px;
    bottom: 0px;
    background-color: rgba(0, 0, 0, 0.4);
    z-index: 3;
}

.selections-options .selections-options-loading .message {
    color: white;
    font-size: 2em;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.selections-options.mouse-disable .selections-options-loading {
    display: block;
}

.selections-options .qv-object .qv-object-content {
    /* Otherwise flow issues */
    position: relative !important;
}

/* Cards */

.is-use-card-theme .global-filters-ui-wrap,
.is-use-card-theme .sync.btn {
    /* background: #ffffff; */
    background: #fcfcfc;
    border: 0px;
    border-radius: 0px;
    /* box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.3); */
    box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.3);
}

.is-use-card-theme .select2-container--default .select2-selection--multiple .select2-selection__rendered {
    max-height: inherit !important;
}

.is-use-card-theme .select2-container--default .select2-selection--multiple .select2-selection__rendered li {
    overflow: hidden;
    text-overflow: ellipsis;
}

.is-use-card-theme .session-selections-ui-panel .qvobject {
    min-height: inherit !important;
    max-height: inherit !important;
    height: inherit !important;
}

.is-use-card-theme .select2-container--default.select2-container--focus .select2-selection--multiple,
.is-use-card-theme .select2-container--default .select2-selection--multiple {
    border-radius: 0px;
    border: 0px;
    background-color: #e0e0e0;
}

.nonempty-session-selection-indicator {
    display: none;
}

/* is_use_optional_style_session_selections */
.is-use-optional-style-sheet-selections .nonempty-session-selection-indicator {
    /* position: absolute;
                top: 0;
                right: 70px;
                width: 30px;
                height: 30px;
                background-color: #193b54;
                border-radius: 20px;
                color: white;
                text-align: center;
                line-height: 30px; */
    display: block;
    position: absolute;
    top: 0;
    right: 70px;
    width: 24px;
    height: 24px;
    background-color: #193b54;
    border-radius: 20px;
    color: white;
    text-align: center;
    line-height: 24px;
    /* margin-top: -5px; */
    font-size: 14px;
}

.whyzen-deploy-config-select {
    min-width: 140px;
    height: 22px;
    line-height: 18px;
}

.whyzen-deploy-config-select select {
    background-color: white;
    margin: 0em 1em;
}

.main-welcome .config-selects {
    position: fixed;
    right: 250px;
    top: 20px;
    display: flex;
}



#sidebar-wrapper .whyzen-deploy-config-select {
    height: 40px;
}

#sidebar-wrapper .whyzen-deploy-config-select select {
    width: 80%;
    box-sizing: border-box;
    margin-left: 15px;
    display: block;
}


/* The new report-library link button */
#report_viewer_account_codes_form button {
    background: transparent;
    color: white;
    display: block;
    /* Allow the natural line-height to work */
    /* line-height: 40px; */
    width: 100%;
    border: 0px;
    text-align: left;
    /* Nested under a links header */
    cursor: pointer;
    font-size: 19px;
    /* to inherit */
    text-transform: inherit;
    letter-spacing: inherit;
}

.report-links-body h3 {
    font-size: 19px !important;
    font-weight: 200;
    font-family: 'Open Sans';
    cursor: pointer;
    color: white;
    /* padding: 4px 0px 4px 18px !important; */
    padding: 4px 0px 4px 15px !important;
    margin: 0px;
    text-transform: uppercase;
    letter-spacing: 3px;
    font-weight: 500;
}

/* Only if the header */
.report-links-header+.report-links-body h3 {
    padding-left: 38px !important;
    margin: 10px 0px !important;
    /* */
    text-transform: unset !important;
    letter-spacing: unset !important;
    font-weight: 200 !important;
}

.report-links-header+.report-links-body .sidebar-nav h3 {
    padding-left: 38px !important;
    margin: 0px !important;
    /* */
    text-transform: unset !important;
    letter-spacing: unset !important;
    font-weight: 200 !important;
}

.hub-link-body {
    padding-left: 38px !important;
}


.is_include_navigation_base_sheet_subcategory_and_order .hub-link-body {
    /* override; only half the 38px above */
    /* // https://jira.bluehealthintelligence.com/browse/WYSD-1388
    // UI - Left Navigation with sheets and their categories (and subcategories / sub-category) */
    padding-left: 19px !important;
}

.is_include_navigation_base_sheet_subcategory_and_order .sidebar-nav li a {
    padding-left: 18px;
}

/* the other half of the 38px indent above */
/* Use the NO_SUBCATEGORY technique instead */
/* .is_include_navigation_base_sheet_subcategory_and_order li[data-indent="1"] {
    padding-left: 19px;
} */

.no-letter-spacing {
    letter-spacing: 0;
}

.report-links-body h3 a,
.report-links-body h3 a:hover,
.report-links-body h3 a:visited,
.report-links-body h3 a:active {
    text-decoration: none;
    color: white;
}

/* #report_viewer_account_codes_form button:hover { */
/* background: rgba(255, 255, 255, 0.2); */
/* } */

.whyzen-theme-config-select {
    height: 40px;
    margin-left: 15px;
    /*color: #8FCAE7 !important;*/
    color: #FFFFFF !important;
    /* background-color: #003359 !important; */
    letter-spacing: .5px !important;
    /*font-weight: bold;*/
    text-transform: none;
    font-size: 16px !important;
    /*font-family: 'PROXIMA NOVA SEMIBOLD';*/
    /*font-variant: small-caps;*/
}

#report_viewer_account_codes_form button[disabled] {
    cursor: initial;
    opacity: 0.5;
}

h3.top-level {
    /* smaller margins */
    /* margin-bottom: 6px;
            margin-top: 6px; */
    /* paddings so they don't collapse */
    padding-top: 6px;
    padding-bottom: 6px;
    margin: 0px;
    height: 30px;
}

h3.top-level-link {
    height: 36px;
}


/* FROM C:\TFS\StandardUI\Master_NAnderson\UI\UI\assets\css\bhi_styles.css */


.bhi-qlik-state-band {
    border-left: 1px solid #eaeaea;
    /* #c1c1c1; */
    width: 36px;
    overflow: hidden;
}

.bhi-qlik-state-band .selected-icon,
.bhi-qlik-state-band .locked-icon,
.bhi-qlik-state-band .not-selected-icon,
.bhi-qlik-state-band .no-matching-qlik-value-icon {
    display: none;
    font-size: 14px;
    position: relative;
    top: 0;
    transform: translate(0, 0);
    color: white;
    width: inherit;
    text-align: center;
    line-height: 36px;
}

.bhi-qlik-state-band .not-selected-icon {
    color: orange;
}

[data-qlik-state="A"] .not-selected-icon,
/* Excluded selected */
[data-qlik-state="XS"] .not-selected-icon,
[data-qlik-state="XL"] .not-selected-icon,
[data-qlik-state="X"] .not-selected-icon

/* [data-qlik-state="O"]  */
    {
    /* cuz background is dark-grey */
    /* color: #ffef7c; */
    color: white;
}

.bhi-qlik-state-band .no-matching-qlik-value-icon {
    color: black;
    /* color: grey; */
}


/* Selected */
[data-qlik-state="S"],
[data-qlik-state="L"] {
    background-color: #52cc52;
}

/* Alternative */
[data-qlik-state="A"] {
    background-color: #ddd;
}

[data-qlik-state="O"] {
    /* background-color:inherit; */
    background-color: transparent;
}

[data-qlik-state="X"],
/* Excluded selected */
[data-qlik-state="XS"],
[data-qlik-state="XL"] {
    background-color: #a9a9a9;
}

[data-qlik-state="S"] .selected-icon,
[data-qlik-state="XS"] .selected-icon,
[data-qlik-state="XL"] .selected-icon,
/*-
        https://help.qlik.com/en-US/sense-developer/February2019/Subsystems/EngineAPI/Content/Sense_EngineAPI/GenericObject/LayoutLevel/SelectionObject.htm
        https://help.qlik.com/en-US/sense-developer/November2019/Subsystems/EngineAPI/Content/Sense_EngineAPI/GenericObject/LayoutLevel/ListObject.htm
        -*/
[data-qlik-state="A"] .not-selected-icon,
[data-qlik-state="O"] .not-selected-icon,
[data-qlik-state="X"] .not-selected-icon,
[data-qlik-state="D"] .not-selected-icon,
/*--*/
.no-matching-qlik-value .no-matching-qlik-value-icon,
[data-qlik-state="L"] .locked-icon {
    display: inline-block;
}


/* For a cheap, animated loader 
        TODO: Remove our ellipsis and use this instead 
        https://loading.io/css/
        */

/* 
    Just use the crl
        .lds-ellipsis {
            display: inline-block;
            position: relative;
            width: 80px;
            height: 80px;
        }
    
        .lds-ellipsis div {
            position: absolute;
            top: 33px;
            width: 13px;
            height: 13px;
            border-radius: 50%;
            background: #fff;
            animation-timing-function: cubic-bezier(0, 1, 1, 0);
        }
    
        .lds-ellipsis div:nth-child(1) {
            left: 8px;
            animation: lds-ellipsis1 0.6s infinite;
        }
    
        .lds-ellipsis div:nth-child(2) {
            left: 8px;
            animation: lds-ellipsis2 0.6s infinite;
        }
    
        .lds-ellipsis div:nth-child(3) {
            left: 32px;
            animation: lds-ellipsis2 0.6s infinite;
        }
    
        .lds-ellipsis div:nth-child(4) {
            left: 56px;
            animation: lds-ellipsis3 0.6s infinite;
        }
    
        @keyframes lds-ellipsis1 {
            0% {
                transform: scale(0);
            }
    
            100% {
                transform: scale(1);
            }
        }
    
        @keyframes lds-ellipsis3 {
            0% {
                transform: scale(1);
            }
    
            100% {
                transform: scale(0);
            }
        }
    
        @keyframes lds-ellipsis2 {
            0% {
                transform: translate(0, 0);
            }
    
            100% {
                transform: translate(24px, 0);
            }
        } */


.no-results-hint {
    min-height: 100px;
    /* background-color: #0101011c; */
    background-color: rgba(1, 1, 1, 0.1);
    border: 2px dashed grey;
    text-align: center;
    color: black;
    /* font-weight: bolder; */
    font-size: 1.5em;
    /* padding-top: 20px;
            padding-bottom: 20px; */
    /* Give a *bit* of side-padding */
    padding: 20px 5px;
    font-style: italic;
    margin-bottom: 10px;
    /**/
}

/* .sidebar-nav only applies to My Work */
/* .sidebar-nav .no-results-hint { */
#sidebar-wrapper .no-results-hint {
    background-color: #03182f;
    font-size: 16px;
    color: white;
}

/* .sidebar-nav only applies to My Work */
/* 9/14/2020 Donna's point about the icons */
/* .sidebar-nav li .lui-icon { */
#sidebar-wrapper li .lui-icon {
    margin-right: 5px;
}

.no-results-hint p {
    margin: 0px;
    padding: 0px;
}

li.no-results-hint {
    min-height: inherit;
}

.lui-popover-container ul:not(.one-list-item) {
    max-height: 200px;
    overflow-y: scroll;
}

.lui-popover-container li {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}



.lui-popover-container .lui-list__item.bhi-action-choice {
    cursor: pointer;
}

.lui-popover-container .bhi-action-top-menu .lui-list__item {
    min-height: 30px;
    height: 30px;
    background-color: #f2f2f2;
}

.lui-popover-container .lui-list__item.bhi-action-item {
    /* padding:10px; */
    padding-top: 10px;
}

.lui-popover-container .lui-list__item.bhi-action-item.remove {
    padding-top: 0px;
    /* the margin on button is sufficient, because removed the text 1-24-2020 1/24/2020 */
}

.lui-popover-container .lui-list__item.bhi-action-item button {
    /* 1-24-2020 1/24/2020 prefer left aligned see Donna feedback */
    /* float: right; */
    margin: 10px 0px;
    min-width: 100px;
    /* From Donna feedback, to give padding between this and .float-right message on the left */
    /* Nope not needed */
    /* margin-left: 20px; */
}



/* It could list */
.lui-popover-container .lui-list__text {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.lui-popover-container .lui-list__text.wrap {
    overflow: inherit;
    /* 
        initial doesnt work either 
        white-space: unset;
        text-overflow: unset; */
    white-space: inherit;
    text-overflow: inherit;
}

.lui-popover-container .whyzen-cascade-menu-arrow {
    border-left: 1px solid #dfdfdf;
    padding-left: 6px !important;
    padding-right: 6px !important;
    height: 100%;
    margin: 0px;
    /* display: block; */
    float: inherit;
    height: 36px;
    line-height: 36px;
}

/* 
        .whyzen-cascade-menu-arrow:hover {
        } */
.lui-popover-container .is-has-active-cascade-submenu .whyzen-cascade-menu-arrow,
.lui-popover-container.whyzen-cascade-menu-arrow:hover {
    background-color: #b0b0b0;
    cursor: pointer;
}

/* .lui-list__item .lui-list__aside.lui-icon { */
.lui-popover-container .lui-list__item .lui-list__aside.lui-icon:first-child {
    /* So that everything is aligned */
    /* width: 36px; */
    /* https://qlik-oss.github.io/leonardo-ui/icons.html */
    /* lui-icon lui-icon--script-ok is quite wide:  */
    width: 40px;
}


.lui-popover-container .lui-popover {
    /* They are now cascading menus:
            https://jira.bluehealthintelligence.com/browse/WHYZ-2183
             */
    /* min-width: 350px;
            max-width: 350px; */
    /* but I wanna stay *below* the delete luiDialog "Are you sure?" message */
    /* And also below the .page-hider */
    z-index: 1020;
    /*
        not sure what I was trying to get above
        z-index:10001;
        */
}

.lui-popover-container .bhi-action-top-menu .bhi-action-choice {
    font-weight: bolder;
}


/* for qlik navigation on the left */
li.is-current-qlik-object {
    /* background: #008aff!important;
            border-top: 2px solid black;
            border-bottom: 1px solid black;
            position: relative; */
    background: #008aff !important;
    border-width: 2px 0px !important;
    /* position: relative; */
    border-color: #005cbd !important;
    display: block;
    border-style: solid !important;
}

/* in case we want to absolutely-position a right-angle arrow */
/* li.is-current-qlik-object {
            background: #9ee8ee;
        }
    
        li.is-current-qlik-object a {
            color: #031b34 !important;
        } */

/* li.is-current-qlik-object:after {
            content: " ";
            display: block;
            position: absolute;
            width: 20px;
            height: 20px;
            background: white;
            right: -10px;
            top: 10px;
        } */


/* Only in internet exporer ? */
.qs-version-nov2018.is-ie .lui-icon--remove::before {
    /* otherwise shows the re-order icon... strange */
    /* .lui-icon--up-down::before
            because of capitalization */
    /* content: " E"; */
    text-transform: uppercase;
}

/* Donna wanted a trash icon */
/* Didn't notice it on Leonardo */
/* replaced with lui-icon--bin */
.lui-icon.lui-list__aside.fa.fa-trash {
    font-size: 20px;
}



/*------------------*/
/*------------------*/
/*------------------*/

.whyzen-filtered-resources-ui-scroll-popover {
    width: 400px;
}

.whyzen-filtered-resources-ui-scroll-popover.is-separate-access-levels {
    width: 600px;
}

/* 
        .whyzen-filtered-resources-ui-scroll-popover [ui-scroll-viewport] {
    
        } 
        */
/* .whyzen-filtered-resources-ui-scroll-popover .gridded-items-container { */
/* display: flex; */
/* min-width: 100px; */
/* min-width: 110px; */
/* }
    */
.whyzen-filtered-resources-ui-scroll-popover .checkbox-col {
    min-width: 55px;
    max-width: 55px;
    text-align: center;
    padding: 0px;
}


.lui-checkbox__check.bhi-access-level {
    font-family: 'QlikView Sans';
    font-weight: bolder;
}

.lui-checkbox__check.bhi-access-level-read:after,
.lui-checkbox__input:checked+.lui-checkbox__check-wrap .lui-checkbox__check.bhi-access-level-read:after {
    content: "R";
}

.lui-checkbox__check.bhi-access-level-publish:after,
.lui-checkbox__input:checked+.lui-checkbox__check-wrap .lui-checkbox__check.bhi-access-level-publish:after {
    content: "P";
}

.whyzen-filtered-resources-ui-scroll-popover .filtered-resource-container {
    /* display: flex;
            flex-direction: column; */
    overflow: hidden;
    position: relative;
}

.whyzen-filtered-resources-ui-scroll-popover .filtered-resource-container:not(.one-list-item),
/* https://jira.bluehealthintelligence.com/browse/WYSD-1207
    Moving Sheets: Need Scroll bar when more than 20 folders in My Work
     */
.app-object-group-list.lui-list:not(.one-list-item) {
    /* height: 400px;
            max-height: 400px; */
    height: 360px;
    max-height: 360px;
    min-height: 360px;
}

.app-object-group-list.lui-list:not(.one-list-item) {
    overflow-y: scroll;
}

.whyzen-filtered-resources-ui-scroll-popover .filtered-resource-container>[ui-scroll-viewport] {
    /* height: 600px; */
    /* max-height: initial; */
    /* while loading it may cause the container to "jump around"*/
    /* min-height: 360px;
            max-height: 360px;
            height: 360px; */
    height: 100%;
    min-height: 100%;
    display: block;
    /* overflow-y: scroll; */
    /* make sure the scrollbar horizontal space always there: */
    overflow-y: scroll !important;
}

/* padding: 5px 10px; */

.whyzen-filtered-resources-ui-scroll-popover .filtered-resources .filtered-resource:hover {
    cursor: pointer;
    background-color: rgba(0, 0, 0, 0.02);
}


.whyzen-filtered-resources-ui-scroll-popover .filtered-resource-header,
.whyzen-filtered-resources-ui-scroll-popover .filtered-resources .filtered-resource {
    display: flex;
    height: 40px;
    border-bottom: 1px solid #cacaca;
    /* line-height: 30px; */
    font-size: 1.1em;
    line-height: 30px;
}

.is-separate-access-levels .lui-checkbox .lui-checkbox__input:checked+.lui-checkbox__check-wrap .lui-checkbox__check,
.is-separate-access-levels .lui-checkbox .lui-checkbox__input:indeterminate+.lui-checkbox__check-wrap .lui-checkbox__check {
    /* change from the Qlik green to the color of a BHI blue button */
    background: #3f8ab3;
}

.is-separate-access-levels .lui-checkbox .lui-checkbox__input:checked[disabled]+.lui-checkbox__check-wrap .lui-checkbox__check,
.is-separate-access-levels .lui-checkbox .lui-checkbox__input:indeterminate[disabled]+.lui-checkbox__check-wrap .lui-checkbox__check {
    background: rgba(0, 0, 0, .1);
}

.whyzen-filtered-resources-ui-scroll-popover .highlighted {
    /* change from the Qlik green to the color of a BHI blue button */
    color: #3f8ab3 !important;
}

.whyzen-filtered-resources-ui-scroll-popover .filtered-resource-header {
    /* background-color: #7a7a7a; */
    /* color of a disabled button: */
    /* background-color: #8cb9d1; */

    /* color: white; */
    font-weight: bolder;
    /* Needs to be tall enough to fit the "sort" icons in it: */
    /* height: 28px; */

    height: 32px;
    /* so the arrows on the bottom */
    margin-bottom: 5px;
    /* so the scrollbar on .filtered-resource-container beneath this .filtered-resource-header */
    padding-right: 8px;
}

.whyzen-filtered-resources-ui-scroll-popover .filtered-resource-header>* {
    /* for the sort-icon positioning */
    position: relative;
}

.whyzen-filtered-resources-ui-scroll-popover .filtered-resource-header .sort-icon {
    position: absolute;
    bottom: 0;
    left: 50%;
    /* line-height: 12px; */
    line-height: 6px;
    color: black;
    /* to vertically center it */
    margin-left: -6px;
    z-index: 100;
}

.whyzen-filtered-resources-ui-scroll-popover .filtered-resource-header .sort-icon[data-sort-dir="DESC"] {
    bottom: -8px;
}

/* For "sorting" functionality */
.whyzen-filtered-resources-ui-scroll-popover .filtered-resource-header>*:hover {
    /* background-color: #4e4e4e; */
    /* color of navigation on the left */
    /* background-color: #003359; */
    /* color of lighter-navigation on the left */
    /* background-color: #005172; */
    /* // too much: */
    /* background: linear-gradient(0deg, rgba(140,185,209,1) 0%, rgba(0,81,114,1) 100%); */
    /* background-color: #497e9b; */
    /* background-color: #6f9ab0; */
    background-color: rgb(200, 200, 200);
    cursor: pointer;
}
/* but override on bulk delete */
.whyzen-filtered-resources-ui-scroll-popover .no-hover.filtered-resource-header>*:hover {
    background-color: inherit;
    cursor: default;
}

.whyzen-filtered-resources-ui-scroll-popover .padded-auto {
    padding: 10px;
    height: auto;
}

.whyzen-filtered-resources-ui-scroll-popover .filtered-resource-header>*:active {
    /* background-color: #003359; */
    background-color: rgb(180, 180, 180);

}

.whyzen-filtered-resources-ui-scroll-popover .filtered-resource-header .filtered-resource-label,
.whyzen-filtered-resources-ui-scroll-popover .filtered-resources .filtered-resource .filtered-resource-label {
    flex: 1;
    /* for the background shading */
    padding-left: 4px;
}

.whyzen-filtered-resources-ui-scroll-popover .filtered-resource-header .filtered-resource--right-align,
.whyzen-filtered-resources-ui-scroll-popover .filtered-resources .filtered-resource .filtered-resource--right-align {
    flex: 1;
    text-align: right;
    padding-right: 4px;
}

/* .whyzen-filtered-resources-ui-scroll-popover:not(.app-object-list) .filtered-resources li.filtered-resource>span { */
.whyzen-filtered-resources-ui-scroll-popover .filtered-resources li.filtered-resource>span {
    /* padding: 5px 10px; */
    padding: 5px;
    text-overflow: ellipsis;
    overflow: hidden;
}


.whyzen-filtered-resources-ui-scroll-popover .filtered-resources li.filtered-resource>span.lui-list__aside {
    flex: none;
}

.whyzen-filtered-resources-ui-scroll-popover .filtered-resources li.filtered-resource>span.left-margin

/* .whyzen-filtered-resources-ui-scroll-popover .filtered-resources li.filtered-resource>span:first-child */
    {
    margin-left: 5px;
}

.whyzen-filtered-resources-ui-scroll-popover .filtered-resources .lui-checkbox,
.whyzen-filtered-resources-ui-scroll-popover .filtered-resource-header .lui-checkbox {
    /* margin: 0px 10px; */
    /* margin-left: 10px;
        margin-right: 10px; */
    /* using padding instead , so if user clicks in padding area, it will activate/deactivate checkbox*/
    padding-left: 10px;
    padding-right: 10px;
}

/* bhi-qlik.css line 100 .dtsearch-table-wrapper .highlighted, .highlighted { */
.whyzen-filtered-resources-ui-scroll-popover .highlighted {
    padding: 1px;
    color: white !important;
}

.whyzen-filtered-resources-ui-scroll-popover .lui-search {
    border-bottom: 2px solid rgba(0, 0, 0, 0.2);
}

/*TODO Dont I have bhi-bottom-actions somewhere else */
.whyzen-filtered-resources-ui-scroll-popover .bhi-actions {
    padding: 10px;
}

.whyzen-filtered-resources-ui-scroll-popover .bhi-actions .small {
    font-size: 10px;
    padding-bottom: 0;
}

.whyzen-filtered-resources-ui-scroll-popover .bhi-actions button {
    margin-right: 10px;
}

.whyzen-filtered-resources-ui-scroll-popover .bhi-actions .float-right {
    float: right;
    font-size: 12px;
    text-align: right;
}

.whyzen-filtered-resources-ui-scroll-popover .bhi-actions .float-right .secret-link {
    /* opacity: 0; */
    text-decoration: underline;
}

.whyzen-filtered-resources-ui-scroll-popover .bhi-actions .float-right .secret-link:hover {
    /* Donna likes these secret links, so they shouldnt be hidden */
    /* opacity: 1; */
    cursor: pointer;
}

.batch-delete-popover .lui-checkbox {
    width: 100%;
    font-weight: normal;
}

.batch-delete-popover .filtered-resource-header {
    margin-bottom: 0;
}

.batch-delete-popover .filtered-resource {
    align-items: center;
}

/* .whyzen-filtered-resources-ui-scroll-popover  */
.all-badge {
    padding: 5px;
    border-radius: 20px;
    margin-right: 10px;
    background-color: #52a2cc !important;
}

.is-mode-inapplicable {
    /* background-color: #e2e2e2; */
    background-color: #e2e2e2 !important;
}

.info-badge {
    /* background-color:rgb(0, 0, 0); */
    background-color: #e2e2e2;
    height: 24px;
    margin-top: 5px;
    /* line-height: 24px; */
    padding: 0px 5px;
    line-height: 24px;
    margin-top: 8px;
    min-width: 24px;
    text-align: center;
    border-radius: 30px !important;
    display: block;
    margin-right: 5px;
}

/* flex: 1; */
/* .whyzen-filtered-resources-ui-scroll-popover .filtered-resource-container>* {
        } */
.lui-icon--more.pending-action {
    vertical-align: middle;
    margin-right: 10px;
    background: #dddddd;
    height: 30px;
    line-height: 30px;
    border-radius: 20px;
    width: 30px;
    text-align: center;
    margin-top: 3px;
}

.whyzen-filtered-resources-ui-scroll-popover .filtered-resource--no-results {
    text-align: center;
    font-size: 1.5em;
    height: 60px;
    /* line-height: 80px; */
    /* padding: 10px; */
    padding: 0px 10px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    line-height: 40px;
    position: absolute;
    z-index: 2;
    text-align: center;
    left: 0;
    right: 0;
    top: 50%;
    bottom: 0;
    transform: translate(0px, -50%);
}

.whyzen-filtered-resources-ui-scroll-popover .filtered-resources .filtered-resource--no-results:hover {
    cursor: initial;
    background-color: transparent;
}

.whyzen-filtered-resources-ui-scroll-popover ul.non-scroll-list {
    overflow-y: hidden;
}

/*
     app-object-group-list ; see 
     lists in popovers, where only one can be selected
    C:\TFS\PSI\Whyzen_Q1_2019\IISServer\whyzenanalytics.com\whyzen\html\whyzen-app-object-menu-add-move-to-group-template.html
    C:\TFS\PSI\Whyzen_Q1_2019\IISServer\whyzenanalytics.com\whyzen\html\whyzen-app-object-menu-publish-unpublish-template.html
    */

.app-object-group-list li:hover .lui-icon--close {
    display: block;
}

.app-object-group-list li:hover .lui-icon--tick,
.app-object-group-list li .lui-icon--close {
    display: none;
}

/* For when the aside is hidden */
.app-object-group-list .lui-list__aside.ng-hide+.lui-list__text {
    padding-left: 10px;
}

.app-object-group-list .lui-list__aside {
    width: 36px;
    display: block;
    box-sizing: border-box;
    /* */
    text-align: center;
}

/* Interaction between 
        .app-object-group-list.filtered-resources
        */
/* .app-object-group-list.filtered-resources li.filtered-resource>span.lui-list__text {
            padding: 0px;
        } */
.disclaimer-paragraph a {
    color: inherit;
    text-decoration: underline;
}

/* For KPIs */
/* 2)	In one of my script, I am printing the KPI values before and after the session selection selected and my script is failing to recognize the below pointed number after the selections are made even (it is fine before the selections). The only thing that I noticed is the KPIs display before and after the session selection is little different even though the numbers are same. */
.qlik-kpi-panel .qvobject [dir="auto"] {
    white-space: nowrap;
}

/* 10/26/2020 Deepti email
        After selecting an account when the landing page is opening, noticed that sometimes the web elements are highlighted in blue though it goes away when the page is fully loaded
        */
.summary-info-loading-message,
.disclaimer-paragraph,
.whyzen-logo,
.bhi-kpi-title,
.navbar-brand,
.navbar-brand img,
.user-info *,
.user-select-none {
    /* .noselect { */
    -webkit-touch-callout: none;
    /* iOS Safari */
    -webkit-user-select: none;
    /* Safari */
    -khtml-user-select: none;
    /* Konqueror HTML */
    -moz-user-select: none;
    /* Firefox */
    -ms-user-select: none;
    /* Internet Explorer/Edge */
    user-select: none;
}

/* 1/24/2021 because whyzen-sla-utility will add this element even in IIS */
.whyzen-error-screen {
    display: none !important;
    opacity: 0;
}

.searchbox-container {
    display: flex;
}

.searchbox-container input[name="dtsearch"] {
    flex: 1;
    width: auto;
}

.searchbox-container .fa-close {
    text-align: center;
    padding-left: 10px;
    line-height: 32px;
}

/* to stop the "pipe" from being highlighted in upper-right */

.user-info {
    user-select: none;
}

/* To fix issue with the session-selection
7/29/2021 from Donna:
 > I want to watch this in the next environment not sure you need to do anything here unless it's a bug – see how when you click in a Session selection the up/down arrow shifts in to the left? 
*/
.select2-container--default.select2-container--focus .select2-selection--multiple {
    padding-right: 0px;
}

.lui-toast-service--bhi-warning .lui-toast-service {
    background-color: rgb(185, 0, 0);
}

.lui-toast-service {
    /* https://jira.bluehealthintelligence.com/browse/WYSD-1403 */
    bottom: auto;
    top: 20px;
    /* consistent with whyzen 2.0 (?) */
    background-color: #0099cc;
}

.lui-toast__aside {
    /* https://jira.bluehealthintelligence.com/browse/WYSD-1403?focusedCommentId=60434&page=com.atlassian.jira.plugin.system.issuetabpanels:comment-tabpanel#comment-60434 */
    font-weight: bolder;
    /* background-color: #e5e8e9; */
    background-color: #005172 !important;
    border-radius: 3px;
}

.app-object-folder-label .fa-level-up {
    /* https://jira.bluehealthintelligence.com/browse/WYSD-753?focusedCommentId=66353&page=com.atlassian.jira.plugin.system.issuetabpanels%3Acomment-tabpanel#comment-66353  */
    /* 3. Currently the way the search is displayed (left) - It makes me think that the sheet is either in 2 CC's or sub categories especially if I'm a user searching and do not know the CC/sub CC structure just yet. I'm wondering if there is some way we can do some type of left arrow icon (I looked in the UI Overview>Leonardo url and the only thing I can find close to what I'm thinking is the select alternate icon but as the name indicates that represents select alternative and I'm not sure that's appropriate) like in the snap on the right? */


    transform: rotate(90deg);
    font-size: 20px;
    margin: 0px;
    padding-right: 0px;

}


/* using angular ng-bind-html instead so the message can be specific */
/* .whyzen-warning-watermark-message:after {
     content: "Be careful"; 
 }   */

.whyzen-warning-watermark-message {
    display: block;
    position: absolute;
    z-index: 100;
    right: 0;
    left: 0;
    text-align: center;
    font-weight: bolder;
    pointer-events: none;

    /* top: 0;
    bottom: 0;
    opacity: 0.25;
    font-size: 8em;
    padding: 10%; */


    /* from within whyzen: */
    /* top: 80px; */
    /* from the mashup: */
    top: 146px;
    /*---*/
    padding: 10px;
    box-sizing: Border-box;
    /* font-size: 2em; */
    /* should 
     - fit in the grey space next to title, when in Sheet "Analysis" mode
     - fit in the selections bar when in "Selection Tool" mode
     - it overlaps if in Sheet "Edit" mode BUT ; see requirement to hide the message on entering edit mode
     */
    /* font-size: 1em; */
    font-size: 1.25em;

    opacity: 1;
    /* color: orange; */
    color: #ec8e00;
    max-width: 50%;
    margin: auto;
}

.sl-toast-stack {
    left: 50%;
    transform: translateX(-50%);
    z-index: 2000;
    top: 20px;
    width: fit-content;
}

sl-alert::part(message) {
    font-size: 14px;
}

/* Feb 2024 adding styling that is no longer in qlik-styles.css */
body,button,input,isindex,keygen,select,textarea {
    color: #595959;
    font-family: Source Sans Pro,sans-serif;
    font-size: 14px
}