.hfl-flow-graph__node.has-card-descriptor h5 {
	line-height: 1.38;
}

/*
 * `equal` (Homey's "is precies") en `equal_boolean` zijn verschillende
 * kaartidentiteiten. Voor `equal` is een vaste nummer/Ja-Nee-editor daarom
 * semantisch onveilig. De bronreferenties worden via de gewone mapping/context-
 * laag gekoppeld; vaste literals blijven onveranderd in de template.
 */
.hfl-flow-graph__node[data-hfl-card-semantic="exact-equality"] .hfl-flow-graph__comparison {
	display: none !important;
}

.hfl-card-editor__slot {
	display: inline-flex;
	align-items: center;
	min-height: 21px;
	margin: 0 2px;
	padding: 1px 7px;
	border: 1px solid #d8dee7;
	border-radius: 999px;
	background: #f8fafc;
	color: #526070;
	font-size: .86em;
	font-weight: 600;
	vertical-align: 1px;
}
.hfl-card-editor__slot.is-string { border-color: #bde8aa; background: #f3fced; color: #39851e; }
.hfl-card-editor__slot.is-number { border-color: #b7def8; background: #f0f9ff; color: #137ebf; }
.hfl-card-editor__slot.is-boolean { border-color: #ffd0ad; background: #fff7f0; color: #c9590a; }

.hfl-card-editor__raw-source {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	border: 0 !important;
	overflow: hidden !important;
	clip: rect( 0 0 0 0 ) !important;
	white-space: nowrap !important;
}
.hfl-flow-graph__message.has-rich-editor,
.hfl-flow-portable-field.has-rich-editor {
	display: none !important;
}

.hfl-card-editor__rich-text {
	display: grid;
	gap: 5px;
	margin: 7px 0;
	padding: 7px 8px;
	border: 1px solid #dde4ec;
	border-radius: 10px;
	background: #fbfcfe;
}
.hfl-card-editor__field-label {
	color: #7a8695;
	font-size: 10px;
	font-weight: 700;
}
.hfl-card-editor__rich-line {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 4px;
	min-height: 31px;
	padding: 4px 6px;
	border: 1px solid #d5dde6;
	border-radius: 8px;
	background: #fff;
}
.hfl-card-editor__literal {
	flex: 1 1 58px;
	min-width: 42px;
	min-height: 24px;
	padding: 2px 4px !important;
	border: 0 !important;
	outline: 0 !important;
	box-shadow: none !important;
	background: transparent !important;
	font: inherit;
	font-size: 11px;
	color: #263548;
	resize: vertical;
}
.hfl-card-editor__token {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	max-width: 100%;
	min-height: 23px;
	padding: 2px 7px 2px 4px;
	border-radius: 999px;
	background: #eef7ff;
	color: #157bc0;
	font-size: 11px;
	font-weight: 700;
}
.hfl-card-editor__token > span:last-child {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.hfl-card-editor__token-mark {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 17px;
	height: 17px;
	border-radius: 50%;
	background: #2faafa;
	color: #fff;
	font-size: 10px;
}

.hfl-flow-portable-field[data-hfl-descriptor-styled],
.hfl-flow-portable-field:has(.hfl-card-editor__type) {
	grid-template-columns: 20px minmax(64px,.72fr) minmax(0,1.28fr);
}
.hfl-card-editor__type {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	color: #fff;
	font-size: 11px;
	font-weight: 900;
}
.hfl-card-editor__type.is-string { background: #63cf1b; font-family: Georgia, serif; font-size: 13px; }
.hfl-card-editor__type.is-number { background: #2faafa; }
.hfl-card-editor__type.is-boolean { background: #ff6b00; }
.hfl-card-editor__type.is-image { background: #8b6fe8; }
.hfl-card-editor__type.is-unknown { background: #93a0af; }
