/**
 * Réseaux sociaux (1.2.5) — carrousel Instagram + carte Facebook.
 * Couleurs : --wp-scm-social-btn-bg / --wp-scm-social-btn-fg / --wp-scm-social-accent (réglages).
 */
.wp-scm-social { width: 100%; box-sizing: border-box; }

/* Bouton commun */
.wp-scm-social__btn-wrap { text-align: center; margin-top: 8px; }
.wp-scm-social__btn {
	display: inline-block;
	padding: 7px 18px;
	background: var(--wp-scm-social-btn-bg, #333);
	color: var(--wp-scm-social-btn-fg, #fff);
	text-decoration: none;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	border: 0;
	border-radius: 3px;
	cursor: pointer;
	transition: filter 0.2s;
}
.wp-scm-social__btn:hover { filter: brightness(1.25); color: var(--wp-scm-social-btn-fg, #fff); }
.wp-scm-social__admin-note { font-size: 13px; color: #a12626; }

/* Instagram — dispositions (1.2.6). --wp-scm-insta-cols / -gap / -radius posés par le rendu ;
   --c = colonnes effectives, réduites sur tablette et mobile. */
.wp-scm-insta { --c: var(--wp-scm-insta-cols, 5); }
.wp-scm-insta__wrap { position: relative; overflow: hidden; }
.wp-scm-insta__track { display: flex; transition: transform 0.35s ease; margin: 0 calc(var(--wp-scm-insta-gap, 4px) / -2); }
.wp-scm-insta__item { flex: 0 0 calc(100% / var(--c)); box-sizing: border-box; padding: calc(var(--wp-scm-insta-gap, 4px) / 2); }
.wp-scm-insta__item a { position: relative; display: block; overflow: hidden; border-radius: var(--wp-scm-insta-radius, 0); }
.wp-scm-insta__item img { width: 100%; aspect-ratio: 1; object-fit: cover; display: block; border-radius: var(--wp-scm-insta-radius, 0); }
.wp-scm-insta__caption {
	position: absolute;
	left: 0; right: 0; bottom: 0;
	padding: 6px 8px;
	background: rgba(0, 0, 0, 0.62);
	color: #fff;
	font-size: 12px;
	line-height: 1.3;
	opacity: 0;
	transition: opacity 0.2s;
	pointer-events: none;
}
.wp-scm-insta__item a:hover .wp-scm-insta__caption,
.wp-scm-insta__item a:focus .wp-scm-insta__caption { opacity: 1; }

/* Grille : toutes les photos, par lignes */
.wp-scm-insta--grid .wp-scm-insta__track {
	display: grid;
	grid-template-columns: repeat(var(--c), 1fr);
	gap: var(--wp-scm-insta-gap, 4px);
	margin: 0;
	transform: none !important;
}
.wp-scm-insta--grid .wp-scm-insta__item { flex: none; padding: 0; }

/* Bandeau : une seule ligne, le reste est masqué */
.wp-scm-insta--strip .wp-scm-insta__track {
	display: grid;
	grid-template-columns: repeat(var(--c), 1fr);
	grid-template-rows: auto; /* 1re ligne visible */
	grid-auto-rows: 0;        /* lignes suivantes masquées */
	gap: 0 var(--wp-scm-insta-gap, 4px);
	margin: 0;
	overflow: hidden;
	transform: none !important;
}
.wp-scm-insta--strip .wp-scm-insta__item { flex: none; padding: 0; }
.wp-scm-insta__arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 10;
	background: rgba(0, 0, 0, 0.45);
	color: var(--wp-scm-social-accent, #c00);
	border: none;
	width: 30px;
	height: 30px;
	font-size: 16px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	transition: background 0.2s;
}
.wp-scm-insta__arrow:hover { background: rgba(0, 0, 0, 0.75); }
.wp-scm-insta__arrow:disabled { opacity: 0.25; cursor: default; }
.wp-scm-insta__arrow--prev { left: 4px; }
.wp-scm-insta__arrow--next { right: 4px; }
@media (max-width: 1024px) { .wp-scm-insta { --c: min(var(--wp-scm-insta-cols, 5), 3); } }
@media (max-width: 767px)  { .wp-scm-insta { --c: min(var(--wp-scm-insta-cols, 5), 2); } }
@media (max-width: 480px)  { .wp-scm-insta { --c: min(var(--wp-scm-insta-cols, 5), 1); } .wp-scm-insta--grid, .wp-scm-insta--strip { --c: min(var(--wp-scm-insta-cols, 5), 2); } }

/* Facebook — module officiel */
.wp-scm-fb--official { text-align: center; }
.wp-scm-fb__frame { border: none; overflow: hidden; max-width: 100%; }
.wp-scm-fb__gate {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	max-width: 100%;
	padding: 16px 18px;
	border: 1px solid #e0e0e0;
	border-radius: 8px;
	background: #fafafa;
	text-align: center;
}
.wp-scm-fb__consent { margin: 0; font-size: 13px; color: #555; max-width: 340px; }
.wp-scm-fb__direct { font-size: 12px; }

/* Facebook — carte simple */
.wp-scm-fb--simple {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 12px;
	border: 1px solid #e0e0e0;
	border-radius: 8px;
	background: #fff;
}
.wp-scm-fb__logo { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; flex: 0 0 56px; }
.wp-scm-fb__body { flex: 1; min-width: 0; display: flex; flex-direction: column; text-align: left; }
.wp-scm-fb__name { font-weight: 700; }
.wp-scm-fb__followers { font-size: 13px; color: #666; }
.wp-scm-fb--simple .wp-scm-fb__btn { flex: 0 0 auto; }
@media (max-width: 480px) {
	.wp-scm-fb--simple { flex-wrap: wrap; justify-content: center; text-align: center; }
	.wp-scm-fb__body { text-align: center; flex-basis: 100%; }
}
