/**
 * Domestic Collections — front-end analytics layer.
 *
 * ── v1.4.7 ISOLATED SCROLL ARCHITECTURE ────────────────────────────────────────────
 * Every rule below targets a dedicated "bh-bo-*" class. There is NOT ONE bare element
 * selector (no `table`, `tr`, `td`, `th`) and NOT ONE rule that reaches into the BH
 * theme (the old `.bo-details-wrapper` override was removed). This makes the analytics
 * UI fully isolated from the BH legacy theme CSS: the theme cannot restyle it and it
 * cannot restyle the theme.
 *
 * Scroll ownership: the SCROLL CONTAINER (.bh-bo-scroll-container) owns both axes of
 * scroll and is clamped to 100% of the card. The TABLE uses an explicit min-width
 * (1000px, or 1500px when the four occupancy columns are shown) and never `width:100%`,
 * so a wide table scrolls INSIDE the container and can never widen the card — or push
 * the page into a horizontal scrollbar. `contain: inline-size` on the wrapper is the
 * hard guarantee that no descendant can stretch the theme's details cell.
 *
 * The first two columns (# and Name) are frozen via .bh-bo-sticky-column with solid
 * backgrounds and an explicit z-index hierarchy (header corner > header > body sticky
 * cells > normal cells) on desktop AND mobile.
 */

/* ── Containment: analytics can never widen the theme's details cell / the page ── */
.bh-bo-analytics-wrapper {
	margin-top: 20px;
	display: flex;
	flex-direction: column;
	gap: 18px;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	contain: inline-size; /* descendants' inline size cannot stretch the cell */
}

.bh-bo-card,
.bh-bo-section {
	background: #ffffff;
	border: 1px solid #e2e8f0;
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0 1px 3px rgba( 0, 0, 0, 0.03 );
	width: 100%;
	max-width: 100%;
	min-width: 0;
	position: relative; /* containing block for the scroll hint */
}

.bh-bo-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	flex-wrap: wrap;
	padding: 14px 16px;
	border-bottom: 1px solid #edf1f5;
}

.bh-bo-title {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 17px;
	font-weight: 800;
	color: #1a202c;
}

.bh-bo-ico { font-size: 18px; line-height: 1; }

.bh-bo-pill {
	font-size: 11px;
	font-weight: 700;
	color: #3949ab;
	background: #e8eaf6;
	border-radius: 999px;
	padding: 3px 10px;
	letter-spacing: .02em;
}

.bh-bo-meta { display: inline-flex; align-items: center; gap: 12px; }

.bh-bo-rows {
	font-size: 11px;
	font-weight: 700;
	color: #718096;
	letter-spacing: .04em;
}

/* ── Scroll frame: OWNS both scroll axes; clamped to the card width ── */
.bh-bo-scroll-container {
	width: 100%;
	max-width: 100%;
	min-width: 0;
	max-height: 350px;
	overflow-x: auto;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}

/* ── The table uses an explicit min-width (NEVER width:100%) so it scrolls inside
      the container instead of stretching the card. ── */
.bh-bo-analytics-table {
	min-width: 1000px;          /* today's single-header layout */
	border-collapse: separate;
	border-spacing: 0;
	font-size: 13px;
}
.bh-bo-analytics-table.bh-bo-has-occ {
	min-width: 1500px;          /* grouped layout with the 4 occupancy columns */
}

/* ── Header cells ── */
.bh-bo-table-header .bh-bo-th {
	position: sticky;
	top: 0;
	z-index: 5;
	background: #1a1a1a;
	color: #ffffff;
	text-align: right;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .03em;
	text-transform: uppercase;
	padding: 10px 14px;
	white-space: nowrap;
}
.bh-bo-table-header .bh-bo-col-rank,
.bh-bo-table-header .bh-bo-name-h { text-align: left; }
.bh-bo-table-header .bh-bo-is-sorted { color: #ffd24d; }

/* ── Body cells ── */
.bh-bo-td {
	padding: 12px 14px;
	text-align: right;
	white-space: nowrap;
	border-bottom: 1px solid #eef1f4;
	color: #2b303a;
	font-variant-numeric: tabular-nums;
	background: #ffffff;
}
.bh-bo-row:hover .bh-bo-td { background: #fafbfc; }
.bh-bo-td.bh-bo-rank { text-align: left; color: #a0aec0; }
.bh-bo-td.bh-bo-name { text-align: left; font-weight: 700; color: #1a202c; }

.bh-bo-occ {
	display: inline-block;
	min-width: 56px;
	text-align: center;
	border-radius: 6px;
	padding: 4px 8px;
	font-weight: 700;
	font-size: 12px;
}
.bh-bo-occ.bh-bo-is-na { background: #f1f3f5; color: #a0aec0; font-weight: 600; }

.bh-bo-row.bh-bo-hidden { display: none; }

.bh-bo-showall {
	display: block;
	width: 100%;
	background: #ffffff;
	border: none;
	border-top: 1px solid #edf1f5;
	color: #df1f26;
	font-weight: 700;
	font-size: 13px;
	letter-spacing: .03em;
	padding: 12px;
	cursor: pointer;
}
.bh-bo-showall:hover { background: #fdf5f5; }

/* ── Grouped two-tier header + conditional occupancy columns.
      Only present when time-of-day occupancy exists; today's single-header layout is
      unchanged. ── */
.bh-bo-grouprow .bh-bo-th {
	top: 0;
	z-index: 5;
	height: 30px;
	box-sizing: border-box;
	text-align: center;
	background: #111111;
	color: #ffffff;
	font-size: 10.5px;
	letter-spacing: .04em;
}
/* When grouped, the column-label row sits just below the group row. */
.bh-bo-analytics-table.bh-bo-has-occ .bh-bo-colrow .bh-bo-th { top: 30px; }
.bh-bo-group { border-left: 1px solid #333333; }
.bh-bo-group-occ,
.bh-bo-colrow .bh-bo-th.bh-bo-occ-start { border-left: 2px solid #4a4a4a; }
.bh-bo-td.bh-bo-occ-start { border-left: 2px solid #e2e8f0; }

/* ── Freeze # (col 1) and Name (col 2) — Excel-style freeze panes — on every
      breakpoint. Solid backgrounds (never transparent) + z-index hierarchy:
      header corner > header > body sticky cells > normal cells. ── */
.bh-bo-sticky-column { position: sticky; }
.bh-bo-sticky-rank {
	left: 0;
	width: 40px;
	min-width: 40px;
	max-width: 40px;
}
.bh-bo-sticky-name {
	left: 40px;
	border-right: 1px solid #e2e8f0;
}

/* Body sticky cells: above normal body cells, below the header. */
.bh-bo-td.bh-bo-sticky-column { z-index: 4; background: #ffffff; }
.bh-bo-row:hover .bh-bo-td.bh-bo-sticky-column { background: #fafbfc; }

/* Header sticky corners: above everything. */
.bh-bo-table-header .bh-bo-th.bh-bo-sticky-column { z-index: 6; background: #1a1a1a; }
.bh-bo-grouprow .bh-bo-th.bh-bo-sticky-column { background: #111111; }
.bh-bo-table-header .bh-bo-th.bh-bo-sticky-name { border-right-color: #333333; }

/* ── Optional subtle "scrollable" hint (does not scroll with the table; pinned to the
      card's bottom-right because its containing block is the positioned .bh-bo-section). ── */
.bh-bo-scroll-hint {
	position: absolute;
	right: 14px;
	bottom: 14px;
	z-index: 7;
	pointer-events: none;
	background: rgba( 26, 26, 26, 0.72 );
	color: #ffffff;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	padding: 3px 9px;
	border-radius: 999px;
	opacity: .55;
}

/* ── Misc ── */
.bh-bo-loading { padding: 14px 4px; color: #718096; font-size: 13px; }
.bh-bo-heading {
	font-size: 11px;
	font-weight: 700;
	color: #718096;
	text-transform: uppercase;
	margin-bottom: 12px;
	letter-spacing: .5px;
}

@media ( max-width: 767px ) {
	.bh-bo-title { font-size: 15px; }
	/* Keep the min-widths so the table scrolls inside the container; the frozen
	   # and Name columns remain pinned exactly as on desktop. */
}