/* Tableau de bord CIPA. Les couleurs restent alignées sur le thème public et
   les tailles sont volontairement fluides pour les écrans à faible largeur. */

.cipa-tableau-bord { background: #f4f7f5; padding-top: 1.25rem; }
.cipa-filtres { display: grid; gap: 1rem; }
/* Le nom d'une couche est long : sélecteur pleine largeur, scénario en dessous. */
.cipa-filtres > :first-child, .cipa-filtres noscript { grid-column: 1 / -1; }
.cipa-dashboard-grid { display: grid; gap: 1rem; align-items: start; }
.cipa-panel { border: 1px solid var(--color-border, #dbe4df); background: #fff; padding: 1.25rem; box-shadow: 0 10px 28px rgb(15 53 45 / .05); }
.cipa-panel-entete { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
/* Un panneau peut n'avoir qu'un surtitre comme titre (h2.cipa-kicker). */
.cipa-panel-entete h2:not(.cipa-kicker) { margin-top: .15rem; color: var(--color-ocean-950, #123c34); font-size: 1.05rem; font-weight: 800; line-height: 1.3; }
.cipa-description-couche { margin: -.25rem 0 1rem; color: #475569; font-size: .82rem; line-height: 1.55; }
.cipa-kicker { color: var(--color-leaf-700, #3f7046); font-size: .68rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.cipa-carte-panel .cipa-panel-entete { flex-wrap: wrap; }
.cipa-fond-osm { display: inline-flex; align-items: center; gap: .45rem; border-radius: .5rem; background: var(--color-ocean-100, #eaf3f0); padding: .35rem .6rem; color: var(--color-ocean-950, #123c34); font-size: .75rem; font-weight: 700; cursor: pointer; }
.cipa-fond-osm input { accent-color: var(--color-ocean-900, #185e4d); }
.cipa-groupe-couches { margin-top: 1.25rem; }
.cipa-groupe-couches legend { margin-bottom: .5rem; color: #475569; font-size: .68rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.cipa-ligne-option { display: flex; align-items: center; gap: .65rem; width: 100%; border-radius: .65rem; padding: .65rem; color: #475569; font-size: .78rem; }
.cipa-ligne-option { cursor: pointer; }
.cipa-ligne-option input { accent-color: var(--color-ocean-900, #185e4d); }
.cipa-analyse { display: grid; gap: 1rem; }
.cipa-aide-tableau { margin-top: .75rem; color: var(--color-ocean-950, #123c34); font-size: .75rem; }
.cipa-aide-tableau summary { display: grid; place-items: center; width: 1.5rem; height: 1.5rem; border: 1px solid currentColor; border-radius: 50%; cursor: pointer; font-weight: 800; list-style: none; }
.cipa-aide-tableau summary::-webkit-details-marker { display: none; }
.cipa-aide-tableau summary:focus-visible { outline: 3px solid var(--color-sun-500, #efb629); outline-offset: 3px; }
.cipa-aide-tableau p { margin-top: .5rem; max-width: 36rem; line-height: 1.5; }
.cipa-carte-indisponible { display: grid; min-height: 18rem; place-items: center; border: 1px dashed var(--color-border, #dbe4df); background: #f4f7f5; padding: 2rem; color: var(--color-ocean-950, #123c34); font-size: .875rem; line-height: 1.6; text-align: center; }
.cipa-options-carte { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 1rem 2rem; margin-top: 1rem; border-top: 1px solid var(--color-border, #dbe4df); padding-top: 1rem; }
.cipa-options-carte .cipa-groupe-couches { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin: 0; }
.cipa-options-carte .cipa-groupe-couches legend { float: left; margin: .65rem .75rem .5rem 0; }
.cipa-options-carte .cipa-ligne-option { width: auto; }
.cipa-options-carte .indicateurs-carte-opacite { min-width: min(100%, 12rem); margin: 0; }
.cipa-observation { border-left: .25rem solid var(--color-sun-500, #efb629); }
/* `.contenu-editorial` (1rem, hors couche Tailwind) l'emporte sur les utilitaires
   text-* : 1px de moins ici pour rester au niveau du texte de la plateforme. */
.cipa-observation .contenu-editorial { font-size: .9375rem; }

/* Survol sans clic (plus de sélection de territoire) : pas de curseur main. */
#carte-indicateurs .leaflet-interactive { cursor: inherit; }
/* Raster WMS (image unique, voir indicateurs_couches.js) : pixels nets, sans
   lissage, pendant l'animation de zoom qui l'agrandit avant le nouveau rendu. */
#carte-indicateurs .leaflet-rasterWms-pane img { image-rendering: pixelated; }

#carte-indicateurs {
    position: relative;
    z-index: 0;
    isolation: isolate;
    width: 100%;
    height: 52rem;
}

.indicateurs-carte-opacite {
    display: grid;
    gap: .45rem;
    margin-top: 1rem;
    font-size: .8125rem;
    color: var(--color-ink, #374151);
}

.indicateurs-carte-opacite > span { display: flex; justify-content: space-between; font-weight: 700; }
.indicateurs-carte-opacite output { color: var(--color-ocean-900, #185e4d); }

.indicateurs-carte-opacite input[type="range"] {
    width: 100%;
    accent-color: var(--color-ocean-900, #185e4d);
}

@media (min-width: 640px) {
    .cipa-filtres { grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); }
}

@media (min-width: 1024px) {
    /* Carte sur 60 % de la largeur ; à droite, les filtres puis l'analyse. La
       carte couvre les deux lignes : `auto 1fr` cale la première sur la hauteur
       des filtres et reporte le reste de la hauteur de la carte sur la seconde,
       sans espace vide entre filtres et analyse. */
    .cipa-dashboard-grid { grid-template-columns: minmax(0, 60%) minmax(0, 1fr); grid-template-rows: auto 1fr; }
    .cipa-carte-panel { grid-column: 1; grid-row: 1 / span 2; }
    .cipa-selection { grid-column: 2; grid-row: 1; }
    .cipa-analyse { grid-column: 2; grid-row: 2; }
    #carte-indicateurs { height: 76rem; }
}

.cipa-legende-carte { min-width: 8rem; border: 1px solid rgb(15 53 45 / .15); background: rgb(255 255 255 / .94); padding: .65rem; box-shadow: 0 6px 18px rgb(15 53 45 / .12); color: #334155; font-size: .68rem; }
.cipa-legende-carte strong, .cipa-legende-carte span { display: flex; align-items: center; gap: .4rem; }
.cipa-legende-carte strong { margin-bottom: .35rem; color: var(--color-ocean-950, #123c34); }
.cipa-legende-carte span + span { margin-top: .2rem; }
.cipa-legende-carte i { width: .7rem; height: .7rem; border-radius: .15rem; }
.cipa-legende-carte img { display: block; max-width: min(16rem, 45vw); max-height: 18rem; object-fit: contain; }

.cipa-etat-carte { margin-top: .75rem; background: var(--color-ocean-100, #eaf3f0); padding: .65rem .8rem; color: var(--color-ocean-950, #123c34); font-size: .75rem; line-height: 1.45; }
.cipa-etat-carte.est-erreur { border: 1px solid #f1c27d; background: #fff7e8; color: #7c4a03; }
.cipa-etat-carte[hidden] { display: none; }