/**
 * SEO FAQ (FAQPage schema) — accordion UI
 * v1.3.0 · deviceua UpStore + cbdua/uatrava up-theme skin10
 */

.product-seo-faq {
	--faq-accent: var(--up-text-link, #7ab8a8);
	--faq-accent-hover: #6aa896;
	--faq-title: var(--up-text-wd-color, #6c6b61);
	--faq-text: var(--up-text-color, #7d7c71);
	--faq-muted: var(--up-text-gray-color, #7d7c71);
	--faq-border: var(--up-border-color, #f7f7f3);
	--faq-card-bg: var(--up-bg-wg, #ffffff);
	--faq-answer-bg: var(--up-bg-gray, #f4f6f5);
	--faq-radius: var(--up-border-radius-small, 10px);

	margin-top: 28px;
	padding-top: 24px;
	border-top: 1px solid var(--faq-border);
	clear: both;
}

.product-seo-faq__title {
	display: block;
	margin: 0 0 18px;
	padding: 0 0 10px;
	font-size: 1.25rem;
	font-weight: 600;
	line-height: 1.35;
	color: var(--faq-title);
	border-bottom: 3px solid var(--faq-accent);
}

.product-seo-faq__accordion {
	margin: 0;
}

/* Bootstrap panel reset — only inside FAQ block */
.product-seo-faq .panel {
	background: transparent;
	border: 0;
	box-shadow: none;
	margin: 0 0 10px;
}

.product-seo-faq .panel-default > .panel-heading,
.product-seo-faq .panel-heading {
	background: transparent !important;
	border: 0 !important;
	padding: 0;
}

.product-seo-faq .panel-default > .panel-heading + .panel-collapse > .panel-body,
.product-seo-faq .panel-body {
	border: 0 !important;
	padding: 0;
}

.product-seo-faq__item {
	background: var(--faq-card-bg);
	border: 1px solid var(--faq-border);
	border-radius: var(--faq-radius);
	overflow: hidden;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.product-seo-faq__item:hover {
	border-color: var(--faq-accent);
	box-shadow: 0 2px 8px rgba(122, 184, 168, 0.12);
}

.product-seo-faq__heading .panel-title {
	font-size: 15px;
	line-height: 1.45;
	margin: 0;
}

.product-seo-faq__question {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
	padding: 14px 16px;
	color: var(--faq-title);
	text-decoration: none;
	font-weight: 500;
}

.product-seo-faq__question::after {
	content: "";
	flex-shrink: 0;
	width: 10px;
	height: 10px;
	margin-top: 6px;
	border-right: 2px solid var(--faq-accent);
	border-bottom: 2px solid var(--faq-accent);
	transform: rotate(45deg);
	transition: transform 0.2s ease;
}

.product-seo-faq__question:not(.collapsed)::after {
	transform: rotate(-135deg);
	margin-top: 10px;
}

.product-seo-faq__question:hover,
.product-seo-faq__question:focus {
	color: var(--faq-accent);
	text-decoration: none;
}

.product-seo-faq__question.collapsed {
	color: var(--faq-title);
}

.product-seo-faq__label {
	display: block;
	flex: 1;
	min-width: 0;
}

.product-seo-faq__label .fa {
	margin-right: 8px;
	color: var(--faq-accent);
	opacity: 0.9;
}

.product-seo-faq__answer {
	background: var(--faq-answer-bg);
	border-top: 1px solid var(--faq-border);
	color: var(--faq-muted);
	padding: 14px 16px 16px;
}

.product-seo-faq__answer-text {
	font-size: 14px;
	line-height: 1.6;
	color: var(--faq-text);
}

.product-seo-faq__answer-text p {
	margin: 0 0 0.65em;
}

.product-seo-faq__answer-text p:last-child {
	margin-bottom: 0;
}

.product-seo-faq__answer-text a {
	color: var(--faq-accent);
	text-decoration: underline;
}

.product-seo-faq__answer-text a:hover {
	color: var(--faq-accent-hover);
}

/* UpStore light/dark (deviceua) */
.light-theme .product-seo-faq__item {
	background: var(--faq-card-bg);
}

.light-theme .product-seo-faq__answer {
	background: var(--faq-answer-bg);
	color: var(--faq-text);
}

.dark-theme .product-seo-faq__item {
	background: var(--up-bg-wg, #2a2a2a);
	border-color: var(--up-border-color, #3d3d3d);
}

.dark-theme .product-seo-faq__question {
	color: var(--up-text-wd-color, #e8e8e8);
}

.dark-theme .product-seo-faq__answer {
	background: var(--up-bg-main, #1f1f1f);
	color: var(--up-text-gray-color, #b8b8b8);
	border-top-color: var(--up-border-color, #3d3d3d);
}

.dark-theme .product-seo-faq__answer-text,
.dark-theme .product-seo-faq__answer-text p {
	color: var(--up-text-gray-color, #b8b8b8);
}

.dark-theme .product-seo-faq__title {
	color: var(--up-text-wd-color, #e8e8e8);
}

/* Вкладка «Опис» — відступ від основного HTML */
#tab-description > .product-seo-faq {
	margin-top: 32px;
}

#tab-description .product-seo-faq .panel-collapse.in {
	visibility: visible;
}