/**
 * Widżet "Ostatnie wpisy" BreederCMS — domyślne style kart.
 * Nadpisywalne przez kontrolki Elementora (wyższa specyficzność via {{WRAPPER}}).
 */

.bcmse-recent-posts {
	width: 100%;
}

/* === Karta wpisu === */
.bcmse-post-card {
	background-color: #ffffff;
	border: 1px solid #e0e0e0;
	border-radius: 8px;
	overflow: hidden;
	margin-bottom: 0;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

/* === Miniaturka === */
.bcmse-post-thumbnail {
	overflow: hidden;
}

.bcmse-post-thumbnail a {
	display: block;
	line-height: 0;
}

.bcmse-post-thumbnail img {
	width: 100%;
	height: 200px;
	object-fit: cover;
	display: block;
	transition: transform 0.4s ease;
}

.bcmse-post-card:hover .bcmse-post-thumbnail img {
	transform: scale(1.05);
}

/* === Treść karty === */
.bcmse-post-content {
	padding: 20px 24px 24px;
}

/* === Tytuł === */
.bcmse-post-title {
	margin: 0 0 8px;
	font-size: 1.3em;
	font-weight: 700;
	line-height: 1.3;
}

.bcmse-post-title a {
	color: #2c3e50;
	text-decoration: none;
	transition: color 0.2s ease;
}

.bcmse-post-title a:hover {
	color: #547aa5;
}

/* === Data === */
.bcmse-post-date {
	display: block;
	margin-bottom: 12px;
	font-size: 0.85em;
	color: #7f8c8d;
}

/* === Treść wpisu === */
.bcmse-post-body {
	margin-bottom: 16px;
	color: #34495e;
	line-height: 1.6;
	font-size: 0.95em;
}

.bcmse-post-body p:last-child {
	margin-bottom: 0;
}

.bcmse-post-body img {
	max-width: 100%;
	height: auto;
	display: block;
	border-radius: 0;
}

/* === Galeria we wpisie ===
   Własny układ (flex) dla galerii klasycznej ([gallery]) i bloku „Galeria",
   niezależny od stylu pojedynczych obrazów w treści. Selektory bloku są
   celowo doszczegółowione (.has-nested-images / figure), by wygrać
   specyficznością ze stylami rdzenia WordPressa. Rozmiar miniaturki ustawiają
   kontrolki Elementora (sekcja „Galeria we wpisie") — tu tylko sensowny
   punkt wyjścia. */
.bcmse-post-body .gallery,
.bcmse-post-body .wp-block-gallery.has-nested-images {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	gap: 10px;
	margin: 16px 0;
	padding: 0;
	list-style: none;
}

.bcmse-post-body .gallery .gallery-item,
.bcmse-post-body .wp-block-gallery.has-nested-images figure.wp-block-image {
	flex: 0 0 auto;
	float: none;
	width: auto;
	max-width: 100%;
	margin: 0;
	overflow: visible; /* obwoluta jest wielkości obrazu — przycinanie zjadłoby cień */
}

.bcmse-post-body .gallery .gallery-icon {
	margin: 0;
	line-height: 0;
}

/* Klasyczna galeria bez wsparcia html5 wstawia <br style="clear:both"> co N kolumn —
   w układzie flex byłyby to puste elementy zjadające odstęp. */
.bcmse-post-body .gallery br {
	display: none;
}

.bcmse-post-body .gallery .gallery-icon a,
.bcmse-post-body .wp-block-gallery figure.wp-block-image a {
	display: block;
	line-height: 0;
}

.bcmse-post-body .gallery .gallery-item img,
.bcmse-post-body .wp-block-gallery.has-nested-images figure.wp-block-image img {
	display: block;
	width: 150px;
	height: auto;
	max-width: 100%;
	object-fit: cover;
	border: 0; /* kasuje domyślną ramkę miniaturki galerii WP */
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.bcmse-post-body .gallery .gallery-caption,
.bcmse-post-body .wp-block-gallery figcaption {
	margin: 4px 0 0;
	font-size: 0.8em;
	line-height: 1.4;
}

/* === Przycisk "Czytaj więcej" === */
.bcmse-post-read-more {
	display: inline-block;
	padding: 10px 22px;
	background-color: #547aa5;
	color: #ffffff;
	text-decoration: none;
	border-radius: 4px;
	font-size: 0.9em;
	font-weight: 600;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.bcmse-post-read-more:hover {
	background-color: #3f5f82;
	color: #ffffff;
}

/* === Przycisk "Archiwum" (pod listą wpisów) ===
   Domyślnie spójny z „Czytaj więcej"; pełny zestaw kontrolek (jak w widżecie
   „Przycisk" Elementora) w sekcji Styl → „Przycisk „Archiwum"". Wyrównanie
   idzie przez klasę na wrapperze widżetu (prefix_class), stąd selektory
   .bcmse-archive-align-*. */
.bcmse-archive-button-wrap {
	margin-top: 30px;
	text-align: left;
}

.bcmse-archive-button {
	display: inline-block;
	padding: 12px 28px;
	background-color: #547aa5;
	color: #ffffff;
	text-decoration: none;
	border-radius: 4px;
	font-size: 0.95em;
	font-weight: 600;
	line-height: 1;
	transition: all 0.3s ease;
}

.bcmse-archive-button:hover,
.bcmse-archive-button:focus {
	background-color: #3f5f82;
	color: #ffffff;
}

.bcmse-archive-align-center .bcmse-archive-button-wrap {
	text-align: center;
}

.bcmse-archive-align-right .bcmse-archive-button-wrap {
	text-align: right;
}

.bcmse-archive-align-justify .bcmse-archive-button {
	display: block;
	width: 100%;
	text-align: center;
}

/* Warianty responsywne kontrolki wyrównania (domyślne breakpointy Elementora). */
@media (max-width: 1024px) {
	.bcmse-archive-align-tablet-left .bcmse-archive-button-wrap { text-align: left; }
	.bcmse-archive-align-tablet-center .bcmse-archive-button-wrap { text-align: center; }
	.bcmse-archive-align-tablet-right .bcmse-archive-button-wrap { text-align: right; }
	.bcmse-archive-align-tablet-left .bcmse-archive-button,
	.bcmse-archive-align-tablet-center .bcmse-archive-button,
	.bcmse-archive-align-tablet-right .bcmse-archive-button { display: inline-block; width: auto; }
	.bcmse-archive-align-tablet-justify .bcmse-archive-button { display: block; width: 100%; text-align: center; }
}

@media (max-width: 767px) {
	.bcmse-archive-align-mobile-left .bcmse-archive-button-wrap { text-align: left; }
	.bcmse-archive-align-mobile-center .bcmse-archive-button-wrap { text-align: center; }
	.bcmse-archive-align-mobile-right .bcmse-archive-button-wrap { text-align: right; }
	.bcmse-archive-align-mobile-left .bcmse-archive-button,
	.bcmse-archive-align-mobile-center .bcmse-archive-button,
	.bcmse-archive-align-mobile-right .bcmse-archive-button { display: inline-block; width: auto; }
	.bcmse-archive-align-mobile-justify .bcmse-archive-button { display: block; width: 100%; text-align: center; }
}

/* === Separator między wpisami === */
.bcmse-post-separator {
	border: none;
	border-top: 1px solid #e0e0e0;
	margin: 30px auto;
	width: 100%;
}

/* === Komunikat: brak wpisów === */
.bcmse-no-posts {
	text-align: center;
	color: #7f8c8d;
	font-style: italic;
	padding: 40px 20px;
}

/* === Responsywność === */
@media (max-width: 767px) {
	.bcmse-post-content {
		padding: 16px 18px 20px;
	}

	.bcmse-post-thumbnail img {
		height: 160px;
	}

	.bcmse-post-title {
		font-size: 1.15em;
	}
}