/**
 * Accessibility Fixes
 *
 * 修复对比度和可访问性问题
 * 确保 WCAG 2.1 AA 标准合规
 *
 * @package Zhangbangbang
 * @since 1.0.0
 */

/* ============================================================
   对比度修复 - 确保文字与背景对比度 >= 4.5:1
   ============================================================ */

/* 灰色文字对比度修复 - 浅色背景上使用深色文字 */
.zbb-gray-500,
.zbb-text-muted,
.zbb-site-description,
.zbb-section-subtitle,
.zbb-service-desc,
.zbb-feature-desc,
.zbb-card-text,
.zbb-contact-note {
	color: #595959;
	/* 在浅色背景上对比度 7:1 */
}

/* 页脚文字对比度修复 - 深色背景 #212529 上使用浅色文字 */
.zbb-footer-desc,
.zbb-copyright,
.zbb-copyright p,
.zbb-copyright a {
	color: #9ca3af !important;
	/* 在深色背景上对比度 4.6:1，满足 WCAG AA 标准 */
}

/* 博客列表日期对比度修复 */
.zbb-blog-list-date,
.zbb-blog-featured-date {
	color: #6b7280;
	/* 从 #adb5bd 改为更深的灰色，对比度 5.4:1 */
}

/* 页脚灰色文字修复 */
.zbb-footer-menu a,
.zbb-contact-list .zbb-contact-item,
.zbb-qr-text {
	color: #9ca3af;
	/* 从 #6c757d 改为更亮的灰色，在深色背景上对比度 4.5:1 */
}

.zbb-footer-menu a:hover,
.zbb-contact-list .zbb-contact-item a:hover {
	color: #ffffff;
}

/* Header top 区域文字 */
.zbb-header-top,
.zbb-header-contact .zbb-contact-item a {
	color: #d1d5db;
	/* 确保在深色背景上可读 */
}

/* 表单占位符文字 */
.zbb-form-control::placeholder {
	color: #6b7280;
	/* 从 #adb5bd 改为更深的颜色 */
}

/* Hero 区域半透明文字修复 */
.zbb-hero-subtitle,
.zbb-hero-feature {
	color: rgba(255, 255, 255, 0.95);
	/* 从 0.9 提高到 0.95 */
}

/* CTA 区域文字 */
.zbb-cta-desc {
	color: rgba(255, 255, 255, 0.95);
}

/* 链接焦点状态 - 可访问性必需 */
a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus,
.zbb-btn:focus {
	outline: 2px solid var(--zbb-primary, #1a5fb4);
	outline-offset: 2px;
}

/* 跳过链接样式 */
.skip-link:focus {
	position: fixed;
	top: 10px;
	left: 10px;
	z-index: 10000;
	padding: 15px 20px;
	background: #1a5fb4;
	color: #ffffff;
	font-weight: 600;
	text-decoration: none;
	border-radius: 4px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

/* 确保按钮文字可读 */
.zbb-btn-secondary {
	color: #1a1a1a;
	/* 确保在黄色背景上可读 */
}

/* 禁用状态对比度 */
.zbb-btn:disabled,
.zbb-form-control:disabled {
	opacity: 0.65;
	cursor: not-allowed;
}

/* ============================================================
   减少动画 - 尊重用户偏好
   ============================================================ */

@media (prefers-reduced-motion: reduce) {

	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}

	.zbb-back-to-top,
	[data-aos],
	[data-animate] {
		transition: none !important;
		animation: none !important;
		opacity: 1 !important;
		transform: none !important;
	}
}

/* ============================================================
   高对比度模式支持
   ============================================================ */

@media (prefers-contrast: high) {
	:root {
		--zbb-primary: #0056b3;
		--zbb-gray-600: #333333;
	}

	.zbb-btn {
		border-width: 3px;
	}

	.zbb-card,
	.zbb-feature-item {
		border: 2px solid #333333;
	}
}

/* ============================================================
   焦点可见性增强
   ============================================================ */

/* 仅在键盘导航时显示焦点环 */
:focus:not(:focus-visible) {
	outline: none;
}

:focus-visible {
	outline: 3px solid #1a5fb4;
	outline-offset: 2px;
}

/* 菜单项焦点 */
.zbb-primary-menu a:focus-visible {
	background-color: rgba(26, 95, 180, 0.15);
	border-radius: 4px;
}

/* ============================================================
   屏幕阅读器专用样式
   ============================================================ */

.screen-reader-text,
.sr-only {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus,
.sr-only:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	clip-path: none;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-weight: bold;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}

/* ============================================================
   弹窗标题样式（使用 p 标签避免标题层级跳跃）
   ============================================================ */

.zbb-modal-title {
	font-size: 1.25rem;
	font-weight: 600;
	margin: 0 0 1rem;
	color: #1a1a1a;
	text-align: center;
}

/* ============================================================
   表单元素对比度修复 - Lighthouse报告的问题
   ============================================================ */

/* 可选标签 - 从 #adb5bd 改为更深的颜色 */
.zbb-optional {
	color: #6b7280 !important;
	/* 对比度 5.4:1，满足 WCAG AA 标准 */
}

/* 字符计数器 - 从 #adb5bd 改为更深的颜色 */
.zbb-char-count {
	color: #6b7280 !important;
	/* 对比度 5.4:1 */
}

/* 表单隐私说明 - 确保足够对比度 */
.zbb-form-privacy {
	color: #6b7280 !important;
	/* 对比度 5.4:1 */
}

/* CTA表单区域的隐私说明（白色背景表单内） */
.zbb-cta-contact__form-wrapper .zbb-form-privacy,
.zbb-cta-contact__form-inner .zbb-form-privacy {
	color: #6b7280 !important;
	/* 白色背景上对比度 5.4:1，满足 WCAG AA 标准 */
}

/* 确保所有浅灰色文字在白色背景上可读 */
.zbb-text-gray-500,
.zbb-form-hint,
.zbb-input-hint {
	color: #6b7280 !important;
}

/* 服务CTA区域段落文字 */
.zbb-service-cta p {
	color: #6b7280 !important;
	/* 对比度 5.4:1 */
}

/* 博客列表元数据 - 日期、作者、阅读时间 */
.zbb-post-date,
.zbb-post-date time,
.zbb-post-author,
.zbb-post-reading-time,
.zbb-post-list-meta span {
	color: #6b7280 !important;
	/* 对比度 5.4:1，满足 WCAG AA 标准 */
}

/* 侧边栏热门文章日期 */
.zbb-popular-post-date {
	color: #6b7280 !important;
	/* 对比度 5.4:1 */
}

/* ============================================================
   文章页面对比度修复 - Lighthouse 审查问题
   ============================================================ */

/* 文章元信息时间 - 从 #adb5bd 改为更深的颜色 */
.zbb-article-meta-minimal time,
.zbb-article-meta-bar time,
.zbb-meta-left time {
	color: #6b7280 !important;
	/* 从 #adb5bd (对比度 2.07) 改为 #6b7280 (对比度 5.4:1) */
}

/* 作者简介 - 从 #6c757d 改为更深的颜色（在灰色背景上） */
.zbb-author-bio {
	color: #4b5563 !important;
	/* 从 #6c757d (对比度 4.44 在 #f8f9fa 上) 改为 #4b5563 (对比度 6.26:1) */
}

/* 文章导航"上一篇/下一篇"标签 */
.zbb-post-nav-label {
	color: #6b7280 !important;
	/* 从 #adb5bd (对比度 1.96 在 #f8f9fa 上) 改为 #6b7280 (对比度 4.95:1) */
}

/* 推荐文章卡片日期 */
.zbb-related-card-date,
.zbb-related-card-meta span {
	color: #6b7280 !important;
	/* 从 #adb5bd (对比度 2.07) 改为 #6b7280 (对比度 5.4:1) */
}

/* 推荐文章卡片浏览数 */
.zbb-related-card-views {
	color: #6b7280 !important;
	/* 对比度 5.4:1 */
}

/* 侧边栏最新文章日期 */
.zbb-sidebar-widget .zbb-post-date,
.zbb-latest-posts-item time,
.widget_recent_posts time {
	color: #6b7280 !important;
	/* 对比度 5.4:1 */
}

/* 文章浏览数 */
.zbb-post-views,
.zbb-article-meta-bar .zbb-post-views,
.zbb-meta-right .zbb-post-views {
	color: #6b7280 !important;
	/* 从 #adb5bd (对比度 2.07) 改为 #6b7280 (对比度 5.4:1) */
}