#hdsupport {
	margin: 0 auto;
	max-width: var(--site-width, 800px);
}

.hdsupport_cols {
	display: grid;
	grid-gap: 2rem;
}

.hdsupport_col_1-1 {
	grid-template-columns: 1fr 1fr;
}

.hdsupport_threads_count {
	text-align: right;
}

.hdsupport_forum_item,
.hdsupport_thread_item {
	position: relative;
	padding: 1em 1em;
	line-height: 1;
	border: 1px solid #eee;
	margin-bottom: 0.5em;
	background: #f7f7f7;
}

.hdsupport_thread_item {
	position: relative;
	padding: 1em 1em;
	line-height: 1;
	border: 1px solid #eee;
	margin-bottom: 0.5em;
	border-radius: 8px;
	background: #f7f7f7;
}

.hdsupport_thread_item_meta {
	display: grid;
	grid-template-columns: 1em 1fr max-content;
	grid-gap: 1rem;
}

.hdsupport_forum_item_permalink,
.hdsupport_thread_item_permalink {
	text-decoration: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.hdsupport_thread_item_meta_title {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.hdsupport_thread_item_meta_status {
	background-color: gray;
	border-radius: 50%;
}

.hdsupport_thread_item_meta_status.hdsupport_status_open {
	background-color: green;
}

.hdsupport_thread_item_meta_status.hdsupport_status_closed {
	background-color: cornflowerblue;
}

#hd_support_login_wrapper {
	display: grid;
}

#hdsupport_thread_closed_content {
	font-size: 0.8em;
}

#hdsupport_login_form {
	margin: 0 auto;
	padding: 2rem;
	border: 1px solid #f1e4d4;
	background-color: #fff7ec;
	display: inline-block;
	width: 100%;
	max-width: 800px;
	border-radius: 8px;
	box-shadow: 0 0 17px -11px #777;
}

#hdsupport_login_form p {
	margin: 0 0 1em 0;
}

#hdsupport_login_form p:last-child {
	margin: 0;
}

#hdsupport_login_form label {
	display: block;
}

#hdsupport_login_form .input {
	color: #222;
	border-color: #333;
	font-size: 1rem;
	line-height: 1.5;
	background: #fff;
	border: 1px solid #bbb;
	border-radius: 3px;
	display: block;
	padding: 0.7em;
	width: 100%;
}

.hdsupport_heading {
	margin-bottom: 2rem;
}

.hdsupport_item_description {
	font-size: 0.8em;
}

.hdsupport_item_description > p {
	margin-top: 4px;
}

.hdsupport_label {
	font-weight: bold;
	display: block;
	cursor: pointer;
}

.hdsupport_label > small {
	font-weight: normal;
	opacity: 0.8;
}

.hdsupport_input_item {
	margin-bottom: 1em;
}

.hdsupport_input_item:last-child {
	margin-bottom: 0;
}

.hdsupport_input {
	color: #222;
	border-color: #333;
	font-size: 1rem;
	line-height: 1.5;
	background: #fff;
	border: 1px solid #bbb;
	border-radius: 3px;
	display: block;
	padding: 0.7em;
	width: 100%;
}

.hdsupport_input.hdsupport_input_inline {
	max-width: max-content;
	margin-left: 1em;
	line-height: 1;
}

.hdsupport_input::placeholder {
	color: #bbb;
}

.hdsupport_button {
	padding: 0.5em 1em;
	line-height: 1;
	display: inline-block;
	cursor: pointer;
	border-radius: 3px;
	background-color: var(--font-colour-heading);
	color: #fff;
	border: none;
	text-decoration: none;
}
.hdsupport_button.disabled,
.hdsupport_button.loading {
	cursor: progress;
	opacity: 0.6;
}

#hdsupport_new_thread_button {
	margin-left: 1em;
	font-size: 1rem;
}

.hdsupport_input.hdsupport_error,
.hdsupport_error {
	border-color: red;
	border-width: 1px;
	border-style: solid;
}

#hdsupport_bread_search {
	display: grid;
	grid-gap: 2em;
	grid-template-columns: max-content 1fr;
	align-items: center;
	line-height: 1;
	margin-bottom: 1em;
}

#hdsupport_search_wrapper .hdsupport_input_item {
	justify-content: end;
	display: flex;
}

#hdsupport_search {
	max-width: 250px;
}

#hdsupport_search_label {
	display: none;
}

#hdsupport_breadcrumbs {
	font-size: 0.8em;
	font-family: var(--font-secondary);
}

.hdsupport_breadcrumb_item {
	margin-right: 1em;
	position: relative;
	color: #000;
}

.hdsupport_breadcrumb_item:after {
	content: "/";
	position: absolute;
	right: -1em;
	pointer-events: none;
}

.hdsupport_breadcrumb_item:last-item {
	margin-right: 0;
}

.hdsupport_breadcrumb_item:last-child:after {
	content: "";
}

/* Threads */
#hdsupport_thread_header {
	display: grid;
	grid-template-columns: 1fr max-content;
	grid-gap: 2rem;
	align-items: center;
	margin-bottom: 1rem;
}

#hdsupport_thread_status {
	padding: 0.6em 1rem;
	line-height: 1;
	border: 1px solid;
}

#hdsupport_thread_content_wrapper {
	border: 1px solid #eee;
}

#hdsupport_thread_content_wrapper.hdsupport_status_closed {
	border-color: green;
	background-color: #f2fff2;
}

.hdsupport_thread_response_item.hdsupport_response_admin {
	border-left: 8px solid goldenrod;
}

.hdsupport_thread_response_item.hdsupport_response_thread_author {
	border-right: 8px solid #eee;
}

.hdsupport_thread_content {
	padding: 2rem;
}

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

.hdsupport_thread_content a,
#hdsupport_before_threads_list a,
#hdsupport_after_threads_list a {
	white-space: wrap;
	word-wrap: anywhere;
	color: #000;
}

.hdsupport_thread_meta {
	display: grid;
	grid-template-columns: 1fr max-content;
	grid-gap: 2rem;
	text-align: right;
	font-family: var(--font-heading);
	padding: 1rem 2rem;
}

.hdsupport_anchor {
	text-decoration: none;
	color: #2d2d2d;
}

.hdsupport_thread_meta > span:last-child {
	font-weight: bold;
}

.hdsupport_thread_response_item {
	border: 1px solid #eee;
	scroll-margin-top: 6rem;
}

#hdsupport_admin_tools {
	margin-bottom: 2rem;
	display: grid;
	grid-template-columns: minmax(10px, 1fr) max-content;
}

#hdsupport_thread_reply {
	margin-top: 4rem;
}