/* TreeTracker — kept minimal so the site theme's typography and colours apply. */

.treetracker-form {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5em 0.75em;
	margin: 1em 0 1.5em;
}
.treetracker-form input[type="text"] {
	width: 6em;
}
.treetracker-views {
	display: inline-flex;
	flex-wrap: wrap;
	gap: 0.5em;
}

/* Wide tables scroll sideways on phones instead of breaking the layout. */
.treetracker-scroll {
	position: relative; /* Contain absolutely positioned children (screen-reader text). */
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	margin-bottom: 1em;
}
.treetracker-table {
	width: auto;
	border-collapse: collapse;
}
.treetracker-table th,
.treetracker-table td {
	padding: 0.2em 0.7em;
	text-align: left;
	vertical-align: top;
}
.treetracker-table td.tt-center {
	text-align: center;
	white-space: nowrap;
}
/* Tag and DBH never wrap; the notes column keeps a readable minimum width,
   so on phones the table scrolls sideways instead of growing very tall. */
.treetracker-table td:first-child {
	white-space: nowrap;
}
.treetracker-table td:last-child {
	min-width: 12em;
}
.treetracker-table img {
	display: inline-block;
	vertical-align: middle;
	max-width: none;
}

/* Sortable headers: ▴▾ hint, replaced by the active direction. */
.treetracker-table th.tt-sort {
	cursor: pointer;
	user-select: none;
	white-space: nowrap;
}
.treetracker-table th.tt-sort::after {
	content: " \25B4\25BE";
	opacity: 0.5;
}
.treetracker-table th[aria-sort="ascending"]::after {
	content: " \25B4";
	opacity: 1;
}
.treetracker-table th[aria-sort="descending"]::after {
	content: " \25BE";
	opacity: 1;
}
.treetracker-table abbr {
	text-decoration: none;
}

.treetracker-highlight {
	font-weight: bold;
}
.treetracker-champion {
	color: #c00;
	font-weight: bold;
	margin-right: 0.4em;
}
.treetracker-small {
	font-size: small;
}
.treetracker .screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}
