/* AJUSTEMENT PAGE SELECTEUR */

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

body.selecteur #introduction {
	height: auto;
	min-height: 0px;
	background-image: none;
}

body.selecteur ul#menu-principal.glue {
  position: relative;
}

body.selecteur #menu-principal-ligne1-liens li:nth-child(4) {
  display: none;
}


/* 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); }

/* 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(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(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(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; }

/* SURVOL */
/*
.cls-2 { fill: rgba(105,108,99,1); }
.cls-3 { fill: rgba(140,146,133,1); }
.cls-7 { fill: rgba(182,187,172,1); }
*/
/* DECO */
/*
.cls-4 { fill: #d5dac7; }
.cls-5 { fill: #a5aa9b; }
.cls-6 { fill: #808378; }
*/

#selecteur-gauche .cls-1 { fill: none; }
/* MASQUE */
g.masque .cls-22 { fill: #000000; opacity: 0; }
g.masque:hover .cls-22 { fill: #000000; opacity: 0.2; }
/* DECO */
#selecteur-gauche .cls-2 { fill: #edeae4; }
#selecteur-gauche .cls-3 { fill: #efefef; }
#selecteur-gauche .cls-4 { fill: #f4f4f4; }
#selecteur-gauche .cls-5 { opacity: .5; }
#selecteur-gauche .cls-6 { opacity: .6; }
#selecteur-gauche .cls-5, .cls-6, .cls-7 { fill: #f2f2f2; }
#selecteur-gauche .cls-8 { isolation: isolate; }
#selecteur-gauche .cls-9 { fill: #c4c4c4; }
#selecteur-gauche .cls-10 { fill: #d1cec5; }
#selecteur-gauche .cls-11 { fill: #c1bfb8; }
#selecteur-gauche .cls-14 { fill: #fff; }
#selecteur-gauche .cls-16 { fill: #d1edae; }
#selecteur-gauche .cls-17 { fill: #e5f4ce; }
#selecteur-gauche .cls-18 { opacity: .1; }
#selecteur-gauche .cls-20 { fill: #dedddc; }
#selecteur-gauche .cls-21 { fill: #ededed; }
#selecteur-gauche .cls-23 { fill: #dbd9d5; }
#selecteur-gauche .cls-24 { fill: #c3dd9e; }
/* 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-13, g.lot.polyDisponible path.cls-13 { fill : rgba(87,130,97,1); }
g.lot.polyDisponible polygon.cls-15, g.lot.polyDisponible path.cls-15 { fill : rgba(117,175,131,1); }
g.lot.polyDisponible polygon.cls-19, g.lot.polyDisponible path.cls-19 { fill : rgba(137,206,156,1); }
g.lot.polyDisponible polygon.cls-12, g.lot.polyDisponible path.cls-12 { fill : rgba(137,206,156,1); }

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

g.lot.polyVendu polygon.cls-13, g.lot.polyVendu path.cls-13 { fill : rgba(237,106,97,1); }
g.lot.polyVendu polygon.cls-15, g.lot.polyVendu path.cls-15 { fill : rgba(207,90,87,1); }
g.lot.polyVendu polygon.cls-19, g.lot.polyVendu path.cls-19 { fill : rgba(169,73,71,1); }
g.lot.polyVendu polygon.cls-12, g.lot.polyVendu path.cls-12 { 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); }
