/* AcqHome Tools — Cadastre : la carte agrandie (02/10/2026). Classes cc-*.
   Chargée avant /apihome.css (qui prime) et avant le <style> de l'écran :
   jetons et composants .ah-* en viennent. Là où une règle de l'écran doit
   céder (plein écran), la spécificité le dit (html.cad-plein …), jamais
   !important. Rayons ≤ 6 px, cibles de 44 px, aucune couleur en dur. */

/* Jeton local : le fond clair des légendes officielles. Ce sont des images à
   texte sombre sur fond transparent : en thème sombre elles deviendraient
   illisibles. Clair dans les deux thèmes, tiré des jetons (encre = clair en sombre). */
:root{--cc-fond-leg:var(--surface)}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]){--cc-fond-leg:var(--encre)}}
:root[data-theme="dark"]{--cc-fond-leg:var(--encre)}

/* ── La pile de boutons, en haut à droite de la carte ─────────────────── */
.cc-pile{position:absolute;top:var(--e-3);right:var(--e-3);z-index:850;display:flex;flex-direction:column;
  align-items:flex-end;gap:var(--e-2);pointer-events:none}
.cc-pile>*{pointer-events:auto}
.cc-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:var(--e-2);
  min-width:var(--cible);min-height:var(--cible);padding:0 var(--e-3);border:1px solid var(--trait-2);
  border-radius:var(--r-2);background:var(--surface);color:var(--encre);font:500 14px/1 var(--sans);
  box-shadow:var(--ombre-flottant);cursor:pointer;white-space:nowrap;
  transition:background var(--duree),color var(--duree),border-color var(--duree)}
.cc-btn svg{width:20px;height:20px;flex:none}
.cc-btn:active{background:var(--brume)}
@media(hover:hover){.cc-btn:hover:not(:disabled):not([aria-pressed="true"]):not([aria-expanded="true"]){background:var(--brume)}}
.cc-btn[aria-pressed="true"],.cc-btn[aria-expanded="true"]{background:var(--action);border-color:var(--action);color:var(--sur-action)}
.cc-btn:disabled{opacity:.6;cursor:not-allowed}
.cc-compte{display:inline-block;min-width:20px;height:20px;padding:0 5px;border-radius:var(--r-1);background:var(--action);
  color:var(--sur-action);font:700 12px/20px var(--sans);text-align:center;font-variant-numeric:tabular-nums}
.cc-compte[hidden]{display:none}
.cc-btn[aria-expanded="true"] .cc-compte{background:var(--sur-action);color:var(--action)}
/* sous 760 px : des carrés de 48 px (--cible-carte : au doigt, sur la carte,
   charte §5), le libellé reste pour les lecteurs d'écran */
@media(max-width:759px){
  .cc-btn{width:var(--cible-carte);min-height:var(--cible-carte);padding:0}
  .cc-btn .cc-lib{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
  .cc-compte{position:absolute;top:-6px;right:-6px;min-width:18px;height:18px;padding:0 4px;line-height:18px;
    box-shadow:0 0 0 2px var(--surface)}
  /* la ligne d'état reste entre le zoom et la pile, sans couvrir l'un ni l'autre */
  .enveloppe-carte .etat{max-width:calc(100% - 2*(var(--cible-carte) + 2*var(--e-3)))}
}

/* ── Les panneaux flottants (Calques, Recherches) : z 910, au-dessus de la
   ligne d'état (900) qui couvrirait leur titre, sous la barre de sélection (1000) ── */
.cc-panneau{position:absolute;z-index:910;top:var(--e-3);right:calc(2*var(--e-3) + var(--cc-pile-l,44px) - var(--e-1));
  width:min(340px,calc(100% - 2*var(--e-3)));max-height:calc(100% - 2*var(--e-3));display:flex;flex-direction:column;
  background:var(--surface);color:var(--encre);border:1px solid var(--trait-2);border-radius:var(--r-2);
  box-shadow:var(--ombre-flottant);overflow:hidden;animation:cc-apparait var(--duree) ease-out}
.cc-panneau[hidden]{display:none}
.cc-panneau:focus{outline:none}
.cc-pan-tete{display:flex;align-items:center;gap:var(--e-2);min-height:var(--cible);padding:0 var(--e-1) 0 var(--e-4);
  border-bottom:1px solid var(--trait);flex:none}
.cc-pan-titre{flex:1;margin:0;font-size:16px;font-weight:700;line-height:1.3}
.cc-pan-titre:focus{outline:none}
.cc-x{width:var(--cible);height:var(--cible);flex:none;display:grid;place-items:center;border:0;border-radius:var(--r-2);
  background:none;color:var(--encre-2);cursor:pointer}
.cc-x:active{background:var(--brume)}
@media(hover:hover){.cc-x:hover{background:var(--brume);color:var(--encre)}}
.cc-pan-corps{flex:1;min-height:0;overflow:auto;padding:var(--e-2) var(--e-4) var(--e-4);
  -webkit-overflow-scrolling:touch;overscroll-behavior:contain}
.cc-pan-aide{margin:0 0 var(--e-2);font-size:12px;line-height:1.4;color:var(--encre-3)}
.cc-groupe{padding:var(--e-2) 0 var(--e-1);border-top:1px solid var(--trait)}
.cc-groupe:first-of-type{border-top:0}
.cc-groupe-tete{display:flex;align-items:center;justify-content:space-between;gap:var(--e-2);min-height:var(--cible)}
.cc-groupe-tete h3{margin:0;font-size:14px;font-weight:700;color:var(--encre)}
.cc-tout{flex:none;min-height:var(--cible);padding:0 var(--e-2);border:0;border-radius:var(--r-2);background:none;
  color:var(--action);font:500 14px var(--sans);cursor:pointer}
.cc-tout:active{background:var(--action-f)}
@media(hover:hover){.cc-tout:hover{background:var(--action-f)}}
.cc-groupe-aide{margin:0 0 var(--e-1);font-size:12px;line-height:1.4;color:var(--encre-3)}
.cc-opacite{display:flex;align-items:center;gap:var(--e-3);min-height:var(--cible);font-size:14px;color:var(--encre-2)}
.cc-opacite input{flex:1;min-width:0;min-height:var(--cible);margin:0;accent-color:var(--action);cursor:pointer;background:none}
.cc-opacite output{min-width:44px;text-align:right;font-variant-numeric:tabular-nums;color:var(--encre)}
.cc-liste{list-style:none;margin:0;padding:0}
.cc-entree{padding:0 0 var(--e-1)}
.cc-case{display:flex;align-items:center;gap:var(--e-3);min-height:var(--cible);font-size:14px;line-height:1.3;cursor:pointer;color:var(--encre)}
.cc-case input{width:20px;height:20px;min-height:0;margin:0;flex:none;accent-color:var(--action);cursor:pointer}
.cc-aide{margin:-6px 0 0 32px;font-size:12px;line-height:1.4;color:var(--encre-3)}
.cc-etat{margin:2px 0 0 32px;font-size:12px;line-height:1.4;color:var(--encre-2)}
.cc-etat:empty{display:none}
.cc-entree[data-etat="indisponible"] .cc-etat{color:var(--encre)}
/* une cible de 44 px (charte §5), même dans une ligne d'état en 12 px */
.cc-reessayer{display:inline-flex;align-items:center;vertical-align:middle;min-height:var(--cible);padding:0 var(--e-3);
  margin-left:var(--e-1);border:1px solid var(--trait-2);border-radius:var(--r-2);
  background:var(--surface);color:var(--encre);font:500 14px var(--sans);cursor:pointer}
.cc-reessayer:active{background:var(--brume)}
.cc-roue{display:inline-block;width:12px;height:12px;margin-right:6px;vertical-align:-1px;border:2px solid var(--trait-2);
  border-top-color:var(--action);border-radius:50%;animation:cc-tourne .8s linear infinite}
@keyframes cc-tourne{to{transform:rotate(360deg)}}
@keyframes cc-apparait{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
@keyframes cc-monte{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
/* sous 760 px : une feuille basse, sous le pouce (charte §5) */
@media(max-width:759px){
  .cc-panneau{position:fixed;left:0;right:0;bottom:0;top:auto;width:auto;max-height:min(72svh,640px);z-index:1170;
    border-radius:var(--r-2) var(--r-2) 0 0;border-bottom:0;padding-bottom:env(safe-area-inset-bottom,0px);
    animation-name:cc-monte}
  .cc-pan-tete{min-height:var(--cible-carte)}
  .cc-case{font-size:16px}
  /* carte dans la page : la feuille s'arrête à mi-hauteur, la carte (remontée
     en haut de l'écran à l'ouverture, cadastre-carte.js) reste visible au-dessus
     et l'on voit l'effet d'un calque qu'on coche ; 72svh en plein écran */
  html:not(.cad-plein) .cc-panneau{max-height:min(50svh,640px)}
}

/* ── Les fonds de carte, en bas à gauche ──────────────────────────────── */
.cc-fonds{position:absolute;left:var(--e-3);bottom:var(--e-3);z-index:840;display:flex;gap:var(--e-1);padding:var(--e-1);
  background:var(--surface);border:1px solid var(--trait-2);border-radius:var(--r-2);box-shadow:var(--ombre-flottant)}
.cc-fonds:empty{display:none}
.cc-fond{display:flex;flex-direction:column;align-items:stretch;gap:2px;width:76px;padding:0 0 2px;border:2px solid transparent;
  border-radius:var(--r-2);background:none;color:var(--encre-2);font:500 12px/1.2 var(--sans);cursor:pointer;text-align:center}
.cc-fond[aria-checked="true"]{border-color:var(--action);color:var(--encre);font-weight:700}
@media(hover:hover){.cc-fond[aria-checked="false"]:hover{background:var(--brume)}}
.cc-vig{display:block;height:40px;border-radius:var(--r-1);background-color:var(--brume);background-size:170px 170px;
  background-position:center;background-repeat:no-repeat}
.cc-vig[data-vig="gris"]{filter:grayscale(1)}
:root[data-theme="dark"] .cc-vig{filter:brightness(.78) saturate(.85)}
:root[data-theme="dark"] .cc-vig[data-vig="gris"]{filter:grayscale(1) brightness(.78)}
@media(prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .cc-vig{filter:brightness(.78) saturate(.85)}
  :root:not([data-theme="light"]) .cc-vig[data-vig="gris"]{filter:grayscale(1) brightness(.78)}
}
.cc-fond-lib{padding:0 2px;white-space:nowrap}
/* sous 760 px : des vignettes de 48 px de côté, bordure comprise (--cible-carte) */
@media(max-width:759px){
  .cc-fond{width:var(--cible-carte);padding:0}
  .cc-vig{height:calc(var(--cible-carte) - 4px)}
  .cc-fond-lib{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
}
/* le Plan gris : le filtre sur le seul conteneur du Plan IGN, le voile sombre
   de carte.css (sur .leaflet-tile-pane) se cumule par-dessus */
#carte.cc-nb .cc-fond-plan{filter:grayscale(1)}

/* ── La légende des calques, en bas à droite (au-dessus de l'attribution) ── */
/* Sa hauteur s'arrête sous la pile de boutons (--cc-pile-bas, mesuré) : on ne
   couvre jamais « Agrandir » ni « Calques » ; le corps défile à l'intérieur. */
.cc-legende{position:absolute;right:var(--e-3);bottom:34px;z-index:845;width:min(290px,calc(100% - 2*var(--e-3)));
  max-height:calc(100% - 34px - var(--cc-bas,0px) - var(--cc-pile-bas,168px));display:flex;flex-direction:column;
  background:var(--surface);color:var(--encre);border:1px solid var(--trait-2);border-radius:var(--r-2);
  box-shadow:var(--ombre-flottant);overflow:hidden}
.cc-legende[hidden]{display:none}
.cc-legende.cc-replie{width:auto}
.cc-leg-bascule{display:flex;align-items:center;gap:var(--e-2);width:100%;min-height:var(--cible);padding:0 var(--e-3);border:0;
  background:none;color:var(--encre);font:700 14px var(--sans);cursor:pointer;text-align:left}
.cc-leg-bascule svg{flex:none;transition:transform var(--duree)}
.cc-leg-bascule[aria-expanded="false"] svg{transform:rotate(-90deg)}
.cc-leg-n{margin-left:auto;padding-left:var(--e-2);font-weight:500;font-size:12px;color:var(--encre-3);white-space:nowrap}
.cc-leg-bascule{flex:none}
.cc-leg-corps{flex:1 1 auto;min-height:0;max-height:min(44vh,320px);overflow:auto;padding:0 var(--e-3) var(--e-2);
  border-top:1px solid var(--trait);overscroll-behavior:contain}
.cc-leg-corps[hidden]{display:none}
.cc-leg-entree{padding:var(--e-2) 0;border-bottom:1px solid var(--trait)}
.cc-leg-entree:last-child{border-bottom:0}
.cc-leg-entree h4{margin:0 0 var(--e-1);font-size:14px;font-weight:700;line-height:1.3}
.cc-leg-etat{margin:0 0 var(--e-1);font-size:12px;color:var(--encre-2)}
.cc-leg-img{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:var(--e-1);border-radius:var(--r-1);
  background:var(--cc-fond-leg)}
.cc-leg-img img{display:block;max-width:100%;height:auto}
.cc-leg-src{margin:var(--e-1) 0 0;font-size:12px;color:var(--encre-3)}
.cc-leg-etat .cc-reessayer{display:flex;align-items:center;margin:var(--e-1) 0 0}
/* sous 760 px, la légende dépliée (290 px de large) couvrait « Plan gris » et
   « Vue aérienne » : elle se tient AU-DESSUS des fonds (--cc-fonds-h, leur
   hauteur mesurée par cadastre-carte.js), son corps défile. Repliée aussi :
   à côté des fonds il ne restait que 3 px, « 12 calques » les aurait mordus. */
@media(max-width:759px){
  .cc-leg-bascule{min-height:var(--cible-carte)}
  .cc-legende{bottom:calc(var(--e-3) + var(--cc-fonds-h,58px) + var(--e-2));
    max-height:calc(100% - var(--e-3) - var(--cc-fonds-h,58px) - var(--e-2) - var(--cc-bas,0px) - var(--cc-pile-bas,168px))}
}
/* Un panneau ouvert (html.cc-pan-ouvert, posé par cadastre-carte.js) : un seul
   menu flottant lisible à la fois, comme ProCadastre. Sur ordinateur la
   légende passait sous le panneau (z 845 contre 910) et des bribes coupées
   dépassaient : elle s'efface et revient à la fermeture. La ligne d'état se
   centre dans la place laissée à gauche du panneau (--cc-pan-g, mesuré), à
   droite du zoom, au lieu d'être coupée par lui ; sur une carte trop étroite
   (html.cc-etat-sous-pan) elle se range entière sous le panneau, rien ne dépasse. */
@media(min-width:760px){
  html.cc-pan-ouvert .cc-legende{display:none}
  html.cc-pan-ouvert .etat{left:calc(var(--cible) + 2*var(--e-3));right:var(--cc-pan-g,420px)}
  html.cc-pan-ouvert.cc-etat-sous-pan .etat{left:auto;right:var(--cc-pan-d,0px);max-width:var(--cc-pan-w,340px)}
}

/* ── Les numéros de parcelles (zoom 18 et plus), non interactifs ─────── */
.cc-num{width:0;height:0;margin:0;background:none;border:0}
.cc-num>span{position:absolute;left:0;top:0;transform:translate(-50%,-50%);white-space:nowrap;
  font:500 12px/1 var(--sans);letter-spacing:0;color:var(--encre);pointer-events:none;
  text-shadow:0 0 2px var(--surface),0 0 2px var(--surface),0 0 4px var(--surface)}
.cc-num .cc-num-sec{display:none;margin-right:3px;color:var(--encre-2)}
.cc-num.cc-survol .cc-num-sec{display:inline}
.cc-num.cc-survol>span{font-weight:700}

/* ── Les cibles au doigt des marqueurs de recherche ────────────────────
   Les marqueurs (.cr-mk, cadastre-recherches.css) gardent leur petite taille
   à l'œil ; au doigt, leur ::before agrandit la cible. À −10 px, un marqueur
   Entreprise de 16 px n'offrait que 36 px, un Permis ou une Vente de 20 px
   40 px : à −14 px, 44 px au moins (charte §5), 48 pour ceux de 20 px —
   la mesure des cibles de la carte. #carte : passe devant la règle d'origine,
   chargée après cette feuille. */
@media(pointer:coarse){#carte .cr-mk>span::before{inset:-14px}}

/* ══ LE PLEIN ÉCRAN : html.cad-plein ═══════════════════════════════════════
   La colonne carte passe en position fixe (z 1150 : au-dessus de l'en-tête et
   des onglets à 1100, sous .sugg 1200 et .ah-feuille 1210). Recherche et outils
   flottent par CSS, sans déplacement dans le DOM. La carte se tient dans la
   zone de sécurité iOS ; le défilement de la page est bloqué par CETTE classe,
   pas par body.ah-figee (qu'AH.feuille retire en se fermant). */
html.cad-plein,html.cad-plein body{overflow:hidden;overscroll-behavior:none}
html.cad-plein .col-carte{position:fixed;inset:0;z-index:1150;margin:0;background:var(--papier)}
html.cad-plein .enveloppe-carte{position:absolute;top:env(safe-area-inset-top,0px);right:env(safe-area-inset-right,0px);
  bottom:env(safe-area-inset-bottom,0px);left:env(safe-area-inset-left,0px)}
html.cad-plein #carte{height:100%;border:0;border-radius:0}
/* la recherche, en haut à gauche */
html.cad-plein .chercher{position:fixed;z-index:1160;margin:0;max-width:none;
  top:calc(env(safe-area-inset-top,0px) + var(--e-3));left:calc(env(safe-area-inset-left,0px) + var(--e-3));
  right:calc(env(safe-area-inset-right,0px) + var(--e-3))}
html.cad-plein .chercher input,html.cad-plein .chercher button[type="submit"]{box-shadow:var(--ombre-flottant)}
/* la barre d'outils, une rangée flottante sous la recherche, qui défile en travers si elle est trop longue */
html.cad-plein .col-carte>.outils{position:absolute;z-index:860;margin:0;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;
  top:calc(env(safe-area-inset-top,0px) + var(--e-3) + var(--cible) + var(--e-2));left:calc(env(safe-area-inset-left,0px) + var(--e-3));
  width:max-content;max-width:calc(100% - 2*var(--e-3) - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px));
  gap:var(--e-1);padding:var(--e-1);background:var(--surface);border:1px solid var(--trait-2);border-radius:var(--r-2);
  box-shadow:var(--ombre-flottant)}
html.cad-plein .col-carte>.outils::-webkit-scrollbar{display:none}
html.cad-plein .col-carte>.outils .outil{flex:none;white-space:nowrap}
html.cad-plein #outilsMotif{position:absolute;z-index:860;margin:0;padding:var(--e-1) var(--e-2);font-size:12px;
  top:calc(env(safe-area-inset-top,0px) + var(--e-3) + 2*var(--cible) + 3*var(--e-2) + 2px);
  left:calc(env(safe-area-inset-left,0px) + var(--e-3));max-width:calc(100% - 2*var(--e-3));
  background:var(--surface);color:var(--encre-2);border:1px solid var(--trait-2);border-radius:var(--r-1)}
/* sur ordinateur, recherche et outils laissent la place de la pile, à droite */
@media(min-width:900px){
  html.cad-plein .chercher{right:auto;width:min(560px,calc(100% - 3*var(--e-3) - var(--cc-pile-l,140px)))}
  html.cad-plein .col-carte>.outils{max-width:calc(100% - 3*var(--e-3) - var(--cc-pile-l,140px) - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px))}
}
/* sur téléphone et tablette, la pile descend sous les outils */
@media(max-width:899px){html.cad-plein .cc-pile{top:var(--cc-haut,128px)}}
/* le panneau flottant prend toute la hauteur sous les barres flottantes (la
   recherche, z 1160, le couvrirait sinon) et s'arrête AU-DESSUS de la barre de
   sélection (--cc-bas, 0 quand elle est masquée), comme la fenêtre Détails :
   sinon « Rechercher dans la zone visible » et la ligne de statut passent
   dessous ; la feuille basse reste en bas */
@media(min-width:760px){
  html.cad-plein .cc-panneau{top:var(--cc-haut,128px);max-height:calc(100% - var(--cc-haut,128px) - var(--cc-bas,0px) - var(--e-3))}
}
/* les commandes Leaflet et la ligne d'état passent sous les barres flottantes */
html.cad-plein .leaflet-top{top:var(--cc-haut,128px)}
html.cad-plein .leaflet-bottom{bottom:var(--cc-bas,0px)}
html.cad-plein .etat{top:var(--cc-haut,128px);max-width:calc(100% - 2*(var(--cible) + 2*var(--e-3)))}
@media(max-width:759px){html.cad-plein .etat{max-width:calc(100% - 2*(var(--cible-carte) + 2*var(--e-3)))}}
html.cad-plein .mesure-info{bottom:calc(28px + var(--cc-bas,0px))}
html.cad-plein .cc-fonds{bottom:calc(var(--e-3) + var(--cc-bas,0px))}
html.cad-plein .cc-legende{bottom:calc(34px + var(--cc-bas,0px))}
@media(max-width:759px){
  html.cad-plein .cc-legende{bottom:calc(var(--e-3) + var(--cc-fonds-h,58px) + var(--e-2) + var(--cc-bas,0px))}
}
html.cad-plein .cc-leg-corps{max-height:min(56vh,520px)}
/* la barre de sélection, visible aussi sur ordinateur en plein écran */
html.cad-plein .sel-barre{position:fixed;z-index:1160;display:flex;align-items:center;gap:10px;min-height:var(--cible);
  left:calc(env(safe-area-inset-left,0px) + var(--e-3));right:calc(env(safe-area-inset-right,0px) + var(--e-3));
  bottom:calc(env(safe-area-inset-bottom,0px) + var(--e-3));max-width:640px;margin:0 auto;padding:6px 6px 6px 12px;
  background:var(--encre);color:var(--papier);border-radius:var(--r-2);box-shadow:var(--ombre-flottant)}
html.cad-plein .sel-barre[hidden]{display:none}
html.cad-plein .sel-barre span{flex:1;min-width:0;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html.cad-plein .sel-barre button{flex:none;min-height:var(--cible);padding:0 12px;border:0;border-radius:var(--r-2);
  background:var(--papier);color:var(--encre);font-size:14px;font-weight:700;cursor:pointer}
/* une feuille basse de calques ouverte : la barre de sélection passe dessous */
html.cad-plein.cc-pan-feuille .sel-barre{z-index:1140}

@media print{.cc-pile,.cc-panneau,.cc-fonds,.cc-legende{display:none!important}}
@media(prefers-reduced-motion:reduce){.cc-panneau{animation:none}.cc-roue{animation:none}}