/* TCM Sailing Schedule. Colours follow the site's UiCore palette, with fallbacks. */
.tcm-ss {
	--tcm-ss-red: var(--uicore-primary-color, #e40613);
	--tcm-ss-navy: var(--uicore-secondary-color, #242175);
	--tcm-ss-text: #262f48;
	--tcm-ss-line: #e3e4ea;
	--tcm-ss-stripe: #f6f6f8;
	max-width: 1280px;
	margin: 0 auto;
	padding: 56px 24px 80px;
	color: var(--tcm-ss-text);
}

.tcm-ss__header {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px 24px;
	margin-bottom: 28px;
}

.tcm-ss__updated {
	margin: 0;
	font-size: 15px;
	opacity: 0.75;
}

.tcm-ss__print {
	padding: 12px 20px;
	border: 0;
	border-radius: 6px;
	background: var(--tcm-ss-red);
	color: #fff;
	font: inherit;
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
}

.tcm-ss__print:hover,
.tcm-ss__print:focus-visible {
	background: var(--tcm-ss-navy);
}

.tcm-ss__filter {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 16px;
	margin-bottom: 24px;
}

.tcm-ss__filter label {
	font-weight: 600;
}

.tcm-ss__filter select {
	min-width: 260px;
	max-width: 100%;
	padding: 10px 12px;
	border: 1px solid var(--tcm-ss-line);
	border-radius: 6px;
	background: #fff;
	color: inherit;
	font: inherit;
}

.tcm-ss__scroll {
	overflow-x: auto;
}

.tcm-ss__table {
	width: 100%;
	border-collapse: collapse;
	font-size: 15px;
	line-height: 1.4;
}

.tcm-ss__table th,
.tcm-ss__table td {
	padding: 10px 12px;
	border: 0;
	border-bottom: 1px solid var(--tcm-ss-line);
	text-align: left;
	vertical-align: top;
}

.tcm-ss__table thead th {
	position: sticky;
	top: 0;
	background: var(--tcm-ss-navy);
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	white-space: nowrap;
}

.tcm-ss__table tbody tr:nth-child(even) {
	background: var(--tcm-ss-stripe);
}

.tcm-ss__table tbody tr:hover {
	background: #e9eaf3;
}

.tcm-ss__table td:nth-child(2),
.tcm-ss__table td:nth-child(3),
.tcm-ss__table td:nth-child(4) {
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}

.tcm-ss__table a {
	color: inherit;
	text-decoration: none;
}

.tcm-ss__table a:hover,
.tcm-ss__table a:focus-visible {
	color: var(--tcm-ss-red);
	text-decoration: underline;
}

.tcm-ss__table strong a {
	color: var(--tcm-ss-navy);
}

.tcm-ss__via {
	display: block;
	font-size: 13px;
	opacity: 0.8;
}

/* Phones: each sailing becomes a card. */
@media screen and (max-width: 767px) {
	.tcm-ss {
		padding: 32px 16px 56px;
	}

	.tcm-ss__filter select {
		width: 100%;
	}

	.tcm-ss__table thead {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
	}

	.tcm-ss__table,
	.tcm-ss__table tbody,
	.tcm-ss__table tr,
	.tcm-ss__table td {
		display: block;
		width: 100%;
	}

	.tcm-ss__table tr {
		margin-bottom: 12px;
		padding: 8px 0;
		border: 1px solid var(--tcm-ss-line);
		border-radius: 8px;
	}

	.tcm-ss__table td {
		display: flex;
		gap: 12px;
		padding: 5px 14px;
		border: 0;
		white-space: normal;
	}

	.tcm-ss__table td::before {
		content: attr(data-label);
		flex: 0 0 42%;
		font-size: 12px;
		font-weight: 600;
		letter-spacing: 0.04em;
		text-transform: uppercase;
		opacity: 0.7;
	}

	.tcm-ss__table td:first-child {
		display: block;
		padding-bottom: 8px;
		font-size: 17px;
	}

	.tcm-ss__table td:first-child::before {
		content: none;
	}
}

.tcm-ss__print-title {
	display: none;
}

/* Print / save as PDF: just the schedule, compact, whatever the paper width. */
@media print {
	@page {
		margin: 12mm 10mm;
	}

	.uicore-animation-bg,
	#wrapper-navbar,
	.uicore-navbar,
	.uicore-page-title,
	.uicore-navigation-wrapper,
	.uicore-cta-wrapper,
	.uicore-back-to-top,
	#uicore-back-to-top,
	#uicore-tb-footer,
	.uicore-footer-wrapper,
	footer,
	#tgcta-btn,
	#tgcta-cp,
	.e-floating-buttons,
	.tcm-ss__print,
	.tcm-ss__filter {
		display: none !important;
	}

	/* The theme's page-load animation must not leave the content faded or shifted on paper. */
	body,
	.uicore-mobile-menu-overflow,
	.uicore-body-content,
	#uicore-page,
	#primary {
		opacity: 1 !important;
		transform: none !important;
		animation: none !important;
	}

	.tcm-ss {
		max-width: none;
		padding: 0;
	}

	.tcm-ss__header {
		display: block;
		margin-bottom: 8pt;
	}

	.tcm-ss__print-title {
		display: block;
		margin: 0 0 2pt;
		color: #000;
		font-size: 16pt;
		font-weight: 700;
	}

	.tcm-ss__updated {
		font-size: 9pt;
		opacity: 1;
	}

	.tcm-ss__scroll {
		overflow: visible;
	}

	.tcm-ss__table {
		font-size: 8pt;
		line-height: 1.25;
	}

	.tcm-ss__table th,
	.tcm-ss__table td {
		padding: 2.5pt 5pt;
		border-bottom: 0.5pt solid #bbb;
	}

	.tcm-ss__table thead {
		display: table-header-group;
	}

	.tcm-ss__table thead th {
		position: static;
		background: #fff !important;
		color: #000 !important;
		font-size: 7.5pt;
		border-bottom: 1pt solid #000;
	}

	.tcm-ss__table tbody tr {
		background: none !important;
		break-inside: avoid;
	}

	.tcm-ss__table a,
	.tcm-ss__table strong a {
		color: #000;
		text-decoration: none;
	}

	/* "via X" sits beside the destination to keep each sailing on one line. */
	.tcm-ss__via {
		display: inline;
		font-size: inherit;
		opacity: 1;
	}
}