/* 基础变量与重置 */
 :root {
 	--primary: #30773b;
 	--secondary: #769b63;
 	--accent: #efc86d;
 	--light: #f0f0f0;
 	--dark: #222d2d;
 	--text-color: #404040;
 	--light-gray: #fff;
 	--border-color: #eee;
 	--sidebar-width: 280px;
 	--transition: all 0.3s ease;
	--shadow: 0 2px 10px rgba(0,0,0,0.1);
 }

 * {
 	margin: 0;
 	padding: 0;
 	box-sizing: border-box;
 }

 a {
 	text-decoration: none;
 	color: var(--primary);
 }

 body {
 	font-family: 'Segoe UI', 'Microsoft YaHei', sans-serif;
 	color: var(--dark);
 	background-color: var(--light);
 	line-height: 1.6;
 	display: flex;
 	flex-direction: column;
 	min-height: 100vh;
 }

 img {
 	max-width: 100%;
 	height: auto;
 }
 /* 响应式设计 */
 @media (max-width: 768px) {
     .product-title {
         font-size: 1.5rem;
     }
     
     .thumbnail-container {
         grid-template-columns: repeat(3, 1fr);
     }
     
     .tab-header {
         overflow-x: auto;
         white-space: nowrap;
         padding-bottom: 5px;
     }
     
     .tab-btn {
         padding: 0.8rem 1rem;
     }
	 .main-image img {
	   height: 300px;
	 }
}
 /* 侧边栏样式*/
 .sidebar {
 	width: var(--sidebar-width);
 	background: linear-gradient(135deg, var(--primary), var(--secondary));
 	color: white;
 	position: fixed;
 	height: 100vh;
 	padding: 2rem 1.5rem;
 	transition: var(--transition);
 	z-index: 100;
 	box-shadow: 2px 0 10px rgba(0, 0, 0, 0.1);
 }

 .sidebar-header {
 	display: flex;
 	align-items: center;
 	margin-bottom: 2rem;
 	padding-bottom: 1rem;
 	border-bottom: 2px solid rgba(255, 255, 255, 0.2);
 }

 .logo {
 	display: flex;
 	align-items: center;
 }

 .logo-icon {
 	margin-right: 10px;
 	padding-top: 10px;
 }

 .logo-text {
 	font-size: 1.3rem;
 	font-weight: bold;
 }

 .nav-menu {
 	list-style: none;
 }

 .nav-item {
 	margin-bottom: 0.8rem;
 }

 .nav-link {
 	display: flex;
 	align-items: center;
 	color: white;
 	text-decoration: none;
 	padding: 0.8rem 1rem;
 	border-radius: 6px;
 	transition: var(--transition);
 }

 .nav-link:hover,
 .nav-link.active {
 	background-color: rgba(255, 255, 255, 0.2);
 	transform: translateX(5px);
 }

 .nav-link i {
 	margin-right: 12px;
 	font-size: 1.1rem;
 	width: 20px;
 	text-align: center;
 }

 .sidebar-footer {
 	position: absolute;
 	bottom: 2rem;
 	width: calc(100% - 3rem);
 	font-size: 0.9rem;
 	opacity: 0.8;
 }

 .sidebar-footer a {
 	color: white;

 }

 /* 主内容区域 */
 .main-content {
 	margin-left: var(--sidebar-width);
 	flex: 1;
 	transition: var(--transition);
 }

 .topbar {
 	display: flex;
 	justify-content: space-between;
 	align-items: center;
 	padding: 1.5rem 2rem;
 	background-color: white;
 	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
 	position: sticky;
 	top: 0;
 	z-index: 90;
 }

 .menu-toggle {
 	display: none;
 }

 .search-bar {
 	display: flex;
 	align-items: center;
 	background-color: var(--light);
 	border-radius: 30px;
 	padding: 0.5rem 1rem;
 	width: 300px;
 }

 .search-bar input {
 	border: none;
 	background: transparent;
 	padding: 0.5rem;
 	width: 100%;
 	outline: none;
 }

 .search-bar button {
 	background: none;
 	border: none;
 	color: var(--primary);
 	cursor: pointer;
 }

 .user-menu {
 	display: flex;
 	align-items: center;
 }

 .user-menu img {
 	width: 40px;
 	height: 40px;
 	border-radius: 50%;
 	margin-left: 1rem;
 	object-fit: cover;
 	border: 2px solid var(--accent);
 }

 /* 内容区域 */
 .content {
 	padding: 2rem;
 }

 .page-header {
 	display: flex;
 	justify-content: space-between;
 	align-items: center;
 	margin-bottom: 2rem;
 }

 .page-title {
 	font-size: 2rem;
 	color: var(--primary);
 	font-weight: 600;
 }


 /* 项目部分 */
 .section-title {
 	font-size: 1.5rem;
 	margin: 2rem 0 1.5rem;
 	color: var(--dark);
 	position: relative;
 	padding-bottom: 0.5rem;
 }

 .section-title::after {
 	content: "";
 	position: absolute;
 	bottom: 0;
 	left: 0;
 	width: 60px;
 	height: 3px;
 	background-color: var(--accent);
 }

 .projects-grid {
 	display: grid;
 	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
 	gap: 1.5rem;
 	padding-bottom: 30px;
 }

 .project-status a {
 	color: var(--primary);
 }

 .project-card {
 	background: white;
 	border-radius: 10px;
 	overflow: hidden;
 	box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
 	transition: var(--transition);
 }

 .project-card:hover {
 	transform: translateY(-5px);
 	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
 }

 .project-image {
 	height: 180px;
 	width: 100%;
 	object-fit: cover;
 }

 .project-content {
 	padding: 1.5rem;
 }

 .project-title {
 	font-size: 1.2rem;
 	margin-bottom: 0.5rem;
 	color: var(--primary);
 }

 .project-description {
 	color: #666;
 	margin-bottom: 1rem;
 	font-size: 0.95rem;
 }

 .project-meta {
 	display: flex;
 	justify-content: space-between;
 	align-items: center;
 	font-size: 0.9rem;
 	color: #888;
 }

 .project-status {
 	display: inline-block;
 	padding: 0.3rem 0.8rem;
 	border-radius: 20px;
 	font-size: 0.8rem;
 	font-weight: 500;
 }

 .status-active {
 	background-color: rgba(58, 125, 68, 0.1);
 	color: var(--primary);
 }

 .status-pending {
 	background-color: rgba(255, 209, 102, 0.2);
 	color: #b78d1b;
 }

 /* 农业新闻部分 */
 .news-card {
 	background: white;
 	border-radius: 10px;
 	padding: 1.5rem;
 	box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
 	margin-bottom: 1.5rem;
 	display: flex;
 	transition: var(--transition);
 }

 .news-card:hover {
 	transform: translateY(-3px);
 	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
 }

 .news-image {
 	width: 120px;
 	height: 120px;
 	border-radius: 8px;
 	object-fit: cover;
 	margin-right: 1.5rem;
 	flex-shrink: 0;
 }

 .news-content h3 {
 	font-size: 1.2rem;
 	margin-bottom: 0.5rem;
 	color: var(--primary);
 }

 .news-content p {
 	text-indent: 2rem;
 }

 .news-meta {
 	display: flex;
 	margin-bottom: 0.8rem;
 	font-size: 0.85rem;
 	color: #888;
 }

 .news-meta span {
 	margin-right: 1rem;
 }

 .news-meta i {
 	margin-right: 0.3rem;
 }

 .news-excerpt {
 	color: #666;
 	font-size: 0.95rem;
 	margin-bottom: 1rem;
 }

 .read-more {
 	color: var(--primary);
 	text-decoration: none;
 	font-weight: 500;
 	font-size: 0.9rem;
 	display: inline-flex;
 	align-items: center;
 }

 .read-more i {
 	margin-left: 0.3rem;
 	transition: var(--transition);
 }

 .read-more:hover i {
 	transform: translateX(3px);
 }

 .my-4 {
 	text-align: center;
 }

 .page-item,
 .page-num {
 	padding: 0.625rem;
 	margin: 0 0.5% 20px 0;
 	background-color: var(--primary);
 	border-radius: 10px;
 	color: #fff;
 }

 .page-item:hover,
 .page-num:hover {
 	background-color: var(--accent);
 	color: #000;
 }

 .position a {
 	color: var(--dark);
 }

 .clear {
 	height: 80px;
 }



 /* 布局容器 */
 .container {
 	width: 100%;
 	max-width: 1200px;
 	margin: 0 auto;
 	padding: 0 15px;
 }

 /* 头部样式 */
 .header {
 	background-color: var(--primary);
 	color: white;
 	padding: 1rem 0;
 	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
 }

 .header-container {
 	display: flex;
 	justify-content: space-between;
 	align-items: center;
 }

 .logo {
 	font-size: 1.5rem;
 	font-weight: bold;
 }

 /* 面包屑导航 */
 .breadcrumb {
 	padding: 1rem 0;
 	font-size: 0.9rem;
 }

 .breadcrumb a {
 	color: var(--primary);
 }

 .breadcrumb span {
 	margin: 0 5px;
 	color: #999;
 }

 /* 新闻详情主体 */
 .news-detail {
 	display: flex;
 	flex-wrap: wrap;
 	margin: 2rem 0;
 }

 .news-main {
 	flex: 1;
 	min-width: 0;
 	padding-right: 3rem;
 }

 .news-sidebar {
 	width: 300px;
 }

 /* 新闻标题区域 */
 .news-header {
 	margin-bottom: 2rem;
 	border-bottom: 1px solid var(--border-color);
 	padding-bottom: 1.5rem;
 }

 .news-title {
 	font-size: 2rem;
 	margin-bottom: 1rem;
 	color: var(--primary);
 	line-height: 1.3;
 }

 .news-meta {
 	display: flex;
 	flex-wrap: wrap;
 	color: #666;
 	font-size: 0.9rem;
 	margin-bottom: 1rem;
 }

 .news-meta span {
 	margin-right: 1.5rem;
 	display: flex;
 	align-items: center;
 }

 .news-meta i {
 	margin-right: 0.5rem;
 	color: var(--primary);
 }

 /* 新闻内容 */
 .news-content {
 	font-size: 1.1rem;
 	line-height: 1.8;
 }

 .news-content p {
 	margin-bottom: 1.5rem;
 }

 .news-content img {
 	max-width: 100%;
 	height: auto;
 	margin: 1.5rem 0;
 	border-radius: 5px;
	padding-right: 20%;
 }

 /* 侧边栏 */
 .sidebar-widget {
 	background-color: var(--light-gray);
 	border-radius: 5px;
 	padding: 1.5rem;
 	margin-bottom: 2rem;
 }

 .widget-title {
 	font-size: 1.2rem;
 	margin-bottom: 1rem;
 	padding-bottom: 0.5rem;
 	border-bottom: 2px solid var(--accent);
 	color: var(--primary);
 }

 .related-news {
 	list-style: none;
 }

 .related-news li {
 	padding: 0.8rem 0;
 	border-bottom: 1px dashed var(--border-color);
 }

 .related-news li:last-child {
 	border-bottom: none;
 }

 .related-news a {
 	display: block;
 	color: var(--text-color);
 	transition: color 0.3s;
 }

 .related-news a:hover {
 	color: var(--primary);
 }

 .related-news .date {
 	font-size: 0.8rem;
 	color: #999;
 	margin-top: 0.3rem;
 }

 .news-desc {
 	background-color: var(--light-gray);
 	padding: 10px;
 	border-radius: 5px;
	margin-bottom: 15px;
	font-size: 1.1rem;
	line-height: 1.8;
	color: var(--text-color);
 }
 .news-desc p{
	 display: inline;
	 color: var(--text-color);
 }

 .news-sm {
 	background-color: var(--light-gray);
 	padding: 10px;
 	border-radius: 5px;
 }

 .news-sm p {
 	display: inline;
 }

 .news-navigation {
 	display: flex;
 	justify-content: space-between;
 	margin: 2rem 0;
 	padding: 1.5rem 0;
 	border-top: 1px solid var(--border-color);
 	border-bottom: 1px solid var(--border-color);
 }

 .news-nav-item {
 	max-width: 45%;
 }

 .news-nav-item span {
 	display: block;
 	color: #666;
 	font-size: 0.9rem;
 	margin-bottom: 0.5rem;
 }

 /* 页脚 */
 .footer {
 	background-color: var(--primary);
 	color: white;
 	padding: 2rem 0;
 	text-align: center;
 	margin-top: 3rem;
 }

 .footer p {
 	margin-bottom: 0.5rem;
 }

 /* 响应式设计 */
 @media (max-width: 992px) {
 	.news-main {
 		margin-bottom: 2rem;
 	}

 	.news-sidebar {
 		width: 100%;
 	}

 	.news-title {
 		font-size: 1.8rem;
 	}
 }

 @media (max-width: 768px) {
 	.news-title {
 		font-size: 1.5rem;
 	}

 	.news-meta span {
 		margin-right: 1rem;
 		margin-bottom: 0.5rem;
 	}

 	.news-navigation {
 		flex-direction: column;
 	}

 	.news-nav-item {
 		max-width: 100%;
 		margin-bottom: 1rem;
 	}

 	.news-nav-item:last-child {
 		margin-bottom: 0;
 	}
 }

 /* 响应式设计 */
 @media (max-width: 992px) {
 	.sidebar {
 		transform: translateX(-100%);
 		width: 280px;
 	}

 	.sidebar.active {
 		transform: translateX(0);
 	}

 	.main-content {
 		margin-left: 0;
 	}

 	.menu-toggle {
 		display: block;
 		background: none;
 		border: none;
 		font-size: 1.5rem;
 		color: var(--primary);
 		cursor: pointer;
 	}
 }

 @media (max-width: 768px) {
 	.topbar {
 		flex-direction: column;
 		align-items: flex-start;
 		padding: 1rem;
 	}

 	.search-bar {
 		width: 100%;
 		margin-top: 1rem;
 	}

 	.news-card {
 		flex-direction: column;
 	}

 	.news-image {
 		width: 100%;
 		height: 180px;
 		margin-right: 0;
 		margin-bottom: 1rem;
 	}

 	.pagination a:nth-child(2),
 	.pagination a:nth-last-child(2) {
 		display: none;
 	}
 }

 @media (max-width: 576px) {
 	.stats-grid {
 		grid-template-columns: 1fr;
 	}

 	.projects-grid {
 		grid-template-columns: 1fr;
 	}

 	.content {
 		padding: 1.5rem 1rem;
 	}
 }

 @media (max-width: 768px) {
 	.sidebar {
 		position: fixed;
 		top: 0;
 		left: -280px;
 		width: 280px;
 		height: 100vh;
 		z-index: 1000;
 		transition: left 0.3s ease;
 		background: var(--secondary);
 		box-shadow: 2px 0 10px rgba(0, 0, 0, 0.1);
 		overflow-y: auto;
 	}
	.news-main {
		padding-right: 0.1rem;
	}

 	.sidebar.active {
 		left: 0;
 	}

 	/* 调整顶部导航栏样式 */
 	.topbar {
 		position: sticky;
 		top: 0;
 		z-index: 500;
 		background: #fff;
 		padding: 10px 15px;
 		box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
 	}

 	/* 遮罩层 */
 	.sidebar-overlay {
 		position: fixed;
 		top: 0;
 		left: 0;
 		right: 0;
 		bottom: 0;
 		background: rgba(0, 0, 0, 0.5);
 		z-index: 998;
 		display: none;
 	}

 	.sidebar-overlay.active {
 		display: block;
 	}

 	.menu-toggle {
 		display: block;
 	}

 	.user-menu {
 		display: none;
 	}
 }

 /* 桌面端隐藏菜单按钮 */
 @media (min-width: 769px) {
 	.menu-toggle {
 		display: none;
 	}
	
 }

 

 /* 头部样式 */
 .header {
     background-color: var(--primary);
     color: white;
     padding: 1rem 0;
     box-shadow: var(--shadow);
     position: sticky;
     top: 0;
     z-index: 100;
 }
 
 .header-container {
     display: flex;
     justify-content: space-between;
     align-items: center;
 }
 
 .logo {
     font-size: 1.5rem;
     font-weight: bold;
 }
 
 /* 面包屑导航 */
 .breadcrumb {
     padding: 1rem 0;
     font-size: 0.9rem;
 }
 
 .breadcrumb a {
     color: var(--primary);
 }
 
 .breadcrumb span {
     margin: 0 5px;
     color: #999;
 }
 
 /* 产品详情主体 */
 .product-detail {
     display: flex;
     flex-wrap: wrap;
     margin: 2rem 0;
     gap: 2rem;
 }
 
 .product-gallery {
     flex: 1;
     min-width: 300px;
 }
 
 .product-info {
     flex: 1;
     min-width: 300px;
 }
 
 /* 产品图片展示 */
 .main-image {
     border-radius: 8px;
     overflow: hidden;
     margin-bottom: 1rem;
     box-shadow: var(--shadow);
 }
 
 .main-image img {
     width: 100%;
     height: 500px;
     display: block;
	 overflow: hidden;
 }
 
 .thumbnail-container {
     display: grid;
     grid-template-columns: repeat(4, 1fr);
     gap: 1rem;
 }
 
 .thumbnail {
     border-radius: 5px;
     overflow: hidden;
     cursor: pointer;
     border: 2px solid transparent;
     transition: all 0.3s ease;
 }
 
 .thumbnail:hover {
     border-color: var(--primary);
 }
 
 .thumbnail.active {
     border-color: var(--accent);
 }
 
 /* 产品信息 */
 .product-title {
     font-size: 2rem;
     margin-bottom: 1rem;
     color: var(--primary);
     line-height: 1.3;
 }
 
 .product-meta {
     display: flex;
     flex-wrap: wrap;
     gap: 1rem;
     margin-bottom: 1.5rem;
     color: #666;
     font-size: 0.9rem;
 }
 
 .product-price {
     font-size: 1.8rem;
     color: #e74c3c;
     font-weight: bold;
     margin: 1.5rem 0;
 }
 
 .original-price {
     text-decoration: line-through;
     color: #999;
     font-size: 1.2rem;
     margin-left: 0.5rem;
 }
 
 .product-description {
     margin-bottom: 2rem;
     line-height: 1.8;
 }
 
 /* 产品属性 */
 .product-attributes {
     margin-bottom: 2rem;
 }
 
 .attribute {
     display: flex;
     margin-bottom: 0.8rem;
 }
 
 .attribute-label {
     width: 100px;
     font-weight: bold;
     color: var(--primary);
 }
 
 .attribute-value {
     flex: 1;
 }
 
 input[type="number"] {
     -moz-appearance: textfield;
 }
 /* 购买表单 */
 .purchase-form {
     background-color: var(--light-gray);
     padding: 1.5rem;
     border-radius: 8px;
 }
 
 .quantity-selector {
     display: flex;
     align-items: center;
     margin-bottom: 1.5rem;
 }
 
 .quantity-btn {
     width: 40px;
     height: 40px;
     background-color: white;
     border: 1px solid var(--border-color);
     font-size: 1.2rem;
     cursor: pointer;
 }
 
 .quantity-input {
     width: 60px;
     height: 40px;
     text-align: center;
     border: 1px solid var(--border-color);
     border-left: none;
     border-right: none;
     font-size: 1rem;
 }
 
 .btn {
     display: inline-block;
     padding: 0.8rem 1.5rem;
     background-color: var(--primary);
     color: white;
     border: none;
     border-radius: 5px;
     font-size: 1rem;
     cursor: pointer;
     transition: all 0.3s ease;
     margin-right: 1rem;
     margin-bottom: 1rem;
 }
 
 .btn:hover {
     background-color: var(--secondary);
     transform: translateY(-2px);
 }
 
 .btn-outline {
     background-color: transparent;
     border: 1px solid var(--primary);
     color: var(--primary);
 }
 
 .btn-outline:hover {
     background-color: var(--primary);
     color: white;
 }
 
 /* 产品详情标签页 */
 .product-tabs {
     margin: 3rem 0;
     width: 100%;
 }
 
 .tab-header {
     display: flex;
     border-bottom: 1px solid var(--border-color);
     margin-bottom: 1.5rem;
 }
 
 .tab-btn {
     padding: 0.8rem 1.5rem;
     background: none;
     border: none;
     border-bottom: 3px solid transparent;
     font-size: 1rem;
     cursor: pointer;
     transition: all 0.3s ease;
 }
 
 .tab-btn.active {
     border-bottom-color: var(--primary);
     color: var(--primary);
     font-weight: bold;
 }
 
 .tab-content {
     display: none;
     padding: 1.5rem;
     background-color: var(--light-gray);
     border-radius: 5px;
 }
 
 .tab-content.active {
     display: block;
 }
 
 /* 相关产品 */
 .related-products {
     margin: 3rem 0;
 }
 
 .section-title {
     font-size: 1.5rem;
     margin-bottom: 1.5rem;
     color: var(--primary);
     position: relative;
     padding-bottom: 0.5rem;
 }
 
 .section-title::after {
     content: "";
     position: absolute;
     bottom: 0;
     left: 0;
     width: 60px;
     height: 3px;
     background-color: var(--accent);
 }
 
 .products-grid {
     display: grid;
     grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
     gap: 1.5rem;
 }
 
 .product-card {
     background: white;
     border-radius: 8px;
     overflow: hidden;
     box-shadow: var(--shadow);
     transition: all 0.3s ease;
 }
 
 .product-card:hover {
     transform: translateY(-5px);
     box-shadow: 0 5px 15px rgba(0,0,0,0.15);
 }
 
 .product-card-img {
     height: 200px;
     width: 100%;
     object-fit: cover;
 }
 
 .product-card-body {
     padding: 1rem;
 }
 
 .product-card-title {
     font-size: 1.1rem;
     margin-bottom: 0.5rem;
     color: var(--primary);
 }
 
 .product-card-price {
     color: #e74c3c;
     font-weight: bold;
 }
 
 /* 页脚 */
 .footer {
     background-color: var(--primary);
     color: white;
     padding: 2rem 0;
     text-align: center;
     margin-top: 3rem;
 }
 
 .footer p {
     margin-bottom: 0.5rem;
 }