/* ---------- Frontend: rejilla del feed ---------- */

.sfm-feed-grid {
	display: grid;
	grid-template-columns: repeat(var(--sfm-columns, 3), 1fr);
	gap: 20px;
	margin: 20px 0;
}

.sfm-feed-item {
	display: flex;
	justify-content: center;
	overflow: hidden;
}

.sfm-feed-item > * {
	max-width: 100%;
}

.sfm-feed-widget.sfm-feed-grid {
	grid-template-columns: 1fr;
	gap: 16px;
}

.sfm-empty {
	opacity: 0.7;
	font-style: italic;
}

/* ---------- Frontend: botón "Cargar más" ---------- */

.sfm-load-more-container {
	display: flex;
	justify-content: center;
	margin-top: 24px;
}

.sfm-load-more-button {
	background: #1d2327;
	color: #fff;
	border: none;
	border-radius: 4px;
	padding: 10px 28px;
	font-size: 14px;
	cursor: pointer;
	transition: opacity 0.15s ease;
}

.sfm-load-more-button:hover:not(:disabled) {
	opacity: 0.85;
}

.sfm-load-more-button:disabled {
	opacity: 0.6;
	cursor: default;
}

/* Responsive: en pantallas pequeñas, una sola columna siempre */
@media (max-width: 700px) {
	.sfm-feed-grid {
		grid-template-columns: 1fr;
	}
}

/* ---------- Admin: paneles del plugin ---------- */

.sfm-admin-wrap .sfm-admin-card {
	background: #fff;
	border: 1px solid #c3c4c7;
	border-radius: 4px;
	padding: 16px 20px;
	margin-top: 20px;
	max-width: 900px;
}

.sfm-admin-wrap .sfm-admin-card h2 {
	margin-top: 0;
}