button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	@include btn;
	@include btn-l;
}

button,
input[type="button"],
input[type="submit"] {
	@include btn-primary;
}

/* Button Styles */
a.btn-primary,
.btn-primary a {
	@include btn;
	@include btn-primary;
}

a.btn-outline,
.btn-outline a {
	@include btn;
	@include btn-outline;
}

.btn-naked,
.btn-naked a {
	@include btn-naked;
	padding-left: 0 !important;
	padding-right: 0 !important;
	@include transition-default;

	&:hover {
		-webkit-transform: translateY(-2px);
		transform: translateY(-2px);
	}
}

.btn-white button {
	background: $color__white;
	color: $color__black;
	fill: $color__black;
}

.btn-long {
 width: 100%;
}

/* Button Sizes */
.btn-xxs {
	@include btn-s;
}

.btn-xs {
	@include btn-s;
}

.btn-s {
	@include btn-s;
}

.btn-m {
	@include btn-m;
}

.btn-l {
	@include btn-l;
}

.btn-xl {
	@include btn-xl;
}

.btn-xxl {
	@include btn-xxl;
}

.btn-xxxl {
	@include btn-xxxl;
}

.btn-xxxxl {
	@include btn-xxxxl;
}

.header-cta-wrap {

	.btn-outline a {
		@include btn-l;
	}

	a {
		@include btn;
		@include btn-l;
		line-height: 1;

		&:hover {
			text-decoration: none;
			color: inherit;
		}
	}
}

/* Button Styles (via Customizer Settings) */
.btn-curved {

	.btn,
	input[type="submit"],
	button[type="submit"],
	a.btn-primary,
	.btn-primary a,
	a.btn-outline,
	.btn-outline a,
	.loadmore {
		@include border-radius-s;
	}
}

.btn-round {

	.btn,
	input[type="submit"],
	button[type="submit"],
	a.btn-primary,
	.btn-primary a,
	a.btn-outline,
	.btn-outline a,
	.search-header .search-field,
	.loadmore {
		border-radius: 6.25em;
	}
}

/* Header CTA Sticky Button */
.header-cta-wrap ul li.sticky a {
	transform: translateY(-100px);
	transition: transform 150ms;
	position: fixed;
	top: 24px;
	right: 48px;
	z-index: 2;
}

.has-sticky-cta {
	.header-cta-wrap ul li.sticky a {
		transform: translateY(0px);
	}
}

#top-of-site-pixel-anchor {
	position: absolute;
	width: 1px;
	height: 1px;
	top: 500px;
	left: 0;
}

/* Customizer Button Options */
.buttons-bold {
	button,
	input[type="button"],
	input[type="reset"],
	input[type="submit"],
	.btn-outline a,
	.btn-primary a,
	a.btn-outline,
	a.btn-primary {
		font-weight: bold;
	}

	.btn-outline a,
	a.btn-outline {
		box-shadow: inset 0px 0px 0px 2px $color__primary;
	}
}

.buttons-uppercase {
	button,
	input[type="button"],
	input[type="reset"],
	input[type="submit"],
	.btn-outline a,
	.btn-primary a,
	a.btn-outline,
	a.btn-primary {
		text-transform: uppercase;
		font-size: 14px;
		line-height: 19px;
	}
}

/* Pill-shaped Buttons */
.btn-pill,
.single-post .entry-header .entry-cats a,
.single-post .entry-tags a,
.comment-metadata a,
.post-edit-link {
	@include pill;
}

.btn-pill,
.single-post .entry-header .entry-cats a,
.single-post .entry-tags a,
.comment-metadata .reply a,
.comment-time {
	@include pill-light;
}

.post-edit-link,
.comment-edit-link {
	@include pill-dark;
}

.post-edit-link,
.comment-metadata a {
	display: inline-flex;
	@include pill-s;
}

.post-edit-link {
	@include s-r-4 (margin-top);
}

.comment-metadata a {
	@include s-r-2 (margin-right);
}

.single {

	.entry-header .entry-cats a,
	.entry-tags a {
		@include pill-l;
	}

	.entry-header .entry-cats a {
		margin: 0 $s-2 $s-4;
	}

	.entry-tags a {
		margin: 0 $s-4 $s-4 0;
	}
}