/* Chakideh - summary box.
   Every colour arrives as a custom property from the admin screen, so the theme
   never has to be edited. Logical properties keep it correct in RTL and LTR. */

.ck-box {
	--ck-line: 1.95;
	position: relative;
	box-sizing: border-box;
	margin: var(--ck-space-before) 0 var(--ck-space-after);
	padding: 0;
	border: 1px solid var(--ck-border);
	border-radius: var(--ck-radius);
	background: var(--ck-bg);
	color: var(--ck-text);
	/* --ck-scale is only ever set by media queries: the admin writes --ck-font as an
	   inline custom property, which an inline style always wins over. */
	font-size: max(14px, calc(var(--ck-font) * var(--ck-scale, 1)));
	line-height: var(--ck-line);
	max-width: 100%;
	clear: both;
	font-family: inherit;
	text-align: start;
}

/* The three supported themes own the decision. Only when none has declared a
   state may the reader's OS choose the plugin's dark tokens. The declarations
   are important because appearance values are intentionally inline per box. */
@media screen and (prefers-color-scheme: dark) {
	html:not([data-mr-theme="light"]):not([data-mr-theme="dark"]):not([data-oe-color-scheme="light"]):not([data-oe-color-scheme="dark"]):not([data-omid-theme="light"]):not([data-omid-theme="dark"]) :is(.ck-box, .ck-toc, .ck-related) {
		--ck-bg: #17212b !important;
		--ck-bg-alt: #1e2b38 !important;
		--ck-border: #3a4a5b !important;
		--ck-text: #e4edf5 !important;
		--ck-title-color: #ffffff !important;
		--ck-muted: #b6c3d0 !important;
		--ck-accent: #68d8ca !important;
		--ck-positive: #78e0a4 !important;
		--ck-negative: #ffa39d !important;
		--ck-chip-bg: #263747 !important;
		--ck-chip-text: #e8f0f7 !important;
		--ck-button-bg: #68d8ca !important;
		--ck-button-text: #10202a !important;
		--ck-mark-text: #10202a !important;
		--ck-step-text: #10202a !important;
		color-scheme: dark;
	}
}

@media screen {
html[data-mr-theme="dark"] :is(.ck-box, .ck-toc, .ck-related),
html[data-oe-color-scheme="dark"] :is(.ck-box, .ck-toc, .ck-related),
html[data-omid-theme="dark"] :is(.ck-box, .ck-toc, .ck-related) {
	--ck-bg: #17212b !important;
	--ck-bg-alt: #1e2b38 !important;
	--ck-border: #3a4a5b !important;
	--ck-text: #e4edf5 !important;
	--ck-title-color: #ffffff !important;
	--ck-muted: #b6c3d0 !important;
	--ck-accent: #68d8ca !important;
	--ck-positive: #78e0a4 !important;
	--ck-negative: #ffa39d !important;
	--ck-chip-bg: #263747 !important;
	--ck-chip-text: #e8f0f7 !important;
	--ck-button-bg: #68d8ca !important;
	--ck-button-text: #10202a !important;
	--ck-mark-text: #10202a !important;
	--ck-step-text: #10202a !important;
	color-scheme: dark;
}
}

.ck-box *,
.ck-box *::before,
.ck-box *::after {
	box-sizing: border-box;
}

.ck-box.ck-width-narrow {
	max-width: 720px;
	margin-inline: auto;
}

.ck-style-plain {
	border-width: 0;
	background: transparent;
	padding: 0;
}

.ck-style-line {
	border-width: 0 0 1px;
	border-radius: 0;
	background: transparent;
}

.ck-style-card {
	box-shadow: 0 1px 2px rgba(16, 24, 40, .05), 0 8px 24px -12px rgba(16, 24, 40, .14);
}

.ck-style-soft {
	box-shadow: none;
}

/* ---------- head ---------- */

.ck-head {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 14px 16px 0;
}

.ck-mark {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	flex: 0 0 34px;
	border-radius: 10px;
	background: var(--ck-accent);
	color: var(--ck-mark-text, #fff);
	font-size: 18px;
}

.ck-style-plain .ck-head,
.ck-style-line .ck-head {
	padding-inline-start: 0;
}

.ck-style-plain .ck-mark,
.ck-style-line .ck-mark {
	background: transparent;
	color: var(--ck-accent);
	width: 24px;
	height: 24px;
	flex-basis: 24px;
}

.ck-head-text {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.ck-box .ck-title {
	margin: 0;
	padding: 0;
	font-size: 1.12em;
	font-weight: 700;
	line-height: 1.5;
	color: var(--ck-title-color);
	border: 0;
	background: none;
	font-family: inherit;
}

.ck-title--plain {
	display: block;
}

.ck-badge {
	font-size: .78em;
	color: var(--ck-muted);
	letter-spacing: 0;
}

/* ---------- panel ---------- */

.ck-panel {
	padding: 12px 16px 14px;
}

.ck-style-plain .ck-panel,
.ck-style-line .ck-panel {
	padding-inline: 0;
}

.ck-box .ck-text {
	margin: 0;
	font-size: 1em;
	line-height: var(--ck-line);
	color: var(--ck-text);
}

/* ---------- sub-blocks ---------- */

.ck-box .ck-sub {
	margin: 16px 0 6px;
	font-size: .86em;
	font-weight: 700;
	color: var(--ck-title-color);
}

.ck-box .ck-points {
	margin: 0;
	padding-inline-start: 18px;
	padding-inline-end: 0;
	list-style: none;
}

.ck-box .ck-point {
	position: relative;
	margin: 0 0 6px;
	padding: 0;
	font-size: .96em;
	line-height: 1.85;
	color: var(--ck-text);
}

.ck-point::before {
	content: "";
	position: absolute;
	inset-inline-start: -14px;
	top: .72em;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--ck-accent);
}

.ck-specs {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
	gap: 4px 16px;
	margin: 14px 0 0;
	padding: 12px 0 0;
	border-top: 1px dashed var(--ck-border);
}

.ck-spec {
	display: flex;
	justify-content: space-between;
	gap: 10px;
	font-size: .9em;
	min-width: 0;
}

.ck-spec dt {
	color: var(--ck-muted);
	font-weight: 500;
	margin: 0;
	flex: 0 1 auto;
}

.ck-spec dd {
	margin: 0;
	color: var(--ck-title-color);
	font-weight: 600;
	text-align: end;
	overflow-wrap: anywhere;
}

/* ---------- chips ---------- */

.ck-chips {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 14px;
	margin-top: 16px;
	padding-top: 14px;
	border-top: 1px dashed var(--ck-border);
}

.ck-chip-group .ck-sub {
	margin-top: 0;
}

.ck-chip-group--up .ck-sub {
	color: var(--ck-positive);
}

.ck-chip-group--down .ck-sub {
	color: var(--ck-negative);
}

.ck-chip-list {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ck-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 4px 10px;
	border: 1px solid var(--ck-border);
	border-radius: 999px;
	background: var(--ck-chip-bg);
	color: var(--ck-chip-text);
	font-size: .84em;
	line-height: 1.7;
	max-width: 100%;
}

.ck-chip-icon {
	display: inline-flex;
	align-items: center;
	font-size: 11px;
}

.ck-chip-group--up .ck-chip-icon {
	color: var(--ck-positive);
}

.ck-chip-group--down .ck-chip-icon {
	color: var(--ck-negative);
}

.ck-chip-label {
	overflow-wrap: anywhere;
}

/* ---------- rating ---------- */

.ck-rating {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0 0 10px;
	font-size: .9em;
	color: var(--ck-muted);
}

.ck-rating-stars {
	display: inline-flex;
	gap: 2px;
	color: #f0a20a;
	font-size: 15px;
}

.ck-star {
	display: inline-block;
	width: 1em;
	height: 1em;
}

.ck-star svg {
	display: block;
	width: 100%;
	height: 100%;
}

.ck-star--empty {
	color: var(--ck-border);
}

.ck-rating-value {
	font-weight: 700;
	color: var(--ck-title-color);
	font-size: 1.15em;
}

.ck-rating-count::before {
	content: "·";
	margin: 0 6px;
}

/* ---------- kind panels (ingredients, steps, hours, size guide, payment) ---------- */

.ck-block {
	margin-top: 16px;
	padding-top: 14px;
	border-top: 1px dashed var(--ck-border);
}

.ck-block .ck-sub {
	margin-top: 0;
}

.ck-box .ck-block-list {
	margin: 0;
	padding-inline-start: 0;
	list-style: none;
}

.ck-block--list .ck-block-item,
.ck-block--qa .ck-block-item {
	position: relative;
	padding-inline-start: 16px;
	margin-bottom: 5px;
	font-size: .95em;
	line-height: 1.85;
}

.ck-block--list .ck-block-item::before {
	content: "";
	position: absolute;
	inset-inline-start: 2px;
	top: .68em;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--ck-accent);
	opacity: .65;
}

.ck-block--steps .ck-block-list {
	counter-reset: ckstep;
}

.ck-block--steps .ck-block-item {
	position: relative;
	padding-inline-start: 30px;
	margin-bottom: 7px;
	font-size: .95em;
	line-height: 1.85;
	counter-increment: ckstep;
}

.ck-block--steps .ck-block-item::before {
	content: counter(ckstep);
	position: absolute;
	inset-inline-start: 0;
	top: .2em;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 21px;
	height: 21px;
	border-radius: 50%;
	background: var(--ck-accent);
	color: var(--ck-step-text, #fff);
	font-size: .72em;
	font-weight: 700;
	line-height: 1;
}

.ck-block--facts .ck-block-item {
	display: flex;
	flex-wrap: wrap;
	gap: 4px 10px;
	padding: 5px 0;
	border-bottom: 1px dotted var(--ck-border);
	font-size: .93em;
	line-height: 1.8;
}

.ck-block--facts .ck-block-item:last-child {
	border-bottom: 0;
}

.ck-block--facts .ck-block-label {
	flex: 0 0 auto;
	min-width: 74px;
	color: var(--ck-muted);
	font-weight: 600;
}

.ck-block--facts .ck-block-label::after {
	content: ":";
	margin-inline-end: 4px;
}

.ck-block--facts .ck-block-value {
	flex: 1 1 160px;
	color: var(--ck-title-color);
	overflow-wrap: anywhere;
}

.ck-block--qa .ck-block-value {
	display: block;
	color: var(--ck-text);
}

/* ---------- footer ---------- */

.ck-box .ck-note {
	margin: 14px 0 0;
	font-size: .8em;
	color: var(--ck-muted);
}

.ck-foot {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
	padding: 10px 16px;
	border-top: 1px solid var(--ck-border);
	border-radius: 0 0 var(--ck-radius) var(--ck-radius);
	background: var(--ck-bg-alt);
	font-size: .88em;
}

.ck-style-plain .ck-foot,
.ck-style-line .ck-foot {
	padding-inline: 0;
	background: transparent;
	border-radius: 0;
}

.ck-question {
	color: var(--ck-muted);
}

.ck-votes {
	display: inline-flex;
	gap: 6px;
	margin-inline-start: auto;
}

.ck-box .ck-vote {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	min-width: 44px;
	min-height: 44px;
	padding: 0;
	border: 1px solid var(--ck-border);
	border-radius: 50%;
	background: var(--ck-chip-bg);
	color: var(--ck-chip-text);
	cursor: pointer;
	font-size: 15px;
	transition: transform .12s ease, background .12s ease;
}

.ck-vote:hover:not(:disabled) {
	transform: translateY(-1px);
	background: var(--ck-bg);
}

.ck-vote:focus-visible {
	outline: 2px solid var(--ck-accent);
	outline-offset: 2px;
}

.ck-vote:disabled {
	cursor: default;
}

.ck-vote.is-done {
	background: var(--ck-button-bg);
	color: var(--ck-button-text);
	border-color: transparent;
	cursor: default;
}

.ck-thanks {
	color: var(--ck-positive);
	font-weight: 600;
}

/* ---------- related reading ---------- */

.ck-related {
	box-sizing: border-box;
	margin: 16px 0 0;
	padding: 14px 16px;
	border: 1px solid var(--ck-border);
	border-inline-start: 4px solid var(--ck-accent);
	border-radius: var(--ck-radius);
	background: var(--ck-bg-alt);
	color: var(--ck-text);
	font-size: max(14px, calc( var(--ck-font, 15px) * .92 ) );
	line-height: 1.7;
}

.ck-related *,
.ck-related *::before,
.ck-related *::after {
	box-sizing: inherit;
}

.ck-related .ck-related-title {
	margin: 0 0 6px;
	font-weight: 700;
	color: var(--ck-title-color);
}

.ck-related-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.ck-related-item + .ck-related-item {
	margin-top: 4px;
	padding-top: 4px;
	border-top: 1px dashed var(--ck-border);
}

.ck-related-item a {
	color: var(--ck-accent);
	text-decoration: none;
	border-radius: 4px;
}

.ck-related-item a:hover,
.ck-related-item a:focus-visible {
	text-decoration: underline;
}

/* ---------- responsive ---------- */

@media (max-width: 600px) {
	.ck-box {
		--ck-scale: .92;
		border-radius: min(var(--ck-radius), 12px);
	}

	.ck-head {
		padding: 12px 12px 0;
		gap: 8px;
	}

	.ck-panel {
		padding: 10px 12px 12px;
	}

	.ck-foot {
		padding: 10px 12px;
	}

	.ck-mark {
		width: 28px;
		height: 28px;
		flex-basis: 28px;
		font-size: 15px;
		border-radius: 8px;
	}

	.ck-chips {
		grid-template-columns: 1fr;
	}

	.ck-specs {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 380px) {
	/* At 320px the question and the two vote buttons crowd one row. */
	.ck-foot {
		flex-direction: column;
		align-items: flex-start;
		gap: 8px;
	}

	.ck-votes {
		margin-inline-start: 0;
	}

	.ck-block--facts .ck-block-label {
		min-width: 0;
		flex: 1 1 100%;
	}
}

@media (prefers-reduced-motion: reduce) {
	.ck-vote {
		transition: none;
	}

	.ck-vote:hover {
		transform: none;
	}
}

@media print {
	.ck-box {
		border: 1px solid #ccc;
		box-shadow: none;
	}

	.ck-foot {
		display: none;
	}
}

/* Keep the box out of the way of page-builder full-bleed sections. */
.entry-content > .ck-box,
.elementor-widget-container > .ck-box,
.vc_column_container > .ck-box {
	margin-inline: 0;
}

/* ==========================================================================
   Table of contents
   ========================================================================== */

.ck-toc {
	--ck-toc-line: 1.9;
	position: relative;
	box-sizing: border-box;
	margin: var(--ck-space-before) 0 var(--ck-space-after);
	padding: 14px 16px;
	border: 1px solid var(--ck-border);
	border-inline-start: 3px solid var(--ck-accent);
	border-radius: var(--ck-radius);
	background: var(--ck-bg);
	color: var(--ck-text);
	font-size: max(14px, calc(var(--ck-font) * var(--ck-scale, 1)));
	line-height: var(--ck-toc-line);
	max-width: 100%;
	clear: both;
	font-family: inherit;
	text-align: start;
}

.ck-toc *,
.ck-toc *::before,
.ck-toc *::after {
	box-sizing: border-box;
}

.ck-toc-head {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 8px;
}

.ck-toc .ck-toc-title {
	margin: 0;
	padding: 0;
	font-size: 1.05em;
	font-weight: 700;
	line-height: 1.5;
	color: var(--ck-title-color);
	border: 0;
	background: none;
	font-family: inherit;
}

.ck-toc-count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 22px;
	height: 22px;
	padding: 0 6px;
	border-radius: 999px;
	background: var(--ck-chip-bg);
	color: var(--ck-muted);
	font-size: .76em;
	font-weight: 600;
	line-height: 1;
}

.ck-toc-toggle {
	appearance: none;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	margin-inline-start: auto;
	min-height: 44px;
	padding: 8px 10px;
	border: 1px solid var(--ck-border);
	border-radius: 999px;
	background: transparent;
	color: var(--ck-muted);
	font: inherit;
	font-size: .8em;
	cursor: pointer;
}

.ck-toc-toggle:hover {
	color: var(--ck-accent);
	border-color: var(--ck-accent);
}

.ck-toc-toggle-icon {
	display: inline-block;
	width: 8px;
	height: 8px;
	border-inline-end: 1.6px solid currentColor;
	border-block-end: 1.6px solid currentColor;
	transform: rotate(45deg);
	transition: transform .18s ease;
}

.ck-toc-toggle[aria-expanded="false"] .ck-toc-toggle-icon {
	transform: rotate(-135deg);
}

.ck-toc .ck-toc-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.ck-toc-list .ck-toc-list {
	margin-inline-start: 14px;
	padding-inline-start: 10px;
	border-inline-start: 1px solid var(--ck-border);
}

.ck-toc .ck-toc-item {
	margin: 0;
}

.ck-toc .ck-toc-link {
	display: flex;
	align-items: baseline;
	gap: 7px;
	padding: 3px 6px;
	margin: 1px -6px;
	border-radius: 6px;
	color: var(--ck-text);
	font-size: .94em;
	line-height: 1.75;
	text-decoration: none;
}

.ck-toc-link:hover,
.ck-toc-link:focus-visible {
	background: var(--ck-chip-bg);
	color: var(--ck-accent);
	text-decoration: none;
}

.ck-toc-link:focus-visible {
	outline: 2px solid var(--ck-accent);
	outline-offset: 1px;
}

.ck-toc-link.is-active {
	background: var(--ck-chip-bg);
	color: var(--ck-accent);
	font-weight: 600;
}

.ck-toc .ck-toc-num {
	flex: 0 0 auto;
	min-width: 2.1em;
	color: var(--ck-muted);
	font-size: .88em;
	font-variant-numeric: tabular-nums;
}

.ck-toc--numbered .ck-toc-list .ck-toc-list .ck-toc-num {
	min-width: 3em;
}

.ck-toc .ck-toc-text {
	flex: 1 1 auto;
	overflow-wrap: anywhere;
}

.ck-toc-item--l4 .ck-toc-text,
.ck-toc-item--l5 .ck-toc-text,
.ck-toc-item--l6 .ck-toc-text {
	font-size: .95em;
	color: var(--ck-muted);
}

/* Collapsed state is JS-driven so the list is always readable without it. */
.ck-toc.ck-toc--closed .ck-toc-body {
	display: none;
}

.ck-toc:not(.ck-js) .ck-toc-toggle {
	display: none;
}

.ck-toc--sticky {
	position: sticky;
	top: 16px;
	z-index: 2;
	max-height: calc(100vh - 32px);
	overflow: auto;
}

/* The anchor target must not hide under a sticky site header. */
[id^="ck-toc-"] {
	scroll-margin-top: 90px;
}

@media (prefers-reduced-motion: reduce) {
	.ck-toc-toggle-icon {
		transition: none;
	}
}

@media (max-width: 600px) {
	.ck-toc {
		--ck-scale: .92;
		padding: 12px;
	}

	.ck-toc-list .ck-toc-list {
		margin-inline-start: 8px;
		padding-inline-start: 7px;
	}

	.ck-toc--sticky {
		position: static;
		max-height: none;
	}
}

@media print {
	.ck-toc-toggle {
		display: none;
	}
}

.ck-box [data-ck-audio], .ck-box .ck-audio, .ck-box .ck-audio-note, .ck-box [hidden] { display:none !important; }

/* Print is deliberately light regardless of a persistent manual dark preference. */
@media print {
 .ck-box,.ck-toc,.ck-related { --ck-bg:#fff!important; --ck-bg-alt:#fff!important; --ck-text:#26323f!important; --ck-title-color:#111c2b!important; --ck-muted:#4b5866!important; --ck-border:#c5ccd3!important; --ck-accent:#0f766e!important; --ck-positive:#15803d!important; --ck-negative:#b42318!important; --ck-chip-bg:#f2f5f7!important; --ck-chip-text:#26323f!important; --ck-mark-text:#fff!important; --ck-step-text:#fff!important; color-scheme:light; }
 .ck-toc.ck-toc--closed .ck-toc-body { display:block; }
}
