// BP Buttons, Submits, Icons and general clicky things styling.
// @version 3.0.0

// Buttons by default are styled as simple boxes but we may
// change that by adding a parent class ( on any close parent to
// the element ) .text-link-list

.buddypress {

	// this doubling avoids issues applying styles from body class
	// to general theme elements - changing body class would be better though.
	.buddypress-wrap {

		// button,
		// a.button,
		// input[type="submit"],
		// input[type="button"],
		// input[type="reset"],
		// ul.button-nav:not(.button-tabs) li a,
		// .generic-button a,
		// .comment-reply-link,
		// a.bp-title-button,
		// .activity-read-more a {
		// 	background: transparent;
		// 	border-color: $bp-border-dark;
		// 	border-style: solid;
		// 	border-width: 1px;
		// 	color: $dark-grey;
		// 	cursor: pointer;
		// 	font-size: inherit;
		// 	font-weight: 400;
		// 	outline: none;
		// 	padding: 0.15em $pad-sml;
		// 	text-align: center;
		// 	text-decoration: none;
		// 	width: auto;
		// }

		.activity-content .activity-meta .generic-button a{
			color: $dark-grey;

			&:hover{
				opacity: 0.8;
			}

			// background: transparent;
			// border-color: $bp-border-dark;
			// border-style: solid;
			// border-width: 1px;
			// color: $dark-grey;
			// cursor: pointer;
			// font-size: inherit;
			// font-weight: 400;
			// outline: none;
			// padding: 0.15em $pad-sml;
			// text-align: center;
			// text-decoration: none;
			// width: auto;
			// display: inline-block;

			// &:hover{
			// 	color: $black;
			// 	outline: none;
			// 	text-decoration: none;
			// }
		}

		// Re-instate the quick-tag padding to avoid the above ruleset
		// causing styling issues.
		.button-small[type="button"] {
			padding: 0 8px 1px;
		}

		// button:hover,
		// button:focus,
		// a.button:focus,
		// a.button:hover,
		// input[type="submit"]:focus,
		// input[type="submit"]:hover,
		// input[type="button"]:focus,
		// input[type="button"]:hover,
		// input[type="reset"]:focus,
		// input[type="reset"]:hover,
		// .button-nav li a:focus,
		// .button-nav li a:hover,
		// .button-nav li.current a,
		// .generic-button a:focus,
		// .generic-button a:hover,
		// .comment-reply-link:focus,
		// .comment-reply-link:hover,
		// .activity-read-more a:focus,
		// .activity-read-more a:hover {
		// 	background: $buttons-background;
		// 	border-color: darken($bp-border-dark, 20%);
		// 	color: $black;
		// 	outline: none;
		// 	text-decoration: none;
		// }

		// input[type="submit"].pending,
		// input[type="button"].pending,
		// input[type="reset"].pending,
		// input[type="button"].disabled,
		// input[type="reset"].disabled,
		// input[type="submit"][disabled="disabled"],
		// button.pending,
		// button.disabled,
		// div.pending a,
		// a.disabled {
		// 	border-color: $bp-border-color;
		// 	color: $light-text;
		// 	cursor: default;
		// }

		// input[type="submit"]:hover.pending,
		// input[type="button"]:hover.pending,
		// input[type="reset"]:hover.pending,
		// input[type="submit"]:hover.disabled,
		// input[type="button"]:hover.disabled,
		// input[type="reset"]:hover.disabled,
		// button.pending:hover,
		// button.disabled:hover,
		// div.pending a:hover,
		// a.disabled:hover {
		// 	border-color: $bp-border-color;
		// 	color: $light-text;
		// }

		// provide a class to style elements as text only non button.
		button.text-button,
		input.text-button {
			background: none;
			border: 0;

			@include box-shadow-none();
			color: $light-text;

			&.small {

				@include font-size(13);
			}

			&:focus,
			&:hover {
				background: none;
				text-decoration: underline;
			}
		}

		.activity-list {

			a.button {
				border: none;
			}
		}

		.bp-invites-content {

			ul.bp-list {

				li {

					.invite-button{
						color: $base-color;

						&:hover {
							color: $success-color;
						}
					}
				}

				li.selected{
					.invite-button:hover,
					.group-remove-invite-button:hover {
						color: #a00;
					}
				}
			}
		}

		#item-buttons:empty {
			display: none;
		}

		input:disabled {

			&:hover,
			&:focus {
				opacity: 0.5;
			}
		}

		// Style action links as text links
		// .text-links-list would be stated for anchors parent wrapping element
		// Example usage on group members manage screen.

		.text-links-list {

			a.button {
				background: none;
				border: none;
				border-right: 1px solid $bp-border-color;
				color: $light-text-plus;
				display: inline-block;
				padding: $pad-xsml $pad-med;

				&:visited {
					color: $text-link-visited;
				}

				&:focus,
				&:hover {
					color: $text-link-hover;
				}

			}

			a:first-child {
				padding-left: 0;
			}

			a:last-child {
				border-right: none;
			}

		} // close text-links-list

		// In grids style the basic action button a little differently

		.bp-list.grid {

			.action {

				a,
				button {
					// border: 1px solid $bp-border-dark;
					display: block;
					margin: 0;

					&:focus,
					&:hover {
						// background: $buttons-background;
					}
				}
			} // .action
		}

	} // close .buddypress

	// The group or site create link as either a button or plain link.
	// @todo this will need further classes & styles depending on nav layouts?
	// The class 'create-button' will be hardcoded for the moment on the li
	// this could be a user selected choice to style as a button though?

	#buddypress {

		// Style the create link as a button - this would be better served
		// as a modifier class but we need to be able to allow user selection
		// between button style & plain text. For the moment we'll force a
		// choice, vert dir navs get button style, horizontal dir navs a text link.

		.create-button { // the parent, i.e li element.
			background: none;

			a:focus,
			a:hover {
				text-decoration: underline;
			}

			@include medium-up {
				float: right;
			}

			text-align: center;

			a {
				border: 1px solid $bp-border-dark;

				@include border-radius(5px);
				@include box-shadow(inset 0 0 6px 0 $light-grey);
				margin: 0.2em 0;
				width: auto;

				&:focus,
				&:hover {
					background: none;
					border-color: $bp-border-dark;

					@include box-shadow(inset 0 0 12px 0 $light-grey );
				}
			}

		} // .create-button

		&.bp-dir-vert-nav {

			@include medium-up {

				.create-button {
					float: none;
					padding-top: $pad-lrg;


					a {
						margin-right: 0.5em;
					}
				}
			}
		}

		&.bp-dir-hori-nav {

			.create-button {
				// float: left;
				margin: 0;

				a:before{
					display: inline-block;
					font-size: 13px;
				}

				a{
					background: $brand-color;
					color: $bright;
					@include box-shadow-none();
					margin: 0;
					line-height: 1.5;
					border-radius: $base-border-radius;
					border: 0;
				}

				a:hover {


				}
			}
		}
	} // close #buddypress

} // close body class .buddypress @todo this should be removed in time

// ==== Icons ====

.buddypress-wrap {

	// buttons that are visually rendering as icons only won't
	// want the general button styles.
	// We'll use a class hook to identify those elements.
	button {

		&.bp-icons,
		&.ac-reply-cancel {

			background: none;
			border: 0;
		}

		&.bp-icons {

			&:focus,
			&:hover {
				background: none;
			}
		}

		&.ac-reply-cancel {

			&:focus,
			&:hover {
				background: none;
				text-decoration: underline;
			}
		}
	}

	.filter label:before,
	.feed a:before,
	.bp-invites-filters  .invite-button span.icons:before,
	.bp-messages-filters li a.messages-button:before,
	.bp-invites-content li .invite-button span.icons:before {
		font-family: dashicons;
		font-size: 18px;
	}

	.bp-invites-content .item-list li .invite-button span.icons:before {

		@include responsive-font(32);
	}

	// If icons are required for anchors e.g '<a class="button"'
	// then we may have .button background hovers being inherited
	// Use this grouped selector ruleset to add elements that need
	// no change. As we need weight this is specific to bp-lists

	// This is probably a less than optimal solution & a better one will exist to
	// implemented when time allows.
	.bp-list {

		a.button.invite-button {

			&:focus,
			&:hover {
				background: none;
			}
		}
	}

	.filter label:before {
		content: "\f536";
	}

	div.feed a:before,
	li.feed a:before {
		content: "\f303";
		line-height: 38px;
	}

	ul.item-list {

		li {

			.invite-button:not(.group-remove-invite-button) {

				span.icons:before {
					content: "\f502";
				}
			}
		}

		li.selected .invite-button,
		li .group-remove-invite-button {

			span.icons:before {
				content: "\f153";
			}
		}
	} // close ul.item-list

	.bp-invites-filters ul li #bp-invites-next-page:before,
	.bp-messages-filters ul li #bp-messages-next-page:before {
		content: "\f345";
	}

	.bp-invites-filters ul li #bp-invites-prev-page:before,
	.bp-messages-filters ul li #bp-messages-prev-page:before {
		content: "\f341";
	}
} // close .buddypress-wrap