.tsf-metaboxes {
	box-sizing: border-box;
	max-width: 740px;
	padding-bottom: 20px;
}

.tsf-top-wrap {
	/* About half of notification height */
	margin-bottom: 8px;
}

.tsf-top-wrap,
.tsf-bottom-wrap {
	width: 100%;
	display: flex;
	justify-content: space-between;
	flex: 1 1 100%;
	flex-flow: row wrap;
	gap: 10px;
}

/* Matches .wrap h1 */
.tsf-top-buttons {
	padding: 9px 0 4px;
}
.tsf-top-buttons,
.tsf-bottom-buttons {
	display: flex;
	flex: 1 1 auto;
	justify-content: start;
	flex-flow: row wrap;
	gap: 10px;
}
.tsf-top-buttons.tsf-end,
.tsf-bottom-buttons.tsf-end {
	justify-content: flex-end;
}

@media screen and ( max-width: 782px ) {
	.tsf-top-wrap,
	.tsf-bottom-wrap,
	.tsf-top-buttons.tsf-end,
	.tsf-bottom-buttons.tsf-end {
		justify-content: start;
	}
	.tsf-top-buttons,
	.tsf-bottom-buttons {
		width: 100%;
	}
}

.tsf-metaboxes .tsf-top-buttons > *,
.tsf-metaboxes .tsf-bottom-buttons > * {
	text-align: center;
}

.tsf-metaboxes .metabox-holder {
	clear: both;
}

#tsf-title-separator {
	display: table;
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
}

#tsf-title-separator input {
	position: absolute;
	width: 0;
	height: 0;
	opacity: 0;
	margin: 0;
	padding: 0;
	border: 0;
	z-index: -1;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

#tsf-title-separator label {
	display: inline-block;
	width: auto;
	min-width: 28px;
	min-height: 28px;
	margin: 3px;
	-moz-margin-end: 1.5px;
	-moz-margin-start: 1.5px;
	padding: 0 4px;
	border: 1px solid #ccc;
	line-height: 28px;
	text-align: center;
	cursor: pointer;
	box-shadow: -1px -1px 1px #aaa inset;
	font-size: 16px;
}

#tsf-title-separator label:hover {
	box-shadow: 1px 1px 1px #aaa inset;
	background-color: #fff;
}

#tsf-title-separator input:checked + label {
	box-shadow: 1px 1px 1px #333 inset;
	background-color: #fff;
}

#tsf-title-separator input:focus + label:not( .tsf-no-focus-ring ) {
	box-shadow: 0px 0px 1px 1px #333 inset;
}

#tsf-title-location,
#tsf-home-title-location {
	display: block;
}

#tsf-title-location label > span,
#tsf-home-title-location label > span {
	display: inline-block;
	min-width: 60px;
	vertical-align: baseline;
}

.tsf-title-additions-js,
.tsf-title-additions-example-left code,
.tsf-title-additions-example-right code {
	white-space: pre-wrap;
}

.tsf-title-additions-location-hidden,
.tsf-title-tax-prefix-hidden {
	display: none;
}

#tsf-post-type-archive-header-wrap {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: center;
	vertical-align: top;
	gap: 1.625em 4ch;
}

#tsf-post-type-archive-select-wrap {
	display: flex;
	flex-flow: row wrap;
	gap: 1em;
	align-items: center;
}

#tsf-post-type-archive-select-wrap label {
	font-weight: 600;
}

#tsf-post-type-archive-header-wrap h4 {
	margin: 0;
}

.tsf-post-type-archive-link {
	display: inline-block;
}

.tsf-post-type-archive-if-excluded p:last-of-type {
	margin-bottom: 0;
}

/** @overrides tsf.css */
.tsf-select-block > select:last-of-type {
	margin-bottom: 14px;
}

/**
 * Start Tabs.
 */
.tsf-nav-tab-no-js,
.tsf-nav-tab-wrapper {
	position: relative;
	clear: both;
	width: 100%;
	display: inline-block;
	border-bottom: 1px solid #ccc;
	line-height: inherit;
	padding: 8px 12px 0;
	margin: -4px -12px;
}

.tsf-nav-tab-label {
	float: inline-start;
	border: 1px solid #ccc;
	margin-inline-start: .5em;
	margin-bottom: -1px;
	padding: 1ch 2ch;
	font-size: 12px;
	background: #f1f1f1;
	color: #555;
	font-weight: 600;
	border-radius: 3px 3px 0 0;
	cursor: pointer;
}

.tsf-nav-desktop {
	margin-left: 7px;
}

.tsf-dashicons-tabs {
	font-size: initial;
	display: inline;
	vertical-align: text-bottom;
}

input.tsf-nav-tab-radio {
	position: absolute;
	width: 0;
	height: 0;
	opacity: 0;
	margin: 0;
	padding: 0;
	border: 0;
	z-index: -1;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

.tsf-nav-tab-radio:checked + label,
.tsf-nav-tab-active {
	background-color: inherit;
	border-bottom-color: #fff;
	color: #000;
}

/* make all border colors #fff, so it doesn't look skewed */
.tsf-nav-tab-radio:focus + label:not( .tsf-no-focus-ring ) {
	box-shadow:
		0 0 0 1px #5b9dd9,
		0 0 2px 1px rgba( 30, 140, 190, .8 );
	border-color: #fff;
}

.tsf-nav-tab-content {
	margin: 1.33em auto 0;
}

.tsf-nav-tab-content select {
	width: 100%;
	max-width: max-content;
	text-overflow: ellipsis;
}

.tsf-nav-tab-content-no-js {
	margin: 1.33em auto;
}

body.js .tsf-nav-tab-content {
	display: none;
}

body.js .tsf-nav-tab-content.tsf-nav-tab-content-active {
	display: block;
}
