.tablesst td{
	padding: 1px;
	font-size: 7px;
}

input::placeholder {
  font-weight: bold;
  opacity: 0.45;
  color: grey;
}

/* Tooltip container */
.tooltip2 {
  position: relative;
  display: inline-block;
}

/* Tooltip text */
.tooltip2 .tooltiptext {
  visibility: hidden; 
  background-color: #46BBFF;
  color: white;
  text-align: center;
  padding-left: 5px 20px 5px 20px;
  border-radius: 6px;
  font-size:16px;
  font-weight:bold;

  /* Position the tooltip text */
  position: absolute;
  z-index: 1;
  bottom: 125%;
  left: 50%;
  margin-left: -60px;

  /* Fade in tooltip */
  opacity: 0;
  transition: opacity 0.3s;
}

/* Tooltip arrow */
.tooltip2 .tooltiptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #555 transparent transparent transparent;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip2:hover .tooltiptext {
  visibility: visible;
  opacity: 1;
}

/*pour l'input file de la page planning*/
.upload-btn-wrapper {
  position: relative;
  overflow: hidden;
  display: inline-block;
}

.btn_upl{
  border: 2px solid white;
  color: white;
  background-color: rgb(91,192,222);
  padding: 8px 20px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: bold;
}

.upload-btn-wrapper input[type=file] {
  font-size: 100px;
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
}

.datatables_filter_planning_repositionning{
    position: fixed;
	top:80px;
	left:60%;
	z-index:104;
}

.datatables_filter_planning_repositionning_devis{
    position: fixed;
	top:100px;
	left:85%;
	z-index:104;
}

.tbodytd tbody tr td{
	border-left:dotted 1px blue;
}

.swal-container {
  z-index: 9015;
}

 /* UPLOAD PHOTO CONDUCTEUR. */
.image-upload > input{
    display: none;
}

.image-upload img{
    cursor: pointer;
}

.divPlanning_focus_in{
	border: solid 4px red;
}
.divPlanning_focus_out{
	border: none;
}

/*  SNACKBAR DEBUT  ---    SNACKBAR DEBUT  ---    SNACKBAR DEBUT  ---    SNACKBAR DEBUT  ---    SNACKBAR DEBUT  ---    SNACKBAR DEBUT  ---  */

/* The snackbar - position it at the bottom and in the middle of the screen */
#snackbar {
  visibility: hidden; /* Hidden by default. Visible on click */
  min-width: 250px; /* Set a default minimum width */
  margin-left: -125px; /* Divide value of min-width by 2 */
  background-color: #333; /* Black background color */
  color: #fff; /* White text color */
  text-align: center; /* Centered text */
  border-radius: 2px; /* Rounded borders */
  padding: 16px; /* Padding */
  position: fixed; /* Sit on top of the screen */
  z-index: 10005; /* Add a z-index if needed */
  left: 50%; /* Center the snackbar */
  bottom: 30px; /* 30px from the bottom */
}

/* Show the snackbar when clicking on a button (class added with JavaScript) */
#snackbar.show {
  visibility: visible; /* Show the snackbar */
  /* Add animation: Take 0.5 seconds to fade in and out the snackbar.
  However, delay the fade out process for 2.5 seconds */
  -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
  animation: fadein 0.5s, fadeout 0.5s 2.5s;
}

/* Animations to fade the snackbar in and out */
@-webkit-keyframes fadein {
  from {bottom: 0; opacity: 0;}
  to {bottom: 30px; opacity: 1;}
}

@keyframes fadein {
  from {bottom: 0; opacity: 0;}
  to {bottom: 30px; opacity: 1;}
}

@-webkit-keyframes fadeout {
  from {bottom: 30px; opacity: 1;}
  to {bottom: 0; opacity: 0;}
}

@keyframes fadeout {
  from {bottom: 30px; opacity: 1;}
  to {bottom: 0; opacity: 0;}
}

/*  SNACKBAR FIN  ---    SNACKBAR FIN  ---    SNACKBAR FIN  ---    SNACKBAR FIN  ---    SNACKBAR FIN  ---    SNACKBAR FIN  ---  */

	/*VERSION 'fixTableHead' à mettre en tant que classe sur la table*/
	.fixTableHead::-webkit-scrollbar {
		display: none;
	}
    .fixTableHead {
      overflow-y: auto;
      height: 90vh;
    }
    .fixTableHead thead th {
      position: sticky;
      top: 0;
	  z-index:900;
    }
	.fixTableHead thead>tr:nth-child(2) th {
	  top: 30px;
	}	
	
	/*VERSION 'header' à mettre en tant que classe sur le thead !!!!! JS en complément sur la page*/
	/*PLANNING*/
		/* Style the header */
		.header {
		  z-index:5;
		}

		/* The sticky class is added to the header with JS when it reaches its scroll position */
		.sticky {
		  position: fixed;
		  top: 125px;
		  z-index:50;
		}
	/*CODES JOURNEE*/
		/* Style the header */
		.headerCJ {
		  z-index:6;
		}

		/* The sticky class is added to the header with JS when it reaches its scroll position */
		.stickyCJ {
		  position: fixed;
		  top: 60px;
		  left: 50px;
		  width: 100%
		}	
		
		/* The sticky class is added to the header with JS when it reaches its scroll position */
		.stickyCJ  tr .first {
		  width: 400px;
		}
		
/*BOUTON RETOUR HAUT DE PAGE*/
#myBtnTop {
  display: none; /* Hidden by default */
  position: fixed; /* Fixed/sticky position */
  bottom: 60px; /* Place the button at the bottom of the page */
  right: 120px; /* Place the button 120px from the right */
  z-index: 8000; /* Make sure it does not overlap */
  border: none; /* Remove borders */
  outline: none; /* Remove outline */
  background-color: #36B5FF; /* Set a background color */
  color: white; /* Text color */
  cursor: pointer; /* Add a mouse pointer on hover */
  padding: 15px; /* Some padding */
  border-radius: 10px; /* Rounded corners */
  font-size: 18px; /* Increase font size */
}

#myBtnTop:hover {
  background-color: #555; /* Add a dark-grey background on hover */
}

/* FIX HEADER PANNEAU DE COMMANDE */
		  .tableFixHead {
			overflow-y: auto; /* make the table scrollable if height is more than 200 px  */
		  }
		  .tableFixHead thead th {
			position: sticky; /* make the table heads sticky */
			top: 0px; /* table head will be placed from the top of the table and sticks to it */
		  }
		  .tableFixHead table {
			border-collapse: collapse; /* make the table borders collapse to each other */
			width: 100%;
		  }
		  .tableFixHead  th, .tableFixHead  td {
			padding: 8px 16px;
			border: 1px solid #ccc;
		  }
		  .tableFixHead  th {
			background: #eee;
			z-index:10;
		  }
		  
/* DRAG AND DROP POUR SELECTION DE CHAMP D'AFFICHE DANS LE PANNEAU DE COMMANDE (VOIRE AUTRE) */
		.container {
		  display: grid;
		  grid-template-columns: 13% 13% 13% 13% 13% 13% 13%;
		  grid-column-start: 1;
		  gap: 4px;
		}
		.container::before {  /* permet de masquer l'element ::before qui s'intercale automatiquement dans la grille */
		  display: none;
		}
		.boxActive {
		  border: 1px solid #666;
		  background-color: #0568FF;
		  color: white;
		  border-radius: 3px;
		  padding: 3px;
		  cursor: move;
		  text-align: center;
		}
		.boxInactive {
		  border: 1px solid #666;
		  background-color: #ddd;
		  color: black;
		  border-radius: .5em;
		  padding: 3px;
		  cursor: move;
		  text-align: center;
		}
		
		.boxActive.over {
		  border: 3px dotted #666;
		}		
		.boxInactive.over {
		  border: 3px dotted #666;
		}
		
		
/* MENU DEROULANT PLANNING GRAPHIQUE */
        .RC_menu {
			display: none;
            position: absolute;
			border-radius:7px;
            width: 250px;
            background-color: #f0f0f0;
			z-index:1005;
			padding:0px;
			margin:0px;
        }

        .context-menu {
            display: block;
			width:100%;
			padding:0px;
			margin:0px;
            z-index: 1005;
        }

        .context-menu-item {
			width:100%;
			border:solid 1px grey;
			border-radius:3px;
			margin:2px;box-shadow: 2px 2px 15px grey;
			text-shadow: 1px 1px 2px rgb(200,230,230);
            cursor: pointer;
			padding:10px 30px;
			margin:3px;
        }	
	
/* MENU DEROULANT FILTRE ACTIVITE PUITS COMMANDES */
        .RC_menu_CMD {
			display: none;
            position: absolute;
			border-radius:7px;
            width: 250px;
            background-color: #f0f0f0;
			z-index:9999;
			padding:0px;
			margin:0px;
        }

        .RC_menu_CMD .context-menu {
            display: block;
			width:100%;
			padding:0px;
			margin:0px;
            z-index: 11;
        }

        .RC_menu_CMD .context-menu-item {
			width:100%;
			border:solid 1px grey;
			border-radius:3px;
			margin:2px;box-shadow: 2px 2px 15px grey;
			text-shadow: 1px 1px 2px rgb(200,230,230);
            cursor: pointer;
			padding:5px 10px;
			margin:3px;
        }	
		
/* MENU DEROULANT FILTRE ACTIVITE PLANNING */
        .RC_menu_OT {
			display: none;
            position: absolute;
			border-radius:7px;
            width: 250px;
            background-color: #f0f0f0;
			z-index:9999;
			padding:0px;
			margin:0px;
        }

        .RC_menu_OT .context-menu {
            display: block;
			width:100%;
			padding:0px;
			margin:0px;
            z-index: 1005;
        }

        .RC_menu_OT .context-menu-item {
			width:100%;
			border:solid 1px grey;
			border-radius:3px;
			margin:2px;box-shadow: 2px 2px 15px grey;
			text-shadow: 1px 1px 2px rgb(200,230,230);
            cursor: pointer;
			padding:5px 10px;
			margin:3px;
        }
