/* Franchise Core: menu cards, badges and tag lists. */

.fc-menu-card {
	display: grid;
	gap: 0.5rem;
	align-content: start;
	justify-items: start;
	height: 100%;
	padding: 1.1rem 1.2rem;
	border: 1px solid rgba(43, 26, 18, 0.12);
	border-radius: 14px;
	background: #fff;
}

/*
 * Full-bleed photo across the top of the card. Two classes so this wins over Elementor's
 * ".elementor img { max-width: 100%; border-radius: 0 }" on Elementor-built pages.
 */
.fc-menu-card .fc-menu-card__image {
	width: calc(100% + 2.4rem);
	max-width: none;
	height: auto;
	margin: -1.1rem -1.2rem 0.25rem;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: 13px 13px 0 0; /* 1px less than the card so it sits inside the border. */
}

.fc-menu-card__head {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 1rem;
	width: 100%;
}

.fc-menu-card__title { margin: 0; font-size: 1.125rem; line-height: 1.3; }
.fc-menu-card__title a { color: inherit; text-decoration: none; }
.fc-menu-card__title a:hover { text-decoration: underline; }
.fc-menu-card__price { font-weight: 700; color: var(--bk-crust, #8b4a2b); white-space: nowrap; }
.fc-menu-card__desc { margin: 0; font-size: 0.9375rem; color: rgba(43, 26, 18, 0.8); }

.fc-badge {
	display: inline-block;
	padding: 0.15em 0.65em;
	border-radius: 999px;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	background: var(--bk-butter, #f2c14e);
	color: var(--bk-cocoa, #2b1a12);
}

.fc-badge--new { background: #dcebf7; color: #163f5e; }
.fc-badge--seasonal { background: #f6dccb; color: #6b2f12; }

.fc-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.fc-tags li {
	padding: 0.1em 0.6em;
	border: 1px solid rgba(43, 26, 18, 0.2);
	border-radius: 999px;
	font-size: 0.75rem;
	color: rgba(43, 26, 18, 0.85);
}

.fc-tags--large li { padding: 0.3em 0.85em; font-size: 0.875rem; background: #fff; }

/* [menu_items] grid and compact list */
.fc-menu-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr));
	gap: 1rem;
}

.fc-menu-list {
	display: grid;
	margin: 0;
	padding: 0;
	list-style: none;
}

.fc-menu-list li {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	padding: 0.75rem 0;
	border-bottom: 1px dashed rgba(43, 26, 18, 0.2);
}

.fc-menu-list li:last-child { border-bottom: 0; }
.fc-menu-list a { color: inherit; font-weight: 600; text-decoration: none; }
.fc-menu-list a:hover { text-decoration: underline; }
.fc-menu-list__price { font-weight: 700; color: var(--bk-crust, #8b4a2b); }