/* Dashboards */
@import url('dashboard.css');
@import url('buildingEditors.css');

/* */
body {
  font-family: Arial, helvetica, sans-serif;
  /* #UIV2 */
  /* font-family: "Poppins", helvetica, sans-serif; */
}

/* these are used to resize font-icons when necessary */
.s12 { font-size: 12px; }
.s16 { font-size: 16px; }
.s20 { font-size: 20px; }
.s24 { font-size: 24px; }
.s32 { font-size: 32px; }
.s48 { font-size: 48px; }

.navbar { border-radius:0; }
.nav.navbar-nav.navbar-right { margin-right: 8px; }

/* required to put dialogs over the map */
md-backdrop.md-dialog-backdrop { z-index: 999; }
.md-dialog-container { z-index: 1000; }

.main-menu { 
    z-index: 10000;
    height: 100%!important;
    overflow-y: auto!important;
}
/* [@role="tooltip"] { z-index: 11000; } */

.active { color: red; font-weight: bold }

.flex-h {
  display: flex;
  flex-flow: row nowrap;
  align-items: flex-start;
}

div.alert-container {
    position: fixed;
    top: 5em;
    left: 50%;
    transform: translate(-50%, 0);
    z-index: 99999; 
    border-radius: 0px
}

label { overflow: visible !important; }

div.tabContent {
    background-color: #f8f8f8;
}

md-sidenav {
  overflow: visible;
}

.md-toolbar-tools[draggable=true] {
    cursor: pointer;
}

md-backdrop.md-select-backdrop {
    z-index:1051;
}

.md-select-menu-container {
    z-index:1052;
}

.md-virtual-repeat-container.md-autocomplete-suggestions-container {
    z-index:1051;
}

div.md-toolbar-tools md-input-container {
    background-color: rgb(255,255,255);
}
div.md-toolbar-tools md-input-container md-select-value .md-text {
    color: rgb(0,0,0);
}


img.thumbnail {
    width: 96px;
    height: 96px;
    object-fit: scale-down;
}
.md-sidenav-left .preview {
    height: 196px;
    width: 196px;
    object-fit: scale-down;
}


search-people-comp,
locate-comp,
demo-comp,
positions-simulator-comp{
    height: 100%;
}
locate-comp .viewBody,
demo-comp .viewBody {
    width: 100%;
}

bf-table .watermark {
    font-size: 12px;
}

.easy-button-button.selected {
    background-color: #c8c8ff;
}
.easy-button-button.selected:hover {
    background-color: #d8d8ff;
}
.md-sidenav-backdrop {
    z-index: 9999;
}

/* debug */
/*
locate-comp .layout-column,
locate-comp .layout-row {
    background-color: rgba(0,0,0,0.05);
}
*/

/************************************************
 * editor area
 ***********************************************/
div#editArea {
    position: relative;
}

section.editorToolbar {
    display: block;
    position: absolute;
    top: 4px;
    left: 20px;
    margin: 0px;
    padding: 0px;
    background-color: transparent;
    color: rgb(49, 46, 46);
    text-transform: none;
    font-size: 16px;
    font-weight: 400;
    z-index: 1048;
}

.editorToolbar.md-button {
    display: block;
    min-height: 48px;
    min-width: 48px;
    background-color: white;
    margin: 0px;
}

.editorToolbar.md-button.top {
    border-radius: 10px 10px 0 0;
    border-top: 1px solid black;
    border-left: 1px solid black;
    border-right: 1px solid black;
}

.editorToolbar.md-button.middle {
    border-radius: 0;
    border-left: 1px solid black;
    border-right: 1px solid black;
}

.editorToolbar.md-button.bottom {
    border-radius: 0 0 10px 10px;
    border-left: 1px solid black;
    border-bottom: 1px solid black;
    border-right: 1px solid black;
}

.editorToolbar.md-button.single {
    border-radius: 10px 10px 10px 10px;
    border: 1px solid black;
}

.editorToolbar.md-button:not([disabled]):hover {
    background-color: white;
    color: rgb(44, 65, 164);
    transition: 0.3s;
}
.editorToolbar.md-button:not([disabled]).md-focused {
    background-color: white;
    color: rgb(44, 65, 164);
    transition: 0.3s;
}
*:focus{
    border: none;
    outline: none;
}
section.zoomToolbar {
    display: block;
    position: absolute;
    top: 20px;
    right: 20px;
    margin: 0px;
    padding: 0px;
    background-color: transparent;
    color: rgb(49, 46, 46);
    text-transform: none;
    font-size: 16px;
    font-weight: 400;
    z-index: 1048;
}

md-grid-tile-footer > figcaption { width: 100%; min-width: 100%; }

section.zoneToolbar {
    display: block;
    position: absolute;
    top: calc(50% - 80px);
    left: 20px;
    margin: 0px;
    padding: 0px;
    background-color: transparent;
    color: rgb(49, 46, 46);
    text-transform: none;
    font-size: 16px;
    font-weight: 400;
    z-index: 1048;
}

section.editorHelp {
    display: block;
    position: absolute;
    top: 20px;
    left: calc(30% / 2);
    width: calc(70%);
    text-align: center;
    margin: 0px;
    padding: 0px;
    background-color: white;
    color: rgb(49, 46, 46);
    text-transform: none;
    font-size: 16px;
    font-weight: 400;
    z-index: 1048;
    border-radius: 5px;
    border: 1px solid black;
}

section.breadcrumb {
    display: block;
    position: absolute;
    bottom: 20px;
    right: 20px;
    margin: 0px;
    padding: 4px;
    background-color: white;
    color: rgb(49, 46, 46);
    text-transform: none;
    font-size: 16px;
    font-weight: 400;
    z-index: 1048;
    border-radius: 5px;
    border: 1px solid black;
}

md-grid-tile-header figcaption, md-grid-tile-footer figcaption  {
    width: 100%;
}


:root{
    --c-building:#bcbcbc;
    --c-level:#b0b0cc;
    --c-zone:#a8caa8;
}

.atixeBuilding{
    background: #bcbcbc;
    border-radius: 0.5em;
    padding:0.5em;
    margin: 0 0.5em;
}
.atixeLevel{
    background: #b0b0cc;
    border-radius: 0.5em;
    padding:0.5em;
    margin: 0 0.5em;
}
.atixeZone{
    background: #a8caa8;
    border-radius: 0.5em;
    padding:0.5em;
    margin: 0 0.5em;
}

.md-button.md-default-theme.md-raised:not([disabled]):hover, .md-button.md-raised:not([disabled]):hover {
    background-color: rgb(250,250,250);
}
.md-button.md-raised:not([disabled]) {
    box-shadow: 0 2px 5px 0 rgba(0,0,0,.26);
}

md-toolbar.mainToolbar, md-toolbar.mainToolbar md-icon {
    background-color: var(--c-bg-primary-dark)!important;
    color: var(--c-fg-primary-light)!important;
}
md-toolbar.v2:not(.mainToolbar) {
    background-color: #ffffff!important;
    color: var(--c-bg-primary-dark)!important;
    /* color: #dedede; */
    border-bottom: 1px solid var(--c-bg-primary-dark)!important;
}
/*---------------------------------------------------------------------------------------- Directives CSS */
/* @import url('../directives/index.css'); */ /* do not load, css link set in index.php */


/* md-toolbar{
    min-height: 48px;
    height: 48px;
} */
md-toolbar h1{
    padding-left:1em;
    white-space:nowrap;
    text-overflow: ellipsis;
}


/* Params Panel */
.params{
    z-index:1100;
    position:relative
}
.params h3 {
    width: 80%;
    border-bottom: 1px solid;
}
.params md-input-container {
    margin: 0;
    text-align: left;
    width: 80%;
}
.params .md-button {
    margin: 0;
    text-align: left;
    width: 80%;
    border: 1px solid;
    background: #ffffff;
    color: #000000;
}
.params md-slider-container {
    margin: 0;
    text-align: left;
    width: 80%;
}
.params md-slider.md-default-theme.md-warn .md-track.md-track-fill, .params md-slider.md-warn .md-track.md-track-fill {
    background-color: rgb(250,250,250);
}
.params md-slider.md-default-theme.md-warn .md-thumb:after, .params md-slider.md-warn .md-thumb:after {
    border-color:  rgb(250,250,250);
    background-color:  rgb(250,250,250);
}
.params md-checkbox.md-default-theme.md-checked .md-icon, .params md-checkbox.md-checked .md-icon {
    background-color: rgb(250 250 250);
}
.params md-checkbox.md-default-theme.md-checked .md-icon:after, .params md-checkbox.md-checked .md-icon:after {
    border-color: rgb(69 90 100);
}
.params md-radio-button.md-default-theme .md-on, .params md-radio-button .md-on {
    background-color: rgb(250 250 250);
}
.params md-radio-button.md-default-theme.md-checked .md-off, .params md-radio-button.md-checked .md-off {
    border-color: rgb(250 250 250);
}

.params md-input-container.md-default-theme .md-input, .params md-input-container .md-input{
    color: rgb(250 250 250);
}
.params md-input-container.md-default-theme:not(.md-input-invalid).md-input-has-value label, .params md-input-container:not(.md-input-invalid).md-input-has-value label {
    color: rgb(250 250 250);
}
button.historyBackButton{
    border-radius: 0.5em!important;
    border: 1px solid #d0d0d0;
    background: #f0f0f0;
}
button.historyBackButton:hover{
    background: #808080;
    color: #ffffff;
}
button.historyBackButton md-icon {
    color: #3f51b5!important;
}
.md-panel-outer-wrapper{
    z-index:30000!important;
    /* font-size:   2em!important; */
    /* #CHECK */
}
.md-panel.md-tooltip {
    opacity: 1;
    font-size: 12px;
    letter-spacing: 1px;
    font-weight: normal!important;
    font-family: Arial, helvetica, sans-serif;
    border: 1px solid #ffffff;
    pointer-events:none!important;
}
 .md-panel.md-tooltip > * {
    pointer-events:none!important;
}
.titleContainer{
    display: flex;
    align-items: center;
}
.titleInfoContainer{
    font-size: 0.75em;
    text-align: right;
    padding-right: 2em;
    justify-content: flex-end;
}



/* ----- TMP / TEST - General quick UI adjustments */
/* Reduce entity forms */
/*
[item] > form > [block-ui] > [ng-include] {
    max-width: 75em;
    margin: 0 auto;
    border: 2px solid #d0d0d0;
    padding: 1em;
}
*/

/* Slider */

bf-geo-explorer .sideNavContainer  md-switch.md-default-theme.md-checked:not([disabled]) .md-thumb, md-switch.md-checked:not([disabled]) .md-thumb {
    /*background-color: #9ca7b8;*/
    background-color: #ffffff;
}
bf-geo-explorer .sideNavContainer  md-switch.md-default-theme.md-checked:not([disabled]) .md-bar, md-switch.md-checked:not([disabled]) .md-bar {
    background-color: rgba(156,167,184,0.5);
}
bf-geo-explorer .sideNavContainer  md-switch.md-default-theme .md-thumb, md-switch .md-thumb{
    background-color: rgb(156, 167,184);
}
bf-geo-explorer .sideNavContainer  md-slider.md-default-theme .md-sign:after, md-slider .md-sign:after {
    border-top-color: rgb(156, 167,184);
}
bf-geo-explorer .sideNavContainer  md-slider.md-default-theme .md-sign, md-slider .md-sign {
    background-color: rgb(40, 52, 69);
}
bf-geo-explorer .sideNavContainer  md-slider.md-default-theme .md-track.md-track-fill, md-slider .md-track.md-track-fill {
    background-color: rgb(156, 167,184);
}
bf-geo-explorer .sideNavContainer  md-slider.md-default-theme .md-focus-ring, md-slider .md-focus-ring {
    background-color: rgba(156, 167,184,0.2);
}
bf-geo-explorer .sideNavContainer  md-slider.md-default-theme .md-thumb:after, md-slider .md-thumb:after {
    border-color: rgb(156, 167,184);
    background-color: rgb(156, 167,184);
}















/* TEST before generalized implementations */

/*  bfTable with genericSearchTextField */
.genericSearchText{
    background-color: #fafafa!important;
    border-radius: .5em;
    height: 2em;
    padding-right: 0.5em!important;
    margin-left: 1em;
}
.genericSearchText md-icon{
    margin-left: 0.25em;
}
.genericSearchText input{
    font-size: 0.75em;
}

/* bfTables */
bf-table{
    border: 1px solid #dcdcdc;
    padding: 0!important;
    border-radius: 0 0.5em 0.5em 0.5em;
    overflow: hidden;
    margin: 8px;
}
.dashboardContent bf-table{
    border:0 none;
}
arz-entity-selection .md-de-widget-tile{
    box-shadow: 0 0!important;
    border: 1px solid #dcdcdc;
    width: 100%!important;
    height: 100%!important;
}

bf-table.noBorder{
    border: 0 none;
}
bf-table  thead{
    background: #ffffff;
}   
bf-table  md-toolbar{
    /* border-bottom: 1px solid #d0d0d0; */
}
bf-table bf-search{
    background: linear-gradient(#d2d2d2, #f0f0f0 5%, #f0f0f0 95%, #d2d2d2 );
    /* border-bottom: 1px solid #d0d0d0; */
    font-size: 0.75em;
}
bf-table tbody tr:hover {
    background: #ffffff;
}
bf-table .md-table-pagination {
    background: #ffffff;
    justify-content: center;
    font-weight: bold;
}





/* bfTable preferences */
.bfTableSettings {
    font-size: 0.5em;
}
.bfTableSettings md-content{
    overflow: visible;
} 

.bfTableSettings md-checkbox {
    min-width: 130px;
    min-height: 32px;
    background: #ffffff;
}
.bfTableSettings md-checkbox .md-container{
    margin: 16px 3px 3px;
}
/* Standard layouts: test with no padding */
ui-view > .layout-padding{
    padding: 0;
} 


bf-table .filterSummary{
    color: rgba(0, 0, 0, 0.87)!important;
    border-radius: 0.5em 0 0 0.5em!important;
    background: linear-gradient( 90deg, rgb(197, 202, 233) 20%, transparent 90%)!important;
    padding-right: 0!important;
}

bf-table ::-webkit-scrollbar-thumb {
    border-radius: 10px;
    /* -webkit-box-shadow: inset 0 0 6px rgb(0 0 0 / 30%); */
    background-color: #737373;
    border: 4px solid #fafafa;
    /* padding: 0 2px; */
    /* margin: 0 2px; */
}

bf-table ::-webkit-scrollbar-track {
    /* -webkit-box-shadow: #808080; */
    -webkit-box-shadow:none!important;
    border-radius: 10px;
    background-color: #fafafa!important;
}
table.md-table{
    /* background: #ffffff!important; */
}

#positionsSimulator md-tabs{
    height: 100%;
}
#positionsSimulator md-table-container{
    height:80%!important;
    min-height:  200px;
    overflow: auto;
}

#positionsSimulator md-input-container{
    margin: 4px 0!important;
}
#positionsSimulator .md-button{
    height: 1em!important;
    line-height: 0!important;
}


/* HOT FIXES - Alerts notifier */
.alertsPanel{
    width: 400px!important;
}

.alertsPanel .md-list-item{
    margin: 0;
}
.alertsPanel .md-badge{
    color: rgb(0, 0, 0);
    background-color: rgb(241, 196, 15);
    font-weight: bold;
    padding: 0.25em 1em 1.25em 1em;
    font-size: 1em;
    color: #000000!important;
    min-width: 7em;
    /* background: #ff9800!important; */
    border-radius: 0.25em;
}

bf-accordion-ext{
    border: 1px solid #d0d0d0;
    margin: 8px 0 0 0px;
    padding: 8px;
    border-radius: 0.5em 0 0;
    background: #ffffff;
    border-left: 4px solid #99cdfe;
    border-right: 0;
}

arz-entity-selection .bfGeoTracker{
    width: auto!important;
    overflow: hidden;
    border: 1px solid #d0d0d0;
    /* border-radius: 0 0.5em; */
    height: 100%;
    width: 100%;
    border-left: 4px solid #d0d0d0;
    margin: 0 0 8px 0;
    border-radius: 0 0 0 0.5em;
}


arz-entity-selection .periodSelector{
    background: #ffffff;
    border-left: 4px solid #99cdfe75;
    padding-left: 1.4em;
    align-items: center;
}
arz-entity-selection .periodSelector.firstLine{
    border: 1px solid #d0d0d0;
    padding: 8px;
    border-radius: 0.5em 0 0;
    background: #ffffff;
    border-left: 4px solid #99cdfe;
    /* border-right: 0; */
}
arz-entity-selection .periodSelector md-input-container{
    margin-bottom: 8px;
}
arz-entity-selection .periodSelector md-input-container .md-errors-spacer{
    display: none;
}
arz-entity-selection .periodSelector md-input-container md-switch{
    margin: 0;
}


arz-report-options .aggregationSelector{

    background: #ffffff;
    border-left: 4px solid #99cdfe75;
    padding-left: 1.4em;
}
arz-report-options .aggregationSelector md-input-container{
    margin-bottom: 8px;
}
arz-report-options .aggregationSelector md-input-container .md-errors-spacer{
    display: none;
}
arz-report-options .aggregationSelector md-input-container md-switch{
    margin: 0;
}

.peopleTimeDashboard > div{
    width: auto!important;
    overflow: hidden;
    border: 1px solid #d0d0d0;
    /* border-radius: 0 0.5em; */
    height: 100%;
    width: 100%;
    border-left: 4px solid #d0d0d0;
    margin: 0 0 8px 0;
    border-radius: 0 0 0 0.5em;
}
.peopleTimeDashboard bf-table{
    border: 0 none;
    margin:0!important;
    /*  */
}
.peopleTimeDashboard arz-report-options{
    background: #ffffff;
    border-left: 4px solid #99cdfe75;
    padding-left: 1.4em;
    padding: 0!important;
}
.peopleTimeDashboard arz-report-options  md-input-container{
    margin-bottom: 8px;
}
.peopleTimeDashboard arz-report-options md-input-container .md-errors-spacer{
    display: none;
}
.peopleTimeDashboard arz-report-options  md-input-container md-switch{
    margin: 0;
}

/* To generalize like: */
.contentFilter .firstLine{
border: 1px solid #d0d0d0;
    margin: 8px 0 0 0px;
    padding: 8px;
    border-radius: 0.5em 0 0;
    background: #ffffff;
    border-left: 4px solid #99cdfe;
    border-right: 0;
}




arz-distance > div{
    padding: 0!important;
}

arz-entity-selection{
    padding:0!important;
}


md-backdrop.md-sidenav-backdrop {
    z-index: 10000;
}



/********************************************************
 * time charts
 ********************************************************/
 .timeChart .bb-title tspan { font-size: 10px; }
 .timeChart .bb-title tspan:first-child { font-size: 14px; font-weight: bold; }
 .timeChart billboard { padding: 0px !important; height: 280px; }





 /* BACKOFFICE & FORMS */
 @media (min-width: 1200px){
    form[name=itemForm] {
         background: #f0f0f0;
        }
    form[name=itemForm] md-content{
        background:#ffffff;
    }
    form[name=itemForm] bf-header {
        background: #ffffff;
        padding: 0 1.25em;
        border-bottom: 1px solid #d0d0d0;
    }
    form[name=itemForm] bf-header > div.header {
        border: 0 none;
    }
    form[name=itemForm] div[ng-include=itemTemplate] {
        width: 70%;
        margin: 0 auto;
        background: #ffffff;
        /* border: 1px solid #d0d0d0; */
    }
    form[name=itemForm] md-content.layout-fill._md.flex {
        /* background: red; */
        overflow-x: hidden;
        padding: 0 1em;
        /* border-bottom: 1px dotted #d0d0d0; */
    }
    form[name=itemForm] bf-form {
        border-bottom: 1px solid #d0d0d0;
    }
}
@media (min-width: 1280px){
    form[name=itemForm] div[ng-include=itemTemplate] {
        width: 60%;
    }
}




md-toolbar.md-default-theme:not(.md-menu-toolbar), md-toolbar:not(.md-menu-toolbar) {
    /* background-color: rgb(63,81,181); */
    background-color: rgb(47, 52, 82);
    color: rgb(255,255,255);
}

p.tip{
    border: 1px dotted #03a9f4;
    padding: 0.5em;
    border-radius: 0.5em;
    background: #03a9f420;
    padding-left: 2em;
    position: relative;
}
p.tip:before {
    content: "lightbulb";
    font-family: "Material Icons";
    position: absolute;
    left: 0.25em;
    top: 0.35em;
    font-size: 1.25em;
    color: #03a9f4;
}
p.info{
    border: 1px dotted #03a9f4;
    padding: 0.5em;
    border-radius: 0.5em;
    background: #03a9f420;
    padding-left: 2em;
    position: relative;
}
p.info:before {
    content: "info";
    font-family: "Material Icons";
    position: absolute;
    left: 0.25em;
    top: 0.35em;
    font-size: 1.25em;
    color: #03a9f4;
}
p.warning{
    border: 1px dotted #ff8000;
    padding: 0.5em;
    border-radius: 0.5em;
    background: #ff800020;
    padding-left: 2em;
    position: relative;
}
p.warning:before {
    content: "warning";
    font-family: "Material Icons";
    position: absolute;
    left: 0.25em;
    top: 0.35em;
    font-size: 1.25em;
    color: #ff8000;
}
p.error{
    border: 1px dotted #aa2000;
    padding: 0.5em;
    border-radius: 0.5em;
    background: #aa200020;
    padding-left: 2em;
    position: relative;
}
p.error:before {
    content: "warning";
    font-family: "Material Icons";
    position: absolute;
    left: 0.25em;
    top: 0.35em;
    font-size: 1.25em;
    color: #aa2000;
}
p.success{
    border: 1px dotted #00aa00;
    padding: 0.5em;
    border-radius: 0.5em;
    background: #00aa0020;
    padding-left: 2em;
    position: relative;
}
p.success:before {
    content: "check_circle";
    font-family: "Material Icons";
    position: absolute;
    left: 0.25em;
    top: 0.35em;
    font-size: 1.25em;
    color: #00aa00;
}

bf-watermark div[ng-switch-when=empty] {
    font-size: 12px;
}

.bf-autocomplete-template .bfAutocompleteItem .item-metadata.namespace {
    font-size: 0.75em!important;
    font-style: italic;
    position: absolute;
    bottom: -4px!important;
    right: -16px!important;
    border-radius: 4px;
    border: none!important;
    background-color:transparent!important;
    /* border-color: #99999E; */
    /* border-width: 2px; */
    /* border-style: solid; */
    /* background-color: #CCCCD3; */
    position: relative;
}

.bf-autocomplete-template .item-metadata .label {
    display: inline-block;
    background-color: #f8f8f8;
    padding: 0px 4px 0px 4px;
    margin-bottom: 2px!important;
    margin-right: 0!important;
    border-radius: 2px;
    /* font-size: small; */
    font-weight: bold;
    color: #686868;
    border-left: thin solid #c8c8c8;
    border-top: thin solid #c8c8c8;
    border-right: none;
    border-bottom: none;
}
bf-autocomplete .bfAutocompleteItem.selectedItem .item-metadata.namespace {
    font-size: 10pt;
    font-style: italic;
    position: absolute;
    bottom: 12px!important;
    right: 8px!important;
}