/* hub.css — réglages globaux hub HNO (12/7/2026) */
main {
  max-width: none; /* débridé 13/7 (Michel) : outil desktop pleine largeur */
  margin-inline: auto;
  padding: 1.4rem 1.8rem 3rem;
  box-sizing: border-box;
}
main table { margin-bottom: 2rem; }

/* accents Camino (pages perso) */
.frame-hub-accent-header header h2,
.hub-accent {
  color: #a75125;
  font-weight: 700;
}

/* ============================================================
   Tables P•C synchronisées — .pc-table (HTML maîtrisé, pleine largeur + responsive)
   Michel 13/7 : pleine largeur écran, colonnes qui s'effacent progressivement.
   ============================================================ */
.pc-table {
  border-collapse: collapse;
  width: 100%;              /* PLEINE LARGEUR de la zone contenu */
  table-layout: auto;
  font-size: 0.92em;
}

/* FULL-BLEED : la table sort du conteneur centré (--content-max-width 1244px du
   thème) pour occuper la pleine largeur écran. Michel 13/7. Prose/login intacts.
   96vw = ~2vw de respiration de chaque côté (évite la barre de défilement). */
main .pc-table {
  width: 96vw;
  max-width: 96vw;
  position: relative;
  left: 50%;
  margin-left: -48vw;
  margin-right: -48vw;
}
.pc-table th, .pc-table td {
  border: 1px solid #d8e2da; padding: 7px 10px; text-align: left; vertical-align: top;
}
.pc-table thead th {
  background: #276749; color: #fff; font-weight: 700;
  position: sticky; top: 0; z-index: 1;
}
.pc-table tbody tr:nth-child(even) { background: #f3f7f4; }   /* zébrage */
.pc-table tbody tr:hover { background: #e4efe8; }              /* survol */
.pc-table td.c-commune { font-weight: 600; }
/* 13/8 (Michel) : Fonction -30px, Email +30px — les mails cassent moins, lignes resserrées */
/* hub-23 (Michel 20/8/2026) : Fonction et Mission élargies, Site web très réduit. */
.pc-table td.c-situation { min-width: 260px; }
.pc-table th.c-site, .pc-table td.c-site { max-width: 40em; min-width: 0; } /* +50% bis (Michel 20/8) */
.pc-table td.c-site a { word-break: break-all; overflow-wrap: anywhere; font-size: 0.9em; }
.pc-table th.c-email, .pc-table td.c-email { min-width: 210px; }
/* Organisation élargie (Michel 11/8/2026) : les noms longs (« ANGVC — Association nationale
   des gens du voyage citoyens », « Groupe d'études Gens du voyage — AN ») se repliaient sur
   4-5 lignes et écrasaient la colonne. */
.pc-table th.c-habitat, .pc-table td.c-habitat { min-width: 170px; max-width: 22em; }
.pc-table td.c-issue { font-weight: 600; }
.pc-table td.c-email a, .pc-table td.c-tel a { color: #1e5b3a; text-decoration: none; }
.pc-table td.c-email a:hover, .pc-table td.c-tel a:hover { text-decoration: underline; }
.pc-table th.c-tel, .pc-table td.c-tel { white-space: nowrap; }   /* 12/8/2026 (Michel) : un numéro ne se coupe jamais en deux lignes */
.pc-table td.c-date, .pc-table th.c-date { white-space: nowrap; }
.pc-table td.c-date { color: #55625b; }   /* la couleur grise ne s'applique qu'aux cellules — sur l'en-tête vert elle rendait le libellé illisible (bug vu 16-17/7) */
.pc-table th.c-cp, .pc-table td.c-cp { white-space: nowrap; }

/* --- Responsive : on efface les colonnes les moins critiques quand ça rétrécit --- */
@media (max-width: 1250px) {           /* Préf. = déductible (email/tél visibles) */
  .pc-table .c-pref { display: none; }
}
@media (max-width: 1100px) {           /* + CP et date */
  .pc-table .c-cp, .pc-table .c-date { display: none; }
}
@media (max-width: 950px) {            /* + Issue/Nom/Prénom (souvent vides au début) */
  .pc-table .c-issue, .pc-table .c-nom, .pc-table .c-prenom { display: none; }
}
@media (max-width: 760px) {            /* dernier recours : la table défile, page intacte */
  main .pc-table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .pc-table .c-issue, .pc-table .c-nom, .pc-table .c-prenom,
  .pc-table .c-cp, .pc-table .c-date, .pc-table .c-pref { display: table-cell; } /* re-montre : on scrolle */
}

/* TRIANGLE de dépliage — 1re colonne à gauche, <details> NATIF, ZÉRO JavaScript et
   AUCUN libellé (Michel 11/8/2026). Tout vit dans la cellule : aucun tri ne peut
   désolidariser un texte de sa personne. */
.pc-table th.c-fiche, .pc-table td.c-fiche { width: 2.2em; padding-left: 6px; padding-right: 0; }
.pc-table td.c-fiche summary {
  cursor: pointer; color: #276749; font-size: 1.35em; line-height: 1;
  padding: 0; margin: 0; user-select: none; list-style-position: inside;
}
.pc-table td.c-fiche summary::marker { color: #276749; }
.pc-table td.c-fiche details[open] { position: relative; }
.pc-table td.c-fiche details[open] > div {
  position: absolute; z-index: 5; left: 0; top: 100%; width: 92vw; max-width: none;
  background: #f4f9f6; border: 1px solid #276749; border-left-width: 4px; border-radius: 0 6px 6px 6px;
  padding: 14px 18px; line-height: 1.5; text-align: left; box-shadow: 0 6px 18px rgba(0,0,0,0.12);
  font-size: inherit; white-space: normal;
}
/* le thème du hub bride les <p> : on les neutralise ici aussi */
.pc-table td.c-fiche details[open] > div p,
.pc-table td.c-fiche details[open] > div li {
  max-width: none !important; width: auto !important; font-size: inherit !important;
  line-height: inherit !important; font-family: inherit !important; margin: 0 0 6px !important;
}
@media (max-width: 900px) { .pc-table td.c-fiche details[open] > div { width: 90vw; } }

/* CHRONOLOGIE en triangle (Michel 13/8/2026) — même mécanique <details> que la
   description, mais SA colonne, juste AVANT Fonction, en-tête « Or » (= Originalité, défini au chapeau) ; panneau
   limité à 80% de large (Michel 13/8). La colonne texte pleine largeur écrasait
   l'écran INTER (cas Durand). */
.pc-table th.c-chrono, .pc-table td.c-chrono { width: 2.4em; padding-left: 6px; padding-right: 0; }
.pc-table td.c-chrono summary {
  cursor: pointer; color: #276749; font-size: 1.35em; line-height: 1;
  padding: 0; margin: 0; user-select: none; list-style-position: inside;
}
.pc-table td.c-chrono summary::marker { color: #276749; }
.pc-table td.c-chrono details[open] { position: relative; }
.pc-table td.c-chrono details[open] > div {
  position: absolute; z-index: 5; left: 0; top: 100%; width: 80vw; max-width: none;
  background: #f4f9f6; border: 1px solid #c9a227; border-left-width: 4px; border-radius: 0 6px 6px 6px;
  padding: 14px 18px; line-height: 1.6; text-align: left; box-shadow: 0 6px 18px rgba(0,0,0,0.12);
  font-size: inherit; white-space: normal;
}
.pc-table td.c-chrono details[open] > div p,
.pc-table td.c-chrono details[open] > div li {
  max-width: none !important; width: auto !important; font-size: inherit !important;
  line-height: inherit !important; font-family: inherit !important; margin: 0 0 6px !important;
}
@media (max-width: 900px) { .pc-table td.c-chrono details[open] > div { width: 90vw; } }

/* etoile Or : glyphe texte colorable, l'emoji jaune se noyait (Michel 14/8/2026) */
.pc-table details .star { color: #b8860b; }

/* Menu : INTER-EVENTS-PUBLIC en tete, puis ecart avant le bloc PC-HNO (Michel 14/8/2026) */
ul.header__nav-list li.header__nav-list-item:has(> a[href="/coordination-france"]) { margin-left: 4em !important; } /* ecart avant Liste P.C — cible par lien, insensible au nombre d items */

/* colonne Reseau (liaisons) : etroite, retour a la ligne autorise (Michel 14/8/2026) */
.pc-table th.c-reseau { white-space: nowrap; }
.pc-table td.c-reseau { max-width: 15em; min-width: 11.5em; white-space: normal; word-break: keep-all; overflow-wrap: normal; font-size: 0.92em; }

/* logo Camino masque : place au menu (Michel 14/8/2026) */
.header__logo { display: none !important; }

/* inversions du theme sur PC Liste (constat Michel 14/8/2026) : le theme CACHE le trait au
   survol des items a sous-menu, et l allume sur tout le chemin actif. On retablit le
   comportement attendu : survol = trait visible ; trait permanent = seulement sur SA page. */
ul.header__nav-list .header__nav-item--has-subnav:hover::before { display: block !important; }
ul.header__nav-list:has(.header__nav-item--active:not(.header__nav-item--has-subnav))
  .header__nav-item--has-subnav.header__nav-item--active:not(:hover)::before { display: none !important; }

/* chevron PC Liste v2 (14/8/2026) : seule l icone svg est masquee — le trait (::before),
   le survol et la classe has-subnav ne sont PAS touches (lecon de la 1ere tentative). */
ul.header__nav-list a[href="/coordination-france"] svg { display: none !important; }
