/* page.php skips the narrow .bof-prose reading-width cap on pages that
   contain this shortcode, so this just needs to fill its container
   (up to the theme's normal 1180px page width) -- no viewport-relative
   breakout math needed (that approach previously overflowed past the
   content edge on desktop, since 100vw doesn't account for the
   vertical scrollbar's width). */
.bof-nutrition-table {
	display: flex;
	flex-direction: column;
	gap: 16px;
	width: 100%;
}

.bof-nutrition-table__filters {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px;
}
.bof-nutrition-table__search,
.bof-nutrition-table__category {
	font-family: var(--bof-font-body);
	font-size: 0.95rem;
	padding: 10px 14px;
	border: 1px solid var(--bof-line);
	border-radius: 999px;
	background: var(--bof-paper);
	color: var(--bof-ink);
}
.bof-nutrition-table__search { flex: 1 1 240px; }
.bof-nutrition-table__range { display: flex; align-items: center; gap: 8px; font-size: 0.9rem; }
.bof-nutrition-table__range input {
	width: 90px;
	padding: 8px 10px;
	border: 1px solid var(--bof-line);
	border-radius: 8px;
}
.bof-nutrition-table__filter-label { font-weight: 600; font-size: 0.9rem; display: block; margin-bottom: 8px; }
.bof-nutrition-table__allergen-filter { font-size: 0.9rem; }
.bof-nutrition-table__allergen-list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
	gap: 6px 16px;
	padding: 12px;
	background: var(--bof-paper);
	border: 1px solid var(--bof-line);
	border-radius: 8px;
}
.bof-nutrition-table__count { font-family: var(--bof-font-mono); font-size: 0.8rem; color: var(--bof-stone); }

.bof-nutrition-table__scroll { overflow-x: auto; border: 1px solid var(--bof-line); border-radius: var(--bof-radius); }
.bof-nutrition-table__table { width: 100%; border-collapse: collapse; min-width: 720px; background: var(--bof-paper); }
.bof-nutrition-table__table th,
.bof-nutrition-table__table td { padding: 10px 14px; text-align: left; border-bottom: 1px solid var(--bof-line); font-size: 0.9rem; }
.bof-nutrition-table__table thead th {
	font-family: var(--bof-font-mono);
	text-transform: uppercase;
	font-size: 0.72rem;
	letter-spacing: 0.04em;
	color: var(--bof-stone);
	cursor: pointer;
	user-select: none;
	white-space: nowrap;
}
.bof-nutrition-table__table thead th:hover { color: var(--bof-primary); }
.bof-nutrition-table__table thead th[aria-sort="ascending"]::after { content: " \2191"; }
.bof-nutrition-table__table thead th[aria-sort="descending"]::after { content: " \2193"; }
.bof-nutrition-table__table tbody tr:hover { background: var(--bof-cream); }
.bof-nutrition-table__table a { color: var(--bof-ink); text-decoration: none; font-weight: 600; }
.bof-nutrition-table__table a:hover { color: var(--bof-primary); }

.bof-nutrition-table__group-row td {
	background: var(--bof-cream);
	font-family: var(--bof-font-display);
	font-weight: 700;
	font-size: 1.3rem;
	padding: 14px 14px;
	text-transform: uppercase;
	white-space: normal;
}
.bof-nutrition-table__group-row:hover td { background: var(--bof-cream); }