/* @import url('app.css'); */
@import url('https://fonts.googleapis.com/css2?family=Averia+Sans+Libre:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&family=Courgette&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Quicksand:wght@300..700&display=swap');
@import url('../../nef/app/style/common.css');
@import url('../../nef/gis/style/gis.css');
@import url('../../nef/admin/style/admin.css');
@import url('elements.css');
@import url('app.climae.values.css');

body, .geonefApp, .tundra .dijitMenuItem { font-family: 'Inter', sans-serif; font-size: 11.5pt; }
h1, h2, h3, h4,
  .driver-popover * { font-family: 'Inter', sans-serif; text-align: left; }
h2 { font-size: 1.2em; font-weight: 800; }
em { color: #14676F; font-style: normal; font-weight: 500; }
.tundra .dijitTooltipContainer, .driver-popover { background: #fff8f2 /*#e2f0f0*/; border: 1px solid #cebaa7; box-shadow: 0 0 2em 0 rgba(80,80,80,0.5); border-radius: 5px; }
.tundra .dijitTooltipContainer { max-width: 400px; }
.driver-popover { min-width: 350px; max-width: 450px; }
.driver-popover-description { font-size: 1em; }
.driver-popover-progress-text { font-size: 1em; }
.driver-popover-navigation-btns button { padding: .6em; font-size: 1em; }
/* .driver-popover-navigation-btns button.driver-popover-prev-btn { background: #dfd1c1; font-weight: 500; } */
.button.primary { font-weight: 500; letter-spacing: .05em; }
driver-popover-next-btn


/* .geonefApp { background: #e6e6e6; } */
.header { position: relative; height: 100px; background: transparent; }
.header h1 { position: absolute; left: 380px; right: 250px; top: 36px; font-size: 2.2em; font-weight: 300; line-height: 1.1em; }
/* .header-title { left: 380px; margin-top: 0; } */
.header-actions { position: absolute; right: 4em; top: 26px; }
.geonefDisplay, .nefClimaeIndicatorsPane { top: 115px; }
.geonefDisplay, .geonefPanel { left: 380px; }
.geonefDisplay { bottom: 0 /*340px*/; }
.jigLayoutChildrenTabs { display: none; }

/* .geonefDisplay{position:relative;overflow:hidden;} */
.panelContainer > .dijitStackContainerChildWrapper,
  .panelContainer > .dijitStackContainerChildWrapper > .jigWidget { height: auto; } /* override */
.geonefPanel { /*height: 570px;*/ top: auto; width: auto; background: none; border: 0; box-shadow: none; }


/* Conteneur global */
/* .geonefDisplay{position:relative;overflow:hidden;} */
:root{--left-panel-w:380px;}
/* Panneau bas */
.geonefPanel{--panel-h-collapsed:220px;--panel-h-expanded:65vh;position:absolute;
  width:min(800px,calc(100vw - 24px));height:var(--panel-h-collapsed);
  left:calc(50% + (var(--left-panel-w) / 2));bottom:10px;
  transform:translateX(-50%);
  /*display:flex;flex-direction:column;*//*border-radius:16px;background:rgba(255,255,255,0.9);border:1px solid rgba(0,0,0,0.12);*/
  box-shadow:0 14px 32px rgba(0,0,0,0.18);
  transition:box-shadow 200ms ease;z-index:20;}

/* État ouvert (classe informative, pas structurelle) */
.geonefPanel.is-expanded{box-shadow:0 18px 48px rgba(0,0,0,0.22);}

/* StackContainer */
.geonefPanel .panelContainer{flex:1 1 auto;min-height:0;}

/* Pane */
.geonefPane{position: relative; height:100%;display:flex;flex-direction:column;}

.geonefPanelScrollProxy{position:absolute;left:0;top:0;width:1px;opacity:0;pointer-events:none;}

/* Sections */
.paneClimaeGeoFlex_group{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-content:start;}
.paneClimaeGeoFlex_section{/*width: 380px;*/ /*height: 345px;*/ min-width:0; padding: .5em;
  border-radius:16px;background:rgba(255,255,255,0.8);
  border:1px solid rgba(0,0,0,0.12);box-shadow:0 14px 32px rgba(0,0,0,0.18); }

.paneClimaeGeoFlex_section.full{grid-column:1 / -1;}
@media (max-width:1200px){.paneClimaeGeoFlex_group{grid-template-columns:1fr;}}


.nefClimaeIndicatorsPane { position: absolute; left: 0; bottom: 0; width: 380px; overflow: auto; background: #3e6464; color: #E6F0EF; display: flex; flex-direction: column; }
.nefClimaeIndicatorsPane .link { color: #e8ae84; }
.nefClimaeIndicatorsPane .link:hover { color:#d17f44; }
.nefClimaeIndicatorsPane > .content { padding: .5em .5em 1em; }
.nefClimaeIndicatorsPane h3 { font-size: 1.3em; font-weight: 600; }
.nefClimaeIndicatorsPane .indic { min-height: 50px; margin: 1em; padding: 2em 1em 2em 2em;  background: #2a5050; border-radius: 5px; transition: background-color 200ms ease; /*border-left: 3px solid #2a5050;*/ } /* #d9f4fb */
.nefClimaeIndicatorsPane .indic.active,
  .nefClimaeIndicatorsPane .indic:hover { background: #1c3d3d; outline: 1px solid #618888; } /*  #badbe4 */
.nefClimaeIndicatorsPane .indic:hover { cursor: pointer; }
.nefClimaeIndicatorsPane .indic.unavailable:hover { cursor: default; }
.nefClimaeIndicatorsPane .famille { height: 4em; overflow: hidden; transition: height 800ms ease; }
.nefClimaeIndicatorsPane .famille.active { height: auto; }
.nefClimaeIndicatorsPane .famille h3 { cursor: pointer; position: relative; padding-left: 22px; }
.nefClimaeIndicatorsPane .famille.active h3 { color: #ecaa78; cursor: default; }
.nefClimaeIndicatorsPane .famille h3:before { content: ""; position: absolute; left: 0; top: 50%; width: 10px; height: 10px; transform: translateY(-50%) rotate(0deg); transform-origin: 50% 50%; transition: transform 200ms ease-out; background-repeat: no-repeat; background-size: 10px 10px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'><path d='M3 1 L7 5 L3 9' fill='none' stroke='%239FB7B5' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/></svg>"); 
}
.nefClimaeIndicatorsPane .famille.active h3:before { transform: translateY(-50%) rotate(90deg); }
.nefClimaeIndicatorsPane .famille > p { margin-left: 3em; }
/* .nefClimaeIndicatorsPane .famille .subline { } */
/* .nefClimaeIndicatorsPane .famille .subline .sub { padding-left: -1em; border-bottom: 1px solid; } */
/* .nefClimaeIndicatorsPane .famille.active .subline {border-bottom: 3px solid; } */
/* .nefClimaeIndicatorsPane .famille.active .subline .sub { } */
.indic > h4 { position: relative; padding-right: 56px; line-height: 1.2; min-height: 28px; font-size: 1.2em; color: #d7b9a3; }
.indic.unavailable > h4 {color: #E6F0EF; }
.indic.active > h4, .indic:hover > h4 {color: #e8ae84; }
.indic > h4::after { content: ""; position: absolute;right: 0; top: 50%; width: 56px; height: 56px; transform: translateY(-50%); background-image: url("images/pressions_indicateurs_sprite.png"); background-repeat: no-repeat;  background-size: 168px 112px; opacity: 0.95; }
.indic.icon-thermal-cycle-fatigue > h4::after { background-position: 0px 0px; }
.indic.icon-chronic-heat-fatigue  > h4::after { background-position: -56px 0px; }
.indic.icon-thermal-shock-events  > h4::after { background-position: -112px 0px; }
.indic.icon-freeze-thaw-fatigue           > h4::after { background-position: 0px -56px; }
.indic.icon-wet-dry-soil-fatigue          > h4::after { background-position: -56px -56px; }
.indic.icon-drought-then-heavy-rain-fatigue > h4::after { background-position: -112px -56px; }
.nefClimaeIndicatorsPane .indic p { margin: 1em 0 0 0; }
.nefClimaeIndicatorsPane .about { margin-top: auto; background: #2a5050; padding: 1em .5em .5em; text-align: center; }


.jigButtonUserStatus { position: relative; float: right; }

.ol-zoom { left: auto; right: .5em; }
.ol-rotate { top: 3.5em; }

.he:hover { color: #ed1b2d; }

/* gardé */
img.logo-top { height: 100px; margin-left: 65px; }
.header-logo { margin-top: 10px; }


.maplibregl-map { font: inherit; }
/* .nefGisLayerLegend { background: #3e6464; color: #E6F0EF; } */
.nefGisLayerLegend h3 { font-weight: bold; font-size: 1.1em; }
.nefGisLayerLegend h4 { font-weight: 600; font-size: 1.1em; margin-top: 1em; }
.nefGisLayerLegend .jigInputRadioButtons .metricItem { position: relative; display: block; padding-left: 1.5em; cursor: pointer; font-weight: 500; font-size: 1.1em; }
.nefGisLayerLegend .jigInputRadioButtons .metricItem.emphasize { cursor: default; }
.nefGisLayerLegend .jigInputRadioButtons .metricItem:hover { color: #14676F; }
.nefGisLayerLegend .jigInputRadioButtons .metricItem:before { content: ""; position: absolute; top: .2em; left: 0;  width: .9em; height: .9em; border-radius: 99px; border: 2px solid #14676F; }
.nefGisLayerLegend .jigInputRadioButtons .metricItem.emphasize:before { background: #14676F; }
.nefGisLayerLegend .jigInputRadioButtons .metricItem:hover:before { background: #429ba3; }
.nefGisLayerLegend .opacitySliderBar { margin: .5em 0 1em 0; }
.climaeWmsLegend { overflow: hidden; }
.climaeWmsLegend > img {  transform-origin: left top; transform: translateY(-40px) scale(1.2); }
.gradientLegendV { margin: 1em 0 2em; }
.legendScale { position: relative; width: 260px; height: 240px; }
.legendBar { position: absolute; left: 0; top: 0; width: 16px; height: 100%; border-radius: 3px; border: 1px solid rgba(0,0,0,.2); box-sizing: border-box; }
.legendStops { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; }
.legendStop { position: absolute; left: 0; transform: translateY(-50%); display: flex; align-items: center; gap: 6px; }
.tickLine { width: 22px; height: 1px; background: rgba(0,0,0,.55); margin-left: 16px; }
.tickSwatch { width: 10px; height: 10px; border: 1px solid rgba(0,0,0,.25); box-sizing: border-box; }
.tickText { /*font-size: 12px;*/ white-space: nowrap; background: rgba(255,255,255,.75); padding: 1px 4px; border-radius: 3px; }


/* Panneau du bas */
/* .paneClimaeGeoFlex{ display: grid; grid-template-rows: auto 1fr; overflow: hidden; } */

/* .paneClimaeGeoFlex_nav{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px 0 0px;}
.paneClimaeGeoFlex_navbtn{appearance:none;border:1px solid rgba(0,0,0,.12);background:#fff;border-radius:10px;height:34px;padding:0 10px;cursor:pointer;user-select:none;}
.paneClimaeGeoFlex_navbtn:active{transform:translateY(1px);}

.paneClimaeGeoFlex_dots{display:flex;gap:8px;align-items:center;justify-content:center;flex:1;}
.paneClimaeGeoFlex_dot{width:8px;height:8px;border-radius:999px;border:0;background:rgba(0,0,0,.20);cursor:pointer;}
.paneClimaeGeoFlex_dot.is-active{background:rgba(0,0,0,.70);}


.paneClimaeGeoFlex{height:340px;display:flex;flex-direction:column;overflow:hidden;}
.paneClimaeGeoFlex_group{flex:1 1 auto;height: 100%;min-height:0;display:flex;gap:14px;padding:10px 12px 14px 12px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth;align-items:stretch;}
.paneClimaeGeoFlex_section{flex:0 0 clamp(260px, 70vw, 460px);height:100%;overflow:auto;scroll-snap-align:start;border:1px solid rgba(0,0,0,.10);border-radius:5px;padding:10px 5px 0px;background:linear-gradient(180deg, rgba(2, 181, 199, 0.06), rgba(2, 190, 199, 0));-webkit-overflow-scrolling:touch;  }
.paneClimaeGeoFlex_section::-webkit-scrollbar{width:8px;height:8px;}
.paneClimaeGeoFlex_section::-webkit-scrollbar-thumb{background:rgba(0,0,0,.22);border-radius:999px;border:2px solid transparent;background-clip:padding-box;}
.paneClimaeGeoFlex_section::-webkit-scrollbar-track{background:transparent;}
@media (max-width:520px){.paneClimaeGeoFlex_section{flex-basis:calc(100% - 24px);}} */

.nefClimaeIndicatorPane h3 { text-align: left; }
.nefClimaeIndicatorPane .startH3 h3 { margin-top: 0; }
.nefClimaeIndicatorPane .tag-list { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; list-style: none; margin:0; padding: 0; }
.nefClimaeIndicatorPane .tag-list li { display: inline-flex; align-items: center; max-width: 100%; padding: 6px 10px; border-radius: 8px; border: 1px solid #b3cccc; background: #ceeaea; font-size: .9em; line-height: 1.1; white-space: nowrap; cursor: default; }
/* .nefClimaeIndicatorPane .tag-list li::before { content: ""; width: 6px; height: 6px; border-radius: 999px; margin-right: 8px; background: #E6F0EF;flex: 0 0 auto; } */
.nefClimaeIndicatorPane .exclus .tag-list li { background: #e6e6e6; border-style: dashed; }
.nefClimaeIndicatorPane section .help { float: right; }
.nefClimaeIndicatorPane section .help.inline { float: none; }
.nefClimaeIndicatorPane .showValues,
  .nefClimaeIndicatorPane.showValues .showMetric { display: none; }
.nefClimaeIndicatorPane.showValues .showValues { display: block; }
.nefClimaeIndicatorPane .exemple { }
.nefClimaeIndicatorPane .exemple h2 > div { margin: .5em 0 1em; font-size: .75em; font-weight: 700; }
.nefClimaeIndicatorPane .exemple .exempleVisuel { width: 100%; }

.climaeRadar{
  position: absolute;
  left: 50%;
  top: 50%;
  width: 160px;
  height: 160px;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  border: 2px solid rgba(255,255,255,.85);
  box-shadow: 0 0 0 1px rgba(0,0,0,.25) inset;
  pointer-events: none;       /* ne gêne pas le drag/zoom */
  z-index: 10;
}

.climaeRadar .h, .climaeRadar .v{
  position: absolute;
  left: 50%;
  top: 50%;
  background: rgba(255,255,255,.75);
  transform: translate(-50%, -50%);
}

.climaeRadar .h{ width: 140px; height: 1px; }
.climaeRadar .v{ width: 1px; height: 140px; }



/* Piste horizontale : cartes alignées sur une ligne */
/* .paneClimaeGeoFlex_group{display:flex;gap:14px;padding:10px 12px 14px 12px;overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;scroll-snap-type:x mandatory;scrollbar-width:none;} */
/* .paneClimaeGeoFlex_group::-webkit-scrollbar{display:none;} */

/* Une "section" (carte) = 350px fixe */
/* .paneClimaeGeoFlex_group > section {flex:0 0 350px;height:100%;scroll-snap-align:start;border:1px solid rgba(0,0,0,.10);border-radius:14px;padding:14px;background:#fff;display:flex;flex-direction:column;gap:10px;min-height:0;position:relative;}

.paneClimaeGeoFlex_group > section{flex:0 0 clamp(360px, 55vw, 720px);height:100%;scroll-snap-align:start;border:1px solid rgba(0,0,0,.10);border-radius:14px;padding:14px;background:#fff;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.25) transparent;}
.paneClimaeGeoFlex_group > section::-webkit-scrollbar{width:8px;}
.paneClimaeGeoFlex_group > section::-webkit-scrollbar-thumb{background:rgba(0,0,0,.22);border-radius:999px;border:2px solid transparent;background-clip:padding-box;}
.paneClimaeGeoFlex_group > section::-webkit-scrollbar-track{background:transparent;}
@media (max-width:520px){.paneClimaeGeoFlex_group > section{flex-basis:calc(100% - 24px);}} */

/* 
.paneClimaeGeoFlex_cardbody{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;padding-right:6px;scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.25) transparent;}
.paneClimaeGeoFlex_cardbody::-webkit-scrollbar{width:8px;}
.paneClimaeGeoFlex_cardbody::-webkit-scrollbar-thumb{background:rgba(0,0,0,.22);border-radius:999px;border:2px solid transparent;background-clip:padding-box;}
.paneClimaeGeoFlex_cardbody::-webkit-scrollbar-track{background:transparent;}
.bottomPanel__card::after{content:"";position:absolute;left:14px;right:14px;bottom:44px;height:18px;pointer-events:none;background:linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,1));} */

/* .paneClimaeGeoFlex_group h2 { font-size: 1.1em; } */

/* Responsive : sur petits écrans, carte quasi pleine largeur
@media (max-width: 520px){
  .bottomPanel{
    height: 360px;
  }
  .bottomPanel__card{
    flex-basis: calc(100% - 24px);
  }
} */