/*
 * BM Order Tracking. Same look as the Help Center's Track My Order tab; colours, fonts and the
 * maximum width come from the Customizer as custom properties on .bmot.
 *
 * Rules use ".bmot .bmot__x" (two classes) so they win over typical theme element styles
 * (button, input, h2...).
 */

.bmot {
	--bmot-navy: #2a3a5c;
	--bmot-accent: #f2a900;
	--bmot-bg: #fafaf7;
	--bmot-surface: #fff;
	--bmot-ink: #1c2b3a;
	--bmot-text: #5a6472;
	--bmot-muted: #8e9aa3;
	--bmot-border: #e5e0d8;
	--bmot-success: #5b8c5a;
	--bmot-error: #b3261e;
	--bmot-font-heading: "Cormorant Garamond", Georgia, serif;
	--bmot-font-body: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
	--bmot-max-width: 760px;

	background: var(--bmot-bg);
	color: var(--bmot-ink);
	font-family: var(--bmot-font-body);
	font-size: 16px;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.bmot *,
.bmot *::before,
.bmot *::after {
	box-sizing: border-box;
}

/*
 * Full width: break out of the theme's content column to the viewport edges. 100vw includes
 * the vertical scrollbar, so order-tracking.js sets --bmot-scrollbar to its width to avoid a
 * horizontal scrollbar. !important beats the block layout's "margin: auto !important" on
 * content children; "alignfull" in the markup opts out of that rule in block themes too.
 */
.bmot.bmot--full {
	width: calc(100vw - var(--bmot-scrollbar, 0px)) !important;
	max-width: none !important;
	margin-right: calc(50% - 50vw + var(--bmot-scrollbar, 0px) / 2) !important;
	margin-left: calc(50% - 50vw + var(--bmot-scrollbar, 0px) / 2) !important;
}

/* Reset the theme styles this block's elements would otherwise inherit. */
.bmot h2,
.bmot h3,
.bmot h4,
.bmot p,
.bmot ol,
.bmot dl,
.bmot dt,
.bmot dd {
	margin: 0;
	padding: 0;
	letter-spacing: normal;
	text-transform: none;
}

.bmot button,
.bmot input {
	font-family: inherit;
	letter-spacing: normal;
	text-transform: none;
	text-shadow: none;
}

.bmot .bmot__inner {
	max-width: var(--bmot-max-width);
	margin: 0 auto;
	padding: 48px 40px 72px;
}

/* With the order list, the page widens so an order's items fit as quotation lines. */
.bmot.bmot--orders .bmot__inner {
	max-width: max(var(--bmot-max-width), var(--bmot-orders-width, 1080px));
}

/* Content panel */
.bmot .bmot__card {
	padding: 32px 36px;
	border: 1px solid var(--bmot-border);
	border-radius: 10px;
	background: var(--bmot-surface);
}

.bmot .bmot__block-title {
	margin: 0 0 16px;
	color: var(--bmot-navy);
	font-family: var(--bmot-font-heading);
	font-size: 30px;
	font-weight: 400;
	line-height: 1.2;
}

.bmot .bmot__lead {
	margin: 0 0 20px;
	color: var(--bmot-text);
	font-size: 14px;
	line-height: 1.65;
}

.bmot .bmot__link {
	display: inline;
	padding: 0;
	border: 0;
	background: none;
	color: var(--bmot-navy);
	font-size: 13px;
	font-weight: 600;
	line-height: 1.5;
	text-decoration: underline;
	text-underline-offset: 2px;
	cursor: pointer;
}

.bmot .bmot__link:hover {
	color: var(--bmot-navy);
	text-decoration-thickness: 2px;
}

.bmot .bmot__btn:focus-visible,
.bmot .bmot__link:focus-visible {
	outline: 2px solid var(--bmot-accent);
	outline-offset: 2px;
}

/* Form */
.bmot .bmot__track-form {
	display: flex;
	flex-direction: column;
	gap: 12px;
	max-width: 380px;
}

/* The form is hidden while a tracking result shows; display: flex above would override [hidden]. */
.bmot .bmot__track-form[hidden] {
	display: none;
}

.bmot .bmot__input {
	display: block;
	width: 100%;
	height: auto;
	min-height: 0;
	margin: 0;
	padding: 12px 14px;
	border: 1.5px solid var(--bmot-border);
	border-radius: 0;
	background: var(--bmot-bg);
	box-shadow: none;
	color: var(--bmot-ink);
	font-size: 14px;
	line-height: 1.4;
}

.bmot .bmot__input::placeholder {
	color: var(--bmot-muted);
	opacity: 1;
}

.bmot .bmot__input:focus {
	border-color: var(--bmot-border);
	outline: 2px solid var(--bmot-accent);
	outline-offset: 1px;
}

.bmot .bmot__btn {
	min-height: 0;
	margin: 0;
	padding: 13px 20px;
	border: 0;
	border-radius: 0;
	background: var(--bmot-accent);
	box-shadow: none;
	color: var(--bmot-navy);
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.04em;
	line-height: normal;
	text-align: center;
	cursor: pointer;
}

.bmot .bmot__btn:hover {
	background: var(--bmot-accent);
	color: var(--bmot-navy);
	filter: brightness(0.96);
}

.bmot .bmot__btn[disabled] {
	cursor: progress;
	opacity: 0.6;
}

.bmot .bmot__form-status {
	color: var(--bmot-text);
	font-size: 13px;
	line-height: 1.5;
}

.bmot .bmot__form-status:empty {
	display: none;
}

.bmot .bmot__form-status.is-error {
	color: var(--bmot-error);
}

.bmot .bmot__hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.bmot .bmot__sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Login prompt */
.bmot .bmot__login-box {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px 20px;
	margin: 0 0 24px;
	padding: 16px 20px;
	border: 1px solid var(--bmot-border);
	border-radius: 8px;
	background: var(--bmot-bg);
}

.bmot .bmot__login-text {
	color: var(--bmot-navy);
	font-size: 14px;
	font-weight: 600;
	line-height: 1.5;
}

.bmot a.bmot__btn {
	display: inline-block;
	text-decoration: none;
}

.bmot .bmot__btn--dark,
.bmot .bmot__btn--dark:hover,
.bmot .bmot__btn--dark:focus {
	background: var(--bmot-navy);
	color: #fff;
}

.bmot .bmot__admin-note {
	margin: -8px 0 20px;
	color: var(--bmot-muted);
	font-size: 12px;
	font-style: italic;
}

/* Tracking result */
.bmot .bmot__tracker:focus {
	outline: none;
}

.bmot .bmot__track-order {
	margin: 0 0 20px;
	padding-bottom: 16px;
	border-bottom: 1px solid var(--bmot-border);
	color: var(--bmot-navy);
	font-size: 14px;
}

.bmot .bmot__track-status {
	display: block;
	margin-top: 4px;
	color: var(--bmot-text);
	font-size: 13px;
}

.bmot .bmot__track-due {
	color: var(--bmot-navy);
	font-weight: 600;
}

.bmot .bmot__steps {
	display: flex;
	flex-direction: column;
	list-style: none;
}

.bmot .bmot__step {
	position: relative;
	display: flex;
	align-items: flex-start;
	gap: 14px;
	padding-bottom: 20px;
}

.bmot .bmot__step-dot {
	z-index: 1;
	display: flex;
	flex-shrink: 0;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: var(--bmot-border);
	color: #fff;
	font-size: 12px;
}

.bmot .bmot__step.is-done .bmot__step-dot {
	background: var(--bmot-success);
}

.bmot .bmot__step.is-current .bmot__step-dot {
	background: var(--bmot-accent);
}

.bmot .bmot__step-t {
	margin: 0;
	color: var(--bmot-navy);
	font-size: 14px;
	font-weight: 600;
}

.bmot .bmot__step-d {
	margin: 2px 0 0;
	color: var(--bmot-muted);
	font-size: 12px;
}

.bmot .bmot__track-note {
	margin-top: 12px;
	color: var(--bmot-muted);
	font-size: 12px;
	font-style: italic;
}

.bmot .bmot__track-again {
	margin-top: 16px;
}

/* Order list */
.bmot .bmot__orders {
	margin: 0 0 28px;
	padding-bottom: 28px;
	border-bottom: 1px solid var(--bmot-border);
}

.bmot .bmot__orders-title {
	margin: 0 0 14px;
	color: var(--bmot-navy);
	font-family: var(--bmot-font-heading);
	font-size: 22px;
	font-weight: 500;
	line-height: 1.25;
}

.bmot .bmot__orders .bmot__admin-note {
	margin: -6px 0 14px;
}

.bmot .bmot__orders-empty,
.bmot .bmot__detail-empty {
	color: var(--bmot-text);
	font-size: 14px;
}

.bmot .bmot__orders-error {
	color: var(--bmot-error);
	font-size: 13px;
}

.bmot .bmot__table-wrap {
	overflow-x: auto;
	transition: opacity 0.15s;
}

/* Loading another page. */
.bmot .bmot__orders-body[aria-busy="true"] .bmot__table-wrap {
	opacity: 0.5;
}

.bmot .bmot__table {
	width: 100%;
	margin: 0;
	border: 0;
	border-collapse: collapse;
	font-size: 14px;
	line-height: 1.4;
}

.bmot .bmot__table tr {
	border: 0;
	background: none;
}

.bmot .bmot__table th,
.bmot .bmot__table td {
	padding: 12px 8px;
	border: 0;
	border-bottom: 1px solid var(--bmot-border);
	background: none;
	color: var(--bmot-ink);
	font-weight: 400;
	text-align: left;
	vertical-align: middle;
}

.bmot .bmot__table thead th {
	padding-top: 0;
	color: var(--bmot-muted);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	white-space: nowrap;
}

.bmot .bmot__row {
	cursor: pointer;
}

.bmot .bmot__row:hover > *,
.bmot .bmot__row.is-open > * {
	background: var(--bmot-bg);
}

.bmot .bmot__row.is-open > * {
	border-bottom-color: transparent;
}

.bmot .bmot__row-toggle {
	width: auto;
	min-height: 0;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	box-shadow: none;
	color: var(--bmot-navy);
	font-size: 14px;
	font-weight: 700;
	line-height: inherit;
	text-align: left;
	white-space: nowrap;
	cursor: pointer;
}

.bmot .bmot__row-toggle:hover,
.bmot .bmot__row-toggle:focus {
	background: none;
	color: var(--bmot-navy);
}

.bmot .bmot__row-toggle:focus-visible {
	outline: 2px solid var(--bmot-accent);
	outline-offset: 2px;
}

.bmot .bmot__cell-date,
.bmot .bmot__cell-due,
.bmot .bmot__cell-info {
	color: var(--bmot-text);
}

.bmot .bmot__table .bmot__cell-date,
.bmot .bmot__table .bmot__cell-due,
.bmot .bmot__table .bmot__cell-total {
	white-space: nowrap;
}

/* No due date. */
.bmot .bmot__table .bmot__cell-due.is-empty {
	color: var(--bmot-muted);
}

.bmot .bmot__table .bmot__cell-total {
	font-variant-numeric: tabular-nums;
}

.bmot .bmot__table .bmot__cell-chevron {
	width: 24px;
	padding-left: 0;
	text-align: right;
}

.bmot .bmot__cell-chevron::after {
	content: "";
	display: inline-block;
	width: 7px;
	height: 7px;
	border-right: 2px solid var(--bmot-muted);
	border-bottom: 2px solid var(--bmot-muted);
	transform: translateY(-2px) rotate(45deg);
	transition: transform 0.2s;
}

.bmot .bmot__row.is-open .bmot__cell-chevron::after {
	transform: translateY(2px) rotate(-135deg);
}

/* Status: in progress (accent dot), done (success) or closed (muted). */
.bmot .bmot__pill {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 3px 10px;
	border: 1px solid var(--bmot-border);
	border-radius: 999px;
	background: var(--bmot-surface);
	color: var(--bmot-navy);
	font-size: 12px;
	font-weight: 600;
	line-height: 1.4;
	white-space: nowrap;
}

.bmot .bmot__pill::before {
	content: "";
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--bmot-accent);
}

.bmot .bmot__pill.is-done {
	border-color: var(--bmot-success);
	color: var(--bmot-success);
}

.bmot .bmot__pill.is-done::before {
	background: var(--bmot-success);
}

.bmot .bmot__pill.is-closed {
	color: var(--bmot-muted);
}

.bmot .bmot__pill.is-closed::before {
	background: var(--bmot-muted);
}

.bmot .bmot__pager {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: 16px;
	color: var(--bmot-muted);
	font-size: 13px;
}

.bmot .bmot__link[disabled] {
	color: var(--bmot-muted);
	text-decoration: none;
	cursor: default;
	opacity: 0.5;
}

/* An open order */
.bmot .bmot__detail-row[hidden] {
	display: none;
}

.bmot .bmot__table .bmot__detail-row > td {
	padding: 4px 10px 24px;
	background: var(--bmot-bg);
	cursor: auto;
}

.bmot .bmot__detail-head {
	display: flex;
	flex-wrap: wrap;
	gap: 2px 20px;
	margin: 0 0 16px;
}

.bmot .bmot__detail-head .bmot__track-status {
	margin: 0;
}

.bmot .bmot__steps--inline {
	flex-direction: row;
	margin: 0 0 20px;
}

.bmot .bmot__steps--inline .bmot__step {
	flex: 1 1 0;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
	padding: 0 8px 0 0;
}

/* Line to the next step. */
.bmot .bmot__steps--inline .bmot__step:not(:last-child)::before {
	content: "";
	position: absolute;
	top: 11px;
	right: 0;
	left: 24px;
	height: 2px;
	background: var(--bmot-border);
}

.bmot .bmot__steps--inline .bmot__step.is-done:not(:last-child)::before {
	background: var(--bmot-success);
}

.bmot .bmot__steps--inline .bmot__step-t {
	font-size: 13px;
	line-height: 1.3;
}

/*
 * An order's items, as quotation lines. The table sits inside the order list's table, so its
 * rules start with ".bmot .bmot__detail" to win over the list's. The detail panel is a size
 * container: when it's narrower than 640px, the lines stack (see the @container rule below).
 */
.bmot .bmot__detail {
	container-name: bmot-detail;
	container-type: inline-size;
}

.bmot .bmot__detail .bmot__lines {
	width: 100%;
	margin: 0;
	border: 0;
	border-collapse: collapse;
	background: var(--bmot-surface);
	font-size: 13px;
	line-height: 1.5;
}

.bmot .bmot__detail .bmot__lines tr {
	border: 0;
	background: none;
}

.bmot .bmot__detail .bmot__lines th,
.bmot .bmot__detail .bmot__lines td {
	padding: 14px 10px;
	border: 0;
	border-bottom: 1px solid var(--bmot-border);
	background: none;
	color: var(--bmot-ink);
	font-size: 13px;
	font-weight: 400;
	text-align: left;
	vertical-align: top;
}

.bmot .bmot__detail .bmot__lines th {
	padding-top: 10px;
	padding-bottom: 10px;
	border-bottom: 2px solid var(--bmot-navy);
	color: var(--bmot-muted);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	white-space: nowrap;
}

.bmot .bmot__detail .bmot__lines .is-num {
	font-variant-numeric: tabular-nums;
	text-align: right;
	white-space: nowrap;
}

.bmot .bmot__detail .bmot__lines .bmot__line-no {
	width: 1%;
	color: var(--bmot-muted);
}

.bmot .bmot__detail .bmot__lines .bmot__line-product {
	width: 22%;
}

.bmot .bmot__detail .bmot__lines .bmot__line-net,
.bmot .bmot__detail .bmot__lines .bmot__line-vat {
	color: var(--bmot-text);
}

.bmot .bmot__detail .bmot__lines .bmot__line-gross {
	font-weight: 700;
}

.bmot .bmot__line-name {
	display: block;
	color: var(--bmot-navy);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.3;
}

.bmot .bmot__line-sub {
	display: block;
	margin-top: 2px;
	color: var(--bmot-muted);
	font-size: 12px;
}

.bmot .bmot__line-product .bmot__pill {
	margin-top: 6px;
}

.bmot .bmot__line-size {
	margin: 0 0 2px;
	color: var(--bmot-ink);
	font-weight: 700;
}

/* Options in a line, separated by dots; one per line once "View more" is clicked. */
.bmot .bmot__opts {
	color: var(--bmot-ink);
}

.bmot .bmot__opt-label {
	color: var(--bmot-muted);
}

.bmot .bmot__opt + .bmot__opt::before {
	content: "·";
	margin: 0 6px;
	color: var(--bmot-muted);
}

.bmot .bmot__opt[hidden] {
	display: none;
}

.bmot .bmot__opts.is-expanded .bmot__opt {
	display: block;
}

.bmot .bmot__opts.is-expanded .bmot__opt::before {
	content: none;
}

.bmot .bmot__opts-more {
	margin-top: 4px;
	font-size: 12px;
}

/* Totals, as on the quotation: the order total last, in the heading colour. */
.bmot .bmot__totals {
	width: 100%;
	max-width: 340px;
	margin: 16px 0 0 auto;
	font-size: 13px;
}

.bmot .bmot__totals-row {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	padding: 8px 0;
	border-bottom: 1px solid var(--bmot-border);
}

.bmot .bmot__totals dt {
	color: var(--bmot-text);
	font-weight: 400;
}

.bmot .bmot__totals dd {
	color: var(--bmot-ink);
	font-variant-numeric: tabular-nums;
	font-weight: 600;
	white-space: nowrap;
}

.bmot .bmot__totals-row.is-negative dd {
	color: var(--bmot-error);
}

.bmot .bmot__totals-row.is-total {
	align-items: center;
	margin-top: 10px;
	padding: 12px 16px;
	border: 0;
	border-radius: 6px;
	background: var(--bmot-navy);
}

.bmot .bmot__totals-row.is-total dt {
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.bmot .bmot__totals-row.is-total dd {
	color: #fff;
	font-size: 20px;
	font-weight: 700;
}

/* The lines stack when the panel is narrow: product and price, the specification, then the
   quantity, net and VAT with their labels. */
@container bmot-detail (max-width: 640px) {
	.bmot .bmot__detail .bmot__lines thead {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
	}

	.bmot .bmot__detail .bmot__lines,
	.bmot .bmot__detail .bmot__lines tbody {
		display: block;
		width: 100%;
	}

	.bmot .bmot__detail .bmot__lines .bmot__line {
		display: grid;
		grid-template-areas:
			"product product gross"
			"spec spec spec"
			"qty net vat";
		grid-template-columns: 1fr auto auto;
		gap: 6px 16px;
		padding: 14px 12px;
		border-bottom: 1px solid var(--bmot-border);
	}

	.bmot .bmot__detail .bmot__lines .bmot__line > td {
		display: block;
		width: auto;
		padding: 0;
		border: 0;
	}

	.bmot .bmot__detail .bmot__lines .bmot__line-no {
		display: none;
	}

	.bmot .bmot__detail .bmot__lines .bmot__line-product {
		grid-area: product;
	}

	.bmot .bmot__detail .bmot__lines .bmot__line-gross {
		grid-area: gross;
	}

	.bmot .bmot__detail .bmot__lines .bmot__line-spec {
		grid-area: spec;
	}

	.bmot .bmot__detail .bmot__lines .bmot__line-qty {
		grid-area: qty;
		text-align: left;
	}

	.bmot .bmot__detail .bmot__lines .bmot__line-net {
		grid-area: net;
	}

	.bmot .bmot__detail .bmot__lines .bmot__line-vat {
		grid-area: vat;
	}

	.bmot .bmot__detail .bmot__lines .bmot__line-qty,
	.bmot .bmot__detail .bmot__lines .bmot__line-net,
	.bmot .bmot__detail .bmot__lines .bmot__line-vat {
		color: var(--bmot-text);
		font-size: 12px;
	}

	.bmot .bmot__detail .bmot__lines [data-label]::before {
		content: attr(data-label) ": ";
		color: var(--bmot-muted);
	}

	.bmot .bmot__totals {
		max-width: none;
	}
}

/* Placeholder while loading */
.bmot .bmot__skeleton {
	display: grid;
	gap: 10px;
	padding: 4px 0;
}

.bmot .bmot__skeleton span {
	display: block;
	height: 14px;
	border-radius: 4px;
	background: linear-gradient(90deg, var(--bmot-border) 0%, var(--bmot-bg) 50%, var(--bmot-border) 100%);
	background-size: 200% 100%;
	animation: bmot-shimmer 1.2s ease-in-out infinite;
}

.bmot .bmot__skeleton span:nth-child(even) {
	width: 65%;
}

.bmot .bmot__skeleton--list span,
.bmot .bmot__skeleton--list span:nth-child(even) {
	width: 100%;
	height: 40px;
}

@keyframes bmot-shimmer {
	from {
		background-position: 100% 0;
	}

	to {
		background-position: -100% 0;
	}
}

@media (prefers-reduced-motion: reduce) {
	.bmot .bmot__skeleton span {
		animation: none;
	}
}

@media (max-width: 600px) {
	.bmot .bmot__inner {
		padding: 32px 16px 48px;
	}

	.bmot .bmot__card {
		padding: 24px 20px;
	}

	.bmot .bmot__block-title {
		font-size: 26px;
	}

	/* Each order becomes a card: number and status, date and total, due date, then the items or customer. */
	.bmot .bmot__table thead {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
	}

	.bmot .bmot__table,
	.bmot .bmot__table tbody,
	.bmot .bmot__table tr,
	.bmot .bmot__table th,
	.bmot .bmot__table td {
		display: block;
		width: 100%;
	}

	.bmot .bmot__table .bmot__row {
		display: grid;
		grid-template-areas:
			"order status"
			"date total"
			"due due"
			"info info";
		grid-template-columns: 1fr auto;
		gap: 2px 12px;
		padding: 14px 0;
		border-bottom: 1px solid var(--bmot-border);
	}

	.bmot .bmot__table .bmot__row > * {
		width: auto;
		padding: 0;
		border: 0;
		background: none;
	}

	.bmot .bmot__table .bmot__row.is-open {
		border-bottom-color: transparent;
	}

	.bmot .bmot__table .bmot__cell-order {
		grid-area: order;
	}

	.bmot .bmot__table .bmot__cell-status {
		grid-area: status;
		justify-self: end;
	}

	.bmot .bmot__table .bmot__cell-date {
		grid-area: date;
		font-size: 13px;
	}

	.bmot .bmot__table .bmot__cell-total {
		grid-area: total;
		justify-self: end;
		font-weight: 600;
	}

	.bmot .bmot__table .bmot__cell-due {
		grid-area: due;
		font-size: 13px;
	}

	/* Without the column headings, the due date needs its label. */
	.bmot .bmot__table .bmot__cell-due::before {
		content: attr(data-label) ": ";
		color: var(--bmot-muted);
	}

	.bmot .bmot__table .bmot__cell-due.is-empty {
		display: none;
	}

	.bmot .bmot__table .bmot__cell-info {
		grid-area: info;
		font-size: 13px;
	}

	.bmot .bmot__table .bmot__cell-chevron {
		display: none;
	}

	.bmot .bmot__table .bmot__detail-row > td {
		padding: 16px 12px;
		border-radius: 8px;
	}

	/* The timeline goes back to a vertical list. */
	.bmot .bmot__steps--inline {
		flex-direction: column;
	}

	.bmot .bmot__steps--inline .bmot__step {
		flex-direction: row;
		gap: 14px;
		padding: 0 0 14px;
	}

	.bmot .bmot__steps--inline .bmot__step:not(:last-child)::before {
		display: none;
	}
}