/* Menucard – front end */
.mcd {
	--mcd-accent: #b45309;
	--mcd-fg: inherit;
	--mcd-muted: color-mix(in srgb, currentColor 62%, transparent);
	--mcd-line: color-mix(in srgb, currentColor 14%, transparent);
	--mcd-soft: color-mix(in srgb, currentColor 4%, transparent);
	line-height: 1.5;
	margin: 0 0 2em;
}
.mcd *, .mcd *::before, .mcd *::after { box-sizing: border-box; }

/* Tabs */
.mcd-tabs {
	position: sticky;
	top: var(--wp-admin--admin-bar--height, 0px);
	z-index: 5;
	margin: 0 0 18px;
	padding: 10px 0;
	background: var(--mcd-tabs-bg, color-mix(in srgb, Canvas 88%, transparent));
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
}
.mcd-tabs__track {
	display: flex;
	gap: 8px;
	overflow-x: auto;
	scrollbar-width: none;
	padding: 2px;
}
.mcd-tabs__track::-webkit-scrollbar { display: none; }
.mcd .mcd-tab {
	flex: none;
	padding: 8px 16px;
	border-radius: 999px;
	border: 1px solid var(--mcd-line);
	font-size: 14px;
	font-weight: 600;
	color: inherit;
	text-decoration: none !important;
	white-space: nowrap;
	transition: background 0.2s, color 0.2s, border-color 0.2s;
}
.mcd .mcd-tab:hover { border-color: var(--mcd-accent); }
.mcd .mcd-tab.is-active { background: var(--mcd-accent); border-color: var(--mcd-accent); color: #fff; }

/* Sections */
.mcd-sec { scroll-margin-top: 80px; }
.mcd-sec + .mcd-sec { margin-top: 36px; }
.mcd-sec__head { margin-bottom: 12px; padding-bottom: 10px; border-bottom: 2px solid var(--mcd-accent); }
.mcd .mcd-sec__title { margin: 0 !important; font-size: 1.45em; line-height: 1.2; letter-spacing: -0.01em; }
.mcd .mcd-sec__note { margin: 4px 0 0 !important; font-size: 0.92em; color: var(--mcd-muted); font-style: italic; }

.mcd .mcd-items { list-style: none !important; margin: 0 !important; padding: 0 !important; }
.mcd .mcd-item {
	display: flex;
	gap: 16px;
	margin: 0 !important;
	padding: 14px 0;
	border-bottom: 1px dashed var(--mcd-line);
}
.mcd .mcd-item:last-child { border-bottom: 0; }
.mcd-item__body { flex: 1; min-width: 0; }
.mcd-item__top { display: flex; align-items: baseline; gap: 10px; }
.mcd .mcd-item__name { margin: 0 !important; font-size: 1.05em; font-weight: 650; line-height: 1.35; }
.mcd-item__dots { flex: 1; min-width: 12px; }
.mcd--leaders .mcd-item__dots { border-bottom: 2px dotted var(--mcd-line); transform: translateY(-4px); }
.mcd-item__price { flex: none; font-weight: 700; font-variant-numeric: tabular-nums; color: var(--mcd-accent); white-space: nowrap; }
.mcd-item__price small { font-weight: 500; color: var(--mcd-muted); font-size: 0.8em; }
.mcd .mcd-item__desc { margin: 4px 0 0 !important; font-size: 0.93em; color: var(--mcd-muted); }
.mcd .mcd-allergens { margin: 6px 0 0 !important; font-size: 0.8em; color: var(--mcd-muted); }

.mcd-item__media { flex: none; }
.mcd .mcd-item__img { display: block; width: 76px; height: 76px; object-fit: cover; border-radius: 14px; margin: 0 !important; }

.mcd-badges { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.mcd-badge {
	display: inline-flex;
	align-items: center;
	padding: 2px 9px;
	border-radius: 999px;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: var(--b);
	background: color-mix(in srgb, var(--b) 12%, transparent);
	border: 1px solid color-mix(in srgb, var(--b) 25%, transparent);
}

.mcd .mcd-opts { list-style: none !important; margin: 8px 0 0 !important; padding: 0 !important; display: grid; gap: 4px; font-size: 0.93em; }
.mcd .mcd-opts li { display: flex; align-items: baseline; gap: 8px; margin: 0 !important; }
.mcd-opts strong { font-variant-numeric: tabular-nums; color: var(--mcd-accent); }

/* Featured */
.mcd .mcd-item.is-featured {
	margin: 8px -14px !important;
	padding: 16px 14px;
	border: 0;
	border-radius: 16px;
	background: color-mix(in srgb, var(--mcd-accent) 8%, transparent);
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--mcd-accent) 22%, transparent);
}

/* Two columns */
@media (min-width: 760px) {
	.mcd--columns .mcd-items { display: grid; grid-template-columns: 1fr 1fr; column-gap: 40px; }
	.mcd--columns .mcd-item:nth-last-child(2):nth-child(odd) { border-bottom: 0; }
	.mcd--columns .mcd-item.is-featured { margin: 8px 0 !important; }
}

/* Cards */
.mcd--cards .mcd-items { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 18px; }
.mcd--cards .mcd-item {
	flex-direction: column;
	gap: 0;
	padding: 0;
	border: 1px solid var(--mcd-line) !important;
	border-radius: 18px;
	overflow: hidden;
	background: var(--mcd-soft);
	transition: transform 0.2s, box-shadow 0.2s;
}
.mcd--cards .mcd-item:hover { transform: translateY(-3px); box-shadow: 0 18px 40px -22px rgba(0, 0, 0, 0.35); }
.mcd--cards .mcd-item.is-featured { margin: 0 !important; padding: 0; }
.mcd--cards .mcd-item__img { width: 100%; height: auto; aspect-ratio: 4 / 3; border-radius: 0; }
.mcd--cards .mcd-item__body { padding: 14px 16px 16px; }
.mcd--cards .mcd-item__dots { border: 0 !important; }

.mcd-foot { margin-top: 24px !important; padding-top: 14px; border-top: 1px solid var(--mcd-line); font-size: 0.85em; color: var(--mcd-muted); }
.mcd-missing { padding: 12px 16px; border: 1px dashed #cbd5e1; border-radius: 12px; color: #64748b; }

@supports not (color: color-mix(in srgb, red 10%, white)) {
	.mcd { --mcd-muted: inherit; --mcd-line: rgba(127, 127, 127, 0.25); --mcd-soft: rgba(127, 127, 127, 0.05); }
	.mcd-badge { background: transparent; border-color: currentColor; }
	.mcd .mcd-item.is-featured { background: rgba(127, 127, 127, 0.07); box-shadow: none; }
}