/* ----------------------------------------------------------------
	Restaurant demo styles
-----------------------------------------------------------------*/

:root {
	--cnvs-themecolor: #e7272d;
	--cnvs-themecolor-rgb: 231, 39, 45;
	--cnvs-body-font: 'Open Sans', sans-serif;
	--cnvs-primary-font: 'Poppins', sans-serif;
	--cnvs-secondary-font: 'Cookie', cursive;
}

.item-thumb {
	width: 100%;
	margin: 0 auto;
}

.item-thumb .owl-dot {
	width: 33.33333%;
	display: inline-block;
	justify-content: center;
	height: 220px;
	border:0;
	cursor: pointer;
	padding: 15px;
	background-color: transparent;
}

.device-lg .item-thumb .owl-dot,
.device-sm .item-thumb .owl-dot { height: 150px; }

.device-xs .item-thumb .owl-dot {
	width: 50%;
	padding: 10px;
	height: 100px;
}

.item-thumb .owl-dot span {
	position: relative;
	display: block;
	background-size: cover;
	background-position: center center;
	width: auto;
	height: 100%;
	-webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.05);
	-moz-box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.05);
	box-shadow: 0px 0px 5px 1px rgba(0,0,0,0.05);
	-webkit-transition: all .3s ease;
	-o-transition: all .3s ease;
	transition: all .3s ease;
}

.item-thumb .owl-dot:hover span,
.item-thumb .owl-dot.active span { opacity: .7; }


.food-menu .item-thumb .owl-dot:nth-of-type(1) span { background-image: url('restaurant/images/items/food/thumbs/1.jpg'); }
.food-menu .item-thumb .owl-dot:nth-of-type(2) span { background-image: url('restaurant/images/items/food/thumbs/2.jpg'); }
.food-menu .item-thumb .owl-dot:nth-of-type(3) span { background-image: url('restaurant/images/items/food/thumbs/3.jpg'); }
.food-menu .item-thumb .owl-dot:nth-of-type(4) span { background-image: url('restaurant/images/items/food/thumbs/4.jpg'); }
.food-menu .item-thumb .owl-dot:nth-of-type(5) span { background-image: url('restaurant/images/items/food/thumbs/5.jpg'); }
.food-menu .item-thumb .owl-dot:nth-of-type(6) span { background-image: url('restaurant/images/items/food/thumbs/6.jpg'); }
.food-menu .item-thumb .owl-dot:nth-of-type(7) span { background-image: url('restaurant/images/items/food/thumbs/7.jpg'); }
.food-menu .item-thumb .owl-dot:nth-of-type(8) span { background-image: url('restaurant/images/items/food/thumbs/8.jpg'); }
.food-menu .item-thumb .owl-dot:nth-of-type(9) span { background-image: url('restaurant/images/items/food/thumbs/9.jpg'); }

.dessert-menu .item-thumb .owl-dot:nth-of-type(1) span { background-image: url('restaurant/images/items/desserts/thumbs/1.jpg'); }
.dessert-menu .item-thumb .owl-dot:nth-of-type(2) span { background-image: url('restaurant/images/items/desserts/thumbs/2.jpg'); }
.dessert-menu .item-thumb .owl-dot:nth-of-type(3) span { background-image: url('restaurant/images/items/desserts/thumbs/3.jpg'); }
.dessert-menu .item-thumb .owl-dot:nth-of-type(4) span { background-image: url('restaurant/images/items/desserts/thumbs/4.jpg'); }
.dessert-menu .item-thumb .owl-dot:nth-of-type(5) span { background-image: url('restaurant/images/items/desserts/thumbs/5.jpg'); }
.dessert-menu .item-thumb .owl-dot:nth-of-type(6) span { background-image: url('restaurant/images/items/desserts/thumbs/6.jpg'); }
.dessert-menu .item-thumb .owl-dot:nth-of-type(7) span { background-image: url('restaurant/images/items/desserts/thumbs/7.jpg'); }
.dessert-menu .item-thumb .owl-dot:nth-of-type(8) span { background-image: url('restaurant/images/items/desserts/thumbs/8.jpg'); }
.dessert-menu .item-thumb .owl-dot:nth-of-type(9) span { background-image: url('restaurant/images/items/desserts/thumbs/9.jpg'); }

.menu-carousel .heading-block h3 { font-size: 34px; }

.menu-carousel .food-content {
	position: relative;
	padding: 30px 60px;
}

.menu-carousel .heading-block p {
	margin-top: 15px;
	color: #888;
}

.menu-carousel .heading-block .food-info {
	font-family: var(--cnvs-primary-font);
	color: #BBB;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: 400;
	letter-spacing: 2px;
}

.food-price {
	font-size: 24px;
	letter-spacing: -1px;
	font-weight: 500;
	color: #444 !important;
}

.menu-carousel .more-link { margin-top: 35px; border-bottom: 1px solid #333 !important; }

.more-link {
	font-family: var(--cnvs-primary-font) !important;
	font-style: normal;
	border-bottom: 0;
	color: #333;
	margin-top: 10px;
	font-size: 14px;
}

.team-title h4 { font-size: 15px; }
.team-title span {
	font-family: var(--cnvs-body-font) !important;
	font-style: normal;
	margin-bottom: 15px;
	color: #AAA !important;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 1px;
}

.entry {
	margin: 0;
	-webkit-box-shadow: 0 0 15px 2px rgba(0,0,0,0.08);
	-moz-box-shadow: 0 0 15px 2px rgba(0,0,0,0.08);
	box-shadow: 0 0 15px 2px rgba(0,0,0,0.08);
}

.entry-title {
	background-color: #FFF;
}

.entry-meta li::before {
	content: '\00b7';
	opacity: 1;
}


.service-button { margin: 80px 0 80px 15px; }
.device-sm .service-button,
.device-xs .service-button { margin: 30px 0 0; }



#tab-restuarant {
	position: relative;
	transform: translateY(-71px);
}

#tab-restuarant .canvas-alt-tabs2 {
	--bs-nav-pills-link-active-bg: var(--cnvs-contrast-0);
	--bs-nav-pills-link-active-color: var(--cnvs-contrast-900);
	--bs-nav-link-hover-color: var(--bs-nav-tabs-link-active-color);
	--bs-nav-link-padding-x: 30px;
	--bs-nav-link-padding-y: 24px;
	--bs-nav-link-font-size: 16px;
	--bs-nav-link-font-weight: 500;
	--bs-nav-pills-border-radius: 0;
}

#tab-restuarant .tabs .nav-item .nav-link {
	font-family: var(--cnvs-primary-font);
}


#tab-restuarant .tabs .nav-item .nav-link img {
	display: inline-block;
	position: relative;
	top: -2px;
	width: 20px;
	height: 20px;
	margin-right: 8px;
}


.portfolio-item .portfolio-image::after {
	opacity: 0;
	text-align: center;
	vertical-align: -50%;
	padding-top: 47%;
	content: '';
	color: #FFF;
	font-size: 18px;
	font-weight: 600;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(231, 39, 45, 0.55) url('restaurant/images/icons/basket.svg') center center no-repeat;
	border-radius: 0.25rem !important;
	-webkit-transition: opacity .3s ease;
	-o-transition: opacity .3s ease;
	transition: opacity .3s ease;
}

.portfolio-item:hover .portfolio-image::after { opacity: 1; }

.portfolio-desc h4 a {
	color: #666;
	font-size: 16px;
}

.item-price {
	font-size: 18px;
	color: #333;
	font-weight: 700;
}

.dark .copyright-links a,
.dark #copyrights { color: rgba(255,255,255,0.5); }

.page-link,
.page-link:hover,
.page-link:focus { border-color: var(--cnvs-themecolor); }

.reservation-form {
	position: relative;
	right: auto;
	bottom: auto;
	width: 100%;
}

.disabled { color: #AAA; }

/* Border Form Design
---------------------------------------------------------------------------- */
.form-control.border-form-control {
	--cnvs-input-btn-padding-y : 		7px;
	--cnvs-input-btn-padding-x :		4px;
	--cnvs-input-btn-border-width:      1px;
	--cnvs-input-btn-border-color:      #999;
}

.custom-select.border-form-control { background: url('restaurant/images/icons/down-arrow.svg') 96% / 5% no-repeat;}

@media (min-width: 992px) {
	#header.transparent-header #header-wrap::after {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: calc( 100% + 20px );
		z-index: -1;
		background-image: url('restaurant/images/sketch-header.png') !important;
		background-color: transparent !important;
		background-repeat: repeat-x !important;
		background-position: center bottom !important;
		background-size: auto 100% !important;
		-webkit-transition: all .5s ease;
		-o-transition: all .5s ease;
		transition: all .5s ease;
	}

	#header.sticky-header #header-wrap {
		background-color: transparent;
		box-shadow: none;
	}

	.slider-caption h2, .slider-caption .h2 { font-size: 76px; }

	.menu-carousel .heading-block h3 { font-size: 48px; }

	.reservation-form {
		position: absolute;
		right: 50px;
		bottom: -4px;
		width: 40%;
	}
}


/* Page Loader CSS */
.css3-spinner::before,.pizza .slice::after,.pizza .slice::before{content:''}.css3-spinner{height:100vh;-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;background:#FFF}.css3-spinner::before{position:absolute;top:50%;left:50%;-webkit-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%);width:15vmin;height:2vmin;background:#DDD;margin-top:17.5vmin;-webkit-filter:blur(10px);filter:blur(10px);border-radius:100%}.pizza{height:20vmin;width:20vmin;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:0 0;position:relative;-webkit-animation:rotate 13s linear infinite;animation:rotate 13s linear infinite}@-webkit-keyframes rotate{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes rotate{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.pizza .slice{z-index:-1;overflow:visible;position:absolute;width:0;height:0;border-style:solid;border-width:10vmin 2.75vmin 0;border-color:#ffdc73 transparent transparent;left:7.5vmin;top:0;-webkit-transform-origin:50% 100%;transform-origin:50% 100%;-webkit-transform:rotate(0);transform:rotate(0);-webkit-animation:loading 1.8125s ease-in-out infinite;animation:loading 1.8125s ease-in-out infinite}@-webkit-keyframes loading{0%,100%,49%{opacity:1}50%,99%{opacity:0}}@keyframes loading{0%,100%,49%{opacity:1}50%,99%{opacity:0}}.pizza .slice:nth-of-type(2n)::after{box-shadow:.5vmin 2.5vmin 0 #cc333f}.pizza .slice:nth-of-type(4n)::after{box-shadow:.5vmin 2.5vmin 0 #cc333f,1.5vmin 5vmin 0 #cc333f}.pizza .slice:nth-of-type(1){-webkit-transform:rotate(-27.75deg);transform:rotate(-27.75deg);-webkit-animation-delay:-62.5ms;animation-delay:-62.5ms}.pizza .slice:nth-of-type(2){-webkit-transform:rotate(-55.5deg);transform:rotate(-55.5deg);-webkit-animation-delay:-125ms;animation-delay:-125ms}.pizza .slice:nth-of-type(3){-webkit-transform:rotate(-83.25deg);transform:rotate(-83.25deg);-webkit-animation-delay:-.1875s;animation-delay:-.1875s}.pizza .slice:nth-of-type(4){-webkit-transform:rotate(-111deg);transform:rotate(-111deg);-webkit-animation-delay:-.25s;animation-delay:-.25s}.pizza .slice:nth-of-type(5){-webkit-transform:rotate(-138.75deg);transform:rotate(-138.75deg);-webkit-animation-delay:-.3125s;animation-delay:-.3125s}.pizza .slice:nth-of-type(6){-webkit-transform:rotate(-166.5deg);transform:rotate(-166.5deg);-webkit-animation-delay:-375ms;animation-delay:-375ms}.pizza .slice:nth-of-type(7){-webkit-transform:rotate(-194.25deg);transform:rotate(-194.25deg);-webkit-animation-delay:-.4375s;animation-delay:-.4375s}.pizza .slice:nth-of-type(8){-webkit-transform:rotate(-222deg);transform:rotate(-222deg);-webkit-animation-delay:-.5s;animation-delay:-.5s}.pizza .slice:nth-of-type(9){-webkit-transform:rotate(-249.75deg);transform:rotate(-249.75deg);-webkit-animation-delay:-.5625s;animation-delay:-.5625s}.pizza .slice:nth-of-type(10){-webkit-transform:rotate(-277.5deg);transform:rotate(-277.5deg);-webkit-animation-delay:-625ms;animation-delay:-625ms}.pizza .slice:nth-of-type(11){-webkit-transform:rotate(-305.25deg);transform:rotate(-305.25deg);-webkit-animation-delay:-.6875s;animation-delay:-.6875s}.pizza .slice:nth-of-type(12){-webkit-transform:rotate(-333deg);transform:rotate(-333deg);-webkit-animation-delay:-.75s;animation-delay:-.75s}.pizza .slice::before{position:absolute;height:1.5vmin;width:6vmin;background:#bbb083;top:-10.5vmin;left:-3vmin;border-radius:100vmin 100vmin .5vmin .5vmin/50vmin}.pizza .slice::after{border-radius:100%;position:absolute;width:1.25vmin;height:1.25vmin;background:#cc333f;left:-1vmin;top:-7vmin;z-index:2}




/* ----------------------------------------------------------------
	Demo-scoped additions (not part of the 1:1 ported body above)

	1. Demo-scoped "et-line" icon font: the design's contact icons
	   use the freely-redistributable et-line glyph set, which the
	   theme's shipped icon fonts do not include. The font files
	   live next to this stylesheet (shared/et-line/) so
	   imported sites resolve them with no URL remapping. Only the
	   glyph classes this demo uses are declared. Values verbatim
	   from the et-line set.
-----------------------------------------------------------------*/

@font-face {
	font-family: 'et-line';
	src: url('shared/et-line/et-line.woff2') format('woff2'),
		url('shared/et-line/et-line.woff') format('woff'),
		url('shared/et-line/et-line.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}

.icon-et-map, .icon-et-clock, .icon-et-clipboard, .icon-et-heart {
	font-family: 'et-line';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	display:inline-block;
}

.icon-et-clipboard:before {
	content: "\e008";
}
.icon-et-map:before {
	content: "\e025";
}
.icon-et-heart:before {
	content: "\e04a";
}
.icon-et-clock:before {
	content: "\e055";
}

/* ----------------------------------------------------------------
	3. Demo-designed singles (no static source pages exist for
	   these views; they are designed from the demo's own tokens):

	   .restaurant-post    a demo blog post on the global single
	                       template (body class set by the demo
	                       registry when the post carries the demo
	                       stamp).
	   .restaurant-single  a demo menu-item single (Menu Items post
	                       type; template single-canvas_menu_item).

	   Scoped by body class so non-demo posts sharing the same
	   templates are untouched.
-----------------------------------------------------------------*/

/* The archive/grid card rule above (.entry) is deliberately shadowed, but the
   single-page <article class="entry"> shares that class: drop the box-shadow
   on both single types so the shadow stays on the archive/grid cards only. */
.restaurant-single .entry,
.restaurant-post .entry { box-shadow: none; }

.restaurant-post .page-title,
.restaurant-single .page-title,
.restaurant-archive .page-title { background-color: #F5F5F5; }

.restaurant-post .page-title h1,
.restaurant-single .page-title h1,
.restaurant-archive .page-title h1 {
	font-family: var(--cnvs-secondary-font);
	font-weight: 400;
	text-transform: none;
	letter-spacing: 0;
	font-size: 52px;
	line-height: 1.3;
}

.restaurant-post .single-post .entry-title h2,
.restaurant-post .single-post .entry-title h2 a {
	font-family: var(--cnvs-primary-font);
	font-weight: 600;
	letter-spacing: 0;
	text-transform: none;
}

.restaurant-post .single-post .entry-meta a:hover,
.restaurant-post .single-post .entry-title h2 a:hover { color: var(--cnvs-themecolor); }

.restaurant-post .single-post .entry-image img,
.restaurant-single .single-menu-item .entry-image img { border-radius: 6px; }

.restaurant-single .single-menu-item .entry-image { margin-bottom: 30px; }

.restaurant-single .single-menu-item .entry-content p {
	font-size: 16px;
	line-height: 1.8;
}

/* Blog-post article body: a designed long-form read from the demo's own
   tokens (the global single-post template supplies the entry-image / title /
   meta chrome above; this styles the flowing article content). */
.restaurant-post .single-post .entry-content p {
	font-family: var(--cnvs-body-font);
	font-size: 16px;
	line-height: 1.8;
	margin-bottom: 24px;
}

.restaurant-post .single-post .entry-content h2,
.restaurant-post .single-post .entry-content h3,
.restaurant-post .single-post .entry-content h4 {
	font-family: var(--cnvs-primary-font);
	font-weight: 600;
	letter-spacing: 0;
	text-transform: none;
	margin: 8px 0 18px;
}

.restaurant-post .single-post .entry-content h3 { font-size: 24px; }
.restaurant-post .single-post .entry-content h4 { font-size: 20px; }

.restaurant-post .single-post .entry-content blockquote {
	font-family: var(--cnvs-primary-font);
	font-style: italic;
	font-size: 20px;
	line-height: 1.6;
	color: #333;
	border-left: 3px solid var(--cnvs-themecolor);
	background-color: rgba(var(--cnvs-themecolor-rgb), 0.04);
	margin: 30px 0;
	padding: 22px 28px;
}

.restaurant-post .single-post .entry-content blockquote p {
	margin-bottom: 0;
	font-size: 20px;
	line-height: 1.6;
}

.restaurant-post .single-post .entry-content blockquote cite {
	display: block;
	margin-top: 12px;
	font-family: var(--cnvs-body-font);
	font-size: 14px;
	font-style: normal;
	font-weight: 600;
	color: var(--cnvs-themecolor);
}

/* ----------------------------------------------------------------
	4. Menu item description + macros (nutrition)

	   The Menu Items block renders a short description, the price and
	   a compact nutrition row (.item-macros) on every layout: the
	   menu cards grid, the food carousel and the item single. Values
	   are emphasised in the primary font / theme colour; the units and
	   labels stay muted. Demo tokens only.
-----------------------------------------------------------------*/

/* Short ingredient / info line on a menu card. */
.portfolio-desc .item-desc {
	font-family: var(--cnvs-body-font);
	color: #888;
	font-size: 13px;
	line-height: 1.6;
	margin: 3px 0 9px;
}

/* Compact inline nutrition stat row: shared by every layout. */
.item-macros {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 8px 20px;
	margin: 14px 0 0;
	padding: 13px 0 0;
	border-top: 1px solid rgba(var(--cnvs-themecolor-rgb), 0.14);
}

.item-macros li {
	display: flex;
	flex-direction: column;
	font-family: var(--cnvs-body-font);
	font-size: 11px;
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #AAA;
}

.item-macros li span {
	font-family: var(--cnvs-primary-font);
	font-size: 16px;
	font-weight: 600;
	letter-spacing: 0;
	text-transform: none;
	color: var(--cnvs-themecolor);
	margin-bottom: 3px;
}

/* Carousel slide: a little more breathing room above the stat row. */
.menu-carousel .item-macros {
	justify-content: flex-start;
	margin-top: 26px;
}

/* Menu item single: price + macros presented prominently above the long
   description (rendered by the adjacent post-content block). */
.restaurant-single .single-menu-meta { margin: 0 0 28px; }

.restaurant-single .single-menu-meta .item-desc {
	font-family: var(--cnvs-primary-font);
	color: #999;
	font-size: 13px;
	letter-spacing: 2px;
	text-transform: uppercase;
	margin-bottom: 10px;
}

.restaurant-single .single-menu-meta .item-price {
	font-family: var(--cnvs-primary-font);
	font-size: 30px;
	font-weight: 600;
	color: var(--cnvs-themecolor);
	margin-bottom: 4px;
}

/* On the SINGLE only, the nutrition stats become distinct bordered stat
   cards: an equal-width grid of boxed cells (light theme-tinted background,
   hairline border, rounded corners) with the value emphasised over a muted
   uppercase label. The compact inline row on the menu-grid cards and the
   carousel is deliberately NOT affected (this selector is single-scoped). */
.restaurant-single .single-menu-meta .item-macros {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 12px;
	margin-top: 22px;
	padding-top: 0;
	border-top: 0;
}

.restaurant-single .single-menu-meta .item-macros li {
	align-items: center;
	text-align: center;
	padding: 15px 8px;
	font-size: 11px;
	background-color: rgba(var(--cnvs-themecolor-rgb), 0.045);
	border: 1px solid rgba(var(--cnvs-themecolor-rgb), 0.14);
	border-radius: 8px;
}

.restaurant-single .single-menu-meta .item-macros li span {
	font-size: 22px;
	margin-bottom: 5px;
}

@media (max-width: 575.98px) {
	.restaurant-single .single-menu-meta .item-macros { grid-template-columns: repeat(2, 1fr); }
}

/* ----------------------------------------------------------------
	5. Menu item single: two-column dish layout

	   The menu-item single (single-canvas_resto_menu template) presents
	   the dish as a premium two-column read on desktop: a large rounded
	   photo beside a details panel (category, price, macros, description),
	   with a "Back to Menu" button and a "You may also like" row of
	   same-category peers below. It stacks to a single column on mobile.
	   Demo tokens only; the card / price / macros rules above are reused.
-----------------------------------------------------------------*/

.restaurant-single .single-menu-row { margin-bottom: 0; }

/* Image column: large rounded dish photo (no stacked bottom margin; the
   row gutter handles spacing between the stacked columns on mobile). */
.restaurant-single .single-menu-media .entry-image { margin-bottom: 0; }

.restaurant-single .single-menu-media .entry-image img {
	width: 100%;
	border-radius: 10px;
	box-shadow: 0 18px 40px -20px rgba(0, 0, 0, 0.35);
}

/* Details column, an intentional panel: a little breathing room from the
   photo on desktop, with a decorative theme-colour divider (below) separating
   the price/macros block from the flowing description. */
.restaurant-single .single-menu-details { padding: 6px 0; }

@media (min-width: 992px) {
	.restaurant-single .single-menu-details { padding: 6px 0 6px 14px; }
}

/* Category eyebrow: a link back to the menu page. */
.restaurant-single .single-menu-meta .item-category {
	display: inline-block;
	font-family: var(--cnvs-primary-font);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: var(--cnvs-themecolor);
	margin-bottom: 14px;
}

.restaurant-single .single-menu-meta a.item-category:hover { opacity: 0.75; }

/* Single-page footer: back button + related peers, separated from the dish. */
.restaurant-single .single-menu-footer {
	margin-top: 60px;
	padding-top: 44px;
	border-top: 1px solid rgba(0, 0, 0, 0.08);
}

/* Back to Menu is demoted to a SECONDARY (ghost / outline) button so the
   primary "Add to Order" CTA in the details panel keeps visual priority: the
   theme's base `.button` is filled theme-colour, which would otherwise read as
   a second primary action. */
.restaurant-single .single-menu-back {
	margin: 0 0 42px;
	background-color: transparent;
	color: #333;
	border-color: rgba(0, 0, 0, 0.2);
	font-family: var(--cnvs-primary-font);
	font-weight: 500;
}

.restaurant-single .single-menu-back:hover {
	background-color: #333;
	border-color: #333;
	color: #fff;
}

.restaurant-single .related-menu-title {
	font-family: var(--cnvs-primary-font);
	font-weight: 600;
	letter-spacing: 0;
	text-transform: none;
	font-size: 24px;
	margin-bottom: 30px;
}

@media (max-width: 991.98px) {
	.restaurant-single .single-menu-footer { margin-top: 44px; }
}

/* ----------------------------------------------------------------
	6. Menu item single: visual polish

	   Elevates the two-column dish page (§5): a decorative theme-colour
	   divider between the price/macros block and the description, a
	   prominent "Add to Order" primary CTA in the details panel, and the
	   "You may also like" peers reusing the menu-grid card look. Demo
	   tokens only; scoped to .restaurant-single.
-----------------------------------------------------------------*/

/* Decorative divider between the price/macros block and the description: a
   hairline rule accented by a short theme-colour bar (warm/editorial feel). */
.restaurant-single .single-menu-meta {
	position: relative;
	margin: 0 0 26px;
	padding-bottom: 26px;
	border-bottom: 1px solid rgba(0, 0, 0, 0.07);
}

.restaurant-single .single-menu-meta::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -1px;
	width: 54px;
	height: 3px;
	border-radius: 3px;
	background-color: var(--cnvs-themecolor);
}

/* "Add to Order": the primary filled theme-colour CTA (base `.button` is
   already theme-colour filled; this makes it prominent: heavier weight, more
   padding, a soft theme-colour lift). Sits below the description. */
.restaurant-single .single-menu-cta { margin-top: 30px; }

.restaurant-single .single-menu-order {
	margin: 0;
	padding: 0.72rem 2rem;
	font-family: var(--cnvs-primary-font);
	font-weight: 600;
	letter-spacing: 0.4px;
	box-shadow: 0 10px 24px -10px rgba(var(--cnvs-themecolor-rgb), 0.6);
}

.restaurant-single .single-menu-order:hover {
	box-shadow: 0 12px 26px -10px rgba(var(--cnvs-themecolor-rgb), 0.5);
}

/* "You may also like" peers: the same menu-grid card look (rounded photo,
   basket hover overlay, name, price, macros) via the shared .portfolio-item
   rules above (DRY, no card CSS is duplicated). This only adds tablet wrap
   spacing so the third card breathes when it drops to a new row. */
.restaurant-single .related-menu-items .portfolio-item { margin-bottom: 6px; }

@media (max-width: 767.98px) {
	.restaurant-single .related-menu-items .col-md-6 { margin-bottom: 24px; }
}

/* ----------------------------------------------------------------
	7. Blog single sidebar (demo scope)

	   The global single-post template supplies a shared sidebar
	   (Recent Posts, Categories, Tag Cloud widgets). These rules dress
	   it for the restaurant demo ONLY (body.restaurant-post), matching
	   the editorial article typography above (§3). Every selector is
	   under .restaurant-post so the site's other blog singles and the
	   other demos keep their own styling. Demo tokens only.

	   The Recent Posts / Categories / Tag Cloud blocks render with WP
	   core block classes (.wp-block-latest-posts__list /
	   .wp-block-categories / .wp-block-tag-cloud + .tag-cloud-link),
	   which the theme's classic-widget rules (.tagcloud, .widget_*) do
	   not target, so they arrive essentially unstyled and are dressed
	   here.
-----------------------------------------------------------------*/

/* Widget block: separated by whitespace + the title's accent underline
   (drop the theme's inter-widget top border for a cleaner editorial feel). */
.restaurant-post .sidebar .widget {
	margin-top: 2.5rem;
	padding-top: 0;
	border-top: 0;
}

.restaurant-post .sidebar .widget:first-child { margin-top: 0; }

/* Widget title: demo primary font with a short theme-colour accent
   underline (mirrors the article headings' editorial treatment). */
.restaurant-post .sidebar .widget-title {
	position: relative;
	font-family: var(--cnvs-primary-font);
	font-weight: 600;
	font-size: 15px;
	letter-spacing: 0.5px;
	text-transform: uppercase;
	color: #222;
	padding-bottom: 14px;
	margin-bottom: 22px;
	border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.restaurant-post .sidebar .widget-title::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -1px;
	width: 40px;
	height: 2px;
	background-color: var(--cnvs-themecolor);
}

/* Generic widget links: theme-colour on hover. */
.restaurant-post .sidebar .widget a {
	color: #444;
	transition: color 0.25s ease;
}

.restaurant-post .sidebar .widget a:hover { color: var(--cnvs-themecolor); }

/* Recent Posts: clean stacked rows (hairline dividers); the post title in
   the demo primary font, the date muted below it. */
.restaurant-post .sidebar .wp-block-latest-posts__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.restaurant-post .sidebar .wp-block-latest-posts__list li {
	padding: 12px 0;
	border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

.restaurant-post .sidebar .wp-block-latest-posts__list li:first-child { padding-top: 0; }

.restaurant-post .sidebar .wp-block-latest-posts__list li:last-child {
	padding-bottom: 0;
	border-bottom: 0;
}

.restaurant-post .sidebar .wp-block-latest-posts__post-title {
	display: block;
	font-family: var(--cnvs-primary-font);
	font-weight: 500;
	font-size: 14px;
	line-height: 1.5;
}

.restaurant-post .sidebar .wp-block-latest-posts__post-date {
	display: block;
	margin-top: 5px;
	font-family: var(--cnvs-body-font);
	font-size: 12px;
	color: #999;
}

/* Categories: the same clean row rhythm; label in the primary font, the
   post count muted, links pick up the theme-colour hover above. */
.restaurant-post .sidebar .wp-block-categories {
	list-style: none;
	margin: 0;
	padding: 0;
}

.restaurant-post .sidebar .wp-block-categories li {
	padding: 9px 0;
	border-bottom: 1px solid rgba(0, 0, 0, 0.06);
	font-family: var(--cnvs-body-font);
	font-size: 14px;
	color: #999;
}

.restaurant-post .sidebar .wp-block-categories li:first-child { padding-top: 0; }

.restaurant-post .sidebar .wp-block-categories li:last-child {
	padding-bottom: 0;
	border-bottom: 0;
}

.restaurant-post .sidebar .wp-block-categories a {
	font-family: var(--cnvs-primary-font);
	font-weight: 500;
}

/* Tag Cloud: tags as theme-colour-bordered pill/chip links (the demo's
   warm editorial chip: theme-tinted fill + border, fills theme-colour on
   hover). font-size is normalised over the block's per-tag inline pt sizing
   so the chips read as a tidy uniform row (the base .tagcloud rule uses the
   same !important technique). */
.restaurant-post .sidebar .wp-block-tag-cloud {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
}

.restaurant-post .sidebar .wp-block-tag-cloud .tag-cloud-link {
	display: inline-block;
	padding: 6px 14px;
	font-family: var(--cnvs-primary-font);
	font-size: 12px !important;
	font-weight: 500;
	line-height: 1.4;
	color: var(--cnvs-themecolor);
	background-color: rgba(var(--cnvs-themecolor-rgb), 0.06);
	border: 1px solid rgba(var(--cnvs-themecolor-rgb), 0.35);
	border-radius: 50px;
	transition: all 0.25s ease;
}

.restaurant-post .sidebar .wp-block-tag-cloud .tag-cloud-link:hover {
	color: #fff;
	background-color: var(--cnvs-themecolor);
	border-color: var(--cnvs-themecolor);
}

/* ----------------------------------------------------------------
	8. Term / date / author archives: the demo BLOG design.

	   When a demo is site-wide active, Part 2 stamps a `<slug>-archive` body
	   class on every archive-family view (term/date/author archives, the blog
	   home, search). These rules give the GLOBAL archive template's generic
	   post list + title band the demo's blog look WITHOUT editing that shared
	   (every-demo) template: reusing the SAME tokens as the blog-post single
	   (§3) so the archive matches the demo's blog. The archive title band is
	   handled by the shared `.page-title` rules above (extended to
	   `.restaurant-archive`). Demo tokens only; scoped by body class so
	   non-demo sites (which never carry the class) are untouched.
-----------------------------------------------------------------*/

/* Each archive card is a rounded box that breathes vertically (the global
   `.entry` rule zeroes the margin for the grid gutters, and the single-column
   archive list needs row spacing). The soft box-shadow is inherited from the
   ported `.entry` card rule. */
.restaurant-archive .entry {
	margin-bottom: 30px;
	border-radius: 6px;
}

/* .grid-inner already clips its overflow, so this radius rounds the full-bleed
   featured image to the card corners. */
.restaurant-archive .entry .grid-inner { border-radius: 6px; }

/* Padded text block below the full-bleed image: the standard layout has no
   inner padding of its own, so the demo card gives it breathing room. */
.restaurant-archive .entry .entry-title,
.restaurant-archive .entry .entry-meta,
.restaurant-archive .entry .entry-content,
.restaurant-archive .entry .more-link {
	padding-left: 1.75rem;
	padding-right: 1.75rem;
}

.restaurant-archive .entry .entry-title { padding-top: 1.5rem; }

.restaurant-archive .entry .more-link {
	display: inline-block;
	margin-bottom: 1.75rem;
	font-family: var(--cnvs-primary-font);
	font-weight: 600;
	color: var(--cnvs-themecolor);
}

/* Post title: the demo's primary font (the base reads the site post-title
   tokens; the themecolor hover is already inherited from the base rule). */
.restaurant-archive .entry-title h2,
.restaurant-archive .entry-title h2 a {
	font-family: var(--cnvs-primary-font);
	font-weight: 600;
	letter-spacing: 0;
	text-transform: none;
}

/* Excerpt: the demo's readable body copy. */
.restaurant-archive .entry-content p {
	font-family: var(--cnvs-body-font);
	font-size: 16px;
	line-height: 1.7;
}

/* Default all demo images to object-fit:cover (avoid stretch/distortion in fixed-aspect boxes; inert on natural-aspect icons/logos). */
.restaurant img {
	object-fit: cover;
}
