/**
 * La boîte des demandes de connexion et des refus d'accès — 0.99.280.
 *
 * ⚠️ Rendue par `Citivo_Connexion_Requise`, qui met cette feuille en file
 * elle-même : elle ne dépend d'aucune feuille d'écran (ni de `.citivo-btn`).
 * ⚠️ Deux classes partout : le thème habille `p` et `a` dans le contenu des
 * pages, une classe seule à égalité d'ordre aurait pu perdre.
 * ⚠️ Le bouton re-déclare ses couleurs sur CHAQUE état : le thème change
 * `color` et `background` des liens au survol (leçon de `.citivo-suivre`).
 */

.citivo-acces {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 14px;
	max-width: 640px;
	margin: 0 0 24px;
	padding: 18px 20px;
	border: 1px solid #d5dae1;
	border-radius: 12px;
	background: #f5f6f8;
}

.citivo-acces .citivo-acces-ligne {
	display: flex;
	align-items: flex-start;
	gap: 12px;
}

.citivo-acces .citivo-acces-icone {
	flex-shrink: 0;
	color: #5a6472;
}

/* Le triangle des refus : orangé, il dit « attention » sans crier. */
.citivo-acces--refus .citivo-acces-icone {
	color: #b26a00;
}

/* ⚠️⚠️ TAILLE DE LA PAGE (`inherit`), PAS UN JETON : le jeton « texte »
   (.85rem) sert l'interface dense — cartes, fiches. Ce message EST le contenu
   de la page, il prend donc la taille des paragraphes du thème, comme
   l'ancien message de « Mon compte » (reproche d'Olivier sur la page Badges :
   « la taille du texte est un peu petite »). Mesuré : 13,6 px avec le jeton. */
.citivo-acces .citivo-acces-message {
	margin: 2px 0 0;
	padding: 0;
	color: #2b3440;
	font-size: inherit;
	line-height: 1.5;
}

.citivo-acces .citivo-acces-bouton,
.citivo-acces .citivo-acces-bouton:visited,
.citivo-acces .citivo-acces-bouton:hover,
.citivo-acces .citivo-acces-bouton:focus {
	display: inline-block;
	margin-left: 38px;
	padding: .6rem 1.4rem;
	border: 0;
	border-radius: 999px;
	background: #315ba3;
	color: #ffffff;
	font-size: inherit;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
}

.citivo-acces .citivo-acces-bouton:hover,
.citivo-acces .citivo-acces-bouton:focus-visible {
	background: #24467f;
}