/* ============================================
   颜色主题配置文件 - 一键切换绿色/红色
   ============================================ */

/* 默认绿色主题 */
:root {
  --color-primary: #006e37;
  --color-primary-dark: #015a2e;
  --color-primary-light: #027442;
  
  --gradient-start: #006e37;
  --gradient-mid: #007787;
  --gradient-end: #007fcd;
  
  --color-fourth: #027442;
  --color-accent: #007787;
  
  --color-primary-5: rgba(0, 110, 55, 0.05);
  --color-primary-10: rgba(0, 110, 55, 0.10);
  --color-primary-20: rgba(0, 110, 55, 0.20);
  --color-primary-30: rgba(0, 110, 55, 0.30);
}

/* 红色主题 - 取消注释下面的代码块即可切换到红色 */
/*
:root {
  --color-primary: #c41e3a;
  --color-primary-dark: #a01830;
  --color-primary-light: #e03050;
  --gradient-start: #c41e3a;
  --gradient-mid: #d4a574;
  --gradient-end: #8b4513;
  --color-fourth: #a01830;
  --color-accent: #d4a574;
  --color-primary-5: rgba(196, 30, 58, 0.05);
  --color-primary-10: rgba(196, 30, 58, 0.10);
  --color-primary-20: rgba(196, 30, 58, 0.20);
  --color-primary-30: rgba(196, 30, 58, 0.30);
}
*/

/* ============================================
   颜色覆盖样式
   ============================================ */

/* 1. 导航栏渐变背景 */
.bg-gradient-primary,
[style*="background-image: linear-gradient(90deg, #006e37"] {
  background-image: linear-gradient(90deg, var(--gradient-start) 33.17%, var(--gradient-mid) 84.62%, var(--gradient-end)) !important;
}

/* 2. 主背景色 */
.bg-primary,
[class*="bg-[#006e37]"],
[class*="bg-[#027442]"] {
  background-color: var(--color-primary) !important;
}

/* 3. 主文字色 */
.text-primary,
.text-\[\#016e37\],
.text-\[\#027442\],
[class*="text-[#016e37]"],
[class*="text-[#027442]"] {
  color: var(--color-primary) !important;
}

/* 4. 边框色 */
.border-primary,
.border-fourth,
.border-\[\#027442\],
[class*="border-[#027442]"] {
  border-color: var(--color-fourth) !important;
}

/* 5. 渐变文字背景 */
.from-primary,
.from-\[\#006e37\],
[class*="from-[#006e37]"] {
  --tw-gradient-from: var(--color-primary) !important;
}

/* 6. 底部绿色条 */
.bg-\[\#027442\] {
  background-color: var(--color-fourth) !important;
}

/* 7. 按钮阴影 */
.shadow-\[3px_4px_0px_4px_\#027442\] {
  --tw-shadow: 3px 4px 0px 4px var(--color-fourth) !important;
}

/* 8. 半透明背景 */
.bg-primary\/5,
[class*="bg-primary/5"] {
  background-color: var(--color-primary-5) !important;
}

.bg-primary\/10,
[class*="bg-primary/10"] {
  background-color: var(--color-primary-10) !important;
}

.bg-primary\/20,
[class*="bg-primary/20"] {
  background-color: var(--color-primary-20) !important;
}

/* 9. 悬停效果 */
.hover\:text-primary:hover,
.hover\:text-\[\#016e37\]:hover {
  color: var(--color-primary) !important;
}

.hover\:bg-primary:hover {
  background-color: var(--color-primary) !important;
}

/* 10. 通知公告日期背景 */
.bg-fourth {
  background-color: var(--color-fourth) !important;
}

/* 11. 底部渐变 */
.bg-gradient-to-r.from-\[\#006e37\] {
  background-image: linear-gradient(to right, var(--gradient-start), var(--gradient-mid), var(--gradient-end)) !important;
}

/* 12. 专题专栏按钮背景 */
.topic-btn {
  --tw-shadow: 3px 4px 0px 4px var(--color-fourth) !important;
}

.topic-btn:hover {
  --tw-shadow: 4px 5px 0px 5px var(--color-fourth) !important;
}

/* 13. 标题高亮 */
.text-\[\#027442\],
.text-fourth {
  color: var(--color-fourth) !important;
}

/* 14. 填充色 */
.fill-primary\/20 {
  fill: var(--color-primary-20) !important;
}

/* 15. 轮播图底部条 */
.bg-\[\#027442\] {
  background-color: var(--color-fourth) !important;
}

/* 16. 悬停边框 */
.hover\:border-primary:hover {
  border-color: var(--color-primary) !important;
}

/* 17. 渐变按钮 */
.from-blue-600,
.hover\:from-blue-700 {
  --tw-gradient-from: var(--color-primary) !important;
}

/* 18. 选中状态 */
.group:hover .group-hover\:text-primary,
.group:hover .group-hover\:text-fourth {
  color: var(--color-primary) !important;
}

.group:hover .group-hover\:bg-primary {
  background-color: var(--color-primary) !important;
}

/* 19. 阴影效果 */
.hover\:shadow-\[0_4px_12px_rgba\(2\,116\,66\,0\.3\)\]:hover {
  --tw-shadow: 0 4px 12px var(--color-primary-30) !important;
}

/* 20. 打字机动画文字 */
.animate-typing {
  color: white !important;
}