.header-container {
	display: flex;
	align-items: center;
	height: var(--widget-header-height);
	margin: 0.5rem;

	& .header-left {
		display: flex;
		flex: 1 1 0;
		min-width: 0;
		margin: 5px 0px 5px 2px;
		align-items: center;
	}

	& .header-right {
		display: flex;
		justify-content: flex-end;
		gap: 0.1rem;

		& .icon-button {
			justify-content: center;
			width: 28px;
		}
	}

	& .header-title {
		margin-left: 10px;
		font-weight: bold;
		font-size: 16px;
		line-height: 1.6;
		color: var(--app-tertiary-color);
		display: flex;
		gap: 10px;
		user-select: none;
		min-width: 0;
		flex: 1 1 0;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
	}

	& .drag-handle {
		position: absolute;
		top: 10px;
		left: 50%;
		width: 30px;
		height: 4px;
		background-color: var(--gray-primary);
		border-radius: 2px;
		transform: translateX(-50%);
		cursor: ns-resize;
	}
}