.zeero-tree {
	display: flex;
	flex-direction: column;
	height: 100%;
	min-height: 0;
	border: 1px solid var(--dark-grey);
	border-radius: 0.3em;
	overflow: hidden;
	font-size: 0.9em;
}

.zeero-tree-head {
	display: grid;
	font-weight: bold;
	background-color: var(--dark-grey);
	border-bottom: 1px solid var(--dark-grey);
	flex: none;
}

.zeero-tree-body {
	flex: 1;
	min-height: 0;
	overflow: auto;
}

.zeero-tree-row {
	display: grid;
	border-bottom: 1px solid var(--dark-grey);
	border-left: 2px solid transparent;
}

.zeero-tree-row:hover {
	background-color: var(--dark-grey);
}

.zeero-tree-row.expandable {
	cursor: pointer;
}

.zeero-tree-row.match {
	border-left-color: var(--primary);
}

.zeero-tree-row.active {
	background-color: var(--primary);
}

.zeero-tree-cell {
	padding: 0.25em 0.5em;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.zeero-tree-indent {
	display: flex;
	align-items: center;
	gap: 0.35em;
	min-width: 0;
}

.zeero-tree-indent > span:last-child {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.zeero-tree-chevron {
	cursor: pointer;
	width: 0.9em;
	flex: none;
	color: var(--secondary-lighter);
}

.zeero-tree-chevron-placeholder {
	width: 0.9em;
	flex: none;
}

.zeero-tree-empty {
	padding: 1em;
	color: var(--secondary-lighter);
	text-align: center;
}