body {
    width: 100%;
    margin: 0;
    padding: 0;
    font-family: 'Open Sans', sans-serif;
    -webkit-font-smoothing: antialiased;
    background: #0076b6;
    overflow-x: hidden;
}

#globalmenu {
    width: 18%;
    float: left;
    background: #0076b6
}

#globalmenu ul {
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
}

#globalmenu #menubar > li {
    margin: 0;
}

#globalmenu #menubar > li > a {
    color: #fff;
    height: 44px;
    line-height: 28px;
    transition: border-color 0.1s ease-in-out 0s, background-color 0.1s ease-in-out 0s, box-shadow 0.1s ease-in-out 0s;
    overflow: hidden;
    padding: 8px 15px 8px 20px;
    border-left: 0 solid transparent;
    text-decoration: none;
    font-size: 14px;
    font-weight: bold;
}

/* Tous les liens du menubar : blanc, pas d'underline, peu importe leur état */
#globalmenu #menubar a,
#globalmenu #menubar a:link,
#globalmenu #menubar a:visited,
#globalmenu #menubar a:active {
    color: #fff;
    text-decoration: none;
    display: block;
    transition: background-color 0.15s, border-left-color 0.15s;
    border-left: 3px solid transparent;
    padding: 8px 15px 8px 20px;
    font-size: 14px;
    font-weight: bold;
    line-height: 1.3;
    height: auto;
}
#globalmenu #menubar a:hover {
    background: rgba(0,0,0,.12);
    border-left-color: #e15154;
    color: #fff;
}

/* ENTREPRISE (parent) — marqué par data-entreprise-name. Style "header". */
#globalmenu #menubar li[data-entreprise-name] > a {
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: .5px;
    padding: 14px 15px 12px 16px;
    background: rgba(0,0,0,.1);
    border-bottom: 1px solid rgba(255,255,255,.08);
    border-top: 1px solid rgba(255,255,255,.08);
}
#globalmenu #menubar li[data-entreprise-name] > a .fa-industry {
    margin-right: 10px;
    opacity: .9;
}
#globalmenu #menubar li[data-entreprise-name] > a:hover {
    background: rgba(0,0,0,.2);
}

/* SOUS-ITEMS d'entreprise (machines, produits…) — data-entreprise-id seul, pas de data-entreprise-name */
#globalmenu #menubar li[data-entreprise-id]:not([data-entreprise-name]) > a {
    font-size: 14px;
    font-weight: 500;
    text-transform: lowercase;
    padding: 8px 15px 8px 40px;
    line-height: 1.4;
}
/* Cas IdGroupe==11 où les sous-items sont dans un <ul> imbriqué — exclut le dropdown "Vue globale" */
#globalmenu #menubar > li:not(#global-actions-wrapper) > ul { background: rgba(0,0,0,.04); padding-left: 0; }
#globalmenu #menubar > li:not(#global-actions-wrapper) > ul li { margin: 0; }

/* ITEM SÉLECTIONNÉ (transactions / machines actif) */
#globalmenu #menubar li.selectedmenuitem > a,
#globalmenu #menubar li.menuitem.selectedmenuitem > a {
    background: #e15154;
    color: #fff;
    border-left-color: #a62e31;
}
#globalmenu #menubar li.selectedmenuitem > a:hover,
#globalmenu #menubar li.menuitem.selectedmenuitem > a:hover {
    background: #d64447;
    color: #fff;
}

/* Liens "ALL TRANSACTIONS / ALL CLIENTS / etc." — items globaux sans data-entreprise-id */
#globalmenu #menubar > li:not([data-entreprise-id]):not(#company-filter-wrapper) > a {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .3px;
    padding: 10px 15px 10px 20px;
    opacity: .85;
    background: rgba(0,0,0,.05);
    border-top: 1px solid rgba(255,255,255,.06);
}
#globalmenu #menubar > li:not([data-entreprise-id]):not(#company-filter-wrapper) > a:hover {
    opacity: 1;
    background: rgba(0,0,0,.15);
}

#topbar {
    background: #00649B;
    color: #FFF;
}

#topbar a {
    color: #FFF;
}

#content {
    width: 82%;
    float: left;
    background: #fff;
    height: 100%;
    margin-top: 0;
    margin-bottom: 0;
    position: relative;
    min-height: 1200px;
    /* overflow-x retiré : cassait position:sticky du bandeau .msgstd.
       Les tables larges gèrent leur propre overflow via div.listing { overflow:auto }. */
    /* margin-left: 220px; */
}

p.msgstd {
    background: #EDEBE8;
    margin: 0;
    padding: 15px;
    border-bottom: 1px solid #dee4e8;
    display: block;
    clear: both;
    color: #0076b6;
    font-size: 20px;
    text-align: left;
    text-transform: capitalize;
    position: sticky;
    top: 0;
    z-index: 10;
    box-shadow: 0 2px 6px rgba(0,0,0,.08);
}

#logoextranet {
    background: url("../images/extranet/logo-cyconia.svg") no-repeat center 8px;
    width: 100%;
    height: 48px;
    background-size: contain;
    background-size: 100px 32px;
    display: block;
}

#logoextranet img {
    display: none
}

/* Variante compacte du logo quand la topbar est réorganisée en rangée */
#logoextranet.logo-compact {
    height: 44px;
    background-position: center 6px;
    background-size: 90px 28px;
}

/*mettre div autour du table */
.table-responsive {
    min-height: .01%;
    overflow-x: auto;
}

.listing {
    background: #FFF;
    overflow: auto
}

.listing table {

    border: 0;
}

.listing table td {
    border: 0;
}

.listing table th {
    text-transform: uppercase;
    color: #7B7B7B;
}

.selectedmenuitem {
    background: #e15154
}

#SiteInfo {
    display: none
}

table a:link {
    color: #666;
    font-weight: bold;
    text-decoration: none;
}

table a:visited {
    color: #999999;
    font-weight: bold;
    text-decoration: none;
}

table a:active,
table a:hover {
    color: #bd5a35;
    text-decoration: underline;
}

table {
    font-family: Arial, Helvetica, sans-serif;
    color: #666;
    font-size: 12px;
    text-shadow: 1px 1px 0 #fff;
    background: #eaebec;
    margin: 20px;
    border: #ccc 1px solid;

    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;

    -moz-box-shadow: 0 1px 2px #d1d1d1;
    -webkit-box-shadow: 0 1px 2px #d1d1d1;
    box-shadow: none;
}

table th {
    padding: 5px;
    border-top: 1px solid #fafafa;
    border-bottom: 1px solid #e0e0e0;

    background: #ededed;
    background: -webkit-gradient(linear, left top, left bottom, from(#ededed), to(#ebebeb));
    background: -moz-linear-gradient(top, #ededed, #ebebeb);
}

table th:first-child {
    text-align: left;
    padding-left: 20px;
}

table tr:first-child th:first-child {
    -moz-border-radius-topleft: 3px;
    -webkit-border-top-left-radius: 3px;
    border-top-left-radius: 3px;
}

table tr:first-child th:last-child {
    -moz-border-radius-topright: 3px;
    -webkit-border-top-right-radius: 3px;
    border-top-right-radius: 3px;
}

table tr {
    text-align: center;
    padding-left: 20px;
}

table tr.row1 td {
    background: #F1F1F1;
}

table td:first-child {
    text-align: left;
    padding-left: 20px;
    border-left: 0;
}

table td {
    padding: 3px 2px;
    border-top: 1px solid #ffffff;
    border-bottom: 1px solid #e0e0e0;
    border-left: 1px solid #e0e0e0;

    background: #fafafa;
    background: -webkit-gradient(linear, left top, left bottom, from(#fbfbfb), to(#fafafa));
    background: -moz-linear-gradient(top, #fbfbfb, #fafafa);
}

table tr.even td {
    background: #f6f6f6;
    background: -webkit-gradient(linear, left top, left bottom, from(#f8f8f8), to(#f6f6f6));
    background: -moz-linear-gradient(top, #f8f8f8, #f6f6f6);
}

table tr:last-child td {
    border-bottom: 0;
}

table tr:last-child td:first-child {
    -moz-border-radius-bottomleft: 3px;
    -webkit-border-bottom-left-radius: 3px;
    border-bottom-left-radius: 3px;
}

table tr:last-child td:last-child {
    -moz-border-radius-bottomright: 3px;
    -webkit-border-bottom-right-radius: 3px;
    border-bottom-right-radius: 3px;
}

table tr:hover td {
    background: #f2f2f2;
    background: -webkit-gradient(linear, left top, left bottom, from(#f2f2f2), to(#f0f0f0));
    background: -moz-linear-gradient(top, #f2f2f2, #f0f0f0);
}

.rackblock {
    display: inline-block;
    margin: 3px;
    box-shadow: none !important;
    background-color: #EEE;
    text-align: center;
}

.size33x28 {
    width: 72px;
    height: 56px;
    float: left
}

.size17x110 {
    width: 35px;
    height: 220px;
    float: left
}

.size33x165 {
    width: 66px;
    height: 330px
}

.pictoproduct {
    width: 160px;
    float: left;
    border: 1px solid white;
    height: 160px;
    padding: 30px;
}

.productlabel {
    font-size: 20px;
    font-family: 'Oswald', sans-serif !important;
}

.productlabel .price {
    display: block;
}

.categoryoverview {
    clear: both;
    margin-bottom: 60px;
    overflow: auto;
    background: #F5F5F5;
    padding: 30px 10px;
}

div.categoryoverview .categorylabel {
    margin-bottom: 20px;
}

div.categoryoverview .categoryimg {
    width: 110px;
    height: 100px
}

.pictoproduct img {
    width: 70px;
    height: 70px;
}

.formulaire {
    overflow: auto;
    max-width: 100%;
    box-sizing: border-box;
}

.formulaire input[type='text'],
.formulaire input[type='number'],
.formulaire input[type='email'],
.formulaire input[type='password'],
.formulaire input[type='date'],
.formulaire input[type='tel'],
.formulaire input[type='url'],
.formulaire input[type='time'],
.formulaire input[type='search'],
.formulaire textarea,
.formulaire select {
    max-width: 100%;
    box-sizing: border-box;
    padding: 6px 10px;
    border: 1px solid #ccc;
    border-radius: 3px;
    font-size: 13px;
    font-family: inherit;
    background: #fff;
    color: #333;
    transition: border-color .15s, box-shadow .15s;
}
.formulaire textarea {
    min-height: 60px;
    line-height: 1.4;
}
.formulaire input[type='text']:focus,
.formulaire input[type='number']:focus,
.formulaire input[type='email']:focus,
.formulaire input[type='password']:focus,
.formulaire input[type='date']:focus,
.formulaire input[type='tel']:focus,
.formulaire input[type='url']:focus,
.formulaire input[type='time']:focus,
.formulaire input[type='search']:focus,
.formulaire textarea:focus,
.formulaire select:focus {
    border-color: #0076b6;
    box-shadow: 0 0 0 2px rgba(0,118,182,.15);
    outline: none;
}
.formulaire input[type='checkbox'],
.formulaire input[type='radio'] {
    margin: 0 6px 0 0;
    vertical-align: middle;
}

/* Tableau structurant des formulaires — labels alignés à gauche, espacement confortable */
.formulaire > table td,
.formulaire table.formtable td {
    padding: 6px 8px;
    vertical-align: middle;
}
.formulaire > table td:first-child,
.formulaire table.formtable td:first-child {
    color: #555;
    font-weight: 500;
    padding-right: 12px;
    white-space: nowrap;
}

/* Séparateur de sections générique — goltog_form_spacer() produit <hr class='spacer'> */
hr.spacer {
    border: 0;
    border-top: 1px solid #e4e9ee;
    margin: 16px 0;
    height: 0;
}

pre {
    /* width: 10%; */
    /* display: block; */
    word-wrap: break-word;
    max-width: 900px;
    padding: 0 10px;
}

/* Legacy #login/#myaccount/#flags — conservés au cas où mais topbar compacte les remplace */
#flags img { height: 25px; }

/* Rangée compacte d'actions dans la sidebar : user-menu + lang-menu côte à côte */
.topbar-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 8px;
    gap: 6px;
    border-bottom: 1px solid rgba(255,255,255,.1);
}

/* Dropdown générique pour user-menu et lang-menu */
.topbar-dropdown {
    position: relative;
    flex: 1 1 auto;
    min-width: 0;
}
.topbar-dropdown-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    padding: 6px 8px;
    background: rgba(255,255,255,.08);
    color: #fff;
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 3px;
    cursor: pointer;
    font-size: 12px;
    line-height: 1.2;
    transition: background-color .15s;
}
.topbar-dropdown-toggle:hover,
.topbar-dropdown-toggle:focus {
    background: rgba(255,255,255,.18);
    outline: none;
}
.topbar-dropdown-toggle .fa-caret-down { font-size: 10px; opacity: .7; }
.topbar-dropdown-toggle .email-short {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1 1 auto;
    min-width: 0;
    text-align: left;
}
.topbar-dropdown-toggle .flag { height: 18px; vertical-align: middle; }

.topbar-dropdown-menu {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    min-width: 200px;
    display: none;
    list-style: none;
    margin: 0;
    padding: 4px 0;
    background: #fff;
    color: #333;
    border: 1px solid #ccc;
    border-radius: 3px;
    box-shadow: 0 4px 12px rgba(0,0,0,.15);
    z-index: 1000;
}
.topbar-dropdown.open > .topbar-dropdown-menu,
.topbar-dropdown:focus-within > .topbar-dropdown-menu {
    display: block;
}

/* user-menu ouvre vers la gauche pour ne pas déborder */
#user-menu .topbar-dropdown-menu { left: 0; right: auto; min-width: 240px; }
/* lang-menu ouvre vers la droite */
#lang-menu .topbar-dropdown-menu { left: auto; right: 0; min-width: 160px; }

.topbar-dropdown-menu li {
    margin: 0;
    padding: 0;
    list-style: none;
}
/* Préfixes multiples pour battre la spécificité des règles #topbar a (1,0,1) et #globalmenu #menubar a (2,0,2) */
#topbar .topbar-dropdown-menu li a,
#topbar .topbar-dropdown-menu li .menu-action,
#globalmenu #menubar .topbar-dropdown-menu li a,
#globalmenu #menubar .topbar-dropdown-menu li .menu-action {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 8px 12px;
    color: #333;
    background: transparent;
    border: 0;
    border-left: 0;
    font-size: 13px;
    font-weight: 500;
    text-align: left;
    text-decoration: none;
    text-transform: none;
    letter-spacing: 0;
    cursor: pointer;
    box-sizing: border-box;
    line-height: 1.4;
    height: auto;
}
#topbar .topbar-dropdown-menu li a:hover,
#topbar .topbar-dropdown-menu li .menu-action:hover,
#globalmenu #menubar .topbar-dropdown-menu li a:hover,
#globalmenu #menubar .topbar-dropdown-menu li .menu-action:hover {
    background: #f0f4f8;
    color: #00649B;
    border-left: 0;
}
#topbar .topbar-dropdown-menu li.active a,
#globalmenu #menubar .topbar-dropdown-menu li.active a {
    background: #00649B;
    color: #fff;
    font-weight: 600;
}
#topbar .topbar-dropdown-menu li.active a:hover,
#globalmenu #menubar .topbar-dropdown-menu li.active a:hover { background: #00649B; color: #fff; }
.topbar-dropdown-menu li.menu-email {
    padding: 8px 12px;
    font-size: 11px;
    color: #666;
    word-break: break-all;
    border-bottom: 1px solid #eee;
    background: #fafafa;
}
.topbar-dropdown-menu li.divider {
    height: 1px;
    margin: 4px 0;
    background: #eee;
}
#topbar .topbar-dropdown-menu li .menu-action .fa,
#topbar .topbar-dropdown-menu li a .fa,
#globalmenu #menubar .topbar-dropdown-menu li a .fa { width: 14px; color: #888; }
#topbar .topbar-dropdown-menu li.menu-logout form { margin: 0; padding: 0; }
#topbar .topbar-dropdown-menu li.menu-logout .menu-action { color: #c0392b; }
#topbar .topbar-dropdown-menu li.menu-logout .menu-action .fa { color: #c0392b; }
#topbar .topbar-dropdown-menu li.menu-logout .menu-action:hover { background: #fbecec; color: #c0392b; }
#topbar .topbar-dropdown-menu li .flag,
#globalmenu #menubar .topbar-dropdown-menu li .flag { height: 16px; margin-right: 4px; }
#globalmenu #menubar .topbar-dropdown-menu li.divider {
    height: 1px;
    margin: 4px 0;
    padding: 0;
    background: #eee;
}

/* Dropdown "Vue globale" dans le menubar — styling du trigger */
#globalmenu #menubar #global-actions-wrapper {
    list-style: none;
    padding: 8px 10px;
    margin: 0;
    background: rgba(0,0,0,.15);
    border-bottom: 1px solid rgba(255,255,255,.1);
    position: relative;
}
#globalmenu #menubar #global-actions-wrapper .global-actions-toggle {
    display: flex;
    align-items: center;
    gap: 6px;
    width: 100%;
    padding: 8px 10px;
    background: rgba(255,255,255,.08);
    color: #fff;
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 3px;
    cursor: pointer;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
    text-align: left;
    transition: background-color .15s;
}
#globalmenu #menubar #global-actions-wrapper .global-actions-toggle:hover,
#globalmenu #menubar #global-actions-wrapper .global-actions-toggle:focus {
    background: rgba(255,255,255,.18);
    outline: none;
}
#globalmenu #menubar #global-actions-wrapper .global-actions-toggle .label {
    flex: 1 1 auto;
    text-transform: uppercase;
    letter-spacing: .3px;
}
#globalmenu #menubar #global-actions-wrapper .global-actions-toggle .fa-caret-down {
    font-size: 10px;
    opacity: .7;
}
#globalmenu #menubar #global-actions-wrapper .global-actions-toggle .fa-globe {
    opacity: .85;
}
#globalmenu #menubar #global-actions-wrapper .topbar-dropdown-menu {
    left: 8px;
    right: 8px;
    top: calc(100% - 4px);
    min-width: auto;
    background: #fff;
    padding: 4px 0;
}
#globalmenu #menubar #global-actions-wrapper .topbar-dropdown-menu li {
    padding: 0;
    margin: 0;
    background: transparent;
    border: 0;
}
#globalmenu #menubar #global-actions-wrapper .topbar-dropdown-menu li a {
    padding: 10px 14px;
    text-transform: none;
    letter-spacing: 0;
}

/* Zone pour visiteurs non-connectés */
.topbar-guest {
    padding: 8px;
    border-bottom: 1px solid rgba(255,255,255,.1);
}
.topbar-guest .login-compact {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin: 0;
}
.topbar-guest .login-compact input {
    width: 100%;
    box-sizing: border-box;
    height: 24px;
    padding: 3px 6px;
    border: 0;
    border-radius: 3px;
    font-size: 12px;
}
.topbar-guest .login-compact input[type=submit] {
    margin-top: 4px;
    height: 26px;
    color: #fff;
    text-transform: uppercase;
    font-weight: bold;
    background: transparent;
    border: 1px solid #fff;
    border-radius: 20px;
    cursor: pointer;
    font-size: 11px;
}
.topbar-guest-links {
    margin-top: 6px;
    font-size: 11px;
    text-align: center;
    color: rgba(255,255,255,.85);
}
.topbar-guest-links a { color: #fff; text-decoration: underline; }
.topbar-guest-links .sep { opacity: .5; margin: 0 4px; }
.topbar-guest #lang-menu { margin-top: 6px; }

/* Badge entreprise courante — repère visuel + quick nav vers les sections */
#current-company-badge {
    display: block;
    background: #fff;
    color: #00649B;
    padding: 10px 12px;
    margin: 8px 10px 12px 10px;
    border-radius: 4px;
    font-size: 14px;
    box-shadow: 0 2px 4px rgba(0,0,0,.15);
    line-height: 1.4;
}
#current-company-badge .cc-header { text-align: center; padding-bottom: 8px; border-bottom: 1px solid #eee; }
#current-company-badge .label { color: #888; font-size: 12px; }
#current-company-badge strong { font-size: 16px; font-weight: 700; display: block; margin-top: 2px; }
#current-company-badge .id { color: #999; font-size: 11px; margin-left: 4px; }
#current-company-badge .fa-industry { color: #00649B; margin-right: 4px; }

#current-company-badge .cc-quicknav {
    list-style: none;
    padding: 0;
    margin: 8px 0 0 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px;
}
#current-company-badge .cc-quicknav li { margin: 0; }
#current-company-badge .cc-quicknav li a {
    display: block;
    padding: 6px 4px;
    background: #f0f4f8;
    color: #00649B;
    text-decoration: none;
    border-radius: 3px;
    font-size: 12px;
    text-align: center;
    font-weight: 600;
    transition: background-color 0.15s, color 0.15s;
}
#current-company-badge .cc-quicknav li.active a {
    background: #00649B;
    color: #fff;
}
#current-company-badge .cc-quicknav li a:hover {
    background: #e15154;
    color: #fff;
}

/* Barre de recherche en haut du menu pour filtrer les entreprises */
#company-filter-wrapper {
    list-style: none;
    padding: 8px 10px;
    margin: 0;
    position: sticky;
    top: 0;
    background: #0076b6;
    z-index: 5;
}
#company-filter {
    width: 100%;
    box-sizing: border-box;
    padding: 6px 10px;
    border: none;
    border-radius: 3px;
    font-size: 13px;
    background: rgba(255,255,255,.95);
    color: #00649B;
    outline: none;
}
#company-filter::placeholder { color: #888; font-style: italic; }
#company-filter:focus { background: #fff; box-shadow: 0 0 0 2px #e15154; }

/* Bandeau de titre des listings — entreprise courante à droite */
.msgstd.msgstd-flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    text-transform: none;
}
.msgstd .msgstd-left {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    text-transform: capitalize;
}
.msgstd .msgstd-right {
    flex: 0 0 auto;
    color: #00649B;
    font-weight: 700;
    font-size: 18px;
    white-space: nowrap;
}
.msgstd .msgstd-right .fa { margin-right: 6px; opacity: 0.7; }

/* ============================================================
   POLISH PHASE A — Listings : zebra, hover, header, sticky, toolboxes
   ============================================================ */

/* Zebra striping plus marqué sur row1/row2 (classes émises par fct_list.php) */
.listing table tr.row1 td { background: #ffffff; }
.listing table tr.row2 td { background: #f5f7fa; }

/* Hover lignes listing — contraste lisible, bg sobre bleuté */
.listing table tr.row1:hover td,
.listing table tr.row2:hover td {
    background: #e8f0f7;
    transition: background-color .1s ease-in-out;
}

/* Header table contrasté — palette topbar */
.listing table tr.listheader th,
.listing tr.listheader th {
    background: #00649B;
    color: #fff;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 12px;
    letter-spacing: .3px;
    padding: 10px 12px;
    text-shadow: none;
    border-top: 0;
    border-bottom: 1px solid #004f7a;
}
.listing table tr.listheader th:first-child,
.listing tr.listheader th:first-child { padding-left: 16px; }
.listing table tr.listheader th a,
.listing tr.listheader th a {
    color: #fff;
    text-decoration: none;
}
.listing table tr.listheader th a:hover { color: #ffe; text-decoration: underline; }

/* Sticky header : la ligne listheader reste visible au scroll.
   top: 60px correspond à la hauteur du bandeau msgstd (padding + font 20px) */
.listing table tr.listheader {
    position: sticky;
    top: 60px;
    z-index: 5;
}
.listing table tr.listheader th {
    box-shadow: 0 2px 3px rgba(0,0,0,.08);
}

/* Toolboxes (avant et après le tableau) — rangées flex compactes */
.listing > .listtoolbox1,
.listing > .listtoolbox2 {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    background: #f7f9fb;
    border: 1px solid #e4e9ee;
    margin: 8px 0;
}
.listing > .listtoolbox1 { border-bottom: 0; }
.listing > .listtoolbox2 { border-top: 0; }
.listing > .listtoolbox1 form,
.listing > .listtoolbox2 form {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0;
}
.listing > .listtoolbox1 input[type=text],
.listing > .listtoolbox1 input[type=search],
.listing > .listtoolbox2 input[type=text],
.listing > .listtoolbox2 input[type=search] {
    padding: 4px 8px;
    border: 1px solid #ccc;
    border-radius: 3px;
    font-size: 12px;
    height: 22px;
    box-sizing: border-box;
}
.listing > .listtoolbox1 select,
.listing > .listtoolbox2 select {
    padding: 3px 4px;
    border: 1px solid #ccc;
    border-radius: 3px;
    font-size: 12px;
    height: 24px;
    background: #fff;
}

/* ============================================================
   POLISH PHASE C — Boutons et liens d'action cohérents
   Classes utilitaires disponibles pour remplacer progressivement
   les <a href> bruts dans les pages inc_*.php.
   ============================================================ */

.btn,
a.btn {
    display: inline-block;
    padding: 6px 14px;
    border: 1px solid #0076b6;
    color: #0076b6;
    background: #fff;
    text-decoration: none;
    border-radius: 3px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
    cursor: pointer;
    transition: background-color .15s, color .15s, border-color .15s, box-shadow .15s;
    vertical-align: middle;
}
.btn:hover,
a.btn:hover {
    background: #0076b6;
    color: #fff;
    text-decoration: none;
}
.btn:focus,
a.btn:focus {
    outline: none;
    box-shadow: 0 0 0 2px rgba(0,118,182,.25);
}
.btn:disabled,
.btn.disabled {
    opacity: .5;
    cursor: not-allowed;
    pointer-events: none;
}

/* Variante primaire — fond plein bleu */
.btn.btn-primary,
a.btn.btn-primary {
    background: #0076b6;
    color: #fff;
    border-color: #0076b6;
}
.btn.btn-primary:hover,
a.btn.btn-primary:hover {
    background: #005a8a;
    border-color: #005a8a;
}

/* Variante danger — pour les actions destructives (delete, cancel) */
.btn.btn-danger,
a.btn.btn-danger {
    border-color: #c0392b;
    color: #c0392b;
}
.btn.btn-danger:hover,
a.btn.btn-danger:hover {
    background: #c0392b;
    color: #fff;
    border-color: #c0392b;
}

/* Variante ghost — sans bordure, juste couleur texte */
.btn.btn-ghost,
a.btn.btn-ghost {
    border-color: transparent;
    background: transparent;
}
.btn.btn-ghost:hover,
a.btn.btn-ghost:hover {
    background: rgba(0,118,182,.08);
    color: #0076b6;
}

/* Taille compacte */
.btn.btn-sm,
a.btn.btn-sm {
    padding: 3px 10px;
    font-size: 11px;
}

/* Wrapper pour grouper plusieurs boutons/liens — ex. après un form */
.actions-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    border-top: 1px solid #eee;
    margin-top: 16px;
    background: #fafbfc;
}
.actions-bar .btn { margin: 0; }
.actions-bar .spacer { flex: 1 1 auto; }

/* ============================================================
   POLISH PHASE D — Collapsibles pour éléments secondaires
   Surtout debug tools SUPERUSER, pour dégager l'UI principale.
   ============================================================ */

details.debug-tools {
    display: inline-block;
    margin: 0;
    padding: 0;
    font-size: 11px;
    color: #666;
    vertical-align: middle;
}
details.debug-tools > summary {
    cursor: pointer;
    padding: 3px 10px;
    list-style: none;
    color: #888;
    background: #f3f5f7;
    border: 1px solid #dde3e8;
    border-radius: 3px;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .3px;
    user-select: none;
    transition: background-color .15s, color .15s;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}
details.debug-tools > summary::-webkit-details-marker { display: none; }
details.debug-tools > summary::before {
    content: '▸';
    display: inline-block;
    font-size: 9px;
    transition: transform .15s;
}
details.debug-tools[open] > summary::before {
    transform: rotate(90deg);
}
details.debug-tools > summary:hover {
    background: #e7ecf0;
    color: #555;
}
details.debug-tools[open] > summary {
    background: #e0e7ec;
    color: #333;
}
details.debug-tools label {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin: 6px 12px 0 8px;
    font-size: 11px;
    color: #555;
    font-family: monospace;
}
details.debug-tools label input[type=checkbox] {
    margin: 0;
    cursor: pointer;
}

/* ============================================================
   POLISH PHASE E — Bandeaux msgok / msgwarning / msgerror
   Les fonctions goltog_msg_* (fct_misc.php) émettent des <p class='msgX'
   style='color:X'> — on garde la couleur inline et on ajoute un
   container "alert" sobre (fond teinté + bordure + icône leading).
   ============================================================ */

p.msgok,
p.msgwarning,
p.msgerror {
    margin: 0;
    padding: 14px 18px 14px 44px;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.4;
    border-left: 4px solid currentColor;
    position: relative;
    background: #f8f8f8;
    clear: both;
}

p.msgok {
    background: #e8f5e9;
    border-left-color: #2e7d32;
}
p.msgok::before {
    content: '✓';
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 18px;
    font-weight: 700;
    color: #2e7d32;
}

p.msgwarning {
    background: #fff4e5;
    border-left-color: #e67e22;
}
p.msgwarning::before {
    content: '⚠';
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 16px;
    color: #e67e22;
}

p.msgerror {
    background: #fdecea;
    border-left-color: #c0392b;
}
p.msgerror::before {
    content: '✕';
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 18px;
    font-weight: 700;
    color: #c0392b;
}

/* Quand plusieurs messages se suivent, petit séparateur visuel */
p.msgok + p.msgok,
p.msgwarning + p.msgwarning,
p.msgerror + p.msgerror,
p.msgok + p.msgstd,
p.msgerror + p.msgstd,
p.msgwarning + p.msgstd {
    margin-top: 2px;
}
/* ============================================================
   Sous-menu "Archivées" — entreprises Hidden dans le menu BO
   ============================================================ */
.menu-archived-wrapper {
    margin-top: 10px;
    border-top: 1px dashed #ccc;
    padding-top: 5px;
}
.menu-archived-wrapper summary {
    cursor: pointer;
    color: #888;
    font-style: italic;
    padding: 6px;
    list-style: none;
    user-select: none;
}
.menu-archived-wrapper summary::-webkit-details-marker {
    display: none;
}
.menu-archived-wrapper summary:hover {
    color: #333;
}
.menu-archived-wrapper summary::before {
    content: '▸ ';
    display: inline-block;
    transition: transform 0.15s;
}
.menu-archived-wrapper details[open] > summary::before {
    transform: rotate(90deg);
}
.menu-archived-wrapper .archived-list {
    max-height: 400px;
    overflow-y: auto;
    padding-left: 10px;
    opacity: 0.8;
}

/* ============================================================
   Onglets "Actives / Cachées" — page listing entreprises
   ============================================================ */
.entreprises-tabs input[type=radio] {
    display: none;
}
.entr-tabs-labels {
    margin: 15px 0 0 0;
    border-bottom: 2px solid #ccc;
}
.entr-tabs-labels label {
    display: inline-block;
    padding: 8px 20px;
    cursor: pointer;
    background: #f5f5f5;
    border: 1px solid #ccc;
    border-bottom: none;
    margin-right: 4px;
    font-weight: 500;
    color: #666;
    border-radius: 4px 4px 0 0;
    position: relative;
    top: 2px;
}
.entr-tabs-labels label:hover {
    background: #eaeaea;
}
#entr-tab-actives:checked ~ .entr-tabs-labels label[for="entr-tab-actives"],
#entr-tab-cachees:checked ~ .entr-tabs-labels label[for="entr-tab-cachees"] {
    background: #fff;
    color: #222;
    border-bottom: 2px solid #fff;
    font-weight: 600;
}
.entr-tab-content {
    display: none;
    padding: 15px 0;
}
#entr-tab-actives:checked ~ .entr-tab-actives-content,
#entr-tab-cachees:checked ~ .entr-tab-cachees-content {
    display: block;
}
table.listall-entreprises {
    width: 100%;
    margin: 0;                 /* override table { margin: 20px } global */
    table-layout: fixed;       /* distribuer les colonnes selon les widths définis */
    border-collapse: collapse;
    font-size: 14px;           /* override table { font-size: 12px } global — lisibilité */
}
/* Override text-align: center hérité de table tr global */
table.listall-entreprises tr {
    text-align: left;
}
table.listall-entreprises thead tr {
    background: #eee;
}
table.listall-entreprises th,
table.listall-entreprises td {
    padding: 8px 10px;
    border-bottom: 1px solid #eee;
    vertical-align: middle;
    word-break: break-word;    /* wrap noms longs au lieu de pousser la table */
}
/* override table td:first-child { padding-left: 20px } pour alignement uniforme */
table.listall-entreprises td:first-child {
    padding-left: 10px;
}
/* Largeurs explicites par colonne.
   Note : quand la colonne checkbox (col-select, 38px) est présente pour SUPERUSER,
   les colonnes suivantes se décalent d'un index. Les nth-child ci-dessous ciblent
   le cas "avec checkbox". Si pas de checkbox (non-SUPERUSER), les colonnes seront
   distribuées auto par table-layout:fixed + les widths se recalent mais le
   rendu reste propre (même ratio). */
table.listall-entreprises th:nth-child(2),
table.listall-entreprises td:nth-child(2) { width: 6%; }    /* ID */
table.listall-entreprises th:nth-child(3),
table.listall-entreprises td:nth-child(3) { width: 32%; }   /* Raison sociale */
table.listall-entreprises th:nth-child(4),
table.listall-entreprises td:nth-child(4) { width: 24%; }   /* Bornes rattachées */
table.listall-entreprises th:nth-child(5),
table.listall-entreprises td:nth-child(5) { width: 8%; text-align: center; }   /* Tx 30j */
table.listall-entreprises th:nth-child(6),
table.listall-entreprises td:nth-child(6) { width: 18%; }   /* Dernière tx */
table.listall-entreprises th:nth-child(7),
table.listall-entreprises td:nth-child(7) { width: 8%; text-align: center; }   /* Action éditer */
table.listall-entreprises tbody tr:hover {
    background: #fafafa;
}
/* Colonne checkbox : largeur fixe, contenu centré */
table.listall-entreprises th.col-select,
table.listall-entreprises td.col-select {
    width: 38px;
    text-align: center;
    padding: 8px 6px;
}
table.listall-entreprises .col-select input[type=checkbox] {
    cursor: pointer;
    margin: 0;
    vertical-align: middle;
}

/* ============================================================
   Page listing entreprises — header (titre + aide repliable)
   ============================================================ */
.entreprises-page-header {
    display: flex;
    align-items: center;
    gap: 16px;
    margin: 20px 20px 10px 20px;
    flex-wrap: wrap;
}
.entreprises-page-header h2 {
    margin: 0;
}
.entreprises-help {
    /* <details> — replié par défaut, discret à côté du titre */
}
/* Quand ouvert : le bloc prend toute la largeur, s'affiche sous le titre */
.entreprises-help[open] {
    flex-basis: 100%;
    order: 10;
}
.entreprises-help > summary {
    cursor: pointer;
    font-size: 12px;
    color: #7a8792;
    padding: 4px 8px;
    border-radius: 3px;
    list-style: none;
    user-select: none;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}
.entreprises-help > summary::-webkit-details-marker { display: none; }
.entreprises-help > summary:hover {
    color: #2c83be;
    background: #f0f3f5;
}
.entreprises-help > summary i.fa {
    font-size: 13px;
}
.entreprises-help[open] > summary {
    color: #2c83be;
    background: #eef4f9;
}
.entreprises-help-content {
    margin: 8px 0 0 0;
    padding: 12px 16px;
    background: #f4f8fb;
    border-left: 3px solid #2c83be;
    border-radius: 3px;
    color: #3a4a55;
    font-size: 13px;
    line-height: 1.55;
}
.entreprises-help-content p {
    margin: 0 0 10px 0;
}
.entreprises-help-content strong {
    color: #1d2939;
}
.entreprises-status-legend {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.entreprises-status-legend .status-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 6px 10px;
    background: #fff;
    border-radius: 3px;
    border: 1px solid #e2e8ed;
}
.entreprises-status-legend .status-item i.fa {
    margin-top: 2px;
    width: 18px;
    text-align: center;
    font-size: 14px;
    flex-shrink: 0;
}
.entreprises-status-legend .status-active i.fa  { color: #4caf50; }
.entreprises-status-legend .status-archived i.fa { color: #d3a24c; }
.entreprises-status-legend .status-item strong {
    color: #1d2939;
    margin-right: 2px;
}
.entreprises-status-legend .status-item em {
    font-style: normal;
    color: #6b7680;
    background: #f0f3f5;
    padding: 0 4px;
    border-radius: 2px;
}

/* ============================================================
   Barre d'actions bulk — page listing entreprises
   ============================================================ */
.bulk-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 20px;
    margin: 10px 20px 0 20px;
    background: #f7f9fb;
    border: 1px solid #dfe4e8;
    border-radius: 4px;
    flex-wrap: wrap;
}
.bulk-actions .bulk-label {
    font-weight: 500;
    color: #555;
    margin-right: 4px;
}
.bulk-actions .bulk-selection-count {
    color: #888;
    font-weight: 400;
    font-size: 12px;
}
.bulk-actions .btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border-radius: 4px;
    border: 1px solid #bcc3c8;
    background: #fff;
    color: #333;
    cursor: pointer;
    font-size: 13px;
    line-height: 1.4;
    transition: background 0.1s, box-shadow 0.1s;
}
.bulk-actions .btn:hover:not(:disabled) {
    background: #f0f3f5;
    box-shadow: 0 1px 2px rgba(0,0,0,.1);
}
.bulk-actions .btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}
.bulk-actions .btn-bulk-archive:not(:disabled) {
    border-color: #d3a24c;
    color: #8a6418;
}
.bulk-actions .btn-bulk-archive:hover:not(:disabled) {
    background: #fff6e5;
}
.bulk-actions .btn-bulk-activate:not(:disabled) {
    border-color: #4caf50;
    color: #2e7032;
}
.bulk-actions .btn-bulk-activate:hover:not(:disabled) {
    background: #e8f5e9;
}
.bulk-actions .bulk-count-inline {
    font-weight: 600;
}

/* ============================================================
   Dashboard monitoring (rub=health)
   ============================================================ */
.health-page {
    margin: 20px;
}
.health-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
    flex-wrap: wrap;
    gap: 12px;
}
.health-header h2 {
    margin: 0;
}
.health-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 12px;
    color: #6b7680;
}
.health-timestamp em {
    color: #8a93a0;
    font-style: normal;
}
.health-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}
.health-card {
    background: #fff;
    border: 1px solid #dfe4e8;
    border-left: 4px solid #cfd5da;
    border-radius: 4px;
    padding: 14px;
    font-size: 13px;
    line-height: 1.4;
}
.health-card h4 {
    margin: 0 0 6px 0;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .5px;
    color: #6b7680;
    font-weight: 600;
}
.health-card .health-value {
    font-size: 28px;
    font-weight: 700;
    color: #1d2939;
    margin: 2px 0;
}
.health-card .health-sub {
    font-size: 11px;
    color: #8a93a0;
}
.health-dot {
    display: inline-block;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    margin-right: 6px;
    vertical-align: middle;
    background: #cfd5da;
}
.health-status-green  { border-left-color: #4caf50; }
.health-status-green  .health-dot { background: #4caf50; }
.health-status-orange { border-left-color: #f0ad4e; background: #fffaf0; }
.health-status-orange .health-dot { background: #f0ad4e; }
.health-status-red    { border-left-color: #d9534f; background: #fff5f5; }
.health-status-red    .health-dot { background: #d9534f; }
.health-status-gray   { border-left-color: #cfd5da; }
.health-status-gray   .health-dot { background: #cfd5da; }
.health-footer {
    margin-top: 20px;
    padding-top: 12px;
    border-top: 1px dashed #e2e8ed;
    font-size: 11px;
    color: #8a93a0;
    text-align: center;
}

/* Table des 10 dernières mutations (drill-down sous la grille) */
.health-drilldown {
    margin-top: 24px;
}
.health-drilldown h3 {
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: .5px;
    color: #6b7680;
    margin: 0 0 8px 0;
    font-weight: 600;
}
table.health-drilldown-table {
    width: 100%;
    margin: 0;
    border: 1px solid #dfe4e8;
    border-radius: 4px;
    border-collapse: collapse;
    font-size: 12px;
    background: #fff;
    box-shadow: none;
    text-shadow: none;
}
table.health-drilldown-table thead tr {
    background: #f4f8fb;
}
table.health-drilldown-table th,
table.health-drilldown-table td {
    padding: 6px 10px;
    border-bottom: 1px solid #eef2f5;
    text-align: left;
    background: #fff;
    color: #3a4a55;
    vertical-align: middle;
}
table.health-drilldown-table thead th {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .4px;
    color: #6b7680;
    background: #f4f8fb;
}
table.health-drilldown-table tbody tr:hover td {
    background: #fafbfc;
}
table.health-drilldown-table code {
    background: #f0f3f5;
    padding: 1px 5px;
    border-radius: 2px;
    font-size: 11px;
    color: #1d2939;
}
.health-dd-time {
    white-space: nowrap;
    color: #6b7680;
    font-variant-numeric: tabular-nums;
}
.health-dd-arrow {
    color: #8a93a0;
    margin: 0 4px;
}
.health-dd-right {
    text-align: right;
    font-variant-numeric: tabular-nums;
}
.health-dd-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .3px;
}
.health-dd-badge.green  { background: #e8f5e9; color: #2e7032; }
.health-dd-badge.orange { background: #fff6e5; color: #8a6418; }
.health-dd-badge.red    { background: #fdecea; color: #a72a26; }

/* Item « Monitoring infra » dans #menubar — SUPERUSER only.
   Hérite du style global #globalmenu #menubar a, on override juste l'état
   active pour matcher le fond plus dense utilisé ailleurs dans l'UI. */
#globalmenu #menubar li.health-menu-item.active > a {
    background: rgba(0, 0, 0, .18);
    border-left-color: #e15154;
}
#globalmenu #menubar li.health-menu-item > a i.fa-heartbeat {
    width: 16px;
    text-align: center;
    margin-right: 4px;
}

/* Responsive */
@media (max-width: 1100px) {
    .health-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 700px) {
    .health-grid { grid-template-columns: 1fr; }
    .health-header { flex-direction: column; align-items: flex-start; }
}