<div class="item" data-bind="visible: visible(),
	 css: { 'selected': selected, 'canSelect': bSelectable, 'canNotSelect': !bSelectable, 'exists': bExists, 'subscribed': subscribed,
		'system': isSystem, 'user': !isSystem(), 'virtualEmpty': virtualEmpty, 'accordion': subfolders().length !== 0, 'expanded': expanded(), 'collapsed': !expanded()}">
	<a class="title" href="javascript: void(0);" data-bind="
		css: {'recivedAnim': recivedAnim()},
		attr: {href: routingHash},
		visible: bCanBeSelected,
		droppable: {valueFunc: bVirtual ? false : function (oEvent, oUi) { $root.messagesDrop($data, oEvent, oUi); }, switchObserv: selected}
	">
		<span class="count" data-bind="visible: messageCountToShow() > 0, text: messageCountToShow(),
			  css: {'unseen': showUnseenMessages}, click: executeUnseenFilter, customTooltip: unseenMessagesTitle()"></span>
		<span class="name">
			<span class="icon" data-bind="css: 'type' + type()"></span>
			<span class="collapse_handler" data-bind="visible: canExpand, css: {'expanded': expanded(), 'collapsed': !expanded()}, click: onAccordion"></span>
			<span class="text animGoal" data-bind="text: displayName, attr: {'id':	(type() === Enums.FolderTypes.Inbox) ? 'selenium_folder_inbox' :
																					((type() === Enums.FolderTypes.Sent) ? 'selenium_folder_sent' :
																					((type() === Enums.FolderTypes.Drafts) ? 'selenium_folder_drafts' :
																					((type() === Enums.FolderTypes.Spam) ? 'selenium_folder_spam' :
																					((type() === Enums.FolderTypes.Trash) ? 'selenium_folder_trash' : ''))))}"></span>
		</span>
	</a>
	<span class="title" data-bind="visible: !bCanBeSelected">
		<span class="count" data-bind="visible: messageCountToShow() > 0, text: messageCountToShow(),
		  css: {'unseen': showUnseenMessages}"></span>
		<span class="name">
			<span class="icon" data-bind="css: 'type' + type()"></span>
			<span class="collapse_handler" data-bind="visible: canExpand, css: {'expanded': expanded(), 'collapsed': !expanded()}, click: onAccordion"></span>
			<span class="text animGoal" data-bind="text: displayName"></span>
		</span>
	</span>
	<!-- ko if: !bNamespace -->
	<div class="children" data-bind="template: { name: 'Mail_FolderViewModel', foreach: subfolders }"></div>
	<!-- /ko -->
</div>
<!-- ko if: bNamespace -->
	<!-- ko template: {name: 'Mail_FolderViewModel', foreach: subfolders} --><!-- /ko -->
<!-- /ko -->
