/**
 * PlayAwale — Partager : la fenêtre de repli
 * -----------------------------------------------------------------------------
 * Là où le navigateur n'a pas de feuille de partage — Firefox sur ordinateur,
 * notamment —, une fenêtre propose les canaux courants sous forme de simples
 * liens. Elle sert au jeu en réseau (net.php, inviter quelqu'un) et à la partie
 * revue (replay.php, la faire voir).
 *
 * Ces règles vivaient dans pages/net.css ; elles en sont sorties TELLES QUELLES
 * le 25/09/2026, quand la partie revue a eu besoin de la même fenêtre. La
 * fenêtre elle-même est le composant modal.css.
 *
 * @package   PlayAwale
 * @version   2.0
 * @author    Nicolas Lion — Développeur web — https://nlion.fr
 * @copyright 2026 Nicolas Lion
 */

/* =============================================================================
   PARTAGER UNE PARTIE
   -----------------------------------------------------------------------------
   La fenêtre de repli, là où le partage du système manque. Elle emprunte tout au
   composant de fenêtre modale ; il n'y a ici que l'invitation, la liste des
   canaux, et la mention de copie.
   ============================================================================= */

/* L'invitation telle qu'elle partira : on doit pouvoir la lire avant de
   l'envoyer, et la sélectionner à la main si le presse-papiers se refuse. */
.share-invite {
  margin: 0 0 var(--space-md);
  padding: var(--space-sm) var(--space-md);

  font-family: var(--font-body);
  font-size: var(--font-size-sm);
  line-height: var(--line-height-base);
  text-align: left;
  word-break: break-word;

  /* L'invitation porte un passage à la ligne entre la phrase et le lien : il
     doit se voir ici comme il se verra dans le message envoyé. */
  white-space: pre-line;

  color: var(--color-text);
  background-color: var(--color-sand-100);
  border-radius: var(--radius-sm);
}

/* Les canaux : des boutons de même taille, qui se replient d'eux-mêmes sur un
   écran étroit. */
.share-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--space-xs);

  margin: 0 0 var(--space-md);
  padding: 0;
  list-style: none;
}

.share-link {
  padding: var(--space-2xs) var(--space-md);
  font-size: var(--font-size-base);

  /* Un lien, pas un bouton : le soulignement du texte courant n'a rien à faire
     sur une pastille. */
  text-decoration: none;
}

.share-copied {
  margin: 0 0 var(--space-md);

  font-family: var(--font-body);
  font-size: var(--font-size-sm);
  color: var(--color-online);
}