/* ==========================================================================
   Flora Gems - Custom Widget Styles
   floragems-custom.css

   Destination: Punchmark Site Manager > Design or Theme Settings > Global CSS
   Do NOT paste this into the page editor. The page editor strips style blocks
   on save.

   All rules are scoped to a widget-specific wrapper class. Add new widgets as
   new numbered sections below so this stays the single file to paste.

   Last updated: 2026-07-29
   ========================================================================== */


/* ==========================================================================
   1. Rolex Smart Clock  (rolex-middle-page-widget.html)
   --------------------------------------------------------------------------
   Widget file lives on FTP and is embedded in a homepage pagebuilder section.
   Uses the clock.rolex.com invoker with the "richleft" layout.

   Notes:
   - The host section must be container-fluid with px-0 py-0. The richleft
     layout is full bleed and will letterbox awkwardly inside a fixed-width
     container.
   - min-height reserves space so the section does not collapse and shove the
     following content upward while the invoker fetches. Also protects CLS.
   - The width overrides are deliberate. Rolex serves its own stylesheet from
     clock.rolex.com and wins on specificity otherwise. Without these the
     injected root shrink-wraps to roughly 230px and the clock renders in its
     stacked mobile layout on desktop.
   ========================================================================== */

.flora-rolex-clock {
	width: 100%;
	margin: 0;
	padding: 0;
}

.flora-rolex-clock-mount {
	display: block;
	width: 100%;
	min-height: 420px;
}

.flora-rolex-clock-mount > * {
	width: 100% !important;
	max-width: 100% !important;
}

.flora-rolex-clock-mount iframe {
	display: block;
	width: 100% !important;
	border: 0;
}

@media (max-width: 767.98px) {

	.flora-rolex-clock-mount {
		min-height: 560px;
	}

}


/* ==========================================================================
   2. [Next widget]
   --------------------------------------------------------------------------
   Add future Flora Gems widget styles here, scoped to their own wrapper class,
   so this file remains the only paste needed in the Global CSS field.
   ========================================================================== */