/**
 * The printable tour sheet.
 *
 * Two audiences, one file. On screen it is a plain readable page somebody can
 * check before printing; on paper it is a document. The screen rules come
 * first, and the @media print block takes away what only makes sense with a
 * mouse.
 *
 * Self-contained on purpose. It is inlined into a document that never calls
 * wp_head(), so it cannot rely on tokens.css or on any theme stylesheet being
 * present, and every value it needs is declared here.
 *
 * Logical properties throughout, so an Arabic tour mirrors without a second
 * stylesheet.
 */

:root {
	--wptm-print-ink: #1a1d21;
	--wptm-print-muted: #5b6472;
	--wptm-print-rule: #d8dde4;
	--wptm-print-accent: #b8853a;
}

* {
	box-sizing: border-box;
}

body.wptm-print {
	max-inline-size: 820px;
	margin: 0 auto;
	padding: 28px 24px 48px;
	background: #fff;
	color: var(--wptm-print-ink);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	font-size: 15px;
	line-height: 1.65;
}

.wptm-print h1,
.wptm-print h2,
.wptm-print h3 {
	margin: 0 0 8px;
	line-height: 1.3;
}

.wptm-print p {
	margin: 0 0 10px;
}

/* =============================================================== BAR ==== */

.wptm-print__bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
	margin-block-end: 26px;
	padding-block-end: 16px;
	border-block-end: 1px solid var(--wptm-print-rule);
}

.wptm-print__button {
	padding: 9px 18px;
	border: 0;
	border-radius: 8px;
	background: var(--wptm-print-accent);
	color: #fff;
	font: inherit;
	font-weight: 600;
	cursor: pointer;
}

.wptm-print__button:hover,
.wptm-print__button:focus-visible {
	background: #a3742f;
}

.wptm-print__button:focus-visible,
.wptm-print__link:focus-visible {
	outline: 2px solid var(--wptm-print-accent);
	outline-offset: 2px;
}

.wptm-print__hint {
	flex: 1 1 220px;
	min-inline-size: 0;
	color: var(--wptm-print-muted);
	font-size: 13px;
}

.wptm-print__link {
	color: var(--wptm-print-accent);
}

/* ============================================================== HEAD ==== */

.wptm-print__head {
	margin-block-end: 22px;
}

.wptm-print__brand {
	margin-block-end: 6px;
	color: var(--wptm-print-muted);
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .08em;
}

.wptm-print__title {
	font-size: 27px;
}

.wptm-print__lead {
	max-inline-size: 68ch;
	color: var(--wptm-print-muted);
	font-size: 16px;
}

.wptm-print__ref {
	margin: 0;
	font-size: 13px;
	color: var(--wptm-print-muted);
}

/* ============================================================= FACTS ==== */

/*
 * A table rather than the row of cards the web page uses.
 *
 * Cards are a scanning device for a screen. On paper the same six facts as
 * cards take a third of the sheet and read as decoration; as label and value in
 * two columns they take six lines and read as a specification.
 */
.wptm-print__facts {
	inline-size: 100%;
	margin-block-end: 26px;
	border-collapse: collapse;
	font-size: 14px;
}

.wptm-print__facts th,
.wptm-print__facts td {
	padding: 7px 0;
	text-align: start;
	vertical-align: top;
	border-block-end: 1px solid var(--wptm-print-rule);
}

.wptm-print__facts th {
	inline-size: 34%;
	color: var(--wptm-print-muted);
	font-weight: 600;
}

/* =========================================================== SECTIONS ==== */

.wptm-print__section {
	margin-block-end: 26px;
}

.wptm-print__section h2 {
	padding-block-end: 6px;
	margin-block-end: 14px;
	border-block-end: 2px solid var(--wptm-print-accent);
	font-size: 18px;
}

.wptm-print__section--split {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 26px;
}

@media (max-width: 600px) {

	.wptm-print__section--split {
		grid-template-columns: 1fr;
	}
}

/* ============================================================== DAYS ==== */

.wptm-print__day {
	margin-block-end: 16px;
	padding-block-end: 14px;
	border-block-end: 1px solid var(--wptm-print-rule);
}

.wptm-print__day:last-child {
	margin-block-end: 0;
	padding-block-end: 0;
	border-block-end: 0;
}

.wptm-print__day h3 {
	font-size: 15.5px;
}

.wptm-print__time {
	margin-inline-start: 8px;
	color: var(--wptm-print-muted);
	font-weight: 400;
	font-size: 13px;
}

.wptm-print__dayinfo {
	margin: 8px 0 0;
	padding: 0;
	list-style: none;
	font-size: 13px;
	color: var(--wptm-print-muted);
}

.wptm-print__dayinfo li {
	display: inline;
}

.wptm-print__dayinfo li + li::before {
	content: " · ";
}

/* ============================================================= LISTS ==== */

.wptm-print__list {
	margin: 0;
	padding-inline-start: 18px;
}

.wptm-print__list li {
	margin-block-end: 4px;
}

/*
 * Symbol and wording, never colour alone.
 *
 * The included and excluded lists are the one place on this sheet where two
 * things mean opposite things, and a sheet printed on a monochrome office
 * printer — which is most of them — loses any distinction carried by colour.
 */
.wptm-print__list--in {
	list-style: none;
	padding-inline-start: 0;
}

.wptm-print__list--in li::before {
	content: "✓ ";
	font-weight: 700;
}

.wptm-print__list--out {
	list-style: none;
	padding-inline-start: 0;
}

.wptm-print__list--out li::before {
	content: "× ";
	font-weight: 700;
}

/* ============================================================== FOOT ==== */

.wptm-print__foot {
	margin-block-start: 26px;
	padding-block-start: 14px;
	border-block-start: 1px solid var(--wptm-print-rule);
	font-size: 13px;
	color: var(--wptm-print-muted);
}

.wptm-print__contact {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 20px;
	font-weight: 600;
	color: var(--wptm-print-ink);
}

.wptm-print__source {
	margin: 0;
	overflow-wrap: anywhere;
}

/* ============================================================ ARABIC ==== */

/*
 * Arabic joins its letters, so the tracking on the brand line breaks the
 * joins, and it needs more leading than Latin at the same size.
 */
.wptm-print:lang(ar),
[dir="rtl"] .wptm-print,
.wptm-print[dir="rtl"] {
	line-height: 1.9;
	letter-spacing: normal;
}

.wptm-print:lang(ar) .wptm-print__brand,
.wptm-print[dir="rtl"] .wptm-print__brand {
	letter-spacing: normal;
	text-transform: none;
}

/* ============================================================= PRINT ==== */

@media print {

	@page {
		margin: 14mm;
	}

	body.wptm-print {
		max-inline-size: none;
		padding: 0;
		font-size: 11pt;
		line-height: 1.5;
	}

	/* The one control on the page has no meaning on paper. */
	.wptm-print__bar {
		display: none;
	}

	/*
	 * A day split across a page break is the fault this whole sheet exists to
	 * avoid: the heading at the foot of one page and the description at the
	 * head of the next reads as two different days.
	 */
	.wptm-print__day,
	.wptm-print__facts tr {
		break-inside: avoid;
		page-break-inside: avoid;
	}

	.wptm-print__section h2,
	.wptm-print__day h3 {
		break-after: avoid;
		page-break-after: avoid;
	}

	.wptm-print__title {
		font-size: 20pt;
	}

	.wptm-print__section h2 {
		font-size: 13pt;
	}

	/*
	 * Backgrounds are not printed by default and asking for them wastes ink on
	 * a document somebody is printing to read. The accent survives as the rule
	 * under each heading, which is a border and does print.
	 */
	.wptm-print__foot {
		break-inside: avoid;
	}
}
