/* ——— Compte : historique des points et zone de suppression (app client et fiche du comptoir) ——— */
.bloc-historique {
  display: grid;
  gap: var(--e3);
}

.historique {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 2px solid var(--trait);
}

/* Libellé à gauche (il rétrécit), points à droite (jamais coupés), bouton « Annuler » dessous. */
.historique__ligne,
.historique__vide {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--e1) var(--e3);
  align-items: baseline;
  padding: var(--e3) 0;
  border-bottom: 1px solid var(--attenue);
}

.historique__date,
.historique__ligne .bouton {
  grid-column: 1 / -1;
}

.historique__date {
  display: flex;
  color: var(--attenue);
  flex-wrap: wrap;
  gap: var(--e2);
  font-size: 0.95rem;
}

.historique__libelle {
  overflow-wrap: anywhere;
}

.historique__points {
  font-family: var(--police-titre);
  font-weight: 900;
  font-size: 1.3rem;
  white-space: nowrap;
}

.historique__points--gain {
  color: var(--rouge);
}

.historique__ligne--annule .historique__libelle,
.historique__ligne--annule .historique__points {
  color: var(--attenue);
  text-decoration: line-through;
}

.etiquette {
  padding: 0 var(--e2);
  border: 1px solid var(--attenue);
  text-transform: uppercase;
  font-size: 0.8rem;
}

.zone-danger {
  display: grid;
  gap: var(--e3);
  margin-top: var(--e5);
  padding-top: var(--e5);
  border-top: 2px dashed var(--erreur);
}

.bouton--danger {
  border-color: var(--erreur);
  background: transparent;
  color: var(--erreur);
  box-shadow: 5px 5px 0 var(--erreur);
}

/* Liens secondaires de « Mon compte » : grandes zones tactiles, côte à côte quand ça tient. */
.liens-compte {
  display: flex;
  flex-wrap: wrap;
  gap: var(--e2) var(--e5);
}

.liens-compte a {
  display: inline-flex;
  align-items: center;
  min-height: 48px;
}

/* ——— Installation de l'app ——— */
.carte-installation {
  display: grid;
  gap: var(--e3);
  padding: var(--e4);
  border: var(--bord) solid var(--noir);
  background: var(--papier);
  box-shadow: var(--ombre);
}

.installation {
  display: grid;
  gap: var(--e4);
}

.etapes {
  display: grid;
  gap: var(--e3);
  margin: 0;
  padding-left: var(--e5);
  font-size: 1.1rem;
}

.icone-ios {
  /* Dans la phrase, à la taille du texte (les images sont en bloc par défaut). */
  display: inline;
  width: 1.3em;
  height: 1.3em;
  vertical-align: -0.25em;
}