/* columns.css
   Three column page shell: Archive (existing #contentArea, untouched),
   On Deck (new, backstage passes + upcoming shows/releases), and
   Social (existing #rightcolumn, untouched, just relocated).

   Wraps around the existing columns rather than modifying them --
   #contentArea and #rightcolumn keep all their current CSS as-is. */

.css-test-giant {
  font-size: 100px !important;
  color: red !important;
  background-color: yellow !important;
}

.continue-archive {
	width: 538px;
	box-sizing: border-box;
	margin: 10px 0px 0px 20px;
	padding: 5px 5px 5px 5px;
	border: 1px dashed darkorange;
	background-color: black;
	color: white;
	font-family: courier;
	font-size: 12px;
}

.continue-archive p {
	margin: 0;
	padding: 0;
}

.continue-archive a:link,
.continue-archive a:visited {
	color: white;
	text-decoration: none;
}

.continue-archive a:hover {
	color: darkorange;
	text-decoration: underline;
}

.page-columns {
	display: flex;
	align-items: flex-start;
	gap: 24px;
	clear: both;
}

.page-column-label {
	font-family: Verdana, Geneva, Arial, sans-serif;
	font-weight: bold;
	font-size: 13px;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: darkorange;
	border-bottom: 2px solid darkorange;
	padding-bottom: 6px;
	margin: 0px 0px 14px 0px;
}

#ondeck {
	width: 300px;
	flex-shrink: 0;
}

.page-columns h3,
.m-section h3 {
	color: #b9b9b6;
	font-family: Verdana, Geneva, Arial, sans-serif;
	font-size: 11px;
	letter-spacing: 1px;
	text-transform: uppercase;
	margin: 0 0 8px 0;
	font-weight: normal;
}

/* standardisted to .page-column-label
#ondeck .ondeck-label {
	color: darkorange;
	font-family: Verdana, Geneva, Arial, sans-serif;
	font-size: 11px;
	letter-spacing: 2px;
	font-weight: bold;
	margin: 0 0 10px 0;
}
*/

.ondeck-listing {
	/* 276px = .pass-card (260) + .pass-pouch padding l/r (6+6) + border l/r
	   (2+2) -- matches the actual rendered width of a pass. This is now a
	   cap, not a fixed width, since this style is reused outside #ondeck
	   (e.g. the Social column's Friends and Inspiration list) where the
	   container itself is narrower -- see #social-column below. */
	width: 100%;
	max-width: 276px;
	margin: 0 auto 16px auto;
	box-sizing: border-box;
	background-color: gray;
	height: 130px;
	overflow-x: hidden;
	overflow-y: auto;
	font-size: 13px;
	font-family: sans-serif, arial;
	/* Preserves newlines as breaks, never wraps long lines (clips at the
	   box edge instead). Assumes source lines have no leading tabs/spaces
	   -- unlike pre-line, "pre" preserves whitespace literally, so any
	   indentation added back in would render as a visible gap. */
	white-space: pre;
	/* Source markup has a newline right after the opening div tag before
	   the first entry (easier to hand-edit), which is rendered as a blank
	   line up top -- so top padding is mostly redundant and just doubles
	   the gap. */
	padding: 2px 8px 8px 8px;
}

/* Gigs listing -- Permanent Record runs on for pages, so there's no
   shortage of vertical room to let this one breathe rather than
   forcing a scrollbar on a longer list. */
.ondeck-listing.gigs {
	height: 520px;
}

/* Releases and Friends/Inspiration listings -- both short and bounded by
   nature (a handful of weeks of releases; a fixed set of link buddies),
   so neither needs a fixed scroll box. Just let them size to content. */
.ondeck-listing.releases,
.ondeck-listing.friends {
	height: auto;
	overflow-y: visible;
}

/* Links inside these listings should read as plain text until hovered --
   no visited/unvisited distinction, since that's noise in a dense list.
   Needed because the site-wide default (root.css A:link/A:visited) is
   white, meant for the dark ticket/pass backgrounds, not these gray
   boxes. Both link and visited states scoped explicitly here (unlike the
   old .listing rule in root.css, where a comma typo let the visited
   half leak out unscoped to the whole site). */
.ondeck-listing a:link,
.ondeck-listing a:visited {
	color: black;
	text-decoration: none;
}

.ondeck-listing a:hover {
	color: darkorange;
	text-decoration: underline;
}

#social-column {
	width: 249px;
}

/* Bluesky feed embed, Social column. Carried forward from root.css --
   the max-width:45% on img is doing the real work here, capping
   embedded post images to the column instead of rendering at their
   native (much larger) pixel size. */
#bluesky {
	background-color: black;
	color: white;
	font-family: Arial, sans-serif;
	font-size: 10px;
	margin-top: 20px;
	padding: 5px;
}

#bluesky img {
	max-width: 45%;
	height: auto;
}

#bluesky a,
#bluesky a:visited {
	color: white;
	text-decoration: none;
}

#bluesky a:hover {
	color: darkorange;
	text-decoration: underline;
}
