/* Levapan Elements — Preguntas frecuentes (PQRs) */

.lv-faq {
	--lv-faq-item-gap: 14px;
	--lv-faq-item-bg: #ffffff;
	--lv-faq-item-border-open: #cf1d1d;
	--lv-faq-toggle-size: 26px;
	--lv-faq-toggle-icon-size: 12px;
	--lv-faq-toggle-gap: 14px;
	--lv-faq-toggle-bg: #4b4b4b;
	--lv-faq-toggle-color: #ffffff;
	--lv-faq-toggle-bg-open: #cf1d1d;
	--lv-faq-toggle-color-open: #ffffff;
	--lv-faq-a-gap: 10px;
	--lv-faq-sb-width: 6px;
	--lv-faq-sb-thumb: #c7c7c7;
	--lv-faq-sb-track: transparent;
	--lv-faq-more-color: #cf1d1d;
	--lv-faq-more-icon-size: 1em;
	--lv-faq-more-icon-gap: 8px;
	--lv-faq-more-margin: 16px;
}

.lv-faq__list {
	display: flex;
	flex-direction: column;
	gap: var(--lv-faq-item-gap);
	max-height: var(--lv-faq-list-max-h, none);
	min-height: 0;
	overflow-y: auto;
	overscroll-behavior: contain;
	/* Aire para que el borde y la sombra de la tarjeta abierta no se recorten
	   contra el overflow, y hueco a la derecha para el scrollbar. */
	padding: 4px 16px 4px 4px;
	scrollbar-width: thin;
	scrollbar-color: var(--lv-faq-sb-thumb) var(--lv-faq-sb-track);
}

.lv-faq__list::-webkit-scrollbar {
	width: var(--lv-faq-sb-width);
}

.lv-faq__list::-webkit-scrollbar-thumb {
	background: var(--lv-faq-sb-thumb);
	border-radius: 999px;
}

.lv-faq__list::-webkit-scrollbar-track {
	background: var(--lv-faq-sb-track);
}

.lv-faq__item {
	background-color: var(--lv-faq-item-bg);
	border: 1px solid #dfdfdf;
	border-radius: 14px;
	padding: 16px 20px;
	transition: border-color 0.2s ease, background-color 0.2s ease;
}

.lv-faq__item[data-lv-expanded="true"] {
	border-color: var(--lv-faq-item-border-open);
}

.lv-faq__question {
	margin: 0;
}

/* Selector compuesto a propósito: los estilos globales de botón del kit de
   Elementor (`.elementor-kit-N button`) ganan a una sola clase y le pondrían
   fondo, borde y padding propios a la cabecera. */
.lv-faq .lv-faq__toggle {
	display: flex;
	align-items: center;
	gap: var(--lv-faq-toggle-gap);
	width: 100%;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	color: inherit;
	font: inherit;
	text-align: start;
	cursor: pointer;
	/* El reset.css del tema pone button { white-space: nowrap } y la pregunta
	   lo hereda: sin esto el texto no salta de línea y se recorta. */
	white-space: normal;
}

/* El kit también trae button:hover/button:focus (0,2,1) con el fondo rojo
   global: el reset hay que repetirlo en los estados. */
.lv-faq .lv-faq__toggle:hover,
.lv-faq .lv-faq__toggle:focus {
	background: none;
	color: inherit;
}

.lv-faq__question-text {
	flex: 1 1 auto;
	min-width: 0;
	overflow-wrap: break-word;
	color: var(--lv-faq-q-color, inherit);
	font-weight: 700;
}

.lv-faq__icon {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--lv-faq-toggle-size);
	height: var(--lv-faq-toggle-size);
	border-radius: 50%;
	background-color: var(--lv-faq-toggle-bg);
	color: var(--lv-faq-toggle-color);
	font-size: var(--lv-faq-toggle-icon-size);
	line-height: 1;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.lv-faq__icon svg {
	width: 1em;
	height: 1em;
	fill: currentColor;
}

.lv-faq__icon i {
	font-size: inherit;
}

.lv-faq__item[data-lv-expanded="true"] .lv-faq__icon {
	background-color: var(--lv-faq-toggle-bg-open);
	color: var(--lv-faq-toggle-color-open);
}

.lv-faq__icon-closed,
.lv-faq__icon-open {
	display: inline-flex;
}

/* El servidor pinta los dos iconos siempre; el estado decide cuál se ve. */
.lv-faq__item[data-lv-expanded="true"] .lv-faq__icon-closed,
.lv-faq__item:not([data-lv-expanded="true"]) .lv-faq__icon-open {
	display: none;
}

/* El reposo cerrado vive en CSS anclado al atributo que imprime el servidor:
   así no hay FOUC aunque el script cargue en el footer. El JS solo anima
   max-height con alturas medidas entre un estado y otro. */
.lv-faq__answer-wrap {
	overflow: hidden;
	transition: max-height 0.3s ease;
}

.lv-faq__item:not([data-lv-expanded="true"]) .lv-faq__answer-wrap {
	max-height: 0;
}

.lv-faq__answer {
	padding-top: var(--lv-faq-a-gap);
	color: var(--lv-faq-a-color, inherit);
}

.lv-faq__answer > :last-child {
	margin-bottom: 0;
}

.lv-faq__footer {
	display: flex;
	justify-content: flex-end;
	margin-top: var(--lv-faq-more-margin);
}

.lv-faq__more {
	display: inline-flex;
	align-items: center;
	gap: var(--lv-faq-more-icon-gap);
	color: var(--lv-faq-more-color);
	font-weight: 700;
	text-decoration: none;
}

/* Sin href el botón es un placeholder deliberado: ni cursor ni hover. */
.lv-faq__more[href] {
	cursor: pointer;
}

.lv-faq__more-icon {
	display: inline-flex;
	font-size: var(--lv-faq-more-icon-size);
	line-height: 1;
}

.lv-faq__more-icon svg {
	width: 1em;
	height: 1em;
	fill: currentColor;
}

.lv-faq__more-icon i {
	font-size: inherit;
}

@media (prefers-reduced-motion: reduce) {
	.lv-faq__item,
	.lv-faq__icon,
	.lv-faq__answer-wrap {
		transition: none;
	}
}

.lv-editor-notice {
	padding: 14px 18px;
	border: 1px dashed #b4b5b6;
	border-radius: 6px;
	color: #6b6c6e;
	font-size: 13px;
	line-height: 1.5;
}