/**
 * APP
 */

/* Logo */
/*#logo span.logo { width: 184px; height: 50px; background-image: url("../img/logo.png"); background-repeat: no-repeat; display: block; text-indent: -9999px; }*/

/* 480px
.ui-accordion { width: 480px; }
.ui-accordion .ui-accordion-content { padding: 1em 0em; border-top: 0; margin-top: -2px; position: relative; top: 1px; margin-bottom: 2px; overflow: auto; display: none; zoom: 1; }
*/

.hl {
	background: yellow;
}
.voir-25 { background-image: url("../img/voir.png"); }
.yes-16 { background-image: url("../img/yes.png"); }
.no-16 { background-image: url("../img/no.png"); }
.lettreA-16 { background-image: url("../img/lettreA.png"); }
.excel-25 { background-image: url("../img/excel-25x25.jpg"); }
.ecriture-16 { background-image: url("../img/dessiner.png"); }
.entretien { background-image: url("../img/entretien.png"); }
.coche_valider { background-image: url("../img/coche_valider.png"); }
.rotate-16 { background-image: url("../img/rotate.png"); }
.agrandir-25 { background-image: url("../img/agrandir.png"); }
.en_tant_que-16 { background-image: url("../img/en_tant_que.png"); }
.pj-25 { background-image: url("../img/pj.png"); }
.a_zetta-16 { background-image: url("../img/lettre-a.png"); margin-right: 30px; cursor: pointer;}
.t_zetta-16 { background-image: url("../img/lettre-t.png"); margin-right: 30px; cursor: pointer;}
.modifier_lot-16 { background-image: url("../img/modifier_par_lot.png"); margin-right: 30px; cursor: pointer;}
.dupliquer-16 { background-image: url("../img/dupliquer.png"); margin-right: 30px; cursor: pointer;}
.cadenas-16 { background-image: url("../img/cadenas.png"); margin-right: 30px; cursor: pointer;}

        #menu li.titre a {
            cursor: none;
            background-color: #999999; /* Fond du lien */
            color: white !important; /* Couleur du texte */
            text-decoration: none; /* Retirer le soulignement */
        }

        /* Pour s'assurer que la couleur reste blanche au survol */
        #menu li.titre a:hover {
            color: white; /* Couleur au survol */
        }

        /* Règles existantes */
        #menu li.elem a:hover, #menu li.elem:hover a { 
            color: #ffffff; 
            text-decoration: none; 
        }
        #menu li.elem a { 
            display: block; 
            color: #434343; 
            /*padding: 2px;*/ 
            margin: 0px 1px 0px 3px; 
            background-repeat: no-repeat; 
            background-position: left center; 
        }



table.tab_grille tr.tab_grille td {
  padding: 2px;
  text-align: center;
  vertical-align: middle;
}

.grille_contenaire{overflow-y: scroll;height:800px;}

.grille_masquer{display:none;}
.grille_inline{display:inline;}

.coche_valider_none{display:none;}
.coche_valider_inline{display:inline;}

#actions a.actions-suppleance_on, #actions a.actions-suppleance_off { padding:1px 0 1px 19px; background:transparent none no-repeat left center; }
#actions a.actions-suppleance_on { background-image:url("../img/on.png"); color:green;}
#actions a.actions-suppleance_off { background-image:url("../img/off.png");color:red; }

.affiche_detail_eng {
  position: absolute;
  top: 10px;
  right:10px;
  display:none;
  /*margin-left:-50px;
  margin-top:-50px; */
  /*top:50%;
  left:50%; */
	width: 900px;
	background-color: #e6d265;
	font-family: verdana, arial, helvetica, sans-serif;
	font-size:1em;
  padding:5px; 
	/*display:none;*/
	z-index:200000;;
}


.image img {
/* La transition s'applique à la fois sur la largeur et la hauteur, avec une durée d'une seconde. */
-webkit-transition: all 1s ease; /* Safari et Chrome */
-moz-transition: all 1s ease; /* Firefox */
-ms-transition: all 1s ease; /* Internet Explorer 9 */
-o-transition: all 1s ease; /* Opera */
transition: all 1s ease;
}
.imagezzzzzzzz:hover img {
position:fixed;
  top: 50%;
  left: 50%;
/* L'image est grossie de 25% */
-webkit-transform:scale(3); /* Safari et Chrome */
-moz-transform:scale(3); /* Firefox */
-ms-transform:scale(3); /* Internet Explorer 9 */
-o-transform:scale(3); /* Opera */
transform:scale(3);
}


.image_zoom img {
position:fixed;
  top: 38%;
  left: 40%;
/* L'image est grossie de 25% */
-webkit-transform:scale(4); /* Safari et Chrome */
-moz-transform:scale(4); /* Firefox */
-ms-transform:scale(4); /* Internet Explorer 9 */
-o-transform:scale(4); /* Opera */
transform:scale(4);
}

#transparence {
  /*position:absolute;   
  top:-140;                   
  left:-160;
  height:200%;           
  width:200%; */
  position:fixed;
  top:0px;
  left:0px;
  width:100%;
  height:100%;
  display:block;
  background-color: #000000;
  filter: alpha(opacity=90);
  -moz-opacity: 0.9;
  opacity: 0.9;
  z-index: 1000;
}

#globalopaque { 
  position: fixed;
  top:20;
  left:20;
  margin-left: 0; 
  margin-right: auto; 
  width:600px;
  height:260px;
  display:block;
  text-align: center;
  font-family:Verdana,Arial,Helvetica,sans-serif;
  background-color: #FFFFFF;
  font-family:Verdana,Arial,Helvetica,sans-serif;
  color:#000000;
  z-index: 1001; 
}

#globalopaque_externe { 
  position: fixed;
  top:0;
  left:50;
  margin-left: auto; 
  margin-right: auto; 
  width:100%;
  height:30px;
  display:block;
  text-align: center;
  font-family:Verdana,Arial,Helvetica,sans-serif;
  background-color: #ff3358;
  font-family:Verdana,Arial,Helvetica,sans-serif;
  color:#000000;
  z-index: 1001; 
}

#div_container_travaux {
  position:relative;
  top:3px;
  left:0px;
  margin: auto;
  text-align:center;
  /*width:100%;
  height:100%;
  display:block;*/
  z-index: 1002;
}

#container.rotate90,
#container.rotate270 {
  position:relative;
  top:8px;
  left:0px;
  margin: auto;
  text-align:center;
}
#image {
  transform-origin: top left;
  /* IE 10+, Firefox, etc. */
  -webkit-transform-origin: top left;
  /* Chrome */
  -ms-transform-origin: top left;
  /* IE 9 */
}

#div_container_travaux.rotate90 #image {
  transform: rotate(90deg) translateY(-100%);
  -webkit-transform: rotate(90deg) translateY(-100%);
  -ms-transform: rotate(90deg) translateY(-100%);
}
#div_container_travaux.rotate180 #image {
  transform: rotate(180deg) translate(-100%, -100%);
  -webkit-transform: rotate(180deg) translate(-100%, -100%);
  -ms-transform: rotate(180deg) translateX(-100%, -100%);
}
#div_container_travaux.rotate270 #image {
  transform: rotate(270deg) translateX(-100%);
  -webkit-transform: rotate(270deg) translateX(-100%);
  -ms-transform: rotate(270deg) translateX(-100%);
}

#texteopaque {
  position: relative;
  top:0;
  left:0;
  display:inline;
  background-color: transparent;
  font-family:Verdana,Arial,Helvetica,sans-serif;
  color:#000000;
  z-index: 1002;
}

#boutonopaque {
  position: absolute;
  top:230px;
  left:0;
  display:none;
  background-color: transparent;
  font-family:Verdana,Arial,Helvetica,sans-serif;
  color:#000000;
  z-index: 1002;
}



#tab_dyn_rech {
    font: 10px Tahoma;
    color:#000000;
}

#tab_dyn_rech td
{
    text-align : left;
}

.rotate90 {
  transform: rotate(90deg) translateY(-100%);
  -webkit-transform: rotate(90deg) translateY(-100%);
  -ms-transform: rotate(90deg) translateY(-100%);
}
.rotate180 {
  transform: rotate(180deg) translate(-100%, -100%);
  -webkit-transform: rotate(180deg) translate(-100%, -100%);
  -ms-transform: rotate(180deg) translateX(-100%, -100%);
}
.rotate270 {
  transform: rotate(270deg) translateX(-100%);
  -webkit-transform: rotate(270deg) translateX(-100%);
  -ms-transform: rotate(270deg) translateX(-100%);
}

/*sticky*/
/* Table Module Basic
   ========================================================================== */
.table-module {
  height: auto;
  overflow-y: auto;
}
.table-basic {
  display: table;
  border-collapse: collapse;
  width: 100%;
  white-space: nowrap;
  background-color: #FFFFFF;
}
.table-basic thead th {
  color: var(--titles);
 // background-color: #f6f8fb;
  font-weight: 500;
  padding:2px 30px 2px 2px;
  position: sticky;
  top: 0;
  z-index: 1;
}
.table-basic thead th:first-child,
.table-basic tbody th {
  padding-left: 13px;
}
.table-basic tr td,
.table-basic tbody th {
  //font-weight: normal;
  //border-top: 1px solid #dee5ef;
}
.table-basic tr td {
  padding: 13px 3px;
}

.col-sticky-0{
    left: 0px;
    position: sticky;
    z-index:2;
}

.col-sticky-1{
    left: 60px;
    position: sticky;
    z-index:2;
}

.col-sticky-2{
    left: 160px;
    position: sticky;
    z-index:2;
}

.col-sticky1-0{
    left: 0px;
    position: sticky;
    z-index:2;
}

.col-sticky1-1{
    left: 60px;
    position: sticky;
    z-index:2;
}

.col-sticky1-2{
    left: 120px;
    position: sticky;
    z-index:2;
}

.client{
    color:blue;
    text-decoration : underline;
}

.client:hover{
    cursor: zoom-in;
}
/*sticky fin */



/*onglet aimaira*/
    .ongl_1, .ongl_2, .ongl_3, .ongl_4
    {
    display: inline-block;
    //width: 120px;
    height: 30px;
    margin-left: 5px;
    background-color: #d3d3d4;
    border-top: 1px solid #808489;
    border-left: 1px solid #808489;
    border-right: 1px solid #808489;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    -moz-border-radius-topleft: 4px;
    -moz-border-radius-topright: 4px;
    -webkit-border-top-left-radius: 4px;
    -webkit-border-top-right-radius: 4px;
    text-align: center;
    }
    .ongl_1:hover, .ongl_2:hover, .ongl_3:hover, .ongl_4:hover
    {
    background-color: #d3dce9;
    }
    .ongl_1 a, .ongl_2 a, .ongl_3 a, .ongl_4 a
    {
    display: block;
    padding-top: 10px;
    padding-left: 10px;
    padding-right: 10px;
    font-weight: bold;
    text-decoration: none !important;
    color: #555555 !important;
    //text-shadow: 1px 1px 0px #eef1f6;
    font-size: 1em;
    }
    .ongl_1 a:hover, .ongl_2 a:hover, .ongl_3 a:hover, .ongl_4 a:hover
    {
    color: #FFFFFF !important;
    background-color: #d3d3d4;
    //text-shadow: 1px 1px 0px #23334c;
    }
    #content_1
    {
    display: block;
    height: 300px;
    overflow: auto;
    background: #FFFFFF;
    border: 1px solid #596b87;
    //font-size: 11px;
    //color: #3c506f;
    }
    #content_2, #content_3, #content_4
    {
    display: none;
    }
    #client_1:target #content_1
    {
    display: block;
    height: 300px;
    border: 1px solid #596b87;
    font-size: 11px;
    color: #3c506f;
    opacity: 1;
    -moz-opacity: 1;
    -khtml-opacity: 1;
    filter: alpha(opacity=100);
    overflow: auto;
    }
    #client_2:target #content_2
    {
    display: block;
    height: 300px;
    background: #FFFFFF;
    font-size: 11px;
    color: #3c506f;
    opacity: 1;
    -moz-opacity: 1;
    -khtml-opacity: 1;
    filter: alpha(opacity=100);
    overflow: auto;
    }
    #client_3:target #content_3
    {
    display: block;
    height: 300px;
    background: #FFFFFF;
    font-size: 11px;
    color: #3c506f;
    overflow: auto;
    }
    #client_4:target #content_4
    {
    display: block;
    height: 300px;
    background: #FFFFFF;
    font-size: 11px;
    color: #3c506f;
    overflow: auto;
    }
    .info_accueil
    {
    padding: 10px;
    text-align: justify;
    }
/*sticky fin*/    





/*multiselectcheckbox */

.multiselect {
  width: 200px;
}

.selectBox {
  position: relative;
}

.selectBox select {
  width: 100%;
  font-weight: bold;
}

.overSelect {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}

#checkboxes {
  display: none;
  border: 1px #dadada solid;
}

#checkboxes label {
  display: block;
}

#checkboxes label:hover {
  background-color: #1e90ff;
} 

.dropdown {
  position: relative;
  font-size: 1em;
  color: #333;
  padding-left: 10px;
  padding-right: 10px;

  .dropdown-list {
    //padding: 12px;
    background: #fff;
    position: absolute;
    //top: 30px;
    left: 2px;
    right: 2px;
    box-shadow: 0 1px 2px 1px rgba(0, 0, 0, .15);
    transform-origin: 50% 0;
    transform: scale(1, 0);
    transition: transform .15s ease-in-out .15s;
    max-height: 66vh;
    overflow-y: scroll;
    z-index:10;
  }
  
  .dropdown-option {
    display: block;
    padding: 2px 12px;
    opacity: 0;
    transition: opacity .15s ease-in-out;
  }
  
  .dropdown-label {
    display: block;
    //height: 30px;
    background: #fff;
    border: 1px solid #ccc;
    padding: 4px 120px;
    line-height: 1;
    cursor: pointer;
    font-weight: bold;
    
    &:before {
      content: '▼';
      float: right;
    }
  }
  
  &.on {
   .dropdown-list {
      transform: scale(1, 1);
      transition-delay: 0s;
      z-index:400;
      
      .dropdown-option {
        opacity: 1;
        transition-delay: .2s;
        z-index:400;
      }
    }
    
    .dropdown-label:before {
      content: '▲';
    }
  }
  
  [type="checkbox"] {
    position: relative;
    top: -1px;
    margin-right: 4px;
  }
}   
/*multiselectcheckbox fin*/

/*grille_tarifaire*/
        .table_gt-wrapper {
            max-height: 600px; /* Hauteur maximale du conteneur */
            overflow: auto; /* Activer le défilement */
            position: relative; /* Pour que le positionnement soit relatif */
            width: 100%; /* Largeur 100% */
            border-radius: 8px; /* Arrondir les coins du conteneur */
            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); /* Ombre pour un effet de profondeur */
            background-color: #fff; /* Fond blanc pour le conteneur */
        }
        
        .table_gt-wrapper thead tr:nth-child(1) th, thead tr:nth-child(1) td {
            position: sticky;
            top: 0;
            background-color: #f4f4f4;
            z-index: 3;
            color: black;
        }

        .table_gt-wrapper thead tr:nth-child(2) th, thead tr:nth-child(2) td {
            position: sticky;
            top: calc(1 * var(--row-height)); /* Ajuste top selon la hauteur de la première ligne */
            background-color: #eaeaea;
            z-index: 2;
            color: black;
        }

        .table_gt-wrapper thead tr:nth-child(3) th, thead tr:nth-child(3) td {
            position: sticky;
            top: calc(2 * var(--row-height)); /* Ajuste top selon les deux premières lignes */
            background-color: black; /* #d4d4d4*/
            z-index: 1;
            color: white; /*black */
        }
        
        /* Ajustement de la hauteur de chaque ligne */
        :root {
            --row-height: 25px; /* Hauteur dynamique des lignes */
        }        
        
        .table_gt {
            border-collapse: collapse;
            width: 100%;
            position: relative; /* Pour gérer les en-têtes */
            font-family: 'Arial', sans-serif; /* Police moderne */
        }

        .table_gt th, 
        .table_gt td {
            border: 1px solid #e0e0e0; /* Bordure plus claire */
            padding: 12px; /* Plus d'espace dans les cellules */
            white-space: nowrap; /* Empêche le texte de se casser */
            background-color: #ffffff; /* Fond blanc pour les cellules */
            transition: background-color 0.3s; /* Animation lors du survol */
        }

        .table_gt th {
            color: #333; /* Couleur du texte des en-têtes */
            font-weight: bold; /* Gras pour les en-têtes */
        }

        /* En-têtes fixes */
        th.sticky_gt-header {
            position: sticky;
            top: 0; /* Fixé en haut du conteneur */
            background-color: black ; /* #4CAF50 Couleur de fond moderne */
            color: white; /* Texte blanc pour les en-têtes */
            z-index: 100; /* Assure que l'en-tête reste au-dessus */
            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15); /* Ombre pour les en-têtes */
            padding: 5px; /* Plus d'espace dans les cellules */
        }


        /* Colonne fixe */
        td.sticky_gt-col, th.sticky_gt-col {
            position: sticky;
            left: 0; /* Fixé à gauche du conteneur */
            background-color: #f9f9f9; /* Couleur de fond légèrement différente */
            z-index: 90; /* Doit être au-dessus des cellules, moins que les en-têtes */
            white-space: nowrap; /* Empêche le texte de se casser */
            padding: 5px; /* Plus d'espace dans les cellules */
        }

        /* Deuxième colonne fixe */
        td.sticky_gt-col-2, th.sticky_gt-col-2 {
            position: sticky;
            left: 0px; /* Fixé à gauche après la première colonne */
            background-color: #f0f0f0; /* Couleur de fond légèrement différente */
            z-index: 90; /* Doit être au-dessus des cellules, moins que les en-têtes */
            //border-right: 2px solid #4CAF50; /* Bordure à droite pour la deuxième colonne fixe */
            white-space: nowrap; /* Empêche le texte de se casser */
        }

        /* Effet de survol pour les cellules */
        .table_gt tr:hover td {
            background-color: #f1f1f1; /* Couleur de fond lors du survol */
            white-space: nowrap; /* Empêche le texte de se casser */
        }

        /* Styles pour les cellules régulières */
        .regular-cell {
            background-color: #fff; /* Fond blanc pour les cellules régulières */
            border: 1px solid #e0e0e0; /* Bordure claire */
        } 
        
        .td-zetta {
            white-space: nowrap; /* Empêche le texte de se casser */
            padding: 5px; /* Plus d'espace dans les cellules */
            background-color: #f9f9f9; /* Couleur de fond légèrement différente */
        }
        
        .td-tarif {
            white-space: nowrap; /* Empêche le texte de se casser */
            padding: 5px; /* Plus d'espace dans les cellules */
            background-color: #f9f9f9; /* Couleur de fond légèrement différente */
        }
        
        input[type="text"].excel-input {
            border: none;
            width: 100%;
            height: 100%;
            padding-right: 3px;
            margin: 0;
            box-sizing: border-box;
            font-family: 'Arial', sans-serif;
            font-size: 14px;
            background-color: transparent;
            text-align: right;
        }

        /* Supprime la sélection visuelle lors du focus */
        input[type="text"].excel-input:focus {
            outline: none;
            background-color: #e9f6ff; /* Couleur de surbrillance lors de la saisie */
        }
        
        input[type="text"].excel-input-zero {
            border: none;
            width: 100%;
            height: 100%;
            padding-right: 3px;
            margin: 0;
            box-sizing: border-box;
            font-family: 'Arial', sans-serif;
            font-size: 14px;
            background-color: #edc479;
            text-align: right;
        }

        /* Supprime la sélection visuelle lors du focus */
        input[type="text"].excel-input-zero:focus {
            outline: none;
            background-color: #e9f6ff; /* Couleur de surbrillance lors de la saisie */
        }        

        /* Effet de survol des cellules */
        td.td-tarif:hover {
            background-color: #f3f3f3;
        } 
        
        input[type="text"].excel-input-valider {
            border: none;
            width: 100%;
            height: 100%;
            padding-right: 3px;
            margin: 0;
            box-sizing: border-box;
            font-family: 'Arial', sans-serif;
            font-size: 14px;
            background-color: #939693;
            text-align: right;
            font-style: italic;
        }                                      

/*grille_tarifaire fin*/


/* SSO */
.social-btn {
  padding: 0 8px 0 52px;
}

.social-btn {
  position: relative;
  width: 220px;
  border: 1px solid #c2c8d0;
  border-radius: 6px;
  font-size: 16px;
  align-items: center;
  background-color: #fff;
  height: 52px;
  transition: box-shadow .15 ease-in-out,background-color .15s ease-in-out;
  cursor: pointer;
  color: #2d333a;
  margin-bottom: 8px;
  display: flex;
  outline: 0;
}

.social-logo-wrapper {
  position: absolute;
  left: 26px;
  top: 50%;
  transform: translate(-50%) translateY(-50%);
}

.social-logo {
  width: 20px;
  height: 20px;
  display: inline-block;
}

.social-text {
  text-align: left;
  position: relative;
}

/* SSO fin */