/**
 * MSW Load More — styles du widget autonome.
 *
 * Le bouton hérite des styles `.msw-load-more` définis dans msw-filters.css
 * (enqueué comme dépendance). On ne définit ici que le conteneur et l'état
 * "épuisé".
 */

.msw-load-more-standalone {
	width: 100%;
	display: block;
}

.msw-load-more-standalone .msw-load-more {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 12px 28px;
	border: 1px solid #07042d;
	background: #07042d;
	color: #ffffff;
	cursor: pointer;
	font: inherit;
	font-weight: 600;
	font-size: 14px;
	border-radius: 4px;
	transition:
		background 0.15s ease,
		color 0.15s ease,
		opacity 0.15s ease;
	position: relative;
}

.msw-load-more-standalone .msw-load-more:hover:not(:disabled) {
	background: transparent;
	color: #07042d;
}

.msw-load-more-standalone .msw-load-more:disabled {
	cursor: wait;
}

.msw-load-more-standalone .msw-load-more::before {
	content: '';
	width: 16px;
	height: 16px;
	border-radius: 50%;
	border: 2px solid currentColor;
	border-right-color: transparent;
	display: none;
	animation: msw-spinner 0.7s linear infinite;
}

.msw-load-more-standalone .msw-load-more--loading {
	opacity: 0.7;
}

.msw-load-more-standalone .msw-load-more--loading::before {
	display: inline-block;
}

/* Quand la pagination est épuisée, on masque le wrap ET son bouton. On
   utilise `!important` parce qu'Elementor (et notre propre règle
   .msw-load-more-standalone .msw-load-more) a une spécificité 0,0,2,0
   qui surcharge un simple .msw-load-more-standalone--exhausted (0,0,1,0).
   Idem pour le `[hidden]` du <button> côté JS qui est surchargé par la
   règle display:inline-flex du bouton. */
.msw-load-more-standalone.msw-load-more-standalone--exhausted,
.msw-load-more-standalone.msw-load-more-standalone--exhausted .msw-load-more {
	display: none !important;
}

.msw-load-more-standalone .msw-load-more[hidden] {
	display: none !important;
}