/*** Hash link in block context ***/
.b-hash-link {
	--hash_padding: 3px 9px;
	--hash_background: var(--global-btn-primary-bg);
	--hash_border-radius: 1em;
	--hash_border: var(--global-btn-primary-border);
	--hash_font-size: 12px;
	--hash_color: var(--global-btn-primary-color);
	--hash_box-shadow: none;

	--hash-hover_color: var(--global-btn-primary-color-hover);
	--hash-hover_background: var(--global-btn-primary-bg-hover);
	--hash-hover_border: none;
	--hash-hover_box-shadow: none;

	--hash-counter_font-size: smaller;
	--hash-counter_color: inherit;
	--hash-counter-hover_color: inherit;
}


.b-hash-link {
	display: inline-block;
	background: var(--hash_background);
	border: var(--hash_border);
	border-radius: var(--hash_border-radius);
	padding: var(--hash_padding);
	margin-right: 2px;
	margin-bottom: 6px;
	font-size: var(--hash_font-size);
	color: var(--hash_color);
	box-shadow: var(--hash_box-shadow);
}

.b-hash-link:hover,
.b-hash-link:focus {
	text-decoration: none;
	color: var(--hash-hover_color);
	background: var(--hash-hover_background);
	border: var(--hash-hover_border);
	box-shadow: var(--hash-hover_box-shadow);
}


.b-hash-link_has-counter {
	grid-template-columns: auto min-content;
	grid-gap: 10px;
	display: inline-grid;
	align-items: center;
}


.b-hash-link__title:before {
	content: '#';
	display: inline-block;
	margin-right: -2px;
}

.b-hash-link_as-tag .b-hash-link__title:before {
	display: none;
}

.b-hash-link__counter {
	font-size: var(--hash-counter_font-size);
	color: var(--hash-counter_color);
}

.b-hash-link:hover .b-hash-link__counter {
	color: var(--hash-counter-hover_color);
}




/*** Hash links in rich-bbcode-content context ***/
.b-hash-link-intext {
	/* --hash_padding: 3px 5px 2px 5px; */
	--hash_padding: 3px .6em;
	--hash_background: var(--global-btn-muted-bg);
	/* --hash_border-radius: var(--global-border-radius-small); */
	--hash_border-radius: 1em;
	--hash_border: none;
	--hash_font-size: var(--global-font-size-small);
	--hash_color: var(--global-btn-muted-color);
	/* --hash_box-shadow: 1px 1px 0 rgb(0 0 0 / 10%); */
	--hash_box-shadow: none;

	--hash-hover_color: var(--global-btn-muted-color-hover);
	--hash-hover_background: var(--global-btn-muted-bg-hover);
	--hash-hover_border: none;
	/* --hash-hover_box-shadow: 1px 1px 0 rgb(0 0 0 / 10%); */
	--hash-hover_box-shadow: none;
}

.b-hash-link-intext {
	display: inline-block;
	background: var(--hash_background);
	border: var(--hash_border);
	border-radius: var(--hash_border-radius);
	padding: var(--hash_padding);
	margin-right: 2px;
	margin-bottom: 0;
	font-size: var(--hash_font-size);
	color: var(--hash_color);
	box-shadow: var(--hash_box-shadow);
}

.b-hash-link-intext__title:before {
	content: '#';
	display: inline-block;
	/* margin-right: -2px; */
}

.b-hash-link-intext_as-tag .b-hash-link-intext__title:before {
	display: none;
}

.b-hash-link-intext:hover,
.b-hash-link-intext:focus {
	text-decoration: none;
	color: var(--hash-hover_color);
	background: var(--hash-hover_background);
	border: var(--hash-hover_border);
	box-shadow: var(--hash-hover_box-shadow);
}

.b-hash-link-intext._open {
	font-weight: bold;
}