/* Appli des licenciés — Communauté (lot F) : pied des cartes du fil (réactions, commentaires, partage), commentaires,
   signalement, vote et résultats animés des consultations, cartes d'exemple de la démonstration. Préfixe apc-.
   Couleurs de la charte seulement ; téléphone d'abord ; mode sombre (système, ou forcé par l'appli) ; prefers-reduced-motion. */
.apc-pied, .apc-demo-fil, .apc-vote, [data-carte-id]{
  --apc-klein:#001CA8; --apc-minuit:#191970; --apc-noir:#120D16; --apc-fumee:#F5F5F5; --apc-cranberry:#950714; --apc-rouge:#F32837; --apc-blanc:#fff;
  --apc-fond:#fff; --apc-fond2:#F5F5F5; --apc-texte:#120D16; --apc-doux:rgba(18,13,22,.68); --apc-trait:rgba(18,13,22,.12);
  --apc-accent:#001CA8; --apc-accent-doux:rgba(0,28,168,.08); --apc-alerte:#950714;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="clair"]):not([data-el-theme="clair"]) :is(.apc-pied, .apc-demo-fil, .apc-vote, [data-carte-id]){
    --apc-fond:#191970; --apc-fond2:#120D16; --apc-texte:#F5F5F5; --apc-doux:rgba(245,245,245,.72); --apc-trait:rgba(245,245,245,.16);
    --apc-accent:#fff; --apc-accent-doux:rgba(245,245,245,.12); --apc-alerte:#F32837;
  }
}
:is([data-theme="sombre"], [data-el-theme="sombre"], .el-theme-sombre) :is(.apc-pied, .apc-demo-fil, .apc-vote, [data-carte-id]){
  --apc-fond:#191970; --apc-fond2:#120D16; --apc-texte:#F5F5F5; --apc-doux:rgba(245,245,245,.72); --apc-trait:rgba(245,245,245,.16);
  --apc-accent:#fff; --apc-accent-doux:rgba(245,245,245,.12); --apc-alerte:#F32837;
}

/* ── Pied de carte ── */
.apc-pied{margin-top:.75rem;padding-top:.65rem;border-top:1px solid var(--apc-trait);color:var(--apc-texte)}
.apc-pied:empty{display:none}
/* Pied ajouté en fin de carte du fil (la carte n'a pas de data-carte-pied) : les marges du corps de la carte (recette du 11/10/2026). */
[data-carte-id]>.apc-pied{margin:.35rem 0 0;padding:.65rem 1.1rem .95rem}
.apc-pied-barre{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem}
.apc-reactions,.apc-actions{display:flex;flex-wrap:wrap;gap:.35rem}
.apc-reac,.apc-bouton{appearance:none;display:inline-flex;align-items:center;gap:.35rem;min-height:2.5rem;padding:.35rem .7rem;border-radius:999px;border:1px solid var(--apc-trait);
  background:var(--apc-fond);color:var(--apc-texte);font:600 .85rem/1 Cabin,system-ui,sans-serif;cursor:pointer;-webkit-tap-highlight-color:transparent;
  transition:background-color .15s, border-color .15s, color .15s, transform .15s}
.apc-reac svg,.apc-bouton svg,.apc-signaler svg{width:1.1rem;height:1.1rem;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round;stroke-linecap:round}
.apc-reac:hover,.apc-bouton:hover{border-color:var(--apc-accent)}
.apc-reac:focus-visible,.apc-bouton:focus-visible,.apc-envoyer:focus-visible,.apc-lien:focus-visible,.apc-signaler:focus-visible{outline:3px solid var(--apc-rouge);outline-offset:2px}
.apc-reac:active{transform:scale(.94)}
.apc-reac-n{font-variant-numeric:tabular-nums;font-weight:700}
.apc-reac.est-mien{background:var(--apc-klein);border-color:var(--apc-klein);color:#fff}
.apc-reac-merci.est-mien{background:var(--apc-cranberry);border-color:var(--apc-cranberry)}
.apc-reac-utile.est-mien{background:var(--apc-minuit);border-color:var(--apc-minuit)}
.apc-reac.est-mien svg{fill:currentColor}
:is([data-theme="sombre"], [data-el-theme="sombre"], .el-theme-sombre) .apc-reac.est-mien{background:#fff;color:var(--apc-klein);border-color:#fff}
@media (prefers-color-scheme: dark){ :root:not([data-theme="clair"]):not([data-el-theme="clair"]) .apc-reac.est-mien{background:#fff;color:var(--apc-klein);border-color:#fff} }
.apc-bouton.est-ouvert{background:var(--apc-accent-doux)}
@media (max-width:340px){ .apc-reac-lib{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)} .apc-reac{padding:.35rem .6rem} }

/* Réaction qui rebondit (et une petite étincelle) ; rien si l'appareil demande moins de mouvement. */
@keyframes apc-rebond{0%{transform:scale(1)}30%{transform:scale(1.28) rotate(-6deg)}55%{transform:scale(.92)}75%{transform:scale(1.08)}100%{transform:scale(1)}}
@keyframes apc-etincelle{0%{opacity:.9;transform:translate(-50%,0) scale(.6)}100%{opacity:0;transform:translate(-50%,-1.3rem) scale(1.2)}}
.apc-rebond{position:relative;animation:apc-rebond .55s cubic-bezier(.3,1.6,.5,1)}
.apc-rebond svg{animation:apc-rebond .55s .05s cubic-bezier(.3,1.6,.5,1)}
.apc-rebond::after{content:"+1";position:absolute;left:50%;top:-.2rem;font:700 .75rem Montserrat,sans-serif;color:var(--apc-rouge);pointer-events:none;animation:apc-etincelle .7s ease-out forwards}

.apc-message{margin:.45rem 0 0;font-size:.85rem;color:var(--apc-doux)}
.apc-message:empty{display:none}

/* ── Commentaires ── */
.apc-com{margin-top:.7rem;padding:.75rem;border-radius:14px;background:var(--apc-fond2)}
.apc-liste{list-style:none;margin:0 0 .6rem;padding:0;display:grid;gap:.7rem}
.apc-c{display:flex;gap:.6rem;align-items:flex-start}
.apc-avatar{flex:none;display:grid;place-items:center;width:2rem;height:2rem;border-radius:50%;background:linear-gradient(135deg,var(--apc-klein),var(--apc-minuit));color:#fff;font:700 .85rem Montserrat,sans-serif}
.apc-c.est-mien .apc-avatar{background:var(--apc-cranberry)}
.apc-c-corps{min-width:0;flex:1;padding:.5rem .7rem;border-radius:4px 14px 14px 14px;background:var(--apc-fond);border:1px solid var(--apc-trait)}
.apc-c-tete{display:flex;flex-wrap:wrap;align-items:baseline;gap:.25rem .5rem;margin:0 0 .2rem;font-size:.8rem;color:var(--apc-doux)}
.apc-c-tete b{color:var(--apc-texte);font:700 .85rem Montserrat,sans-serif}
.apc-c-texte{margin:0;font-size:.95rem;line-height:1.45;overflow-wrap:anywhere;color:var(--apc-texte)}
.apc-etat{padding:.05rem .45rem;border-radius:999px;background:var(--apc-accent-doux);color:var(--apc-texte);font-size:.72rem;font-weight:700}
.apc-etat-masque{background:rgba(149,7,20,.12);color:var(--apc-alerte)}
.apc-signaler{appearance:none;display:inline-flex;align-items:center;gap:.25rem;margin-top:.3rem;padding:.2rem 0;border:0;background:none;color:var(--apc-doux);font:.78rem Cabin,system-ui,sans-serif;cursor:pointer}
.apc-signaler svg{width:.85rem;height:.85rem}
.apc-signaler:hover{color:var(--apc-alerte)}
.apc-signaler:disabled{opacity:.6;cursor:default}
.apc-vide{margin:0 0 .6rem;color:var(--apc-doux);font-size:.9rem}
.apc-lien{appearance:none;border:0;background:none;padding:.3rem 0;color:var(--apc-accent);font:600 .85rem Cabin,system-ui,sans-serif;text-decoration:underline;cursor:pointer}
.apc-form{display:grid;gap:.5rem}
.apc-form textarea,.apc-signal input[type=text]{width:100%;box-sizing:border-box;min-height:2.75rem;padding:.6rem .75rem;border-radius:12px;border:1px solid var(--apc-trait);background:var(--apc-fond);color:var(--apc-texte);font:1rem/1.4 Cabin,system-ui,sans-serif;resize:vertical}
.apc-form textarea:focus,.apc-signal input:focus{outline:2px solid var(--apc-klein);outline-offset:1px}
.apc-form-pied{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem}
.apc-aide{font-size:.78rem;color:var(--apc-doux)}
.apc-envoyer{appearance:none;min-height:2.5rem;padding:.45rem 1.1rem;border-radius:999px;border:0;background:var(--apc-klein);color:#fff;font:700 .9rem Montserrat,sans-serif;cursor:pointer}
.apc-envoyer:disabled{opacity:.6}
.apc-envoyer-rouge{background:var(--apc-cranberry)}
.apc-charte{display:flex;gap:.5rem;align-items:flex-start;font-size:.85rem;color:var(--apc-texte)}
.apc-charte input{margin-top:.2rem;accent-color:var(--apc-klein)}
.apc-charte-texte{font-size:.85rem;color:var(--apc-texte);background:var(--apc-fond);border:1px solid var(--apc-trait);border-radius:12px;padding:.5rem .75rem}
.apc-charte-texte summary{cursor:pointer;font-weight:700}
.apc-charte-texte ol{margin:.4rem 0 0;padding-left:1.2rem;display:grid;gap:.25rem}
.apc-signal{display:grid;gap:.35rem;margin-top:.5rem;padding:.6rem;border-radius:12px;border:1px solid rgba(149,7,20,.35);background:var(--apc-fond2);font-size:.85rem;color:var(--apc-texte)}
.apc-signal p{margin:0 0 .2rem}
.apc-signal label{display:flex;gap:.45rem;align-items:center}
.apc-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.apc-chargement{display:grid;gap:.4rem;margin:0}
.apc-squelette{display:block;height:.9rem;border-radius:6px;background:linear-gradient(90deg,var(--apc-trait),var(--apc-accent-doux),var(--apc-trait));background-size:200% 100%;animation:apc-squelette 1.2s linear infinite}
.apc-squelette-court{width:60%}
@keyframes apc-squelette{to{background-position:-200% 0}}

/* ── Consultation dans la carte ── */
.apc-vote{margin-top:.75rem;color:var(--apc-texte)}
.apc-vote fieldset{border:0;margin:0 0 .6rem;padding:0;display:grid;gap:.4rem}
.apc-choix{display:flex;gap:.6rem;align-items:center;min-height:2.75rem;padding:.4rem .75rem;border-radius:12px;border:1px solid var(--apc-trait);background:var(--apc-fond);cursor:pointer;font-size:.95rem}
.apc-choix:has(input:checked){border-color:var(--apc-klein);box-shadow:inset 0 0 0 1px var(--apc-klein);background:var(--apc-accent-doux)}
.apc-choix input{accent-color:var(--apc-klein);width:1.1rem;height:1.1rem}
.apc-resultats ul{list-style:none;margin:0;padding:0;display:grid;gap:.55rem}
.apc-resultats li{display:grid;grid-template-columns:1fr auto;gap:.25rem .5rem;font-size:.9rem}
.apc-resultats li em{font-style:normal;color:var(--apc-doux);font-size:.8rem}
.apc-r-pct{font:700 .9rem Montserrat,sans-serif;font-variant-numeric:tabular-nums}
.apc-r-barre{grid-column:1/-1;height:.6rem;border-radius:999px;background:var(--apc-trait);overflow:hidden}
.apc-r-barre i{display:block;height:100%;width:var(--apc-pct);border-radius:inherit;background:linear-gradient(90deg,var(--apc-minuit),var(--apc-klein))}
.apc-resultats li.est-mien .apc-r-barre i{background:linear-gradient(90deg,var(--apc-cranberry),var(--apc-rouge))}
.apc-a-animer .apc-r-barre i{width:0}
.apc-anime .apc-r-barre i{transition:width .9s cubic-bezier(.2,.8,.2,1)}
.apc-anime li:nth-child(2) .apc-r-barre i{transition-delay:.08s}
.apc-anime li:nth-child(3) .apc-r-barre i{transition-delay:.16s}
.apc-anime li:nth-child(4) .apc-r-barre i{transition-delay:.24s}
.apc-anime li:nth-child(5) .apc-r-barre i{transition-delay:.32s}
.apc-r-total,.apc-merci{margin:.6rem 0 0;font-size:.8rem;color:var(--apc-doux)}

/* ── Cartes d'exemple (démonstration seulement, tant que le fil du lot C n'existe pas) ── */
.apc-demo-fil{display:grid;gap:.85rem;margin:1rem 0}
.apc-demo-titre{margin:0;font:700 .8rem Montserrat,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--apc-doux)}
.apc-demo-carte{padding:1rem;border-radius:18px;background:var(--apc-fond);border:1px solid var(--apc-trait);box-shadow:0 6px 18px rgba(18,13,22,.06);color:var(--apc-texte)}
.apc-demo-carte h3{margin:.35rem 0 .3rem;font:700 1.08rem/1.3 Montserrat,sans-serif;color:var(--apc-texte)}
.apc-demo-message{border-left:4px solid var(--apc-klein)}
.apc-demo-consultation{border-left:4px solid var(--apc-minuit)}
.apc-demo-sur{display:flex;gap:.5rem;align-items:center;margin:0;font-size:.78rem;color:var(--apc-doux)}
.apc-demo-type{font-weight:700;color:var(--apc-accent)}
.apc-demo-texte{margin:0;font-size:.95rem;line-height:1.45;color:var(--apc-doux)}

@media (prefers-reduced-motion: reduce){
  .apc-rebond,.apc-rebond svg,.apc-squelette{animation:none}
  .apc-rebond::after{content:none}
  .apc-anime .apc-r-barre i,.apc-reac,.apc-bouton{transition:none}
}
