@charset "UTF-8";
/* CSS Document */







/* Style pour le formulaire modif */
/* Styles pour les écrans de bureau */
@media only screen and (min-width: 768px) {
    #livetracking {
        width: 400px;
    }
}

/* Styles pour les appareils mobiles */
@media only screen and (max-width: 767px) {
    #livetracking {
        width: 200px !important;
		
    }
}


.close-popup {
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
    width: 20px; /* Largeur */
    height: 20px; /* Hauteur */
    line-height: 20px; /* Pour centrer le contenu vertical */
    text-align: center; /* Pour centrer le contenu horizontal */
    background-color: #ccc; /* Couleur de fond */
    border-radius: 50%; /* Pour créer une forme de cercle */
}



.mon_popup_ajout {
    display: none;
    position: fixed;
	
    top: 400px!important;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #fff;
    padding: 20px;
    border: 1px solid #ccc;
    border-radius: 5px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    z-index: 9999;
	
}

/* Media Query pour les appareils mobiles */
@media only screen and (max-width: 768px) {
    .mon_popup_ajout {
		 display: none;
    position: fixed;
        
        width: 80%; /* Adapter la largeur selon les besoins */
        top: 320px!important;
        /*margin-top: -100px; /* Ajuster la marge pour centrer verticalement */
    }
}


#overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); /* Couleur sombre semi-transparente */
    z-index: 9999; /* Doit être inférieur à l'index Z du popup */
}




.mon_popup_modif {
    display: none;
    position: fixed;
	
    top: 400px!important;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: #fff;
    padding: 20px;
    border: 1px solid #ccc;
    border-radius: 5px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    z-index: 9999;
}

/* Media Query pour les appareils mobiles */
@media only screen and (max-width: 768px) {
    .mon_popup_modif {
		 display: none;
    position: fixed;
        
        width: 80%; /* Adapter la largeur selon les besoins */
         top: 320px!important;
        /*margin-top: -100px; /* Ajuster la marge pour centrer verticalement */
    }
}

/* Bouton submit */
.livetracking_bouton_envoyer {
    background-color: #24d366 !important; /* Couleur du fond */
    margin-left: 20px !important;
    color: white; /* Couleur du texte */
    padding-bottom: 5px; /* Espacement intérieur */
    padding-top: 4px; /* Espacement intérieur */
    border: none; /* Supprimer la bordure */
    border-radius: 5px; /* Coins arrondis */
    cursor: pointer; /* Curseur de type pointeur */
}

.livetracking_bouton:hover {
    background-color: #ff7f2a; /* Couleur du fond au survol */
}

/* Bouton modif */
.livetracking_bouton {
    background-color: #eb621d; /* Couleur du fond */
    margin-left: 20px !important;
    color: white; /* Couleur du texte */
    padding-bottom: 5px; /* Espacement intérieur */
    padding-top: 4px; /* Espacement intérieur */
    border: none; /* Supprimer la bordure */
    border-radius: 5px; /* Coins arrondis */
    cursor: pointer; /* Curseur de type pointeur */
}

.livetracking_bouton:hover {
    background-color: #ff7f2a; /* Couleur du fond au survol */
}

/* Styles pour la table livetracking_table */








.livetracking_table {
    width: 100%;
    /*max-height: 600px; /* Définir la hauteur maximale pour la table */
   
    border-collapse: collapse; /* Fusionner les bordures de la table */
}

/* Styles pour les cellules et en-têtes de la table */
.livetracking_table th,
.livetracking_table td {
    padding: 8px;
    border: 1px solid #ddd; /* Ajouter des bordures aux cellules */
    text-align: left; /* Aligner le texte à gauche */
}

.livetracking_table th {
    background: linear-gradient(to bottom, #5592bb 0%, #327cad 66%, #1C6EA4 100%) !important; /* Couleur de fond pour l'en-tête */
    color: white !important; /* Couleur du texte pour l'en-tête */
}

/* Largeur spécifique pour la première colonne */
.livetracking_table th:nth-child(1),
.livetracking_table td:nth-child(1) {
    width: 300px;
}

/* Calcul de la largeur de la deuxième colonne */
.livetracking_table th:nth-child(2),
.livetracking_table td:nth-child(2) {
    width: calc(100% - 300px);
}



/* Styles pour les lignes de la table */
.livetracking_table tr:nth-child(even) {
    background-color: #f9f9f9; /* Couleur de fond pour les lignes paires */
}





/* Media query pour les petits écrans (mobile) */

@media only screen and (max-width: 768px) {
    .livetracking_table {
      
		
    }

    /* Largeur spécifique pour la première colonne */
    .livetracking_table th:nth-child(1),
    .livetracking_table td:nth-child(1) {
        width: 121px;
      
    }
		

   /* Calcul de la largeur de la deuxième colonne */
    .livetracking_table th:nth-child(2),
    .livetracking_table td:nth-child(2) {
        /* Définir une largeur minimale */
        min-width: calc(100% - 121px);
      
		
		
        
    }

    
}




/* livetracking_table_header */



.livetracking_table_header {
    width: 100%;
   
    border-collapse: collapse; /* Fusionner les bordures de la table */
}

/* Styles pour les cellules et en-têtes de la table */
.livetracking_table_header th,
.livetracking_table_header td {
    padding: 8px;
    border: 1px solid #ddd; /* Ajouter des bordures aux cellules */
    text-align: left; /* Aligner le texte à gauche */
}

.livetracking_table_header th {
    background: linear-gradient(to bottom, #5592bb 0%, #327cad 66%, #1C6EA4 100%) !important; /* Couleur de fond pour l'en-tête */
    color: white !important; /* Couleur du texte pour l'en-tête */
}

/* Largeur spécifique pour la première colonne */
.livetracking_table_header th:nth-child(1),
.livetracking_table_header td:nth-child(1) {
    width: 300px;
}

/* Calcul de la largeur de la deuxième colonne */
.livetracking_table_header th:nth-child(2),
.livetracking_table_header td:nth-child(2) {
    width: calc(100% - 300px);
}



/* Styles pour les lignes de la table */
.livetracking_table_header tr:nth-child(even) {
    background-color: #f9f9f9; /* Couleur de fond pour les lignes paires */
}




/* Media query pour les petits écrans (mobile) */

@media only screen and (max-width: 768px) {
  
    /* Largeur spécifique pour la première colonne */
    .livetracking_table_header th:nth-child(1),
    .livetracking_table_header td:nth-child(1) {
        width: 121px;
      
    }
		

   /* Calcul de la largeur de la deuxième colonne */
    .livetracking_table_header th:nth-child(2),
    .livetracking_table_header td:nth-child(2) {
        /* Définir une largeur minimale */
        min-width: calc(100% - 121px);
        
		
        
    }

    
}

/* Table container */

.table_livetracking_super_container {
	display: block;
	
}
@media only screen and (max-width: 768px) {
	.table_livetracking_super_container {
	 max-width: 100%;
		overflow-x: auto;
	
}
}
	
.table_livetracking_container {
    margin-top: -16px !important;
    max-height: 300px;
  overflow-x: auto;
    border: solid 1px #c4c4c4;
    max-width: 100%; /* Définir une largeur maximale */
}

@media only screen and (max-width: 768px) {
    .table_livetracking_container {
  max-height: 200px;
	}
}


/* Formulaires */

.modif_form_border{
	border: solid 1px #c4c4c4 ;
	margin-top: 30px;
	padding: 10px;
	height: 300px;
	/*width: 600px;*/
}

.ajout_form_border{
	border: solid 1px #c4c4c4 ;
	margin-top: 30px;
	padding: 10px;
	height: 300px;
	/*width: 600px;*/
}