/*
 * whoisin.xxn.au — wall display stylesheet
 * ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 * Airport flight-board aesthetic for a wall-mounted LED screen, viewed
 * across the room. Pure black background, large condensed type, amber
 * column headers, white data rows, no chrome.
 *
 * Type sizes use clamp() so 3 visitors look as good as 30 — the data
 * rows always fill the available height.
 */

* { box-sizing: border-box; margin: 0; padding: 0; }

html, body {
	height: 100%;
	background: #000;
	color: #fff;
	font-family: "Open Sans", system-ui, sans-serif;
	font-feature-settings: "tnum" 1;     /* tabular numerals — columns line up */
	overflow: hidden;
}

.wall-page {
	display: flex;
	flex-direction: column;
	height: 100vh;
	padding: 1.5vh 2vw;
	gap: 1.5vh;
}

/* =========================================================================
   Header — small EI logo, big WHO IS IN, clock on the right
   ========================================================================= */

.wall-header {
	display: flex;
	align-items: baseline;
	gap: 2vw;
	padding-bottom: 1.5vh;
	border-bottom: 2px solid #1abc9c;
}

.wall-title {
	flex: 1;
	font-size: clamp(28px, 5vh, 64px);
	font-weight: 800;
	letter-spacing: 0.08em;
	display: flex;
	align-items: baseline;
	gap: 0.4em;
}

.wall-title-eig {
	color: #fff;
}

.wall-title-rest {
	color: #1abc9c;
}

.wall-title-test {
	color: #fff;
}

.wall-clock {
	font-size: clamp(28px, 5vh, 64px);
	font-weight: 700;
	color: #1abc9c;
	font-variant-numeric: tabular-nums;
	min-width: 4ch;
	text-align: right;
}

/* =========================================================================
   Board — the data table
   ========================================================================= */

.wall-main {
	flex: 1;
	min-height: 0;
	overflow: hidden;
}

.wall-board {
	width: 100%;
	border-collapse: collapse;
	table-layout: fixed;
}

.wall-board th,
.wall-board td {
	padding: 1.2vh 1vw;
	text-align: left;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.wall-board thead th {
	font-size: clamp(14px, 2.2vh, 28px);
	font-weight: 700;
	color: #1abc9c;
	letter-spacing: 0.1em;
	border-bottom: 2px solid #1abc9c;
	text-transform: uppercase;
}

.wall-board tbody td {
	font-size: clamp(20px, 3.6vh, 48px);
	font-weight: 600;
	color: #fff;
	border-bottom: 1px solid #222;
	letter-spacing: 0.01em;
}

.wall-board tbody tr:last-child td {
	border-bottom: none;
}

/* Column widths — name and company are flexible, fixed widths for the
   tabular columns so the data lines up. */
.wall-col-time    { width: 9%;  font-variant-numeric: tabular-nums; color: #1abc9c; }
.wall-col-name    { width: 25%; }
.wall-col-company { width: 30%; }
.wall-col-phone   { width: 18%; font-variant-numeric: tabular-nums; }
.wall-col-type    { width: 18%; color: #888; }

/* Empty state */
.wall-empty td {
	text-align: center;
	color: #666;
	font-size: clamp(24px, 4vh, 56px);
	padding: 8vh 0;
}