
.is-sm {
	&.bit,
	&.btn,
	&.input {
		@include bitSize('bit', 'sm');
	}
}

// for regular sizes
// .is-md { @include bitSize('bit', 'md'); }

.is-lg {
	&.bit,
	&.btn,
	&.input {
		@include bitSize('bit', 'lg');
	}
}

.is-ico,
.is-ico-sqr {
	&.bit,
	&.btn {
		padding: 0;
		@include bitSize('ico');
		&.is-sm { @include bitSize('ico', 'sm'); }
		&.is-lg { @include bitSize('ico', 'lg');}
	}
}

.is-ico-sqr {
	&.bit,
	&.btn {
		border-radius: $sp-1;
	}
}


.is-ico-toggle {
	[aria-expanded="false"] > &:nth-last-of-type(1) { display: none; }
	[aria-expanded="true"] > &:nth-last-of-type(2)  { display: none; }
}

.is-disabled,
[disabled] {
	pointer-events: none;
	opacity: 0.5;
	~ .input-title {
		pointer-events: none;
		opacity: 0.5;
	}
}

.is-vr {
	display: inline-block;
	vertical-align: middle;
	border: 0;
	border-left: 1px solid;
	color: var(--co-gray-80);
	&.in-btn {
		height: 4rem;
	}
}

.sr-only,
.is-sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0,0,0,0);
	border: 0;
}


.has-outline {
	&.bit,
	&.btn {
		color: inherit;
		border-color: inherit;
		background-color: transparent;
		border: 1px solid;
	}
}

.is-header-sticky-space {
	position: sticky;
	z-index: 1;
	border-width: 2px;
	top: headerVisibleHeight();
}

.is-counter {
	position: absolute;
	top: -.4rem;
	right: -.4rem;
	padding: .3rem .5rem;
	min-width: 1.8rem;
	line-height: 1;
	font-size: $font-size-xsmall;
	text-align: center;
	border-radius: 2rem;
	pointer-events: none;
}

body.is-request-running main {
	pointer-events: none;
	opacity: .8;
}

.has-request-running {
	pointer-events: none;
	opacity: .8;
}
