// BP Lists Global Styles.
// @version 3.0.0

// @todo decide whether using .buddypress quasi namespace parent
// is useful, causing issue with specificity on other
// lists if they do not use it.

@include clearfix-element(".bp-list");

.bp-list {

	.activity:not(.ajax-loaded) .activity-list li,
	#groups-dir-list:not(.ajax-loaded) #groups-list li,
	#members-dir-list:not(.ajax-loaded) #members-list li{
		opacity: 0;
	}

	.activity-list .load-more + li,
	.activity-list .load-more + li ~ li,
	.activity-list li.just-posted{
		opacity: 1 !important;
	}

	@include box-model();
	clear: both;
	list-style: none;
	margin: $marg-lrg 0 0;
	padding: $pad-sml 0;
	width: 100%;

	// these clearfix rules simply because the element can't be classed
	li:after {
		content: " ";
		display: table;
		clear: both;
	}

	li {
		list-style: none;
		margin: $marg-sml 0;
		padding: $pad-sml 0;
		position: relative;

		.item-avatar {
			text-align: center;

			img.avatar {
				display: inline;
				width: 50px;
			}
		}

		.activity-content{
			border-bottom: 1px solid $light-grey;
		}

		.item {

			.item-avatar,
			.list-title,
			.item-meta,
			.group-details {
				text-align: center;
			}

			.list-title {
				clear: none; // some WP themes state clear:both

				@include responsive-font(16);
				font-weight: 400;
				line-height: 1.1;
				margin: 0 auto;
			}

			li.generic-button{
				padding: 0;
			}
		}

		.meta,
		.item-meta {
			color: $light-text-plus;

			@include font-size(12);
			margin-bottom: $marg-sml;
			margin-top: $marg-sml;
		}

		.last-post {
			text-align: center;
		}

		.action {
			margin: 0;
			text-align: center;

			.generic-button {
				display: inline-block;

				@include font-size(12);
				margin: 0 $marg-sml 0 0;
			}

			// if this is a div wrapper
			div.generic-button {
				margin: $marg-sml 0;
			}
		}

		@include medium-up() {

			.item {
				.item-avatar,
				.list-title,
				.item-meta,
				.group-details {
					text-align: start;
				}
			}

			.item-avatar {
				float: left;
				margin-right: $marg-med;
			}

			.item {
				margin: 0;
				overflow: hidden;
			}

			.group-desc,
			.user-update,
			.last-post {
				clear: none;
				overflow: hidden;
				width: auto;
			}

			.action {
				clear: left;
				padding: 0;
				text-align: left;

				// if it's a ul/li wrapper
				li.generic-button {
					margin-right: 0;
				}

				// if this is a div wrapper
				div.generic-button {
					margin: 0 0 $marg-sml;
				}
			}

			.generic-button {
				display: block;
				margin: 0 0 $marg-xsml 0;
			}

		} // close @media

	} // close li

} // close .bp-list


// one column list [group - members]
.buddypress-wrap {

	.groups-list,
	.members-list,
	.members-group-list{
		&:not(.grid) li:not(:last-child) .item {
			margin-right: 0;
			padding-bottom: $pad-med;
			border-bottom: $base-border;
		}
	}
}

// Ensure there's space between parent act list wrapper and filters bar
@include medium-small-up() {

	#activity-stream {
		clear: both;
		padding-top: $pad-med;
	}
}

.activity-list.bp-list {
	.activity-item {
		margin: 0;
	}

	li:first-child {
		margin-top: 0;
	}
}

.friends-list {
	list-style-type: none;
}

.friends-request-list,
.membership-requests-list {

	.item-title {
		text-align: center;
	}

	li .list-wrap{
		width: 100%;
	}

	@include medium-up() {

		li {

			@include flex-box-dir();

			.item {

				@include box-item-size($grow: 1);
			}

			.action {
				text-align: right;
			}

			.item-title {

				@include font-size(22);
				text-align: left;

				h3 {
					margin: 0;
				}
			}
		}
	}

}

#notifications-user-list {
	clear: both;
	padding-top: $pad-med;
}

// If logged out we don't display action buttons
// so lets remove the margin right creating the white-space
// for the buttons - max out the item element width.
body:not(.logged-in) {

	.bp-list {

		@include medium-up() {

			.item {
				margin-right: 0;
			}
		}
	}
}

// body class: single act items screens.
.activity-permalink {

	.item-list,
	.item-list li.activity-item {
		border: 0;
	}
}