@import "variables.less";
@import "mixins.less";


.dropdown-notifications .header {
	margin: 7px 15px 10px 15px;
	cursor: pointer;
}

.mark-all-read {
	margin-top: 2px;
	margin-right: 15px;
}

.notification-settings {
	margin-top: 2px;
}

.collapse-indicator {
	padding: 0px 5px;
    color: #d1d8dd;
}

.category-list[data-category="Open Documents"] li a {
	text-decoration: none;
	display: block;
    padding: 14px;
    clear: both;
    font-weight: normal;
    line-height: 1.42857143;
    color: #333;
    white-space: normal;
}

.category-list[data-category="Open Documents"] li a:hover {
	background-color: #f0f4f7;
}

.open-doc-count {
	margin-left: 150px;
}

.navbar .dropdown-notifications .notifications-icon {
	padding-top: 9px;
}

.notifications-indicator {
	font-size: 7px;
	position: absolute;
	top: 4px;
	right: 8px;
	color: @indicator-orange;
	display: none;
}

.dropdown-notifications .recent-item {
	padding: 10px 14px;
    white-space: normal;
	text-decoration: none;
	font-weight: normal;
	display: flow-root;
}

.category-list[data-category="Notifications"] .recent-item {
	padding: 15px 14px 0 14px;
}

.full-log-btn {
	padding-bottom: 10px;
}

a.recent-item:hover {
	background-color: #f0f4f7;
}

a.unread:hover .mark-read {
	display: inline-block;
}

.mark-read {
	display: none;
	margin-left: 10px;
	font-size: 11px;
}

.mark-read:hover {
	text-decoration: underline;
}

.notifications-list {
	width: 450px;
	max-height: 480px;
	overflow-y: auto;
}

.date-range {
	padding: 10px 0 2px 10px;
	font-weight: 500;
}

.unread {
	background: @light-yellow;
}

.recent-item {
	.notification-timestamp {
		margin-top: 5px;
		font-size: 11px;
		display: inline-block;
		margin-bottom: 10px;
	}

	.user-avatar {
		float: left;
		margin-right: 10px;
		margin-bottom: 30px;
	}
}

.event-time {
	margin-right: 10px;
}

.notifications-loading {
	margin-bottom: 15px;
}

@media (max-width: 767px) {

	.dropdown-notifications {
		.notifications-list {
			max-height: 100vh;
			min-width: 100vw;
		}

		.category-list[data-category="Open Documents"] li a {
			margin: 0 15px;
		}

		.recent-item .user-avatar {
			margin-right: 10px;
			margin-left: 5px;
		}
	}

}