/* Panneau de fiche : conseil d'un territoire et fiche détaillée d'un élu.
   Volet latéral en verre sur bureau, feuille montante sur mobile. */
.panneau{position:absolute;z-index:55;top:calc(var(--hauteur-entete) + var(--espace-4));right:var(--espace-4);bottom:var(--espace-4);width:var(--largeur-panneau);max-width:calc(100% - var(--espace-8));display:flex;flex-direction:column;border-radius:var(--rayon-l);overflow:hidden;transform:translateX(calc(100% + var(--espace-8)));transition:transform var(--duree-normale) var(--courbe);visibility:hidden}
.panneau.ouvert{transform:none;visibility:visible}
.panneau .poignee{display:none}
.panneau-tete{position:relative;padding:var(--espace-5) var(--espace-12) var(--espace-4) var(--espace-5);border-bottom:var(--bordure-fine) solid var(--couleur-bordure)}
.panneau-tete .surtitre{font-size:var(--taille-11);color:var(--couleur-texte-3);text-transform:uppercase;letter-spacing:.06em;line-height:var(--interligne-serre);margin-bottom:var(--espace-1)}
.panneau-tete h2{font-family:var(--police-titre);font-size:var(--taille-20);font-weight:var(--graisse-demi);line-height:var(--interligne-serre);letter-spacing:-.005em}
.panneau-tete h2:focus{outline:none}
.panneau-tete .fermer{position:absolute;top:var(--espace-2);right:var(--espace-2);width:var(--cible-tactile);height:var(--cible-tactile);display:grid;place-items:center;border-radius:var(--rayon-plein);color:var(--couleur-texte-2)}
.panneau-tete .fermer:hover{background:var(--couleur-surface-2);color:var(--couleur-texte)}
.panneau-tete .fermer svg,.retour svg{width:var(--taille-icone-controle);height:var(--taille-icone-controle)}
.retour{display:inline-flex;align-items:center;gap:var(--espace-1);min-height:var(--cible-tactile);margin:calc(var(--espace-3) * -1) 0 var(--espace-1) calc(var(--espace-2) * -1);padding:0 var(--espace-2);border-radius:var(--rayon-s);font-size:var(--taille-13);font-weight:var(--graisse-moyen);color:var(--couleur-accent)}
.retour:hover{background:var(--couleur-accent-doux)}
.retour[hidden]{display:none}
.panneau-corps{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:var(--espace-5)}

/* En-tête de l'élu */
.elu-entete{display:flex;gap:var(--espace-4);align-items:center}
.photo{flex:none;width:var(--taille-photo);height:var(--taille-photo);border-radius:var(--rayon-plein);display:grid;place-items:center;overflow:hidden;background:var(--couleur-surface-2);color:var(--couleur-texte-2);font-family:var(--police-titre);font-size:var(--taille-24);font-weight:var(--graisse-demi);box-shadow:0 0 0 var(--bordure-focus) var(--couleur-parti,var(--couleur-bordure))}
.photo img{width:100%;height:100%;object-fit:cover;display:block}
.photo.petite{width:var(--taille-photo-petite);height:var(--taille-photo-petite);font-size:var(--taille-14);box-shadow:0 0 0 var(--bordure-epaisse) var(--couleur-parti,var(--couleur-bordure))}
.elu-nom{font-family:var(--police-titre);font-size:var(--taille-24);font-weight:var(--graisse-demi);line-height:var(--interligne-serre)}
.elu-parti{display:flex;align-items:center;gap:var(--espace-2);margin-top:var(--espace-1);font-size:var(--taille-13);font-weight:var(--graisse-moyen)}
.elu-parti .pastille{width:var(--taille-pastille-infobulle);height:var(--taille-pastille-infobulle);border-radius:var(--rayon-pastille-petite)}
.elu-fonction{margin-top:var(--espace-1);font-size:var(--taille-13);color:var(--couleur-texte-2);line-height:var(--interligne-serre)}

/* Actions rapides */
.actions-rapides{display:flex;flex-wrap:wrap;gap:var(--espace-2);margin:var(--espace-5) 0 var(--espace-2)}
.bouton{display:inline-flex;align-items:center;justify-content:center;gap:var(--espace-2);min-height:var(--cible-tactile);padding:0 var(--espace-4);border-radius:var(--rayon-plein);font-size:var(--taille-13);font-weight:var(--graisse-demi);text-decoration:none;border:var(--bordure-fine) solid var(--couleur-bordure-forte);color:var(--couleur-texte);background:var(--couleur-surface)}
.bouton:hover{border-color:var(--couleur-texte-3);color:var(--couleur-texte)}
.bouton.principal{background:var(--couleur-accent);border-color:var(--couleur-accent);color:var(--couleur-sur-accent)}
.bouton.principal:hover{background:var(--couleur-accent-survol);color:var(--couleur-sur-accent)}
.bouton svg{width:var(--taille-icone);height:var(--taille-icone)}

/* Sections dépliables */
.section{border-top:var(--bordure-fine) solid var(--couleur-bordure)}
.section:first-of-type{margin-top:var(--espace-4)}
.section summary{list-style:none;display:flex;align-items:center;justify-content:space-between;min-height:var(--cible-tactile);cursor:pointer;font-size:var(--taille-12);font-weight:var(--graisse-demi);letter-spacing:.06em;text-transform:uppercase;color:var(--couleur-texte-2)}
.section summary::-webkit-details-marker{display:none}
.section summary::after{content:"";width:var(--taille-chevron);height:var(--taille-chevron);border-right:var(--bordure-epaisse) solid currentColor;border-bottom:var(--bordure-epaisse) solid currentColor;transform:rotate(45deg) translateY(calc(var(--marge-etiquette) * -1));transition:transform var(--duree-rapide)}
.section[open] summary::after{transform:rotate(-135deg) translateY(calc(var(--marge-etiquette) * -1))}
.section summary:hover{color:var(--couleur-texte)}
.section .contenu{padding-bottom:var(--espace-4);font-size:var(--taille-14);line-height:var(--interligne-aere)}
.section .contenu p+p{margin-top:var(--espace-2)}
.section ul{list-style:none;display:grid;gap:var(--espace-2)}
.section li .detail{display:block;font-size:var(--taille-12);color:var(--couleur-texte-3);line-height:var(--interligne-normal)}
.section .vide{color:var(--couleur-texte-3);font-size:var(--taille-13)}
.coordonnees{display:grid;grid-template-columns:auto 1fr;gap:var(--espace-2) var(--espace-4)}
.coordonnees dt{font-size:var(--taille-12);color:var(--couleur-texte-3);padding-top:var(--marge-etiquette)}
.coordonnees dd{white-space:pre-line;overflow-wrap:anywhere}
.liens{display:flex;flex-wrap:wrap;gap:var(--espace-2)}
.liens a{display:inline-flex;align-items:center;min-height:var(--hauteur-puce);padding:0 var(--espace-3);border-radius:var(--rayon-plein);background:var(--couleur-surface-2);font-size:var(--taille-13);text-decoration:none;color:var(--couleur-texte)}
.liens a:hover{background:var(--couleur-accent-doux);color:var(--couleur-accent)}
.etiquettes{display:flex;flex-wrap:wrap;gap:var(--espace-2)}
.etiquette{display:inline-flex;align-items:center;gap:var(--espace-1);padding:var(--marge-etiquette) var(--espace-2);border-radius:var(--rayon-plein);background:var(--couleur-accent-doux);color:var(--couleur-accent);font-size:var(--taille-12);font-weight:var(--graisse-moyen)}
.etiquette .n{color:var(--couleur-texte-3);font-weight:var(--graisse-normal)}
.sous-titre{font-size:var(--taille-12);color:var(--couleur-texte-3);margin:var(--espace-3) 0 var(--espace-2)}
.pied-fiche{margin-top:var(--espace-5);font-size:var(--taille-12);color:var(--couleur-texte-3)}
.statut{display:inline-block;padding:var(--marge-etiquette) var(--espace-2);border-radius:var(--rayon-plein);font-weight:var(--graisse-moyen)}
.statut.complete{background:var(--couleur-succes-doux);color:var(--couleur-succes)}
.statut.a-completer{background:var(--couleur-avertissement-doux);color:var(--couleur-avertissement)}

/* Conseil : l'élu principal en vedette, puis la liste des autres élus */
.vedette{width:100%;text-align:left;display:flex;gap:var(--espace-4);align-items:center;padding:var(--espace-4);border-radius:var(--rayon-m);background:var(--couleur-surface);border:var(--bordure-fine) solid var(--couleur-bordure);transition:border-color var(--duree-rapide),box-shadow var(--duree-rapide)}
.vedette:hover{border-color:var(--couleur-bordure-forte);box-shadow:var(--ombre-1)}
.vedette .elu-nom{font-size:var(--taille-20)}
.liste-elus{list-style:none;margin-top:var(--espace-2)}
.liste-elus li+li{border-top:var(--bordure-fine) solid var(--couleur-bordure)}
.ligne-elu{width:100%;text-align:left;display:flex;gap:var(--espace-3);align-items:center;min-height:calc(var(--taille-photo-petite) + var(--espace-4));padding:var(--espace-2) var(--espace-2);border-radius:var(--rayon-s)}
.ligne-elu:hover{background:var(--couleur-surface-2)}
.ligne-elu .qui{flex:1;min-width:0}
.ligne-elu .nom{font-weight:var(--graisse-demi);font-size:var(--taille-14);line-height:var(--interligne-serre)}
.ligne-elu .role{font-size:var(--taille-12);color:var(--couleur-texte-2);line-height:var(--interligne-normal);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ligne-elu .sigle{flex:none;font-size:var(--taille-11);font-weight:var(--graisse-demi);color:var(--couleur-texte-2);display:inline-flex;align-items:center;gap:var(--espace-1)}
.ligne-elu .sigle .pastille{width:var(--taille-pastille-infobulle);height:var(--taille-pastille-infobulle);border-radius:var(--rayon-pastille-petite)}
.titre-liste{font-size:var(--taille-12);font-weight:var(--graisse-demi);letter-spacing:.06em;text-transform:uppercase;color:var(--couleur-texte-2);margin:var(--espace-6) 0 var(--espace-1)}
.message-vide{padding:var(--espace-6) 0;text-align:center;color:var(--couleur-texte-2)}
.message-vide strong{display:block;font-family:var(--police-titre);font-size:var(--taille-18);color:var(--couleur-texte);margin-bottom:var(--espace-1)}

/* Contrôles décalés quand le volet est ouvert (bureau) */
@media (min-width:640px){
  .ecran.panneau-ouvert .zoom{right:calc(var(--largeur-panneau) + var(--espace-8))}
  .ecran.panneau-ouvert .mention-longue{display:none}
  .ecran.panneau-ouvert .mention{right:calc(var(--largeur-panneau) + var(--espace-8) + var(--cible-tactile) + var(--espace-3))}
}

/* ---------- Mobile : feuille montante ---------- */
@media (max-width:639px){
  .panneau{top:auto;left:0;right:0;bottom:0;width:auto;max-width:none;max-height:var(--feuille-hauteur-max);border-radius:var(--rayon-xl) var(--rayon-xl) 0 0;transform:translateY(100%);padding-bottom:env(safe-area-inset-bottom);touch-action:pan-y}
  .panneau .poignee{display:block;flex:none;width:var(--largeur-poignee);height:var(--hauteur-poignee);border-radius:var(--rayon-plein);background:var(--couleur-bordure-forte);margin:var(--espace-2) auto 0}
  .panneau-tete{padding-top:var(--espace-3)}
  .ecran.panneau-ouvert .pouce,.ecran.panneau-ouvert .zoom{opacity:0;pointer-events:none}
}

/* Logos, fiches de partis et de MRC, liens internes */
.entete-organisme{display:flex;gap:var(--espace-4);align-items:center;margin-bottom:var(--espace-4)}
.entete-organisme:empty{display:none}
.logo-fiche{flex:none;display:grid;place-items:center;width:var(--console-taille-apercu-photo);height:var(--console-taille-apercu-logo);padding:var(--espace-2);border-radius:var(--rayon-m);background:var(--couleur-surface-2)}
.logo-fiche img{max-width:100%;max-height:100%;object-fit:contain;display:block}
.elu-parti.lien-parti{border-radius:var(--rayon-s);padding:var(--marge-etiquette) var(--espace-1);margin-left:calc(var(--espace-1) * -1);min-height:var(--hauteur-puce);text-decoration:underline;text-decoration-color:var(--couleur-bordure-forte);text-underline-offset:3px}
.elu-parti.lien-parti:hover{background:var(--couleur-surface-2);text-decoration-color:currentColor}
.etiquette.lien-etiquette{border:0;cursor:pointer;min-height:var(--hauteur-puce);font:inherit;font-size:var(--taille-12);font-weight:var(--graisse-moyen)}
.etiquette.lien-etiquette:hover{background:var(--couleur-accent);color:var(--couleur-sur-accent)}
.etiquette.lien-etiquette:hover .n{color:inherit}
.detail-source{margin-top:var(--espace-2);font-size:var(--taille-12);color:var(--couleur-texte-3)}
.bouton.portrait{border-color:var(--couleur-accent);color:var(--couleur-accent)}
.bouton.portrait:hover{background:var(--couleur-accent-doux)}
.bouton[hidden]{display:none}
.legende li button{display:flex;align-items:center;gap:var(--espace-3);width:100%;min-height:var(--espace-6);text-align:left;border-radius:var(--rayon-s);padding:0 var(--espace-1);margin:0 calc(var(--espace-1) * -1)}
.legende li button:hover{background:var(--couleur-surface-2)}
.legende li button .n{margin-left:auto}
