
:root{
  --kordelia-shell-top:150px;
  --kordelia-shell-side:210px;
  --kordelia-shell-subnav:64px;
}

html{scroll-behavior:smooth}
body{overflow-x:hidden}

/* Bandeau supérieur commun */
.topbar,
.energy-header{
  position:fixed !important;
  top:0;
  left:0;
  right:0;
  z-index:120;
  height:var(--kordelia-shell-top) !important;
  min-height:var(--kordelia-shell-top) !important;
  display:flex !important;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:0 24px !important;
  background:rgba(255,255,255,.96) !important;
  border:0 !important;
  border-bottom:1px solid rgba(12,65,68,.13) !important;
  border-radius:0 !important;
  box-shadow:0 7px 24px rgba(12,65,68,.07) !important;
  backdrop-filter:blur(14px);
}

.brand-strip,
.energy-header .brand-group{
  display:flex !important;
  align-items:center;
  gap:14px !important;
  width:auto !important;
  max-width:none !important;
  min-width:0;
  padding:0 !important;
  margin:0 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}

.brand-strip .partner-logo,
.energy-header .brand-logo{
  width:auto !important;
  max-height:none !important;
  object-fit:contain;
  display:block;
  image-rendering:auto;
  backface-visibility:hidden;
  transform:translateZ(0);
  flex:0 0 auto;
}
.brand-strip .fmd-logo,
.energy-header .fmd-logo{height:76px !important;width:auto !important;max-width:112px !important}
.brand-strip .dna-logo,
.energy-header .dna-logo{height:76px !important;width:auto !important;max-width:132px !important}
.brand-strip .kordelia-header-logo,
.energy-header .kordelia-logo{height:142px !important;width:auto !important;max-width:280px !important}
.brand-strip .brand-separator,
.energy-header .brand-separator{height:62px !important;width:1px !important;flex:0 0 1px !important;background:rgba(12,65,68,.18) !important}

.kordelia-home-link{display:flex;align-items:center;border-radius:10px;padding:2px 4px;transition:.18s ease}
.kordelia-home-link:hover{background:rgba(18,113,117,.06)}
.kordelia-home-link:focus-visible{outline:3px solid rgba(18,113,117,.25);outline-offset:3px}

/* Navigation globale fixe */
.global-sidebar{
  position:fixed;
  top:var(--kordelia-shell-top);
  left:0;
  bottom:0;
  width:var(--kordelia-shell-side);
  z-index:105;
  display:flex;
  flex-direction:column;
  gap:7px;
  padding:22px 14px;
  background:rgba(255,255,255,.95);
  border-right:1px solid rgba(12,65,68,.13);
  box-shadow:7px 0 24px rgba(12,65,68,.04);
  backdrop-filter:blur(12px);
}
.global-sidebar-title{padding:0 10px 10px;color:#7a898b;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.global-nav-item{
  width:100%;
  min-height:48px;
  display:flex;
  align-items:center;
  gap:12px;
  padding:0 13px;
  border:0;
  border-radius:11px;
  background:transparent;
  color:#24494c;
  font:inherit;
  font-size:14px;
  font-weight:800;
  text-decoration:none;
  text-align:left;
  cursor:pointer;
  transition:.16s ease;
}
.global-nav-item:hover{background:#eef7f6;color:#0c5e62}
.global-nav-item.active{background:linear-gradient(135deg,#0c666a,#127175);color:#fff;box-shadow:0 8px 18px rgba(18,113,117,.18)}
.global-nav-item[disabled]{opacity:.43;cursor:not-allowed;background:transparent;color:#6f7f82}
.global-nav-icon{width:24px;text-align:center;font-size:19px;line-height:1}
.global-nav-copy{display:flex;flex:1;align-items:center;justify-content:space-between;gap:6px}
.global-nav-copy small{font-size:9px;text-transform:uppercase;letter-spacing:.04em;opacity:.78}
.global-sidebar-spacer{flex:1}
.global-sidebar-note{padding:12px 10px 0;color:#879496;font-size:10px;line-height:1.35;border-top:1px solid rgba(12,65,68,.08)}

/* Zone utilisateur commune */
.topbar .user-menu,
.energy-header .user-menu{margin-left:auto}
.topbar .user-menu-button,
.energy-header .user-menu-button{
  background:#f7fbfa !important;
  color:#18383a !important;
  border:1px solid rgba(12,65,68,.12) !important;
}
.topbar .user-menu-button:hover,
.energy-header .user-menu-button:hover{background:#edf7f5 !important}

/* L'application Eau garde sa navigation métier, sous le bandeau global. */
body.kordelia-water .app-shell{
  margin-left:var(--kordelia-shell-side);
  padding:calc(var(--kordelia-shell-top) + var(--kordelia-shell-subnav) + 24px) 24px 24px !important;
  gap:20px;
}
body.kordelia-water .main-tabs{
  position:fixed !important;
  top:var(--kordelia-shell-top);
  left:var(--kordelia-shell-side);
  right:0;
  z-index:100;
  height:var(--kordelia-shell-subnav);
  display:grid !important;
  grid-template-columns:repeat(5,minmax(112px,1fr));
  align-items:stretch;
  padding:8px 24px;
  background:#f4faf9;
  border:0 !important;
  border-bottom:1px solid rgba(12,65,68,.10) !important;
  border-radius:0 !important;
  overflow:visible !important;
}
body.kordelia-water .tab-button{min-height:46px;border:1px solid #d9e2eb;border-right:0}
body.kordelia-water .tab-button:first-child{border-radius:8px 0 0 8px}
body.kordelia-water .tab-button:last-child{border-right:1px solid #d9e2eb;border-radius:0 8px 8px 0}
body.kordelia-water .top-actions{margin-left:auto}
body.kordelia-water .top-actions [data-view="parametres"]{display:none !important}
body.kordelia-water .mobile-admin-settings{display:none !important}


/* Paramètres est un espace global autonome : aucune navigation ou action métier Eau. */
body.kordelia-settings .main-tabs{display:none !important}
body.kordelia-settings .app-shell{
  padding-top:calc(var(--kordelia-shell-top) + 24px) !important;
}
body.kordelia-settings .top-actions .history-button,
body.kordelia-settings #refreshButton{display:none !important}
body.kordelia-settings .global-nav-item[href="index.html"]{
  background:transparent !important;
  color:#24494c !important;
  box-shadow:none !important;
}
body.kordelia-settings [data-global-settings]{
  background:linear-gradient(135deg,#0c666a,#127175) !important;
  color:#fff !important;
  box-shadow:0 8px 18px rgba(18,113,117,.18) !important;
}

/* Portail / choix d'énergie */
body.kordelia-portal .energy-shell{padding-left:var(--kordelia-shell-side)}
body.kordelia-portal .energy-main{margin-top:var(--kordelia-shell-top);min-height:calc(100vh - var(--kordelia-shell-top));}
body.kordelia-portal .energy-footer{margin-left:0}

/* Bouton remonter commun */
.global-scroll-top,
.scroll-top-button{
  position:fixed !important;
  right:22px !important;
  bottom:22px !important;
  z-index:115 !important;
}
.global-scroll-top{
  display:flex;
  align-items:center;
  gap:7px;
  border:0;
  border-radius:999px;
  padding:11px 16px;
  background:#0c666a;
  color:#fff;
  font-weight:800;
  box-shadow:0 10px 26px rgba(12,65,68,.20);
  cursor:pointer;
  opacity:0;
  pointer-events:none;
  transform:translateY(8px);
  transition:.18s ease;
}
.global-scroll-top.visible{opacity:1;pointer-events:auto;transform:none}

@media(max-width:1050px){
  :root{--kordelia-shell-side:176px}
  .global-nav-item{font-size:13px;padding:0 10px}
  .brand-strip .dna-logo,.energy-header .dna-logo{max-width:150px !important}
  .brand-strip .kordelia-header-logo,.energy-header .kordelia-logo{max-width:255px !important}
  body.kordelia-water .top-actions .history-button{display:none}
}

@media(max-width:780px){
  :root{--kordelia-shell-top:76px;--kordelia-shell-side:0px;--kordelia-shell-subnav:0px}
  .topbar,.energy-header{height:76px !important;min-height:76px !important;padding:0 14px !important}
  .global-sidebar{display:none}
  .brand-strip .dna-logo,.brand-strip .brand-separator,.energy-header .dna-logo,.energy-header .brand-separator{display:none !important}
  .brand-strip .fmd-logo,.energy-header .fmd-logo{height:38px !important}
  .brand-strip .kordelia-header-logo,.energy-header .kordelia-logo{height:42px !important;max-width:132px !important}
  body.kordelia-water .app-shell{margin-left:0;padding:92px 14px 18px !important}
  body.kordelia-water .main-tabs{position:static !important;height:auto;display:none !important}
  body.kordelia-portal .energy-shell{padding-left:0}
  body.kordelia-portal .energy-main{margin-top:76px}
  .global-scroll-top,.scroll-top-button{right:14px !important;bottom:14px !important}
}


/* Verrouillage du bandeau commun : mêmes logos sur Accueil, Eau et Paramètres */
@media (min-width: 901px){
  .topbar .brand-strip,
  .energy-header .brand-group{
    min-height:var(--kordelia-shell-top) !important;
  }
  .topbar .brand-strip .fmd-logo,
  .energy-header .brand-group .fmd-logo{
    height:76px !important;
    width:auto !important;
    max-width:112px !important;
    max-height:76px !important;
  }
  .topbar .brand-strip .dna-logo,
  .energy-header .brand-group .dna-logo{
    height:76px !important;
    width:auto !important;
    max-width:132px !important;
    max-height:76px !important;
  }
  .topbar .brand-strip .kordelia-header-logo,
  .energy-header .brand-group .kordelia-logo{
    height:142px !important;
    width:auto !important;
    max-width:280px !important;
    max-height:142px !important;
  }
}


/* V4 - navigation unique et portail intégré */
.global-settings-group{display:flex;flex-direction:column;gap:4px}
.global-settings-toggle{width:100%}
.global-nav-chevron{margin-left:auto;font-size:14px;transition:transform .18s ease}
.global-settings-toggle[aria-expanded="true"] .global-nav-chevron{transform:rotate(180deg)}
.global-settings-submenu{margin:0 0 2px 30px;padding:3px 0 3px 10px;border-left:2px solid rgba(18,113,117,.14)}
.global-settings-subitem{width:100%;border:0;background:transparent;color:#31585a;display:flex;align-items:center;gap:8px;text-align:left;padding:9px 8px;border-radius:8px;cursor:pointer;font:inherit;font-size:12px}
.global-settings-subitem:hover{background:rgba(18,113,117,.07);color:#0c4144}
.global-settings-subitem.disabled{opacity:.38;cursor:default}
.global-settings-subitem small{display:block;text-transform:uppercase;font-size:8px;letter-spacing:.05em}
.kordelia-portal-context .main-tabs,.kordelia-portal-context .top-actions>.history-button,
.kordelia-portal-context #refreshButton,.kordelia-portal-context #mobileRefreshButton{visibility:hidden}
.kordelia-portal-view{padding:0!important}
.portal-inner{width:min(1120px,calc(100% - 48px));margin:0 auto;padding:42px 0 64px}
.portal-intro{text-align:center;margin:0 auto 36px;max-width:760px}
.portal-logo{display:block;height:164px;width:auto;max-width:min(660px,84vw);object-fit:contain;margin:0 auto 16px}
.portal-intro h1{font-size:clamp(32px,4vw,48px);line-height:1.08;margin:0 0 14px;color:#0c4144}
.portal-intro p{font-size:17px;line-height:1.6;color:#6f7f82;margin:0}
.portal-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.portal-card{position:relative;min-height:320px;border-radius:24px;border:1px solid rgba(12,65,68,.13);background:rgba(255,255,255,.90);box-shadow:0 20px 55px rgba(12,65,68,.10);padding:34px;text-align:left;display:flex;flex-direction:column;align-items:flex-start;color:#0c4144;overflow:hidden}
button.portal-card{font:inherit;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
button.portal-card:hover{transform:translateY(-5px);box-shadow:0 28px 68px rgba(12,65,68,.17);border-color:rgba(18,113,117,.34)}
.portal-water::after{content:"";position:absolute;width:210px;height:210px;border-radius:50%;right:-80px;bottom:-90px;background:rgba(123,201,189,.14)}
.portal-electricity{opacity:.69;background:rgba(247,249,249,.88)}
.portal-icon{width:78px;height:78px;border-radius:21px;background:rgba(18,113,117,.09);display:grid;place-items:center;color:#127175;margin-bottom:27px}
.portal-electricity .portal-icon{color:#7b8586;background:rgba(111,127,130,.10)}
.portal-icon svg{width:48px;height:48px}
.portal-copy{display:flex;flex-direction:column;gap:9px;position:relative;z-index:1}
.portal-copy strong{font-size:29px;line-height:1.1}
.portal-copy span{color:#6f7f82;font-size:15px;line-height:1.55;max-width:430px}
.portal-action{margin-top:auto;padding-top:28px;color:#127175;font-weight:800;font-size:15px;position:relative;z-index:1}
.portal-action.muted{color:#7b8586}
.portal-badge{position:absolute;right:22px;top:22px;border-radius:999px;background:#edf1f1;color:#6b7778;padding:7px 11px;font-size:12px;font-weight:800}
@media(max-width:780px){.portal-inner{width:min(100% - 28px,620px);padding:32px 0 44px}.portal-grid{grid-template-columns:1fr}.portal-card{min-height:275px;padding:28px}.portal-logo{height:120px}}





/* V4.4 - À propos global intégré au shell unique */
.kordelia-about-context .main-tabs,
.kordelia-about-context .top-actions > .history-button,
.kordelia-about-context #refreshButton,
.kordelia-about-context #mobileRefreshButton {
  display: none !important;
}
.kordelia-about-context .content { padding-top: 22px; }
.kordelia-global-about-view { width: 100%; }
.kordelia-about-context [data-global-about] {
  background: linear-gradient(135deg,#0c666a,#127175) !important;
  color:#fff !important;
  box-shadow:0 8px 18px rgba(18,113,117,.18) !important;
}


/* V4.5 - Finition onglets Eau */
.main-tabs{
  border-radius: 10px;
  overflow: hidden;
}

.main-tabs .tab-button{
  position: relative;
  transition:
    background-color .18s ease,
    color .18s ease,
    transform .18s ease,
    box-shadow .18s ease;
}

.main-tabs .tab-button:not(.active):hover{
  background: rgba(18,113,117,.08);
  color: #0c4144;
  transform: translateY(-2px);
  box-shadow: inset 0 -3px 0 rgba(18,113,117,.28);
}

.main-tabs .tab-button:not(.active):active{
  transform: translateY(0);
}

.main-tabs .tab-button:first-child{
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
}

.main-tabs .tab-button:last-child{
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}

.main-tabs .tab-button.active:hover{
  filter: brightness(1.04);
}


/* V4.5.1 - Correction arrondi extrémité droite de la barre Eau */
nav.main-tabs {
  border-top-right-radius: 10px !important;
  border-bottom-right-radius: 10px !important;
  overflow: hidden !important;
}

nav.main-tabs > .tab-button:last-of-type,
nav.main-tabs > button:last-of-type {
  border-top-right-radius: 10px !important;
  border-bottom-right-radius: 10px !important;
  overflow: hidden;
}


/* V4.8 - Interaction Refresh + Synthèse */
#refreshButton,
#mobileRefreshButton {
  transition:
    transform .16s ease,
    filter .16s ease,
    box-shadow .16s ease;
  transform-origin: center;
}

#refreshButton:hover,
#mobileRefreshButton:hover {
  transform: scale(.97);
  filter: brightness(.96);
}

#refreshButton:active,
#mobileRefreshButton:active {
  transform: scale(.94);
  box-shadow: 0 3px 8px rgba(12,65,68,.18);
}


/* V4.8.1 - Accueil global strictement isolé */
body.kordelia-portal-context main > .view:not(#portalView) {
  display: none !important;
}

body.kordelia-portal-context #portalView {
  display: block !important;
}


/* V4.9 - Paramètres invisibles pour les non-administrateurs */
.global-settings-group[hidden],
[data-global-admin="true"][hidden] {
  display: none !important;
}


/* V4.10.1 - À propos global : priorité sur le shell Eau */
body.kordelia-water.kordelia-about-context .main-tabs {
  display: none !important;
}

/* À propos n'a pas à réserver la hauteur de la sous-navigation Eau. */
body.kordelia-water.kordelia-about-context .app-shell {
  padding-top: calc(var(--kordelia-shell-top) + 24px) !important;
}

body.kordelia-water.kordelia-about-context .top-actions > .history-button,
body.kordelia-water.kordelia-about-context #refreshButton,
body.kordelia-water.kordelia-about-context #mobileRefreshButton {
  display: none !important;
}

/* Kordelia 3.0.0 — À propos */
.about-v3-page { max-width: 1180px; }
.about-v3-hero { padding: 30px 34px; }
.about-v3-kicker { font-weight: 800; letter-spacing: .12em; opacity: .72; margin-bottom: 8px; }
.about-v3-lead { font-size: 1.08rem; line-height: 1.65; }
.about-v3-signature { margin-top: 18px; font-size: 1.18rem; }
.about-v3-page > section { scroll-margin-top: 110px; }
.about-v3-page > section:not(.about-intro) p { line-height: 1.62; }


/* =========================================================
   Kordelia 3.0.0 — shell mobile unifié
   Ce bloc est volontairement en fin de fichier pour primer
   sur les règles desktop du shell sans les modifier.
   ========================================================= */
.mobile-global-water-subnav { display:none; }

@media (max-width: 860px) {
  :root {
    --kordelia-shell-top:56px;
    --kordelia-shell-side:0px;
    --kordelia-shell-subnav:0px;
  }

  body.kordelia-water .app-shell,
  body.kordelia-water.kordelia-about-context .app-shell {
    margin-left:0 !important;
    padding:0 0 58px !important;
  }

  /* Header mobile : hamburger + identité + compte. */
  body.kordelia-water .topbar {
    position:sticky !important;
    position:-webkit-sticky !important;
    top:0 !important;
    z-index:3000 !important;
    display:grid !important;
    grid-template-columns:42px minmax(0,1fr) 42px !important;
    align-items:center !important;
    width:100% !important;
    height:calc(56px + env(safe-area-inset-top)) !important;
    min-height:calc(56px + env(safe-area-inset-top)) !important;
    padding:env(safe-area-inset-top) 6px 0 !important;
    gap:4px !important;
    background:rgba(248,253,252,.98) !important;
    overflow:visible !important;
  }

  body.kordelia-water .mobile-menu-toggle {
    display:inline-flex !important;
    z-index:3300 !important;
  }

  body.kordelia-water .brand-strip {
    display:flex !important;
    justify-content:center !important;
    width:100% !important;
    overflow:hidden !important;
  }
  body.kordelia-water .brand-strip > .partner-logo,
  body.kordelia-water .brand-strip > .brand-separator,
  body.kordelia-water .brand-strip > .kordelia-home-link {
    display:none !important;
  }
  body.kordelia-water .mobile-brand-lockup {
    display:flex !important;
  }

  body.kordelia-water .top-actions {
    width:38px !important;
    min-width:38px !important;
    margin:0 !important;
  }
  body.kordelia-water .top-actions > .history-button,
  body.kordelia-water #refreshButton {
    display:none !important;
  }

  /* La barre Eau desktop n'est jamais le tiroir mobile. */
  body.kordelia-water .main-tabs {
    display:none !important;
  }

  /* Navigation globale = unique tiroir mobile. */
  body.kordelia-water .global-sidebar {
    display:flex !important;
    position:fixed !important;
    top:0 !important;
    bottom:auto !important;
    left:0 !important;
    z-index:3200 !important;
    width:min(88vw,330px) !important;
    height:var(--app-viewport-height,100dvh) !important;
    max-height:100dvh !important;
    padding:calc(68px + env(safe-area-inset-top)) 12px max(14px,env(safe-area-inset-bottom)) !important;
    gap:4px !important;
    overflow-y:auto !important;
    -webkit-overflow-scrolling:touch;
    background:linear-gradient(180deg,#0c4a4e,#082f33) !important;
    border:0 !important;
    border-radius:0 16px 16px 0 !important;
    box-shadow:18px 0 40px rgba(0,0,0,.30) !important;
    transform:translateX(-105%) !important;
    transition:transform .22s ease !important;
    pointer-events:none !important;
  }

  body.mobile-menu-open.kordelia-water .global-sidebar {
    transform:translateX(0) !important;
    pointer-events:auto !important;
  }

  body.kordelia-water .global-sidebar-title {
    position:absolute;
    top:calc(20px + env(safe-area-inset-top));
    left:18px;
    padding:0 !important;
    color:#fff !important;
    font-size:.95rem !important;
    letter-spacing:.13em !important;
  }

  body.kordelia-water .global-nav-item {
    min-height:46px !important;
    color:rgba(255,255,255,.94) !important;
    border-radius:10px !important;
  }
  body.kordelia-water .global-nav-item:hover,
  body.kordelia-water .global-nav-item.active {
    background:rgba(255,255,255,.13) !important;
    color:#fff !important;
    box-shadow:none !important;
  }
  body.kordelia-water .global-nav-item[disabled] {
    color:rgba(255,255,255,.45) !important;
  }
  body.kordelia-water .global-sidebar-note {
    color:rgba(255,255,255,.55) !important;
    border-top-color:rgba(255,255,255,.14) !important;
  }

  body.kordelia-water .global-settings-submenu {
    margin-left:28px !important;
    border-left-color:rgba(255,255,255,.18) !important;
  }
  body.kordelia-water .global-settings-subitem {
    min-height:42px !important;
    color:rgba(255,255,255,.86) !important;
  }
  body.kordelia-water .global-settings-subitem:hover {
    background:rgba(255,255,255,.10) !important;
    color:#fff !important;
  }

  /* Sous-navigation Eau intégrée au même tiroir. */
  body.kordelia-water .mobile-global-water-subnav {
    display:grid !important;
    gap:3px !important;
    margin:0 0 4px 31px !important;
    padding:5px 0 7px 10px !important;
    border-left:1px solid rgba(255,255,255,.20);
  }
  body.kordelia-water .mobile-global-section-title {
    display:block !important;
    padding:3px 8px !important;
    color:rgba(255,255,255,.50) !important;
    font-size:.62rem !important;
    font-weight:900 !important;
    letter-spacing:.10em !important;
    text-transform:uppercase;
  }
  body.kordelia-water .mobile-global-subitem {
    display:block !important;
    width:100% !important;
    min-height:40px !important;
    padding:7px 10px !important;
    border:0 !important;
    border-radius:8px !important;
    background:transparent !important;
    color:rgba(255,255,255,.88) !important;
    text-align:left !important;
    font-weight:750 !important;
    cursor:pointer;
  }
  body.kordelia-water .mobile-global-subitem:active,
  body.kordelia-water .mobile-global-subitem:hover {
    background:rgba(255,255,255,.10) !important;
    color:#fff !important;
  }
  body.kordelia-water .mobile-global-refresh {
    margin-top:4px !important;
    color:#b9ebe3 !important;
  }

  /* Backdrop derrière le tiroir global. */
  body.kordelia-water .mobile-menu-backdrop {
    display:block !important;
    position:fixed !important;
    inset:0 !important;
    z-index:3150 !important;
  }

  /* Le contenu occupe toute la largeur disponible. */
  body.kordelia-water main {
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:8px 7px 62px !important;
  }

  /* Sur mobile le portail / À propos / paramètres ne réservent jamais
     l'ancienne hauteur desktop. */
  body.kordelia-water.kordelia-portal-context .app-shell,
  body.kordelia-water.kordelia-about-context .app-shell {
    padding-top:0 !important;
  }

  .global-scroll-top,
  .scroll-top-button {
    right:8px !important;
  }
}

@media (min-width: 861px) {
  .mobile-global-water-subnav { display:none !important; }
}


/* =========================================================
   Kordelia 3.0.0 — réparation navigation mobile
   Desktop inchangé.
   Mobile : tiroir = navigation globale ; bandeau = vues Eau.
   ========================================================= */
@media (max-width: 860px) {
  body.kordelia-water .global-sidebar .mobile-global-water-subnav {
    display:none !important;
  }

  body.kordelia-water:not(.kordelia-portal-context):not(.kordelia-about-context):not(.kordelia-settings) nav.main-tabs {
    display:flex !important;
    position:sticky !important;
    top:calc(56px + env(safe-area-inset-top)) !important;
    z-index:2900 !important;
    width:100% !important;
    max-width:100% !important;
    min-height:46px !important;
    margin:0 !important;
    padding:4px 6px 5px !important;
    gap:4px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    background:rgba(248,253,252,.98) !important;
    border-bottom:1px solid rgba(12,65,68,.14) !important;
    box-shadow:0 4px 10px rgba(12,65,68,.06) !important;
  }

  body.kordelia-water nav.main-tabs::-webkit-scrollbar {
    display:none !important;
  }

  body.kordelia-water nav.main-tabs > .tab-button {
    flex:0 0 auto !important;
    width:auto !important;
    min-width:max-content !important;
    min-height:38px !important;
    padding:8px 13px !important;
    border-radius:9px !important;
    white-space:nowrap !important;
    transform:none !important;
  }

  body.kordelia-water.kordelia-portal-context nav.main-tabs,
  body.kordelia-water.kordelia-about-context nav.main-tabs,
  body.kordelia-water.kordelia-settings nav.main-tabs {
    display:none !important;
  }
}

@media (min-width: 861px) {
  body.kordelia-water .global-sidebar .mobile-global-water-subnav {
    display:none !important;
  }
}


/* =========================================================
   Kordelia 3.0.0 — navigation mobile finale
   - En-tête Kordelia fixe et propre
   - Navigation globale dans le hamburger
   - Navigation Eau dans un bandeau horizontal sous l'en-tête
   - Aucune incidence desktop
   ========================================================= */
@media (max-width: 860px) {
  :root {
    --kordelia-mobile-header: 56px;
    --kordelia-mobile-water-nav: 48px;
  }

  /* En-tête mobile réellement fixe : évite les déplacements observés sous iOS. */
  body.kordelia-water .topbar {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    left: 0 !important;
    z-index: 3300 !important;
    display: grid !important;
    grid-template-columns: 42px minmax(0,1fr) 42px !important;
    align-items: center !important;
    width: 100% !important;
    height: calc(var(--kordelia-mobile-header) + env(safe-area-inset-top)) !important;
    min-height: calc(var(--kordelia-mobile-header) + env(safe-area-inset-top)) !important;
    margin: 0 !important;
    padding: env(safe-area-inset-top) 7px 0 !important;
    background: rgba(248,253,252,.99) !important;
    border-bottom: 1px solid rgba(12,65,68,.14) !important;
    box-shadow: 0 3px 12px rgba(12,65,68,.08) !important;
    overflow: visible !important;
  }

  body.kordelia-water .mobile-menu-toggle {
    position: relative !important;
    inset: auto !important;
    display: inline-flex !important;
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    margin: 0 !important;
    z-index: 3400 !important;
  }

  body.kordelia-water .brand-strip {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
  }

  body.kordelia-water .mobile-brand-lockup {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    max-width: 100% !important;
  }

  body.kordelia-water .mobile-kordelia-mark {
    width: 25px !important;
    height: 25px !important;
    min-width: 25px !important;
  }

  body.kordelia-water .mobile-brand-copy strong {
    font-size: .88rem !important;
    letter-spacing: .12em !important;
  }

  body.kordelia-water .mobile-brand-copy small {
    max-width: 29vw !important;
    font-size: .66rem !important;
  }

  body.kordelia-water .top-actions {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    min-width: 38px !important;
    margin: 0 !important;
  }

  /* Le hamburger garde uniquement la navigation globale.
     Les anciens raccourcis Eau du tiroir restent masqués. */
  body.kordelia-water .global-sidebar .mobile-global-water-subnav {
    display: none !important;
  }

  /*
   * Navigation Eau :
   * remise à zéro complète des anciennes propriétés "tiroir mobile"
   * de responsive.css (position, inset, hauteur, transform, couleurs...).
   */
  body.kordelia-water:not(.kordelia-portal-context):not(.kordelia-about-context):not(.kordelia-settings) nav.main-tabs {
    position: fixed !important;
    top: calc(var(--kordelia-mobile-header) + env(safe-area-inset-top)) !important;
    right: 0 !important;
    bottom: auto !important;
    left: 0 !important;
    inset: auto 0 auto 0 !important;

    z-index: 3250 !important;

    display: grid !important;
    grid-template-columns: repeat(5, minmax(72px, 1fr)) !important;
    grid-auto-flow: column !important;
    flex-direction: row !important;
    align-items: stretch !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    height: var(--kordelia-mobile-water-nav) !important;
    min-height: var(--kordelia-mobile-water-nav) !important;
    max-height: var(--kordelia-mobile-water-nav) !important;

    margin: 0 !important;
    padding: 5px 5px !important;
    gap: 3px !important;

    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;

    border: 0 !important;
    border-bottom: 1px solid rgba(12,65,68,.14) !important;
    border-radius: 0 !important;
    background: rgba(244,250,249,.99) !important;
    box-shadow: 0 3px 10px rgba(12,65,68,.06) !important;

    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transition: none !important;
    isolation: auto !important;
  }

  body.kordelia-water nav.main-tabs::-webkit-scrollbar {
    display: none !important;
  }

  body.kordelia-water nav.main-tabs::before {
    content: none !important;
    display: none !important;
  }

  body.kordelia-water nav.main-tabs > .tab-button {
    position: relative !important;
    z-index: auto !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: auto !important;
    min-width: 72px !important;
    max-width: none !important;
    height: 38px !important;
    min-height: 38px !important;

    margin: 0 !important;
    padding: 0 6px !important;

    border: 1px solid rgba(12,65,68,.13) !important;
    border-radius: 8px !important;
    background: #fff !important;
    color: #0c5559 !important;

    font-size: .68rem !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;

    box-shadow: none !important;
    transform: none !important;
    pointer-events: auto !important;
    touch-action: manipulation !important;
  }

  body.kordelia-water nav.main-tabs > .tab-button.active {
    background: #0c7074 !important;
    border-color: #0c7074 !important;
    color: #fff !important;
    box-shadow: 0 3px 8px rgba(12,112,116,.16) !important;
  }

  body.kordelia-water nav.main-tabs > .tab-button:not(.active):active {
    background: rgba(18,113,117,.10) !important;
  }

  /* En ouverture du hamburger, responsive.css ne doit surtout plus
     transformer la barre Eau. Elle reste simplement derrière le backdrop. */
  body.mobile-menu-open.kordelia-water nav.main-tabs {
    transform: none !important;
    pointer-events: auto !important;
  }

  /* Pas de navigation Eau dans les espaces globaux. */
  body.kordelia-water.kordelia-portal-context nav.main-tabs,
  body.kordelia-water.kordelia-about-context nav.main-tabs,
  body.kordelia-water.kordelia-settings nav.main-tabs {
    display: none !important;
  }

  /* Réserver l'espace des éléments fixes pour éviter tout recouvrement. */
  body.kordelia-water .app-shell {
    margin-left: 0 !important;
    padding:
      calc(var(--kordelia-mobile-header) + var(--kordelia-mobile-water-nav) + env(safe-area-inset-top))
      0
      58px !important;
  }

  body.kordelia-water.kordelia-portal-context .app-shell,
  body.kordelia-water.kordelia-about-context .app-shell,
  body.kordelia-water.kordelia-settings .app-shell {
    padding:
      calc(var(--kordelia-mobile-header) + env(safe-area-inset-top))
      0
      58px !important;
  }

  body.kordelia-water main {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 8px 7px 62px !important;
  }
}

/* iPhone SE / très petit écran : le bandeau reste utilisable par défilement horizontal. */
@media (max-width: 359px) {
  body.kordelia-water nav.main-tabs > .tab-button {
    min-width: 70px !important;
    font-size: .64rem !important;
    padding: 0 5px !important;
  }
}

/* Garde-fou absolu : aucune règle de ce correctif ne change le desktop. */
@media (min-width: 861px) {
  body.kordelia-water .global-sidebar .mobile-global-water-subnav {
    display: none !important;
  }
}


/* =========================================================
   Kordelia 3.0.0 — en-tête mobile propre
   1re ligne : hamburger + Kordelia + compte
   2e ligne : Synthèse / Dashboard / Fuites / Anomalies / Inventaire
   Aucun impact desktop.
   ========================================================= */
@media (max-width: 860px) {
  :root {
    --kordelia-mobile-head-row: 56px;
    --kordelia-mobile-tabs-row: 48px;
  }

  /*
   * On remet l'en-tête dans le flux avec sticky plutôt que fixed.
   * C'est beaucoup plus stable dans Safari iOS avec les barres du navigateur.
   */
  body.kordelia-water .topbar {
    position: sticky !important;
    top: 0 !important;
    right: auto !important;
    left: auto !important;
    z-index: 3300 !important;

    display: grid !important;
    grid-template-columns: 46px minmax(0,1fr) 46px !important;
    grid-template-rows: var(--kordelia-mobile-head-row) var(--kordelia-mobile-tabs-row) !important;
    align-items: center !important;

    width: 100% !important;
    height: calc(var(--kordelia-mobile-head-row) + var(--kordelia-mobile-tabs-row)) !important;
    min-height: calc(var(--kordelia-mobile-head-row) + var(--kordelia-mobile-tabs-row)) !important;

    margin: 0 !important;
    padding: 0 6px !important;

    background: rgba(248,253,252,.99) !important;
    border-bottom: 1px solid rgba(12,65,68,.14) !important;
    box-shadow: 0 3px 12px rgba(12,65,68,.08) !important;
    overflow: visible !important;
  }

  /* Hamburger : sa propre case, plus aucun chevauchement avec Synthèse. */
  body.kordelia-water .mobile-menu-toggle {
    position: relative !important;
    inset: auto !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    justify-self: center !important;
    align-self: center !important;

    display: inline-flex !important;
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
    margin: 0 !important;

    border-radius: 9px !important;
    background: rgba(18,113,117,.06) !important;
    z-index: 3400 !important;
  }

  /* Petit bandeau Kordelia visible en permanence sur mobile. */
  body.kordelia-water .brand-strip {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
  }

  body.kordelia-water .mobile-brand-lockup {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    max-width: 100% !important;
    min-width: 0 !important;
    color: #0c5559 !important;
  }

  body.kordelia-water .mobile-kordelia-mark {
    display: block !important;
    width: 27px !important;
    height: 27px !important;
    min-width: 27px !important;
    object-fit: contain !important;
  }

  body.kordelia-water .mobile-brand-copy {
    display: flex !important;
    align-items: baseline !important;
    gap: 7px !important;
    min-width: 0 !important;
    white-space: nowrap !important;
  }

  body.kordelia-water .mobile-brand-copy strong {
    display: inline !important;
    font-size: .94rem !important;
    line-height: 1 !important;
    font-weight: 900 !important;
    letter-spacing: .14em !important;
    color: #0c5559 !important;
  }

  body.kordelia-water .mobile-brand-copy small {
    display: inline !important;
    max-width: 31vw !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    font-size: .72rem !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    color: #65777a !important;
  }

  body.kordelia-water .top-actions {
    grid-column: 3 !important;
    grid-row: 1 !important;
    justify-self: center !important;
    align-self: center !important;
    width: 40px !important;
    min-width: 40px !important;
    margin: 0 !important;
  }

  /*
   * La navigation Eau est la vraie 2e ligne du header.
   * Elle n'est donc plus positionnée par-dessus le hamburger.
   */
  body.kordelia-water:not(.kordelia-portal-context):not(.kordelia-about-context):not(.kordelia-settings) nav.main-tabs {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    inset: auto !important;

    grid-column: 1 / -1 !important;
    grid-row: 2 !important;

    display: flex !important;
    align-items: stretch !important;
    width: calc(100% + 12px) !important;
    min-width: 0 !important;
    max-width: none !important;
    height: var(--kordelia-mobile-tabs-row) !important;
    min-height: var(--kordelia-mobile-tabs-row) !important;
    max-height: var(--kordelia-mobile-tabs-row) !important;

    margin: 0 -6px !important;
    padding: 5px 7px !important;
    gap: 5px !important;

    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;

    background: rgba(244,250,249,.99) !important;
    border-top: 1px solid rgba(12,65,68,.08) !important;
    border-bottom: 0 !important;
    box-shadow: none !important;

    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  body.kordelia-water nav.main-tabs > .tab-button {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 102px !important;
    height: 38px !important;
    min-height: 38px !important;
    padding: 0 12px !important;
    border-radius: 9px !important;
    font-size: .70rem !important;
    white-space: nowrap !important;
  }

  /* Comme le header est désormais dans le flux, plus de gros padding artificiel. */
  body.kordelia-water .app-shell {
    margin-left: 0 !important;
    padding: 0 0 58px !important;
  }

  /* Accueil global / À propos / Paramètres : une seule ligne Kordelia. */
  body.kordelia-water.kordelia-portal-context .topbar,
  body.kordelia-water.kordelia-about-context .topbar,
  body.kordelia-water.kordelia-settings .topbar {
    grid-template-rows: var(--kordelia-mobile-head-row) !important;
    height: var(--kordelia-mobile-head-row) !important;
    min-height: var(--kordelia-mobile-head-row) !important;
  }

  body.kordelia-water.kordelia-portal-context nav.main-tabs,
  body.kordelia-water.kordelia-about-context nav.main-tabs,
  body.kordelia-water.kordelia-settings nav.main-tabs {
    display: none !important;
  }

  body.kordelia-water.kordelia-portal-context .app-shell,
  body.kordelia-water.kordelia-about-context .app-shell,
  body.kordelia-water.kordelia-settings .app-shell {
    padding: 0 0 58px !important;
  }
}

@media (max-width: 359px) {
  body.kordelia-water nav.main-tabs > .tab-button {
    min-width: 94px !important;
    padding: 0 10px !important;
    font-size: .66rem !important;
  }

  body.kordelia-water .mobile-brand-copy strong {
    font-size: .88rem !important;
  }

  body.kordelia-water .mobile-brand-copy small {
    max-width: 25vw !important;
    font-size: .66rem !important;
  }
}

/* =========================================================
   KORDELIA — agrandissement x2 du logo du bandeau principal
   Desktop uniquement — FMD et DNA inchangés
   ========================================================= */
@media (min-width: 861px) {
  :root {
    --kordelia-shell-top: 190px;
  }

  .topbar,
  .energy-header {
    height: var(--kordelia-shell-top) !important;
    min-height: var(--kordelia-shell-top) !important;
    overflow: visible !important;
  }

  .brand-strip,
  .energy-header .brand-group {
    height: 100% !important;
    min-height: var(--kordelia-shell-top) !important;
    overflow: visible !important;
  }

  /* Cible directe du bloc/lien Kordelia */
  .kordelia-home-link {
    height: 180px !important;
    min-height: 180px !important;
    width: auto !important;
    padding: 0 !important;
    overflow: visible !important;
    flex: 0 0 auto !important;
  }

  /* Cible le logo Kordelia quelle que soit la classe réellement portée par l'image */
  .topbar .kordelia-home-link img,
  .energy-header .kordelia-home-link img,
  .topbar img.kordelia-header-logo,
  .energy-header img.kordelia-logo,
  .brand-strip .kordelia-header-logo,
  .energy-header .brand-group .kordelia-logo {
    display: block !important;
    height: 180px !important;
    min-height: 180px !important;
    max-height: 180px !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    object-fit: contain !important;
    transform: none !important;
    flex: 0 0 auto !important;
  }
}

/* =========================================================
   KORDELIA — logo bandeau desktop x2 — règle finale
   ========================================================= */
@media (min-width: 861px) {
  :root { --kordelia-shell-top: 310px; }

  .topbar,
  .energy-header {
    height: 310px !important;
    min-height: 310px !important;
    overflow: visible !important;
  }

  .topbar .brand-strip,
  .energy-header .brand-group {
    min-height: 310px !important;
    overflow: visible !important;
  }

  .topbar .kordelia-home-link,
  .energy-header .kordelia-home-link {
    width: 560px !important;
    max-width: 560px !important;
    height: auto !important;
    max-height: none !important;
    padding: 0 !important;
    flex: 0 0 560px !important;
    overflow: visible !important;
  }

  .topbar .kordelia-home-link img.kordelia-header-logo,
  .energy-header .kordelia-home-link img.kordelia-logo,
  .topbar img.kordelia-header-logo,
  .energy-header img.kordelia-logo {
    width: 560px !important;
    min-width: 560px !important;
    max-width: 560px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    object-fit: contain !important;
    display: block !important;
  }
}

/* =========================================================
   KORDELIA — logo bandeau desktop taille équilibrée
   ========================================================= */
@media (min-width: 861px) {
  :root { --kordelia-shell-top: 170px !important; }

  .topbar,
  .energy-header {
    height: 170px !important;
    min-height: 170px !important;
    overflow: visible !important;
  }

  .topbar .brand-strip,
  .energy-header .brand-group {
    height: 170px !important;
    min-height: 170px !important;
    overflow: visible !important;
  }

  .topbar .kordelia-home-link,
  .energy-header .kordelia-home-link {
    width: 300px !important;
    min-width: 300px !important;
    max-width: 300px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: 0 !important;
    flex: 0 0 300px !important;
    overflow: visible !important;
  }

  .topbar .kordelia-home-link img.kordelia-header-logo,
  .energy-header .kordelia-home-link img.kordelia-logo,
  .topbar img.kordelia-header-logo,
  .energy-header img.kordelia-logo {
    width: 300px !important;
    min-width: 300px !important;
    max-width: 300px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    object-fit: contain !important;
    display: block !important;
  }
}


/* V3 - À propos administré depuis Paramètres > Informations */
.about-free-text {
  white-space: pre-wrap;
  line-height: 1.75;
  color: #334155;
  margin-top: 18px;
}


/* KORDELIA — dégagement du pied de page pour le bouton Remonter */
.scroll-top-button.footer-visible{
  bottom:82px !important;
}
@media(max-width:780px){
  .scroll-top-button.footer-visible{bottom:82px !important;}
}
