/* Reset */

html, body {
    font-family: Verdana, Arial, Helvetica, sans-serif;
}

body {
    font-size: 11px;
    margin: 0px;
}

a button {
    text-decoration: none;
}

button img {
    vertical-align: -3px;
}

a img {
    text-decoration: none;
    border: none;
}

input:focus, select:focus {
    background-color: #ddd;
}

tr, td {
    vertical-align: middle !important;
}

.h-auto {
    height: auto; /* Valeur par défaut */
    min-height: 20px;
}

.m-1 {
    margin: 1rem !important;
}

.my-1 {
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
}

.mx-1 {
    margin-left: 1rem !important;
    margin-right: 1rem !important;
}

.m-0 {
    margin: 0 !important;
}

.mb-0 {
    margin-bottom: 0 !important;
}

.ml-1 {
    margin-left: 1rem !important;
}

.mt-1 {
    margin-top: 1rem !important;
}

.mb-1 {
    margin-bottom: 1rem !important;
}

.p-0 {
    padding: 0 !important;
}

.pt-1 {
    padding-bottom: 1px !important;
}

.pb-0 {
    padding-bottom: 0 !important;
}

.nocellspacing {
    padding-top: 0;
    padding-bottom: 0;
}

.check {
    width: 1%;
}

.noborder {
    border: none;
}

.leftalign {
    text-align: left;
    padding-left: 3px;
}

input[type=text], select {
    border: 1px inset #888;
    padding: 2px;
    font-family: Verdana, sans-serif;
    font-size: 12px;
    line-height: 16px;
    width: 180px;
}

input, select {
    margin: 0;
}

.positionneur {
    position: fixed;
    top: 0;
    width: 70%;
    display: none;
    z-index: 3;
}

#vue {
    margin: 3em auto;
    width: 80%;
    background-color: #f7f7f7;
    padding: 5px;
}

#maps {
    height: 600px;
    width: 100%;
}

#fond_noir, #fond_noir_cont {
    background-color: #4b4b4b;
    opacity: 0.8;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 2;
}

.accordionItem.hide table {
    display: none;
}

/* Layout */

dl.zend_form {
    border: 1px solid #211734;
    height: 110px;
    padding: 10px;
    background: url("/img/fondlogin.jpg") no-repeat right;
    width: 480px;
}

dl.zend_form dd {
    margin-left: 0px;
}

dl.zend_form dd input[type=text], dl.zend_form dd input[type=password] {
    width: 150px;
    border: 1px inset #888;
    padding: 2px;
    font-family: Verdana, sans-serif;
    font-size: 12px;
    line-height: 16px;
}

.menu a {
    text-decoration: none;
    color: inherit;
}

span.badge {
    display: inline-block;
    min-width: 10px;
    padding: 1px 5px;
    font-weight: bold;
    line-height: 1;
    color: #333;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    background-color: #fff;
    border-radius: 7px;
}

.menu span.badge {
    position: absolute;
    right: 3px;
}

h1 {
    font-size: 1.3em;
    margin-bottom: 0;
    min-height: 70px;
    text-align: center;
}

h2 {
    font-size: 1.1em;
    text-align: center;
    margin-top: 0;
}

h3 {
    font-size: 1em;
    font-weight: normal;
    text-align: center;
}

h4 {
    font-size: 1.5em;
    margin-top: 0;
    margin-left: -10px;
    padding: 3px 45px;
    background-color: #666;
    color: #fff;
    font-style: italic;
}

h5 {
    font-size: 1.2em;
    border-bottom: 1px solid #777;
    margin-bottom: 5px;
    width: 80%;
    text-align: center;
}

h6 {
    font-size: 1em;
    margin: 3px 0;
    font-weight: normal;
}

div.subsection-action {
    margin-top: -5px;
    width: 684px;
    padding: 3px 8px 0;
    border-bottom: 1px solid #bbb;
}

div.subsection-action a {
    color: #333;
    font-weight: bold;
    padding: 0 10px 3px;
    line-height: 16px;
    border-left: 1px solid #bbb;
    border-top: 1px solid #bbb;
    border-right: 1px solid #bbb;
}

div.subsection-action a:hover {
    background-color: #bbb;
}

div.subsection-action a:active {
    color: #777;
}

#header {
    background: #eee url(/img/menu-bord.png) repeat-y scroll right;
    height: 100%;
    width: 150px;
    padding: 0 10px;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 900;
    overflow-y: auto;
}

#header h2 {
    position: relative;
}

#menu-body {
    margin-bottom: 2rem;
}

#user-profile {
    border-top: 2px solid #333;
    padding: 2px 0;
    border-bottom: 2px solid #333;
}

.header-navigation {
    height: 20px;
    padding: 5px 3px;
    text-align: left;
    font-size: 1.2em;
    color: #fff;
    font-weight: bold;
    margin-bottom: 0;
}

#lv-navigation {
    background-image: url(/img/expeditions.png);
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: 97% 50%;
}

#lv-menu {
    z-index: 300;
}

#carnet-navigation {
    background-image: url(/img/contacts.png);
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: 97% 50%;
}

#profil-navigation {
    background-image: url(/img/profil.png);
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: 97% 50%;
}

#about-navigation {
    background-image: url(/img/apropos.png);
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: 97% 50%;
}

.ul.menu {
    list-style-type: none;
    padding-left: 0;
    margin-bottom: 15px;
    margin-top: 0;
}

.ul.menu .li {
    text-align: center;
    font-weight: bold;
    background-color: #888;
    padding: 2px;
    color: #fff;
    position: relative;
}

.ul.menu .li:hover {
    background-color: #bbb;
    color: #000;
}

.submenu {
    display: none;
}

.submenu .li {
    text-align: left;
}

.li:hover .submenu {
    display: block;
}

.img-tracabilite {
    text-align: center;
}

.legende-traca {
    width: 80%;
}

#current-controller {
    background-color: #fff;
    margin-right: -10px;
}

#controller-menu {
    background-color: #ddd;
    margin: 0 0 0 -5px;
}

#controller-menu .ul {
    margin: 0px;
    padding: 10px;
    list-style-type: none;
}

#content {
    margin-left: 190px;
    padding-bottom: 15px;
    min-height: 50%;
    min-width: 51rem;
    z-index: 0;
    padding-left: 10px;
    border-bottom: 4px solid #949996;
    background-color: #eee;
    margin-top: 10px;
    width: calc(100vw - 14rem);
    margin-bottom: 10px;
    box-shadow: 5px 5px 5px 3px #949996;
    border-radius: 6px 16px;
}

#nomenu-content {
    margin: 10px;
    padding: 10px;
    min-height: 100%;
    z-index: 0;
}

/* fenetre de test de popup */
.popup {
    background-color: white;
    text-align: center;
}

.popup h1 {
    margin: 5px;
    font-size: 2.5em;
}

.popup p {
    font-style: italic;
    font-size: 1.5em;
}

#messageaccueil {
    margin: 0 0 0 170px;
    padding-left: 25px;
    font-size: 1.4em;
    line-height: 1.8em;
    background-color: #fff;
    border: 1px solid #000;
}

#lgf-fond-placer {
    text-align: center;
    padding-top: 35px;
}

.errors li {
    color: #ff3333;
    font-size: 1.2em;
}

p.listevide {
    width: 450px;
    font-style: italic;
    text-align: justify;
}

/* Login */

.login-phrase {
    width: 500px;
    text-align: justify;
}

.lgf-login-warning {
    color: #ff3333;
}

/* Carnet */

/* Liste contacts (+LV), paginateur (+LV) */

#lgf-vue-contacts {

}

#lgf-liste-lv {
    border: 1px solid #000;
    border-width: 1px 0;
    width: 70rem;
    border: none;
    display: inline-table !important;
    border-collapse: separate;
    border-spacing: 5px;
}

#lgf-liste-lv td:first-child {
    width: 1rem;
}

#lgf-liste-lv td:last-child {
    position: relative;
}

.lgf-pages-contacts, .lgf-pages-lv {
    background-color: #666;
    height: 1.4em;
    padding: 3px;
    color: #fff;
    font-weight: bold;
    text-align: center;
}

.lgf-pages-lv {
    width: 98%;
}

.lgf-pages-contacts .lgf-page-link, .lgf-pages-lv .lgf-page-link {
    padding-bottom: 2px;
    background-color: #444;
    color: #fff;
    text-decoration: none;
}

.lgf-pages-contacts .lgf-page-link:link, .lgf-pages-lv .lgf-page-link:link {
    background-image: url(/img/pagilink.png);
    background-attachment: scroll;
    background-repeat: repeat-x;
}

.lgf-pages-contacts .lgf-page-link:active, .lgf-pages-contacts .lgf-page-link:active {
    background-image: url(/img/pagiactive.png);
    background-attachment: scroll;
    background-repeat: repeat-x;
}

.compteur-lv {
    font-style: italic;
    margin: 5px 0 15px;
    font-size: 1.2em;
}

button.delete-lv-confirm, button.demande-suppression-lv {
    position: absolute;
    right: 1px;
}

/* Formulaire  adresse ponctuelle */

input#codepostal {
    width: 80px;
}

/* _Formulaire */

p.subform_legend#options_legend,
label.field_label {
    font-style: italic;
    display: block;
    height: 27px;
    width: 170px;
    float: left;
    margin-top: -5px;
    margin-right: 15px;
    padding: 8px 10px 0;
    border-right: 1px solid #999;
    background-color: #ddd;
}

p.subform_legend#options_legend {
    min-width: unset;
    width: 170px;
    margin: inherit;
    font-weight: inherit;
    font-size: inherit;
    line-height: inherit;
    border-bottom: none;
    height: 90px;
}

div.field_group {
    height: 30px;
    min-width: 580px;
    max-width: 700px;
    background-color: #eee;
    padding-top: 5px;
    margin-bottom: 2px !important;
}

div.field_group.hidden_field {
    display: none;
}

div#type_group br, div#nouveau_group br {
    display: none;
}

div#type_group label, div#nouveau_group label {
    padding-right: 10px;
}

.lgf-type-toggle, .lgf-nouveau-toggle {
    vertical-align: -2px;
    margin-right: 3px;
}

div.field_group#id_group, div.field_group#rhiadresse_group, div.subform_group#rhicommandes_group, div.subform_group#rhiconteneurs_group {
    display: none;
}

p.subform_legend {
    min-width: 580px;
    max-width: 700px;
    background-color: #ccc;
    margin: 0;
    font-weight: bold;
    font-size: 1.2em;
    line-height: 1.6em;
    border-bottom: 3px solid #777;
}

p.subform_legend#rhicommandes_legend, p.subform_legend#rhiconteneurs_legend {
    display: none;
}

div.subform_group {
    background-color: #eee;
    min-width: 580px;
    max-width: 700px;
}

div.subform_group#options_group {
    margin-left: 190px;
    max-width: 510px;
    min-width: inherit;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-content: flex-start;
    height: 90px;
    padding-top: 8px;
}

div.subform_group#options_group .field_group {
    display: inline-flex;
    min-width: unset;
    width: 190px;
    height: 21px;
    padding: 0 5px;
}

div.subform_group#options_group > .field_group > .field_label {
    display: inline-block;
    order: 2;
    float: none;
    height: 15px;
    min-width: unset;
    margin: 0;
    padding: 3px 5px;
    width: 160px;
    border-right: none;
    background-color: transparent;
}

div.subform_end {
    min-width: 580px;
    max-width: 700px;
    background-color: #ccc;
    margin-top: 1rem !important;
    height: 10px;
    border-top: 3px solid #777;
}

div.subform_end#rhicommandes_end,
div.subform_end#rhiconteneurs_end,
div.subform_end#options_end {
    display: none;
}

.zend_form p.description {
    width: 450px;
    text-align: justify;
    font-style: italic;
    color: #d00;
}

label.required:after {
    content: " *";
    color: #ff5555;
}

/* __Erreurs */

div.errors_block {
    display: inline-block;
    margin-left: 8px;
    position: relative;
}

img.errors_sign {
    vertical-align: -5px;
}

ul.errors_list {
    display: none;
    position: absolute;
    top: -6px;
    left: 23px;
    list-style-type: none;
    padding: 3px;
    width: 350px;
    font-weight: bold;
    background-color: #d88;
    border: 1px solid #000;
}

ul.errors_list.show {
    display: block;
    position: relative;
}

div.errors_block:hover ul.errors_list {
    display: block;
}

.lgf-type-dependant {
    display: none;
}

.zend_form fieldset {
    margin: 8px 0;
    border: 1px solid #777;
    padding: 4px;
    width: 350px;
}

.zend_form fieldset legend {
    border: 1px solid #333;
    width: 100%;
    padding: 4px;
    margin-left: -5px;
    font-weight: bold;
    font-style: italic;
    background-color: #777;
    color: #fff;
}

.zend_form #siren {
    width: 75px;
}

.zend_form #raison, .zend_form #mail, .zend_form #adresse-ligne1, .zend_form #adresse-ligne2, .zend_form #adresse-ligne3, .zend_form #adresse-ligne4 {
    width: 180px;
}

.zend_form #reference, .zend_form #telfixe, .zend_form #fax, .zend_form #telport, .zend_form #adresse-libelle, .zend_form #nom, .zend_form #prenom {
    width: 115px;
}

.zend_form #adresse-codepostal {
    width: 70px;
}

/* _Adresses des destinataires */

input.adresse-updater {
    display: none;
}

label.adresse-dest-selected div.lgf-address {
    border-right: 3px solid #555;
    border-bottom: 3px solid #555;
}

.destinataire-adresses label {
    margin: 3px;
    float: left;
}

/* _Composants combo */

.lgf-nomatch {
    background-color: #eebbbb !important;
}

div.lgf-scombo *, div.lgf-ecombo * {
    font-family: Verdana, sans-serif;
    font-size: 12px;
    line-height: 16px;
}

input.lgf-scombo-value, input.lgf-ecombo-value {
    width: 200px;
    height: 16px;
    margin: 0;
    padding: 2px;
    background: #fff url(/img/listdown.png) no-repeat scroll /* bpos = (width-12) 50% */ 188px 50%;
}

div.lgf-scombo:hover input.lgf-scombo-value, div.lgf-ecombo:hover input.lgf-ecombo-value {
    background: #fff url(/img/listup.png) no-repeat scroll 188px 50%;
}

ul.lgf-scombo-values, ul.lgf-ecombo-values {
    position: absolute;
    top: 21px;
    left: 0;
    list-style-type: none;
    width: 200px;
    border: 1px inset #888;
    border-top: none;
    margin: 0;
    padding: 2px 2px;
    background-color: #fff;
    display: none;
    overflow-y: auto;
    max-height: 112px;
    z-index: 20;
}

ul.lgf-scombo-values input[type=radio], ul.lgf-ecombo-values input[type=radio], div.lgf-ecombo input[type=radio] {
    display: none;
}

div.lgf-scombo, div.lgf-ecombo {
    position: relative;
    width: 208px;
    display: inline-block;
}

div.lgf-scombo:hover ul.lgf-scombo-values, div.lgf-ecombo:hover ul.lgf-ecombo-values {
    display: block;
}

ul.lgf-scombo-values li.lgf-scombo-value-selected, ul.lgf-ecombo-values li.lgf-ecombo-value-selected {
    background-color: #ddd;
}

ul.lgf-scombo-values li:hover, ul.lgf-ecombo-values li:hover {
    background-color: #bbb;
}

/* _Consulter */

#lgf-liste-contacts {
    border-spacing: 2px;
}

table#lgf-liste-contacts {
    width: auto !important;
}

#lgf-liste-contacts td {
    text-align: left;
    border: none;
}

#lgf-liste-contacts th {
    text-align: center;
    padding: 0;
    border: none;
    border-bottom: 1px solid #000;
}

#lgf-liste-contacts th#pagi-bottom {
    border-top: 1px solid #000;
    border-bottom: none;
}

#lgf-liste-contacts a {
    text-decoration: none;
    color: inherit;
}

/* Filtres */

#filter-champ {
    width: 125px;
}

/* _Template carte */
.text-color-gray {
    color: #555 !important;
    -webkit-text-stroke: .1px #555 !important;
    -webkit-text-fill-color: #555 !important;
}

.lgf-bcard {
    border: 1px solid #555;
    border-radius: 10px !important;
    width: 100%;
    min-width: 300px;
    max-width: 360px;
    min-height: 180px;
    /*color: var(--secondary-color) !important;*/
    background-color: var(--primary-light-color) !important;
    font-size: 1em !important;
}

.lgf-bcard-reference {
    margin: 5px 0 0 7px;
    font-size: 1.3em;
    font-weight: bold;
    color: #555;
}

.lgf-bcard-nomcomplet {
    font-style: italic;
}

.lgf-bcard-contact {
    margin: 0 0 4px 7px;
}

.lgf-bcard-adresse {
    margin: 8px 8px 2px;
    height: 100px;
    border: 1px solid #777 !important;
    /*background-color: white!important;*/
    border-left-width: 3px;
    padding: 2px;
    position: relative;
    border-radius: 5px !important;
}

.lgf-bcard-adresse-libelle {
    font-style: italic;
    position: absolute;
    left: 5px;
    top: -8px;
    border: 1px solid #777 !important;
    padding: 5px !important;
    border-radius: 5px !important;
    background-color: whitesmoke !important;
}

.lgf-bcard-adresse-texte {
    margin: 3px 0;
    padding-top: 1em !important;
}

.lgf-bcard-nbadresses {
    font-style: italic;
    padding-left: 12px;
}

/* _Template adresse */

.whole-address-link {
    color: #000;
    text-decoration: none;
    display: block;
}

.address-links .lgf-address-actions, .address-links .lgf-address-libelle {
    display: none;
}

.lgf-address {
    border: 1px solid #555;
    width: 210px;
    height: auto;
    background-color: #fff;
    position: relative;
    padding: 3px;
}

.lgf-address-libelle {
    position: absolute;
    top: 0;
    left: 0;
    font-style: italic;
    background-color: #555;
    color: #fff;
    padding: 1px 3px 3px;
}

.lgf-address-actions {
    position: absolute;
    top: 0;
    right: 0;
}

.lgf-address-corps {
    font-size: 1em;
    margin: 20px 2px 3px;
    line-height: 1.15em;
}

.lgf-address-nomcomplet {
    font-size: 1.1em;
}

/* Profil */

#lgf-popup-aide {
    width: 700px;
    text-align: justify;
}

/* _Selecteur de cartes */

#lgf-cartes-selecteur {
    empty-cells: show;
    border-spacing: 1px;
}

.lgf-cartes-colonne {
    width: 48px;
    height: 23px;
    border: 1px solid #555;
    background-color: #ccc;
}

.lgf-cartes-colonne.active {
    background-color: #fff;
}

.lgf-cartes-colonne.right-limit {
    border-right: 1px solid #ff0000;
}

.lgf-cartes-colonne.bottom-limit {
    border-bottom: 1px solid #ff0000;
}

#nbcartesct_group {
    height: 150px;
}

#nbcartesct_group label {
    height: 95px;
    padding-top: 60px;
}

/* LV */
/* A remplacer dans votre fichier CSS */

.border-red {
    /* 1. Reset TOTAL du rendu navigateur */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;

    /* 2. Géométrie de la case */
    width: 1.25rem; /* ~20px */
    height: 1.25rem;
    display: inline-block;
    vertical-align: middle;
    border-radius: 0.25rem; /* Coins légèrement arrondis */
    margin-top: 0.25rem;

    /* 3. BORDURE ROUGE (État par défaut - NON COCHÉ) */
    /* L'usage de !important garantit que la bordure reste rouge quoi qu'il arrive */
    border: 2px solid #ff0000 !important;
    background-color: #ffffff; /* Fond blanc explicite */

    /* 4. UX */
    cursor: pointer;
    transition: background-color 0.1s ease-in-out;
}

/* 5. État COCHÉ (Ajout de la coche rouge uniquement) */
.border-red:checked {
    /* On garde le fond blanc et la bordure rouge */
    background-color: #ffffff;

    /* Injection de la coche Vectorielle (SVG) ROUGE */
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23ff0000' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");

    background-position: center;
    background-repeat: no-repeat;
    background-size: 100%;
}

/* 6. Focus Clavier (Obligatoire pour l'accessibilité) */
.border-red:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(255, 0, 0, 0.2); /* Halo rouge léger */
}

/* masque la case à coché "sélectioner tout" pour l'historique des lv */
.lv_historique input.checkbox-selectall {
    display: none;
}

/* case à cocher de couleur différente en haut à gauche pour les lv encours */
/* non coché */
.lv_encours input.checkbox-selectall[type=checkbox] {
    /* -webkit-appearance: none;
    background-color: #fff;
    border: 2px solid #ae0000;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05);
    padding: 8px; */
    border-radius: 3px;
    display: inline-block;
    position: relative;
}

/* lors de l'appuis */
.lv_encours input.checkbox-selectall[type=checkbox]:active,
.lv_encours input.checkbox-selectall[type=checkbox]:checked:active {
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px 1px 3px rgba(0, 0, 0, 0.1);
    /* background-color: #ae0000;
    border: 2px solid #ae0000; */
}

/* coché */
.lv_encours input.checkbox-selectall[type=checkbox]:checked {
    background-color: #eee;
    border: 2px solid #ae0000;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05), inset 15px 10px -12px rgba(255, 255, 255, 0.1);
    color: #99a1a7;
}

.lv_encours input.checkbox-selectall[type=checkbox]:checked:after {
    /* content: '\2714'; */
    font-size: 12px;
    position: absolute;
    top: 0px;
    left: 3px;
    color: #ae0000;
}

/* _Liste lv */

#checkbox-selectflux-cell {
    position: relative;
}

#checkbox-selectflux-box {
    display: none;
    width: 100px;
    border: 1px solid #000;
    background: #fff;
    padding: 4px;
    position: absolute;
    z-index: 10;
}

.lv_encours #checkbox-selectflux-cell:hover #checkbox-selectflux-box {
    display: block;
}

/* _Histo lv, filtres */

#filters-list {
    width: 500px;
}

#filters-list dd {
    margin: 5px 0;
}

#filters-list input[type=text], #filters-list select {
    font-size: 11px;
    border: none;
    background-color: #eee;
    padding: 0;
}

#filter-nomclient {
    display: none;
}

#filter-du, #filter-au {
    width: 72px;
}

/* _Ajout lv */

#adresses_legend, #adresses_group, #adresses_end, #conteneurs-liste_group {
    display: none;
}

#adresses_group {
    padding: 0;
    text-align: center;
}

#adresses_group label {
    display: inline-block;
    width: 220px;
    height: 125px;
    text-align: left;
    margin: 5px;
}

#adresse-ligne1, #adresse-ligne2, #adresse-ligne3, #adresse-ligne4, #adresse-ville {
    width: 300px;
}

#telfixe, #fax, #telport {
    width: 130px;
}

#conteneurs-nombre {
    width: 30px;
}

#conteneurs-poids {
    width: 65px;
}

#valeur_declaree, #contreremboursement {
    width: 70px;
}

#instructions-edition-value, #instructions-edition-values, #message {
    width: 350px;
    background-position: 338px 50%;
}

#conteneurs-liste-label {
    display: none;
}

#destinataire_adresse-element {
    display: none;
}

#commande-list {
    display: inline-block;
    margin: 8px 0;
    padding: 0;
    width: 250px;
}

#commande-list li {
    list-style-type: none;
    border: 1px solid #555;
    font-style: italic;
    margin: 3px 0;
    padding: 2px;
    position: relative;
    background-color: #fff;
}

.lgf-lister-remove {
    position: absolute;
    right: 3px;
}

/* _Modifier LV */

.conteneur-checkbox {
    margin: 3px;
    vertical-align: 7px;
}

.conteneur-label {
    display: inline-block;
    width: 100%;
}


.conteneur-traces {
    width: 80.2%;
    height: auto;
    background-color: white;
}


table, td, th {
    border: 1px solid #777;
    border-collapse: collapse;
    padding: 5px;
}

.lv-traces {
    width: 80%;
    height: auto;
    background-color: white;
}

.lv-traces > tbody > tr:first-child, .conteneur-traces > tbody > tr:first-child {
    background-color: #eee;
}

/*
.conteneur-traces tr > *, .lv-traces tr > * {
	border-width: 0 0 1px;
	border-color: #ccc;
	vertical-align: top;
	padding: 1px 0;
}
*/
.conteneur-traces tr > th, .lv-traces tr > th {
    border-width: 0;
}


.conteneur-trace-coordonnees {
    width: 1%;
    text-align: center;
}

.conteneur-trace-date {
    width: 5%;
    border-bottom: solid 1px #fff;
    background-color: #777;
    color: #fff;
    text-align: center;
}

.conteneur-trace-message {
    width: 22%;
    text-align: left;
}

.conteneur-trace-note {
    width: 18%;
    font-style: italic;
    text-align: left;
}

.not-ok {
    color: grey;
}

.ok {
    color: red;
}

.fa-map-marker {
    font-size: 24px;
}

/* _Template conteneurhisto(JS) */

#detail_conteneurs {
    display: inline-block;
}

.lgf-conteneur-histo {
    border: 1px solid #333;
    background-color: #fff;
}

.lgf-conteneur-histo.long-histo {
    width: 80%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.long-histo > .lgf-conteneur-numero-histo {
    width: 48px;
}

.lgf-conteneur-numero-histo {
    width: 40px;
    height: 21px;
    background: #eee url(/img/conteneur.png) no-repeat scroll left;
    padding: 2px 3px !important;
    text-align: right;
}

.long-histo > .lgf-conteneur-numero-etiquette-histo {
    left: auto;
    text-align: center;
}

.lgf-conteneur-numero-etiquette-histo {
    left: 320px;
    background-color: #555;
    color: #fff;
    font-weight: bold;
    padding: 5px !important;
    width: 128px;
    height: 15px;
    font-size: 1.1em;
}

.lgf-conteneur-label-histo {
    color: #666;
}

.lgf-conteneur-value-histo {
    position: absolute;
    bottom: 1px;
    left: 10px;
    overflow: hidden;
}

.long-histo > .lgf-conteneur-contenu-histo, .lgf-conteneur-poids-histo {
    font-weight: bold;
    width: 20%;
}

.long-histo > .lgf-conteneur-operateur-histo {
    width: 20%;
    font-style: italic;
}

/* _Template conteneurs(JS) */

#detail_conteneurs {
    display: inline-block;
}

.lgf-conteneur {
    width: 320px;
    height: 25px;
    border: 1px solid #333;
    position: relative;
    background-color: #fff;
}

.lgf-conteneur.long {
    width: 460px;
}

.lgf-conteneur:hover, .lgf-conteneur-long:hover {
    cursor: pointer;
}

.lgf-conteneur > div {
    position: absolute;
    padding: 0;
    margin: 0;
}

.lgf-conteneur-numero {
    width: 40px;
    height: 21px;
    background: #eee url(/img/conteneur.png) no-repeat scroll left;
    padding: 2px 3px !important;
    text-align: right;
}

.lgf-conteneur-numero-etiquette {
    left: 320px;
    background-color: #555;
    color: #fff;
    font-weight: bold;
    padding: 5px !important;
    width: 130px;
    height: 15px;
    font-size: 1.1em;
}

.lgf-conteneur:hover .lgf-conteneur-numero {
    background-image: url(/img/supprconteneur.png);
}

.lgf-conteneur-label {
    position: absolute;
    left: 1px;
    top: 1px;
    font-style: italic;
    color: #666;
}

.lgf-conteneur-value {
    position: absolute;
    bottom: 1px;
    left: 10px;
    overflow: hidden;
}

.lgf-conteneur-contenu {
    left: 50px;
    width: 95px;
    height: 25px;
}

.lgf-conteneur-poids {
    left: 145px;
    width: 80px;
    height: 25px;
}

.lgf-conteneur-operateur {
    left: 225px;
    width: 95px;
    height: 25px;
}

/* _Template lv */

.lgf-lv {
    position: relative;
    border: 1px solid #fff;
    background-color: #fff;
    height: 19px;
    max-width: 70rem;
    margin-right: 0.5rem;
}

#lgf-liste-lv .lgf-lv {
    width: 100%;
}


.lgf-lv-planifiee .lgf-lv-plan-hide {
    display: none;
}

.lgf-lv-planifiee .lgf-lv-plan-show {
    display: inline;
}

.lgf-lv-planifiee .lgf-lv-infos {
    right: 75px;
}

.lgf-lv-planifiee.lgf-lv-active img.lgf-lv-plan-hide {
    display: inline;
}

.lgf-lv-active {
    border: 1px solid #555;
    height: 200px;
}

.lgf-lv:hover {
    border: 1px solid #555;
}

.lgf-lv-numero {
    position: absolute;
    left: 65px;
    background-color: #555;
    color: #fff;
    padding: 3px;
    height: 13px;
    width: 107px;
    font-family: Courier, monospace;
    font-size: 1.2em;
    line-height: 1.1em;
}

.lgf-lv-caracteristiques {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 176px;
    padding: 3px;
    display: none;
    font-style: italic;
}

.lgf-lv-crcorrige,
.lgf-lv-poidscorrige {
    text-decoration: line-through;
    color: #e56767;
}

.lgf-lv-info-label {
    font-style: normal;
    font-weight: bold;
}

.lgf-lv-active .lgf-lv-caracteristiques {
    display: inline;
}

.lgf-lv-flux {
    padding: 3px 1px;
    height: 13px;
    width: 63px;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lgf-lv-tiers {
    position: absolute;
    background-color: #eee;
    padding: 3px;
    margin: 0;
    top: 0;
    width: 195px;
    height: 13px;
    overflow-y: hidden;
}

.lgf-lv-nomcomplet {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.lgf-lv-active .lgf-lv-nomcomplet {
    display: inline;
    white-space: normal;
}

.lgf-lv-tiers {
    width: 16.5rem;
}

.lgf-lv-active .lgf-lv-tiers {
    height: 105px;
}

.lgf-lv-expediteur {
    left: 12rem;
}

.lgf-lv-destinataire {
    left: 29.5rem;
}

.lgf-lv-complement {
    display: none;
}

.lgf-lv-active .lgf-lv-complement {
    display: inline;
}

.lgf-lv-valeurs, .lgf-lv-infos {
    position: absolute;
    right: 70px;
    top: 1px;
}

.lgf-lv-infos {
    right: 8.5rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

a.lgf-lv-emarge {
    display: none;
}

.lgf-lv-active a.lgf-lv-emarge {
    margin-top: 4px;
    display: block;
}

.lgf-lv-cloturee .lgf-lv-infos {
    right: 16rem;
}

.lgf-lv-cloturee .lgf-lv-valeurs {
    right: 12rem;
}

.lgf-lv-suivi {
    display: none;
    position: absolute;
    top: 1px;
    right: 8.2rem;
}

.lgf-lv-active .lgf-lv-suivi {
    right: 1rem;
    top: auto;
    bottom: 3px;
    width: 18rem;
}

#lgf-lv-list .lgf-lv-suivi {
    display: block;
}

.lgf-lv-active .lgf-lv-valeurs {
    right: auto;
    top: auto;
    left: 30rem;
    bottom: 3px;
}

.lgf-lv-active .lgf-lv-infos {
    right: auto;
    top: auto;
    left: 12rem;
    bottom: 3px;
    width: 17rem;
}

.lgf-lv-detail {
    display: none;
}

.lgf-lv-detail::after {
    content: "\A"; /* caractère nouvelle ligne 0x0A */
    white-space: pre; /* affichage des saut de ligne */
}

.lgf-lv-active .lgf-lv-detail {
    display: inline;
}

.lgf-lv-actions {
    position: absolute;
    right: 0;
    top: 1px;
}

.lgf-lv-actions a {
    text-decoration: none;
}

.lgf-lv-actions a:hover {
    text-decoration: underline;
}

.lgf-lv-active .lgf-lv-actions {
    right: 20px;
    top: 15px;
}

.lgf-lv-options {
    display: none;
}

.lgf-lv-options h1 {
    text-align: left;
    font-size: 0.7rem;
    min-height: 0;
}

.lgf-lv-options ul {
    margin: 0.1rem;
}

.lgf-lv-active .lgf-lv-options {
    display: block;
    width: 25%;
    position: absolute;
    right: 1rem;
    top: 7rem;
}

.lgf-lv-active .lgf-lv-options ul {
    list-style: square;
    padding-left: 15px;
}

.lgf-lv-action-label {
    display: none;
    color: #000;
    font-style: italic;
}

.lgf-lv-active .lgf-lv-action-label {
    display: inline;
}

.lgf-lv-dates {
    position: absolute;
    right: 1px;
    top: 1px;
    font-size: .8em;
    width: 7.5rem;
}

.emarge {
    margin: 3px;
    display: inline;
}

.logoCamion {
    right: 1.8em;
    top: 2px;
    position: absolute;
}

.lgf-lv-active .logoCamion {
    right: 0;
    position: relative;
}

.grande-imprimante {
    width: 50px;
    display: block;
    margin: 20px auto;
    transition: transform .2s;
}

.grande-imprimante:hover {
    cursor: pointer;
    transform: scale(1.5);
}

a img {
    text-decoration: none;
    border: none;
}

img.icon16 {
    vertical-align: middle;
    max-width: 16px;
    max-height: 16px;
    margin: 0.2em 0;
}

#emarge {
    width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
}

.contenu-emarge {
    width: 80%;
}

.lgf-lv-dates img {
    vertical-align: -3px;
}

.lgf-lv-active .lgf-lv-dates {
    right: 1rem;
    top: 1rem;
    width: 11rem;
}

.lgf-lv-date-impression {
    display: none;
}

.lgf-lv-active .lgf-lv-date-impression {
    display: inline;
}

.lgf-lv-poids-picto {
    position: absolute;
    right: -30px;
    top: 1px;
}

.lgf-lv-poids-picto img {
    width: 20px;
}

.lgf-lv-active .lgf-lv-poidsCorrige {
    display: none;
}

.lgf-lv-demande-suppression {
    position: absolute;
    right: 4em;
    top: 1px;
}

.lgf-lv-active .lgf-lv-demande-suppression {
    position: relative;
    right: 0;
}

/* Journaux */
table#lgf-liste-journaux {
    width: auto !important;
}

#lgf-liste-journaux td {
    border: none;
}


#lgf-liste-journaux {
    border: none;
}

.lgf-journal {
    width: 215px;
    height: 90px;
    border: 1px solid #777;
    position: relative;
}

.lgf-journal .lgf-journal-numero {
    border-bottom: 1px solid #000;
    font-weight: bold;
    text-align: center;
}

.lgf-journal .lgf-journal-dateramasse {
    font-size: .9em;
    font-style: italic;
}

.lgf-journal .lgf-journal-flux {
    margin: 4px;
    padding: 4px 0;
    border: 1px solid #999;
    background-color: #eee;
    text-align: center;
}

.lgf-journal .lgf-journal-totaux {
    position: absolute;
    left: 0;
    bottom: 2px;
    width: 215px;
}

.lgf-journal .lgf-journal-reimprimer {
    position: absolute;
    display: none;
    width: 215px;
    height: 58px;
    padding-top: 18px;
    left: 0;
    bottom: 0;
    font-size: 1.2em;
    background: url(/img/ombre.png) repeat;
    text-align: center;
}

.lgf-journal .lgf-journal-reimprimer a {
    font-weight: bold;
    color: #fff;
    text-decoration: none;
}

.lgf-journal .lgf-journal-reimprimer img {
    vertical-align: -3px;
}

.lgf-journal:hover .lgf-journal-reimprimer {
    display: block;
}

/* Apropos */

.apropos-texte {
    margin-left: 10px;
    padding: 4px;
    width: 678px;
    text-align: justify;
    font-size: 1.2em;
}

.apropos-liste {
    margin: 10px;
    padding-left: 20px;
    width: 660px;
    font-size: 1.2em;
}

img.right {
    float: right;
}

img.left {
    float: left;
    margin: 0 1em;
}

#lgfbee-presentation {
    background-color: #ddd;
    height: 150px;
}

#lgfbee-presentation > img {
    margin-left: 15px;
}

#lgfbee-contact {
    background-color: #ddd;
}

#lgfbee-contact > img {
    margin-top: 50px;
    width: 678px;
}

.attention-enlevement {
    width: 668px;
    border: 1px solid #f77a7a;
    background-color: #f7e7e7;
    padding: 15px;
    font-size: 1.2em;
}

/* Logger */

.log_debug {
    color: #afafff;
}

.log_info {
    color: #4f4faf;
}

.log_notice {
    color: #afaf4f;
}

.log_warn {
    color: #ffafaf;
}

.log_error {
    color: #af4f4f;
}

#controle img {
    width: 70px;
}

#motif {
    width: 550px;
}

/* demande de suppression */
#css-motif {
    text-align: center;
    font-size: 16px;
    padding-top: 100px;
}

#css-motif ul.listeLv {
    max-width: 60rem;
    max-height: 15rem;
    overflow: auto;
    margin: auto;
    margin-bottom: 1rem;
    list-style: none;
    text-align: left;
    padding: 0.2rem;
}

/*Message technique */
.info {
    border: 1px solid;
    padding: 15px 10px 15px 10px;
    background-repeat: no-repeat;
    background-position: 10px center;
    cursor: pointer;
    color: #fefefe;
    width: 50px;
}

.info img {
    width: 50px;
}

#overlay {
    background-color: black;
    position: absolute;
    margin: 0;
    padding: 0;
    top: 0;
    left: 0;
    display: none;
    overflow: hidden;
}

#ajout {
    position: absolute;
    top: 20px;
    left: 50%;
    margin-left: -450px;
    width: 500px;
    max-height: 500px;
    overflow: auto;
    display: none;
    color: #444444;
    background-color: #fefefe;
    text-align: left;
}

/*Ajouter les autre type de message */
.messagetechnique-Nouveaute {
    color: firebrick !important;
}

.messagetechnique-Information {
    color: olive !important;
}

.messagetechnique-Maintenance {
    color: blue !important;
}

.messagetechnique-Avertissement {
    color: red !important;
}

#messagetechnique-aide {
    color: black;
    font-size: 10px;
    font-style: italic;
}

.chrono {
    text-align: right;
    padding-right: 2rem;
    color: lightgrey;
    font-size: 0.6rem;
}

/* ecran inférieur à 1360 de large*/
@media screen and (min-width: 1281px) and (max-width: 1360px) {
    #lgf-liste-lv {
        width: 98%;
    }

    /* pour l'historique */
    .lgf-lv-cloturee .lgf-lv-tiers,
    .lgf-lv-cloturee.lgf-lv-active .lgf-lv-infos,
    .lgf-lv-cloturee.lgf-lv-active .lgf-lv-valeurs,
    .lgf-lv-cloturee.lgf-lv-active .lgf-lv-suivi {
        width: calc(50% - 17rem);
    }

    .lgf-lv-cloturee .lgf-lv-destinataire,
    .lgf-lv-cloturee.lgf-lv-active .lgf-lv-valeurs {
        left: calc(50% - 4.2rem);
    }
}

/* ecran inférieur à 1280 de large*/
@media screen and (max-width: 1280px) {
    #lgf-liste-lv {
        width: 98%;
    }

    /* pour les encours et planifiées*/
    .lgf-lv-tiers,
    .lgf-lv-active .lgf-lv-infos,
    .lgf-lv-active .lgf-lv-valeurs,
    .lgf-lv-active .lgf-lv-suivi {
        width: calc(50% - 13rem);
    }

    .lgf-lv-destinataire,
    .lgf-lv-active .lgf-lv-valeurs {
        left: calc(50% - 1rem);
    }

    /* pour l'historique */
    .lgf-lv-cloturee .lgf-lv-tiers,
    .lgf-lv-cloturee.lgf-lv-active .lgf-lv-infos,
    .lgf-lv-cloturee.lgf-lv-active .lgf-lv-valeurs {
        width: calc(50% - 17rem);
    }

    .lgf-lv-cloturee .lgf-lv-destinataire,
    .lgf-lv-cloturee.lgf-lv-active .lgf-lv-valeurs {
        left: calc(50% - 5rem);
    }

    .lgf-lv-active .lgf-lv-suivi {
        width: 25%;
    }

    .lgf-lv-expediteur {
        left: 11.4rem;
    }

    .lgf-lv-cloturee .lgf-lv-infos {
        right: 15.5rem;
    }

    .lgf-lv-cloturee .lgf-lv-valeurs {
        right: 11.5rem;
    }

    .lgf-lv-suivi {
        right: 7.7rem;
    }
}

/* ecran inférieur à 1024 de large 
	la page déborde #content min-width */