/**
 * Liftgate help tooltip, classic cart and checkout.
 *
 * The tooltip is a dark bubble, so its text colour is load-bearing: lose it and
 * the tip is black on black, which is exactly what themes were doing to it. A
 * single-class selector at (0,1,0) loses to any theme rule such as
 * `.woocommerce td span { color:#000 }`, and in practice the background
 * survived while the colour did not.
 *
 * Hence (0,2,0) selectors AND !important on the two colours. That would be
 * heavy-handed in an application stylesheet; here the plugin renders into
 * themes it has never seen and cannot win a specificity race it cannot predict.
 * Both rules are scoped to this tooltip, so nothing else is affected.
 */

.shipclear-lg-help {
	color: #c00;
	cursor: help;
	margin-left: 6px;
	font-size: 0.85em;
	position: relative;
	text-decoration: underline dotted;
	white-space: nowrap;
}

.shipclear-lg-help .shipclear-lg-tip {
	display: none;
	position: absolute;
	left: 0;
	bottom: 1.5em;
	z-index: 20;
	width: 240px;
	background: #222 !important;
	color: #fff !important;
	padding: 8px 10px;
	border-radius: 4px;
	font-size: 0.9em;
	line-height: 1.35;
	font-weight: normal;
	/* The parent carries a dotted underline; without this it bleeds into the
	   bubble text. */
	text-decoration: none;
	box-shadow: 0 2px 8px rgba( 0, 0, 0, 0.25 );
	white-space: normal;
}

.shipclear-lg-help:hover .shipclear-lg-tip,
.shipclear-lg-help:focus .shipclear-lg-tip {
	display: block;
}