/* Reconnaissance de la structure pendant la frappe du SIRET.
   Le panneau est posé sur le <body> en `position:fixed` (cf. siret-lookup.js) :
   ses coordonnées viennent du script, la mise en forme reste ici.
   Les jetons de couleur sont écrits avec leur repli : ce panneau s'affiche
   aussi dans la modale d'inscription, hors de toute classe d'univers. */

.li-sirlk {
	position: fixed;
	z-index: 100010; /* Au-dessus de Fancybox (99992), qui porte la modale. */
	overflow-y: auto;
	padding: 5px;
	background: #fff;
	border: 1px solid rgba(36, 23, 38, .12);
	border-radius: 13px;
	box-shadow: 0 2px 4px rgba(36, 23, 38, .05), 0 18px 38px -22px rgba(36, 23, 38, .5);
}

.li-sirlk[hidden] { display: none !important; }

.li-sirlk__l {
	list-style: none;
	margin: 0;
	padding: 0;
}

.li-sirlk__o {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 9px 11px;
	border-radius: 9px;
	cursor: pointer;
	transition: background .12s ease;
}

/* Survol souris et survol clavier donnent LE MÊME état : sans quoi on croit
   piloter deux listes différentes selon la main qu'on utilise. */
.li-sirlk__o:hover,
.li-sirlk__o.is-on { background: rgba(238, 61, 111, .08); }

.li-sirlk__n {
	font-weight: 600;
	font-size: .92rem;
	line-height: 1.3;
	color: var(--ink, #241726);
}

.li-sirlk__o:hover .li-sirlk__n,
.li-sirlk__o.is-on .li-sirlk__n { color: #C42A57; }

/* Le numéro en chiffres tabulaires : c'est une colonne de chiffres que l'on
   compare du regard à ce que l'on vient de taper. */
.li-sirlk__d {
	font-size: .82rem;
	color: var(--ink-2, #766778);
	font-variant-numeric: tabular-nums;
}

.li-sirlk__x {
	align-self: flex-start;
	margin-top: 3px;
	padding: 1px 8px;
	border-radius: 999px;
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .02em;
	text-transform: uppercase;
	background: #FBE9E9;
	color: #A32020;
}

.li-sirlk__note {
	margin: 0;
	padding: 9px 11px;
	font-size: .85rem;
	line-height: 1.45;
	color: var(--ink-2, #766778);
}

/* Le compte rendu parlé n'a pas à s'afficher, mais il doit rester dans le flux
   pour être lu : on ne le masque donc pas avec `display:none`. */
.li-sirlk__sr {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}