/* Allergens page — per-dish matrix table (beurre-menu [beurre_allergen_matrix]),
   styled to the Warm Artisanal system. The plugin ships no CSS for this table. */

.beurre-allergen-matrix-wrap {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border: 1px solid var(--line);
	border-radius: var(--r-lg);
	box-shadow: var(--shadow-sm);
	background: var(--surface);
	margin-top: 8px;
}
.beurre-allergen-matrix {
	border-collapse: collapse;
	width: 100%;
	min-width: 780px;
	font-family: var(--font-body);
	font-size: 13px;
	color: var(--fg2);
}
.beurre-allergen-matrix th,
.beurre-allergen-matrix td {
	border-bottom: 1px solid var(--line);
	border-right: 1px solid var(--line);
	padding: 9px 8px;
	text-align: center;
	vertical-align: middle;
}
.beurre-allergen-matrix thead th {
	position: sticky;
	top: 0;
	z-index: 2;
	background: var(--cream);
	border-bottom: 1.5px solid var(--gold-leaf);
}
.beurre-allergen-matrix thead th:first-child { text-align: left; }
.beurre-allergen-matrix .head-wrap { display: flex; flex-direction: column; align-items: center; gap: 5px; min-width: 40px; }
.beurre-allergen-matrix .head-icon { display: inline-flex; width: 22px; height: 22px; color: var(--gold-deep); }
.beurre-allergen-matrix .head-icon svg { width: 22px; height: 22px; }
.beurre-allergen-matrix .head-label { font-size: 10px; line-height: 1.2; letter-spacing: .03em; text-transform: uppercase; font-weight: 600; color: var(--fg3); max-width: 66px; }

.beurre-allergen-matrix .dish-cell {
	position: sticky;
	left: 0;
	z-index: 1;
	text-align: left;
	min-width: 210px;
	font-weight: 500;
	color: var(--ink);
	background: var(--surface);
	box-shadow: 1px 0 0 var(--line);
}
.beurre-allergen-matrix tbody tr:nth-child(even) td { background: var(--blush-50); }
.beurre-allergen-matrix tbody tr:nth-child(even) .dish-cell { background: var(--blush-50); }
.beurre-allergen-matrix .tick-cell {
	color: var(--gold-deep);
	font-weight: 600;
	font-size: 11px;
	background: rgba(192, 151, 75, .10);
}
.beurre-allergen-matrix tbody tr:hover td { background: var(--blush); }
.beurre-allergen-matrix tbody tr:hover .dish-cell { background: var(--blush); }

@media (max-width: 760px) {
	.beurre-allergen-matrix .dish-cell { min-width: 150px; }
}