/**
 * Bohemian Marine – [charter_overnight]
 *
 * Loaded after charter.css, so the season chips (.bm-field, .bm-chips,
 * .bm-chip) keep the selector's styling. This file only styles the
 * overnight tables and notes.
 *
 * All colours are solid, not transparent, so the sticky first column
 * never shows the numbers scrolling underneath it.
 */

.bm-overnight {
	--bmo-line: var(--bm-line, #dbe2e4);
	--bmo-bg: var(--bm-bg, #ffffff);
	--bmo-head: var(--bm-surface, #f2f5f5);
	--bmo-stripe: #f7f9f9;
	--bmo-text: var(--bm-text, #0d2028);
	--bmo-muted: var(--bm-muted, #5c7079);
	--bmo-radius: var(--bm-radius, 12px);

	display: grid;
	gap: 1.25rem;
	color: var(--bmo-text);
}

.bm-overnight__title {
	margin: 0;
}

.bm-overnight__panel[hidden] {
	display: none;
}

/* The box only scrolls if a table really cannot fit, e.g. on a very
   narrow phone or with larger text settings. */
.bm-overnight__scroll {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border: 1px solid var(--bmo-line);
	border-radius: var(--bmo-radius);
	background: var(--bmo-bg);
}

.bm-overnight__grid {
	width: 100%;
	margin: 0;
	border-collapse: collapse;
	font-variant-numeric: tabular-nums;
	background: var(--bmo-bg);
}

.bm-overnight__grid caption {
	padding: 0.75rem 1rem;
	border-bottom: 1px solid var(--bmo-line);
	background: var(--bmo-head);
	text-align: left;
	font-weight: 600;
	caption-side: top;
}

.bm-overnight__grid th,
.bm-overnight__grid td {
	padding: 0.7rem 1rem;
	border-top: 1px solid var(--bmo-line);
	background: var(--bmo-bg);
	text-align: right;
	white-space: nowrap;
}

.bm-overnight__grid thead th {
	border-top: 0;
	background: var(--bmo-head);
	color: var(--bmo-muted);
	font-size: 0.8125rem;
	font-weight: 600;
}

.bm-overnight__grid tbody tr:nth-child(even) th,
.bm-overnight__grid tbody tr:nth-child(even) td {
	background: var(--bmo-stripe);
}

/* Trip length column */
.bm-overnight__grid th:first-child {
	position: sticky;
	left: 0;
	z-index: 1;
	text-align: left;
	font-weight: 700;
}

.bm-overnight__notes {
	color: var(--bmo-muted);
	font-size: 0.925em;
	line-height: 1.6;
}

.bm-overnight__notes p {
	margin: 0 0 0.6em;
}

.bm-overnight__notes p:last-child {
	margin-bottom: 0;
}

.bm-overnight__notes strong {
	color: var(--bmo-text);
}

/* Phones: tighter cells and smaller type, so all four columns fit
   without scrolling. The band headers may wrap onto two lines. */
@media (max-width: 39.99em) {

	.bm-overnight__grid caption {
		padding: 0.65rem 0.75rem;
		font-size: 0.9375rem;
	}

	.bm-overnight__grid th,
	.bm-overnight__grid td {
		padding: 0.6rem 0.5rem;
		font-size: 0.875rem;
	}

	.bm-overnight__grid th:first-child {
		padding-left: 0.75rem;
	}

	.bm-overnight__grid td:last-child,
	.bm-overnight__grid thead th:last-child {
		padding-right: 0.75rem;
	}

	.bm-overnight__grid thead th {
		font-size: 0.75rem;
		line-height: 1.3;
		white-space: normal;
		vertical-align: bottom;
	}
}
