/* ============================================================
   FAQ Accordion Widget（FAQ 手风琴）
   ============================================================ */

.faq-acc {
	--faq-anim-duration: 0.35s;
	box-sizing: border-box;
}

.faq-acc *,
.faq-acc *::before,
.faq-acc *::after {
	box-sizing: border-box;
}

/* ---- 分组标题 ---- */
.faq-acc-group {
	margin: 0 0 28px;
	color: #0a0f2e;
	font-size: 28px;
	font-weight: 600;
	line-height: 1.3;
}

/* ---- 项列表 ---- */
.faq-acc-list {
	display: flex;
	flex-direction: column;
}

/* ---- 单个项 ---- */
.faq-acc-item {
	border-bottom: 1px solid #e5e7eb;
}

/* 第一个项去掉 header 顶部 padding，避免与分组标题下边距叠加产生多余空白 */
.faq-acc-item:first-child > .faq-acc-header {
	padding-top: 0;
}

/* ---- 标题栏（button）----
   覆盖所有交互态的默认背景/阴影，避免父主题或 user-agent
   样式在 hover/focus/active 时显示按钮的默认填充。 */
.faq-acc-header,
.faq-acc-header:hover,
.faq-acc-header:focus,
.faq-acc-header:active {
	background: transparent;
	background-color: transparent;
	box-shadow: none;
}

.faq-acc-header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
	width: 100%;
	padding: 20px 0;
	border: 0;
	text-align: inherit;
	font: inherit;
	color: inherit;
	cursor: pointer;
	appearance: none;
	-webkit-appearance: none;
}

.faq-acc-header:focus {
	outline: none;
}

.faq-acc-header:focus-visible {
	outline: 2px solid #b71a33;
	outline-offset: 2px;
}

/* 图标在左侧时的反向布局 */
.faq-acc--icon-left .faq-acc-header {
	flex-direction: row-reverse;
	justify-content: flex-end;
}

/* ---- 标题文本 ---- */
.faq-acc-title {
	flex: 1;
	min-width: 0;
	color: #0a0f2e;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.5;
	transition: color var(--faq-anim-duration) ease;
	word-break: break-word;
}

.faq-acc-header:hover .faq-acc-title {
	color: #b71a33;
}

.faq-acc-item.is-open .faq-acc-title {
	color: #b71a33;
}

/* ---- 图标：容器 ---- */
.faq-acc-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	font-size: 14px;
	line-height: 1;
	padding-top: 4px; /* 与多行标题顶部视觉对齐，保留细微下移 */
	transition: color var(--faq-anim-duration) ease;
}

.faq-acc-icon-closed,
.faq-acc-icon-open {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

/* 收起状态：显示 closed 图标 */
.faq-acc-icon-open {
	display: none;
}

/* 展开状态：切换图标 */
.faq-acc-item.is-open .faq-acc-icon-closed {
	display: none;
}

.faq-acc-item.is-open .faq-acc-icon-open {
	display: inline-flex;
}

/* SVG / i 图标基础色继承（具体颜色由 Elementor 控件注入） */
.faq-acc-icon svg {
	width: 14px;
	height: 14px;
	transition: fill var(--faq-anim-duration) ease;
}

.faq-acc-icon i {
	transition: color var(--faq-anim-duration) ease;
}

/* ---- 展开面板：高度自适应动画 ----
   使用 grid-template-rows: 0fr → 1fr 技巧，
   无需 JS 计算高度，支持内容任意高度的丝滑过渡。
   浏览器支持：Chrome 117+, Firefox 120+, Safari 17+ */
.faq-acc-panel {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows var(--faq-anim-duration) ease;
}

/* inner wrapper 作为 grid 子项：无 padding、min-height: 0，
   收起时被压缩到绝对 0 高度，裁剪掉 .faq-acc-content 的 padding */
.faq-acc-panel > .faq-acc-panel-inner {
	min-height: 0;
	overflow: hidden;
}

.faq-acc-item.is-open .faq-acc-panel {
	grid-template-rows: 1fr;
}

/* ---- 描述内容 ---- */
.faq-acc-content {
	padding: 0 0 24px;
	color: #333;
	font-size: 15px;
	line-height: 1.7;
}

.faq-acc-content > *:first-child {
	margin-top: 0;
}

.faq-acc-content > *:last-child {
	margin-bottom: 0;
}

/* 内嵌链接 */
.faq-acc-content a {
	color: #b71a33;
	text-decoration: none;
	transition: color 0.25s ease;
}

.faq-acc-content a:hover {
	color: #0a0f2e;
}

/* ============================================================
   降级：不支持 grid-template-rows 动画时直接切换显示
   ============================================================ */
@supports not (grid-template-rows: 0fr) {
	.faq-acc-panel {
		display: block;
		max-height: 0;
		overflow: hidden;
		transition: max-height var(--faq-anim-duration) ease;
	}

	.faq-acc-item.is-open .faq-acc-panel {
		max-height: 2000px;
	}
}

/* ============================================================
   Reduced Motion
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
	.faq-acc-panel,
	.faq-acc-title,
	.faq-acc-icon,
	.faq-acc-icon svg,
	.faq-acc-icon i,
	.faq-acc-content a {
		transition: none;
	}
}

/* ============================================================
   响应式
   ============================================================ */
@media (max-width: 767px) {
	.faq-acc-group {
		font-size: 22px;
		margin-bottom: 20px;
	}

	.faq-acc-title {
		font-size: 15px;
	}

	.faq-acc-header {
		padding: 16px 0;
		gap: 12px;
	}

	.faq-acc-content {
		padding-bottom: 18px;
		font-size: 14px;
	}
}