/*
Theme Name: News Framework
Description: Theme khung cho báo điện tử. Bản thân theme không quy định giao diện cuối — giao diện do các "skin" trong thư mục /skins quyết định. Admin chọn skin trong Giao diện → News Skins, có thể gán skin riêng cho từng chuyên mục.
Version: 0.6.2
Requires PHP: 7.4
Text Domain: news-framework
*/

/* CSS nền tối thiểu (layout khung). Mỗi skin nạp style riêng đè lên lớp này. */
*,
*::before,
*::after { box-sizing: border-box; }

body {
	margin: 0;
	font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	line-height: 1.6;
	color: #1a1a1a;
}

a { color: inherit; }

.nf-container {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 16px;
}

.newscore-ad {
	margin: 16px 0;
	text-align: center;
}

/* Layout trang chủ: nội dung + sidebar (skin có thể override hoàn toàn). */
.nf-home {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 16px;
}

.nf-home.nf-has-sidebar {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 320px;
	gap: 32px;
	align-items: start;
}

.nf-module {
	margin: 0 0 32px;
}

.nf-module-title {
	margin: 0 0 16px;
	font-size: 1.25rem;
}

.nf-article-list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 24px;
}

/* Khối Hero: tin chủ + danh sách tin phụ. */
.nf-hero {
	display: grid;
	grid-template-columns: 1.7fr 1fr;
	gap: 24px;
	align-items: start;
}

.nf-hero-lead-thumb img,
.nf-hero-side-thumb img {
	width: 100%;
	object-fit: cover;
	display: block;
}

.nf-hero-lead-title {
	font-size: 1.6rem;
	line-height: 1.25;
	margin: 8px 0;
}

.nf-hero-side {
	list-style: none;
	margin: 0;
	padding: 0;
}

.nf-hero-side-item {
	display: grid;
	grid-template-columns: 90px 1fr;
	gap: 10px;
	padding: 10px 0;
	border-bottom: 1px solid #eee;
}

.nf-hero-side-thumb img { height: 60px; }

.nf-hero-side-title { margin: 0; font-size: 0.95rem; line-height: 1.3; }

@media (max-width: 860px) {
	.nf-hero { grid-template-columns: 1fr; }
}

/* Khối "Đọc nhiều" dạng xếp hạng. */
.nf-rank-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.nf-rank-item {
	display: flex;
	gap: 12px;
	padding: 10px 0;
	border-bottom: 1px solid #eee;
}

.nf-rank-num {
	font-size: 1.4rem;
	font-weight: 700;
	line-height: 1;
	color: #c00;
	min-width: 28px;
	text-align: center;
}

.nf-rank-title {
	margin: 0;
	font-size: 1rem;
}

.nf-rank-views {
	font-size: 0.8rem;
	color: #777;
}

/* Sidebar. */
.nf-widget {
	margin: 0 0 28px;
}

.nf-widget-title {
	font-size: 1.05rem;
	margin: 0 0 12px;
	padding-bottom: 6px;
	border-bottom: 2px solid #c00;
}

@media (max-width: 860px) {
	.nf-home.nf-has-sidebar {
		grid-template-columns: 1fr;
	}
}

/* Breadcrumb. */
.nf-breadcrumb ol {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0 0 16px;
	padding: 0;
	font-size: 13px;
	color: #777;
}
.nf-breadcrumb li + li::before { content: "›"; margin-right: 6px; color: #bbb; }
.nf-breadcrumb a { text-decoration: none; }

/* Bài liên quan. */
.nf-related { margin-top: 32px; }
.nf-related-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
	gap: 18px;
}
.nf-related-thumb img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.nf-related-item-title { font-size: 0.95rem; line-height: 1.35; margin: 8px 0 0; }