/*
 * ההטמעה: המסמך שנכנס ל-iframe, וקטע ההטמעה שבעמוד הכלי.
 *
 * המסמך המוטמע יורש את מערכת העיצוב של האתר, ולכן הוא נראה כמו
 * האתר ולא כמו רכיב זר. מה שנוסף כאן הוא רק ההתאמות למסגרת: אין
 * מעטפת אתר, אין רוחב מרבי של עמוד, והריווח קטן יותר.
 */

/* ---------- המסמך המוטמע ---------- */

body.mv-embed {
	margin: 0;
	padding: var(--mv-4);
	background: #fff;
	min-width: 0;
}

body.mv-embed .mv-embed__body { display: block; }

body.mv-embed .mv-embed__head { margin-bottom: var(--mv-4); }

body.mv-embed .mv-embed__title {
	font-size: 1.15rem;
	line-height: 1.3;
	margin: 0;
	color: var(--mv-ink-1);
}

body.mv-embed .mv-embed__sub,
body.mv-embed .mv-embed__src {
	margin: var(--mv-1) 0 0;
	font-size: .82rem;
	color: var(--mv-ink-3);
}

body.mv-embed .mv-embed__h2 {
	font-size: .95rem;
	margin: var(--mv-5) 0 var(--mv-2);
	color: var(--mv-ink-2);
}

body.mv-embed .mv-embed__rows {
	list-style: none;
	margin: 0;
	padding: 0;
}

body.mv-embed .mv-embed__rows li {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--mv-3);
	padding: 7px 0;
	border-bottom: 1px solid var(--mv-line);
	font-size: .92rem;
}

body.mv-embed .mv-embed__rows li:last-child { border-bottom: 0; }

body.mv-embed .mv-embed__rows b {
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

body.mv-embed .mv-embed__q {
	margin: var(--mv-3) 0 var(--mv-1);
	font-weight: 700;
}

body.mv-embed .mv-embed__a { margin: 0; font-size: .95rem; }

body.mv-embed .mv-embed__more { margin: var(--mv-4) 0 0; }

body.mv-embed .mv-embed__credit {
	margin: var(--mv-4) 0 0;
	padding-top: var(--mv-3);
	border-top: 1px solid var(--mv-line);
	font-size: .78rem;
	text-align: center;
}

body.mv-embed .mv-embed__credit a { color: var(--mv-ink-3); }

/* ההטמעה אינה עמוד, ולכן אין בה פריסה של עמוד. */
body.mv-embed .mvt-layout,
body.mv-embed .mv-split {
	display: block;
}

body.mv-embed .mv-card,
body.mv-embed .mvt-panel {
	padding: 0;
	border: 0;
	box-shadow: none;
	background: transparent;
	border-radius: 0;
}

body.mv-embed .mvt-panel__h,
body.mv-embed .mv-card__head h2 {
	font-size: .95rem;
}

/*
 * כותרת הכלי נשארת - בהטמעה בלי כותרת אי אפשר לדעת מה זה. מה שיורד
 * הוא מה ששייך לעמוד ולא לכלי: פירורי לחם, שורת הפעולות של האתר,
 * ותווית הקטגוריה.
 */
body.mv-embed .mv-pagehead,
body.mv-embed .mvt-head { margin: 0 0 var(--mv-4); padding: 0; border: 0; }

body.mv-embed .mv-pagehead h1,
body.mv-embed .mvt-head h1 {
	font-size: 1.15rem;
	line-height: 1.3;
	margin: 0;
}

body.mv-embed .mv-pagehead__eyebrow { display: none; }

body.mv-embed .mv-pagehead__lede {
	margin: var(--mv-1) 0 0;
	font-size: .82rem;
	color: var(--mv-ink-3);
}

body.mv-embed--compact .mv-pagehead__lede { display: none; }
body.mv-embed--compact .mv-pagehead h1,
body.mv-embed--compact .mvt-head h1 { font-size: 1.02rem; }

body.mv-embed .mv-crumbs,
body.mv-embed .mvt-actions,
body.mv-embed .mv-no-print { display: none; }

body.mv-embed .mv-result { margin-top: var(--mv-4); }

body.mv-embed--compact { font-size: 14px; }
body.mv-embed--compact .mv-embed__title { font-size: 1.02rem; }
body.mv-embed--compact .mv-embed__rows li { padding: 5px 0; font-size: .86rem; }

@media ( min-width: 700px ) {
	body.mv-embed--wide .mvt-layout {
		display: grid;
		grid-template-columns: minmax(0, 320px) minmax(0, 1fr);
		gap: var(--mv-6);
		align-items: start;
	}
}

/* ---------- קטע ההטמעה בעמוד הכלי ---------- */

.mv-embedbox__lede { margin: 0 0 var(--mv-3); }

.mv-embedbox__tabs {
	display: flex;
	flex-wrap: wrap;
	gap: var(--mv-2);
	margin: var(--mv-5) 0 var(--mv-4);
}

.mv-embedbox__ph {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: var(--mv-2);
	font-size: .95rem;
	margin: 0 0 var(--mv-2);
}

.mv-embedbox__panel + .mv-embedbox__panel { margin-top: var(--mv-6); }

.mv-embedbox__code {
	display: block;
	width: 100%;
	font: 400 12.5px/1.55 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	color: var(--mv-ink-2);
	background: var(--mv-surface-2, #f7f8fb);
	border: 1px solid var(--mv-line);
	border-radius: var(--mv-r-2, 12px);
	padding: var(--mv-3);
	resize: vertical;
	white-space: pre;
	overflow: auto;
}

.mv-embedbox__act {
	display: flex;
	flex-wrap: wrap;
	gap: var(--mv-2);
	margin-top: var(--mv-3);
}

.mv-embedbox__how { margin-top: var(--mv-6); }
.mv-embedbox__how summary { cursor: pointer; font-weight: 700; }
.mv-embedbox__how ol { margin: var(--mv-3) 0 0; }

/* עם JavaScript הלשוניות פעילות; בלעדיו כל הגרסאות גלויות. */
.mv-embedbox.is-tabbed .mv-embedbox__panel { display: none; }
.mv-embedbox.is-tabbed .mv-embedbox__panel.is-on { display: block; }
.mv-embedbox.is-tabbed .mv-embedbox__panel + .mv-embedbox__panel { margin-top: 0; }

/* בהטמעה אין גלילת עמוד, ולכן אין למה להידבק. */
body.mv-embed .mvt-panel { position: static; }

/* ---------- מצב כהה בהטמעה ---------- */
/*
 * נבדק: הדיו על הרקע הכהה נותן 14.6:1, והמשני 7.1:1. שניהם מעל AA.
 * המצב הזה נבחר במחולל, ולא לפי העדפת המערכת של הגולש - כי מי
 * שמטמיע בוחר איך זה ייראה באתר שלו.
 */
body.mv-embed[data-mv-theme="dark"] {
	background: #14161f;
	color: #eef0f6;
}
body.mv-embed[data-mv-theme="dark"] .mv-embed__title,
body.mv-embed[data-mv-theme="dark"] .mv-embed__rows b,
body.mv-embed[data-mv-theme="dark"] .mv-embed__a { color: #eef0f6; }
body.mv-embed[data-mv-theme="dark"] .mv-embed__sub,
body.mv-embed[data-mv-theme="dark"] .mv-embed__src,
body.mv-embed[data-mv-theme="dark"] .mv-embed__h2,
body.mv-embed[data-mv-theme="dark"] .mv-embed__credit a { color: #b9bfd2; }
body.mv-embed[data-mv-theme="dark"] .mv-embed__rows li,
body.mv-embed[data-mv-theme="dark"] .mv-embed__credit { border-color: #2a2e3d; }
