/*
 * Orbitalia Dynamic Widgets - Icon List base styles.
 * BEM-scoped to avoid theme collisions. Layout-only here; colors and typography
 * are driven by the Elementor Style controls.
 */

.orbitalia-icon-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.orbitalia-icon-list__item {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 0;
	border-bottom: 0 solid transparent;
}

.orbitalia-icon-list--right .orbitalia-icon-list__item {
	flex-direction: row-reverse;
}

.orbitalia-icon-list__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	line-height: 1;
}

.orbitalia-icon-list__icon svg {
	display: block;
	width: 1em;
	height: 1em;
}

.orbitalia-icon-list__text {
	flex: 0 1 auto;
}

/* -------------------------------------------------------------------------
 * Modo "En línea": items en horizontal unidos por un separador.
 * El separador se inyecta vía ::before con attr(data-sep) en cada item
 * excepto el primero — sin nodos extra en el DOM.
 * ----------------------------------------------------------------------- */
.orbitalia-icon-list--inline {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
}

.orbitalia-icon-list--inline .orbitalia-icon-list__item {
	display: inline-flex;
	align-items: baseline;
	/* En línea el espaciado es horizontal (lo da el separador), no vertical:
	 * anula el margin-bottom del control "Espacio entre items". */
	margin-bottom: 0 !important;
	/* El control "Espacio icono-texto" mete gap (default 12px) en el <li> con
	 * specificity de WRAPPER; en línea separaría el ::before del texto. Lo
	 * anulamos: el espacio entre items lo da exclusivamente el separador. */
	gap: 0 !important;
}

/* Separador centrado entre los dos items: vive en el ::before del item
 * siguiente, con los espacios del propio separador (" · ") a ambos lados.
 * color: inherit como fallback; el control de color/tipografía del texto
 * también lo apunta para que acompañe siempre al texto. */
.orbitalia-icon-list--inline .orbitalia-icon-list__item:not(:first-child)::before {
	content: attr(data-sep);
	white-space: pre;
	flex: 0 0 auto;
	color: inherit;
}

.orbitalia-icon-list--empty {
	padding: 16px;
	border: 1px dashed #9ca3af;
	color: #6b7280;
	font-style: italic;
	text-align: center;
}