/* LFA Social Float — styles front */
.lfasf,
.lfasf * { box-sizing: border-box; }

.lfasf {
	position: fixed;
	bottom: 18px;
	z-index: 99990;
	display: flex;
	flex-direction: column;
	align-items: center;
	--lfasf-main: #16a34a;
	--lfasf-fab: 60px;
	--lfasf-net: 50px;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* ---- Positions (classe posée par le JS selon l'appareil) ---- */
.lfasf.lfasf--right  { right: 18px; left: auto; align-items: flex-end; }
.lfasf.lfasf--left   { left: 18px; right: auto; align-items: flex-start; }
.lfasf.lfasf--center { left: 50%; right: auto; transform: translateX(-50%); align-items: center; }

/* ---- Bouton principal (taille forcée : indépendante du thème) ---- */
.lfasf__fab {
	width: var(--lfasf-fab) !important;
	height: var(--lfasf-fab) !important;
	min-width: var(--lfasf-fab) !important;
	min-height: var(--lfasf-fab) !important;
	max-width: var(--lfasf-fab) !important;
	max-height: var(--lfasf-fab) !important;
	padding: 0 !important;
	margin: 0 !important;
	line-height: 1 !important;
	border: 0 !important;
	border-radius: 50% !important;
	-webkit-appearance: none;
	appearance: none;
	box-sizing: border-box;
	cursor: pointer;
	background: var(--lfasf-main);
	color: #fff;
	position: relative;
	z-index: 2;
	display: grid;
	place-items: center;
	box-shadow: 0 10px 26px -6px rgba(0,0,0,.35), 0 2px 8px -2px rgba(0,0,0,.2);
	transition: transform .3s cubic-bezier(.34,1.56,.64,1), background .2s;
	-webkit-tap-highlight-color: transparent;
}
.lfasf__fab:hover { transform: scale(1.06); }
.lfasf__fab:focus-visible { outline: 3px solid rgba(255,255,255,.7); outline-offset: 2px; }
.lfasf__fab svg { width: 30px; height: 30px; }
.lfasf__fab img { width: 60%; height: 60%; object-fit: contain; border-radius: 50%; }

.lfasf__fab-open,
.lfasf__fab-close {
	position: absolute;
	display: grid;
	place-items: center;
	transition: opacity .2s, transform .35s cubic-bezier(.34,1.56,.64,1);
}
.lfasf__fab-close { opacity: 0; transform: rotate(-45deg) scale(.6); }
.lfasf.is-open .lfasf__fab { background: #1a1d24; }
.lfasf.is-open .lfasf__fab-open { opacity: 0; transform: rotate(45deg) scale(.6); }
.lfasf.is-open .lfasf__fab-close { opacity: 1; transform: none; }

/* ---- Liste des réseaux ---- */
.lfasf__list {
	position: absolute;
	bottom: calc(var(--lfasf-fab) + 16px);
	display: flex;
	pointer-events: none;
}
.lfasf.lfasf--right  .lfasf__list { right: calc((var(--lfasf-fab) - var(--lfasf-net)) / 2); }
.lfasf.lfasf--left   .lfasf__list { left: calc((var(--lfasf-fab) - var(--lfasf-net)) / 2); }
.lfasf.lfasf--center .lfasf__list { left: 50%; transform: translateX(-50%); }

.lfasf__net {
	width: var(--lfasf-net) !important;
	height: var(--lfasf-net) !important;
	min-width: var(--lfasf-net) !important;
	min-height: var(--lfasf-net) !important;
	max-width: var(--lfasf-net) !important;
	max-height: var(--lfasf-net) !important;
	padding: 0 !important;
	margin: 0 !important;
	line-height: 1 !important;
	border: 0 !important;
	border-radius: 50% !important;
	box-sizing: border-box;
	display: grid;
	place-items: center;
	text-decoration: none;
	color: #fff;
	position: relative;
	box-shadow: 0 6px 16px -4px rgba(0,0,0,.35);
	opacity: 0;
	transform: scale(.3) translateY(10px);
	transition: transform .34s cubic-bezier(.34,1.56,.64,1), opacity .24s, filter .15s;
	pointer-events: none;
}
.lfasf__net .lfasf__ico { display: grid; place-items: center; width: 26px; height: 26px; }
.lfasf__net svg { width: 26px; height: 26px; }
.lfasf.is-open .lfasf__net { opacity: 1; transform: none; pointer-events: auto; }
.lfasf__net:hover { filter: brightness(1.08); transform: scale(1.1); }
.lfasf__net:focus-visible { outline: 3px solid rgba(0,0,0,.35); outline-offset: 2px; }

/* Info-bulle */
.lfasf__tip {
	position: absolute;
	white-space: nowrap;
	font-size: 12px;
	font-weight: 600;
	line-height: 1;
	background: #1a1d24;
	color: #fff;
	padding: 6px 10px;
	border-radius: 8px;
	opacity: 0;
	pointer-events: none;
	transition: opacity .15s;
	box-shadow: 0 4px 12px -4px rgba(0,0,0,.4);
}
.lfasf__net:hover .lfasf__tip,
.lfasf__net:focus-visible .lfasf__tip { opacity: 1; }

/* ===== Style A : empilement vertical ===== */
.lfasf--style-stack .lfasf__list { flex-direction: column-reverse; gap: 12px; align-items: center; }
.lfasf--style-stack.lfasf--right  .lfasf__tip { right: calc(var(--lfasf-net) + 10px); }
.lfasf--style-stack.lfasf--left   .lfasf__tip { left: calc(var(--lfasf-net) + 10px); }
.lfasf--style-stack.lfasf--center .lfasf__tip { bottom: calc(var(--lfasf-net) + 8px); }

/* ===== Style B : barre horizontale ===== */
.lfasf--style-bar .lfasf__list {
	flex-direction: row;
	gap: 12px;
	bottom: calc((var(--lfasf-fab) - var(--lfasf-net)) / 2);
	align-items: center;
}
.lfasf--style-bar.lfasf--right  .lfasf__list { right: calc(var(--lfasf-fab) + 12px); left: auto; flex-direction: row-reverse; }
.lfasf--style-bar.lfasf--left   .lfasf__list { left: calc(var(--lfasf-fab) + 12px); right: auto; }
.lfasf--style-bar.lfasf--center .lfasf__list { bottom: calc(var(--lfasf-fab) + 12px); flex-direction: row; }
.lfasf--style-bar .lfasf__tip { bottom: calc(var(--lfasf-net) + 8px); }

/* ===== Style C : éventail (positions calculées par le JS) ===== */
.lfasf--style-arc .lfasf__list {
	flex-direction: row;
	gap: 0;
	bottom: calc((var(--lfasf-fab) - var(--lfasf-net)) / 2);
}
.lfasf--style-arc .lfasf__net { position: absolute; }
.lfasf--style-arc .lfasf__tip { bottom: calc(var(--lfasf-net) + 8px); }

/* ---- Stagger d'apparition ---- */
.lfasf.is-open .lfasf__net:nth-child(1) { transition-delay: .02s; }
.lfasf.is-open .lfasf__net:nth-child(2) { transition-delay: .05s; }
.lfasf.is-open .lfasf__net:nth-child(3) { transition-delay: .08s; }
.lfasf.is-open .lfasf__net:nth-child(4) { transition-delay: .11s; }
.lfasf.is-open .lfasf__net:nth-child(5) { transition-delay: .14s; }
.lfasf.is-open .lfasf__net:nth-child(6) { transition-delay: .17s; }
.lfasf.is-open .lfasf__net:nth-child(7) { transition-delay: .20s; }
.lfasf.is-open .lfasf__net:nth-child(8) { transition-delay: .23s; }

/* ---- Pulsation du bouton (attire l'œil, s'arrête à l'ouverture) ---- */
.lfasf--pulse:not(.is-open) .lfasf__fab {
	animation: lfasf-pulse 2.2s ease-out infinite;
}
@keyframes lfasf-pulse {
	0% {
		box-shadow: 0 10px 26px -6px rgba(0,0,0,.35), 0 2px 8px -2px rgba(0,0,0,.2),
			0 0 0 0 color-mix(in srgb, var(--lfasf-main) 55%, transparent);
	}
	70% {
		box-shadow: 0 10px 26px -6px rgba(0,0,0,.35), 0 2px 8px -2px rgba(0,0,0,.2),
			0 0 0 18px color-mix(in srgb, var(--lfasf-main) 0%, transparent);
	}
	100% {
		box-shadow: 0 10px 26px -6px rgba(0,0,0,.35), 0 2px 8px -2px rgba(0,0,0,.2),
			0 0 0 0 color-mix(in srgb, var(--lfasf-main) 0%, transparent);
	}
}

/* ---- Visibilité par appareil (seuils standard) ---- */
@media (min-width: 1025px) { .lfasf--sd-0 { display: none !important; } }
@media (min-width: 601px) and (max-width: 1024px) { .lfasf--st-0 { display: none !important; } }
@media (max-width: 600px) { .lfasf--sm-0 { display: none !important; } }

@media (prefers-reduced-motion: reduce) {
	.lfasf__fab,
	.lfasf__fab-open,
	.lfasf__fab-close,
	.lfasf__net { transition-duration: .01ms !important; }
	.lfasf--pulse:not(.is-open) .lfasf__fab { animation: none !important; }
}