/**
 * PlayAwale — Mentions légales
 * -----------------------------------------------------------------------------
 * La page reprend les blocs du compte — mêmes cartes de sable, même matière — et
 * n'ajoute que ce qu'elle est seule à porter : une liste de crédits, des liens
 * qui se voient, et l'avertissement de chantier qui ne paraît qu'en local.
 *
 * ELLE SE LIT, ELLE NE SE PARCOURT PAS
 * Un texte de loi se lit ligne à ligne : les paragraphes sont donc alignés à
 * gauche et non centrés comme sur les autres blocs du compte, où il n'y a jamais
 * plus de deux phrases.
 *
 * @package   PlayAwale
 * @version   2.0
 * @author    Nicolas Lion — Développeur web — https://nlion.fr
 * @copyright 2026 Nicolas Lion
 */

/* Un texte long se lit à gauche : centré, l'œil perd le début de chaque ligne. */
.legal-page .account-block__text,
.legal-page .legal-credits {
  text-align: left;
}

.legal-page .account-block {
  width: min(94vw, 760px);
}

/* Un lien doit se voir comme un lien : c'est une page où l'on va chercher une
   adresse, pas une page où l'on joue. */
.legal-link {
  color: var(--color-text);
  text-decoration: underline;
  text-underline-offset: 2px;
  word-break: break-word;
}

.legal-link:hover,
.legal-link:focus-visible {
  color: var(--color-danger);
}

/* =============================================================================
   LES CRÉDITS
   -----------------------------------------------------------------------------
   Trois lignes : ce que le site doit à d'autres. Celle de DB-IP n'est pas une
   politesse — sa licence en fait la condition de son emploi.
   ============================================================================= */

.legal-credits {
  display: grid;
  gap: var(--space-xs);

  margin: 0;
  padding: 0;
  list-style: none;
}

.legal-credit {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: baseline;
  gap: var(--space-sm);

  font-family: var(--font-body);
  font-size: var(--font-size-base);
  line-height: var(--line-height-base);
  color: var(--color-text-muted);
}

/* Une puce discrète, de la couleur des graines : on est encore dans le jeu. */
.legal-credit::before {
  content: '';

  width: 0.5em;
  height: 0.5em;
  margin-top: 0.35em;

  background-color: var(--color-brand-amber);
  border-radius: var(--radius-full);
}

/* =============================================================================
   CE QUI RESTE À RENSEIGNER
   -----------------------------------------------------------------------------
   Ne paraît qu'en local. En production, mieux vaut une section muette qu'une
   note de chantier montrée à un visiteur — mais tant qu'on développe, il faut
   que cela SE VOIE.
   ============================================================================= */

.legal-missing {
  margin: 0;
  padding: var(--space-xs) var(--space-sm);

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

  background-color: var(--color-danger-surface);
  border-radius: var(--radius-sm);
}

/* Le texte de la puce : un seul enfant de la grille, pour que le lien reste sur
   la même ligne que la phrase qui l'annonce. */
.legal-credit__text {
  display: block;
}