/**
 * GPS Floating Side Menu — front-end styles.
 * Colors/sizes are set per-site via inline custom properties on .gpsem-wrap.
 */
.gpsem-wrap {
	--gpsem-rail-bg: #161320;
	--gpsem-rail-text: #FBF8F3;
	--gpsem-accent: #7C3AED;
	--gpsem-menu-tab-bg: #FFC857;
	--gpsem-rail-w: 36px;
	--gpsem-rail-offset: 220px;
	--gpsem-tab-gap: 3px;
	--gpsem-drawer-w: 340px;
	--gpsem-drawer-bg: #FBF8F3;
	--gpsem-drawer-text: #161320;
	--gpsem-header-offset: 0px;
	--gpsem-font: system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
	font-family: var(--gpsem-font);
}
.gpsem-wrap *, .gpsem-wrap *::before, .gpsem-wrap *::after { box-sizing: border-box; }
.gpsem-wrap ul { list-style: none; margin: 0; padding: 0; }
.gpsem-wrap li { margin: 0; padding: 0; list-style: none; }
.gpsem-wrap a { text-decoration: none; }

/* Rail */
.gpsem-rail {
	position: fixed; top: 0; left: 0; height: 100vh; width: var(--gpsem-rail-w);
	z-index: 99050; display: flex; flex-direction: column; align-items: stretch;
	padding-top: var(--gpsem-rail-offset); gap: var(--gpsem-tab-gap); pointer-events: none;
}
.gpsem-pos-right .gpsem-rail { left: auto; right: 0; }

.gpsem-tab {
	pointer-events: auto; background: var(--gpsem-rail-bg); color: var(--gpsem-rail-text);
	border: none; border-radius: 0; cursor: pointer; font-family: var(--gpsem-font);
	font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
	padding: 16px 0; display: flex; align-items: center; justify-content: center;
	line-height: 1.2; transition: background-color .15s ease, color .15s ease;
}
.gpsem-tab:hover, .gpsem-tab:focus-visible { background: var(--gpsem-accent); color: #fff; }
.gpsem-tab-menu { background: var(--gpsem-menu-tab-bg); color: var(--gpsem-rail-bg); }
.gpsem-tab-menu:hover, .gpsem-tab-menu:focus-visible { background: var(--gpsem-accent); color: #fff; }

.gpsem-tab span { display: inline-block; transform: rotate(180deg); writing-mode: vertical-rl; white-space: nowrap; }
.gpsem-pos-right .gpsem-tab span { transform: none; }

/* Outside-click catcher */
.gpsem-overlay { position: fixed; inset: 0; background: transparent; pointer-events: none; z-index: 99055; }
.gpsem-wrap.is-open .gpsem-overlay { pointer-events: auto; }

/* Drawer */
.gpsem-drawer {
	position: fixed; top: 0; left: 0; height: 100vh; width: var(--gpsem-drawer-w); max-width: 90vw;
	background: var(--gpsem-drawer-bg); color: var(--gpsem-drawer-text);
	border-right: 2px solid var(--gpsem-rail-bg);
	box-shadow: 8px 0 0 rgba(124, 58, 237, .18);
	box-shadow: 8px 0 0 color-mix(in srgb, var(--gpsem-accent) 18%, transparent);
	transform: translateX(-100%); visibility: hidden;
	transition: transform .28s ease, visibility 0s linear .28s;
	z-index: 99065; overflow-y: auto; padding: 26px 30px 34px;
}
.gpsem-pos-right .gpsem-drawer {
	left: auto; right: 0; border-right: 0; border-left: 2px solid var(--gpsem-rail-bg);
	box-shadow: -8px 0 0 rgba(124, 58, 237, .18);
	box-shadow: -8px 0 0 color-mix(in srgb, var(--gpsem-accent) 18%, transparent);
	transform: translateX(100%);
}
.gpsem-wrap.is-open .gpsem-drawer { transform: translateX(0); visibility: visible; transition: transform .28s ease; }

.gpsem-close {
	position: absolute; top: 18px; right: 18px; background: none; border: none;
	font-size: 26px; line-height: 1; color: #9a96a8; cursor: pointer; padding: 4px 8px;
}
.gpsem-close:hover { color: var(--gpsem-drawer-text); background: none; }

.gpsem-logo { font-weight: 800; font-size: 21px; color: var(--gpsem-accent); margin: 4px 0 30px; line-height: 1.15; }
.gpsem-logo img { max-width: 170px; height: auto; display: block; }

/* Links */
.gpsem-list { display: flex; flex-direction: column; gap: 2px; margin-bottom: 26px; }
.gpsem-link {
	display: block; padding: 10px 0; color: var(--gpsem-drawer-text); font-size: 16px; font-weight: 600;
	border-bottom: 1px solid rgba(22, 19, 32, .1);
	transition: color .15s ease, padding-left .15s ease;
}
.gpsem-link:hover, .gpsem-link:focus-visible, .gpsem-link.is-current { color: var(--gpsem-accent); }
.gpsem-link:hover, .gpsem-link:focus-visible { padding-left: 6px; }

/* Parent row: link + arrow button */
.gpsem-row { display: flex; align-items: stretch; border-bottom: 1px solid rgba(22, 19, 32, .1); }
.gpsem-row .gpsem-link { flex: 1; border-bottom: 0; }

.gpsem-toggle {
	flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center;
	width: 38px; background: none; border: 0; border-radius: 0; padding: 0; cursor: pointer;
	color: var(--gpsem-drawer-text); font-family: inherit;
	transition: color .15s ease, background-color .15s ease;
}
.gpsem-toggle:hover, .gpsem-toggle:focus-visible { color: var(--gpsem-accent); background: rgba(124, 58, 237, .08); }

/* Parent with no URL: the whole label row is the toggle */
.gpsem-toggle-label {
	flex: 1; width: auto; justify-content: space-between; text-align: left;
	padding: 10px 0; font-size: 16px; font-weight: 600; color: var(--gpsem-drawer-text);
}
.gpsem-toggle-label:hover, .gpsem-toggle-label:focus-visible { background: none; padding-left: 6px; }
.gpsem-toggle-label span { flex: 1; }
.gpsem-toggle-label .gpsem-chevron { margin-right: 11px; }

.gpsem-chevron { transition: transform .3s ease; }
.gpsem-item.is-expanded > .gpsem-row .gpsem-chevron { transform: rotate(180deg); }
.gpsem-item.is-expanded > .gpsem-row .gpsem-link { color: var(--gpsem-accent); }

/* Smooth expand/collapse (grid 0fr → 1fr animates to the content's natural height) */
.gpsem-sub-wrap {
	display: grid; grid-template-rows: 0fr; visibility: hidden; opacity: 0;
	transition: grid-template-rows .3s ease, opacity .25s ease, visibility 0s linear .3s;
}
.gpsem-item.is-expanded > .gpsem-sub-wrap {
	grid-template-rows: 1fr; visibility: visible; opacity: 1;
	transition: grid-template-rows .3s ease, opacity .25s ease;
}
.gpsem-sub { min-height: 0; overflow: hidden; padding-left: 14px; margin-left: 2px; border-left: 2px solid var(--gpsem-accent); }
.gpsem-sub .gpsem-link { font-size: 14.5px; font-weight: 500; padding: 8px 0; opacity: .9; }
.gpsem-sub li:last-child .gpsem-link { border-bottom: 0; }

.gpsem-blurb { font-size: 14px; line-height: 1.6; opacity: .7; margin: 0 0 14px; color: var(--gpsem-drawer-text); }
.gpsem-email { display: inline-block; font-size: 15px; font-weight: 700; color: var(--gpsem-accent); margin-bottom: 22px; word-break: break-all; }
.gpsem-email:hover { text-decoration: underline; }

.gpsem-social { display: flex; flex-wrap: wrap; gap: 12px; }
.gpsem-social a {
	width: 36px; height: 36px; display: flex; align-items: center; justify-content: center;
	border-radius: 50%; color: var(--gpsem-rail-bg); background: #fff; border: 2px solid var(--gpsem-rail-bg);
	transition: background-color .15s ease, color .15s ease, transform .15s ease;
}
.gpsem-social a:hover { background: var(--gpsem-accent); color: #fff; transform: translate(-2px, -2px); }

@media (max-width: 480px) {
	.gpsem-rail { padding-top: min(var(--gpsem-rail-offset), 140px); }
	.gpsem-drawer { width: 86vw; padding: 22px 22px 30px; }
}
@media (prefers-reduced-motion: reduce) {
	.gpsem-drawer, .gpsem-overlay, .gpsem-tab, .gpsem-link, .gpsem-social a,
	.gpsem-sub-wrap, .gpsem-chevron, .gpsem-toggle { transition: none !important; }
}
