/**
 * Academic UI — phong cách thư viện khoa học phương Tây, nhẹ & tinh tế.
 */

:root {
	--academic-bg: #f8fafc;
	--academic-surface: #ffffff;
	--academic-ink: #1e293b;
	--academic-ink-soft: #475569;
	--academic-muted: #64748b;
	--academic-line: #e2e8f0;
	--academic-line-soft: #f1f5f9;
	--academic-accent: #4b6f1c;
	--academic-accent-soft: #f3f6eb;
	--academic-radius: 10px;
	--academic-shadow: 0 1px 2px rgba(15, 23, 42, 0.04), 0 4px 16px rgba(15, 23, 42, 0.03);
}

/* Nền — giấy sạch, lưới cực nhẹ */
body {
	background-color: var(--academic-bg) !important;
	background-image:
		linear-gradient(rgba(148, 163, 184, 0.035) 1px, transparent 1px),
		linear-gradient(90deg, rgba(148, 163, 184, 0.035) 1px, transparent 1px) !important;
	background-size: 48px 48px !important;
}

::selection {
	background: rgba(26, 92, 58, 0.12);
	color: var(--academic-ink);
}

/* Header — thanh mảnh, chuyên nghiệp */
.site-header {
	background: rgba(255, 255, 255, 0.92) !important;
	border-bottom: 1px solid var(--academic-line) !important;
	box-shadow: none !important;
	backdrop-filter: blur(12px);
}

.site-header.is-scrolled {
	box-shadow: 0 1px 0 var(--academic-line), 0 8px 24px rgba(15, 23, 42, 0.04) !important;
}

.site-tagline {
	color: var(--academic-muted) !important;
	font-weight: 500;
	letter-spacing: 0.04em;
}

.wordmark {
	letter-spacing: -0.03em;
}

.wordmark span {
	color: var(--academic-accent) !important;
	font-weight: 600;
}

.main-navigation a {
	color: var(--academic-ink-soft) !important;
	font-weight: 500 !important;
	letter-spacing: 0.01em;
}

.main-navigation a:hover,
.main-navigation .current-menu-item > a {
	color: var(--academic-accent) !important;
}

.main-navigation a::after {
	height: 2px !important;
	background: var(--academic-accent) !important;
	border-radius: 0 !important;
}

/* Thanh ngữ cảnh biên tập */
.academic-context-bar {
	border-bottom: 1px solid var(--academic-line);
	background: linear-gradient(180deg, #fff 0%, var(--academic-accent-soft) 100%);
}

.academic-context-bar__inner {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.5rem 1rem;
	padding: 0.45rem 0;
	font-size: 0.75rem;
	color: var(--academic-muted);
}

.academic-context-bar__icon {
	display: inline-flex;
	color: var(--academic-accent);
	opacity: 0.85;
}

.academic-context-bar__text {
	margin: 0;
	flex: 1;
	min-width: 12rem;
}

.academic-context-bar__link {
	color: var(--academic-accent);
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
}

.academic-context-bar__link:hover {
	text-decoration: underline;
}

/* Thanh tiến độ đọc */
.reading-progress {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
	width: 0;
	height: 2px;
	background: linear-gradient(90deg, var(--academic-accent), #2e7d32);
	transition: width 0.08s linear;
	pointer-events: none;
}

/* Hero & page hero — thoáng, ít màu */
.hero,
.page-hero {
	background: linear-gradient(180deg, #fff 0%, var(--academic-bg) 100%) !important;
	border-bottom: 1px solid var(--academic-line) !important;
}

.hero h1 em {
	color: var(--academic-accent) !important;
	font-style: italic;
}

.section-kicker,
.eyebrow {
	background: var(--academic-surface) !important;
	border: 1px solid var(--academic-line) !important;
	color: var(--academic-accent) !important;
	font-weight: 600;
	letter-spacing: 0.08em !important;
}

.section-heading {
	border-bottom-color: var(--academic-line) !important;
}

.section-heading h2::after {
	width: 36px;
	height: 2px;
	background: var(--academic-accent) !important;
	border-radius: 0;
}

/* Cards — editorial, viền mảnh */
.topic-card,
.content-card,
.plant-card,
.disease-card,
.nutrient-card,
.knowledge-list > article,
.term-list article,
.search-result-card {
	border: 1px solid var(--academic-line) !important;
	border-radius: var(--academic-radius) !important;
	box-shadow: var(--academic-shadow) !important;
	background: var(--academic-surface) !important;
	transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.topic-card:hover,
.content-card:hover,
.plant-card:hover,
.disease-card:hover {
	border-color: #cbd5e1 !important;
	box-shadow: 0 4px 20px rgba(15, 23, 42, 0.06) !important;
	transform: translateY(-1px);
}

.topic-card h3,
.card-body h3,
.content-card h3 {
	color: var(--academic-ink) !important;
	font-weight: 600 !important;
}

/* Breadcrumb — kiểu tài liệu */
.breadcrumb {
	font-size: 0.75rem !important;
	color: var(--academic-muted) !important;
	letter-spacing: 0.02em;
}

.breadcrumb a {
	color: var(--academic-muted) !important;
}

.breadcrumb a:hover {
	color: var(--academic-accent) !important;
}

.breadcrumb span[aria-current="page"] {
	color: var(--academic-ink-soft);
	font-weight: 500;
}

/* Badge kiểm duyệt */
.academic-badge,
.article-meta .verified,
.meta-verified-tag {
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
	padding: 0.2rem 0.55rem;
	border-radius: 4px;
	background: var(--academic-accent-soft);
	border: 1px solid rgba(26, 92, 58, 0.15);
	color: var(--academic-accent);
	font-family: var(--font-sans) !important;
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.03em;
	text-transform: uppercase;
}

/* Toolbar học thuật */
.academic-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	width: 100%;
}

.cite-article-block {
	position: relative;
}

.cite-trigger {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	padding: 0.35rem 0.7rem;
	border: 1px solid var(--academic-line);
	border-radius: 999px;
	background: var(--academic-surface);
	color: var(--academic-ink-soft);
	font-family: var(--font-sans) !important;
	font-size: 0.75rem;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.18s ease;
}

.cite-trigger:hover,
.cite-trigger[aria-expanded="true"] {
	border-color: var(--academic-accent);
	color: var(--academic-accent);
	background: var(--academic-accent-soft);
}

.cite-panel {
	position: absolute;
	top: calc(100% + 8px);
	right: 0;
	z-index: 30;
	width: min(22rem, 90vw);
	padding: 0.85rem 1rem;
	border: 1px solid var(--academic-line);
	border-radius: var(--academic-radius);
	background: var(--academic-surface);
	box-shadow: 0 12px 32px rgba(15, 23, 42, 0.1);
}

.article-share-bar--footer .cite-panel {
	top: auto;
	bottom: calc(100% + 8px);
}

.cite-panel__label {
	margin: 0 0 0.4rem;
	font-family: var(--font-sans) !important;
	font-size: 0.65rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--academic-muted);
}

.cite-panel__text {
	margin: 0 0 0.65rem;
	padding: 0.5rem 0 0.5rem 0.65rem;
	border-left: 2px solid var(--academic-accent);
	font-size: 0.8rem;
	line-height: 1.55;
	color: var(--academic-ink-soft);
}

.cite-copy-btn {
	width: 100%;
	padding: 0.45rem 0.65rem;
	border: 1px solid var(--academic-line);
	border-radius: 6px;
	background: var(--academic-accent-soft);
	color: var(--academic-accent);
	font-family: var(--font-sans) !important;
	font-size: 0.75rem;
	font-weight: 600;
	cursor: pointer;
}

.cite-copy-btn:hover,
.cite-copy-btn.is-copied {
	background: var(--academic-accent);
	border-color: var(--academic-accent);
	color: #fff;
}

/* Khối nội dung khoa học */
.key-points,
.reference-box,
.quick-summary-box,
.warning-box,
.warning-alert-block {
	border-radius: var(--academic-radius) !important;
	border: 1px solid var(--academic-line) !important;
	box-shadow: none !important;
}

.key-points,
.reference-box {
	background: var(--academic-surface) !important;
}

.quick-summary-box {
	background: var(--academic-accent-soft) !important;
	border-color: rgba(26, 92, 58, 0.12) !important;
}

.entry-content blockquote,
.post-entry-content blockquote {
	border-left-width: 3px !important;
	border-left-color: var(--academic-accent) !important;
	background: var(--academic-line-soft) !important;
	font-style: italic;
}

.entry-content table th,
.post-entry-content table th {
	background: var(--academic-line-soft) !important;
	font-family: var(--font-sans) !important;
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

/* TOC & sidebar */
.toc-box,
.sidebar-box,
.info-panel {
	border: 1px solid var(--academic-line) !important;
	border-radius: var(--academic-radius) !important;
	box-shadow: var(--academic-shadow) !important;
	background: var(--academic-surface) !important;
}

.toc-box-title,
.sidebar-box h3 {
	font-size: 0.9rem !important;
	font-weight: 600 !important;
}

/* Nút & form */
.button,
button[type="submit"],
input[type="submit"] {
	border-radius: 6px !important;
	font-weight: 600;
	letter-spacing: 0.01em;
	box-shadow: none !important;
}

.button-secondary,
.chip {
	border-color: var(--academic-line) !important;
}

.search-form-large,
.directory-filters select,
.filter-search input {
	border-color: var(--academic-line) !important;
	border-radius: 6px !important;
}

/* Footer — tối giản học thuật */
/* Footer tối — màu chữ sáng (ghi đè main.css) */
.site-footer {
	background: linear-gradient(180deg, #3d5a18 0%, #2a3d10 100%) !important;
	color: #eef4e4 !important;
	border-top: none !important;
}

.site-footer .footer-col-title,
.site-footer h2 {
	color: #f2f8e6 !important;
}

.site-footer .footer-brand-desc,
.site-footer p,
.site-footer .footer-links a,
.site-footer .footer-contact-list a,
.site-footer .footer-contact-list span {
	color: #e8f2d8 !important;
}

.site-footer .footer-copy,
.site-footer .footer-legal a {
	color: #dce8cc !important;
}

/* Nút lên đầu trang */
.back-to-top {
	position: fixed;
	right: 1.25rem;
	bottom: 1.25rem;
	z-index: 90;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 2.5rem;
	border: 1px solid var(--academic-line);
	border-radius: 50%;
	background: var(--academic-surface);
	color: var(--academic-accent);
	box-shadow: var(--academic-shadow);
	cursor: pointer;
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: opacity 0.2s ease, visibility 0.2s ease, transform 0.2s ease, background 0.2s ease;
}

.back-to-top.is-visible {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.back-to-top:hover {
	background: var(--academic-accent);
	border-color: var(--academic-accent);
	color: #fff;
}

/* Trang chi tiết blog */
.single-post-redesign {
	background: transparent !important;
}

.single-post-redesign .article-header {
	background: #fff;
	border-bottom: 1px solid var(--academic-line);
	box-shadow: none;
}

.single-post-redesign .post-main-content {
	border-color: var(--academic-line);
	box-shadow: var(--academic-shadow);
}

@media (max-width: 767px) {
	.academic-context-bar__inner {
		font-size: 0.7rem;
	}

	.cite-panel {
		right: auto;
		left: 0;
	}

	.academic-toolbar {
		flex-direction: column;
		align-items: flex-start;
	}
}

@media print {
	.reading-progress,
	.back-to-top,
	.academic-context-bar,
	.cite-article-block,
	.article-share-bar {
		display: none !important;
	}
}