/* ====================================================================================================*/
/* GLOBAL */
/* ====================================================================================================*/
body .ui-widget {
    font-family: Verdana, sans-serif;
    font-size: small;
}

body .ui-inputfield {
    font-size: small;
}

/* éléments sélectionnés dans un combo ou une picklist */
body .ui-selectonemenu-panel .ui-selectonemenu-items .ui-selectonemenu-item.ui-state-highlight {
    background: #007ad9;
    color: #ffffff;
    overflow: auto;
}

/* éléments dans un combo ou une picklist */
body .ui-picklist .ui-picklist-list {
    width: 260px;
}

/* éléments sélectionnés dans un combo ou une picklist */
body .ui-picklist-item.ui-state-highlight {
    background: #007ad9;
    color: #ffffff;
    overflow: auto;
}

/* éléments sélectionnés dans un combo ou une picklist */
body .ui-picklist .ui-picklist-list .ui-picklist-item.ui-state-highlight {
    background: #007ad9;
    color: #ffffff;
    overflow: auto;
}

/* Compactisation des lignes dans les picking-list */
body .ui-picklist .ui-picklist-list .ui-picklist-item {
    padding-top: 0px;
    padding-bottom: 0px;
}

.ui-picklist.pickingListUtilisateurs .ui-picklist-list {
    height: 500px;
}

/* élément de l'arbre de sélection dans l'édition des groupes d'utilisateurs */
body .ui-tree .ui-tree-container .ui-treenode .ui-treenode-content .ui-treenode-label.ui-state-highlight {
    background: #007ad9;
    color: #ffffff;
}

/* bouton de navigation du carousel contenu colis */
body .ui-carousel .ui-carousel-indicators .ui-carousel-indicator.ui-state-highlight button {
    background: #F2A05A;
    color: #101828;
}

.fa-exclamation-circle:before {
    content: "\f06a";
    background: #007ad9;
    color: #ffffff;
}

.titre {
    font-size: x-large;
    display: block;
    clear: both;
    margin: 20px;
}

.indicationOrange {
    color: #E3863A;
    font-size: small;
}


.labelPresentation {
    display: inline-block;
    font-weight: bold;
    margin-left: 0.5em;
    width: 175px;
}

.labelPresentationLong {
    display: inline-block;
    font-weight: bold;
    margin-left: 0.5em;
    width: 275px;
}

.labelLigne {
    display: inline-block;
    width: 150px;
    margin-right: 20px;
    text-align: right;
}

.grandChamp {
    width: 350px;
}


body .ui-datatable .ui-datatable-data > tr.ui-datatable-even.cron_err {
    background-color: #ff0000 !important;
    background-image: none !important;
    color: #ffffff !important;
}

body .ui-datatable .ui-datatable-data > tr.ui-datatable-odd.cron_err {
    background-color: #ff0000 !important;
    background-image: none !important;
    color: #ffffff !important;
}

/* ======================================= */
/* Largeur des champs de recherche dans les popups */
/* texte */
body .ui-inputfield.champRecherchePopup {
    width: 250px;
}

/* combobox */
body .ui-selectonemenu.champRecherchePopupSelect {
    width: 250px;
}

/* ======================================= */

/* Augmente la taille max des dropdown pour éviter le scroll pour une petite liste de valeurs */
.ui-selectonemenu-panel .ui-selectonemenu-items-wrapper {
    max-height: 300px;
}

/* Réduit la taille de la recherche intégrée aux combobox */
body .ui-selectonemenu-panel .ui-selectonemenu-filter-container .ui-selectonemenu-filter.ui-inputfield {
    padding-top: 3px;
    padding-bottom: 3px;
}

.petitChamp {
    width: 80px;
    display: inline-block;
}

.champMoyen {
    width: 150px;
    display: inline-block;
}

.grandChampDroite {
    width: 250px;
    height: 30px;
    border-style: none !important;
    border-left: solid 1px !important;
}

.grandChampGauche {
    width: 250px;
    height: 30px;
    border-style: none !important;
}

body .dataListServicePays .ui-datalist-content {
    border: 0px;
    padding: 0;
}

body .dataListDocument .ui-datalist-content {
    border: 0px;
    padding: 0;
}


/* Détails service transporteur liste pays déservies*/
body .dataListGroupeUsers .ui-datalist-content {
    border: 0px;
    padding: 0;
}

.blocBouton {
    margin-top: 0.7em;
    margin-bottom: 0.7em;
}

.blocBoutonInline {
    display: inline;
    margin-right: 5em;
}

.margeDroite {
    padding-right: 39px;
}

.margeGauche {
    padding-left: 50px;
}

.petiteMargeDroite {
    padding-right: 13px;
}

.margeDeuxCotes50 {
    padding-right: 40px;
    padding-left: 39px;
}

.enorme {
    width: 200px;
    height: 80px;
    font-size: large;
}

.grosTitre {
    font-size: xx-large;
    text-align: center;
}


/** Pour affichage des h:commandLink sous forme de bouton */
.ButtonStyle {
    border: 1px solid #007ad9;
    border-radius: 3px;
    padding: 5px 8px 5px 8px;
    color: #333333;
    background-color: #e7e7e7;
    text-decoration: none;
    font-weight: normal;
    display: inline;
    cursor: pointer;
    display: inline;
    margin-left: 5em;
}

.ButtonStyle:hover {
    background-color: #F2A05A !important;
    border-color: #F2A05A !important;
    box-shadow: 0 0 8px #F2A05A !important;
    color: #e7e7e7;
}

/** Pour affichage des h:commandLink sous forme de bouton icone */
.ButtonStyleIcone {
    border: 1px solid #007ad9;
    border-radius: 3px;
    padding: 5px 7px 4px 3px;
    color: #333333;
    background-color: #e7e7e7;
    text-decoration: none;
}

.ButtonStyleIcone:hover {
    background-color: #F2A05A !important;
    border-color: #F2A05A !important;
    box-shadow: 0 0 8px #F2A05A !important;
    color: #e7e7e7;
}

/** Pour affichage des h:commandLink sous forme de bouton */
.ButtonStyleInLine {
    border: 1px solid #007ad9;
    border-radius: 3px;
    padding: 5px 8px 5px 8px;
    color: #333333;
    background-color: #e7e7e7;
    text-decoration: none;
    font-weight: normal;
    display: inline;
    cursor: pointer;
    display: inline;
    margin-left: 5em;
}

.ButtonStyleInLine:hover {
    background-color: #F2A05A !important;
    border-color: #F2A05A !important;
    box-shadow: 0 0 8px #F2A05A !important;
    color: #e7e7e7;
}

/* carousel */
.ui-carousel-page-links {
    margin-top: -10px !important;
}

/* item du carousel */
.ui-items-hidden .ui-carousel-item.ui-carousel-item-active {
    border: 1px solid #c8c8c8;
    border-collapse: collapse;
}

.autoComplete240px input {
    width: 240px;
}

.ui-cell-editor .ui-inputtext {
    width: 100%;
}

.contenuColis, .contenuColis .ui-panel-content {
    background-color: white !important;
}

.ui-confirm-dialog .ui-dialog-buttonpane {
    text-align: center !important;
}

/* ============ TABLES ============= */
/* Une action = Petite cellule */
.dataTable td.action {
    width: 10px;
}

/* Taille de police réduite pour la liste des expéditions */
.dataTableExpes .ui-datatable-tablewrapper td,
.dataTableExpes .ui-datatable-tablewrapper th {
    font-size: 0.85em;
}

/* Densification TH */
body .ui-datatable thead th {
    padding: 0.3rem 0.4rem;
}


/* ============= MENU PRINCIPAL ==============*/
/* Centrage des boutons de la barre de menu principal */
.centeredMenuBar.ui-menubar {
    text-align: center;
}

/* réduction marges sup/inf de la barre */
body .ui-menu.ui-menubar {
    padding: 0.1rem;
    /*background: #c4c4c4;*/
}

.centeredMenuBar .ui-menu-list {
    display: inline-block;
}

/* Espacement des entrées de menu */
.centeredMenuBar .ui-widget.ui-menuitem {
    margin-right: 10px;
}

/* Réduction des marges inf/sup des entrées du menu principal */
/* Alignement à gauche du texte des entrées de menu, sinon c'est centré */
/* Retrait de l'animation sur les over des entrées de menu pour rendre la navigation plus fluide*/
body .ui-menu .ui-menu-list .ui-menuitem .ui-menuitem-link {
    padding-top: 0.3rem;
    padding-bottom: 0.5rem;
    text-align: left;
    transition: none;
}

/* Réduction de la marge entre le texte et l'indicateur de menu déroulant */
body .ui-menu .ui-menu-list .ui-menuitem .ui-menuitem-link .ui-icon-triangle-1-s:last-child:before {
    margin-left: -5px;
}

/* Empêche le retour à la ligne dans les entrées de sous-menu */
body .ui-menu .ui-menu-child {
    width: auto !important;
}
body .ui-menu .ui-menu-child .ui-menuitem .ui-menuitem-link {
    white-space: nowrap;
}

body .ui-tabs .ui-tabs-nav li.ui-tabs-header {
    background-color: white !important;
    border-color: white !important;
    border: 1px solid #007ad9;
    border-radius: 3px;
    font-weight: normal;
    color: #333333;
}

body .ui-tabs .ui-tabs-nav li.ui-tabs-header a {
    background-color: white !important;
    border-color: white !important;
    font-weight: normal;
    color: #333333;
    border: 1px solid #007ad9;
    border-radius: 3px;
}

body .ui-tabs .ui-tabs-nav li.ui-tabs-header.ui-state-active {
    background-color: #F2A05A !important;
    border-color: #F2A05A !important;
    box-shadow: 0 0 8px #F2A05A !important;
    font-weight: normal;
    color: #333333;
    border: 1px solid #007ad9;
    border-radius: 3px;
}

body .ui-tabs .ui-tabs-nav li.ui-tabs-header.ui-state-active a {
    background-color: #F2A05A !important;
    border-color: #F2A05A !important;
    box-shadow: 0 0 8px #F2A05A !important;
    font-weight: normal;
    color: #333333;
    border: 1px solid #007ad9;
    border-radius: 3px;
}

/* =============================================*/

/* Orange à la place du bleu pour caler un peu sur la charte graphique Connect */
.ui-button.ui-state-hover, .ui-button.ui-state-active, .ui-button.ui-state-focus,
.ui-menu-list .ui-state-hover, .ui-radiobutton-box.ui-state-hover,
.ui-radiobutton-box.ui-state-active, .ui-sortable-column.ui-state-hover,
.ui-sortable-column.ui-state-active, .ui-paginator-page, .ui-tabs-nav .ui-state-hover[aria-expanded=false],
.ui-fieldset-legend.ui-state-hover, .ui-selectonemenu.ui-state-hover,
.ui-selectonemenu.ui-state-focus, .ui-selectonemenu.ui-state-hover .ui-selectonemenu-trigger,
.ui-selectonemenu.ui-state-focus .ui-selectonemenu-trigger,
.ui-selectonemenu-item.ui-state-hover, .ui-chkbox-box.ui-state-hover,
.ui-chkbox-box.ui-state-active, .ui-dialog-titlebar-icon.ui-state-hover,
.ui-picklist-item.ui-state-hover, .ui-treenode-label.ui-state-hover {
    background-color: #F2A05A !important;
    border-color: #F2A05A !important;
    /* Orange du logo TMS, à plat : pas de halo, et texte foncé (le blanc du thème PrimeFaces est illisible dessus) */
    box-shadow: none !important;
    color: #101828 !important;
}

.ui-chkbox-box.ui-state-active .ui-chkbox-icon {
    color: #101828 !important;
}

/* Survol d'un bouton des écrans adhérents : orange plus soutenu, sinon un bouton déjà orange ne réagit plus
   (l'espace e-commerçant a ses propres survols, dans elo-theme.css) */
body:not(.elo-shell) .ui-button.ui-state-hover {
    background-color: #E3863A !important;
    border-color: #E3863A !important;
}

.ui-inputfield.ui-state-hover, .ui-inputfield.ui-state-focus {
    border-color: #F2A05A !important;
}

/* Jour sélectionné du calendrier : texte foncé sur l'orange (le thème PrimeFaces impose du blanc, plus spécifique) */
.ui-datepicker-calendar td .ui-state-active {
    background-color: #F2A05A !important;
    color: #101828 !important;
}

body .ui-selectcheckboxmenu .ui-selectcheckboxmenu-multiple-container .ui-selectcheckboxmenu-token .ui-selectcheckboxmenu-token-label {
    background-color: #F2A05A !important;
    background: #fff;
    border-color: #F2A05A !important;
    box-shadow: none !important;
    color: #101828 !important;
}


body .ui-datepicker .ui-datepicker-calendar td {
    padding: 0px;
}

body .ui-datepicker .ui-datepicker-calendar td a {
    width: 2rem;
    height: 2rem;
    line-height: 2rem;
}

/* Largeur fixe compacte et texte centré sur les input de date */
.shortDateInput {
    width: 100px;
    text-align: center;
}

/* Combobox de hauteur réduite en hauteur */
body .ui-selectonemenu .ui-selectonemenu-label {
    min-height: 1.8rem;
}

/* Lignes des combobox étendues réduites en hauteur */
body .ui-selectonemenu-panel .ui-selectonemenu-items .ui-selectonemenu-item {
    padding-top: 0.2rem;
    padding-bottom: 0.2rem;
}


/* Fin theme orange */

/* Densification formulaires */
body .ui-inputfield {
    padding-top: 0.3rem;
    padding-bottom: 0.3rem;
}


/* Panneau contenant */

/* Page de login : carte centrée reprise de la connexion de FacturationConnect (thème Elo, valeurs écrites ici car
   elo-theme.css n'est chargé que pour l'e-commerçant connecté), un peu plus large pour garder un grand logo */
#connexionPanel {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    margin: -8px;
    padding: 24px 12px;
    box-sizing: border-box;
    font-family: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
    background-color: #F8FAFB;
    /* Halo du haut dans l'orange du logo TMS (#F2A05A), dosé en transparence et plus étendu que celui de la
       facturation pour occuper l'écran ; halo vert du réseau en bas à droite */
    background-image:
        radial-gradient(110vw 85vh at 50% -18%, rgba(242, 160, 90, .30), rgba(242, 160, 90, .10) 45%, transparent 75%),
        radial-gradient(60vw 60vh at 95% 115%, rgba(141, 198, 63, .12), transparent 60%);
    background-repeat: no-repeat;
    background-attachment: fixed;
}

.connexion-carte {
    background: #FFFFFF;
    border: 1px solid rgba(0, 0, 0, .09);
    border-radius: 18px;
    box-shadow: 0 18px 50px rgba(16, 24, 40, .14);
    padding: 2.5rem;
    min-width: 350px;
    max-width: 500px;
    width: 100%;
    box-sizing: border-box;
}

.connexion-entete {
    text-align: center;
    margin-bottom: 2rem;
}

.connexion-entete .connexion-logo {
    display: block;
    margin: 0 auto .9rem;
    width: 100%;
    max-width: 340px;
    height: auto;
}

.connexion-entete p {
    color: #8A95A3;
    font-size: .9rem;
    margin: 0;
}

.connexion-champ {
    margin-bottom: 1.2rem;
}

.connexion-champ label {
    display: block;
    font-weight: 500;
    margin-bottom: .4rem;
    color: #4A5568;
    font-size: .9rem;
}

.connexion-champ .ui-inputfield {
    width: 100% !important;
    box-sizing: border-box;
    padding: 11px 14px;
    font-family: inherit;
    border-radius: 8px;
    border-color: #DDE3EC;
    color: #1A1C1E;
}

.connexion-champ .ui-inputfield::placeholder {
    color: #AAB3C0;
}

/* Survol et focus comme dans le thème Elo de la facturation : bordure orange, halo au focus */
.connexion-champ .ui-inputfield.ui-state-hover {
    border-color: #F2A05A !important;
}

.connexion-champ .ui-inputfield:focus,
.connexion-champ .ui-inputfield.ui-state-focus {
    border-color: #F2A05A !important;
    box-shadow: 0 0 0 .2rem rgba(242, 160, 90, .20) !important;
    outline: 0;
}

body .ui-button.connexion-bouton {
    width: 100%;
    margin-top: .5rem;
    padding: 6px 18px;
    font-family: inherit;
    font-weight: 600;
    border-radius: 8px;
    background: #F2A05A;
    border: 1px solid #F2A05A;
    color: #101828;
}

body .ui-button.connexion-bouton:focus {
    box-shadow: 0 0 0 .2rem rgba(242, 160, 90, .20);
    outline: 0;
}

body .ui-button.connexion-bouton:enabled:hover {
    background: #E3863A;
    border-color: #E3863A;
    color: #101828;
}

.connexion-pied {
    text-align: center;
    margin-top: 3rem;
    color: #8A95A3;
    font-size: .8rem;
}

.connexion-pied img {
    display: block;
    margin: 0 auto .8rem;
    height: 34px;
    width: auto;
}

body .ui-button {
    color: #333333;
    background: #ededed;
}

/* Header des popups */
body .ui-dialog .ui-dialog-titlebar,
body .ui-dialog .ui-dialog-box .ui-dialog-titlebar {
    background: #F2A05A;
    color: #333333;
    font-weight: 620;
    border-bottom: 1px solid gray;
    padding: 0.3rem 0.5rem;
}


/* Enlever le header sur la popup dialog */
body .dialogSansHeader .ui-dialog-titlebar,
body .dialogSansHeader .ui-dialog-box .ui-dialog-titlebar {
    display: none;
}

body .ui-dialog .ui-dialog-titlebar .ui-dialog-titlebar-icon,
body .ui-dialog .ui-dialog-box .ui-dialog-titlebar .ui-dialog-titlebar-icon {
    height: 1.5rem;
    line-height: 1.5rem;
    color: #333333;
    /*box-shadow: 0 0 0 0 #333333;*/
}

body .ui-dialog .ui-dialog-titlebar .ui-dialog-titlebar-icon:focus,
body .ui-dialog .ui-dialog-box .ui-dialog-titlebar .ui-dialog-titlebar-icon:focus {
    box-shadow: 0 0 0 0 #F2A05A;
}

body .ui-dialog .ui-dialog-titlebar .ui-dialog-titlebar-icon:hover,
body .ui-dialog .ui-dialog-box .ui-dialog-titlebar .ui-dialog-titlebar-icon:hover {
    box-shadow: 0 0 0 0 #F2A05A;
}

.doublePanel {
    border-collapse: separate !important;
}


/* Lignes paires : orange très clair du thème TMS (#FFF9F3), à la place du gris #E9E9E9 ; voir aussi « TABLEAUX »
   en fin de fichier pour les tableaux qui posent leur propre alternance */
body .ui-datatable .ui-datatable-data > tr.ui-datatable-even {
    background-color: #FFF9F3;
}

/* header des tableaux (ex: Actions Utilisateur) */
body .ui-panelgrid .ui-panelgrid-cell.ui-widget-header {
    border: 1px solid lightgray;
    padding: 0.1rem 0.3rem;
    background: transparent;
    color: #333333;
}


/* Matrice des droits (action/List.xhtml) : groupes en colonnes, actions en lignes regroupées par contrôleur */
.droits-page {
    padding: 1rem 1.25rem;
}

.droits-barre {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.75rem 1.5rem;
    margin-bottom: 0.75rem;
}

.droits-filtre {
    width: 22rem;
    max-width: 100%;
    padding: 0.5rem 0.75rem;
    border: 1px solid #CED4DA;
    border-radius: 4px;
    font-size: 0.9rem;
}

.droits-filtre:focus {
    outline: none;
    border-color: #F2A05A;
    box-shadow: 0 0 0 2px rgba(242, 160, 90, 0.2);
}

.droits-legende {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    color: #555555;
    font-size: 0.85rem;
}

.droits-legende .droits-acces--non {
    margin-left: 0.75rem;
}

.droits-compte {
    margin-left: auto;
    color: #777777;
    font-size: 0.85rem;
}

.droits-cadre {
    max-height: calc(100vh - 210px);
    overflow: auto;
    border: 1px solid #DEE2E6;
    border-radius: 6px;
    background: #FFFFFF;
}

.droits-matrice {
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    font-size: 0.875rem;
}

.droits-matrice th,
.droits-matrice td {
    border-bottom: 1px solid #EEF0F2;
    padding: 0.35rem 0.6rem;
}

/* En-tête des groupes : figé en haut au défilement */
.droits-matrice thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: #F4F6F8;
    border-bottom: 2px solid #DEE2E6;
    color: #333333;
    font-weight: 600;
    vertical-align: bottom;
}

.droits-matrice thead th.droits-coin {
    left: 0;
    z-index: 3;
    text-align: left;
    min-width: 16rem;
}

.droits-groupe {
    min-width: 6.5rem;
    max-width: 9rem;
    text-align: center;
    line-height: 1.2;
}

.droits-groupe__nom {
    display: block;
}

.droits-groupe__compte {
    display: block;
    margin-top: 0.2rem;
    color: #888888;
    font-size: 0.75rem;
    font-weight: 400;
}

/* Titre de contrôleur : bandeau sur toute la largeur, nom figé à gauche au défilement horizontal */
.droits-bloc__titre th {
    background: #FEF4EA;
    border-top: 1px solid #FCE0C6;
    border-bottom: 1px solid #FCE0C6;
    padding: 0.45rem 0.6rem;
    text-align: left;
    color: #9A4F12;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    font-size: 0.78rem;
}

.droits-bloc__titre th span {
    position: sticky;
    left: 0.6rem;
}

/* Nom de l'action : figé à gauche au défilement horizontal */
.droits-action {
    position: sticky;
    left: 0;
    z-index: 1;
    background: #FFFFFF;
    text-align: left;
    font-weight: 400;
    color: #333333;
    padding-left: 1.4rem !important;
    border-right: 1px solid #EEF0F2;
}

.droits-cellule {
    text-align: center;
}

.droits-ligne:hover td,
.droits-ligne:hover .droits-action,
.droits-matrice .droits-col-survol {
    background: #FEF4EA;
}

.droits-ligne:hover td.droits-col-survol {
    background: #FCE0C6;
}

.droits-matrice thead th.droits-col-survol {
    background: #FCE0C6;
}

.droits-acces {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
}

.droits-acces .pi {
    font-size: 0.75rem;
}

.droits-acces--oui {
    background: #E3F4E6;
    color: #2E7D32;
}

.droits-acces--non {
    color: #C4C9CE;
}

.droits-vide {
    padding: 1.5rem;
    text-align: center;
    color: #777777;
}

.sansBordures .ui-datagrid-content {
    border: none;
    margin-bottom: 20px;
}

#footer {
    vertical-align: bottom;
    text-align: center;
    clear: both;
}

/* colonne actions pour icones centrés et largueur fixe */
.colonneActions {
    vertical-align: middle;
    text-align: center;
    width: 200px;
}

.colonneRequete {
    display: inline-block;
    width: 12em;
    text-align: center;
    margin-left: 1em;
    margin-right: 1em;
}


/* ====================================================================================================*/
/* POPUPS */
/* ====================================================================================================*/
/* Croix des popups en noir */
body .ui-dialog .ui-dialog-titlebar .ui-dialog-titlebar-icon .ui-icon-closethick,
body .ui-dialog .ui-dialog-box .ui-dialog-titlebar .ui-dialog-titlebar-icon .ui-icon-closethick {
    color: black;
}

/*.ui-confirm-dialog {*/
/*    z-index: 100;*/
/*}*/

/* ====================================================================================================*/
/* TABLES */
/* ====================================================================================================*/
/* densification des lignes datatable */
body .ui-datatable .ui-datatable-data > tr > td {
    padding: 0.1rem 0.2rem;
}

body .ui-datatable tfoot td {
    background: #f4f4f4;
    border: 1px solid #c8c8c8;
    border-width: 1px 1px 1px 1px;
    color: #333;
    padding: 0.1rem 0.2rem;
    font-weight: 700;
    text-align: left;
    box-sizing: content-box;
}

/* ====================================================================================================*/
/* CARDS/PANELS */
/* ====================================================================================================*/
/* Réduction des marges internes aux fieldsets */
body .ui-fieldset {
    padding: 0.3rem 0.4rem;
}

/* Réduction des marges internes aux datagrids dans des fieldsets */
body .ui-datagrid .ui-datagrid-content {
    padding: 0.3rem 0.4rem;
}

body .ui-datalist .ui-datalist-content {
    padding: 0 0 0 0;
}

/* cards header amincies  */
body .ui-fieldset .ui-fieldset-legend {
    color: #333333;
    border-color: #F2A05A;
    background: transparent;
    padding: 0.2rem 0.5rem;
    font-weight: 500
}

/* ====================================================================================================*/
/* FORMULAIRES */
/* ====================================================================================================*/
/* Hauteur réduite des dropdown */
body .ui-button.ui-button-text-only .ui-button-text {
    padding: 0.3rem;
}

body .ui-button.ui-button-icon-only .ui-button-text {
    padding: 0.3rem;
}

/* Hauteur réduite des boutons avec icone et texte (ex : Recherche avancée) */
body .ui-button.ui-button-text-icon-left .ui-button-text {
    color: #333333;
    background: transparent;
    padding: 0.3rem 0.5rem 0.3rem 1.8rem;
}

body .ui-button.ui-button-text-icon-right .ui-button-text {
    padding: 0.2rem 2rem 0.2rem 1rem;
}

/* Dimension des boutons*/
body .ui-button.ui-button-icon-only {
    width: 1.7rem;
    height: 1.7rem;
    margin: 0.1rem;
    padding: 0;
}

/* Retrait de la marge du bouton des datepicker dans les formulaires */
body .ui-calendar .ui-button.ui-button-icon-only {
    margin: 0px;
    width: 2rem; /* ratio carré */
}

/* header datatable (ex : liste des points relais) : bandeau de section d'impression_saisie au lieu du bleu du thème */
body .ui-datatable .ui-datatable-header {
    padding: 0.5rem 0.6rem;
    background: rgba(242, 160, 90, 0.1);
    border-left: 4px solid #F2A05A;
    color: #333333;
}

/* barres de progression : orange de l'application au lieu du bleu du thème */
body .ui-progressbar .ui-progressbar-value {
    background: #F2A05A;
}

/* header suivi colis détail expédition */
body .ui-datagrid .ui-datagrid-header {
    padding: 0.2rem 0.5rem;
    border-radius: 0px;
    background: lightgrey;
    color: black;
    border-color: lightgrey;
}


body .ui-panelgrid .ui-panelgrid-cell {
    padding-top: 0.2rem;
    padding-bottom: 0.2rem;
}

/* cadre des éléments de l'index */
body .noBorder .ui-panel-content {
    border: 0px solid #c8c8c8;
}


/* ====================================================================================================*/
/* MENU PRINCIPAL */
/* ====================================================================================================*/
.identificationPanel {
    display: flex;
    align-items: center;
    gap: 12px;
    height: 4.6em;
    text-align: center;
}

/* Dimensions et positionnement logo de l'appli : centré verticalement dans la barre, proportions gardées */
.identificationPanel > a {
    flex: 0 0 auto;
    line-height: 0;
}

.identificationPanel img {
    height: 4.2em;
    width: auto;
}

/* Accueil de l'e-commerçant : logo e-Kan Connect « by » logo de l'adhérent, centrés au-dessus du titre */
.elo-shell .elo-accueil-marques {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 56px;
    flex-wrap: wrap;
    padding: 8px 0 18px;
}

.elo-shell .elo-accueil-logo {
    height: 80px;
    width: auto;
    max-width: 40%;
    object-fit: contain;
}

.elo-shell .elo-accueil-by {
    font-size: 20px;
    font-weight: 700;
    font-style: italic;

    color: var(--elo-slate);
}

/* Logo générique du réseau, sans la ligne du nom d'adhérent : réduit d'autant (191/224) pour que son mot
   e•LOGIK ait la largeur de celui d'un logo d'adhérent */
.elo-shell .elo-accueil-logo.elo-accueil-logo-reseau {
    height: 68px;
}

/* En sombre, les logos passent dans leur version claire (lettres en blanc, couleurs de marque intactes), sur le fond
   de la page : plus de cartouche blanc. La bascule fonce/clair est celle du menu (elo-layout.css). */
.elo-shell.elo-dark .elo-accueil-by {
    color: #AFBACA;
}

/* ---------------------------------------------------------------------------------------------------
   Espace e-commerçant : ajustements des écrans partagés avec les adhérents. Tout est préfixé par
   .elo-shell, classe que le gabarit ne pose que pour un e-commerçant : les adhérents n'en héritent pas.
   --------------------------------------------------------------------------------------------------- */

/* Titre du gabarit masqué quand l'écran porte déjà son propre bandeau (saisie manuelle, import fichier,
   fiche expéditeur, points retraits) : sinon le titre s'affiche deux fois. */
.elo-shell .layout-main:has(.page-header:not(.elo-titre-gabarit)) > .elo-titre-gabarit {
    display: none;
}

/* Bandeau propre à l'écran (fiche expéditeur, saisie manuelle, import, points retraits) : la règle
   .layout-main .page-header du thème, plus spécifique, ramenait son retrait intérieur à 0 et collait l'icône à la
   bordure orange. On lui rend un retrait égal à l'écart entre l'icône et le texte (16 px). */
.elo-shell .layout-main .page-header:not(.elo-titre-gabarit) {
    padding-left: 16px;
    padding-right: 16px;
}

/* Même écart entre l'icône et le texte sur tous ces bandeaux : selon l'écran, le titre était en flex ou non, et
   l'espace qui suit l'icône comptait ou disparaissait (10 px d'un côté, 16 de l'autre). */
.elo-shell .layout-main .page-header:not(.elo-titre-gabarit) h1 {
    display: flex;
    align-items: center;
    gap: 16px;
}

.elo-shell .layout-main .page-header:not(.elo-titre-gabarit) h1 > i:first-child {
    margin-right: 0 !important;
}

/* Tableaux : PrimeFaces les met en table-layout: fixed. Les colonnes à largeur imposée prennent alors
   toute la place et celles qui n'en ont pas tombent à 0 px (Destinataire, Destination, E-commerçant et
   Service de la liste des expéditions), la zone de contenu étant plus étroite à côté du menu latéral.
   En automatique, chaque colonne prend la largeur de son contenu, avec défilement horizontal au besoin. */
.elo-shell .ui-datatable table {
    table-layout: auto;
}

/* En-têtes du thème en capitales : on les laisse passer à la ligne plutôt que d'être coupés */
.elo-shell .ui-datatable thead th,
.elo-shell .ui-datatable thead th .ui-column-title {
    white-space: normal;
    overflow-wrap: normal;
}

/* Saisie manuelle / import : la grille « Informations générales » ne doit pas déborder. PrimeFaces
   fixe en style direct la largeur de la liste des services sur l'option la plus longue (~550 px), ce qui
   empêchait la colonne de rétrécir ; les colonnes de champs peuvent désormais descendre sous leur contenu. */
.elo-shell .form-row-generales {
    grid-template-columns: auto minmax(0, 1fr) auto minmax(0, 1fr);
}

/* Seulement les listes posées directement dans la grille (le .form-group est en display: contents) : les
   listes de devise, à côté d'un montant, gardent leur largeur. PrimeFaces impose la largeur minimale en style
   direct, d'où le !important. */
.elo-shell .form-row-generales > .form-group > .ui-selectonemenu {
    width: 100% !important;
    min-width: 0 !important;
}

.elo-shell .form-row-generales input.ui-inputfield {
    min-width: 0;
    max-width: 100%;
}

/* Saisie manuelle : la rangée d'un colis (poids, valeur, dimensions, bouton « article ») est en nowrap ; à côté
   du menu latéral elle dépassait d'environ 150 px. Elle passe désormais à la ligne. */
.elo-shell .colis-inline-row {
    flex-wrap: wrap;
    row-gap: 10px;
}

/* Barre d'actions (Réinitialiser, Vérifier, format, imprimante, Créer et imprimer) : alignée à droite et sans
   retour à la ligne, elle débordait vers la GAUCHE, sous le menu latéral. */
.elo-shell .action-buttons {
    flex-wrap: wrap;
    row-gap: 10px;
}

/* Couleurs des tableaux et des listes : les règles générales de ce fichier (lignes paires #e9e9e9, pied de
   tableau #f4f4f4, surlignage bleu #007ad9) sont chargées après le thème et l'écrasaient. En mode sombre, les
   lignes paires restaient gris clair sous un texte clair, presque illisibles. On rend la main au thème Elo. */
body.elo-shell .ui-datatable .ui-datatable-data > tr.ui-datatable-even {
    background-color: rgba(15, 23, 42, .016);
}

body.elo-shell.elo-dark .ui-datatable .ui-datatable-data > tr.ui-datatable-even {
    background-color: rgba(255, 255, 255, .027);
}

body.elo-shell .ui-datatable tfoot td {
    background: var(--elo-white);
    border-color: var(--elo-border);
    color: var(--elo-ink);
}

body.elo-shell .ui-selectonemenu-panel .ui-selectonemenu-items .ui-selectonemenu-item.ui-state-highlight {
    background: var(--elo-brand);
    color: var(--elo-on-brand);
}

/* En-têtes d'encarts et de fenêtres au style de FacturationConnect (elo-theme.css, §6 et §8) : en-tête blanc, texte
   foncé, trait de séparation et barre d'accent orange à gauche, au lieu des dégradés orange d'eKanConnect.
   Les dégradés sont posés par les écrans eux-mêmes (fiche expéditeur, saisie manuelle, points retraits, modale de
   l'import) et, pour toutes les fenêtres, par la règle « POPUPS » de ce fichier : on les reprend ici. */

/* Fenêtres (Recherche avancée, Références, mode d'emploi…) */
body.elo-shell .ui-dialog .ui-dialog-titlebar,
body.elo-shell .ui-dialog .ui-dialog-box .ui-dialog-titlebar,
body.elo-shell .modale-orange .ui-dialog-titlebar,
body.elo-shell .modale-orange .ui-dialog-box .ui-dialog-titlebar {
    position: relative;
    background: var(--elo-white) !important;
    color: var(--elo-ink);
    border: 0 !important;
    border-bottom: 1px solid var(--elo-border) !important;
    border-radius: 0 !important;
    padding: 14px 18px 14px 22px;
    font-weight: 700;
    letter-spacing: -.1px;
}

body.elo-shell .modale-orange .ui-dialog-titlebar .ui-dialog-title,
body.elo-shell .modale-orange .ui-dialog-box .ui-dialog-titlebar .ui-dialog-title {
    color: var(--elo-ink) !important;
}

body.elo-shell .ui-dialog .ui-dialog-titlebar .ui-dialog-titlebar-icon,
body.elo-shell .ui-dialog .ui-dialog-titlebar .ui-dialog-titlebar-icon .ui-icon,
body.elo-shell .ui-dialog .ui-dialog-box .ui-dialog-titlebar .ui-dialog-titlebar-icon,
body.elo-shell .ui-dialog .ui-dialog-box .ui-dialog-titlebar .ui-dialog-titlebar-icon .ui-icon {
    color: var(--elo-muted) !important;
    border-radius: 6px;
}

body.elo-shell .ui-dialog .ui-dialog-titlebar .ui-dialog-titlebar-icon:hover,
body.elo-shell .ui-dialog .ui-dialog-box .ui-dialog-titlebar .ui-dialog-titlebar-icon:hover {
    background: var(--elo-surface) !important;
    border-color: transparent !important;
}

/* Encarts des écrans (fiche expéditeur, saisie manuelle, points retraits, tableau de bord) */
body.elo-shell .info-card-header,
body.elo-shell .services-header,
body.elo-shell .section-header,
body.elo-shell .fiche-section-header,
body.elo-shell .table-card-header {
    position: relative;
    background: var(--elo-white);
    color: var(--elo-ink);
    border-left: 0;
    border-bottom: 1px solid var(--elo-border);
    padding-left: 22px;
    font-weight: 700;
    letter-spacing: -.1px;
}

body.elo-shell .info-card-header:before,
body.elo-shell .services-header:before,
body.elo-shell .section-header:before,
body.elo-shell .fiche-section-header:before,
body.elo-shell .table-card-header:before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 60%;
    border-radius: 0 3px 3px 0;
    background: var(--elo-brand);
}

body.elo-shell .info-card-header i,
body.elo-shell .services-header i,
body.elo-shell .section-header i,
body.elo-shell .fiche-section-header i,
body.elo-shell .table-card-header i {
    color: var(--elo-brand);
}

/* Tableau de bord : le bandeau des filtres perd sa bordure gauche orange au profit du même trait d'accent */
body.elo-shell .dashboard-filters {
    position: relative;
    background: var(--elo-white);
    border: 1px solid var(--elo-border);
    padding-left: 22px;
}

body.elo-shell .dashboard-filters:before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 60%;
    border-radius: 0 3px 3px 0;
    background: var(--elo-brand);
}

/* Tableau de bord en mode sombre : les cartes et les textes sont codés en blanc / gris foncé dans la page */
body.elo-shell.elo-dark .dashboard-header,
body.elo-shell.elo-dark .kpi-card,
body.elo-shell.elo-dark .chart-card,
body.elo-shell.elo-dark .table-card,
body.elo-shell.elo-dark .skeleton-card {
    background: var(--elo-white);
    box-shadow: 0 0 0 1px var(--elo-border);
}

body.elo-shell.elo-dark .dashboard-header h2,
body.elo-shell.elo-dark .kpi-value,
body.elo-shell.elo-dark .chart-card-title,
body.elo-shell.elo-dark .dashboard-filters .filter-label {
    color: var(--elo-ink);
}

body.elo-shell.elo-dark .kpi-label,
body.elo-shell.elo-dark .skeleton-text,
body.elo-shell.elo-dark .chart-card-title .chart-toggle-btn {
    color: var(--elo-muted);
}

body.elo-shell.elo-dark .chart-card-title .chart-toggle-btn {
    border-color: var(--elo-border);
}

body.elo-shell.elo-dark .chart-card-title .chart-toggle-btn:hover {
    background: var(--elo-surface);
    color: var(--elo-ink);
}

/* Écrans e-commerçant en mode sombre : les styles propres aux pages (fiche, saisie, import, liste, points
   retraits) codent leurs fonds en blanc et leurs textes en gris foncé ; on les ramène aux couleurs du thème. */
body.elo-shell.elo-dark .page-header,
body.elo-shell.elo-dark .info-card,
body.elo-shell.elo-dark .services-section,
body.elo-shell.elo-dark .fiche-panel,
body.elo-shell.elo-dark .article-item {
    background: var(--elo-white);
    border-color: var(--elo-border);
}

body.elo-shell.elo-dark .page-header {
    border-left-color: var(--elo-brand);
}

body.elo-shell.elo-dark .colis-card,
body.elo-shell.elo-dark .recherche-adresse-section,
body.elo-shell.elo-dark .horaires-block,
body.elo-shell.elo-dark .facture-dropzone,
body.elo-shell.elo-dark .previsu-dialog .ui-dialog-content {
    background: var(--elo-surface);
    border-color: var(--elo-border);
}

body.elo-shell.elo-dark .colis-card-header,
body.elo-shell.elo-dark .info-row,
body.elo-shell.elo-dark .result-row,
body.elo-shell.elo-dark .action-buttons {
    border-color: var(--elo-border);
}

body.elo-shell.elo-dark .page-header h1,
body.elo-shell.elo-dark .info-value,
body.elo-shell.elo-dark .result-value,
body.elo-shell.elo-dark .form-group label,
body.elo-shell.elo-dark .horaires-block,
body.elo-shell.elo-dark .pr-datatable tbody td {
    color: var(--elo-ink);
}

body.elo-shell.elo-dark .info-label,
body.elo-shell.elo-dark .result-label,
body.elo-shell.elo-dark .help-text,
body.elo-shell.elo-dark .dim-separator,
body.elo-shell.elo-dark .no-ecommercant,
body.elo-shell.elo-dark .recherche-adresse-hint,
body.elo-shell.elo-dark .recherche-adresse-section label,
body.elo-shell.elo-dark .horaires-block .h-day-label,
body.elo-shell.elo-dark .article-item .article-fields .form-group > label,
body.elo-shell.elo-dark .previsu-msg,
body.elo-shell.elo-dark .previsu-img-caption,
body.elo-shell.elo-dark .previsu-loading-text {
    color: var(--elo-muted);
}

body.elo-shell.elo-dark .addr-search-input {
    background: var(--elo-surface);
    color: var(--elo-ink);
    border-color: var(--elo-border);
}

body.elo-shell.elo-dark .ui-button.btn-outline-orange .ui-button-text,
body.elo-shell.elo-dark .ui-button.btn-outline-orange .ui-button-icon {
    color: var(--elo-ink) !important;
}

/* Boutons « texte » (pays desservis d'un service) : gris clair du thème PrimeFaces, illisibles en sombre */
body.elo-shell.elo-dark .ui-button.p-button-text {
    background: transparent !important;
    border-color: transparent !important;
    color: var(--elo-brand) !important;
}

body.elo-shell.elo-dark .ui-button.p-button-text:hover {
    background: var(--elo-surface) !important;
}

/* Couleurs posées en style direct dans les pages (libellés, titres d'article, listes) : seuls les gris
   foncés et les fonds blancs sont repris, les encadrés colorés (succès, alerte, erreur) restent lisibles. */
body.elo-shell.elo-dark .layout-main [style*="color:#333;"],
body.elo-shell.elo-dark .ui-dialog [style*="color:#333;"],
body.elo-shell.elo-dark .layout-main [style*="color: #333;"],
body.elo-shell.elo-dark .ui-dialog [style*="color: #333;"],
body.elo-shell.elo-dark .layout-main [style$='color:#333'],
body.elo-shell.elo-dark .ui-dialog [style$='color:#333'],
body.elo-shell.elo-dark .layout-main [style$='color: #333'],
body.elo-shell.elo-dark .ui-dialog [style$='color: #333'],
body.elo-shell.elo-dark .layout-main [style*="color:#333333"],
body.elo-shell.elo-dark .ui-dialog [style*="color:#333333"],
body.elo-shell.elo-dark .layout-main [style*="color: #333333"],
body.elo-shell.elo-dark .ui-dialog [style*="color: #333333"] {
    color: var(--elo-ink) !important;
}

body.elo-shell.elo-dark .layout-main [style*="color:#555"],
body.elo-shell.elo-dark .ui-dialog [style*="color:#555"],
body.elo-shell.elo-dark .layout-main [style*="color: #555"],
body.elo-shell.elo-dark .ui-dialog [style*="color: #555"],
body.elo-shell.elo-dark .layout-main [style*="color:#666"],
body.elo-shell.elo-dark .ui-dialog [style*="color:#666"],
body.elo-shell.elo-dark .layout-main [style*="color: #666"],
body.elo-shell.elo-dark .ui-dialog [style*="color: #666"] {
    color: var(--elo-muted) !important;
}

body.elo-shell.elo-dark .layout-main [style*="background:#fff;"],
body.elo-shell.elo-dark .ui-dialog [style*="background:#fff;"],
body.elo-shell.elo-dark .layout-main [style*="background: #fff;"],
body.elo-shell.elo-dark .ui-dialog [style*="background: #fff;"],
body.elo-shell.elo-dark .layout-main [style$='background:#fff'],
body.elo-shell.elo-dark .ui-dialog [style$='background:#fff'],
body.elo-shell.elo-dark .layout-main [style$='background: #fff'],
body.elo-shell.elo-dark .ui-dialog [style$='background: #fff'],
body.elo-shell.elo-dark .layout-main [style*="background:white"],
body.elo-shell.elo-dark .ui-dialog [style*="background:white"],
body.elo-shell.elo-dark .layout-main [style*="background: white"],
body.elo-shell.elo-dark .ui-dialog [style*="background: white"],
body.elo-shell.elo-dark .layout-main [style*="background:#f8f9fa"],
body.elo-shell.elo-dark .ui-dialog [style*="background:#f8f9fa"],
body.elo-shell.elo-dark .layout-main [style*="background: #f8f9fa"],
body.elo-shell.elo-dark .ui-dialog [style*="background: #f8f9fa"],
body.elo-shell.elo-dark .layout-main [style*="background:#e9ecef"],
body.elo-shell.elo-dark .ui-dialog [style*="background:#e9ecef"],
body.elo-shell.elo-dark .layout-main [style*="background: #e9ecef"],
body.elo-shell.elo-dark .ui-dialog [style*="background: #e9ecef"] {
    background: var(--elo-surface) !important;
}

/* Cases à cocher et liste du format d'étiquette : fond blanc du thème PrimeFaces */
body.elo-shell.elo-dark .ui-chkbox .ui-chkbox-box:not(.ui-state-active) {
    background: var(--elo-surface);
    border-color: var(--elo-border);
}

/* Import fichier : boutons de téléchargement des modèles et bouton de choix du fichier */
body.elo-shell.elo-dark .btn-secondary-a.btn-modele-import {
    color: var(--elo-ink) !important;
}

body.elo-shell.elo-dark .ui-fileupload-simple > .ui-button,
body.elo-shell.elo-dark .ui-fileupload-simple > .ui-button .ui-button-text {
    background: var(--elo-surface) !important;
    border-color: var(--elo-border) !important;
    color: var(--elo-ink) !important;
}

/* Boutons PrimeFaces sans style propre (Recherche avancée, Rafraîchir, Afficher toutes les expéditions, CN23,
   boutons des fenêtres) : style.css, commun aux adhérents, les remet en gris #EDEDED après le thème Elo, et ils
   ne réagissaient plus ni au survol ni au clic. Pour l'e-commerçant : bouton de la charte (jaune, texte foncé,
   jaune moyen au survol et au clic). Les boutons stylés par les pages (btn-*) gardent leurs couleurs. */
body.elo-shell .ui-button:not([class*="btn-"]):not([class*="p-button"]):not(.ui-button-flat):not(.ui-button-secondary):not(.ui-button-danger):not(.ui-button-success):not(.ui-button-warning):not(.ui-button-info):not(.ui-button-outlined):not(.ui-confirmdialog-no):not(.ui-paginator-page):not(.ui-paginator-first):not(.ui-paginator-prev):not(.ui-paginator-next):not(.ui-paginator-last):not(.suivi-onglet):not(.ui-selectbooleanbutton):not(.ui-datatable tbody .ui-button) {
    background: var(--elo-brand) !important;
    border: 1px solid var(--elo-brand) !important;
    color: var(--elo-on-brand) !important;
}

body.elo-shell .ui-button:not([class*="btn-"]):not([class*="p-button"]):not(.ui-button-flat):not(.ui-button-secondary):not(.ui-button-danger):not(.ui-button-success):not(.ui-button-warning):not(.ui-button-info):not(.ui-button-outlined):not(.ui-confirmdialog-no):not(.ui-paginator-page):not(.ui-paginator-first):not(.ui-paginator-prev):not(.ui-paginator-next):not(.ui-paginator-last):not(.suivi-onglet):not(.ui-selectbooleanbutton):not(.ui-datatable tbody .ui-button) .ui-button-text,
body.elo-shell .ui-button:not([class*="btn-"]):not([class*="p-button"]):not(.ui-button-flat):not(.ui-button-secondary):not(.ui-button-danger):not(.ui-button-success):not(.ui-button-warning):not(.ui-button-info):not(.ui-button-outlined):not(.ui-confirmdialog-no):not(.ui-paginator-page):not(.ui-paginator-first):not(.ui-paginator-prev):not(.ui-paginator-next):not(.ui-paginator-last):not(.suivi-onglet):not(.ui-selectbooleanbutton):not(.ui-datatable tbody .ui-button) .ui-icon {
    color: var(--elo-on-brand) !important;
}

body.elo-shell .ui-button:not([class*="btn-"]):not([class*="p-button"]):not(.ui-button-flat):not(.ui-button-secondary):not(.ui-button-danger):not(.ui-button-success):not(.ui-button-warning):not(.ui-button-info):not(.ui-button-outlined):not(.ui-confirmdialog-no):not(.ui-paginator-page):not(.ui-paginator-first):not(.ui-paginator-prev):not(.ui-paginator-next):not(.ui-paginator-last):not(.suivi-onglet):not(.ui-selectbooleanbutton):not(.ui-datatable tbody .ui-button):enabled:hover,
body.elo-shell .ui-button:not([class*="btn-"]):not([class*="p-button"]):not(.ui-button-flat):not(.ui-button-secondary):not(.ui-button-danger):not(.ui-button-success):not(.ui-button-warning):not(.ui-button-info):not(.ui-button-outlined):not(.ui-confirmdialog-no):not(.ui-paginator-page):not(.ui-paginator-first):not(.ui-paginator-prev):not(.ui-paginator-next):not(.ui-paginator-last):not(.suivi-onglet):not(.ui-selectbooleanbutton):not(.ui-datatable tbody .ui-button).ui-state-hover {
    background: var(--elo-brand-mid) !important;
    border-color: var(--elo-brand-mid) !important;
}

body.elo-shell .ui-button:not([class*="btn-"]):not([class*="p-button"]):not(.ui-button-flat):not(.ui-button-secondary):not(.ui-button-danger):not(.ui-button-success):not(.ui-button-warning):not(.ui-button-info):not(.ui-button-outlined):not(.ui-confirmdialog-no):not(.ui-paginator-page):not(.ui-paginator-first):not(.ui-paginator-prev):not(.ui-paginator-next):not(.ui-paginator-last):not(.suivi-onglet):not(.ui-selectbooleanbutton):not(.ui-datatable tbody .ui-button):enabled:active,
body.elo-shell .ui-button:not([class*="btn-"]):not([class*="p-button"]):not(.ui-button-flat):not(.ui-button-secondary):not(.ui-button-danger):not(.ui-button-success):not(.ui-button-warning):not(.ui-button-info):not(.ui-button-outlined):not(.ui-confirmdialog-no):not(.ui-paginator-page):not(.ui-paginator-first):not(.ui-paginator-prev):not(.ui-paginator-next):not(.ui-paginator-last):not(.suivi-onglet):not(.ui-selectbooleanbutton):not(.ui-datatable tbody .ui-button).ui-state-active {
    background: var(--elo-brand-mid) !important;
    border-color: var(--elo-brand-mid) !important;
    box-shadow: inset 0 2px 4px rgba(16, 24, 40, .25) !important;
}

/* Bouton désactivé en sombre (CN23 sans objet) : le jaune à 55 % d'opacité donnait un brun boueux sous un texte
   foncé ; il prend la teinte neutre du thème, clairement inactive */
body.elo-shell.elo-dark .ui-button:not([class*="btn-"]):not([class*="p-button"]):not(.ui-button-flat):not(.ui-button-secondary):not(.ui-button-danger):not(.ui-button-success):not(.ui-button-warning):not(.ui-button-info):not(.ui-button-outlined):not(.ui-confirmdialog-no):not(.ui-paginator-page):not(.ui-paginator-first):not(.ui-paginator-prev):not(.ui-paginator-next):not(.ui-paginator-last):not(.suivi-onglet):not(.ui-selectbooleanbutton):not(.ui-datatable tbody .ui-button).ui-state-disabled,
body.elo-shell.elo-dark .ui-button:not([class*="btn-"]):not([class*="p-button"]):not(.ui-button-flat):not(.ui-button-secondary):not(.ui-button-danger):not(.ui-button-success):not(.ui-button-warning):not(.ui-button-info):not(.ui-button-outlined):not(.ui-confirmdialog-no):not(.ui-paginator-page):not(.ui-paginator-first):not(.ui-paginator-prev):not(.ui-paginator-next):not(.ui-paginator-last):not(.suivi-onglet):not(.ui-selectbooleanbutton):not(.ui-datatable tbody .ui-button):disabled {
    background: var(--elo-surface) !important;
    border-color: var(--elo-border) !important;
    opacity: 1 !important;
}

body.elo-shell.elo-dark .ui-button:not([class*="btn-"]):not([class*="p-button"]):not(.ui-button-flat):not(.ui-button-secondary):not(.ui-button-danger):not(.ui-button-success):not(.ui-button-warning):not(.ui-button-info):not(.ui-button-outlined):not(.ui-confirmdialog-no):not(.ui-paginator-page):not(.ui-paginator-first):not(.ui-paginator-prev):not(.ui-paginator-next):not(.ui-paginator-last):not(.suivi-onglet):not(.ui-selectbooleanbutton):not(.ui-datatable tbody .ui-button).ui-state-disabled .ui-button-text,
body.elo-shell.elo-dark .ui-button:not([class*="btn-"]):not([class*="p-button"]):not(.ui-button-flat):not(.ui-button-secondary):not(.ui-button-danger):not(.ui-button-success):not(.ui-button-warning):not(.ui-button-info):not(.ui-button-outlined):not(.ui-confirmdialog-no):not(.ui-paginator-page):not(.ui-paginator-first):not(.ui-paginator-prev):not(.ui-paginator-next):not(.ui-paginator-last):not(.suivi-onglet):not(.ui-selectbooleanbutton):not(.ui-datatable tbody .ui-button).ui-state-disabled .ui-icon,
body.elo-shell.elo-dark .ui-button:not([class*="btn-"]):not([class*="p-button"]):not(.ui-button-flat):not(.ui-button-secondary):not(.ui-button-danger):not(.ui-button-success):not(.ui-button-warning):not(.ui-button-info):not(.ui-button-outlined):not(.ui-confirmdialog-no):not(.ui-paginator-page):not(.ui-paginator-first):not(.ui-paginator-prev):not(.ui-paginator-next):not(.ui-paginator-last):not(.suivi-onglet):not(.ui-selectbooleanbutton):not(.ui-datatable tbody .ui-button):disabled .ui-button-text,
body.elo-shell.elo-dark .ui-button:not([class*="btn-"]):not([class*="p-button"]):not(.ui-button-flat):not(.ui-button-secondary):not(.ui-button-danger):not(.ui-button-success):not(.ui-button-warning):not(.ui-button-info):not(.ui-button-outlined):not(.ui-confirmdialog-no):not(.ui-paginator-page):not(.ui-paginator-first):not(.ui-paginator-prev):not(.ui-paginator-next):not(.ui-paginator-last):not(.suivi-onglet):not(.ui-selectbooleanbutton):not(.ui-datatable tbody .ui-button):disabled .ui-icon {
    color: var(--elo-muted) !important;
}

/* « Non » des confirmations : bouton secondaire bordé (charte « outline ») plutôt qu'un second bouton plein */
body.elo-shell .ui-button.ui-confirmdialog-no {
    background: var(--elo-white) !important;
    border: 1px solid var(--elo-brand) !important;
    color: var(--elo-on-info) !important;
}

body.elo-shell .ui-button.ui-confirmdialog-no .ui-button-text,
body.elo-shell .ui-button.ui-confirmdialog-no .ui-icon {
    color: var(--elo-on-info) !important;
}

body.elo-shell .ui-button.ui-confirmdialog-no:enabled:hover,
body.elo-shell .ui-button.ui-confirmdialog-no.ui-state-hover,
body.elo-shell .ui-button.ui-confirmdialog-no.ui-state-active {
    background: var(--elo-brand-light) !important;
}

/* Icônes d'action dans les tableaux (imprimer, afficher, visualiser, supprimer…) : boutons plats de la charte */
body.elo-shell .ui-datatable tbody .ui-button.ui-button-icon-only {
    background: transparent !important;
    border: 1px solid transparent !important;
    color: var(--elo-slate) !important;
    box-shadow: none !important;
}

body.elo-shell .ui-datatable tbody .ui-button.ui-button-icon-only .ui-icon,
body.elo-shell .ui-datatable tbody .ui-button.ui-button-icon-only .ui-button-text {
    color: var(--elo-slate) !important;
}

body.elo-shell .ui-datatable tbody .ui-button.ui-button-icon-only:enabled:hover,
body.elo-shell .ui-datatable tbody .ui-button.ui-button-icon-only.ui-state-hover {
    background: var(--elo-brand-light) !important;
}

body.elo-shell .ui-datatable tbody .ui-button.ui-button-icon-only:enabled:active,
body.elo-shell .ui-datatable tbody .ui-button.ui-button-icon-only.ui-state-active {
    background: var(--elo-brand-light) !important;
    box-shadow: inset 0 2px 4px rgba(16, 24, 40, .15) !important;
}

body.elo-shell .ui-datatable tbody .ui-button.ui-button-icon-only:enabled:hover .ui-icon,
body.elo-shell .ui-datatable tbody .ui-button.ui-button-icon-only.ui-state-hover .ui-icon,
body.elo-shell .ui-datatable tbody .ui-button.ui-button-icon-only.ui-state-active .ui-icon {
    color: var(--elo-on-info) !important;
}

body.elo-shell.elo-dark .ui-datatable tbody .ui-button.ui-button-icon-only .ui-icon {
    color: var(--elo-ink) !important;
}

body.elo-shell.elo-dark .ui-datatable tbody .ui-button.ui-button-icon-only:enabled:hover,
body.elo-shell.elo-dark .ui-datatable tbody .ui-button.ui-button-icon-only.ui-state-hover,
body.elo-shell.elo-dark .ui-datatable tbody .ui-button.ui-button-icon-only.ui-state-active {
    background: var(--elo-surface) !important;
}

body.elo-shell.elo-dark .ui-button.ui-confirmdialog-no {
    background: transparent !important;
}

body.elo-shell.elo-dark .ui-button.ui-confirmdialog-no .ui-button-text {
    color: var(--elo-ink) !important;
}

body.elo-shell.elo-dark .ui-button.ui-confirmdialog-no.ui-state-hover,
body.elo-shell.elo-dark .ui-button.ui-confirmdialog-no:enabled:hover {
    background: var(--elo-surface) !important;
}

/* Listes déroulantes : au survol et à l'ouverture tout le champ passait au jaune sous un texte gris ; seul le
   contour prend la couleur de la marque */
body.elo-shell .ui-selectonemenu.ui-state-hover,
body.elo-shell .ui-selectonemenu.ui-state-focus,
body.elo-shell .ui-selectonemenu.ui-state-active,
body.elo-shell .ui-selectcheckboxmenu.ui-state-hover,
body.elo-shell .ui-selectcheckboxmenu.ui-state-focus {
    background: var(--elo-white) !important;
    border-color: var(--elo-brand) !important;
}

body.elo-shell .ui-selectonemenu.ui-state-hover .ui-selectonemenu-label,
body.elo-shell .ui-selectonemenu.ui-state-active .ui-selectonemenu-label,
body.elo-shell .ui-selectonemenu.ui-state-focus .ui-selectonemenu-label {
    color: var(--elo-ink) !important;
    background: transparent !important;
}

body.elo-shell .ui-selectonemenu .ui-selectonemenu-trigger,
body.elo-shell .ui-selectcheckboxmenu .ui-selectcheckboxmenu-trigger {
    background: transparent !important;
    border-color: transparent !important;
}

body.elo-shell .ui-selectonemenu.ui-state-hover .ui-selectonemenu-trigger .ui-icon,
body.elo-shell .ui-selectonemenu.ui-state-focus .ui-selectonemenu-trigger .ui-icon {
    color: var(--elo-on-info) !important;
}

/* Croix de fermeture des fenêtres : fond jaune au survol (classe d'état de PrimeFaces) */
body.elo-shell .ui-dialog .ui-dialog-titlebar-icon.ui-state-hover,
body.elo-shell .ui-dialog .ui-dialog-titlebar-icon.ui-state-active {
    background: var(--elo-surface) !important;
    border-color: transparent !important;
}

body.elo-shell .ui-dialog .ui-dialog-titlebar-icon.ui-state-hover .ui-icon {
    color: var(--elo-ink) !important;
}

/* En-têtes de tableau : au survol, ils passaient entièrement au jaune ; teinte légère de la charte */
body.elo-shell .ui-datatable thead th.ui-state-hover,
body.elo-shell .ui-datatable thead th.ui-state-active {
    background: var(--elo-brand-light) !important;
    color: var(--elo-on-info) !important;
}

body.elo-shell.elo-dark .ui-datatable thead th.ui-state-hover,
body.elo-shell.elo-dark .ui-datatable thead th.ui-state-active {
    background: var(--elo-surface) !important;
    color: var(--elo-ink) !important;
}

/* Détail d'une expédition : en-tête « Informations de suivi colis » (gris clair, texte noir) au style des en-têtes
   d'encart, bordures grises du thème d'origine sur le bloc de suivi et le carrousel des colis */
body.elo-shell .ui-datagrid .ui-datagrid-header {
    position: relative;
    background: var(--elo-white) !important;
    color: var(--elo-ink) !important;
    border: 1px solid var(--elo-border) !important;
    border-bottom: 1px solid var(--elo-border) !important;
    padding: 10px 14px 10px 22px !important;
    font-weight: 700;
    border-radius: 8px 8px 0 0 !important;
}

body.elo-shell .ui-datagrid .ui-datagrid-header:before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 60%;
    border-radius: 0 3px 3px 0;
    background: var(--elo-brand);
}

body.elo-shell .ui-datagrid .ui-datagrid-content,
body.elo-shell .ui-carousel .ui-carousel-item,
body.elo-shell .ui-carousel .ui-carousel-viewport,
body.elo-shell .ui-datalist .ui-datalist-content {
    border-color: var(--elo-border) !important;
}

/* Fenêtres modales : la bordure du thème PrimeFaces reste claire et dessine un cadre blanc sur fond sombre */
body.elo-shell.elo-dark .ui-dialog,
body.elo-shell.elo-dark .ui-dialog .ui-dialog-content {
    border-color: var(--elo-border) !important;
}

/* Clic sur un bouton : la charte reprise de la facturation passe au brun foncé (--elo-brand-dark, couleur de
   texte) sous un texte quasi noir, illisible. On garde le jaune moyen, légèrement enfoncé. */
body.elo-shell .ui-button:enabled:active,
body.elo-shell .ui-button.ui-state-active:not(.ui-selectbooleanbutton) {
    background-color: var(--elo-brand-mid) !important;
    border-color: var(--elo-brand-mid) !important;
    color: var(--elo-on-brand) !important;
    box-shadow: inset 0 2px 4px rgba(16, 24, 40, .25) !important;
}

/* Onglets (résultats des points retraits) : soulignés à la couleur de la marque, comme le reste de l'espace */
body.elo-shell .ui-tabs .ui-tabs-nav {
    background: transparent;
    border: 0;
    border-bottom: 1px solid var(--elo-border);
    padding: 0 8px;
}

body.elo-shell .ui-tabs .ui-tabs-nav li.ui-tabs-header {
    background: transparent !important;
    border: 0 !important;
    border-bottom: 3px solid transparent !important;
    border-radius: 0 !important;
    margin: 0 4px -1px 0;
}

body.elo-shell .ui-tabs .ui-tabs-nav li.ui-tabs-header,
body.elo-shell .ui-tabs .ui-tabs-nav li.ui-tabs-header a {
    box-shadow: none !important;
}

body.elo-shell .ui-tabs .ui-tabs-nav li.ui-tabs-header a {
    background: transparent !important;
    border: 0 !important;
    color: var(--elo-muted) !important;
    font-weight: 600;
}

body.elo-shell .ui-tabs .ui-tabs-nav li.ui-tabs-header.ui-state-hover,
body.elo-shell .ui-tabs .ui-tabs-nav li.ui-tabs-header:hover {
    background: var(--elo-brand-light) !important;
}

body.elo-shell .ui-tabs .ui-tabs-nav li.ui-tabs-header.ui-state-hover a,
body.elo-shell .ui-tabs .ui-tabs-nav li.ui-tabs-header:hover a {
    color: var(--elo-on-info) !important;
}

body.elo-shell .ui-tabs .ui-tabs-nav li.ui-tabs-header.ui-state-active {
    border-bottom-color: var(--elo-brand) !important;
}

body.elo-shell .ui-tabs .ui-tabs-nav li.ui-tabs-header.ui-state-active a {
    color: var(--elo-ink) !important;
}

body.elo-shell.elo-dark .ui-tabs .ui-tabs-nav li.ui-tabs-header.ui-state-hover,
body.elo-shell.elo-dark .ui-tabs .ui-tabs-nav li.ui-tabs-header:hover {
    background: var(--elo-surface) !important;
}

body.elo-shell.elo-dark .ui-tabs .ui-tabs-nav li.ui-tabs-header.ui-state-hover a,
body.elo-shell.elo-dark .ui-tabs .ui-tabs-nav li.ui-tabs-header:hover a {
    color: var(--elo-ink) !important;
}

/* Recherche de points retraits proches */
/* Bouton RECHERCHER : le dégradé orange et le soulèvement propres à la page laissent place au bouton de la charte */
body.elo-shell .pr-recherche .ui-button.btn-primary {
    background: var(--elo-brand) !important;
    border: 1px solid var(--elo-brand) !important;
    color: var(--elo-on-brand) !important;
    transform: none !important;
    box-shadow: none !important;
}

body.elo-shell .pr-recherche .ui-button.btn-primary .ui-button-text,
body.elo-shell .pr-recherche .ui-button.btn-primary .ui-icon {
    color: var(--elo-on-brand) !important;
}

body.elo-shell .pr-recherche .ui-button.btn-primary:enabled:hover {
    background: var(--elo-brand-mid) !important;
    border-color: var(--elo-brand-mid) !important;
}

body.elo-shell .pr-recherche .ui-button.btn-primary:enabled:active {
    background: var(--elo-brand-mid) !important;
    box-shadow: inset 0 2px 4px rgba(16, 24, 40, .25) !important;
}

/* Ouvertures / fermetures : boutons plats d'action de tableau (charte), au lieu du bouton gris bordé de jaune */
body.elo-shell .pr-datatable .ui-button.ui-button-icon-only {
    background: transparent !important;
    border: 1px solid transparent !important;
    color: var(--elo-slate) !important;
    box-shadow: none !important;
}

body.elo-shell .pr-datatable .ui-button.ui-button-icon-only .ui-icon {
    color: var(--elo-slate) !important;
}

body.elo-shell .pr-datatable .ui-button.ui-button-icon-only:enabled:hover,
body.elo-shell .pr-datatable .ui-button.ui-button-icon-only:enabled:active {
    background: var(--elo-brand-light) !important;
    border-color: transparent !important;
}

body.elo-shell .pr-datatable .ui-button.ui-button-icon-only:enabled:hover .ui-icon,
body.elo-shell .pr-datatable .ui-button.ui-button-icon-only:enabled:active .ui-icon {
    color: var(--elo-on-info) !important;
}

body.elo-shell.elo-dark .pr-datatable .ui-button.ui-button-icon-only .ui-icon {
    color: var(--elo-ink) !important;
}

body.elo-shell.elo-dark .pr-datatable .ui-button.ui-button-icon-only:enabled:hover {
    background: var(--elo-surface) !important;
}

/* En-têtes : la page coupe les mots n'importe où (« Distanc / e (m) ») sur des colonnes de 3 à 5 % ; ici ils restent
   entiers et sur une ligne, la colonne s'élargit d'autant (tableau en largeur automatique pour l'e-commerçant) */
body.elo-shell .pr-datatable.ui-datatable thead th,
body.elo-shell .pr-datatable.ui-datatable thead th .ui-column-title {
    white-space: nowrap !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
}

body.elo-shell .pr-datatable .ui-datatable-tablewrapper {
    overflow-x: auto;
}

/* Fin de journée (déclaration et liste) : la liste prend toute la largeur (le formulaire était fixé à 90 %) et
   respire — cellules à 3 px de marge, en-têtes en capitales sur trois lignes, destinataire coupé en deux. */
body.elo-shell form.fdj-page {
    width: 100% !important;
}

body.elo-shell .fdj-page .ui-datatable {
    width: 100%;
}

body.elo-shell .fdj-page .ui-datatable .ui-datatable-tablewrapper {
    overflow-x: auto;
}

/* En-têtes : à la ligne entre deux mots seulement, jamais au milieu d'un mot */
body.elo-shell .fdj-page .ui-datatable thead th {
    padding: 10px 12px !important;
    white-space: normal !important;
}

body.elo-shell .fdj-page .ui-datatable thead th .ui-column-title {
    white-space: normal !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
}

body.elo-shell .fdj-page .ui-datatable tbody td {
    padding: 9px 12px !important;
    font-size: 13px;
    line-height: 1.35;
    white-space: nowrap;
}

/* Le destinataire et le libellé gardent le droit de passer à la ligne : ce sont les seuls textes longs */
body.elo-shell .fdj-page .ui-datatable tbody td.fdj-texte-long {
    white-space: normal;
    min-width: 180px;
}

/* Tête du menu : de l'air entre le « e » et le logo e-Kan Connect complet (8 px dans le thème), et un logo plus
   grand (22 px de haut dans le thème, trop petit pour être lu) */
body.elo-shell .elo-sidenav__home {
    gap: 32px;
}

body.elo-shell .elo-sidenav__logo {
    height: 32px;
    max-width: none;
}

/* Menu latéral tout juste replié : le survol est ignoré tant que la souris ne l'a pas quitté (elo-sidenav.js),
   sinon il se redéplie aussitôt sous le pointeur et paraît ne jamais se replier */
body.elo-shell .elo-sidenav.elo-sidenav--repos {
    pointer-events: none;
}

/* Recherche de points retraits proches, version adhérent (écran classique, sans le thème Elo) : mêmes corrections que
   pour l'e-commerçant, aux couleurs de l'écran classique (orange #F2A05A). Limité à cette page (.pr-recherche) et
   aux utilisateurs d'adhérent (body sans elo-shell) : le reste de l'application n'est pas touché. */
body:not(.elo-shell) .pr-recherche .pr-datatable.ui-datatable thead th,
body:not(.elo-shell) .pr-recherche .pr-datatable.ui-datatable thead th .ui-column-title {
    white-space: nowrap !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
}

body:not(.elo-shell) .pr-recherche .pr-datatable table {
    table-layout: auto !important;
}

body:not(.elo-shell) .pr-recherche .pr-datatable .ui-datatable-tablewrapper {
    overflow-x: auto;
}

/* Ouvertures / fermetures : boutons-icônes plats au lieu du bouton gris à bordure bleue */
body:not(.elo-shell) .pr-recherche .pr-datatable .ui-button.ui-button-icon-only {
    background: transparent !important;
    border: 1px solid transparent !important;
    box-shadow: none !important;
}

body:not(.elo-shell) .pr-recherche .pr-datatable .ui-button.ui-button-icon-only .ui-icon {
    color: #555 !important;
}

body:not(.elo-shell) .pr-recherche .pr-datatable .ui-button.ui-button-icon-only:enabled:hover,
body:not(.elo-shell) .pr-recherche .pr-datatable .ui-button.ui-button-icon-only.ui-state-hover,
body:not(.elo-shell) .pr-recherche .pr-datatable .ui-button.ui-button-icon-only:enabled:active,
body:not(.elo-shell) .pr-recherche .pr-datatable .ui-button.ui-button-icon-only.ui-state-active {
    background: rgba(242, 160, 90, .10) !important;
}

body:not(.elo-shell) .pr-recherche .pr-datatable .ui-button.ui-button-icon-only:enabled:hover .ui-icon,
body:not(.elo-shell) .pr-recherche .pr-datatable .ui-button.ui-button-icon-only.ui-state-hover .ui-icon,
body:not(.elo-shell) .pr-recherche .pr-datatable .ui-button.ui-button-icon-only.ui-state-active .ui-icon {
    color: #F2A05A !important;
}

/* Onglets des résultats : soulignés en orange plutôt que remplis de jaune */
body:not(.elo-shell) .pr-recherche .ui-tabs .ui-tabs-nav {
    background: transparent !important;
    border: 0 !important;
    border-bottom: 1px solid #e2e6ea !important;
    padding: 0 8px;
}

body:not(.elo-shell) .pr-recherche .ui-tabs .ui-tabs-nav li.ui-tabs-header {
    background: transparent !important;
    border: 0 !important;
    border-bottom: 3px solid transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    margin: 0 4px -1px 0;
}

body:not(.elo-shell) .pr-recherche .ui-tabs .ui-tabs-nav li.ui-tabs-header a {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    color: #777 !important;
    font-weight: 600;
}

body:not(.elo-shell) .pr-recherche .ui-tabs .ui-tabs-nav li.ui-tabs-header.ui-state-hover,
body:not(.elo-shell) .pr-recherche .ui-tabs .ui-tabs-nav li.ui-tabs-header:hover {
    background: rgba(242, 160, 90, .08) !important;
}

body:not(.elo-shell) .pr-recherche .ui-tabs .ui-tabs-nav li.ui-tabs-header.ui-state-active {
    border-bottom-color: #F2A05A !important;
}

body:not(.elo-shell) .pr-recherche .ui-tabs .ui-tabs-nav li.ui-tabs-header.ui-state-active a {
    color: #333 !important;
}

/* Légendes des cadres (changer de mot de passe, détail d'une expédition) */
body.elo-shell.elo-dark .ui-fieldset .ui-fieldset-legend {
    color: var(--elo-ink);
}

/* En-tête « Informations de suivi colis » du détail d'une expédition */
body.elo-shell.elo-dark .ui-datagrid-header {
    background: var(--elo-surface);
    border-color: var(--elo-border);
    color: var(--elo-ink);
}

/* Tableaux à en-têtes clairs codés en !important : points retraits proches, résultats d'import */
body.elo-shell.elo-dark .pr-datatable.ui-datatable thead th,
body.elo-shell.elo-dark [id$="resultatImport"] .ui-datatable thead th,
body.elo-shell.elo-dark [id$="resultatCheck"] .ui-datatable thead th {
    background: var(--elo-surface) !important;
    color: var(--elo-muted) !important;
    border-color: var(--elo-border) !important;
}

body.elo-shell.elo-dark .pr-datatable.ui-datatable thead th .ui-column-title {
    color: var(--elo-muted) !important;
}

body.elo-shell.elo-dark .pr-datatable tbody td,
body.elo-shell.elo-dark [id$="resultatImport"] .ui-datatable tbody td,
body.elo-shell.elo-dark [id$="resultatCheck"] .ui-datatable tbody td {
    border-color: var(--elo-border) !important;
}

body.elo-shell.elo-dark .pr-datatable tbody tr:nth-child(even) td {
    background: rgba(255, 255, 255, .027) !important;
}

body.elo-shell.elo-dark .pr-datatable tbody tr:hover td {
    background: var(--elo-surface) !important;
}

body.elo-shell.elo-dark [id$="resultatImport"] .ui-panel-titlebar,
body.elo-shell.elo-dark [id$="resultatCheck"] .ui-panel-titlebar {
    background: var(--elo-white) !important;
    color: var(--elo-ink) !important;
    border-color: var(--elo-border) !important;
}

body.elo-shell.elo-dark [id$="resultatImport"] .ui-panel-titlebar span,
body.elo-shell.elo-dark [id$="resultatCheck"] .ui-panel-titlebar span {
    color: var(--elo-ink) !important;
}

/* Titre de la page entré */
.identificationPanel h1 {
    flex: 1 1 auto;
    margin: 0px;
    font-size: 23px;
}

/* Panneau contenant la bannière en haut de page, ainsi que le nom de l'utilisateur connecté */
.userConnecte {
    flex: 0 0 auto;
}

/* Rapproche les icones des entrées de menu pour accenturer la séparation */
body .ui-menu .ui-menu-list .ui-menuitem .ui-menuitem-link .ui-menuitem-icon {
    margin-right: 0.3rem;
}

/* ====================================================================================================*/
/* FIN DE JOURNEE
/* ====================================================================================================*/

/* On dé-densifie pour faciliter la sélection */
body .blocFinJournee .ui-datatable .ui-datatable-data > tr > td {
    padding-top: 0.2rem;
    padding-bottom: 0.2rem;
}

/* Centrage des boutons de sélection des lignes*/
body .blocFinJournee .ui-datatable .ui-datatable-data > tr > td.ui-selection-column {
    text-align: center;
}

/*  */
.nbSelectionnes {
    /* font-weight: bold; */
}

.blocFinJournee label {
    padding-right: 20px;
    font-size: medium;
    font-weight: bold;
}

.blocFinJournee > div.ui-panel-content {
    border: 0px;
    padding-left: 0px;
    padding-right: 0px;
}

/*.blocFinJourneeResultats {*/
/*    border: 0px;*/
/*    padding-left: 0px;*/
/*    padding-right: 0px;*/
/*}*/

/* ====================================================================================================*/

/* Messages info affichés à l'utilisateur */
.ui-growl-image-info ~ .ui-growl-message {
    color: black;
}

body .ui-growl .ui-growl-item-container.ui-growl-error .ui-growl-image:before {
    color: #f00;
}

.ui-growl-image-error ~ .ui-growl-message {
    color: #f00;
}

body .ui-fileupload .ui-fileupload-buttonbar {
    #background: #eaeaea;
}

.ui-fileupload .ui-fileupload-buttonbar {
    #background: #eaeaea;
}

/* Fin de journée de l'entrepôt (declarer.xhtml) : expédition étiquetée par un e-commerçant, prise en charge à l'entrepôt */
.fdj-badge-ecomm {
    display: inline-block;
    margin-left: 6px;
    padding: 1px 7px;
    border-radius: 999px;
    background: #F5EAFB;
    color: #6A1B9A;
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
    vertical-align: 1px;
}

/* ====================================================================================================*/
/* BOUTONS DES ÉCRANS ADHÉRENTS (orange TMS à plat) */
/* ====================================================================================================*/
/* Boutons sans style propre (Rechercher, Créer, Exporter, « Oui » des confirmations…) : le gris #EDEDED de
   « body .ui-button » devient le bouton principal de la charte. Les boutons stylés par les pages (btn-*, *-btn) et
   les variantes PrimeFaces (danger, success, flat…) gardent leurs couleurs ; les actions de liste ont leur style. */
body:not(.elo-shell) .ui-button:not([class*="btn"]):not([class*="p-button"]):not(.ui-button-flat):not(.ui-button-secondary):not(.ui-button-danger):not(.ui-button-success):not(.ui-button-warning):not(.ui-button-info):not(.ui-button-outlined):not(.ui-confirmdialog-no):not(.ui-paginator-page):not(.ui-paginator-first):not(.ui-paginator-prev):not(.ui-paginator-next):not(.ui-paginator-last):not(.ui-selectbooleanbutton):not(.ui-datatable tbody .ui-button-icon-only):not(.ui-splitbutton > .ui-button) {
    background: #F2A05A !important;
    border: 1px solid #F2A05A !important;
    border-radius: 6px !important;
    color: #101828 !important;
    box-shadow: none !important;
}

body:not(.elo-shell) .ui-button:not([class*="btn"]):not([class*="p-button"]):not(.ui-button-flat):not(.ui-button-secondary):not(.ui-button-danger):not(.ui-button-success):not(.ui-button-warning):not(.ui-button-info):not(.ui-button-outlined):not(.ui-confirmdialog-no):not(.ui-paginator-page):not(.ui-paginator-first):not(.ui-paginator-prev):not(.ui-paginator-next):not(.ui-paginator-last):not(.ui-selectbooleanbutton):not(.ui-datatable tbody .ui-button-icon-only):not(.ui-splitbutton > .ui-button) .ui-button-text,
body:not(.elo-shell) .ui-button:not([class*="btn"]):not([class*="p-button"]):not(.ui-button-flat):not(.ui-button-secondary):not(.ui-button-danger):not(.ui-button-success):not(.ui-button-warning):not(.ui-button-info):not(.ui-button-outlined):not(.ui-confirmdialog-no):not(.ui-paginator-page):not(.ui-paginator-first):not(.ui-paginator-prev):not(.ui-paginator-next):not(.ui-paginator-last):not(.ui-selectbooleanbutton):not(.ui-datatable tbody .ui-button-icon-only):not(.ui-splitbutton > .ui-button) .ui-icon {
    color: #101828 !important;
}

body:not(.elo-shell) .ui-button:not([class*="btn"]):not([class*="p-button"]):not(.ui-button-flat):not(.ui-button-secondary):not(.ui-button-danger):not(.ui-button-success):not(.ui-button-warning):not(.ui-button-info):not(.ui-button-outlined):not(.ui-confirmdialog-no):not(.ui-paginator-page):not(.ui-paginator-first):not(.ui-paginator-prev):not(.ui-paginator-next):not(.ui-paginator-last):not(.ui-selectbooleanbutton):not(.ui-datatable tbody .ui-button-icon-only):not(.ui-splitbutton > .ui-button):enabled:hover,
body:not(.elo-shell) .ui-button:not([class*="btn"]):not([class*="p-button"]):not(.ui-button-flat):not(.ui-button-secondary):not(.ui-button-danger):not(.ui-button-success):not(.ui-button-warning):not(.ui-button-info):not(.ui-button-outlined):not(.ui-confirmdialog-no):not(.ui-paginator-page):not(.ui-paginator-first):not(.ui-paginator-prev):not(.ui-paginator-next):not(.ui-paginator-last):not(.ui-selectbooleanbutton):not(.ui-datatable tbody .ui-button-icon-only):not(.ui-splitbutton > .ui-button).ui-state-hover {
    background: #E3863A !important;
    border-color: #E3863A !important;
}

body:not(.elo-shell) .ui-button:not([class*="btn"]):not([class*="p-button"]):not(.ui-button-flat):not(.ui-button-secondary):not(.ui-button-danger):not(.ui-button-success):not(.ui-button-warning):not(.ui-button-info):not(.ui-button-outlined):not(.ui-confirmdialog-no):not(.ui-paginator-page):not(.ui-paginator-first):not(.ui-paginator-prev):not(.ui-paginator-next):not(.ui-paginator-last):not(.ui-selectbooleanbutton):not(.ui-datatable tbody .ui-button-icon-only):not(.ui-splitbutton > .ui-button):enabled:active,
body:not(.elo-shell) .ui-button:not([class*="btn"]):not([class*="p-button"]):not(.ui-button-flat):not(.ui-button-secondary):not(.ui-button-danger):not(.ui-button-success):not(.ui-button-warning):not(.ui-button-info):not(.ui-button-outlined):not(.ui-confirmdialog-no):not(.ui-paginator-page):not(.ui-paginator-first):not(.ui-paginator-prev):not(.ui-paginator-next):not(.ui-paginator-last):not(.ui-selectbooleanbutton):not(.ui-datatable tbody .ui-button-icon-only):not(.ui-splitbutton > .ui-button).ui-state-active {
    background: #E3863A !important;
    border-color: #E3863A !important;
    box-shadow: inset 0 2px 4px rgba(16, 24, 40, .25) !important;
}

body:not(.elo-shell) .ui-button:not([class*="btn"]):not([class*="p-button"]):not(.ui-button-flat):not(.ui-button-secondary):not(.ui-button-danger):not(.ui-button-success):not(.ui-button-warning):not(.ui-button-info):not(.ui-button-outlined):not(.ui-confirmdialog-no):not(.ui-paginator-page):not(.ui-paginator-first):not(.ui-paginator-prev):not(.ui-paginator-next):not(.ui-paginator-last):not(.ui-selectbooleanbutton):not(.ui-datatable tbody .ui-button-icon-only):not(.ui-splitbutton > .ui-button):focus-visible {
    outline: 2px solid #9A4F12 !important;
    outline-offset: 2px;
}

/* « Non » / « Annuler » des confirmations : bouton secondaire bordé, pour ne pas mettre deux boutons pleins côte à côte */
body:not(.elo-shell) .ui-button.ui-confirmdialog-no:not([class*="btn"]) {
    background: #FFFFFF !important;
    border: 1px solid #F2A05A !important;
    border-radius: 6px !important;
    color: #9A4F12 !important;
    box-shadow: none !important;
}

body:not(.elo-shell) .ui-button.ui-confirmdialog-no:not([class*="btn"]) .ui-button-text,
body:not(.elo-shell) .ui-button.ui-confirmdialog-no:not([class*="btn"]) .ui-icon {
    color: #9A4F12 !important;
}

body:not(.elo-shell) .ui-button.ui-confirmdialog-no:not([class*="btn"]):enabled:hover,
body:not(.elo-shell) .ui-button.ui-confirmdialog-no:not([class*="btn"]).ui-state-hover,
body:not(.elo-shell) .ui-button.ui-confirmdialog-no:not([class*="btn"]).ui-state-active {
    background: #FEF4EA !important;
    border-color: #E3863A !important;
}

/* Boutons secondaires (raccourcis de période, « Effacer les critères ») : bordés d'orange, pas du bleu du thème */
body:not(.elo-shell) .ui-button.ui-button-outlined {
    background: #FFFFFF !important;
    border: 1px solid #F2A05A !important;
    border-radius: 6px !important;
    color: #9A4F12 !important;
    box-shadow: none !important;
}

body:not(.elo-shell) .ui-button.ui-button-outlined .ui-button-text,
body:not(.elo-shell) .ui-button.ui-button-outlined .ui-icon {
    color: #9A4F12 !important;
}

body:not(.elo-shell) .ui-button.ui-button-outlined:enabled:hover,
body:not(.elo-shell) .ui-button.ui-button-outlined.ui-state-hover,
body:not(.elo-shell) .ui-button.ui-button-outlined.ui-state-active {
    background: #FEF4EA !important;
    border-color: #E3863A !important;
}

/* Bouton rouge (« Confirmer » une suppression) : texte blanc, le foncé des boutons orange y est peu lisible */
body:not(.elo-shell) .ui-button.ui-button-danger:not(.ui-datatable tbody .ui-button):not(.btn-action-liste) .ui-button-text,
body:not(.elo-shell) .ui-button.ui-button-danger:not(.ui-datatable tbody .ui-button):not(.btn-action-liste) .ui-icon {
    color: #FFFFFF !important;
}

/* La règle orange des boutons focalisés (.ui-state-focus, plus haut) peignait en orange le « Confirmer » rouge,
   qui reçoit le focus à l'ouverture de la confirmation */
body:not(.elo-shell) .ui-button.ui-button-danger:not(.ui-datatable tbody .ui-button):not(.btn-action-liste).ui-state-focus {
    background: #E2274A !important;
    border-color: #E2274A !important;
}

body:not(.elo-shell) .ui-button.ui-button-danger:not(.ui-datatable tbody .ui-button):not(.btn-action-liste):enabled:hover,
body:not(.elo-shell) .ui-button.ui-button-danger:not(.ui-datatable tbody .ui-button):not(.btn-action-liste).ui-state-hover {
    background: #C01F3D !important;
    border-color: #C01F3D !important;
}

/* Actions de liste (modifier, cloner, supprimer… dans les lignes d'un tableau, ou btn-action-liste hors tableau) : pastilles carrées bordées, plus
   discrètes qu'un bouton, pour que la colonne d'actions ne fasse pas un mur orange. Rouge pour les suppressions. */
body:not(.elo-shell) :is(.ui-datatable tbody .ui-button.ui-button-icon-only, .ui-button.btn-action-liste) {
    background: #FFFFFF !important;
    border: 1px solid #FCE0C6 !important;
    border-radius: 6px !important;
    box-shadow: none !important;
    vertical-align: middle;
    transition: background-color .15s, border-color .15s;
}

body:not(.elo-shell) :is(.ui-datatable tbody .ui-button.ui-button-icon-only, .ui-button.btn-action-liste) .ui-icon,
body:not(.elo-shell) :is(.ui-datatable tbody .ui-button.ui-button-icon-only, .ui-button.btn-action-liste) .ui-button-text {
    color: #9A4F12 !important;
}

body:not(.elo-shell) :is(.ui-datatable tbody .ui-button.ui-button-icon-only, .ui-button.btn-action-liste):enabled:hover,
body:not(.elo-shell) :is(.ui-datatable tbody .ui-button.ui-button-icon-only, .ui-button.btn-action-liste).ui-state-hover,
body:not(.elo-shell) :is(.ui-datatable tbody .ui-button.ui-button-icon-only, .ui-button.btn-action-liste):focus-visible {
    background: #FEF4EA !important;
    border-color: #F2A05A !important;
}

body:not(.elo-shell) :is(.ui-datatable tbody .ui-button.ui-button-icon-only, .ui-button.btn-action-liste):enabled:active,
body:not(.elo-shell) :is(.ui-datatable tbody .ui-button.ui-button-icon-only, .ui-button.btn-action-liste).ui-state-active {
    background: #FCE0C6 !important;
    border-color: #E3863A !important;
}

body:not(.elo-shell) :is(.ui-datatable tbody .ui-button.ui-button-icon-only, .ui-button.btn-action-liste):is(.ui-button-danger, .delete-btn, :has(.fa-trash), :has(.pi-trash)) {
    border-color: #F5C2C7 !important;
}

body:not(.elo-shell) :is(.ui-datatable tbody .ui-button.ui-button-icon-only, .ui-button.btn-action-liste):is(.ui-button-danger, .delete-btn, :has(.fa-trash), :has(.pi-trash)) .ui-icon,
body:not(.elo-shell) :is(.ui-datatable tbody .ui-button.ui-button-icon-only, .ui-button.btn-action-liste):is(.ui-button-danger, .delete-btn, :has(.fa-trash), :has(.pi-trash)) .ui-button-text {
    color: #C62828 !important;
}

body:not(.elo-shell) :is(.ui-datatable tbody .ui-button.ui-button-icon-only, .ui-button.btn-action-liste):is(.ui-button-danger, .delete-btn, :has(.fa-trash), :has(.pi-trash)):enabled:hover,
body:not(.elo-shell) :is(.ui-datatable tbody .ui-button.ui-button-icon-only, .ui-button.btn-action-liste):is(.ui-button-danger, .delete-btn, :has(.fa-trash), :has(.pi-trash)).ui-state-hover,
body:not(.elo-shell) :is(.ui-datatable tbody .ui-button.ui-button-icon-only, .ui-button.btn-action-liste):is(.ui-button-danger, .delete-btn, :has(.fa-trash), :has(.pi-trash)):enabled:active,
body:not(.elo-shell) :is(.ui-datatable tbody .ui-button.ui-button-icon-only, .ui-button.btn-action-liste):is(.ui-button-danger, .delete-btn, :has(.fa-trash), :has(.pi-trash)).ui-state-active {
    background: #FDEAED !important;
    border-color: #E2274A !important;
}

body:not(.elo-shell) :is(.ui-datatable tbody .ui-button.ui-button-icon-only, .ui-button.btn-action-liste).ui-state-disabled,
body:not(.elo-shell) :is(.ui-datatable tbody .ui-button.ui-button-icon-only, .ui-button.btn-action-liste):disabled {
    background: #F5F5F5 !important;
    border-color: #E4E4E4 !important;
}

/* ====================================================================================================*/
/* TABLEAUX ET BOUTONS À CHOIX DES ÉCRANS ADHÉRENTS */
/* ====================================================================================================*/
/* Alternance des lignes : blanc / orange très clair (règle « Lignes paires » plus haut). Les tableaux qui posent leur
   propre alternance (#FAFAFA dans la page) la reprennent aussi ;
   le survol prend un orange un cran plus soutenu que la ligne paire. */
body:not(.elo-shell) :is(.fichiers-table, .cpv-datatable, .stat-dialog-table, .tarif-datatable, .pr-datatable) tbody tr:nth-child(even) td {
    background: #FFF9F3 !important;
}

body:not(.elo-shell) .ui-datatable .ui-datatable-data > tr.ui-datatable-selectable:not(.ui-state-highlight):hover,
body:not(.elo-shell) .ui-datatable .ui-datatable-data > tr.ui-datatable-selectable.ui-state-hover:not(.ui-state-highlight) {
    background-color: #FEF0E2 !important;
    color: inherit !important;
}

/* Boutons à choix (p:splitButton, « Générer la Fin de Journée ») : les deux moitiés étaient deux boutons arrondis
   séparés d'un jour ; elles forment un seul bouton, la flèche séparée par un filet */
body:is(:not(.elo-shell), .elo-adherent) .ui-splitbutton {
    display: inline-flex;
    align-items: stretch;
    border-radius: 6px;
    vertical-align: middle;
}

body:is(:not(.elo-shell), .elo-adherent) .ui-splitbutton > .ui-button {
    margin: 0 !important;
    height: auto !important;
    background: #F2A05A !important;
    border: 1px solid #F2A05A !important;
    color: #101828 !important;
    box-shadow: none !important;
}

body:is(:not(.elo-shell), .elo-adherent) .ui-splitbutton > .ui-button .ui-button-text,
body:is(:not(.elo-shell), .elo-adherent) .ui-splitbutton > .ui-button .ui-icon {
    color: #101828 !important;
}

body:is(:not(.elo-shell), .elo-adherent) .ui-splitbutton > .ui-button:enabled:hover,
body:is(:not(.elo-shell), .elo-adherent) .ui-splitbutton > .ui-button.ui-state-hover {
    background: #E3863A !important;
    border-color: #E3863A !important;
}

body:is(:not(.elo-shell), .elo-adherent) .ui-splitbutton > .ui-button:first-child {
    border-radius: 6px 0 0 6px !important;
    border-right: 0 !important;
}

body:is(:not(.elo-shell), .elo-adherent) .ui-splitbutton > .ui-button.ui-splitbutton-menubutton {
    width: 2rem !important;
    border-radius: 0 6px 6px 0 !important;
    border-left: 1px solid rgba(16, 24, 40, .22) !important;
}

body:is(:not(.elo-shell), .elo-adherent) .ui-splitbutton > .ui-button:first-child .ui-button-text {
    padding: .45rem .9rem;
    font-weight: 600;
}

body:is(:not(.elo-shell), .elo-adherent) .ui-splitbutton-menu {
    border: 1px solid #FCE0C6;
    border-radius: 6px;
    box-shadow: 0 6px 18px rgba(16, 24, 40, .12);
}

/* ====================================================================================================*/
/* FOND DES ÉCRANS ADHÉRENTS ET BARRE DE MENU */
/* ====================================================================================================*/
/* Fond dégradé de la connexion FacturationConnect : blanc, halo orange du logo TMS montant du bas, plus léger que
   sur la connexion ; fixe au défilement */
body:not(.elo-shell) {
    background-color: #FFFFFF;
    background-image: radial-gradient(120vw 70vh at 50% 115%, rgba(242, 160, 90, .22), rgba(242, 160, 90, .07) 45%, transparent 75%);
    background-repeat: no-repeat;
    background-attachment: fixed;
}

/* Barre des accès écrans : orange très clair des lignes de tableaux, bordée de pêche */
body:not(.elo-shell) .centeredMenuBar.ui-menubar {
    background: #FFF9F3;
    border: 1px solid #FCE0C6;
    border-radius: 6px;
}

/* Sous-menus déroulants : même orange très clair, bordés de pêche */
body:not(.elo-shell) .centeredMenuBar .ui-menu-child {
    background: #FFF9F3;
    border: 1px solid #FCE0C6 !important;
    border-radius: 6px;
}

/* ====================================================================================================*/
/* ÉCRANS ADHÉRENTS SOUS LE THÈME ELO (body.elo-shell.elo-adherent) */
/* ====================================================================================================*/
/* Les adhérents passent au thème Elo et au menu latéral de l'e-commerçant (menu-adherent.xhtml). Ils gardent le fond
   dégradé de leurs écrans (blanc, halo orange du logo TMS montant du bas), l'alternance orange très clair des
   tableaux et le bouton à choix d'un seul tenant. Fond et alternance orange en mode clair seulement : en mode sombre
   (bouton du pied de menu, comme eKan OMS et l'e-commerçant), ils prennent les couleurs sombres du thème Elo. */
body.elo-adherent:not(.elo-dark) {
    background-color: #FFFFFF;
    background-image: radial-gradient(120vw 70vh at 50% 115%, rgba(242, 160, 90, .22), rgba(242, 160, 90, .07) 45%, transparent 75%);
    background-repeat: no-repeat;
    background-attachment: fixed;
}

body.elo-adherent .layout-main,
body.elo-adherent .layout-wrapper {
    background: transparent;
}

body.elo-adherent:not(.elo-dark) .ui-datatable .ui-datatable-data > tr.ui-datatable-even {
    background-color: #FFF9F3;
}

body.elo-adherent:not(.elo-dark) .ui-datatable .ui-datatable-data > tr.ui-datatable-selectable:not(.ui-state-highlight):hover {
    background-color: #FEF0E2 !important;
}

/* Tête de barre : logo e-Kan TMS déplié, pastille du « a » repliée (comme FacturationConnect) */
body.elo-adherent .elo-sidenav__top {
    height: 92px;
}

body.elo-adherent .elo-sidenav__toggle.elo-sidenav__home {
    height: 84px;
}

.elo-sidenav__marque {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
}

.elo-sidenav__marque-img {
    width: 150px;
    max-width: 100%;
    height: auto;
}

.elo-sidenav__marque-pastille {
    display: none;
    width: 36px;
    height: 36px;
}

@media (min-width: 992px) and (hover: hover) {
    .elo-collapsed .elo-sidenav:not(:hover) .elo-sidenav__marque-img {
        display: none;
    }

    .elo-collapsed .elo-sidenav:not(:hover) .elo-sidenav__marque-pastille {
        display: block;
    }
}

/* Titre du gabarit masqué quand l'écran porte déjà le sien (Suivi de production : en-tête .al-header) */
body.elo-adherent .layout-main:has(> :not(.elo-titre-gabarit) h1) > .elo-titre-gabarit {
    display: none;
}

/* Rangées d'actions en flex : elles passent à la ligne plutôt que de pousser l'écran au-delà de la fenêtre
   (Optimisation transport) */
body.elo-adherent .actions-row {
    flex-wrap: wrap;
}

/* Libellés longs des sous-menus (« Administrer les connexions », « Événements transports ») : sur deux lignes
   plutôt que coupés par des points de suspension */
body.elo-adherent .elo-nav-sub .elo-nav-label {
    white-space: normal;
    line-height: 1.2;
}

/* Administration des crons : le tableau dépassait sa carte de quelques pixels */
body.elo-adherent .info-card-body {
    overflow-x: auto;
}

/* Police du thème Elo (Plus Jakarta Sans) : « body .ui-widget » ci-dessus imposait Verdana, et style.css passe après
   elo-theme.css à spécificité égale */
body.elo-adherent .ui-widget,
body.elo-adherent .ui-widget .ui-widget,
body.elo-adherent .ui-widget input,
body.elo-adherent .ui-widget select,
body.elo-adherent .ui-widget textarea,
body.elo-adherent .ui-widget button {
    font-family: var(--elo-font);
}

/* Bandeau de titre propre à un écran, icône puis titre (Villes) : le titre suit l'icône au lieu d'être rejeté à
   droite par le space-between du thème */
body.elo-adherent .layout-main .page-header:not(.elo-titre-gabarit) > :is(i, .pi, .fa):first-child + h1 {
    flex: 1 1 auto;
}

/* Fenêtre modale ouverte : le voile passe aussi sur le menu latéral (sinon le menu, au-dessus du voile, restait
   cliquable et en pleine lumière), adhérent comme e-commerçant */
body.elo-shell.ui-dialog-open .elo-sidenav__panel {
    z-index: 900;
}

/* Blocs centrés en pourcentage de la fenêtre (« width: 80%; margin: auto » : Utilisateurs, Groupes, Services
   transporteur, E-commerçants…) : pensés pour toute la largeur de l'écran, ils deviennent trop étroits à côté du
   menu latéral (colonne d'actions repliée, tableau coupé). Ils prennent toute la largeur de la zone de contenu. */
body.elo-adherent .layout-main :is(.ui-panel, .ui-datatable, .ui-outputpanel)[style*="margin: auto"][style*="%"] {
    width: 100% !important;
}

/* Boutons d'action d'une ligne de tableau : sur une seule ligne */
body.elo-adherent .ui-datatable tbody td:has(> .ui-button-icon-only, > form > .ui-button-icon-only) {
    white-space: nowrap;
}

/* Grilles de formulaire larges dans un encadré (Créer un utilisateur) : l'encadré défile plutôt que de pousser
   l'écran au-delà de la fenêtre (un fieldset prend par défaut la largeur minimale de son contenu) */
body.elo-adherent .layout-main .ui-fieldset {
    min-width: 0;
}

body.elo-adherent .layout-main .ui-fieldset-content {
    overflow-x: auto;
}

/* Colonne d'actions des tableaux (afficher, imprimer, supprimer…) épinglée à droite : sur les listes larges
   (expéditions, fins de journée, services), elle n'était visible qu'après un défilement horizontal, et ses boutons
   passaient sur deux lignes. Pour l'adhérent comme pour l'e-commerçant (couleurs du thème, mode sombre compris).
   Le fond de la cellule reprend celui de la ligne (blanc, orange très clair une ligne sur deux, couleur propre à la ligne). */
body.elo-shell .ui-datatable-tablewrapper > table > tbody > tr > td:last-child:has(.ui-button, .ui-commandlink),
body.elo-shell .ui-datatable:has(> .ui-datatable-tablewrapper > table > tbody > tr > td:last-child :is(.ui-button, .ui-commandlink)) > .ui-datatable-tablewrapper > table > thead > tr > th:last-child {
    position: sticky;
    right: 0;
    z-index: 1;
    box-shadow: -8px 0 8px -8px rgba(16, 24, 40, .22);
}

body.elo-shell .ui-datatable-tablewrapper > table > tbody > tr > td:last-child:has(.ui-button, .ui-commandlink) {
    background-color: var(--elo-white, #FFFFFF);
    white-space: nowrap;
}

body.elo-shell .ui-datatable:has(> .ui-datatable-tablewrapper > table > tbody > tr > td:last-child :is(.ui-button, .ui-commandlink)) > .ui-datatable-tablewrapper > table > thead > tr > th:last-child {
    background-color: var(--elo-canvas, #F8FAFB);
}

body.elo-adherent:not(.elo-dark) .ui-datatable-tablewrapper > table > tbody > tr.ui-datatable-even > td:last-child:has(.ui-button, .ui-commandlink) {
    background-color: #FFF9F3;
}

body.elo-adherent:not(.elo-dark) .ui-datatable-tablewrapper > table > tbody > tr.ui-datatable-selectable:hover > td:last-child:has(.ui-button, .ui-commandlink) {
    background-color: #FEF0E2;
}

body.elo-shell .ui-datatable-tablewrapper > table > tbody > tr:is(.ui-state-highlight, .ui-state-error, .inactive-row, .cron_err, [class*="check-row"], [class*="regle-"]) > td:last-child:has(.ui-button, .ui-commandlink) {
    background-color: inherit;
}

/* Pied du menu : le site courant en clair (nom en gras, « Changer de site » dessous) */
body.elo-adherent .elo-nav-site .elo-nav-label {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
}

body.elo-adherent .elo-nav-site__nom {
    font-weight: 700;
    color: var(--elo-ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.elo-adherent .elo-nav-site__action {
    font-size: 11px;
    color: var(--elo-muted);
}

/* ====================================================================================================*/
/* MODE SOMBRE DES ÉCRANS ADHÉRENTS (body.elo-adherent.elo-dark) */
/* ====================================================================================================*/
/* Bouton système / clair / sombre du pied de menu, comme eKan OMS et l'e-commerçant. Le thème Elo passe en sombre
   les composants PrimeFaces ; restent les écrans qui posent leurs propres couleurs dans un <style> (blanc, #333…).
   Leurs surfaces, textes et pastilles prennent ici les jetons sombres du thème (--elo-white = surface des cartes,
   --elo-ink / --elo-slate / --elo-muted pour les textes, teintes translucides pour les états). Les bandeaux orange à
   texte foncé (titres de section, boutons) restent tels quels : lisibles dans les deux modes. */
body.elo-adherent.elo-dark :is(.acc-card, .al-header, .al-section, .summary-card, .filter-bar, .perf-panel,
    .filter-section, .create-section, .list-section, .add-rule-panel, .rules-section, .bottom-actions,
    .droits-cadre, .hc-loading-box) {
    background: var(--elo-white);
    box-shadow: 0 0 0 1px var(--elo-border);
    color: var(--elo-ink);
}

/* Sous-surfaces (cartes de chiffres, en-têtes de tableau, encarts gris) */
body.elo-adherent.elo-dark :is(.al-card, .mode-selection, .type-service-header, .sante-info, .modale-intro) {
    background: var(--elo-surface);
    border-color: var(--elo-border);
}

body.elo-adherent.elo-dark :is(.al-chart, .carrier-section, .type-service-section) {
    border-color: var(--elo-border);
}

/* Textes foncés posés pour un fond blanc */
body.elo-adherent.elo-dark :is(.acc-card-header, a.acc-ligne, a.acc-ligne:visited, .acc-ligne,
    .al-header h1, .al-card .al-value, .al-table td, .sante-ligne, .cron-nom, .hc-table td,
    .compte-client-value, .perf-panel-header, .kpi-title, .filter-header, .create-header, .list-header,
    .add-rule-header, .rules-table td, .bottom-actions-header, .zone-checkbox-list .ui-chkbox-label,
    .droits-action, .droits-matrice thead th) {
    color: var(--elo-ink);
}

body.elo-adherent.elo-dark :is(.al-header .al-info, .al-filter, .al-card .al-label, .al-chart-title,
    .summary-card .card-label, .page-header .refresh-info, .filter-group label, .compte-client-label,
    .kpi-sub, .note, .perf-loading span, .action-group label, .cron-meta, .cron-historique,
    .droits-legende, .droits-compte, .droits-groupe__compte, .droits-vide) {
    color: var(--elo-slate);
}

body.elo-adherent.elo-dark :is(.acc-card-header .acc-sous-titre, .al-card .al-sub, .al-hint, .al-skeleton-text,
    .rt-norm, .range-separator) {
    color: var(--elo-muted);
}

/* Lignes et filets */
body.elo-adherent.elo-dark :is(.acc-ligne, table.acc-table th, table.acc-table td, .al-table tbody tr,
    .hc-table tbody tr, .qualite-service-table tbody tr, .rules-table tbody tr, .droits-matrice th,
    .droits-matrice td) {
    border-color: var(--elo-border);
}

/* Accueil : expéditions envoyées / en attente, anomalies par site */
body.elo-adherent.elo-dark .acc-card-header {
    background: var(--elo-brand-light);
}

body.elo-adherent.elo-dark a.acc-ligne:hover,
body.elo-adherent.elo-dark table.acc-table tbody tr:hover td {
    background: var(--elo-brand-light);
    color: var(--elo-ink);
}

body.elo-adherent.elo-dark .acc-badge {
    background: var(--elo-surface);
    color: var(--elo-slate);
}

body.elo-adherent.elo-dark .acc-badge.acc-pos {
    background: var(--elo-brand-tint);
    color: var(--elo-on-info);
}

body.elo-adherent.elo-dark .acc-badge.acc-alerte.acc-pos,
body.elo-adherent.elo-dark table.acc-table .acc-n.acc-pos {
    background: var(--elo-red-tint);
    color: var(--elo-on-danger);
}

body.elo-adherent.elo-dark table.acc-table .acc-n {
    color: var(--elo-muted);
}

body.elo-adherent.elo-dark table.acc-table thead th,
body.elo-adherent.elo-dark table.acc-table thead th.acc-statut {
    background: var(--elo-canvas);
    color: var(--elo-slate);
}

body.elo-adherent.elo-dark table.acc-table th.acc-statut,
body.elo-adherent.elo-dark table.acc-table td.acc-statut {
    background: var(--elo-white);
    color: var(--elo-ink);
    box-shadow: 1px 0 0 var(--elo-border);
}

body.elo-adherent.elo-dark table.acc-table th.acc-total,
body.elo-adherent.elo-dark table.acc-table td.acc-total {
    background: var(--elo-brand-light);
    color: var(--elo-ink);
}

body.elo-adherent.elo-dark table.acc-table th.acc-site-ko {
    color: var(--elo-on-danger);
}

/* Tableau de bord de l'accueil : bandeau des filtres */
body.elo-adherent.elo-dark .dashboard-filters {
    background: var(--elo-surface);
    border-color: var(--elo-border);
    border-left-color: var(--elo-brand);
}

/* États (badges, encarts) : teintes translucides et textes éclaircis du thème */
body.elo-adherent.elo-dark :is(.sante-badge.ok, .cron-etat.planifie, .al-tag-ok, .al-ras, .dl-badge--FIABLE) {
    background: var(--elo-lime-tint);
    border-color: transparent;
    color: var(--elo-on-success);
}

body.elo-adherent.elo-dark :is(.sante-badge.ko, .cron-etat.anomalie, .al-tag-ko, .sante-erreurs, .error-panel,
    .al-alerte, .dl-erreur, .dl-badge--INCOMPLET) {
    background: var(--elo-red-tint);
    border-color: transparent;
    color: var(--elo-on-danger);
}

body.elo-adherent.elo-dark :is(.cron-etat.encours, .al-tag-warn, .al-avertissement, .resume-down-panel,
    .pilotage-indisponible, .dl-badge--PARTIEL, .dl-msg--attention) {
    background: var(--elo-amber-tint);
    border-color: transparent;
    color: var(--elo-on-warning);
}

body.elo-adherent.elo-dark :is(.al-avertissement, .resume-down-panel, .pilotage-indisponible, .dl-msg--attention) {
    border-left-color: var(--elo-amber);
}

body.elo-adherent.elo-dark .al-ras {
    border-left-color: var(--elo-lime);
}

body.elo-adherent.elo-dark :is(.sante-erreurs, .error-panel, .al-alerte) {
    border-left-color: var(--elo-red);
}

body.elo-adherent.elo-dark .al-alerte .al-alerte-texte {
    color: var(--elo-on-danger);
}

body.elo-adherent.elo-dark :is(.cron-etat.arrete, .cron-etat.inconnu, .al-tag-neutre, .crons-arretes,
    .order-badge, .zone-badge) {
    background: var(--elo-surface);
    border-color: var(--elo-border);
    color: var(--elo-slate);
}

body.elo-adherent.elo-dark .info-banner {
    background: rgba(33, 150, 243, .14);
}

body.elo-adherent.elo-dark .info-banner span {
    color: #8CC8F7;
}

/* Suivi de production : lignes en alerte */
body.elo-adherent.elo-dark .al-table tr.alerte-critique td {
    background: var(--elo-red-tint) !important;
}

body.elo-adherent.elo-dark .al-table tr.alerte-warning td {
    background: var(--elo-amber-tint) !important;
}

body.elo-adherent.elo-dark .al-table tr.alerte-neutre td {
    color: var(--elo-muted);
}

/* Santé des serveurs, qualité de service, optimisation transport : survol des lignes et en-têtes gris */
body.elo-adherent.elo-dark :is(.hc-table tbody tr:hover, .qualite-service-table tbody tr:hover,
    .rules-table tbody tr:hover) {
    background: var(--elo-surface) !important;
}

body.elo-adherent.elo-dark :is(.qualite-service-table .ui-datatable-header, .rules-table .ui-datatable-header) {
    background: var(--elo-canvas);
    color: var(--elo-slate);
}

body.elo-adherent.elo-dark .qualite-service-table thead th {
    background: var(--elo-canvas) !important;
    color: var(--elo-slate);
    border-color: var(--elo-border);
}

body.elo-adherent.elo-dark .regle-selectionnee td {
    background: var(--elo-lime-tint) !important;
}

body.elo-adherent.elo-dark .regle-non-evaluee td {
    background: var(--elo-surface) !important;
    color: var(--elo-muted) !important;
}

body.elo-adherent.elo-dark .ui-selectonemenu-panel .ui-selectonemenu-items .ui-selectonemenu-item-group {
    background: var(--elo-canvas);
}

/* Administration des crons : en-têtes, groupes, boutons blancs et pagination de la modale des fichiers */
body.elo-adherent.elo-dark .crons-table.ui-datatable thead th,
body.elo-adherent.elo-dark .crons-table.ui-datatable thead th .ui-column-title {
    background: var(--elo-canvas) !important;
    color: var(--elo-slate) !important;
    border-color: var(--elo-border) !important;
}

body.elo-adherent.elo-dark .crons-table.ui-datatable thead th.ui-state-hover,
body.elo-adherent.elo-dark .crons-table.ui-datatable thead th.ui-sortable-column:hover {
    background: var(--elo-brand-light) !important;
    color: var(--elo-ink) !important;
}

body.elo-adherent.elo-dark .crons-table.ui-datatable thead th .ui-column-filter {
    background: var(--elo-surface) !important;
    border-color: var(--elo-border) !important;
}

body.elo-adherent.elo-dark .crons-table.ui-datatable tbody td {
    border-color: var(--elo-border) !important;
}

body.elo-adherent.elo-dark .crons-table.ui-datatable tbody tr.ui-rowgroup-header td {
    background: var(--elo-brand-light) !important;
    color: var(--elo-ink);
}

body.elo-adherent.elo-dark .crons-table.ui-datatable tbody tr.ui-datatable-summaryrow td {
    background: var(--elo-canvas) !important;
    border-top-color: var(--elo-border) !important;
}

body.elo-adherent.elo-dark .crons-table.ui-datatable .ui-datatable-data > tr.cron_err,
body.elo-adherent.elo-dark .crons-table.ui-datatable .ui-datatable-data > tr.cron_err td {
    color: var(--elo-on-danger) !important;
}

body.elo-adherent.elo-dark .crons-table.ui-datatable .ui-datatable-data > tr a.ui-rowgroup-toggler,
body.elo-adherent.elo-dark .crons-table .btn-cron.ui-button,
body.elo-adherent.elo-dark .ui-button.btn-secondaire,
body.elo-adherent.elo-dark .btn-danger-outline.ui-button {
    background: var(--elo-surface) !important;
    border-color: var(--elo-border) !important;
}

body.elo-adherent.elo-dark .crons-table .btn-cron.ui-button .ui-button-text,
body.elo-adherent.elo-dark .crons-table .btn-cron.ui-button .ui-button-icon,
body.elo-adherent.elo-dark .crons-table.ui-datatable .ui-datatable-data > tr a.ui-rowgroup-toggler,
body.elo-adherent.elo-dark .crons-table a.btn-detail {
    color: var(--elo-on-info) !important;
}

body.elo-adherent.elo-dark .ui-button.btn-secondaire .ui-button-text,
body.elo-adherent.elo-dark .ui-button.btn-secondaire .ui-button-icon {
    color: var(--elo-ink) !important;
}

body.elo-adherent.elo-dark .crons-table .btn-cron.danger.ui-button .ui-button-text,
body.elo-adherent.elo-dark .crons-table .btn-cron.danger.ui-button .ui-button-icon,
body.elo-adherent.elo-dark .btn-danger-outline.ui-button .ui-button-text,
body.elo-adherent.elo-dark .btn-danger-outline.ui-button .ui-button-icon {
    color: var(--elo-on-danger) !important;
}

body.elo-adherent.elo-dark .crons-table .btn-cron.ui-button:hover:not(.ui-state-disabled),
body.elo-adherent.elo-dark .crons-table a.btn-detail {
    background: var(--elo-brand-light) !important;
}

body.elo-adherent.elo-dark .modale-confirmation .ui-confirm-dialog-message,
body.elo-adherent.elo-dark .modale-confirmation .ui-confirm-dialog-message strong,
body.elo-adherent.elo-dark .modale-intro {
    color: var(--elo-ink);
}

body.elo-adherent.elo-dark .fichiers-table.ui-datatable tbody tr:nth-child(even) td {
    background: rgba(255, 255, 255, .028) !important;
}

body.elo-adherent.elo-dark .fichiers-table.ui-datatable tbody tr:hover td {
    background: var(--elo-brand-light) !important;
}

body.elo-adherent.elo-dark .fichiers-table .ui-paginator {
    background: var(--elo-canvas) !important;
    border-color: var(--elo-border) !important;
}

body.elo-adherent.elo-dark .fichiers-table .ui-paginator :is(.ui-paginator-page, .ui-paginator-first,
    .ui-paginator-prev, .ui-paginator-next, .ui-paginator-last):not(.ui-state-active) {
    background: var(--elo-surface) !important;
    border-color: var(--elo-border) !important;
    color: var(--elo-slate) !important;
}

/* Droits d'accès : la matrice groupes × actions */
body.elo-adherent.elo-dark .droits-filtre {
    background: var(--elo-surface);
    border-color: var(--elo-border);
    color: var(--elo-ink);
}

body.elo-adherent.elo-dark .droits-matrice thead th {
    background: var(--elo-canvas);
    border-bottom-color: var(--elo-border);
}

body.elo-adherent.elo-dark .droits-action {
    background: var(--elo-white);
    border-right-color: var(--elo-border);
}

body.elo-adherent.elo-dark .droits-bloc__titre th {
    background: var(--elo-brand-light);
    border-color: var(--elo-border);
    color: var(--elo-on-info);
}

body.elo-adherent.elo-dark :is(.droits-ligne:hover td, .droits-ligne:hover .droits-action,
    .droits-matrice .droits-col-survol) {
    background: var(--elo-brand-light);
}

body.elo-adherent.elo-dark :is(.droits-ligne:hover td.droits-col-survol, .droits-matrice thead th.droits-col-survol) {
    background: var(--elo-brand-tint);
}

body.elo-adherent.elo-dark .droits-acces--oui {
    background: var(--elo-lime-tint);
    color: var(--elo-on-success);
}

body.elo-adherent.elo-dark .droits-acces--non {
    color: var(--elo-muted);
}

body.elo-adherent.elo-dark .crons-table.ui-datatable .ui-datatable-data > tr.cron_err {
    background-color: var(--elo-red-tint) !important;
}

/* Villes : tableau des codes postaux et statistiques d'une destination */
body.elo-adherent.elo-dark :is(.cpv-datatable, .stat-dialog-table) thead th {
    background: var(--elo-canvas) !important;
    color: var(--elo-slate) !important;
    border-bottom-color: var(--elo-border) !important;
}

body.elo-adherent.elo-dark :is(.cpv-datatable, .stat-dialog-table) tbody td {
    color: var(--elo-ink);
    border-bottom-color: var(--elo-border) !important;
}

body.elo-adherent.elo-dark :is(.cpv-datatable, .stat-dialog-table) tbody tr:nth-child(even) td {
    background: rgba(255, 255, 255, .028) !important;
}

body.elo-adherent.elo-dark :is(.cpv-datatable, .stat-dialog-table) tbody tr:hover td {
    background: var(--elo-brand-light) !important;
}

body.elo-adherent.elo-dark .cpv-datatable .ui-paginator {
    background: var(--elo-canvas) !important;
    border-top-color: var(--elo-border) !important;
}

body.elo-adherent.elo-dark :is(.fiche-section-header, .actions-bar) {
    background: var(--elo-surface);
    border-color: var(--elo-border);
    color: var(--elo-ink);
}

body.elo-adherent.elo-dark .fiche-section-header .section-count {
    color: var(--elo-muted);
}

/* Optimisation transport : l'écran force ses listes déroulantes en blanc */
body.elo-adherent.elo-dark .ui-selectonemenu.ui-state-default :is(.ui-selectonemenu-label, .ui-selectonemenu-trigger) {
    background-color: var(--elo-surface) !important;
    color: var(--elo-ink) !important;
}

/* Recherche de points relais : jetons de la sélection multiple */
body.elo-adherent.elo-dark .ui-selectcheckboxmenu-token {
    background: var(--elo-brand-light);
    border-color: transparent;
}

body.elo-adherent.elo-dark .ui-selectcheckboxmenu-token-label {
    background: transparent;
    color: var(--elo-ink);
}

/* Colis en souffrance : durée sans mouvement */
body.elo-adherent.elo-dark .suivi-sans-mvt {
    color: var(--elo-on-danger);
}

/* Pagination : une règle ancienne de style.css passe en orange toutes les pages (!important), lisible sur fond clair
   seulement. En sombre, seule la page courante est orange, comme le prévoit elo-theme.css (e-commerçant compris). */
body.elo-shell.elo-dark .ui-paginator :is(.ui-paginator-page, .ui-paginator-first, .ui-paginator-prev,
    .ui-paginator-next, .ui-paginator-last):not(.ui-state-active):not(.ui-state-hover):not(:hover) {
    background-color: transparent !important;
    border-color: transparent !important;
}

/* Délais de livraison : l'écran redéfinit ses jetons sur .dl-delais, ils prennent les valeurs sombres */
body.elo-adherent.elo-dark .dl-delais {
    --dl-brand-light: var(--elo-brand-light);
    --dl-ink: var(--elo-ink);
    --dl-slate: var(--elo-slate);
    --dl-muted: var(--elo-muted);
    --dl-canvas: var(--elo-canvas);
    --dl-surface: var(--elo-surface);
    --dl-white: var(--elo-white);
    --dl-border: var(--elo-border);
    --dl-lime-dark: var(--elo-on-success);
}

body.elo-adherent.elo-dark .dl-select {
    color: var(--elo-ink);
}

body.elo-adherent.elo-dark .dl-kpi--attention .dl-kpi__valeur,
body.elo-adherent.elo-dark .dl-alerte {
    color: var(--elo-on-warning);
}

/* Lignes sélectionnées : orange clair plutôt que pêche. « Ma fin de journée » présélectionne toutes les expéditions,
   et le tableau entier passait en pêche, moins lisible ; la case cochée suffit à marquer la sélection. */
body.elo-shell .ui-datatable .ui-datatable-data > tr.ui-state-highlight {
    background-color: var(--elo-brand-light) !important;
}

/* Barre de création en tête des listes (Utilisateurs, Événements transport) : le bouton « Créer » à droite, au-dessus
   du tableau, plutôt qu'en bas de page */
.barre-creation {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 10px;
}
/* Messages d'information et de succès (growl) sous le menu latéral : orange pâle de la marque au lieu du bleu du thème
   nova, qui passait par-dessus le seul liseré orange du thème Elo. Erreurs (rouge) et avertissements (jaune) inchangés.
   Hors mode sombre de l'e-commerçant, qui garde ses messages sur fond sombre. */
body.elo-shell:not(.elo-dark) .ui-growl .ui-growl-item-container.ui-growl-info {
    background: var(--elo-brand-light);
    border: 1px solid var(--elo-brand-tint);
    border-left: 4px solid var(--elo-brand);
}

body.elo-shell:not(.elo-dark) .ui-growl .ui-growl-item-container.ui-growl-info .ui-growl-image:before {
    color: #D9782F;
}

body.elo-shell:not(.elo-dark) .ui-growl .ui-growl-item-container.ui-growl-info :is(.ui-growl-title, .ui-growl-message) {
    color: var(--elo-ink);
}

/* ====================================================================================================*/
/* Mode sombre de l'espace e-commerçant : surfaces restées claires (recette du 30/10/2026)             */
/* ====================================================================================================*/
/* Messages d'information : style.css les écrit en noir (règle de l'ancien thème, plus haut), illisible sur la
   surface sombre du message. Les erreurs gardent leur rouge, lisible tel quel. */
body.elo-shell.elo-dark .ui-growl .ui-growl-image-info ~ .ui-growl-message,
body.elo-shell.elo-dark .ui-growl .ui-growl-image-warn ~ .ui-growl-message {
    color: var(--elo-ink);
}

/* Boutons plats (« Tout sélectionner » de la fin de journée, « Annuler » des confirmations) : texte gris foncé
   du thème PrimeFaces sur fond sombre. La page courante d'une pagination, bouton plat sur fond orange, garde son
   texte foncé. */
body.elo-shell.elo-dark .ui-button.ui-button-flat:not(.ui-state-active),
body.elo-shell.elo-dark .ui-button.ui-button-flat:not(.ui-state-active) .ui-button-text,
body.elo-shell.elo-dark .ui-button.ui-button-flat:not(.ui-state-active) .ui-icon {
    color: var(--elo-slate) !important;
}

body.elo-shell.elo-dark .ui-button.ui-button-flat:not(.ui-state-active):enabled:hover .ui-button-text,
body.elo-shell.elo-dark .ui-button.ui-button-flat:not(.ui-state-active):enabled:hover .ui-icon {
    color: var(--elo-on-info) !important;
}

/* Suivi de mes colis : pastilles de filtre non sélectionnées, restées blanches */
body.elo-shell.elo-dark .suivi-onglet.ui-button:not(.actif) {
    background: var(--elo-surface) !important;
    border-color: var(--elo-border) !important;
    color: var(--elo-ink) !important;
}

body.elo-shell.elo-dark .suivi-onglet.ui-button:not(.actif) :is(.ui-button-text, i) {
    color: var(--elo-ink) !important;
}

body.elo-shell.elo-dark .suivi-onglet.anomalie:not(.actif) .compte {
    color: var(--elo-on-danger) !important;
}

/* Points relais : liste sous la carte, dont prMapUtils.js injecte le style clair (modale de la saisie manuelle et
   recherche des points retraits proches) */
body.elo-shell.elo-dark .pr-map-list {
    background: var(--elo-white);
    border-color: var(--elo-border);
}

body.elo-shell.elo-dark .pr-list-item {
    border-bottom-color: var(--elo-border);
}

body.elo-shell.elo-dark .pr-list-item:hover {
    background: var(--elo-surface);
}

body.elo-shell.elo-dark .pr-list-item.pr-active {
    background: var(--elo-lime-tint);
}

body.elo-shell.elo-dark .pr-list-name {
    color: var(--elo-ink);
}

body.elo-shell.elo-dark .pr-list-detail,
body.elo-shell.elo-dark .pr-list-meta {
    color: var(--elo-muted);
}

body.elo-shell.elo-dark .pr-list-numero {
    color: var(--elo-ink);
}

/* Modale de recherche des points relais (saisie manuelle) : rappel de l'adresse, consigne, code du point */
body.elo-shell.elo-dark .pr-adresse-rappel {
    background: var(--elo-surface);
    box-shadow: inset 4px 0 0 var(--elo-brand);
    color: var(--elo-ink);
}

body.elo-shell.elo-dark .pr-adresse-rappel i {
    color: var(--elo-brand);
}

body.elo-shell.elo-dark .pr-choix-aide,
body.elo-shell.elo-dark .pr-modal-table .pr-code {
    color: var(--elo-muted);
}

body.elo-shell.elo-dark .pr-modal-table tbody > tr.pr-ligne-choisissable:hover > td {
    background: var(--elo-brand-light) !important;
}

body.elo-shell.elo-dark .pr-modal-table tbody > tr.pr-ligne-choisie > td {
    background: var(--elo-lime-tint) !important;
}

/* Tableaux de résultats de l'import de fichier : rouge, vert et brun foncés posés en style direct, faits pour un fond
   clair et illisibles sur une ligne sombre. Les lignes en erreur ou en alerte gardent leur fond clair, et leur texte. */
body.elo-shell.elo-dark .ui-datatable tr:not(.check-row-error):not(.check-row-warning) > td :is([style*="color: #721c24"], [style*="color:#721c24"]) {
    color: var(--elo-on-danger) !important;
}

body.elo-shell.elo-dark .ui-datatable tr:not(.check-row-error):not(.check-row-warning) > td :is([style*="color: #155724"], [style*="color:#155724"]) {
    color: var(--elo-on-success) !important;
}

body.elo-shell.elo-dark .ui-datatable tr:not(.check-row-error):not(.check-row-warning) > td :is([style*="color: #856404"], [style*="color:#856404"]) {
    color: var(--elo-on-warning) !important;
}

/* Saisie manuelle : liste des imprimantes (select natif, fond blanc posé en style direct) */
body.elo-shell.elo-dark .imprimante-select {
    background: var(--elo-surface) !important;
    color: var(--elo-ink) !important;
}

/* ====================================================================================================*/
/* QZ Tray absent du poste (écrans d'impression par fichier et par saisie manuelle)                   */
/* ====================================================================================================*/
/* Bandeau d'état posé par la page une fois la détection de QZ Tray faite (listeImprimantes.js). Rouge quand
   l'impression est bloquée (import de fichier), ambre quand elle passe par un aperçu (saisie manuelle). */
.qz-bandeau {
    display: none;
    gap: 10px;
    align-items: flex-start;
    padding: 12px 15px;
    margin-bottom: 15px;
    border-radius: 8px;
    font-size: 13px;
    line-height: 1.5;
}

.qz-bandeau.is-visible {
    display: flex;
}

.qz-bandeau > i {
    margin-top: 3px;
    font-size: 16px;
}

.qz-bandeau strong {
    display: block;
    margin-bottom: 2px;
}

.qz-bandeau a {
    color: inherit;
    font-weight: 600;
    text-decoration: underline;
}

.qz-bandeau--bloque {
    background: var(--elo-red-tint, #FDEAED);
    border-left: 4px solid var(--elo-red, #E2274A);
    color: var(--elo-on-danger, #C62828);
}

.qz-bandeau--apercu {
    background: var(--elo-amber-tint, #FEF3DC);
    border-left: 4px solid var(--elo-amber, #F5A623);
    color: var(--elo-on-warning, #C0570A);
}

.qz-bandeau--recherche {
    background: var(--elo-surface, #EEF1F5);
    border-left: 4px solid var(--elo-muted, #8A95A3);
    color: var(--elo-slate, #4A5568);
}

/* Lien « Installer QZ Tray » sous la liste des imprimantes, et état de détection dans la modale d'installation
   (classe qz-present / qz-absent posée sur <html> par listeImprimantes.js) */
/* Ligne du libellé « Imprimante » : le libellé à gauche, le lien d'installation à droite */
.imprimante-entete {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 4px;
}

.qz-lien-installation {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    line-height: 1;
    font-weight: 600;
    color: var(--elo-on-info, #9A4F12) !important;
    text-decoration: none;
    cursor: pointer;
}

.qz-lien-installation:hover {
    text-decoration: underline;
}

.qz-etat {
    display: none;
    align-items: center;
    gap: 6px;
    font-weight: 600;
}

html.qz-present .qz-etat--ok {
    display: inline-flex;
    color: var(--elo-on-success, #2E7D32);
}

html.qz-absent .qz-etat--absent {
    display: inline-flex;
    color: var(--elo-on-danger, #C62828);
}

/* Boutons d'impression tant que QZ Tray n'est pas confirmé sur le poste */
.qz-inactif.ui-button,
.qz-inactif.ui-button:hover {
    opacity: .45;
    cursor: not-allowed;
    transform: none !important;
    box-shadow: none !important;
}
