/**
 * FAQ Widget — Velour Pro Addons
 */

/* ========================================
   CSS VARIABLES
   ======================================== */
.vnpa-faq {
	--faq-bg: #FAFBFC;
	--faq-border: #E5E7EB;
	--faq-dark: #111827;
	--faq-muted: #6B7280;
	--faq-sky: #0072FF;
	--faq-white: #FFFFFF;
	--faq-container-max: 1440px;
	--faq-padding-x: 32px;
	--faq-padding-y: 80px;
	--faq-padding-x-mobile: 16px;
	--faq-padding-y-mobile: 48px;
}

/* ========================================
   MAIN WRAPPER
   ======================================== */
.vnpa-faq {
	padding: var(--faq-padding-y-mobile) 0;
	background: var(--faq-bg);
	border-top: 1px solid var(--faq-border);
	border-bottom: 1px solid var(--faq-border);
}

@media (min-width: 1024px) {
	.vnpa-faq {
		padding: var(--faq-padding-y) 0;
	}
}

/* ========================================
   CONTAINER
   ======================================== */
.vnpa-faq__container {
	max-width: var(--faq-container-max);
	margin: 0 auto;
	padding: 0 var(--faq-padding-x-mobile);
}

@media (min-width: 1024px) {
	.vnpa-faq__container {
		padding: 0 var(--faq-padding-x);
	}
}

/* ========================================
   HEADER
   ======================================== */
.vnpa-faq__header {
	text-align: center;
	margin-bottom: 40px;
}

.vnpa-faq__subtitle {
	font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
	font-size: 10px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--faq-sky);
	font-weight: 600;
	margin: 0 0 16px 0;
	line-height: 1.4;
}

.vnpa-faq__title {
	font-family: 'Sora', sans-serif;
	font-size: 30px;
	font-weight: 700;
	color: var(--faq-dark);
	letter-spacing: -0.025em;
	margin: 0;
	line-height: 1.2;
}

@media (min-width: 1024px) {
	.vnpa-faq__title {
		font-size: 36px;
	}
}

.vnpa-faq__description {
	font-size: 14px;
	color: var(--faq-muted);
	margin: 8px auto 0;
	max-width: 448px;
	line-height: 1.5;
}

/* ========================================
   ACCORDION WRAPPER
   ======================================== */
.vnpa-faq__accordion {
	max-width: 768px;
	margin: 0 auto;
	border-top: 1px solid var(--faq-border);
}

/* ========================================
   ACCORDION ITEM
   ======================================== */
.vnpa-faq__item {
	border-bottom: 1px solid var(--faq-border);
}

/* ========================================
   ACCORDION BUTTON (TRIGGER)
   ======================================== */
.vnpa-faq__button {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 20px 0;
	font-size: 14px;
	font-weight: 600;
	color: var(--faq-dark);
	background: none;
	border: none;
	cursor: pointer;
	text-align: left;
	transition: color 0.2s ease;
	font-family: 'Inter', sans-serif;
	line-height: 1.4;
	gap: 16px;
}

.vnpa-faq__button:hover {
	color: var(--faq-sky);
}

.vnpa-faq__button:focus {
	outline: none;
}

.vnpa-faq__button:focus-visible {
	outline: 2px solid var(--faq-sky);
	outline-offset: 4px;
	border-radius: 2px;
}

/* ========================================
   CHEVRON ICON
   ======================================== */
.vnpa-faq__icon {
	flex-shrink: 0;
	width: 16px;
	height: 16px;
	color: var(--faq-muted);
	transition: transform 0.3s ease, color 0.2s ease;
}

.vnpa-faq__icon svg {
	display: block;
	width: 100%;
	height: 100%;
}

/* Open state — rotate chevron */
.vnpa-faq__item--open .vnpa-faq__icon {
	transform: rotate(180deg);
}

.vnpa-faq__item--open .vnpa-faq__button {
	color: var(--faq-sky);
}

/* ========================================
   ACCORDION CONTENT
   ======================================== */
.vnpa-faq__content {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.35s ease;
}

.vnpa-faq__content-inner {
	padding-bottom: 20px;
	font-size: 14px;
	color: var(--faq-muted);
	line-height: 1.625;
}

.vnpa-faq__content-inner p {
	margin: 0;
}

.vnpa-faq__content-inner strong {
	color: var(--faq-dark);
	font-weight: 600;
}

.vnpa-faq__content-inner a {
	color: var(--faq-sky);
	text-decoration: none;
	transition: text-decoration 0.2s ease;
}

.vnpa-faq__content-inner a:hover {
	text-decoration: underline;
}

/* ========================================
   ELEMENTOR EDITOR FIXES
   ======================================== */
.elementor-element-editable.vnpa-faq__title,
.elementor-element-editable.vnpa-faq__subtitle,
.elementor-element-editable.vnpa-faq__description {
	cursor: text;
}