.tify-export {
	@extend %panel;
}

.tify-export-container {
	margin: g(.5) 0 g();
	position: relative;
}

.tify-export-link {
	@extend %button;
	align-items: normal;
	color: $text-color !important;
	overflow: hidden;
	padding: 0;
}

.tify-export-link-format {
	font-size: $font-size-small;
	line-height: 1;
	margin: auto 0 0 auto;
	white-space: nowrap;
}

.tify-export-link-hint {
	color: $text-color;
	font-size: $font-size-small;
}

.tify-export-link-media {
	background: $highlight-bg;
	padding: g(.5);
	text-align: center;

	img {
		display: block;
		height: g(4.5);
		object-fit: contain;
		width: g(4);
	}
}

.tify-export-link-text {
	align-items: start;
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: g(.25);
	padding: g(.5);
	text-align: left;
}

.tify-export-list {
	list-style: none;
	margin: 0;
	padding: 0;

	li {
		margin-bottom: g(.5);
	}
}

.tify-export-section {
	margin: 0 0 g();
}

.tify-export-toc {
	border-radius: $br;
	box-shadow: 0 0 0 1px $border-color inset;
	margin: g(.5) 0 0;
	padding: g(.25);
	position: relative;

	h4 {
		margin: g(.25) g(.75);
	}

	ul {
		margin: 0 0 0 g(.5);
		padding: 0;
	}
}

.tify-export-toggle {
	@extend %button-small;

	&.-close {
		@extend %button;
		border-radius: 0 $br;
		position: absolute;
		right: 0;
		z-index: 1;
	}
}