/* CombPool custom styles on top of w3.css, matching the reference
   haircomb software's brand color (core.haircomb.biz style.css). */

.w3-magenta {
	color: white;
	background-color: #d80073!important;
}

/* long hex values (addresses, hashes, commitments) must wrap on mobile */
tt {
	word-break: break-all;
}

/* Tabs, haircomb-style: every tab body lives in the one dashboard page and
   only visibility changes — done with CSS :target instead of the WASM app's
   scripted show/hide, so switching needs no JavaScript, no server request,
   and no URL parameters. The targets are zero-size anchors pinned to the
   top of the page (so tab clicks never scroll into the document), and
   everything downstream — bar highlight and section visibility — hangs off
   them with plain sibling combinators. Pool is the default tab. */
.tabanchor {
	position: absolute;
	top: 0;
}
section.tab-mine {
	display: none;
}
#mine:target ~ .w3-content section.tab-mine {
	display: block;
}
#mine:target ~ .w3-content section.tab-pool {
	display: none;
}

/* Active-tab highlight: Pool by default, following the targeted anchor. */
.w3-bar a[href="/#pool"] {
	background-color: #9c0055;
}
#mine:target ~ .w3-bar a[href="/#pool"] {
	background-color: transparent;
}
#mine:target ~ .w3-bar a[href="/#mine"] {
	background-color: #9c0055;
}

/* W3.CSS hides page-level horizontal overflow. On narrow screens, force
   dense audit/worker tables to fit and allow every hash and action link to
   wrap instead of clipping the rightmost columns outside the viewport. */
@media (max-width: 600px) {
	h1 {
		font-size: 30px;
	}
	.w3-table-all {
		table-layout: fixed;
	}
	.w3-table-all td,
	.w3-table-all th {
		padding: 6px 4px;
		overflow-wrap: anywhere;
	}
	.w3-table-all td:first-child,
	.w3-table-all th:first-child {
		padding-left: 4px;
	}
}