@use '@talend/bootstrap-theme/src/theme/guidelines' as *;
@use '@talend/design-tokens/lib/tokens' as tokens;
@import '~@talend/bootstrap-theme/src/theme/animation';

$model-node-height: 1.875rem !default;

.tc-model {
	display: flex;
	flex-direction: column;
	height: 100%;
	overflow: auto;
	width: 100%;

	&-leaf,
	&-branch {
		:global(.tc-simple-text-value) {
			color: tokens.$coral-color-neutral-text-weak;
		}

		&-padding-left {
			padding-left: $padding-larger;
		}

		&-button {
			background: transparent;
			border: none;
			bottom: 0;
			height: inherit;
			position: absolute;
			top: 0;
			width: 100%;
		}
	}

	&-branch {
		display: flex;
		flex-direction: column;

		&-content {
			align-items: center;
			display: inline-flex;
			height: $model-node-height;
			position: relative;

			&:focus,
			&:hover {
				:global(.tc-tree-branch-icon-caret) {
					color: tokens.$coral-color-accent-text-hover;
				}
			}
		}
	}

	&-leaf {
		align-items: center;
		display: inline-flex;
		height: $model-node-height;
		position: relative;
		width: 100%;

		:global(.tc-pie-chart-loading-circle) {
			margin: 0 5px 0 0;
		}

		&-options {
			display: inline-flex;
			margin-left: auto;
			padding-right: $padding-normal;
			z-index: 1;
			flex-shrink: 0;

			&-burger {
				padding: 0;
				margin: 0 $padding-smaller;

				:global(.tc-svg-icon) {
					width: $btn-font-size;
					height: $btn-font-size;
					padding-bottom: 2px;
				}
			}

			&-tooltip {
				display: flex;
			}

			&-quality-circles {
				display: inherit;
				padding-top: 0.8125rem;

				&-blink {
					@include heartbeat(object-blink);
				}
			}
		}
	}
}