body {
  -webkit-touch-callout: none !important;
}

.clearfix {
  clear: both;
}

.mapping-main {
  margin: 0px;
  padding: 0px;
}

.mapping-main {
  overflow-x: hidden;
  overflow-y: hidden;
}

.mapping-body.noTouch {
  -ms-touch-action: none;
  touch-action: none;
}

/*discutable*/

.mapping-large {
  background-color: gray;
  overflow-y: hidden;
  overflow-x: hidden;
}

.mapping-body-right {
  /*background: gray;*/
  width: 29%;
  padding: 4px 0;
}

.mapping-body-right-large {
  width: 29%;
}

.mapping-body-right-medium {
  width: 14%;
}

.mapping-body-left {
  /*background: gray; */
  width: 70%;
  padding: 5px 0px 5px 0px;
}

/*padding: 5px 0;*/
.mapping-body-left-medium {
  width: 85%;
}

.mapping-nappe {
  background: #DDD;
  margin: 0px auto;
  position: relative;
}

zzz.mapping-nappe .mapping-dashed-vertical-min {
  position: absolute;
  height: 100%;
  border-right: 1px dashed silver;
}

zzz.mapping-nappe .mapping-dashed-vertical-max {
  position: absolute;
  height: 100%;
  border-right: 1px dashed silver;
}

zzz.mapping-nappe .mapping-dashed-horizontal-min {
  position: absolute;
  width: 100%;
  height: 0;
  border-bottom: 1px dashed silver;
}

zzz.mapping-nappe .mapping-dashed-horizontal-max {
  position: absolute;
  width: 100%;
  height: 0;
  border-bottom: 1px dashed silver;
}

.fzMapp-axes-layout-background .mapping-nappe {
  margin-left: 4px
}

/* SB@LB[overflows]
 .mapping-main.fzMapp-0axes	.mapping-nappe {overflow-y: hidden;} 
 .mapping-main.fzMapp-0axes	.mapping-nappe {overflow-x: hidden;} 
 .mapping-main.fzMapp-0axes.yOverFlow	.mapping-nappe {overflow-y: auto;}
 .mapping-main.fzMapp-0axes.xOverFlow	.mapping-nappe {overflow-x: auto;}
 .mapping-main.fzMapp-0axes	.mapping-nappe.fzMapp-prodDragging 	{overflow-y: hidden; overflow-x: hidden;}*/

.mapping-main.fzMapp-0axes .mapping-product.ui-draggable-dragging {
  z-index: 1100
}

.mapping-main.fzMapp-0axes .mapping-ground .mapping-product:hover {
  z-index: 110;
}

.mapping-axe2 {
  width: 15px;
  position: absolute;
  font-size: 12px;
}

.mapping-axe2 .mapping-axe2-min {
  transform-origin: left 5px;
  -webkit-transform: rotate(270deg);
  -moz-transform: rotate(270deg);
  -o-transform: rotate(270deg);
  transform: rotate(270deg);
  writing-mode: lr-tb;
  position: absolute;
  bottom: 0;
  left: 5px;
}

.mapping-axe2 .mapping-axe2-label {
  position: absolute;
  bottom: 45%;
  left: 4px;
  cursor: pointer;
  text-align: center;
  line-height: 11px;
  min-width: 30px;
  min-height: 10px;
}

.mapping-axe2 .mapping-axe2-label.mapping-axe2-label-rotate {
  transform-origin: left 2px;
  -webkit-transform: rotate(270deg);
  -moz-transform: rotate(270deg);
  -o-transform: rotate(270deg);
  transform: rotate(270deg);
  white-space: nowrap;
}

.mapping-axe2 .mapping-axe2-max {
  transform-origin: right top;
  -webkit-transform: rotate(270deg);
  -moz-transform: rotate(270deg);
  -o-transform: rotate(270deg);
  transform: rotate(270deg);
  position: absolute;
  top: 0px;
  left: auto;
  right: 15px;
}

.mapping-axe2 .mapping-axe2-min.editable {
  cursor: pointer;
}

.mapping-axe2 .mapping-axe2-max.editable {
  cursor: pointer;
}

.mapping-axe1 {
  height: 15px;
  position: relative;
  font-size: 12px;
}

.mapping-axe1 .mapping-axe1-min {
  position: absolute;
  left: 0px;
  display: inline-block;
  margin-left: 10px;
}

.mapping-axe1 .mapping-axe1-label {
  display: inline-block;
  margin: 0 auto;
  position: absolute;
  left: 45%;
  cursor: pointer;
  min-width: 30px;
  min-height: 10px;
}

.mapping-axe1 .mapping-axe1-max {
  position: absolute;
  right: 2px;
}

.mapping-axe1 .mapping-axe1-min.editable {
  cursor: pointer;
}

.mapping-axe1 .mapping-axe1-max.editable {
  cursor: pointer;
}

.deprecated.mapping-grouping {
  height: 15px;
  position: relative;
  font-size: 12px;
  z-index: 1000;
  background-color: #DDD;
}

/*overflow-y: hidden;overflow-x: visible; overflow different between x and y make scrollbar visible tak#33376*/
.deprecated.mapping-grouping .mapping-grouping-label {
  height: 15px;
  position: absolute;
  text-align: center;
  padding: 0px 8px;
  overflow-y: hidden;
}

/*padding must be equal to product-border*/
.deprecated.mapping-grouping .mapping-grouping-label.hotTrack {
  font-weight: bold;
  background-color: rgba(0, 0, 0, .2)
}


.mapping-grouping,
.mapping-axe1,
.mapping-axe2 {
  Font-Family: Arial;
  Font-size: 12px;
  color: black;
  font-weight: bold;
}

.mapping-ground {
  position: relative;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center
}

/* #36489 LB : modif bordure */
.fzMapp-axes-layout-out .mapping-ground {
  /* margin-left: 15px; */
  border: 1px solid #c7c7c7;
}

.mapping-main.fzMapp-0axes .mapping-ground {
  margin-left: 0px
}

.mapping-products {
  float: left;
  width: 49%;
  /*background: gray;*/
  border-right: 1px solid white;
}

.mapping-products .mapping-products-tabsRoot {
  background-color: rgba(250, 250, 250, .1);
  margin: 0px 2px 0px 4px;
  text-align: center;
}

.mapping-products .mapping-products-tabsRoot ul {
  list-style: none;
  padding: 0px;
  display: inline-block;
  margin: 0px
}

.mapping-products .mapping-products-tabsRoot li {
  cursor: pointer;
  color: black;
  display: inline-block;
}

.mapping-products .mapping-products-tabsRoot :hover {
  color: red
}

.mapping-products .mapping-products-tabsRoot .dot {
  border: 2px solid black;
  border-radius: 4px;

  margin-left: 4px;
  margin-right: 4px;
  width: 8px;
  height: 8px;
}

.mapping-products .mapping-products-tabsRoot .dot.active {
  background-color: black;
}

.mapping-products .mapping-products-tabsRoot .dot.active:hover {
  background-color: red;
}

.mapping-products .mapping-products-tabsRoot :hover {
  border-color: red;
}

.mapping-products .mapping-products-tabsRoot .mapping-prdList-prev::before {
  content: '<';
  font-weight: bold;
  margin-right: 2px;
  padding-right: 2px;
  padding-left: 12px;
}

.mapping-products .mapping-products-tabsRoot .mapping-prdList-next::before {
  content: '>';
  font-weight: bold;
  margin-left: 2px;
  padding-left: 2px;
  padding-right: 12px;
}

.mapping-products div.mapping-block-product {
  text-align: center;
}

.mapping-products div.mapping-block-product div.mapping-product {
  margin: 0px 3px 1px 3px;
}

.mapping-products .row {
  height: 100%;
}

.mapping-products .row>ul {
  text-align: center;
  list-style: none;
  padding-left: 6px;
  height: 100%;
  margin: 0px;
  /* LB - 24/03/2022 : ajout overflow auto car si trop d'éléments, ils sont masqués (cf task #37048) */
  overflow: auto;
}

zzz.mapping-products .row ul li.mapping-block-product {
  margin: 0px 3px 2px 3px;
}

.mapping-products .row ul li.mapping-block-product {
  margin: 0px 3px 0px 3px;
}

.mapping-products .row ul li.mapping-block-product div {
  margin-bottom: 2px;
}

.mapping-dropTarget {
  display: inline-block;
  position: absolute;
  background-color: rgba(0, 0, 250, .1);
  padding: 0px;
  margin: 0px;

}

.mapping-body-right-medium .mapping-products {
  width: 90%;
  border: none;
}

.mapping-body-right-large .mapping-products .row {
  margin-right: 0px;
}

.mapping-actions {
  /*background: gray;position: relative;*/
  text-align: left
}

/* LB - 07/10/2021 ajout flex pour tache #36730  */
.mapping-body-right.mapping-body-right-large {display: flex;}
.mapping-actions.vert {
  /* margin-left: 50%; */
  width: 49%;
  /* LB - 07/10/2021 ajout flex pour tache #36730 */
  align-self: flex-end;
  margin-bottom: 15px;
}

.mapping-actions.hori {
  width: 100%;
  min-height: 35px
}

.mapping-actions ul {
  margin: 0;
  padding: 0;
}

.mapping-actions ul li {
  list-style: none;
}

.mapping-actions.hori ul li {
  display: inline-block;
  padding-right: 4px;
}

.mapping-actions ul li input {
  display: block
}

.mapping-actions.vert ul li input {
  width: 97%;
  margin: 2px 2px;
}

.mapping-actions.vert ul li {
  margin-bottom: 4px;
}

.mapping-actions.vert ul li .fzBtn {
  width: 100%
}

.mapping-actions.hori ul li input {
  min-width: 180px;
}

/*.mapping-actions .mapping-version { font-size: 10px; text-align: right; position: absolute; bottom: 0; right: 10px; color: #333;}*/
.mapping-body-right-medium .mapping-actions {
  display: none;
}



div.mapping-product {
  vertical-align: middle;
  display: inline-block;
  text-align: center;
  padding: 0 1px;
  z-index: 100;
  cursor: hand;
  cursor: pointer;
}

div.mapping-product.fzMapp-sample-singleLabel:before {
  content: '';
  height: 100%;
  display: inline-block;
  vertical-align: middle;
}

div.mapping-product.fzMapp-sample-singleLabel {
  white-space: pre;
}

.fzMapp-samplesStyle-default div.mapping-product {
  border: 1px solid #6c757d;
  background: #FFF;
  border-radius: 3px;
}

.fzMapp-samplesStyle-default div.mapping-product:hover {
  /* border : 1px solid  #FFF; */
}

.fzMapp-samplesStyle-transparent div.mapping-product:hover {
  border: 1px solid #FFF;
  margin: -1px;
}


div.mapping-marque {
  border: 1px solid #000;
  background: #FFF;
  display: inline-block;
  text-align: center;
  padding: 0 3px;
  z-index: 100;
  cursor: pointer;
  white-space: pre;
}

div.mapping-info-product {
  position: absolute;
  background: #FFF;
  font-size: 10px;
  padding: 3px 5px;
  display: none;
  z-index: 10001;
  box-shadow: 0 0 5px gray;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}

div.mapping-context-product {
  position: absolute;
  width: 190px;
  background: #FFF;
  display: none;
  z-index: 10001;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}

div.mapping-context-product ul {
  margin: 0;
  padding: 0;
}

div.mapping-context-product ul li {
  padding-bottom: 1px;
}

/*avoid scrollbar on last item*/
div.mapping-context-product ul li {
  list-style: none;
  cursor: pointer;
}

div.mapping-context-product ul li:hover {
  background-color: #EEE;
}

div.mapping-context-product ul li.mapping-context-product-rename div {
  padding-left: 26px;
}

div.mapping-context-product ul li.mapping-context-product-raz div {
  padding-left: 26px;
}

div.mapping-context-product ul li.mapping-context-product-groupe.selected {
  font-weight: bold;
}

div.mapping-context-product ul li.mapping-context-product-groupe.selected span::after {
  content: "\2713"
}

div.mapping-context-product ul li.mapping-context-product-groupe span.bg {
  display: inline-block;
  width: 14px;
  height: 18px;
  margin-right: 5px;
}

div.mapping-context-product ul li.mapping-grouping-delete-groupe {
  padding-left: 15px;
}

div.mapping-context-product .coord {
  padding-left: 26px;
  background-color: #EEE
}

deineInfizzWeb.css.div.fzContext-popup .menu-title-bar {
  background-color: #888;
  padding-left: 4px;
  padding-top: 1px;
  padding-bottom: 1px;

  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}

deineInfizzWeb.css.div.fzContext-popup .menu-title-bar .menu-title-close {
  padding: 0px 6px;
  margin-top: -4px;
  position: absolute;
  right: 1px;
  top: 6px;
}

.menu-content.mapp-menu {
  overflow-y: auto;
  overflow-x: hidden;
  max-height: 400px;
  text-align: left;
}

/* #36489 LB : modif taille */
.fzMapp-dlg-groups {
  height: auto !important;
}

.fzMapp-dlg-groups table {
  width: 100%;
}

.fzMapp-dlg-groups table th.fzMapp-groups-name {
  padding: 2px 5px;
}

.fzMapp-dlg-groups table td.fzMapp-groups-name input {
  width: 100%;
}

/* #36489 LB : modif taille */
.fzMapp-dlg-groups table td.fzMapp-groups-color {
  width: 25px;
  text-align: center;
}


#btn-cameraInput {
  margin-right: 0px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
}

#btn-cameraInput-clear {
  margin-left: -1px;
  padding-left: 0px;
  padding-right: 2px;
  width: 18px;
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
}


@media (min-width: 501px) {
  .mapping-body-right {
    float: right;
    /* height:  */
  }
}

/*design formulaire*/
.ui-dialog-titlebar {
  background-color: gray;
  border: none;
}

#amount-pdt,
#amount {
  color: gray;
}

#slider-range-max-pdt {
  background: gray;
}

#slider-range-max {
  background: gray;
}

.ui-widget-header {
  background-color: #CCC;
}


input.fzItemComment {
  width: 100%;
}

/* svg g.shape_polygon path {stroke-width: 4px;fill: none;} */
svg path.shape_polygon {
  stroke-width: 4px;
  fill: none;
  stroke-opacity: 0.4;
}

svg path.shape_polygon.overLine {
  stroke-opacity: 0.8;
}



.voronoi path {
  fill: none;
  pointer-events: all;
  stroke: red;
  stroke-opacity: 0.1;
}


.voronoi .fztestover {
  stroke: green;
  stroke-opacity: 0.6;
}

zzz.voronoi--show path {
  stroke: red;
  stroke-opacity: 0.2;
}

.fzMapp-axes {
  fill-opacity: 0.5;
}

.fzMapp-axe-line {
  fill-opacity: 0.2;
}

div.mapping-product .fzMapp-sample-ppty-rtf {
  white-space: normal
}

.fzMapp-sample-ppty-rtf>div.bsRtfToHtml {
  display: inline;
}


.fzMapp-grouping-box {
  padding: 4px;
  display: inline-block;
  height: auto;
  float: left;
  /* LB #36633 : ajout pour améliorer l'affichage des groupes */
  min-width: 100px;
}

/* LB #36633 : ajout pour améliorer l'affichage des groupes */
.mapping-ground {
  flex-wrap: wrap;
  display: flex;
  flex-direction: row;
}

.fzMapp-grouping-box-inner {
  border: 2px dashed #999999;
  height: 100%;
  position: relative;
  overflow: auto;
  display: flex;
  flex-direction: column-reverse;
}

.fzMapp-grouping-box-foot {
  display: none;
  height: 24px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  position: absolute;
  text-align: center;
  font-weight: bold;
  background-color: rgb(242 242 242);
}

.fzMapp-grouping-box-used .fzMapp-grouping-box-foot {
  display: block;
}

.fzMapp-grouping-box-slot {
  text-align: center;
  position: absolute;
  right: 8px;
  left: 8px;
  padding-bottom: 1px;
}

/*border: 1px dotted blue;*/
.fzMapp-grouping-box-slot-empty {
  border: 1px dotted red;
}

.fzMapp-grouping-box.ui-droppable-hover .fzMapp-grouping-box-inner {
  border-color: #bbbbbb;
}

.fzMapp-grouping-box-foot-clickEnabled {
  cursor: pointer
}

.fzMapp-grouping-box-foot-clickEnabled:hover {
  color: white
}




/* LB - Refonte Mapping + modif #36489 */
.fzMapp-samplesStyle-default .mapping-large {
  background: inherit;
}

.fzMapp-samplesStyle-default .mapping-nappe {
  background: inherit;
}

.fzMapp-samplesStyle-default .fzMapp-axes-layout-out .mapping-ground.ui-droppable {
  border: 1px solid #b7b7b7;
}

.fzMapp-samplesStyle-default .mapping-actions.hori {
  padding-left: 5px;
  margin-left: 0.3rem;
}

.fzMapp-samplesStyle-default .mapping-prodList {
  margin: 0.25rem 0 !important;
  /* LB #36631 : Passage des produits en colonnes si trop de produits sur une colonne. */
  flex-wrap: wrap;
  display: flex;
  flex-direction: column;
}

.fzMapp-samplesStyle-default .mapping-nappe .editable:hover::after {
  position: absolute;
  width: 15px;
  height: 15px;
  background-image: url(images/pencil.png);
  background-size: 13px 13px;
  background-position: center;
  background-repeat: no-repeat;
  display: inline-block;
  content: "";
}

.fzMapp-samplesStyle-default .btn.fzBtn:hover {
  color: white
}

.fzMapp-samplesStyle-default div.mapping-product:hover {
  background-color: rgb(242 242 242);
  position: relative;
}

.fzMapp-samplesStyle-default .fzMapp-grouping-box-foot.fzMapp-grouping-box-foot-clickEnabled:hover::after {
  position: absolute;
  width: 14px;
  height: 14px;
  background-image: url(images/pencil.png);
  background-size: 14px 14px;
  background-position-y: bottom;
  background-repeat: no-repeat;
  /* margin-left: 0px; */
  /* margin-top: 19px; */
  display: inline-block;
  content: "";
  right: 5px;
  bottom: 5px;
}

.fzMapp-samplesStyle-default div.mapping-product.mapping-product-with-pen:hover::after {
  position: absolute;
  width: 10px;
  height: 10px;
  background-image: url(images/pencil.png);
  background-size: 10px 10px;
  background-position-y: bottom;
  background-repeat: no-repeat;
  /* margin-left: 0px; */
  /* margin-top: 19px; */
  display: inline-block;
  content: "";
  right: 2px;
  bottom: 2px;
}

.fzMapp-samplesStyle-default .mapping-actions .fzBtn {
  padding: 5px 25px;
}

.fzMapp-samplesStyle-default .fzMapp-grouping-box-foot-clickEnabled:hover {
  color: gray
}

.fzMapp-samplesStyle-default .mapping-nappe {
  /* border: 2px solid #999999; */
  border-radius: 7px;
}

.fzMapp-axes-layout-out.fzMapp-0axes .mapping-ground {
  border: none;
}



/* Debut refonte Dialog Jquery*/
.ui-dialog .ui-dialog-titlebar {
  background: white;
}

.ui-widget button.ui-dialog-titlebar-close {
  background-color: #fff;
  border: white !important;
}

.ui-widget button.ui-dialog-titlebar-close:active {
  background-color: #f3f3f3;
}

.ui-widget button.ui-dialog-titlebar-close:hover {
  background: inherit;
  color: gray !important;
}

.mapping-context-product.fzContext-popup .menu-title-bar {
  background-color: #99ca3c;
}

/* .mapping-context-product.fzContext-popup .menu-title-bar .menu-title-text  {
  color: #000
} */

.mapping-context-product.fzContext-popup .menu-title-bar .menu-title-close {
  background: #99ca3c;
  border: none;
  padding: 1px 0px;
}

.mapping-products.fzFixedWidth .row {
  margin-left: 0px;
}


svg .fzClosest {fill: black; display: none; }


.voronoi path {
  fill: none;
  pointer-events: all;
  stroke: red;
  stroke-opacity: 0.1;
}


zzz.voronoi .fztestover {stroke: green;stroke-opacity: 0.6;}
zzz.voronoi--show path {stroke: red;stroke-opacity: 0.2;
zzz.voronoi path.voronoiOver {fill: rgb(255,196,196)}
zzz.voronoi path.voronoiOver {stroke-opacity: 0.5;}

.mapping-body-right.mapping-body-right-large {display: flex;}

/* LB : pour corriger le problème des infobulles tronquées (#36635) */
.fzFunction.mapping-main.fzMapp-samplesStyle-default {
  padding-bottom: 35px;
}

/* LB : pour enlever décalage */
/* .fzMapp-axes-layout-out .mapping-body-left-large .mapping-ground.ui-droppable {
  margin-left: 0px !important;
} */