/**
 * Trade shows — the yearly event listing (templates/archive-trade_show.html)
 * and the single event page (templates/single-trade_show.html).
 *
 * Values are read off the live trade-shows_2025.html DOM. Its inline sheet
 * sizes the event rows in vh (so they depend on window height), names fonts
 * the Mac does not have (calibri falls back to Times, "Open Sans" and
 * "Varela Round" to Helvetica) and sets `li { margin-top: 2px }` on every list
 * in the page, header and footer included. All of that is reproduced.
 */

:where(body.post-type-archive-trade_show) li {
	margin-top: 2px;
}

/* Intro ------------------------------------------------------------------ */

.ax-ts .ax-ts-kicker {
	margin-bottom: 0.25rem;
	font-family: Satisfy, cursive;
	font-size: 26px;
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
	color: rgb(232 96 76);
}

.ax-ts .ax-ts-intro {
	font-family: calibri;
	font-size: 25px;
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
	color: #000;
}

/* Year links ------------------------------------------------------------- */

.ax-ts-aside {
	min-height: 1px;
}

/* The list stays inside its column: a sticky sidebar beside the events from
   768px, and a row of buttons above them on phones. */
.ax-ts-years {
	margin-top: 48px;
}

.ax-ts-years ul {
	display: flex;
	gap: 2px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ax-ts-years li {
	flex: 1 1 0;
	min-width: 0;
	margin-top: 0;
}

.ax-ts-years span {
	display: block;
}

.ax-ts-years a {
	display: block;
	padding: 8px 8px 8px 12px;
	font-family: calibri;
	font-size: 20px;
	font-weight: 700;
	color: #fff;
	background-color: #132146;
	text-decoration: none;
}

.ax-ts-years a:hover,
.ax-ts-years a:focus-visible,
.ax-ts-years a[aria-current="page"] {
	color: #ffb606;
}

@media (max-width: 767px) {
	.ax-ts-years {
		margin-top: 30px;
	}

	.ax-ts-years a {
		text-align: center;
	}

	.ax-ts-board {
		margin-top: 20px;
	}
}

@media (min-width: 768px) {
	.ax-ts-years {
		position: sticky;
		top: 20px;
	}

	.ax-ts-years ul {
		flex-direction: column;
	}

	.ax-ts-years li {
		flex: none;
	}
}

/* White board around the events ----------------------------------------- */

@media (min-width: 768px) {
	.ax-ts .ax-col-md-2 {
		flex: 0 0 16.666667%;
		max-width: 16.666667%;
	}
}

@media (min-width: 992px) {
	.ax-ts-event .ax-col-lg-5 {
		flex: 0 0 41.666667%;
		max-width: 41.666667%;
	}
}

.ax-ts-board {
	margin: 3rem 0 20px;
	padding: 20px 0 30px;
	font-family: "Varela Round", sans-serif;
	background-color: #fff;
}

.ax-ts .ax-ts-board__heading {
	margin: 0;
	padding-bottom: 1px; /* live: an empty calibri span adds a pixel to the line */
	border-bottom: 1px solid #ccc;
	font-size: 30px;
	font-weight: 400;
	line-height: 45px;
	color: #132146;
}

/* Event card ------------------------------------------------------------- */

.ax-ts-events {
	color: #ccc;
}

.ax-ts-event {
	padding: 4vh 0 0;
	border-bottom: 1px solid #ccc;
}

.ax-ts-event table {
	border-collapse: collapse;
}

.ax-ts-event td {
	padding: 1px;
	vertical-align: top;
}

.ax-ts-event__date,
.ax-ts-event__media {
	padding-bottom: 3vh;
}

.ax-ts-event__month {
	font-size: 30px;
	font-weight: 700;
	text-transform: uppercase;
	color: #333232;
}

.ax-ts-event__divider {
	width: 5vh;
	height: 5px;
	margin: 1vh 0;
	background-color: #3cbfaf;
}

.ax-ts-event__day {
	font-size: 35px;
	font-weight: 700;
	line-height: normal;
	color: #333232;
}

.ax-ts-event__media img {
	width: 100%;
	border: 1px solid #ccc;
}

.ax-ts-event__title {
	padding-bottom: 2vh;
	font-size: 30px;
	font-weight: 700;
	color: #1c495f;
}

.ax-ts-event__pin {
	display: inline-block;
	padding: 0 10px 0 3px;
	font-style: normal;
	line-height: 1;
	color: #db2d8e;
}

.ax-ts-event__pin .ax-icon {
	display: block;
}

.ax-ts-event__venue-label {
	font-family: cursive;
	font-size: 22px;
	font-weight: 700;
	color: #db2d8e;
}

.ax-ts-event__lines p {
	margin: 0;
	font-family: "Gill Sans", "Gill Sans MT", Calibri, "Trebuchet MS", sans-serif;
	font-size: 21px;
	font-weight: 300;
	color: #636363;
}

.ax-ts-event__lines strong {
	font-family: cursive;
	font-weight: inherit;
	color: #000;
}

.ax-ts-event__actions {
	padding: 3vh 0 0 3vh;
}

.ax-ts-event__button {
	display: inline-block;
	margin: 0 5px 10px 0;
	padding: 6px 12px;
	border: 1px solid #909090;
	border-radius: 4px;
	font-family: sans-serif;
	font-size: 14px;
	line-height: 1.5;
	letter-spacing: 0.5px;
	text-align: center;
	text-transform: capitalize;
	white-space: nowrap;
	vertical-align: middle;
	color: #fff;
	background-color: #3cbfaf;
}

.ax-ts-event__button:hover {
	color: #212529;
	text-decoration: none;
}

@media (max-width: 991px) {
	.ax-ts-event__title {
		display: none;
	}
}

@media (max-width: 575px) {
	.ax-ts-event__month {
		font-size: 14px;
	}

	.ax-ts-event__day {
		font-size: 36px;
	}
}

/* Single event: the card on its own; the title is already in the banner. */

.ax-ts-single .ax-ts-event {
	padding-bottom: 3vh;
	border-bottom: 0;
}