/**
 * Bouton optionnel sur les vignettes de publications.
 *
 * Les sélecteurs sont volontairement plus spécifiques que ceux du thème :
 * Border impose `.mosaic__item a { display:block; padding:0; border-bottom-width:0 }`
 * à tous les liens d'une vignette, ce qui étirerait le bouton sur toute la largeur.
 */

/* Le calque est sorti du lien : il ne doit plus intercepter les clics,
   sinon il masquerait le lien de la vignette placé dessous. */
.mosaic__item.has-asp-button > .mosaic__meta {
	pointer-events: none;
}

.mosaic__item .asp-button {
	margin-top: 16px;
	line-height: 0;
	pointer-events: none;
}

.mosaic__item .asp-button .asp-button__link {
	display: inline-block;
	width: auto;
	margin: 0;
	padding: 9px 20px;
	border: 2px solid #fff;
	border-bottom-width: 2px;
	border-radius: 0;
	background: transparent;
	color: #fff;
	font-size: 12px;
	line-height: 1.25;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	text-decoration: none;
	overflow: visible;
	pointer-events: auto;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.mosaic__item .asp-button .asp-button__link:hover,
.mosaic__item .asp-button .asp-button__link:focus {
	background: #fff;
	color: #1a1717;
}

@media (max-width: 600px) {
	.mosaic__item .asp-button {
		margin-top: 12px;
	}

	.mosaic__item .asp-button .asp-button__link {
		padding: 7px 14px;
		font-size: 11px;
	}
}