/* Début composant FAB search button */
.search-component-open {
  width: 75% !important;
}
#search-component {
  position: fixed;
  bottom: 56px;
  right: 26px;
  z-index: 2;
  width: 50px;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: stretch;
}
#search-component .search-component-element {
  display: inline-flex;
}
#search-component #search-element-button {
  z-index: 10001;
  background-color: #00677F;
}
#search-component #search-element {
  position: relative;
  height: 50px;
  border-top-left-radius: 50px;
  border-bottom-left-radius: 50px;
  background-color: #58585a;
  right: -25px;
  /* proprietes affichage input */
  opacity: 0;
  visibility: hidden;
  display: none;
  flex-grow: 2;
}
#search-component #search-element #search-element-container {
  width: 100%;
  display: flex;
  align-content: start;
  flex-direction: row;
  flex-wrap: nowrap;
}
#search-component #search-element .ui-input-text {
  position: relative;
  height: 30px;
  top: 10px;
  bottom: 10px;
  border-style: none !important;
  margin: 0px !important;
  background-color: #58585a !important;
  color: white !important;
  width: 100%;
  padding-right: 30px;
  padding-left: 5px;
}
#search-component #search-element .ui-input-text:after {
  content: none;
}
#search-component #search-element #element-to-search {
  color: white !important;
  text-shadow: 0 0px 0 white !important;
}
#search-component #search-element #element-to-search::placeholder {
  color: white !important;
  text-shadow: 0 0px 0 white !important;
}
#search-component #validation-element {
  display: inline-flex;
  opacity: 0;
  visibility: hidden;
  z-index: 3;
}
#search-component #validation-element #validation-button {
  background-color: #00677F;
}
/* Fin composant FAB search button */
/* Animation affichage zone de recherche */
.show-search-element {
  animation-name: show-search-element;
  animation-duration: 1s;
  animation-fill-mode: forwards;
}
.hide-search-element {
  animation-name: hide-search-element;
  animation-duration: 1s;
  animation-fill-mode: forwards;
}
@keyframes show-search-element {
  0% {
    opacity: 0;
    visibility: hidden;
  }
  1% {
    visibility: visible;
  }
  100% {
    opacity: 1;
    visibility: visible;
  }
}
@keyframes hide-search-element {
  0% {
    opacity: 1;
    visibility: visible;
  }
  99% {
    opacity: 0;
    visibility: hidden;
  }
  100% {
    visibility: hidden;
  }
}
/* Fin animation affichage zone de recherche */
/* Animation bouton validation recherche */
.show-validation-element {
  animation-name: show-validation-element;
  animation-duration: 1s;
  animation-fill-mode: forwards;
}
.hide-validation-element {
  animation-name: hide-validation-element;
  animation-duration: 1s;
  animation-fill-mode: forwards;
}
@keyframes show-validation-element {
  0% {
    opacity: 0;
    visibility: hidden;
  }
  1% {
    visibility: visible;
  }
  100% {
    opacity: 1;
    visibility: visible;
  }
}
@keyframes hide-validation-element {
  0% {
    opacity: 1;
    visibility: visible;
  }
  99% {
    opacity: 0;
  }
  100% {
    visibility: hidden;
  }
}
/* Fin animation bouton validation recherche */
/* Animation icone recherche en cours */
.search-element-button-active {
  animation-name: search-element-button-active;
  animation-duration: 1s;
  animation-fill-mode: forwards;
}
.search-element-button-inactive {
  animation-name: search-element-button-inactive;
  animation-duration: 1s;
  animation-fill-mode: forwards;
}
@keyframes search-element-button-active {
  0% {
    box-shadow: 0px 0px 0px 0px;
  }
  100% {
    box-shadow: 0px 0px 0px 5px rgba(233, 94, 58, 0.6);
  }
}
@keyframes search-element-button-inactive {
  0% {
    box-shadow: 0px 0px 0px 5px rgba(233, 94, 58, 0.6);
  }
  100% {
    box-shadow: 0px 0px 0px 0px;
  }
}
/* Fin animation icone recherche en cours */
/* Début taille des libellés */
label {
  font-size: 16px !important;
  color: black !important;
}
/* Fin taille des libellés */
/* Début désactiver une élément cliquable */
.disabled-content {
  pointer-events: none;
  opacity: 0.5;
}
/* Fin désactiver une élément cliquable */
/* Début composant liste de boutons */
.ui-content .action-button-list .list-btn {
  position: fixed;
  bottom: 26px;
  z-index: 1001;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  visibility: hidden;
  opacity: 0;
}
.ui-content .action-button-list #list-btn-left {
  left: 30px;
  justify-content: flex-start;
  align-items: flex-start;
}
.ui-content .action-button-list #list-btn-right {
  right: 30px;
  justify-content: flex-end;
  align-items: flex-end;
}
.ui-content .action-button-list .ui-btn-fab-bottom {
  position: fixed;
  bottom: 26px;
  width: 50px;
  height: 50px;
  padding: 0px;
  z-index: 1002;
  background-color: #58585a !important;
}
.ui-content .action-button-list .ui-btn-fab-left {
  left: 26px;
}
.ui-content .action-button-list .ui-btn-fab-right {
  right: 26px;
}
.ui-content .action-button-list .ui-btn-fab-bottom-option {
  right: 0px;
  width: 40px !important;
  height: 40px !important;
  padding: 0px;
  margin-bottom: 10px;
  z-index: 10001;
  background-color: #58585a !important;
}
.ui-content .action-button-list .ui-btn-fab-bottom-filter-option {
  background-color: white !important;
}
.ui-content .action-button-list .filtreActif {
  color: #00677F !important;
}
.ui-content .action-button-list .filtreInactif {
  color: #58585a !important;
}
.ui-content .buttonSlideUp {
  animation-duration: 1s;
  animation-name: buttonSlideUp;
  animation-fill-mode: forwards;
}
.ui-content .buttonSlideDown {
  animation-duration: 1s;
  animation-name: buttonSlideDown;
  animation-fill-mode: forwards;
}
@keyframes buttonSlideUp {
  0% {
    bottom: 26px;
    opacity: 0;
    visibility: hidden;
  }
  1% {
    visibility: visible;
  }
  100% {
    bottom: 110px;
    opacity: 1;
    visibility: visible;
  }
}
@keyframes buttonSlideDown {
  0% {
    bottom: 110px;
    opacity: 1;
    visibility: visible;
  }
  99% {
    bottom: 26px;
    opacity: 0;
  }
  100% {
    visibility: hidden;
  }
}
/* Fin boutons filtre */
/*Variables*/
/* début Mixins*/
/*Fin Mixins*/
.input-error {
  font-size: 12px;
  font-style: italic;
  margin-bottom: 16px;
}
/*css pour que les trait en dessous des inputs ne dépassent pas*/
form {
  position: relative;
}
.card-info {
  text-align: center;
}
/* début CSS Intervention */
.intervention-section {
  margin-top: 1em !important;
  margin-bottom: 1em !important;
}
.intervention-property {
  /*design pour les geoloc*/
}
.intervention-property .intervention-value {
  position: relative;
}
.intervention-property .intervention-value > div {
  position: relative;
}
.intervention-property .intervention-value > div.row > div {
  position: relative;
}
.intervention-property .intervention-value > div.row > div > div {
  position: relative;
}
.intervention-property .intervention-value img {
  max-height: 200px;
  max-width: 100%;
}
.intervention-property span.disabled {
  color: #58585a;
  opacity: 0.3;
}
.intervention-property .row-geoloc label {
  text-align: center;
}
.intervention-property .row-geoloc .btn-geoloc {
  width: auto;
  text-align: center;
  margin: auto;
}
.intervention-property .intervention-property-label {
  white-space: normal;
}
.intervention-component .component-value div {
  position: relative;
}
.intervention-component .component-icon {
  text-align: center;
}
.intervention-information .information-value {
  color: grey;
  font-style: italic;
  font-size: 14px;
  margin-bottom: -12px;
  margin-left: 10px;
  margin-right: 10px;
}
.intervention-information .information-value span {
  color: grey;
  font-style: italic;
  font-size: 14px;
  margin-bottom: -12px;
  margin-left: 8px;
  white-space: normal;
}
/* fin CSS Intervention */
/* début CSS Footer */
div[data-role=footer] div.footer-btn {
  padding: 0px;
}
div[data-role=footer] a {
  display: inline-block;
  width: 100%;
  border-radius: 0px;
  padding-top: 15px;
  padding-bottom: 15px;
  padding-left: 0px;
  padding-right: 0px;
}
.has-footer {
  margin-bottom: 30px;
}
/* fin CSS Footer */
/* Début design général*/
body {
  /*pages*/
  /*header*/
  /*Panel*/
  /*Style des listview*/
  /*Style des card*/
  /*Style des boutons flotant*/
}
body div[data-role=page] {
  background-color: #e6e6e6;
  background-position: bottom left;
  background-repeat: no-repeat;
  min-height: 95% !important;
}
body div[data-role=page] li.intervention-property .ui-radio-on,
body div[data-role=page] li.intervention-property .ui-flipswitch-active {
  background-color: #00677F !important;
}
body div[data-role=page] li.intervention-property .ui-link {
  color: #00677F !important;
}
body div[data-role=header] {
  background-color: #00677F !important;
  border-bottom: 0.25em solid #00677F !important;
}
body div[data-role=header] img#logo {
  display: none;
}
@media only screen and (min-width: 48em) {
  body div[data-role=header] img#logo {
    display: inline-block;
    max-height: 60px;
    margin: 8px;
  }
}
body .clr-btn-adding {
  background-color: #00677F !important;
  color: white !important;
}
body div[data-role=panel] {
  /* background du profil*/
  /*Lien de deconnexion*/
  /*Lien de changement d'agent*/
}
body div[data-role=panel] .profile-background {
  background-color: #00677F;
}
body div[data-role=panel] .clr-btn-adding {
  background-color: #00677F;
}
body div[data-role=panel] .nd2-sidepanel-profile:after {
  background: -moz-linear-gradient(top, rgba(255, 255, 255, 0.01) 0%, #00677F 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0.01)), color-stop(100%, #00677F));
  background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.01) 0%, #00677F 100%);
  background: -o-linear-gradient(top, rgba(255, 255, 255, 0.01) 0%, #00677F 100%);
  background: -ms-linear-gradient(top, rgba(255, 255, 255, 0.01) 0%, #00677F 100%);
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.01) 0%, #00677F 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#03ffffff', endColorstr='#b0391d', GradientType=0);
}
body div[data-role=panel] #bottom-panel-listview {
  position: absolute;
  bottom: 0px;
  right: 1em;
  left: 1em;
}
body div[data-role=panel] li.dark-listitem {
  color: white;
}
body div[data-role=panel] li.dark-listitem a {
  background-color: #58585a;
}
body div[data-role=panel] li.dark-listitem a:hover {
  background-color: #58585a;
}
body div[data-role=panel] #logout-listitem a {
  padding-top: 25px;
  padding-bottom: 25px;
}
body div[data-role=panel] #agent-choose-listview {
  margin-bottom: 1.5em;
}
body div[data-role=panel] .nd2-sidepanel-profile {
  margin-bottom: 0px;
}
body [data-role=listview] {
  background-color: white;
}
body [data-role=listview] li[data-role=list-divider] {
  color: #00677F;
  padding: 15px;
  border-bottom: 1px solid;
  text-transform: uppercase;
}
body [data-role=listview] li h2 {
  color: #58585a;
}
body .nd2-card {
  background-color: white;
}
body .nd2-card-fluid {
  background-color: white;
  display: block;
  border-radius: 4px;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}
body .ui-btn.ui-btn-inline.ui-btn-fab.ui-btn-fab-bottom.ui-btn-raised.clr-primary {
  background-color: #00677F;
}
/* Fin design général*/
/* Début Design signature */
.btn.btn-circle {
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  width: 50px;
  height: 50px;
  margin: auto;
}
.btn.btn-circle span {
  position: relative;
}
.btn.btn-circle.btn-color span {
  display: none;
  color: white;
  position: relative;
  left: -3px;
}
.btn.btn-circle.btn-color.btn-color-black {
  background-color: #000000;
}
.btn.btn-circle.btn-color.btn-color-black:hover {
  background-color: #000000;
}
.btn.btn-circle.btn-color.btn-color-red {
  background-color: #FF0000;
}
.btn.btn-circle.btn-color.btn-color-red:hover {
  background-color: #FF0000;
}
.btn.btn-circle.btn-color.btn-color-green {
  background-color: #00FF00;
}
.btn.btn-circle.btn-color.btn-color-green:hover {
  background-color: #00FF00;
}
.btn.btn-circle.btn-color.btn-color-blue {
  background-color: #0000FF;
}
.btn.btn-circle.btn-color.btn-color-blue:hover {
  background-color: #0000FF;
}
.btn.btn-circle.btn-color.btn-color-white {
  background-color: #FFFFFF;
}
.btn.btn-circle.btn-color.btn-color-white:hover {
  background-color: #FFFFFF;
}
.btn.btn-circle.btn-color.btn-color-white span {
  color: black;
}
.btn.btn-circle.btn-color.selected span {
  display: inline;
}
.signature-prop {
  display: block;
  text-align: center;
  z-index: 0;
}
.signature-prop img {
  margin: 2px;
  display: block;
  width: auto;
  padding: 5px;
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}
/* css pour le canvas de saisie manuscrite */
#saisie_manuscrite canvas,
.canvasDrawing {
  display: block;
  max-width: 640px;
  max-height: 480px;
  width: 100%;
  border: 1px solid #00677F;
  margin: auto;
  margin-bottom: 10px;
  margin-top: 10px;
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}
/* fin design signature */
/* début photo */
.photo-prop-item {
  z-index: 0;
  text-align: center;
  display: block;
}
.photo-prop-item img {
  margin: 2px;
  display: block;
  width: auto;
  padding: 5px;
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}
#photo {
  max-width: 640px;
  padding: 0px;
}
#photo video.photoAPI {
  display: block;
  max-width: 100%;
  max-height: 480px;
  border: 1px solid #00677F;
  margin: auto;
  margin-bottom: 10px;
  margin-top: 10px;
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}
.is-canvas-drawing {
  display: none;
}
.is-camera {
  width: auto;
}
.is-camera.centered {
  justify-content: center;
}
.is-camera span {
  margin: 0px 10px;
  display: inline-block;
  position: relative;
  top: -60px;
  margin-bottom: -44px;
  color: #00677F;
  background-color: rgba(255, 255, 255, 0.7);
  border-color: #00677F;
  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
}
.is-camera span:hover {
  color: white;
  background-color: rgba(234, 92, 52, 0.7);
  border-color: #00677F;
}
/* fin photo */
/* début positionnement du toast */
.nd2-toast {
  margin-bottom: 50px;
  z-index: 4;
}
/* fin toast */
/* début désactivation de lien */
.disable-link {
  pointer-events: none;
}
/* fin désactivation de lien */
/* Début style bouton suppression */
.boutonSupContainer {
  position: relative;
}
.boutonSupContainer .boutonSup {
  position: absolute;
  right: 10px;
  bottom: 10px;
  z-index: 1;
}
/* Fin style bouton suppression */
/* Début style gestion pending(_full)/done(_full) */
.etat-not-full {
  color: #00677F;
}
.etat-full {
  color: #0bcd7d;
}
/* Fin style gestion pending(_full)/done(_full) */
/* Début style bouton rond */
.ui-content .ui-btn-fab {
  width: 50px;
  height: 50px;
  padding: 0px;
}
.ui-content .ui-btn-fab i {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
/* Fin style bouton rond */
/* Début masquer des informations */
.hide-content {
  display: none;
}
/* Fin masquer des informations */
/* Début afficher des informations */
.show-content {
  display: flex;
}
/* Fin afficher des informations */
/* Modification margin carte d'emplacement / localisation */
.nd2-card {
  margin-top: 5px !important;
  margin-bottom: 5px !important;
}
/* Fin modification margin carte d'emplacement / localisation */
/* Début taille carte sélectionnable */
.small-card {
  height: 50px;
}
.ui-listview li .small-card {
  white-space: normal;
}
/* Fin taille carte sélectionnable */
/* Début largeur carte inventaire - max-width à none pour prise en compte des largeurs de la grille */
#inventoryTab .nd2-card,
#bilanTab .nd2-card,
#attachmentTab .nd2-card,
#informationCard .nd2-card {
  max-width: none;
}
#inventoryTab .nd2-card .ui-input-text,
#bilanTab .nd2-card .ui-input-text,
#attachmentTab .nd2-card .ui-input-text,
#informationCard .nd2-card .ui-input-text {
  position: relative;
}
/* Fin largeur carte inventaire */
/* Début texte de couleur */
.text-clr-primary {
  color: #00677F !important;
}
.text-clr-black {
  color: black !important;
}
/* Fin texte de couleur */
/* Début marge bloc détails équipement */
.details-equipement {
  margin-top: 10px;
}
/* Fin marge bloc détails équipement */
/* Positionnement du contenu du changelog */
#HW_frame_cont {
  top: 70px !important;
}
/* Fin positionnement du contenu du changelog */
/* Positionnement indicateur de changelog */
div[data-role=header] .pull-right {
  height: 64px;
}
div[data-role=header] #changelog-container {
  display: inline-block;
  position: relative;
  margin-bottom: 16px;
  margin-top: 16px;
}
@media only screen and (min-width: 48em) {
  div[data-role=header] #changelog-container {
    margin-bottom: 8px;
    margin-right: -10px;
  }
}
/* Fin positionnement indicateur de changelog */
/* Modification padding pannel profil et hauteur photo profil */
.nd2-sidepanel-profile {
  padding: 2em 1em 1em 1em !important;
}
.nd2-sidepanel-profile #agentProfile {
  min-height: 70px;
}
/* Fin modification padding pannel profil et hauteur photo profil */
/* Positionnement des éléments concernant l'ancienne valeur d'un pc */
.old-value-infos {
  margin: 5px;
  padding: 5px;
}
/* Fin positionnement des éléments concernant l'ancienne valeur d'un pc */
/* Visuel pc désactivé car pas d'ancienne valeur */
.disabled {
  color: #58585a !important;
  text-decoration: unset !important;
}
/* Fin visuel pc désactivé car pas d'ancienne valeur */