/*
=== OVERRIDING DEFAULT DOM ===
*/

body {
  display: flex;
  min-height: 100vh;
  flex-direction: column;
}

@media screen and (max-width: 992px) {
  body {
    padding-bottom: 80px;
  }
  #workflow .center {
    height:51px;
  }
}

main {
  flex: 1 0 auto;
  /* padding-top: 30px;*/
}

.title {
  display: none;
}
.titleMini {
  display: inherit;
}

@media screen and (min-width: 993px) {
  main {
    margin-left: 300px;
    padding-left: 10px;
    /* padding: 40px 20px 70px 20px; */
  }
  .title {
    display: inherit;
  }
  .titleMini {
    display: none;
  }
}

footer {
  position: fixed;
  bottom: 0;
  right: 0;
  width: 100%;
  padding-top: 0 !important;
  z-index: 99;
}

@media screen and (max-width: 576px) {
  footer {
    display: none;
  }
  #workflow .center {
    height:51px;
  }
}

h6 {
  font-size: 20px !important;
}



/*
=== OVERRIDING MATERIALIZE ===
*/

label.active {
  color: #1976d2 !important;
}

.side-nav li a.active {
  background-color: #ddd;
}

input:focus {
  border-bottom: 1px solid #1976d2 !important;
  box-shadow: 0 1px 0 0 #1976d2 !important;
}

@media screen and (min-width: 993px) {
  .nav-wrapper {
    padding-left: 300px;
  }
}

input[type="radio"]:checked + label:after {
  border: 2px solid #1976d2 !important;
  background-color: #1976d2 !important;
}

.switch label input[type="checkbox"]:checked + .lever {
  background-color: #2196f3;
}

.switch label input[type=checkbox]:checked+.lever:after {
  background-color: #1976d2;
}

.btn {
  background-color: #1976d2 !important;
  color: white;
}

.btn:hover {
  background-color: #2196f3 !important;
}

.btn-warn {
  background-color: #f57c00 !important;
  color: white !important;
}

.btn-warn:hover {
  background-color: #ff9800 !important;
  color: white !important;
}

.btn-danger {
  background-color: #c62828 !important;
  color: white !important;
}

.btn-danger:hover {
  background-color: #e53935 !important;
  color: white !important;
}
.btn-sec {
  background-color: #29b6f6 !important;
  color: black !important;
}

.btn-sec:hover {
  background-color: #4fc3f7 !important;
  color: black !important;
}

.btn-grp {
  margin: 1px 3px !important;
}

.col-align {
  padding-top: 20px !important;
}

.input-field .prefix.active {
  color: #1976d2 !important;
}

.dropdown-content li a {
  color: black !important;
}

.card-image a i {
  cursor: default !important;
}

/* TODO */
.top-logo img {
  max-width: 170px;
    background-color: #1e88e5 !important;
}


.top-logo {
  background-color: #1e88e5 !important;
  color: white !important;
  min-height: 64px;
  padding-left: 20%;
}

.top-logo:hover {
  color: white !important;
  background-color: #1e88e5 !important;
}

.message-text {
  color: grey;
  float: right;
  font-size: 12px;
  font-style: italic;
}

#modalDetails, #modalModif {
  min-width: 300px;
  max-width: 600px;
}

ul#user-dropdown {
  min-width: 187px !important;
}



/*
=== FUNCTIONS ===
*/
.under {
  text-decoration: underline !important;
}
.required {
  color: #b71c1c ;
}
.bold {
  font-weight: bold;
}



/*
=== AUTOCOMPLETE ===
*/
.autocomplete-suggestions {
  box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14),0 1px 5px 0 rgba(0,0,0,0.12),0 3px 1px -2px rgba(0,0,0,0.2);
  line-height: 40px;
  background-color: white;
  overflow: hidden;
}

.autocomplete-suggestion {
  padding: 6px 10px 6px 10px;
  cursor: pointer;
  color: #2081D7;
}

.autocomplete-suggestion strong {
  color: black;
  font-weight: normal;
}

.autocomplete-selected {
  background: #F0F0F0;
  z-index: 100;
}



/*
=== SELECTIVITY ===
*/
.selectivity-single-select, .selectivity-multiple-input-container {
  background-color: white;
  border-bottom: 1px solid #9e9e9e;
  margin-top: -30px;
  margin-bottom: 18px;
}

.selectivity-results-container, .selectivity-dropdown,
.selectivity-result-item,
.selectivity-result-item .highlight:hover,
.selectivity-result-item:hover {
  border-radius: 1px !important;
  line-height: 120%;
}

.selectivity-result-item.highlight,
.selectivity-result-item.highlight:hover {
  background-color: #ddd;
  color: black;
}

.selectivity-dropdown {
  overflow: hidden !important;
  height: 30% !important;
  margin-top: -40px;
}

.selectivity-single-result-container {
  top: 3.3em;
  left: 2px;
}

.selectivity-label {
  top: 0 !important;
}

input.selectivity-single-select-input, label.selectivity-label {
  cursor: pointer;
}

.selectivity-multiple-selected-item, .selectivity-multiple-selected-item.highlighted {
  background-color: #2081D7;
}

/* Custom Selectivity */
.selectivity-label-custom {
  color: #1976d2 !important;
  -webkit-transform: translateY(-80%);
  transform: translateY(-80%);
  font-size: 12px !important;
}

.selectivity-label-border-custom {
  border-bottom: 1px solid #4CAF50 !important;
  box-shadow: 0 1px 0 0 #4CAF50 !important;
}

.selectivity-multiple-input {
  margin: 0 !important;
}

.selectivity-multiple-input-container {
  margin-top: 20px;
  padding: 0;
}

/* Custom Selectivity Specific */
#roles .selectivity-dropdown {
  overflow: hidden !important;
  height: 30% !important;
  margin-top: 0;
}

#roles div.selectivity-dropdown:nth-child(3) {
  max-width: 400px !important;
}



/*
=== DATATABLE ===
*/
@media screen and (max-width: 576px) {
  .col_responsive {
    display: none;
  }
  #workflow .center {
    height:51px;
  }
}

.paginate_button.previous i, .paginate_button.next i {
  font-size: 34px;
}

.paginate_button.previous, .paginate_button.next {
  vertical-align: middle;
}

.paginate_button {
  border: none !important;
  font-weight: bold;
  box-shadow: none !important;
  background: white !important;
  color: black !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
  color: black !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
  background: #1976D2 !important;
  color: white !important;
}

table.dataTable tbody tr:hover td,
table.dataTable tbody tr:hover th {
  background-color: white !important;
}

table.dataTable thead tr th {
  border-bottom: 1px solid #ddd;
}
table.dataTable tfoot tr th {
  border-top: 1px solid #ddd;
}



/*
=== FANCYTREE ===
*/
tr.fancytree-has-children a.editor_remove {
  display: none;
}

#tree {
  width: 100%;
}

#colNom {
  width: 73%;
}

#colAction {
  width: 27%;
}

#tree tbody tr:hover {
  background-color: transparent;
  outline:none !important;
}

#tree, #tree tbody, #tree tbody tr, .fancytree-title, #tree tbody:hover, #tree tbody tr:hover {
  background-color: transparent;
  border: none !important;
  outline: none !important;
}

#tree .fancytree-folder td {
  border: none;
  border-top: 1px solid #EDEDED;
  border-bottom: 1px solid #EDEDED;
}

.fancytree-expander {
  color: red !important;
}

span.fancytree-icon, span.fancytree-checkbox, span.fancytree-expander, span.fancytree-radio, span.fancytree-custom-icon {
  margin-top: 7px !important;
}



/*
=== DATE PICKER ===
*/
.picker__date-display {
  background-color: #9c27b0;
}

.picker__weekday-display {
  background-color: #7b1fa2;
}

.picker__month-display {
  font-size: 1rem;
}

.picker__day-display {
  font-size: 3.5rem;
}

.picker__nav--prev:hover, .picker__nav--next:hover {
  background-color: transparent;
}

.picker__today, .picker__clear {
  transition: .2s ease-out;
  color: #1976D2;
}

.picker__close {
  transition: .2s ease-out;
  color: #388e3c;
}

.picker__close:hover {
  background-color: transparent;
  transition: .2s ease-out;
  color: #4caf50;
}

.picker__today:hover, .picker__clear:hover {
  transition: .2s ease-out;
  background-color: transparent;
  color: #2196F3;
}

.picker__day--today {
  color: #2196F3 !important;
}

.picker__day--selected {
  background-color: #2196F3 !important;
}

.picker__day--today.picker__day--selected {
  color: white !important;
}



/*
=== CUSTOM ===
*/
.section-header {
  margin-bottom: 15px;
}

.list-header {
  margin-bottom: -35px;
  margin-top: -20px;
}

@media screen and (max-width: 600px) {
  .div-autocomplete {
    margin-top: 65px;
  }
  #workflow .center {
    height:51px;
  }
}

#password-info {
  cursor: default !important;
}

.footer-logo {
  vertical-align: middle;
}

.footer-infos {
  display: inline-block;
}

.material-icons-small {
  font-size: 20px;
  vertical-align: middle;
}

.badge-collection {
  margin: 0 !important;
  width: 0 !important;
}

.collection-thin {
  margin: 0 !important;
  border-bottom: 1px solid #ddd;
  padding: 8px 0;
}

#app-version {
  box-shadow: 1px 1px 1px 1px #ddd !important;
}

.collapsible-item {
  padding-left: 74px !important;
}

.material-tooltip {
  white-space: pre;
}


/*
Sticky table header
*/
.component {
  line-height: 1.5em;
  margin: 0 auto;
  /*    width: 90%;
      max-width: 1000px;*/
  overflow: hidden;
}
.component .filler {
  font-family: "Blokk", Arial, sans-serif;
  color: #d3d3d3;
}
#workflow,.sticky-wrap table {
  border-collapse: collapse;
  width: 100%;
  background: #fff;
}
#workflow,.sticky-wrap td, th {
  text-align: center;
}
td.err {
  background-color: #e992b9;
  color: #fff;
  font-size: 0.75em;
  text-align: center;
  line-height: 1;
}
#workflow,.sticky-wrap th {
  background-color: #31bc86;
  font-weight: bold;
  color: #fff;
  white-space: nowrap;
}
#workflow,.sticky-wrap tbody th {
  background-color: #2ea879;
}
#workflow,.sticky-wrap tbody tr:nth-child(2n-1) {
  background-color: #f5f5f5;
  transition: all .125s ease-in-out;
}
#workflow,.sticky-wrap tbody tr:hover {
  background-color: rgba(129,208,177,0.3);
}

#workflow tr:hover{
  background-color: #bdbdbd;
}

/* For appearance */
.sticky-wrap {
  overflow-x: auto;
  overflow-y: auto;
  position: relative;
  width: 100%;
  max-height: 550px;
}
.sticky-wrap .sticky-thead,
.sticky-wrap .sticky-col,
.sticky-wrap .sticky-intersect {
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  transition: all .125s ease-in-out;
  z-index: 50;
  width: auto; /* Prevent table from stretching to full size */
}
.sticky-wrap .sticky-thead {
  box-shadow: 0 0.25em 0.1em -0.1em rgba(0,0,0,.125);
  z-index: 100;
  width: 100%; /* Force stretch */
}
.sticky-wrap .sticky-intersect {
  opacity: 1;
  z-index: 150;

}
.sticky-wrap .sticky-intersect th {
  background-color: #666;
  color: #eee;
}
.sticky-wrap td,
.sticky-wrap th {
  box-sizing: border-box;
}

/* Not needed for sticky header/column functionality */
td.user-name {
  text-transform: capitalize;
}
.sticky-wrap.overflow-y {
  overflow-y: auto;
  max-height: 50vh;
}

@media screen and (max-height: 700px) {
  .sticky-wrap {
    height: 450px;
  }
}

@media screen and (max-height: 576px) {
  .sticky-wrap {
    height: 250px;
  }
}

#workflow [type="checkbox"]:checked + label::before {
  top: -4px;
  left: -5px;
  width: 12px;
  height: 22px;
  border-top: 2px solid transparent;
  border-left: 2px solid transparent;
  border-right: 2px solid red;
  border-bottom: 2px solid red;
  -webkit-transform: rotate(40deg);
  transform: rotate(40deg);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform-origin: 100% 100%;
  transform-origin: 100% 100%;
}

caption {
  display: none;
}

.cardlumiere {
  height: 105px;
  padding: 10px;
}
.icondomotique {
  position: absolute;
  top: 6px;
  right: 6px;
}

.capteur {
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
}
.temperature {
  width: 48%;
  font-size: 1em;
  color: white;
  padding: 3px;
  border-radius: 3px;
}
.temperature::after {
  content: " °";
}

.humidite {
  width: 48%;
  font-size: 1em;
  color: white;
  padding: 3px;
  border-radius: 3px;
}
.humidite::after {
  content: " %";
}
.card .card-content {
  padding-top: 5px;
  padding-left: 0px;
  padding-right: 0px;
  padding-bottom: 10px;
}

.card .card-action {
  padding-top: 10px;
  padding-left: 0px;
  padding-right: 0px;
  padding-bottom: 10px;
  text-align: center;
}

span.badge {
  margin-left: 2px;
}