/* AJUSTEMENT PAGE SELECTEUR */

body.selecteur {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  height: 100vh;
  word-spacing: 0em;
}

ul.menu-selecteur,
ul.signature-selecteur {
    position: absolute;
    display: table;
    width: 50%;
    margin: 0 25%;
    table-layout: fixed;
}

ul.menu-selecteur {
  margin-top: 5vh;
}

ul.menu-selecteur li,
ul.signature-selecteur li {
    position: relative;
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    padding: 0 20px;
}

ul.menu-selecteur li p,
ul.signature-selecteur li p {
  position: relative;
    display: inline-block;
    vertical-align: middle;
}

ul.menu-selecteur li:nth-child(1) { text-align: right; }
ul.menu-selecteur li:nth-child(2) { text-align: left; }

ul.menu-selecteur li:nth-child(1) p img {
  width: 65%;
  display: inline-block;
  vertical-align: middle;
}

ul.menu-selecteur li:nth-child(2) p a {
  display: inline-block;
  background-color: var(--color-selecteur-dispo);
  padding: 10px 20px;
  color: var(--color-selecteur-reser);
  font-family: 'Medium', sans-serif;
  color: white;
  font-size: 0.7vw;
  letter-spacing: 0.12vw;
  text-transform: uppercase;
}

ul.menu-selecteur li:nth-child(2) p a span {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  width: 1vw;
  height: 1vw;
  margin: 0 20px 0 10px;
  transition-duration: 0.2s;
}

ul.menu-selecteur li:nth-child(2) p a:hover span {
  margin: 0 40px 0 10px;
}

ul.menu-selecteur li:nth-child(2) p a span svg {
  display: block;
  position: absolute;
  width: 1vw;
  height: 1vw;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

ul.menu-selecteur li:nth-child(2) p a span svg .cls-1 {
  fill: var(--color-selecteur-reser) !important;
}

ul.signature-selecteur {
  bottom: 0px;
}

ul.signature-selecteur li p img {
  width: 60%;
  padding: 0vh 0 3vh 0;
}

/* SELECTEUR */

#selecteur-complet {
  display: block;
  overflow: hidden;
  flex-grow: 1;
}

#selecteur-gauche {
  position: relative;
  display: block;
  width: 65vw;
  height: 100%;
  float: left;
  vertical-align: middle;
  box-shadow: inset -80px 0 0 0 white;
}

#selecteur-gauche #selecteur-visuel-fixe-appt,
#selecteur-gauche #selecteur-visuel-fixe-etage {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: auto;
  transform: translate(-50%, -50%);
}

#selecteur-droite {
  position: relative;
  display: block;
  width: 35vw;
  height: 100%;
  transition-duration: 0s;
  float: left;
  overflow-y: scroll;
}

#selecteur-droite::-webkit-scrollbar, #selecteur-droite::-webkit-scrollbar  { display: none !important; }
#selecteur-droite { -ms-overflow-style: none !important; scrollbar-width: none !important; }

/* TABLEAU */

#selecteur-droite table {
  position: relative;
  table-layout: fixed;
  width: 100%;
  background-color: white;
  margin: 10px 0;
  box-shadow: 0 0 3px 0 rgba(0,0,0,0.1);
  transition-duration: 0.4s;
}

#selecteur-droite table.disponible { border-left: 10px solid var(--color-selecteur-dispo); }
#selecteur-droite table.réservé { border-left: 10px solid var(--color-selecteur-reser); }
#selecteur-droite table.vendu { border-left: 10px solid var(--color-selecteur-vendu); }

#selecteur-droite table.hide.disponible:hover { border-left: 0px solid var(--color-selecteur-dispo); }
#selecteur-droite table.hide.réservé:hover { border-left: 0px solid var(--color-selecteur-reser); }
#selecteur-droite table.hide.vendu:hover { border-left: 0px solid var(--color-selecteur-vendu); }

#selecteur-droite table tr td { border: 1px solid var(--color-selecteur-ligne); }

#selecteur-droite table tr td p {
  display: inline-block;
  padding: 3px 10px;
  font-family: "Medium", sans-serif;
  font-size: 1vw;
  line-height: 1.2vw;
  text-transform: uppercase;
  color: var(--color-gris-fonce);
  padding: 20px 10px;
}

#selecteur-droite table tr td p i { font-size: 60%; letter-spacing: 1px; font-family: "SansLight", sans-serif; }

#selecteur-droite table tr td p span {
  display: block;
  font-family: "Light", sans-serif;
  font-size: 0.5vw;
  line-height: 1vw;
  letter-spacing: 2px;
  color: var(--color-gris-moyen);
}

#selecteur-droite table.disponible tr:nth-child(1) td:nth-child(4) p { color: var(--color-selecteur-dispo); }
#selecteur-droite table.réservé tr:nth-child(1) td:nth-child(4) p { color: var(--color-selecteur-reser); }
#selecteur-droite table.vendu tr:nth-child(1) td:nth-child(4) p { color: var(--color-selecteur-vendu); }

#selecteur-droite table.disponible tr:nth-child(1) td:nth-child(4) p i { color: var(--color-selecteur-dispo); }
#selecteur-droite table.réservé tr:nth-child(1) td:nth-child(4) p i { color: var(--color-selecteur-reser); }
#selecteur-droite table.vendu tr:nth-child(1) td:nth-child(4) p i { color: var(--color-selecteur-vendu); }

/* HIDE */
#tableau-selecteur table.hide { cursor: pointer; }
#tableau-selecteur table.hide tr:nth-child(2),
#tableau-selecteur table.hide tr:nth-child(3) { display: none; }

/* SHOW */
#tableau-selecteur table.show { cursor: default; margin: 30px 0; }
#tableau-selecteur table.show tr:nth-child(2),
#tableau-selecteur table.show tr:nth-child(3) { display: default; }

#selecteur-droite table.show tr:nth-child(3) td:nth-child(1),
#selecteur-droite table.show tr:nth-child(3) td:nth-child(2),
#selecteur-droite table.show tr:nth-child(3) td:nth-child(3),
#selecteur-droite table.show tr:nth-child(3) td:nth-child(4) { background-color: #cccccc; cursor: pointer; transition-duration: 0.2s; }

#selecteur-droite table.show tr:nth-child(3) td:nth-child(1):hover,
#selecteur-droite table.show tr:nth-child(3) td:nth-child(2):hover,
#selecteur-droite table.show tr:nth-child(3) td:nth-child(3):hover,
#selecteur-droite table.show tr:nth-child(3) td:nth-child(4):hover { background-color: white; cursor: pointer; }

#selecteur-droite table.show tr:nth-child(3) td:nth-child(1) img,
#selecteur-droite table.show tr:nth-child(3) td:nth-child(2) img,
#selecteur-droite table.show tr:nth-child(3) td:nth-child(3) img,
#selecteur-droite table.show tr:nth-child(3) td:nth-child(4) img { width: 30px; margin: 3px 0px 0px 3px; }

/* FILTRE */

#selecteur-filtres {
  position: relative;
  width: 100%;
  background-color: white;
  margin-bottom: 20px;
}

#selecteur-filtres ul {
  position: relative;
  display: table;
  width: 100%;
  table-layout: fixed;
  text-align: center;
}

#selecteur-filtres ul li {
  display: table-cell;
}

#selecteur-filtres ul.disponibilite li p {
  display: block;
  text-transform: uppercase;
  font-size: 0.7vw;
  line-height: 1vw;
  letter-spacing: 1px;
  font-family: "Regular", sans-serif;
  color: var(--color-bleu-cardis);
  padding: 10px 0;
}

#selecteur-filtres ul.disponibilite li p span {
  display: inline-block;
  margin: 0 10px 0 0;
  font-family: "Bold", sans-serif;
}

#selecteur-filtres ul.disponibilite li { cursor: pointer; transition-duration: 0.4s; }
#selecteur-filtres ul.disponibilite li:hover { background-color: var(--color-gris-clair); }
#selecteur-filtres ul.disponibilite li p img { width: 25px; vertical-align: middle;; }
#selecteur-filtres ul.disponibilite li.bouton-filtres { border-bottom: 10px solid var(--color-bleu-cardis);  }
#selecteur-filtres ul.disponibilite li.bouton-filtres p { color: var(--color-bleu-cardis); font-family: "Bold", sans-serif; }

#selecteur-filtres ul.disponibilite li.dispo.active { border-bottom: 10px solid var(--color-selecteur-dispo); }
#selecteur-filtres ul.disponibilite li.reser.active { border-bottom: 10px solid var(--color-selecteur-reser); }
#selecteur-filtres ul.disponibilite li.vendu.active { border-bottom: 10px solid var(--color-selecteur-vendu); }
#selecteur-filtres ul.disponibilite li.dispo.active p { color: var(--color-selecteur-dispo); }
#selecteur-filtres ul.disponibilite li.reser.active p { color: var(--color-selecteur-reser); }
#selecteur-filtres ul.disponibilite li.vendu.active p { color: var(--color-selecteur-vendu); }

#selecteur-filtres ul.disponibilite li.dispo { border-bottom: 10px solid var(--color-gris-clair); }
#selecteur-filtres ul.disponibilite li.reser { border-bottom: 10px solid var(--color-gris-clair); }
#selecteur-filtres ul.disponibilite li.vendu { border-bottom: 10px solid var(--color-gris-clair); }
#selecteur-filtres ul.disponibilite li.dispo p { color: var(--color-gris-clair); }
#selecteur-filtres ul.disponibilite li.reser p { color: var(--color-gris-clair); }
#selecteur-filtres ul.disponibilite li.vendu p { color: var(--color-gris-clair); }

#selecteur-filtres ul.filtre li {
  cursor: pointer;
  transition-duration: 0.4s;
}

#selecteur-filtres ul.filtre li.active {
  background-color: var(--color-bleu-cardis);
}

#selecteur-filtres ul.filtre li p {
  display: block;
  text-transform: uppercase;
  font-size: 1vw;
  line-height: 1.7vw;
  letter-spacing: 1px;
  font-family: "Regular", sans-serif;
  color: var(--color-bleu-cardis);
  padding: 5px 0;
  margin: 0;
  background-color: var(--color-gris-clair);
}

#selecteur-filtres ul.filtre li.active p {
  color: white;
}

#selecteur-filtres p.titre-filtre {
  font-size: 0.7vw;
  line-height: 1vw;
  letter-spacing: 12px;
  font-family: "Bold", sans-serif;
  color: var(--color-bleu-cardis);
  text-transform: uppercase;
  padding: 10px 0 0 0;
}

a.validation-filtres {
  display: block;
  padding: 20px 0;
  text-align: center;
  font-family: "Medium", sans-serif;
  color: white;
  background-color: var(--color-bleu-cardis);
  text-transform: uppercase;
  letter-spacing: 4px;
  margin-top: 20px;
  cursor: pointer;
  transition-duration: 0.4s;
  font-size: 1vw;
  line-height: 1.7vw;
}

a.validation-filtres:hover {
  background-color: var(--color-selecteur-dispo);
}

.filtre-hide { display: default !important; }
.filtre-hide.hide { display: none !important; }

/*JQUERY UI*/

.ui-widget.ui-widget-content { border: 4px solid var(--color-bleu-cardis); }
.ui-slider-horizontal { height: 1.6em; }
.ui-widget-content { background: var(--color-gris-clair); }
.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br { border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; border-top-right-radius: 0px; border-top-left-radius: 0px; }
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active { background: var(--color-selecteur-dispo); border: none;}
.ui-slider .ui-slider-handle { z-index: 2; width: 1.6em; height: 1.6em; }

.ui-slider-horizontal .ui-slider-handle {
top: 0em;
margin-left: 0em;
}

.ui-slider-horizontal .ui-slider-handle:nth-child(3) {
  margin-left: -1.6em;
}

.ui-slider-horizontal .ui-slider-range { background-color: var(--color-selecteur-dispo); }

/* BOX UP */

#selecteur-box-up {
  position: absolute;
  display: block;
  top: 100px;
  left: 100px;
  opacity: 0;
  width: 35vw;
  z-index: 1000;
  border-radius: 2px;
  box-shadow: inset 0 0 0 2px var(--color-projet-vert-fonce);
  z-index: 100000;
}

#selecteur-box-up.hide {
  top: -800px !important;
  left: 800px !important;
  opacity: 0 !important;
}

#selecteur-box-up table {
  position: relative;
  table-layout: fixed;
  width: 100%;
  background-color: white;
  margin: 0;
  box-shadow: 0 0 6px 0 var(--color-gris-clair);
  transition-duration: 0.4s;
}

#selecteur-box-up table tbody.disponible { border-left: 10px solid var(--color-selecteur-dispo); }
#selecteur-box-up table tbody.reservé { border-left: 10px solid var(--color-selecteur-reser); }
#selecteur-box-up table tbody.vendu { border-left: 10px solid var(--color-selecteur-vendu); }

#selecteur-box-up table tr td { border: 1px solid var(--color-selecteur-ligne); }

#selecteur-box-up table tr:nth-child(2) { display: none; }
#selecteur-box-up table tr:nth-child(3) { display: none; }

#selecteur-box-up table tr td p {
  display: inline-block;
  padding: 3px 10px;
  font-family: "Medium", sans-serif;
  font-size: 1vw;
  line-height: 1.2vw;
  text-transform: uppercase;
  color: var(--color-gris-fonce);
  padding: 20px 10px;
}

#selecteur-box-up table tr td p i { font-size: 60%; letter-spacing: 1px; font-family: "SansLight", sans-serif; }

#selecteur-box-up table tr td p span {
  display: block;
  font-family: "Light", sans-serif;
  font-size: 0.5vw;
  line-height: 1vw;
  letter-spacing: 2px;
  color: var(--color-gris-moyen);
}

#selecteur-box-up table tbody.disponible tr:nth-child(1) td:nth-child(4) p { color: var(--color-selecteur-dispo); }
#selecteur-box-up table tbody.réservé tr:nth-child(1) td:nth-child(4) p { color: var(--color-selecteur-reser); }
#selecteur-box-up table tbody.vendu tr:nth-child(1) td:nth-child(4) p { color: var(--color-selecteur-vendu); }

.hidePiece { display: none !important; }
.hideEtage { display: none !important; }
.hideRangeBudget { display: none !important; }
.hideRangeSurface { display: none !important; }
.hideDispo { display: none !important; }

/* SELECTEUR ETAGE */

ul#selecteur-etage {
  display: flex;
  flex-direction: column;
  position: absolute;
  width: 10px;
  min-width: 10px;
  height: 100%;
  background-color: white;
  z-index: 1000000;
}

ul#selecteur-etage li {
  display: block;
  flex-grow: 1;
  position: relative;
  background-color: rgba(0,0,0,0.1);
  width: 10px;
  height: calc(100% / 5);
  cursor: pointer;
  transition-duration: 0.4s;
}

ul#selecteur-etage li:hover {
  background-color: rgba(0,0,0,0.3);
  width: 20px;
}

ul#selecteur-etage li.active {
  display: block;
  background-color: var(--color-bleu-cardis);
  width: 10px;
  cursor: pointer;
  box-shadow: 10px 0 0 0 var(--color-bleu-cardis);
}

ul#selecteur-etage li span {
  display: block;
  position: absolute;
  left: 50%;
  top: 0%;
  font-family: "Bold", sans-serif;
  font-size: 0.6vw;
  line-height: 1.4vw;
  letter-spacing: 0.1vw;
  text-transform: uppercase;
  transform: rotate(0deg) translate(30px, 10px);
  color: rgba(0,0,0,0.2);
}

ul#selecteur-etage li.active span {
  color: rgba(0,0,0,0.5);
}


/* SELECTEUR VISUEL */

.selecteur-visuel-appt svg { overflow: visible; }

/* MASQUE */
g.masque .cls-11 { fill: #000000; opacity: 0; }
g.masque:hover .cls-11 { fill: #000000; opacity: 0.2; }
/* DECO */
#selecteur-gauche .cls-1 { fill: none; }
#selecteur-gauche .cls-2 { fill: #7c766d; }
#selecteur-gauche .cls-2, .cls-3 { opacity: .5; }
#selecteur-gauche .cls-4 { fill: #fff3d9; }
#selecteur-gauche .cls-6 { fill: #eadfc7; }
#selecteur-gauche .cls-7 { fill: #a8a096; }
#selecteur-gauche .cls-8 { fill: #c6bcac; }
#selecteur-gauche .cls-9 { fill: #f9eed2; }
#selecteur-gauche .cls-3 { fill: #afa79c; }
#selecteur-gauche .cls-12 { fill: #b7aea1; }

/* SELECT */

/* MASQUE LES ELEMENTS DE DECORATION */
.etageSelect g.deco,
.etageSelect g.masque { display: none; }

g.lot { transition-duration: 0.2s; }

g.lot.polyDisponible polygon.cls-10, g.lot.polyDisponible path.cls-10 { fill : rgba(87,130,97,1); }
g.lot.polyDisponible polygon.cls-5, g.lot.polyDisponible path.cls-5 { fill : rgba(117,175,131,1); }
g.lot.polyDisponible polygon.cls-13, g.lot.polyDisponible path.cls-13 { fill : rgba(137,206,156,1); }

g.lot.polyReserve polygon.cls-10, g.lot.polyReserve path.cls-10 { fill : rgba(252,205,142,1); }
g.lot.polyReserve polygon.cls-5, g.lot.polyReserve path.cls-5 { fill : rgba(209,170,124,1) ; }
g.lot.polyReserve polygon.cls-13, g.lot.polyReserve path.cls-13 { fill : rgba(163,131,93,1); }

g.lot.polyVendu polygon.cls-10, g.lot.polyVendu path.cls-10 { fill : rgba(237,106,97,1); }
g.lot.polyVendu polygon.cls-5, g.lot.polyVendu path.cls-5 { fill : rgba(207,90,87,1); }
g.lot.polyVendu polygon.cls-13, g.lot.polyVendu path.cls-13 { fill : rgba(169,73,71,1); }

g.lot:hover, g.lot.hover { transform: translate(0 , -6px); }

g.etage { transform: translate(0px,0px); transition-duration: 1s;}
g.etage.etageSelect { transform: translate(0px,0px); }
g.etage.etagePlus { transform: translate(0px,-200px); }
g.etage.etageMoins { transform: translate(0px,0px); }