/**
 * Site Editor chrome: keep pattern and template thumbnails light and bounded.
 *
 * Pattern cards must never look like full-page layouts crushed into a chip.
 * Heavy starter vendor CSS is never loaded into these iframes (see
 * buildler_theme_enqueue_iframe_starter_css).
 */

.block-editor-block-preview__container,
.block-editor-block-preview__content,
.dataviews-view-grid__card .block-editor-block-preview__container {
	background: #fff !important;
	color-scheme: light only;
	min-height: 160px;
}

.block-editor-block-patterns-list__list-item .block-editor-block-preview__container,
.block-editor-block-patterns-list .block-editor-block-preview__container,
.dataviews-view-grid .block-editor-block-preview__container,
.edit-site-sidebar-navigation-screen-patterns .block-editor-block-preview__container {
	max-height: 220px;
	overflow: hidden;
	background: #fff !important;
}

.block-editor-block-preview__content iframe,
.block-editor-block-preview__content-iframe {
	background: #fff !important;
	color-scheme: light only !important;
}

.edit-site-page-pages-preview,
.dataviews-view-grid__card .block-editor-block-preview__container {
	background: #fff !important;
	color-scheme: light only;
}

.block-editor-block-patterns-list__item-title {
	white-space: normal;
}

/* Prefer static preview images when present on pattern cards. */
.block-editor-block-patterns-list__item .block-editor-block-preview__container img,
.dataviews-view-grid__media img {
	display: block;
	width: 100%;
	height: auto;
	object-fit: cover;
	object-position: top center;
	background: #fff;
}

/* Static starter preview (JS overlays an <img> on top of live previews). */
.buildler-pattern-static-preview {
	position: relative !important;
	overflow: hidden !important;
	min-height: 180px !important;
	max-height: 220px;
	background: #fff !important;
}

.buildler-pattern-static-preview .page-patterns-preview-field {
	background: transparent !important;
}

img.buildler-pattern-static-thumb {
	position: absolute !important;
	inset: 0 !important;
	z-index: 5 !important;
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	object-position: top center !important;
	background: #fff !important;
	pointer-events: none !important;
}

.buildler-pattern-static-preview iframe[data-buildler-preview-hidden],
.buildler-pattern-static-preview .block-editor-block-preview__content,
.buildler-pattern-static-preview .block-editor-block-preview__container {
	opacity: 0 !important;
	pointer-events: none !important;
}
