/*
 * Share buttons — replacing the old Facebook / LinkedIn / Twitter widgets.
 *
 * The old buttons were drawn by third-party scripts, so the theme carried no CSS
 * of its own for them. These are plain links, so the look is defined here: a
 * compact pill roughly the size of the former button, to keep the line height
 * from jumping.
 *
 * ON SPECIFICITY. Links inside content are underlined by a rule that outweighs a
 * bare class, so the selectors are duplicated with #wrapper (present on every
 * page, emitted by header.php) and with .entry (the content wrapper used by the post
 * loop).
 *
 * The key point: the base rule and the per-network colours must have EQUAL
 * specificity, otherwise the base rule's green background wins over the colours.
 * Both sets are duplicated the same way, with the colours coming last.
 */

.jvk-share,
.entry a.jvk-share,
#wrapper a.jvk-share {
	display: inline-block;
	padding: 5px 12px;
	border-radius: 3px;
	font-size: 13px;
	line-height: 1.5;
	text-decoration: none;
	color: #fff;
	background: #527138;
	white-space: nowrap;
	vertical-align: middle;
}

/* Per-network colours, so a button is recognisable at a glance. */
.jvk-share-facebook,
.entry a.jvk-share-facebook,
#wrapper a.jvk-share-facebook { background: #1877f2; }

.jvk-share-linkedin,
.entry a.jvk-share-linkedin,
#wrapper a.jvk-share-linkedin { background: #0a66c2; }

.jvk-share-twitter,
.entry a.jvk-share-twitter,
#wrapper a.jvk-share-twitter { background: #000; }

.jvk-share:hover,
.jvk-share:focus,
.entry a.jvk-share:hover,
.entry a.jvk-share:focus,
#wrapper a.jvk-share:hover,
#wrapper a.jvk-share:focus {
	color: #fff;
	text-decoration: none;
	opacity: .88;
}

.jvk-share:focus-visible,
.entry a.jvk-share:focus-visible,
#wrapper a.jvk-share:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

/* The wrappers are the original ones, so float behaves exactly as before. */
.woo-fbshare.left,
.woo-fblike.left,
.woo-sc-twitter.left { float: left; margin: 0 10px 10px 0; }

.woo-fbshare.right,
.woo-fblike.right,
.woo-sc-twitter.right { float: right; margin: 0 0 10px 10px; }

.woo-fbshare.none,
.woo-fblike.none,
.woo-sc-twitter.none { float: none; margin: 0 0 10px; }