.shariff {
	@include td-text-align(right);
	padding: 15px;
}

// sass-lint:disable class-name-format
.shariff .share_text {
	display: none;
}
// sass-lint:enable class-name-format

$shariff-link-padding: 5px;
$shariff-button-margin-bottom: ($shariff-link-padding * 2) + 5px;
$shariff-button-margin-left: 10px;

.shariff > .orientation-horizontal {
	@include list-unstyled;
	margin-bottom: -($shariff-button-margin-bottom);
	margin-left: -($shariff-button-margin-left);
}

.orientation-horizontal > .shariff-button {
	display: inline-block;
	margin-bottom: $shariff-button-margin-bottom;
	margin-left: $shariff-button-margin-left;
}

.shariff-button > a {
	color: $white;
	font-size: 1.2em;
	opacity: .75;
	padding: $shariff-link-padding;

	&:hover {
		opacity: 1;
	}

	@media (min-width: $screen-xs-min) {
		opacity: .75;
	}
}

@function map-bg($bg, $bg-hover) {
	@return ( 'bg': $bg, 'bg-hover': $bg-hover );
}

// used the color values from shariff less files for services
// https://github.com/heiseonline/shariff/tree/develop/src/style/services
$share-services: (
	'diaspora': map-bg(#999, #b3b3b3),
	'facebook': map-bg(#3b5998, #4273c8),
	'googleplus': map-bg(#d34836, #f75b44),
	'mail': map-bg(#999, #a8a8a8),
	'twitter': map-bg(#55acee, #32bbf5),
	'whatsapp': map-bg(#5cbe4a, #34af23)
);

@each $service, $properties in $share-services {
	.shariff-button.#{$service} > a {
		background-color: map-get($properties, 'bg');

		&:hover {
			background-color: map-get($properties, 'bg-hover');
		}
	}
}

.shariff-button.info a {
	background-color: #fff;
	border: 1px solid #ccc;
	color: #666;

	&:hover {
		background-color: #efefef;
	}
}
