/* ==========================================================================
   360RTF - L'avis du membre sur une sortie.

   Feuille a part, jamais en fin de rtf.css : celle-ci pese 215 Ko et deux
   regles de meme specificite s'y ecrasent en silence. Chargee apres
   rtf-core, dont elle reprend les variables.

   Le choix d'une note tient en cinq radios et du CSS : aucun JavaScript, le
   formulaire marche meme quand le script ne charge pas.
   ========================================================================== */

.rtf-avis-casque{display:block}

/* ---------- Une note figee ---------- */
.rtf-avis-note{display:inline-flex;gap:3px;align-items:center;vertical-align:middle}
.rtf-avis-note i{color:#454C5C;line-height:0;font-style:normal}
.rtf-avis-note i.est-plein{color:var(--rtf-or)}

/* ---------- Le choix d'une note ----------
   Les radios restent dans le flux pour le clavier, mais invisibles ; c'est le
   label qui porte le casque. Le casque s'allume au survol et jusqu'a la
   valeur choisie, d'ou l'ordre inverse et la selection par ~. */
.rtf-avis-choix{display:inline-flex;flex-direction:row-reverse;gap:4px;align-items:center}
.rtf-avis-choix input{
  position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);
  clip-path:inset(50%);white-space:nowrap;
}
.rtf-avis-choix label{
  color:#4C5466;cursor:pointer;line-height:0;
  transition:color .14s var(--rtf-ease),transform .14s var(--rtf-ease);
}
.rtf-avis-choix label:hover,
.rtf-avis-choix label:hover ~ label,
.rtf-avis-choix input:checked ~ label{color:var(--rtf-or)}
.rtf-avis-choix label:hover{transform:translateY(-2px)}
.rtf-avis-choix input:focus-visible + label{outline:2px solid var(--rtf-accent);outline-offset:3px}

/* ---------- Le pied de la carte, dans l'espace membre ---------- */
.rtf-insc-avis{
  display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;
  margin:8px 0 0;padding:0 2px;
}
.rtf-avis-bouton{
  display:inline-flex;align-items:center;gap:7px;
  font-family:var(--rtf-label);font-weight:600;
  font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;
  color:var(--rtf-or);text-decoration:none;
  border:1px solid rgba(227,197,103,.42);border-radius:var(--rtf-r-sm);
  padding:7px 12px;
  transition:background .18s var(--rtf-ease),border-color .18s var(--rtf-ease);
}
.rtf-avis-bouton:hover{background:var(--rtf-or-sourd);border-color:var(--rtf-or)}
.rtf-insc-avis-etat{
  font-family:var(--rtf-label);font-size:.72rem;letter-spacing:.04em;color:var(--rtf-ink-muted);
}
.rtf-insc-avis-etat.est-clos{color:#6E7683}

/* ---------- Le formulaire ---------- */
.rtf-avis-panneau{
  border:1px solid var(--rtf-line);border-radius:var(--rtf-r-md);
  background:var(--rtf-panel);padding:16px 15px 18px;margin-top:10px;
}
.rtf-avis-rappel{
  margin:0 0 4px;font-family:var(--rtf-label);font-size:.66rem;
  letter-spacing:.1em;text-transform:uppercase;color:#6E7683;
}
.rtf-avis-titre{
  margin:0 0 16px;font-family:var(--rtf-display);font-weight:900;
  font-size:1.16rem;line-height:1.05;text-transform:uppercase;color:var(--rtf-ink);
}
.rtf-avis-ligne{
  display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 0;
}
.rtf-avis-ligne + .rtf-avis-ligne{border-top:1px solid var(--rtf-line)}
.rtf-avis-ligne.est-globale{
  padding:2px 0 12px;border-bottom:1px solid var(--rtf-line);margin-bottom:6px;
}
.rtf-avis-nom{font-size:.92rem;color:var(--rtf-ink)}
.rtf-avis-ligne.est-globale .rtf-avis-nom{
  font-family:var(--rtf-display);font-weight:700;font-size:1.02rem;text-transform:uppercase;
}
.rtf-avis-nom small{
  display:block;color:#6E7683;font-size:.72rem;
  font-family:var(--rtf-label);letter-spacing:.04em;
}
.rtf-avis-panneau textarea{
  width:100%;margin-top:14px;background:var(--rtf-canvas-2);color:var(--rtf-ink);
  border:1px solid var(--rtf-line);border-radius:var(--rtf-r-sm);padding:10px 11px;
  font-family:var(--rtf-body);font-size:.92rem;line-height:1.55;
  resize:vertical;min-height:84px;
}
.rtf-avis-signature{
  margin:12px 0 0;padding-left:11px;border-left:2px solid var(--rtf-or-solid);
  font-size:.86rem;line-height:1.5;color:var(--rtf-ink-muted);
}
.rtf-avis-pied{display:flex;gap:10px;margin-top:16px}
.rtf-avis-pied .rtf-btn{flex:1;justify-content:center}
.rtf-avis-delai{
  margin:12px 0 0;padding-top:12px;border-top:1px solid var(--rtf-line);
  font-size:.78rem;line-height:1.5;color:#6E7683;
}

/* ---------- Le bloc public, sur la fiche d'une sortie ---------- */
.rtf-avis-bloc{
  border:1px solid var(--rtf-line);border-radius:var(--rtf-r-md);
  background:var(--rtf-panel);margin:26px 0;
}
.rtf-avis-entete{
  display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;
  padding:15px;border-bottom:1px solid var(--rtf-line);
}
.rtf-avis-moyenne{display:flex;align-items:baseline;gap:9px;margin:0}
.rtf-avis-moyenne b{
  font-family:var(--rtf-display);font-weight:900;font-size:2.3rem;line-height:.9;
  color:var(--rtf-ink);font-variant-numeric:tabular-nums;
}
.rtf-avis-moyenne span{
  font-family:var(--rtf-label);font-size:.7rem;letter-spacing:.1em;
  text-transform:uppercase;color:#6E7683;
}
.rtf-avis-repartition{display:grid;gap:4px;min-width:150px;flex:1}
.rtf-avis-repartition > span{display:grid;grid-template-columns:22px 1fr 22px;gap:8px;align-items:center}
.rtf-avis-repartition i{
  font-style:normal;font-family:var(--rtf-label);font-size:.66rem;
  letter-spacing:.06em;color:#6E7683;font-variant-numeric:tabular-nums;
}
.rtf-avis-repartition u{
  display:block;height:5px;background:#22262F;border-radius:3px;
  overflow:hidden;text-decoration:none;
}
.rtf-avis-repartition u b{display:block;height:100%;background:var(--rtf-or-solid);border-radius:3px}
.rtf-avis-verrou{margin:0;padding:20px 15px;text-align:center;color:var(--rtf-ink-muted);font-size:.92rem}
.rtf-avis-liste{list-style:none;margin:0;padding:0}
.rtf-avis-liste > li{padding:14px 15px;border-bottom:1px solid var(--rtf-line)}
.rtf-avis-liste > li:last-child{border-bottom:0}
.rtf-avis-tete{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin:0 0 7px}
.rtf-avis-pseudo{
  font-family:var(--rtf-display);font-weight:700;font-size:.95rem;
  letter-spacing:.02em;color:var(--rtf-ink);
}
.rtf-avis-grade{
  font-family:var(--rtf-label);font-weight:600;font-size:.58rem;
  letter-spacing:.12em;text-transform:uppercase;color:var(--rtf-or);
  border:1px solid rgba(227,197,103,.4);background:var(--rtf-or-sourd);padding:2px 6px;
}
.rtf-avis-date{
  margin-left:auto;font-family:var(--rtf-label);font-size:.66rem;
  letter-spacing:.06em;color:#6E7683;
}
.rtf-avis-texte{margin:7px 0 0;font-size:.92rem;line-height:1.55;color:var(--rtf-ink-muted)}
.rtf-avis-criteres{
  display:flex;flex-wrap:wrap;gap:6px 14px;margin:8px 0 0;
  font-family:var(--rtf-label);font-size:.66rem;letter-spacing:.06em;color:#6E7683;
}
.rtf-avis-criteres b{color:var(--rtf-ink-muted);font-weight:600}

@media (max-width:560px){
  .rtf-avis-ligne{align-items:flex-start;flex-direction:column;gap:8px}
  .rtf-avis-moyenne b{font-size:2rem}
}

@media (prefers-reduced-motion:reduce){
  .rtf-avis-choix label{transition:none}
}

/* ---------- Quand le formulaire est ouvert ----------
   La liste des sorties est une grille de colonnes de 272 px : un formulaire
   n'y tient pas. La carte qui le porte prend donc toute la largeur de la
   liste, et la grille cesse d'etirer ses voisines a la hauteur de la ligne —
   sans cela, les cartes voisines s'allongent sur toute la hauteur du
   formulaire. */
.rtf-espace-inscrits:has(.rtf-avis-panneau){align-items:start}
.rtf-insc:has(.rtf-avis-panneau){grid-column:1 / -1}
.rtf-insc:has(.rtf-avis-panneau) .rtf-insc-lien{max-width:420px}
.rtf-avis-panneau{max-width:660px}

/* ---------- Les actions sous la carte d'une sortie ----------
   Les liens photos etaient deux liens rouges avec un emoji et un signe plus,
   ce qui faisait bricolage a cote du reste. Ils deviennent des pastilles, de
   la meme famille que le bouton d'avis : photos en gris, avis en or, parce
   que c'est lui qu'on attend. Selecteurs qualifies par .rtf-espace-inscrits
   pour passer devant ceux de rtf-galerie.css, de meme specificite. */
.rtf-espace-inscrits .rtf-insc-galerie{
  display:flex;flex-wrap:wrap;gap:8px;margin:9px 0 0;padding:0;
}
.rtf-espace-inscrits .rtf-insc-galerie a{
  display:inline-flex;align-items:center;gap:7px;
  font-family:var(--rtf-label);font-weight:600;
  font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;
  color:var(--rtf-ink-muted);text-decoration:none;
  border:1px solid var(--rtf-line);border-radius:var(--rtf-r-sm);
  padding:7px 12px;
  transition:border-color .18s var(--rtf-ease),color .18s var(--rtf-ease);
}
.rtf-espace-inscrits .rtf-insc-galerie a:hover{
  border-color:var(--rtf-accent);color:var(--rtf-accent);text-decoration:none;
}
.rtf-espace-inscrits .rtf-insc-galerie a svg{width:14px;height:14px;flex:none}
.rtf-insc-avis{margin-top:8px}

/* ---------- La bascule des sorties, dans l'espace membre ----------
   Les sorties deja faites finissaient tout en bas de la page, hors de vue.
   Deux onglets en tete, sans JavaScript : ce sont deux liens, l'etat vit
   dans l'adresse. ---------- */
.rtf-espace-bascule{
  display:inline-flex;margin:0 0 18px;
  border:1px solid var(--rtf-line);border-radius:var(--rtf-r-sm);
  overflow:hidden;background:var(--rtf-panel);
}
.rtf-espace-bascule a{
  display:inline-flex;align-items:center;gap:8px;
  padding:9px 16px;text-decoration:none;
  font-family:var(--rtf-label);font-weight:600;
  font-size:.74rem;letter-spacing:.08em;text-transform:uppercase;
  color:var(--rtf-ink-muted);
  transition:background .18s var(--rtf-ease),color .18s var(--rtf-ease);
}
.rtf-espace-bascule a + a{border-left:1px solid var(--rtf-line)}
.rtf-espace-bascule a:hover{color:var(--rtf-ink)}
.rtf-espace-bascule a.est-actif{background:var(--rtf-accent-solid);color:#fff}
.rtf-espace-bascule a span{
  font-variant-numeric:tabular-nums;opacity:.75;font-size:.72rem;
}
@media (max-width:420px){
  .rtf-espace-bascule{display:flex;width:100%}
  .rtf-espace-bascule a{flex:1;justify-content:center;padding:9px 8px}
}

/* ---------- Le pied de carte, depuis que la carte est d'une piece ----------
   Le pied a maintenant son propre cadre (gouttiere, filet, marges) dans
   rtf.css : les marges que ses deux blocs se donnaient eux-memes feraient
   double emploi. Ces regles viennent apres celles du dessus, dans la meme
   feuille, sans quoi elles perdraient l'arbitrage a poids egal. */
.rtf-insc-pied .rtf-insc-galerie{margin:0}
.rtf-insc-pied .rtf-insc-avis{margin:0;padding:0}

/* ---------- Le formulaire ouvert, dans la carte ----------
   La carte prend toute la largeur de la liste et se coupe en deux : la sortie
   a gauche, l'avis a droite. La grille cesse d'uniformiser ses rangees le
   temps de l'ecriture, sinon toutes prendraient la hauteur du formulaire. Le
   panneau perd son cadre : il est deja dans celui de la carte, et un cadre
   dans un cadre se voit. */
.rtf-espace-inscrits:has(.rtf-avis-panneau){grid-auto-rows:auto}
.rtf-insc:has(.rtf-avis-panneau){flex-direction:row;align-items:stretch}
.rtf-insc:has(.rtf-avis-panneau) .rtf-insc-lien{flex:0 0 320px;max-width:320px}
.rtf-insc:has(.rtf-avis-panneau) .rtf-insc-pied{
  flex:1 1 auto;margin-top:0;border-top:0;border-left:1px solid var(--rtf-line);
  padding:15px 18px 18px;
}
.rtf-insc-pied .rtf-avis-panneau{border:0;background:none;padding:0;margin-top:2px;order:1}

/* Le formulaire passe avant les liens photos : c'est lui qu'on est venu
   remplir. */
.rtf-insc:has(.rtf-avis-panneau) .rtf-insc-galerie{order:2}

/* Sur telephone, les deux colonnes redeviennent deux etages. */
@media (max-width:759px){
  .rtf-insc:has(.rtf-avis-panneau){flex-direction:column}
  .rtf-insc:has(.rtf-avis-panneau) .rtf-insc-lien{flex:0 0 auto;max-width:none}
  .rtf-insc:has(.rtf-avis-panneau) .rtf-insc-pied{
    border-left:0;border-top:1px solid var(--rtf-line);
  }
}
/* ---------- Trop peu d'avis pour une moyenne ----------
   Le membre voit les avis des le premier ; la moyenne, elle, attend le seuil.
   Le dire vaut mieux que laisser un blanc a la place de l'entete. */
.rtf-avis-attente{
  margin:0 0 18px;padding:12px 14px;
  border:1px dashed var(--rtf-line);border-radius:var(--rtf-r-sm);
  font-size:.9rem;color:var(--rtf-ink-muted);
}
/* ---- L'appel a donner son avis, en bas de la fiche d'une sortie ----
   Le formulaire vit dans l'espace membre : sans ce rappel, un membre qui
   descend au bas de SA sortie ne voyait nulle part ou noter. */
.rtf-avis-appel{
  margin:22px 0 0;
  padding:18px 20px;
  border:1px solid var(--rtf-line);
  border-radius:var(--rtf-r-md);
  background:var(--rtf-panel);
  display:flex; flex-wrap:wrap; align-items:center; gap:12px 18px;
}
.rtf-avis-appel-mot{ margin:0; flex:1 1 260px; color:var(--rtf-ink-muted); }
.rtf-avis-appel .rtf-btn{ display:inline-flex; align-items:center; gap:8px; }
.rtf-avis-appel.est-sobre{ display:block; color:var(--rtf-ink-muted); font-size:.95rem; }
/* Le lien de connexion prenait le gris de la phrase : rien ne disait qu'il
   etait cliquable. Rouge du club, et souligne au survol. */
.rtf-avis-appel.est-sobre a{
  color:var(--rtf-accent); font-weight:600; text-decoration:none;
}
.rtf-avis-appel.est-sobre a:hover,
.rtf-avis-appel.est-sobre a:focus-visible{
  color:var(--rtf-accent-solid); text-decoration:underline; text-underline-offset:2px;
}

/* ---------- Donner son avis, sous la galerie de la fiche ----------
   Meme respiration que le bloc galerie juste au-dessus : filet, marge, titre. */
.rtf-avis-donner{
  margin-top:clamp(40px,6vw,72px);
  padding-top:clamp(24px,3vw,40px);
  border-top:1px solid var(--rtf-line);
}
.rtf-avis-donner h2{ font-size:clamp(1.5rem,1.2rem+1vw,2rem); text-transform:uppercase; margin:0 0 18px; }
.rtf-avis-donner-mot{ margin:0 0 14px; max-width:660px; color:var(--rtf-ink-muted); line-height:1.55; }
.rtf-avis-donner .rtf-avis-panneau{ max-width:660px; margin-top:0; }
.rtf-avis-donner .rtf-msg{ max-width:660px; margin:0 0 14px; }
.rtf-avis-panneau-fait .rtf-avis-fait-note{
  display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; margin:0 0 10px;
}
.rtf-avis-panneau-fait .rtf-avis-fait-texte{ margin:0 0 8px; font-style:italic; color:var(--rtf-ink); line-height:1.5; }
.rtf-avis-panneau-fait .rtf-avis-appel-mot{ margin:0 0 14px; color:var(--rtf-ink-muted); font-size:.9rem; }
.rtf-avis-panneau-fait .rtf-avis-fait-pied{ margin:0; }

/* ---------- La reponse du club, sous un avis ---------- */
.rtf-avis-reponse{
  margin:12px 0 0 14px; padding:10px 14px;
  border-left:3px solid var(--rtf-accent-solid); border-radius:0 var(--rtf-r-sm) var(--rtf-r-sm) 0;
  background:var(--rtf-canvas-2);
}
.rtf-avis-reponse-tete{ display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; margin:0 0 6px; }
.rtf-avis-reponse-qui{
  font-family:var(--rtf-label); font-weight:600; font-size:.66rem; letter-spacing:.1em;
  text-transform:uppercase; color:var(--rtf-accent);
}
.rtf-avis-reponse-texte{ margin:0; font-size:.92rem; line-height:1.55; color:var(--rtf-ink); }