/**
 * IMPERVORA -- Stuller Jeweler Showcase embed.
 *
 * Loaded only on pages that actually render [impervora_jewelry_showcase]; see
 * impervora_showcase_assets() in inc/jewelry-showcase.php.
 *
 * Deliberately tiny. Stuller's parent-side iframe-resizer owns the frame's
 * HEIGHT at runtime (it writes an inline style.height and flips scrolling to
 * "no", which is what kills the double scrollbar). Anything here that set a
 * height would fight it, so this file only ever governs WIDTH and spacing.
 */

.impervora-showcase {
	width: 100%;
	max-width: 100%;
	margin: 0;
}

/*
 * The width:1px + min-width:100% pair is Stuller's own snippet and is not a
 * typo: iOS Safari ignores width:100% on an iframe and renders it at the
 * intrinsic width of its content, which is what produces a horizontally
 * scrolling page on iPhone. A 1px base with a 100% floor defeats that.
 * It is repeated here so the frame keeps behaving if the inline style is ever
 * stripped by a caching or optimisation layer.
 */
.impervora-showcase__frame {
	display: block;
	width: 1px;
	min-width: 100%;
	max-width: 100%;
	border: 0;
	background: transparent;
}

/* Short lead-in above the catalog. Kept minimal on purpose -- the Showcase is
   the content of this page, not an illustration inside an article. */
.impervora-showcase-intro {
	margin: 0 0 2rem;
}

.impervora-showcase-intro > :last-child {
	margin-bottom: 0;
}

@media (max-width: 767px) {
	.impervora-showcase-intro {
		margin-bottom: 1.5rem;
	}
}


/* ==========================================================================
   FLOATING CONCIERGE CLEARANCE -- SHOWCASE PAGE ONLY
   ==========================================================================

   Two independent bottom-right stacks float above every page on this site:

     .impervora-fab   z 9990  the CONTACT / FINANCING / WISHLIST rail
                             (inc/motion.php + impervora-motion.css)
     .mwai-chat       z 9995  the AI Engine concierge launcher and its
                             greeting bubble (inc/concierge.php)

   Over ordinary prose they are unremarkable. Over a full-bleed catalog they
   sit on top of product cards, prices and Stuller's own controls. Measured on
   the live page before this block existed:

     desktop 1440   fab covered   7px of the frame, greeting bubble 126px
     tablet   768   fab covered 119px of a 728px-wide frame
     mobile   390   fab covered  40px of a 350px-wide frame

   Everything below is scoped to body.impervora-showcase-page -- the class
   impervora_showcase_body_class() adds only where the shortcode renders -- so
   the concierge is untouched on every other page of the site. Nothing here
   removes a control: all three quick actions and the chat launcher stay live
   and keyboard reachable, they are simply made compact and moved aside.

   Worth knowing: .impervora-fab is already pointer-events:none on the
   container with pointer-events:auto on the pills, so the transparent space
   between the buttons never swallowed a click on the catalog underneath.
   Only the painted controls themselves ever intercepted a pointer event.
   -------------------------------------------------------------------------- */

/*
 * 1. Collapse the quick-action rail to glyph-only, at every width.
 *
 * impervora-motion.css already does exactly this below 600px; this reuses the
 * same treatment and simply extends it to the whole page, which is what takes
 * the rail from 131px wide (desktop) and 123px (tablet) down to 44px. The
 * labels stay in the accessibility tree -- this is the standard visually-hidden
 * pattern, not display:none -- so screen readers still announce Contact,
 * Financing and Wishlist.
 */
.impervora-showcase-page .impervora-fab__label {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Glyph-only, but still a full 44x44 target (WCAG 2.5.5). */
.impervora-showcase-page .impervora-fab__item {
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	padding: 10px;
}

/*
 * 2. Retire the auto-opening greeting bubble on this page.
 *
 * At 244x71 it was the single largest obstruction, it opens unprompted, and it
 * is a marketing nudge rather than a control -- the concierge itself is still
 * one tap away on the launcher directly beneath it. Same mechanism the widget
 * already uses to retire the teaser once the visitor has met it
 * (.imp-cc-greeted in impervora-concierge.css), including the !important,
 * which is needed to beat the widget's own transition-state rules.
 */
.impervora-showcase-page .mwai-chat.mwai-impervora-theme .mwai-icon-text-container {
	display: none !important;
}

/*
 * 3. On desktop, dock both stacks in the page gutter so they clear the frame
 *    completely -- zero overlap, not merely less of it.
 *
 * The frame's right edge sits at 50vw + 580px (a 1200px Astra container with
 * 20px inner padding, centred). Parking the 44px rail at 50vw - 640px puts its
 * left edge 16px clear of that edge, and the 62px launcher at 50vw - 660px
 * clears it too. Because both are expressed against 50vw they TRACK the
 * container edge instead of drifting into a far corner on a wide monitor.
 *
 * The max() floor keeps them on screen if the viewport is ever narrower than
 * the calc assumes. 1340px is the threshold because below it the gutter is
 * simply too narrow for the 62px launcher to fit beside the container, and a
 * rule that cannot deliver clearance should not pretend to.
 */
@media (min-width: 1340px) {

	.impervora-showcase-page .impervora-fab {
		right: max(6px, calc(50vw - 640px));
	}

	.impervora-showcase-page .mwai-chat.mwai-impervora-theme {
		--imp-cc-right: max(6px, calc(50vw - 660px));
	}
}

/*
 * Below 1340px the container is effectively full width, so no bottom-right
 * floating control can avoid the frame's horizontal band. What is left there
 * is the compact corner cluster -- one 44px glyph column and one 62px
 * launcher, no labels and no bubble -- which is the collapsed state this
 * page asks for rather than an obstruction.
 *
 * --imp-cc-bottom is NOT set here on purpose: impervora-concierge.js measures
 * the live FAB rect and stacks the launcher above it, re-running on resize.
 * Hardcoding a bottom offset would fight that and desynchronise the two.
 */