/**
 * Craftis FAQ — base structural styles only. Colors, typography, spacing,
 * borders, shadows and icon sizing are all driven by Elementor style
 * controls (class-faq.php) via inline {{WRAPPER}} selectors; this file
 * only sets up the layout skeleton and the height-transition mechanics
 * that faq.js depends on.
 */

.craftis-faq {
	display: flex;
	flex-direction: column;
	width: 100%;
}

.craftis-faq__item {
	box-sizing: border-box;
}

.craftis-faq__question-wrap {
	margin: 0;
}

.craftis-faq__question {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	width: 100%;
	background: none;
	border: none;
	margin: 0;
	cursor: pointer;
	text-align: left;
	font: inherit;
	color: inherit;
	appearance: none;
	transition: color 0.2s ease;
}

.craftis-faq__question-text {
	flex: 1 1 auto;
}

.craftis-faq__icon {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.craftis-faq__icon-line {
	transform-origin: center;
	transition: transform 0.3s ease, opacity 0.3s ease;
}

.craftis-faq__icon-line--v {
	transition: transform 0.3s ease;
}

/* Plus -> minus morph: the vertical stroke rotates flat and fades away. */
.craftis-faq__item.is-active .craftis-faq__icon-line--v {
	transform: rotate(90deg);
	opacity: 0;
}

.craftis-faq__item.is-active .craftis-faq__icon {
	transform: rotate(180deg);
}

.craftis-faq__icon {
	transition: transform 0.3s ease;
}

.craftis-faq__answer {
	overflow: hidden;
	max-height: 0;
	transition-property: max-height;
	transition-timing-function: ease;
	transition-duration: 350ms;
}

.craftis-faq__answer[hidden] {
	display: block; /* faq.js controls visibility via max-height, not [hidden]'s display:none, once JS has run. */
}

.craftis-faq__answer-inner > *:first-child {
	margin-top: 0;
}

.craftis-faq__answer-inner > *:last-child {
	margin-bottom: 0;
}

@media (prefers-reduced-motion: reduce) {
	.craftis-faq__answer,
	.craftis-faq__icon,
	.craftis-faq__icon-line {
		transition-duration: 0.001ms !important;
	}
}