/* =============================================================================
   organisation-v7 : specifique des fiches inscrites (association, entreprise,
   collectivite).

   Reference : handoff 7a, maquette 2-fiches-inscrites, turn 1 (1a / 1b / 1c).

   Depend de base-v7.css (primitives) et de fiche-v7.css (blocs de fiche). Ne
   contient que ce qu'aucune des deux couches ne porte deja.

   L'accent suit le type d'organisation : il est pose par data-orga sur la
   racine .v7, et base-v7.css en derive --accent-clair, --accent-fonce et
   --accent-titre. Rien a redeclarer ici, d'ou une seule feuille pour les trois
   types.
   ============================================================================= */

/* --- Gabarit trois colonnes ---------------------------------------------------
   Reperes a gauche (contact, localisation, identifiants), contenu au centre,
   liens a droite (annonces, partenariats, reseaux).

   base-v7.css fait deja de .v7 une grille dont main et aside occupent une
   colonne, et dont tout autre enfant direct traverse la grille : le fil
   d'Ariane et la carte d'identite passent donc pleine largeur sans regle
   supplementaire. Il suffit d'ouvrir une troisieme colonne. */

.v7.fiche-inscrite {
    grid-template-columns: 310px minmax(0, 1fr) 350px;
    column-gap: 18px;
    row-gap: 16px;
    /* Les colonnes sont de hauteurs tres inegales : les centrer verticalement
       ferait flotter la colonne courte au milieu du vide. */
    align-content: start;
}

/* La troisieme piste ne doit exister que si elle a quelque chose a montrer.
   Ses cartes sont soit conditionnelles cote serveur (appels, partenaires,
   reseaux), soit revelees par le JS une fois les annonces recues : :has
   repond aux deux cas, et la grille se reforme d'elle-meme le jour ou une
   carte apparait. Sans cette regle, une fiche sans lien laisse un tiers de
   page vide, quel que soit son type d'organisation. */
.v7.fiche-inscrite:not(:has(> .colonne-liens > :not([hidden]))) {
    grid-template-columns: 310px minmax(0, 1fr);
}

/* --- Bande d'accent, marqueur des fiches inscrites ------------------------------
   base-v7.css pose un aplat sur la bande de 3px de la carte d'identite. Les
   fiches inscrites reprennent le degrade complet, orange compris : c'est ce qui
   les distingue franchement des fiches construites sur les seules donnees
   publiques, ou la bande reste unie.

   Le signal est porte par la couleur du type, donc il dit deux choses a la fois :
   que la structure tient sa fiche, et de quel type elle est. */

.v7.fiche-inscrite .carte-accent::before {
    background: linear-gradient(90deg, var(--accent-clair), var(--accent-fonce), var(--accent-clair));
}

/* --- Carte d'identite ----------------------------------------------------------
   Nom, accroche et badges d'un cote ; identifiant et partage cales a l'autre.
   Deux enfants, pas de conteneur intermediaire. */

.v7 .carte-identite {
    display: flex;
    align-items: flex-start;
    gap: 24px;
    padding: 22px 30px 20px;
}
.v7 .carte-identite > header { flex: 1; min-width: 0; }

.v7 .carte-identite .tagline {
    margin-top: 6px;
    font-size: 14.5px;
    line-height: 1.5;
    color: var(--ex-stone-600);
}
.v7 .carte-identite .badges { margin-top: 14px; }

/* Le sous-type d'une collectivite (Mairie, EPCI) complete le badge sans le
   concurrencer : meme couleur, graisse normale, legerement en retrait. */
.v7 .badge-type { background: var(--accent-badge-fond); color: var(--accent-badge-texte); }
.v7 .badge-type .sous-type { font-weight: 400; opacity: .75; }

.v7 .carte-identite .reperes {
    display: grid;
    gap: 8px;
    justify-items: end;
    flex-shrink: 0;
}

/* --- Cartes de bloc -------------------------------------------------------------
   En-tete a filet (porte par fiche-v7.css) puis un corps a gouttiere. Le corps
   est nomme pour que le padding ne depende pas du type d'element : une ul, une
   dl ou une div se comportent pareil. */

.v7 .carte-bloc > .bloc-corps,
.v7 .carte-bloc > ul.bloc-corps,
.v7 .carte-bloc > dl.bloc-corps { padding: 14px 18px; }

.v7 .carte-bloc > header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 6px 12px;
}
/* Qui renseigne le contenu : l'information est utile mais ne doit pas peser
   autant que le titre de la carte. */
.v7 .carte-bloc .renseigne { font-size: 11.5px; color: var(--ex-stone-500); }

/* Carte sans en-tete, pour une phrase isolee (appartenance a un reseau). */
.v7 .carte-plate {
    padding: 12px 18px;
    font-size: 12.5px;
    line-height: 1.6;
    color: var(--ex-stone-600);
}
.v7 .carte-plate ul { margin-top: 6px; display: grid; gap: 4px; }

/* --- Canaux de contact ------------------------------------------------------------
   Une puce pleine largeur par canal, empilees. Elles different des .puce de
   base-v7.css : ici la largeur est contrainte par une colonne de 310px, donc
   la valeur doit pouvoir etre tronquee plutot que deborder. */

.v7 .canaux { display: grid; gap: 8px; padding: 14px 18px; }

.v7 .canal {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 12px;
    border: 1px solid var(--ex-stone-200);
    background: var(--ex-stone-50);
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    transition: border-color .15s var(--ex-ease), box-shadow .15s var(--ex-ease);
    overflow: hidden;
    max-width: 21em;
}
.v7 a.canal:hover { border-color: var(--ex-stone-300); box-shadow: var(--ex-shadow-sm); }

.v7 .canal .valeur {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Canal masque : meme geometrie, trait pointille, et le bouton de revelation
   cale a droite. La valeur reelle est dans le document mais retiree du rendu
   par [hidden] ; c'est le dispositif de la v6, conserve tel quel. */
.v7 .canal-masque {
    border-style: dashed;
    border-color: var(--ex-stone-300);
    background: none;
    color: var(--ex-stone-600);
}
.v7 .canal-masque .points {
    letter-spacing: .12em;
    font-size: 11px;
    color: var(--ex-stone-500);
}
.v7 .canal-masque .afficher {
    margin-left: auto;
    flex-shrink: 0;
    font-size: 12px;
    font-weight: 600;
    color: var(--accent-titre);
}
.v7 .canal-masque .afficher:hover { text-decoration: underline; }
/* Une fois revelee, la valeur reprend l'allure d'un canal ordinaire. */
.v7 .canal-masque .valeur { font-weight: 500; }

/* Le message ne parait que si la liste de canaux est vide. Le CSS suit l'etat
   reel du DOM : compter les contacts joignables cote template demanderait
   plusieurs boucles pour une information que le document porte deja. */
.v7 .contact .note { display: none; padding: 0 18px 14px; }
.v7 .contact .canaux:not(:has(li)) { display: none; }
.v7 .contact .canaux:not(:has(li)) + .note { display: block; }

/* --- Texte saisi par la structure ---------------------------------------------------
   Description et adresse arrivent en clair, retours a la ligne compris. La v6
   les rendait dans un <pre>, ce qui imposait la police monospace et interdisait
   la cesure. white-space: pre-line conserve les sauts de ligne voulus, replie
   les espaces parasites et laisse le texte se justifier normalement. */

.v7 .texte-libre {
    white-space: pre-line;
    overflow-wrap: break-word;
}

/* --- Presentation (colonne centrale) -------------------------------------------------
   Le chapeau est le premier bloc de la description ; les suivants, issus du
   redecoupage, deviennent des rangees etiquetees. */

.v7 .presentation > .bloc-corps { padding: 20px 26px 24px; }
.v7 .presentation > header { padding: 9px 26px; }

.v7 .presentation .chapeau { font-size: 15px; line-height: 1.75; }
.v7 .presentation .rangee:first-of-type { margin-top: 18px; }
.v7 .presentation .rangee .prose { font-size: 14px; line-height: 1.65; }

/* --- Carte de localisation ------------------------------------------------------
   Le conteneur est dimensionne ici et non par Leaflet : la carte se charge
   apres le rendu, et sans hauteur reservee la page sauterait a son arrivee. */

.v7 .carte-geo {
    margin-top: 10px;
    height: 150px;
    border: 1px solid var(--ex-stone-200);
    border-radius: 8px;
    overflow: hidden;
    background: var(--ex-stone-100);
}

/* Leaflet pose ses propres couleurs de controle : on les ramene au systeme. */
.v7 .carte-geo .leaflet-container { font-family: var(--ex-font); background: var(--ex-stone-100); }
.v7 .carte-geo .leaflet-control-attribution {
    font-size: 10px;
    background: color-mix(in srgb, var(--ex-surface) 85%, transparent);
    color: var(--ex-stone-600);
}
.v7 .carte-geo .leaflet-control-attribution a { color: var(--ex-link); }

/* --- Identifiants ---------------------------------------------------------------
   Le renvoi vers les donnees publiques et la mention de signalement ferment la
   colonne de gauche. */

.v7 .identifiants .renvoi { margin-top: 12px; font-size: 12.5px; }
.v7 .identifiants .mention {
    margin-top: 12px;
    padding: 10px 0 0;
    border-top: 1px solid var(--ex-stone-100);
    font-size: 11.5px;
}

/* --- Appels a partenariat (colonne droite) -----------------------------------------
   Une tuile par appel : le type qualifie, la description explique, l'action
   conclut. */

.v7 .appels { display: grid; gap: 8px; }

.v7 .appel {
    padding: 11px 13px;
    border: 1px solid var(--ex-stone-100);
    border-radius: 8px;
}
.v7 .appel-type {
    display: inline-block;
    padding: 2px 7px;
    border-radius: 4px;
    background: var(--ex-amber-100);
    color: var(--ex-amber-800);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
}
.v7 .appel-desc {
    margin-top: 6px;
    font-size: 12.5px;
    line-height: 1.5;
    color: var(--ex-stone-700);
}
.v7 .appel .lien-action { display: inline-block; margin-top: 7px; font-size: 12px; font-weight: 600; }

/* --- Partenaires en cours (colonne droite) ------------------------------------------
   Un intitule de type en capitales mono, puis les partenaires du groupe. */

.v7 .partenaires { font-size: 13px; }
.v7 .partenaires dt {
    font-family: var(--ex-mono);
    font-size: 10px;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--ex-stone-500);
}
.v7 .partenaires dt + dd { margin-top: 4px; }
.v7 .partenaires dd + dd { margin-top: 3px; }
.v7 .partenaires dd + dt { margin-top: 12px; }
.v7 .partenaires dd { font-weight: 500; }

/* --- Entrees de liste (structures similaires) ---------------------------------------- */

.v7 .entrees { display: grid; gap: 8px; }

.v7 .entree {
    display: block;
    padding: 10px 13px;
    border: 1px solid var(--ex-stone-100);
    border-radius: 8px;
    color: inherit;
    font-weight: 400;
    transition: border-color .15s var(--ex-ease), box-shadow .15s var(--ex-ease);
}
.v7 .entree:hover { border-color: var(--ex-stone-300); box-shadow: var(--ex-shadow-sm); color: inherit; }
.v7 .entree-nom { display: block; font-size: 13.5px; font-weight: 600; color: var(--ex-stone-800); }
.v7 .entree-meta { display: block; margin-top: 2px; font-size: 12px; color: var(--ex-stone-500); }

/* --- Pied de la carte des annonces ----------------------------------------------------
   Le parcours d'un cote, l'abonnement de l'autre, sur une seule ligne. */

.v7 .pied-annonces {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 6px 12px;
    padding: 10px 18px 14px;
    font-size: 12px;
}
.v7 .pied-annonces .lien-action { font-weight: 600; }
.v7 .pied-annonces .declencheur { font-size: 12px; }

.v7 .abonnement {
    margin: 0 18px 14px;
    padding: 12px 14px;
    background: var(--ex-stone-50);
    border: 1px solid var(--ex-stone-200);
    border-radius: 10px;
}
.v7 .abonnement dl {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 8px 12px;
    align-items: center;
}
.v7 .abonnement dt {
    font-family: var(--ex-mono);
    font-size: 11px;
    color: var(--ex-stone-600);
}
.v7 .abonnement .note { margin-top: 10px; font-size: 12px; line-height: 1.5; color: var(--ex-stone-500); }

/* --- Responsive -------------------------------------------------------------------------
   Paliers repris de org-fiche.css, que le handoff demande de conserver : a
   l'etroit la colonne de liens passe sous les deux autres, puis tout s'empile
   dans l'ordre contenu, reperes, liens. */

@media (max-width: 1280px) {
    .v7.fiche-inscrite { grid-template-columns: 290px minmax(0, 1fr); }
    .v7.fiche-inscrite > .colonne-liens {
        grid-column: 1 / -1;
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
        align-items: start;
    }
}

@media (max-width: 968px) {
    .v7.fiche-inscrite { grid-template-columns: minmax(0, 1fr); }
    /* Le contenu passe devant les reperes : sur un ecran etroit, l'activite est
       ce qu'on vient lire. */
    .v7.fiche-inscrite > main { order: 1; }
    .v7.fiche-inscrite > .colonne-reperes { order: 2; }
    .v7.fiche-inscrite > .colonne-liens { order: 3; }
}

@media (max-width: 640px) {
    .v7 .carte-identite {
        flex-direction: column;
        gap: 14px;
        padding: 18px 18px 20px;
    }
    .v7 .carte-identite h1 { font-size: 22px; line-height: 1.3; }
    /* L'identifiant repasse a gauche : centre a droite d'une colonne unique, il
       paraitrait detache de la fiche. */
    .v7 .carte-identite .reperes { justify-items: start; }

    .v7 .presentation > header { padding: 9px 18px; }
    .v7 .presentation > .bloc-corps { padding: 16px 18px 18px; }
    .v7 .carte-geo { height: 180px; }
}