/*  ################################################################

  File Name: blog.css
  Template Name: Fancy
  Created By: justthemevalley 

 


################################################################# */
.blog-wrapper {
	margin-bottom: 30px;
	padding: 10px 10px 20px;
	background: #fff;
}

	.blog-wrapper .page-title {
		padding-top: 5px;
	}

.entry-photo {
	position: relative;
}

ul.blog-posts {
	margin: 0 -15px;
}

#columns {
	padding-top: 16px;
	padding-bottom: 30px;
}
/*--------------
16.1 Left column
*/
/* ----------------
 [20. Bolog page]
 */
.blog-posts {
	line-height: 22px;
	margin: auto;
	font-size: 13px;
}

	.blog-posts .post-item {
		padding-bottom: 15px;
		padding-top: 25px;
		list-style: outside none none;
	}

	.blog-posts.blog-wrapper .post-item {
		border: none;
	}

	.blog-posts.blog-wrapper h3 {
		margin-top: 15px;
	}

	.blog-posts .post-item:last-child {
		border-bottom: 0px solid #eaeaea;
		padding-bottom: 10px;
	}

	.blog-posts .post-item .entry-meta-data {
		padding: 5px 0;
		color: #666;
		font-size: 13px;
	}

		.blog-posts .post-item .entry-meta-data span {
			margin-right: 12px;
			border-right: 0px #ddd solid;
			padding-right: 10px;
		}

			.blog-posts .post-item .entry-meta-data span:last-child {
				margin-right: 12px;
				border-right: 0px #ddd solid;
				padding-right: 10px;
				float: right;
			}

		.blog-posts .post-item .entry-meta-data .author .fa {
			opacity: 0.7;
		}

		.blog-posts .post-item .entry-meta-data .fa {
			line-height: inherit;
		}

	.blog-posts .post-item .entry-more {
		margin-top: 15px;
	}

	.entry-thumb img {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		object-fit: cover; /* Giúp ảnh không bị méo tỷ lệ */
		border: 1px solid #eaeaea;
		max-width: none; /* Bỏ max-width cũ để không xung đột với width: 100% */
	}
/** post sidebar **/
/* Recent Comments*/
/** Blog detail **/
.entry-detail {
	margin-bottom: 30px;
	font-size: 15px;
}

	.entry-detail .page-title {
		margin-bottom: 12px;
	}

.entry-title a {
	font-size: 18px;
	display: inherit;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	padding: 0px;
}

.entry-thumb {
	margin-bottom: 12px;
	position: relative;
	width: 100%;
	padding-top: 67%; /* Fallback cho trình duyệt cũ */
	aspect-ratio: 3/2;
	background: #f5f5f5;
	overflow: hidden;
}

.entry-excerpt {
	font-size: 15px;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2; /* number of lines to show */
	line-height: 22px; /* fallback */
	height: 44px;
}

.entry-detail .entry-meta-data {
	padding: 12px 0px 0px;
	color: #666;
}

	.entry-detail .entry-meta-data .fa {
		line-height: inherit;
	}

	.entry-detail .entry-meta-data span {
		margin-right: 10px;
	}

	.entry-detail .entry-meta-data .author .fa {
		opacity: 0.7;
	}

	.entry-detail .entry-meta-data .rating {
		float: right;
	}

.entry-tags span {
	text-transform: uppercase;
}
/*      Blockquotes  */
/** COMMMENT list**/
/**Related Posts**/
.blog-posts.blog-wrapper {
	margin: auto -15px;
	list-style: outside none none;
}
/* ===== Lưới tin tức đơn giản (post.grid_simple): N cột theo cài đặt ===== */
.pgs {
	display: grid;
	gap: 24px 20px;
	margin-bottom: 20px;
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.pgs-cols-1 {
	grid-template-columns: minmax(0, 1fr);
}

.pgs-cols-2 {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.pgs-cols-3 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.pgs-cols-4 {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.pgs-cols-6 {
	grid-template-columns: repeat(6, minmax(0, 1fr));
}

.pgs-item {
	min-width: 0;
}

.pgs-thumb {
	display: block;
	position: relative;
	overflow: hidden;
	aspect-ratio: 16 / 10;
	background: #eceff1;
}

	.pgs-thumb img {
		position: absolute;
		inset: 0;
		width: 100%;
		height: 100%;
		object-fit: cover;
		transition: transform .35s ease;
	}

	.pgs-thumb:hover img {
		transform: scale(1.04);
	}

.pgs-desc {
	padding-top: 10px;
}

.pgs-cat {
	display: inline-block;
	margin-bottom: 4px;
	font-size: 14px;
	color: #e8401c;
	text-decoration: none;
}

	.pgs-cat:hover {
		text-decoration: underline;
	}

.pgs-title {
	margin: 0 0 8px;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.45;
}

	.pgs-title a {
		color: #222;
		text-decoration: none;
	}

		.pgs-title a:hover {
			color: #e8401c;
		}

.pgs-excerpt {
	margin: 0;
	font-size: 15px;
	line-height: 1.6;
	color: #555;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* Cột dày thì thu gọn chữ */
.pgs-cols-4 .pgs-title, .pgs-cols-6 .pgs-title {
	font-size: 16px;
}

.pgs-cols-6 .pgs-excerpt {
	display: none;
}

/* Responsive: tablet tối đa 2 cột (6 cột → 3), mobile 1 cột (6 cột → 2) */
@media (max-width: 991px) {
	.pgs-cols-3, .pgs-cols-4 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.pgs-cols-6 {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 575px) {
	.pgs-cols-2, .pgs-cols-3, .pgs-cols-4 {
		grid-template-columns: minmax(0, 1fr);
	}

	.pgs-cols-6 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}