/*
 * Tracking on the order page.
 *
 * Written against Nullifier's dark theme but with no hard-coded black: the
 * colours come from the theme's own custom properties where they exist, and
 * fall back to values that still read on a light shop. A plugin that only
 * looks right on one theme is a plugin that has to be edited when the theme
 * changes.
 */

.nf-tracking {
	margin: 2.5rem 0 0;
}

.nf-tracking__title {
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var( --nf-muted, #6b6b6b );
	margin: 0 0 1rem;
}

.nf-tracking__intro,
.nf-tracking__note {
	font-size: 0.875rem;
	line-height: 1.6;
	color: var( --nf-muted, #6b6b6b );
	margin: 0 0 1rem;
}

.nf-tracking__note {
	margin: 1rem 0 0;
}

.nf-tracking__list {
	list-style: none;
	margin: 0;
	padding: 0;
	border-top: 1px solid var( --nf-line, #e5e5e5 );
}

.nf-tracking__item {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 1.1rem 0;
	border-bottom: 1px solid var( --nf-line, #e5e5e5 );
}

.nf-tracking__no {
	flex: 0 0 100%;
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var( --nf-muted, #6b6b6b );
}

.nf-tracking__meta {
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
	min-width: 0;
}

.nf-tracking__carrier {
	font-weight: 600;
}

/* A tracking number is read aloud down a phone and typed into a carrier's
   site, so it is set in a face where 0 and O cannot be confused. */
.nf-tracking__number {
	font-family: ui-monospace, Menlo, Consolas, monospace;
	font-size: 0.9375rem;
	letter-spacing: 0.02em;
	word-break: break-all;
}

.nf-tracking__date {
	font-size: 0.8125rem;
	color: var( --nf-muted, #6b6b6b );
}

.nf-tracking__link {
	flex: 0 0 auto;
}