/* OceanEye Home: the site's panels without Motion.page (0.46.0; 0.46.4).
 *
 * Closed is display:none, as Motion.page left them, so nothing in a panel
 * (the menu's background texture, the icon font) downloads until it's first
 * opened: hidden-but-laid-out panels (0.46.0-0.46.3) cost every page view
 * ~190 KB. oe-home-panels.js puts oe-open-<name> on <html> to show one, with
 * an animation in (fade and rise; the Favourites sheet slides up from the
 * bottom edge), and oe-closing-<name> for 300ms on the way out. The page
 * behind eases back as it did with Motion.page. Anchored on body: Elementor's
 * container CSS sets display at (0,1,0) and loads later. */

/* Every trigger looks tappable (with oe-home-panels.js's own listener on
   each, so iPhone Safari sends the click). */
body .open-search,
body .open-menu,
body .favourites-button,
body .close_area,
body #close-search,
body #close-menu {
	cursor: pointer;
}

/* Closed. */
body .elementor-element.search-area,
body .elementor-element.menu-area,
body #close-search,
body #close-menu,
body .elementor-element.favourites-container,
body .elementor-element.close_area {
	display: none;
}

/* The header's Search and Menu panels. */
.oe-open-search body .elementor-element.search-area,
.oe-open-menu body .elementor-element.menu-area {
	display: block;
	animation: oe-panel-in .3s cubic-bezier(.2, .8, .2, 1);
}

.oe-closing-search body .elementor-element.search-area,
.oe-closing-menu body .elementor-element.menu-area {
	display: block;
	animation: oe-panel-out .3s ease forwards;
}

/* Their full-screen backdrops and X icons (both carry these ids). */
.oe-open-search body #close-search,
.oe-open-menu body #close-menu {
	display: block;
	animation: oe-panel-fade-in .25s ease;
}

.oe-closing-search body #close-search,
.oe-closing-menu body #close-menu {
	display: block;
	animation: oe-panel-fade-out .3s ease forwards;
}

/* The phone bar's Favourites sheet, from below the bottom edge, and its
   shade over the page (a tap on the shade closes it). */
.oe-open-favourites body .elementor-element.favourites-container {
	display: flex;
	animation: oe-sheet-in .35s cubic-bezier(.2, .8, .2, 1);
}

.oe-closing-favourites body .elementor-element.favourites-container {
	display: flex;
	animation: oe-sheet-out .3s ease forwards;
}

.oe-open-favourites body .elementor-element.close_area {
	display: block;
	animation: oe-panel-fade-in .25s ease;
}

.oe-closing-favourites body .elementor-element.close_area {
	display: block;
	animation: oe-panel-fade-out .3s ease forwards;
}

@keyframes oe-panel-in {
	from { opacity: 0; transform: translateY(24px); }
	to { opacity: 1; transform: none; }
}

@keyframes oe-panel-out {
	from { opacity: 1; transform: none; }
	to { opacity: 0; transform: translateY(24px); }
}

@keyframes oe-panel-fade-in {
	from { opacity: 0; }
	to { opacity: 1; }
}

@keyframes oe-panel-fade-out {
	from { opacity: 1; }
	to { opacity: 0; }
}

@keyframes oe-sheet-in {
	from { transform: translateY(100%); }
	to { transform: none; }
}

@keyframes oe-sheet-out {
	from { transform: none; }
	to { transform: translateY(100%); }
}

/* The page behind eases back, and the header bar steps aside. */
body .content-area {
	transition: transform .35s cubic-bezier(.2, .8, .2, 1);
}

.oe-panel-open body .content-area {
	transform: translateY(-5%) scale(.95);
	transform-origin: 50% 0;
}

/* Hidden from taps too once faded: an invisible header still caught the taps
   meant for the Favourites shade near the top of the screen (0.46.5). */
body .menu-header {
	transition: opacity .2s ease, visibility 0s;
}

.oe-panel-open body .menu-header {
	opacity: 0;
	visibility: hidden;
	transition: opacity .2s ease, visibility 0s linear .2s;
}

/* The spot page's old "Cam issues" box: Motion.page kept it hidden until its
   wifi icon was tapped, and the icon went on 2026-11-01 (spot-page.php). */
body .update-cam {
	display: none;
}

/* The spot page's Forecast and Wind Map, shown by their tabs. */
body .forecast-iframe,
body .windmap-iframe {
	display: none;
}

.oe-tab-forecast body .forecast-iframe,
.oe-tab-windmap body .windmap-iframe {
	display: block;
	animation: oe-panel-fade-in .3s ease;
}

@media (prefers-reduced-motion: reduce) {
	.oe-open-search body .elementor-element.search-area,
	.oe-open-menu body .elementor-element.menu-area,
	.oe-open-search body #close-search,
	.oe-open-menu body #close-menu,
	.oe-open-favourites body .elementor-element.favourites-container,
	.oe-open-favourites body .elementor-element.close_area,
	.oe-tab-forecast body .forecast-iframe,
	.oe-tab-windmap body .windmap-iframe {
		animation: none;
	}

	/* Closing still waits out its 300ms, but without moving. */
	.oe-closing-search body .elementor-element.search-area,
	.oe-closing-menu body .elementor-element.menu-area,
	.oe-closing-search body #close-search,
	.oe-closing-menu body #close-menu,
	.oe-closing-favourites body .elementor-element.favourites-container,
	.oe-closing-favourites body .elementor-element.close_area {
		animation: oe-panel-fade-out .01s linear forwards;
	}

	body .content-area,
	body .menu-header {
		transition: none;
	}

	.oe-panel-open body .content-area {
		transform: none;
	}
}