.blob-page {
	margin-top: 16px;
}

.blob-breadcrumb {
	font-size: 18px;
	margin: 0 0 14px;
	color: #57606a;
	line-height: 1.4;
	word-break: break-all;
}

.blob-breadcrumb__link {
	color: #0969da;
	font-weight: 500;

	&:hover {
		text-decoration: underline;
	}
}

.blob-breadcrumb__sep {
	color: #8c959f;
	margin: 0 6px;
}

.blob-breadcrumb__file {
	color: #1f2328;
	font-weight: 600;
}

.blob-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 10px 16px;
	background-color: #f6f8fa;
	border: 1px solid #d0d7de;
	border-bottom: none;
	border-radius: 6px 6px 0 0;
	font-size: 13px;
}

.blob-toolbar__stats {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	color: #57606a;
	min-width: 0;
}

.blob-toolbar__dot {
	color: #d0d7de;
	user-select: none;
}

.blob-stat {
	color: #57606a;

	b {
		color: #1f2328;
		font-weight: 600;
	}
}

.blob-stat--hash {
	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
	font-size: 12px;
	color: #0969da !important;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 220px;
	white-space: nowrap;

	&:hover {
		text-decoration: underline;
	}
}

.blob-toolbar__actions {
	display: flex;
	gap: 6px;
}

.blob-action {
	display: inline-flex;
	align-items: center;
	padding: 4px 12px;
	background-color: #ffffff;
	border: 1px solid #d0d7de;
	border-radius: 6px;
	color: #1f2328 !important;
	font-size: 13px;
	font-weight: 500;
	line-height: 1.5;
	transition: background-color 0.07s, border-color 0.07s;

	&:hover {
		background-color: #f3f4f6;
		border-color: #afb8c1;
		text-decoration: none;
	}
}

.blob-content {
	border: 1px solid #d0d7de;
	border-radius: 0 0 6px 6px;
	margin: 0 0 16px;
	background-color: #ffffff;
	overflow: auto;
}

.blob-content__code {
	margin: 0;
	padding: 0;
	font-size: 12px;
	line-height: 1.5;
}

.blob-content__markdown {
	padding: 24px 32px;

	> *:first-child {
		margin-top: 0;
	}

	> *:last-child {
		margin-bottom: 0;
	}

	> * {
		margin: 10px 0;
	}

	code {
		background-color: rgba(175, 184, 193, 0.2);
		padding: 0.2em 0.4em;
		border-radius: 6px;
		font-size: 85%;
	}

	pre code {
		background: transparent;
		padding: 0;
	}

	pre {
		background-color: #f6f8fa;
		padding: 16px;
		border-radius: 6px;
		overflow: auto;
	}

	h1 {
		font-size: 2em;
		border-bottom: 1px solid #d8dee4;
		padding-bottom: 0.3em;
	}

	h2 {
		font-size: 1.5em;
		border-bottom: 1px solid #d8dee4;
		padding-bottom: 0.3em;
	}

	h3 {
		font-size: 1.25em;
	}

	h4 {
		font-size: 1em;
	}

	h5 {
		font-size: 0.875em;
	}

	h6 {
		font-size: 0.85em;
		color: #57606a;
	}

	img {
		max-width: 100%;
	}

	li.task-list-item:has(> input.task-list-item-checkbox) {
		list-style: none;
	}
}