/**
 * Montreal Smoked Meat & Rye — Platter Builder.
 *
 * Ported verbatim from the smoked-meat-on-rye theme so the builder no longer
 * depends on which theme is active. Every theme preset variable below carries
 * a literal fallback: under the original theme the theme's own value wins and
 * nothing changes; under any other theme the fallback keeps it looking right.
 *
 * The source theme referenced six --smr-* variables it never defined, which made
 * 23 declarations invalid and silently dropped: rounded corners, shadows and
 * transitions never rendered. They are defined below, so the builder now shows
 * the design as it was authored. To go back to the flat rendering the live site
 * currently has, comment this block out.
 */

.smr-builder {
	--smr-ease: cubic-bezier(.4, 0, .2, 1);
	--smr-pill: 999px;
	--smr-radius-xl: 18px;
	--smr-shadow: 0 1px 2px rgba(16, 27, 45, .06), 0 4px 12px rgba(16, 27, 45, .06);
	--smr-shadow-lg: 0 8px 28px rgba(16, 27, 45, .12);
}

/**
 * Component styles: booking form, menu builder, menu grid, events gallery.
 *
 * Colours come from theme.json presets, so if Ryan changes the palette in
 * Appearance > Editor > Styles, all of this follows automatically.
 */

/* =========================================================================
   Shared bits
   ====================================================================== */

.smr-btn {
	display: inline-block;
	font-family: var(--wp--preset--font-family--body, "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);
	font-size: var(--wp--preset--font-size--small, 13px);
	font-weight: 600;
	line-height: 1.2;
	text-decoration: none;
	text-align: center;
	background: var(--wp--preset--color--brick, #C8202E);
	color: var(--wp--preset--color--white, #FFFFFF);
	border: 0;
	border-radius: var(--smr-pill);
	padding: .95rem 1.9rem;
	letter-spacing: -.01em;
	cursor: pointer;
	transition: background-color .18s var(--smr-ease), transform .18s var(--smr-ease), box-shadow .18s var(--smr-ease);
}

.smr-btn:hover,
.smr-btn:focus {
	background: var(--wp--preset--color--brick-deep, #9E1721);
	color: var(--wp--preset--color--white, #FFFFFF);
	transform: translateY(-2px);
	box-shadow: var(--smr-shadow);
}

.smr-btn.is-large {
	font-size: var(--wp--preset--font-size--medium, clamp(14px, 0.875rem + ((1vw - 3.2px) * 0.67), 20px));
	padding: 1.1rem 2rem;
	width: 100%;
}

.smr-btn.is-quiet {
	background: transparent;
	color: var(--wp--preset--color--ink, #1B2334);
	box-shadow: inset 0 0 0 1.5px var(--wp--preset--color--line, #E4E8EC);
}

.smr-btn.is-quiet:hover {
	background: var(--wp--preset--color--mist, #F5F8F6);
	color: var(--wp--preset--color--smoke, #101B2D);
	transform: none;
	box-shadow: inset 0 0 0 1.5px var(--wp--preset--color--pickle, #3E7C4F);
}

.smr-btn.is-disabled {
	opacity: .45;
	cursor: not-allowed;
	transform: none;
	box-shadow: none;
}

/* Fields ---------------------------------------------------------------- */

.smr-field {
	margin-bottom: 1.35rem;
}

.smr-field > label,
.smr-field > legend {
	display: block;
	font-weight: 600;
	font-size: var(--wp--preset--font-size--small, 13px);
	color: var(--wp--preset--color--smoke, #101B2D);
	margin-bottom: .45rem;
}

.smr-field input[type="text"],
.smr-field input[type="email"],
.smr-field input[type="tel"],
.smr-field input[type="number"],
.smr-field input[type="date"],
.smr-field select,
.smr-field textarea {
	width: 100%;
	font: inherit;
	font-size: var(--wp--preset--font-size--small, 13px);
	color: var(--wp--preset--color--ink, #1B2334);
	background: var(--wp--preset--color--white, #FFFFFF);
	border: 1.5px solid var(--wp--preset--color--line, #E4E8EC);
	border-radius: 10px;
	padding: .9rem 1rem;
	transition: border-color .16s var(--smr-ease), box-shadow .16s var(--smr-ease);
	-webkit-appearance: none;
	appearance: none;
}

.smr-field select {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='%236E6459' d='M1 1.5 6 6.5l5-5'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 1rem center;
	background-size: 12px;
	padding-right: 2.6rem;
}

.smr-field input:focus,
.smr-field select:focus,
.smr-field textarea:focus {
	border-color: var(--wp--preset--color--pickle, #3E7C4F);
	box-shadow: 0 0 0 3px rgba(62, 124, 79, .16);
	outline: none;
}

.smr-field.has-error input,
.smr-field.has-error select {
	border-color: var(--wp--preset--color--brick, #C8202E);
}

.smr-field textarea {
	resize: vertical;
	min-height: 6rem;
}

.smr-field--inline {
	display: flex;
	align-items: center;
	gap: .85rem;
	margin-bottom: .5rem;
	flex-wrap: wrap;
}

.smr-field--inline > label {
	margin-bottom: 0;
	font-size: var(--wp--preset--font-size--medium, clamp(14px, 0.875rem + ((1vw - 3.2px) * 0.67), 20px));
}

.smr-field--inline input {
	width: 6rem;
	text-align: center;
	font-weight: 700;
}

.smr-field-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.1rem;
}

.smr-hint {
	display: block;
	margin-top: .4rem;
	font-size: var(--wp--preset--font-size--x-small, 0.78rem);
	color: var(--wp--preset--color--warmgrey, #5F6875);
	line-height: 1.45;
}

.smr-hint--block {
	margin-top: -.6rem;
	margin-bottom: 1.35rem;
}

@media (max-width: 640px) {
	.smr-field-row {grid-template-columns: 1fr; gap: 0;}
}


/* =========================================================================
   Build Your Event
   ====================================================================== */

.smr-builder__controls {
	background: var(--wp--preset--color--rye, #F4EFE6);
	border-radius: var(--smr-radius-xl);
	padding: 1.25rem 1.5rem;
	margin-bottom: var(--wp--preset--spacing--30, 0.67rem);
}

.smr-builder__layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 21rem;
	gap: var(--wp--preset--spacing--30, 0.67rem);
	align-items: start;
}

.smr-builder__section + .smr-builder__section {
	margin-top: var(--wp--preset--spacing--40, 1rem);
}

.smr-builder__sectiontitle {
	font-size: var(--wp--preset--font-size--large, clamp(22.041px, 1.378rem + ((1vw - 3.2px) * 1.558), 36px));
	margin: 0 0 1rem;
	padding-bottom: .6rem;
	border-bottom: 3px solid transparent;
	border-image: linear-gradient(
		90deg,
		var(--wp--preset--color--brick, #C8202E) 0 33.33%,
		var(--wp--preset--color--mustard, #E8B317) 33.33% 66.66%,
		var(--wp--preset--color--pickle, #3E7C4F) 66.66% 100%
	) 1;
}

.smr-builder__grid {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
	gap: 1rem;
}

/* Item tiles ------------------------------------------------------------- */

.smr-tile__label {
	display: block;
	height: 100%;
	cursor: pointer;
	background: var(--wp--preset--color--paper, #FFFFFF);
	border: 1px solid var(--wp--preset--color--line, #E4E8EC);
	border-radius: var(--smr-radius-xl);
	overflow: hidden;
	transition: border-color .18s var(--smr-ease), transform .18s var(--smr-ease), box-shadow .18s var(--smr-ease);
}

.smr-tile__label:hover {
	transform: translateY(-4px);
	box-shadow: var(--smr-shadow);
	border-color: rgba(62, 124, 79, .4);
}

.smr-tile__check {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.smr-tile.is-picked .smr-tile__label {
	border-color: var(--wp--preset--color--pickle, #3E7C4F);
	box-shadow: 0 0 0 1px var(--wp--preset--color--pickle, #3E7C4F), var(--smr-shadow);
}

.smr-tile__check:focus-visible + .smr-tile__media {
	outline: 3px solid var(--wp--preset--color--mustard, #E8B317);
	outline-offset: -3px;
}

.smr-tile__media {
	display: block;
	position: relative;
	aspect-ratio: 4 / 3;
	min-height: 0;
	border-radius: 0;
	overflow: hidden;
}

.smr-tile__flag {
	position: absolute;
	top: .6rem;
	left: .6rem;
	z-index: 2;
	background: var(--wp--preset--color--brick, #C8202E);
	color: #fff;
	font-size: .65rem;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
	padding: .3rem .6rem;
	border-radius: 3px;
}

.smr-tile__tick {
	position: absolute;
	top: .6rem;
	right: .6rem;
	z-index: 2;
	width: 1.9rem;
	height: 1.9rem;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: rgba(251, 247, 240, .92);
	color: transparent;
	border: 2px solid rgba(28, 26, 23, .2);
	font-weight: 700;
	transition: background-color .18s var(--smr-ease), color .18s var(--smr-ease), transform .18s var(--smr-ease);
}

.smr-tile.is-picked .smr-tile__tick {
	background: var(--wp--preset--color--pickle, #3E7C4F);
	border-color: var(--wp--preset--color--pickle, #3E7C4F);
	color: #fff;
	transform: scale(1.1);
}

.smr-tile__body {
	display: block;
	padding: .95rem 1.1rem 1.15rem;
}

.smr-tile__name {
	display: block;
	font-family: var(--wp--preset--font-family--display, "Oswald", "Haettenschweiler", "Arial Narrow", "Helvetica Neue Condensed", Impact, sans-serif);
	font-size: var(--wp--preset--font-size--medium, clamp(14px, 0.875rem + ((1vw - 3.2px) * 0.67), 20px));
	text-transform: uppercase;
	line-height: 1.15;
	color: var(--wp--preset--color--smoke, #101B2D);
	margin-bottom: .35rem;
}

.smr-tile__desc {
	display: block;
	font-size: var(--wp--preset--font-size--small, 13px);
	color: var(--wp--preset--color--warmgrey, #5F6875);
	line-height: 1.5;
	margin-bottom: .5rem;
}

/* Dietary badge. Pickle green, because it is the one colour on the plate
   that is not meat — it reads as "there is something here for you". */
.smr-tile__diet {
	display: inline-block;
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: #fff;
	background: var(--wp--preset--color--pickle, #3E7C4F);
	padding: .22rem .5rem;
	border-radius: 3px;
	margin-bottom: .5rem;
}

.smr-tile__price {
	display: block;
	font-size: var(--wp--preset--font-size--small, 13px);
	color: var(--wp--preset--color--smoke, #101B2D);
}

.smr-tile__price strong {
	font-size: var(--wp--preset--font-size--medium, clamp(14px, 0.875rem + ((1vw - 3.2px) * 0.67), 20px));
}

/* Cart ------------------------------------------------------------------- */

.smr-builder__cart {
	position: sticky;
	top: 1.5rem;
}

.smr-builder__cartinner {
	background: var(--wp--preset--color--smoke, #101B2D);
	color: var(--wp--preset--color--paper, #FFFFFF);
	border-radius: var(--smr-radius-xl);
	padding: 1.5rem;
	box-shadow: var(--smr-shadow-lg);
}

.smr-builder__cartinner h3 {
	color: var(--wp--preset--color--mustard, #E8B317);
	font-size: var(--wp--preset--font-size--large, clamp(22.041px, 1.378rem + ((1vw - 3.2px) * 1.558), 36px));
	margin: 0 0 1rem;
}

.smr-builder__empty {
	font-size: var(--wp--preset--font-size--small, 13px);
	color: rgba(244, 237, 225, .65);
	line-height: 1.55;
	margin: 0 0 1rem;
}

.smr-builder__lines {
	list-style: none;
	margin: 0 0 1rem;
	padding: 0;
}

.smr-builder__line {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 0 .75rem;
	padding: .7rem 0;
	border-bottom: 1px solid rgba(244, 237, 225, .14);
	font-size: var(--wp--preset--font-size--small, 13px);
	animation: smr-linein .22s var(--smr-ease);
}

.smr-builder__linename {
	font-weight: 600;
}

.smr-builder__lineqty {
	grid-column: 1;
	font-size: var(--wp--preset--font-size--x-small, 0.78rem);
	color: rgba(244, 237, 225, .6);
}

.smr-builder__linecost {
	grid-column: 2;
	grid-row: 1 / span 2;
	align-self: center;
	color: var(--wp--preset--color--mustard, #E8B317);
	white-space: nowrap;
}

.smr-builder__total {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	padding: 1rem 0 .35rem;
	border-top: 2px solid var(--wp--preset--color--mustard, #E8B317);
	font-size: var(--wp--preset--font-size--small, 13px);
	letter-spacing: .08em;
	text-transform: uppercase;
}

.smr-builder__total strong {
	font-family: var(--wp--preset--font-family--display, "Oswald", "Haettenschweiler", "Arial Narrow", "Helvetica Neue Condensed", Impact, sans-serif);
	font-size: var(--wp--preset--font-size--x-large, clamp(25.014px, 1.563rem + ((1vw - 3.2px) * 1.896), 42px));
	color: var(--wp--preset--color--mustard, #E8B317);
	letter-spacing: normal;
}

.smr-builder__perhead {
	margin: 0 0 1.25rem;
	font-size: var(--wp--preset--font-size--x-small, 0.78rem);
	color: rgba(244, 237, 225, .65);
}

.smr-builder__smallprint {
	margin: 1rem 0 0;
	font-size: var(--wp--preset--font-size--x-small, 0.78rem);
	color: rgba(244, 237, 225, .5);
	line-height: 1.5;
}

@media (max-width: 900px) {
	.smr-builder__layout {grid-template-columns: 1fr;}
	.smr-builder__cart {position: sticky; bottom: 0; top: auto; z-index: 5;}
}

@keyframes smr-linein {
	from { opacity: 0; transform: translateX(-6px); }
	to   { opacity: 1; transform: none; }
}

/* The "Photo to come" placeholder. The source theme emitted this class but never
   styled it, so it rendered as bare text in an empty box. */
.smr-imgslot{position:relative;display:flex;align-items:center;justify-content:center;
	background:repeating-linear-gradient(45deg,rgba(0,0,0,.035) 0 10px,rgba(0,0,0,.06) 10px 20px);
	color:var(--wp--preset--color--warmgrey, #5F6875);font-size:.72rem;text-transform:uppercase;
	letter-spacing:.1em;text-align:center;min-height:120px}
.smr-imgslot__placeholder{opacity:.75}
.smr-tile__media img{display:block;width:100%;height:100%;object-fit:cover}
.smr-tile.is-picked .smr-imgslot{background:repeating-linear-gradient(45deg,rgba(62,124,79,.08) 0 10px,rgba(62,124,79,.14) 10px 20px)}
