/**
 * App landing – Floorball Performance
 * Mörkt tema, lime grön accent, kort och knappar enligt layout.
 */

/* Tema (mörk bakgrund, färger) – gäller alltid när .fp-app-wrap finns, så att temat inte försvinner */
.fp-app-wrap {
	width: 100%;
	--fp-bg: var(--brand-bg, #0a0a0a);
	--fp-bg-card: var(--brand-surface, #1a1a1a);
	--fp-accent: var(--brand-accent, #D4D41E);
	--fp-accent-glow: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.4);
	--fp-text: #ffffff;
	--fp-text-muted: rgba(255, 255, 255, 0.62);
	--fp-text-subtle: rgba(255, 255, 255, 0.45);
	--fp-border: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.35);
	--fp-radius: 1.25rem;
	--fp-radius-sm: 0.75rem;
	--fp-touch-target: 44px;
	/* Lucide icons (SVG masks). */
	--fp-icon-plus: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20d%3D%27M12%205v14%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M5%2012h14%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3C/svg%3E");
	--fp-icon-zap: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20d%3D%27M4%2014a1%201%200%200%201-.78-1.63l9.9-10.2a.5.5%200%200%201%20.86.46l-1.92%206.02A1%201%200%200%200%2013%2010h7a1%201%200%200%201%20.78%201.63l-9.9%2010.2a.5.5%200%200%201-.86-.46l1.92-6.02A1%201%200%200%200%2011%2014z%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3C/svg%3E");
	--fp-icon-cooking-pot: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20d%3D%27M2%2012h20%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M20%2012v8a2%202%200%200%201-2%202H6a2%202%200%200%201-2-2v-8%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27m4%208%2016-4%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27m8.86%206.78-.45-1.81a2%202%200%200%201%201.45-2.43l1.94-.48a2%202%200%200%201%202.43%201.46l.45%201.8%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3C/svg%3E");
	--fp-icon-chart-pie: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20d%3D%27M21%2012c.552%200%201.005-.449.95-.998a10%2010%200%200%200-8.953-8.951c-.55-.055-.998.398-.998.95v8a1%201%200%200%200%201%201z%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M21.21%2015.89A10%2010%200%201%201%208%202.83%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3C/svg%3E");
	--fp-icon-mouse-pointer-click: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20d%3D%27M14%204.1%2012%206%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27m5.1%208-2.9-.8%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27m6%2012-1.9%202%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M7.2%202.2%208%205.1%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M9.037%209.69a.498.498%200%200%201%20.653-.653l11%204.5a.5.5%200%200%201-.074.949l-4.349%201.041a1%201%200%200%200-.74.739l-1.04%204.35a.5.5%200%200%201-.95.074z%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3C/svg%3E");
	--fp-icon-heart-handshake: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20d%3D%27M19.414%2014.414C21%2012.828%2022%2011.5%2022%209.5a5.5%205.5%200%200%200-9.591-3.676.6.6%200%200%201-.818.001A5.5%205.5%200%200%200%202%209.5c0%202.3%201.5%204%203%205.5l5.535%205.362a2%202%200%200%200%202.879.052%202.12%202.12%200%200%200-.004-3%202.124%202.124%200%201%200%203-3%202.124%202.124%200%200%200%203.004%200%202%202%200%200%200%200-2.828l-1.881-1.882a2.41%202.41%200%200%200-3.409%200l-1.71%201.71a2%202%200%200%201-2.828%200%202%202%200%200%201%200-2.828l2.823-2.762%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3C/svg%3E");
	--fp-icon-smartphone-charging: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Crect%20width%3D%2714%27%20height%3D%2720%27%20x%3D%275%27%20y%3D%272%27%20rx%3D%272%27%20ry%3D%272%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M12.667%208%2010%2012h4l-2.667%204%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3C/svg%3E");
	--fp-icon-users: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20d%3D%27M16%2021v-2a4%204%200%200%200-4-4H6a4%204%200%200%200-4%204v2%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M16%203.128a4%204%200%200%201%200%207.744%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M22%2021v-2a4%204%200%200%200-3-3.87%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Ccircle%20cx%3D%279%27%20cy%3D%277%27%20r%3D%274%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3C/svg%3E");
	--fp-icon-file-text: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20d%3D%27M6%2022a2%202%200%200%201-2-2V4a2%202%200%200%201%202-2h8a2.4%202.4%200%200%201%201.704.706l3.588%203.588A2.4%202.4%200%200%201%2020%208v12a2%202%200%200%201-2%202z%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M14%202v5a1%201%200%200%200%201%201h5%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M10%209H8%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M16%2013H8%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M16%2017H8%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3C/svg%3E");
	--fp-icon-log-in: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cpath%20d%3D%27m10%2017%205-5-5-5%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M15%2012H3%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3Cpath%20d%3D%27M15%203h4a2%202%200%200%201%202%202v14a2%202%200%200%201-2%202h-4%27%20fill%3D%27none%27%20stroke%3D%27%23000%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27/%3E%3C/svg%3E");
	font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	font-feature-settings: "kern" 1, "liga" 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	background: var(--fp-bg);
	color: var(--fp-text);
	min-height: 100vh;
	min-height: 100dvh;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	overflow-x: hidden;
	-webkit-overflow-scrolling: touch;
	scroll-behavior: smooth;
}

.fp-app-wrap *,
.fp-app-wrap *::before,
.fp-app-wrap *::after {
	box-sizing: border-box;
}
.fp-app-wrap {
	overflow-x: hidden;
}

/* Tvinga mörkt tema på input-fält (övervinner tema/WordPress som sätter vita bakgrunder) */
.fp-app-wrap input[type="text"],
.fp-app-wrap input[type="number"],
.fp-app-wrap input[type="email"],
.fp-app-wrap input[type="search"] {
	background: var(--brand-surface, #1a1a1a) !important;
	color: var(--fp-text) !important;
	-webkit-appearance: none;
	appearance: none;
	border-color: rgba(255,255,255,0.2);
}

/* Header – full bredd, innehåll centrerat */
.fp-app-header {
	position: sticky;
	top: 0;
	z-index: 10;
	width: 100%;
	background: var(--fp-bg);
	border-bottom: 1px solid rgba(255,255,255,0.06);
	padding: 1rem 1.25rem;
	padding-top: max(1rem, env(safe-area-inset-top, 0px) + 1rem);
}

.fp-app-header-inner {
	width: 100%;
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
}

.fp-app-logo {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	text-decoration: none;
	color: inherit;
	min-width: 0;
}

/* Märkeslogotyp (PNG, transparent) – proportioner bevaras, rimlig höjd i header */
.fp-app-logo-img {
	display: block;
	height: 48px;
	width: auto;
	max-width: min(400px, 90vw);
	object-fit: contain;
	object-position: left center;
	flex-shrink: 0;
}

/* Legacy: text/SVG-logga används inte längre i header men lämnas om någon mall behöver */
.fp-app-logo-icon {
	width: 40px;
	height: 40px;
	color: var(--fp-text);
}

.fp-app-logo-icon svg {
	width: 100%;
	height: 100%;
}

.fp-app-logo-text {
	display: flex;
	flex-direction: column;
	line-height: 1.15;
}

.fp-app-logo-line1 {
	font-size: 1rem;
	font-weight: 900;
	letter-spacing: -0.01em;
	color: var(--fp-text);
}

.fp-app-logo-line2 {
	font-size: 0.95rem;
	font-weight: 900;
	letter-spacing: -0.01em;
	color: var(--fp-accent);
}

.fp-app-nav {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	flex-wrap: wrap;
}

/* Profilikon (app-header) – samma accent som övriga CTA, vit symbol som referensbild */
.fp-app-nav-profile-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	color: inherit;
	-webkit-tap-highlight-color: transparent;
	tap-highlight-color: transparent;
	min-height: var(--fp-touch-target);
	min-width: var(--fp-touch-target);
	border-radius: 10px;
	transition: transform 0.1s ease, opacity 0.15s ease;
}

.fp-app-nav-profile-icon:active {
	transform: scale(0.96);
	opacity: 0.92;
}

.fp-app-nav-profile-icon:focus-visible {
	outline: 2px solid var(--fp-accent);
	outline-offset: 3px;
}

@media (hover: hover) and (pointer: fine) {
	.fp-app-nav-profile-icon:hover .fp-app-nav-profile-icon-box {
		filter: brightness(1.06);
	}
}

.fp-app-nav-profile-icon-box {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 11px;
	background: var(--fp-accent);
	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.18);
}

.fp-app-nav-profile-icon-svg {
	width: 22px;
	height: 22px;
	display: block;
	flex-shrink: 0;
}

.fp-app-nav-link {
	color: var(--fp-text-subtle);
	text-decoration: none;
	font-size: 0.75rem;
	font-weight: 800;
	font-style: italic;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	padding: 0.5rem 0.6rem;
	min-height: var(--fp-touch-target);
	display: inline-flex;
	align-items: center;
	-webkit-tap-highlight-color: transparent;
	tap-highlight-color: transparent;
	transition: color 0.15s ease, border-color 0.15s ease;
	border: 1px solid transparent;
	border-radius: 4px;
}

.fp-app-nav-link > .fp-ui-icon {
	flex-shrink: 0;
	margin-inline-end: 0.45rem;
}

.fp-app-nav-label {
	display: inline-block;
}

.fp-ui-icon {
	width: 1.12rem;
	height: 1.12rem;
	display: inline-block;
	color: currentColor;
	opacity: 0.96;
	transform: translateZ(0);
	transition: transform 360ms ease, opacity 360ms ease;
}

.fp-ui-icon svg,
.fp-feature-icon svg {
	width: 100%;
	height: 100%;
	display: block;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.9;
	stroke-linecap: round;
	stroke-linejoin: round;
	vector-effect: non-scaling-stroke;
}

.fp-ui-icon svg path,
.fp-ui-icon svg rect,
.fp-ui-icon svg circle,
.fp-feature-icon svg path,
.fp-feature-icon svg rect,
.fp-feature-icon svg circle {
	stroke-dasharray: 56;
	stroke-dashoffset: 0;
	transform-origin: center;
}

@media (hover: hover) and (pointer: fine) {
	.fp-app-nav-link:hover .fp-ui-icon {
		transform: scale(1.06);
		opacity: 1;
	}
	.fp-app-nav-link:hover .fp-ui-icon svg path,
	.fp-app-nav-link:hover .fp-ui-icon svg rect,
	.fp-app-nav-link:hover .fp-ui-icon svg circle,
	.fp-app-card-features li:hover .fp-feature-icon svg path,
	.fp-app-card-features li:hover .fp-feature-icon svg rect,
	.fp-app-card-features li:hover .fp-feature-icon svg circle {
		animation: fp-lucide-draw 980ms cubic-bezier(0.22, 1, 0.36, 1) both;
	}
}
.fp-app-nav-link:active .fp-ui-icon {
	transform: scale(0.94);
}

.fp-app-nav-link.is-active {
	color: var(--fp-text);
	border-color: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.5);
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.06);
}

.fp-app-nav-link:active {
	color: var(--fp-accent);
}

@media (hover: hover) and (pointer: fine) {
	.fp-app-nav-link:hover {
		color: var(--fp-accent);
	}
}

.fp-app-btn-login {
	background: var(--fp-accent);
	color: var(--fp-bg);
	text-decoration: none;
	font-size: 0.75rem;
	font-weight: 800;
	font-style: italic;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	padding: 0.5rem 1rem;
	min-height: var(--fp-touch-target);
	display: inline-flex;
	align-items: center;
	border-radius: 8px;
	border: none;
	-webkit-tap-highlight-color: transparent;
	tap-highlight-color: transparent;
	transition: opacity 0.15s ease, transform 0.1s ease;
}

body.logged-in .fp-app-btn-login {
	font-style: normal;
	font-weight: 600;
}

/* Mellan ikon ↔ etikett: margin (fungerar i äldre iOS/Safari utan flex gap); explicit span i mallen undviker anonymous flex items */
.fp-app-btn-login > .fp-ui-icon {
	flex-shrink: 0;
	margin-inline-end: 0.5rem;
}

.fp-app-btn-login__label {
	display: inline-block;
	min-width: 0;
}

.fp-app-btn-login:active {
	opacity: 0.9;
	transform: scale(0.98);
}

@media (hover: hover) and (pointer: fine) {
	.fp-app-btn-login:hover {
		opacity: 0.95;
	}
}

/* Main */
.fp-app-main {
	width: 100%;
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
	padding: 1.5rem 1.25rem 3rem;
	padding-bottom: max(3rem, env(safe-area-inset-bottom, 0px) + 3rem);
	box-sizing: border-box;
}

.fp-app-view.is-hidden {
	display: none !important;
}

/* ---------- Coaching-vy ---------- */
.fp-coaching-hero {
	text-align: center;
	margin-bottom: 2.5rem;
}

.fp-coaching-eyebrow {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1rem;
	font-size: 0.85rem;
	font-weight: 800;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--fp-accent);
	margin: 0 0 1.25rem;
}

.fp-coaching-line {
	display: inline-block;
	width: 2rem;
	height: 1px;
	background: var(--fp-accent);
}

.fp-coaching-title {
	font-size: clamp(2rem, 6vw, 3.5rem);
	font-weight: 900;
	line-height: 1.05;
	letter-spacing: -0.03em;
	text-transform: uppercase;
	margin: 0 0 1rem;
}

.fp-coaching-title-line {
	display: block;
}

.fp-coaching-title-line.fp-app-accent {
	color: var(--fp-accent);
}

.fp-coaching-desc {
	font-size: 0.85rem;
	line-height: 1.5;
	color: var(--fp-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.03em;
	max-width: 560px;
	margin: 0 auto 2rem;
}

.fp-coaching-cta {
	margin-top: 1.5rem;
}

.fp-app-btn-white {
	background: #ffffff;
	color: var(--fp-bg);
}

.fp-app-btn-white:active {
	opacity: 0.95;
}

/* Coaching: Vad behöver du just nu? */
.fp-coaching-needs {
	margin-top: 2rem;
}

.fp-coaching-needs-title {
	font-size: clamp(1.5rem, 4vw, 2.25rem);
	font-weight: 900;
	line-height: 1.15;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	margin: 0 0 0.5rem;
}

.fp-coaching-needs-title span {
	display: block;
}

.fp-coaching-needs-sub {
	font-size: 0.8rem;
	font-weight: 500;
	color: var(--fp-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin: 0 0 1.25rem;
}

.fp-coaching-cards {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.fp-coaching-need-card {
	background: var(--fp-bg-card);
	border: 1px solid rgba(255,255,255,0.08);
	border-radius: var(--fp-radius);
	padding: 1.5rem;
	text-align: center;
	-webkit-tap-highlight-color: transparent;
	tap-highlight-color: transparent;
}

.fp-coaching-need-abbr {
	display: block;
	font-size: 2rem;
	font-weight: 900;
	letter-spacing: -0.02em;
	margin-bottom: 0.5rem;
}

.fp-coaching-need-name {
	font-size: 1.1rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.02em;
	margin: 0 0 0.75rem;
	color: var(--fp-text);
}

.fp-coaching-need-coach {
	display: inline-block;
	font-size: 0.7rem;
	font-weight: 600;
	color: var(--fp-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	background: rgba(255,255,255,0.08);
	padding: 0.35rem 0.75rem;
	border-radius: 999px;
}

/* Hero — slow transform-only drift (compositor-friendly; no scroll JS). */
@keyframes fp-hero-bg-drift {
	from {
		transform: scale(1);
	}
	to {
		transform: scale(1.035);
	}
}

/* Hero */
.fp-app-hero {
	position: relative;
	margin-bottom: 3rem;
	min-height: 420px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--fp-radius);
	overflow: hidden;
}
.fp-app-hero-bg {
	position: absolute;
	inset: 0;
	background-image: var(--fp-hero-bg);
	background-size: cover;
	background-position: center;
	background-color: var(--fp-bg);
	transform-origin: center center;
}

@media (prefers-reduced-motion: no-preference) {
	.fp-app-hero-bg {
		animation: fp-hero-bg-drift 40s ease-in-out infinite alternate;
	}
}
.fp-app-hero-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.75) 50%, rgba(0,0,0,0.85) 100%);
	pointer-events: none;
}
.fp-app-hero-inner {
	position: relative;
	z-index: 1;
	width: 100%;
	max-width: min(720px, 100%);
	min-width: 0;
	margin: 0 auto;
	padding: 2.5rem 1.25rem;
	box-sizing: border-box;
}

.fp-app-hero-title {
	font-size: clamp(1.75rem, 5vw, 2.75rem);
	font-weight: 900;
	line-height: 1.1;
	letter-spacing: -0.04em;
	margin: 0 0 0.75rem;
	text-transform: uppercase;
	color: #ffffff;
	text-align: center;
	max-width: 100%;
	min-width: 0;
	box-sizing: border-box;
}

.fp-app-hero-line {
	display: block;
}

/* En rad som får bryta kontrollerat (undviker horisontell spill / clipping) */
.fp-app-hero-line--headline-morph {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: baseline;
	column-gap: 0.35em;
	row-gap: 0.12em;
	max-width: 100%;
	min-width: 0;
	overflow-wrap: break-word;
}

.fp-app-hero-morph-prefix {
	white-space: nowrap;
}

/* Växlade ord + gauge (ikon i samma cell, höger om vänsterjusterat ord — fyller tomrummet vid "starkare") */
.fp-app-hero-rot-slot {
	display: inline-flex;
	flex-wrap: nowrap;
	align-items: baseline;
	max-width: 100%;
	min-width: 0;
	vertical-align: baseline;
}

.fp-app-hero-rot-words {
	display: inline-grid;
	grid-template: auto / auto;
	justify-items: start;
	align-items: baseline;
	min-width: 0;
	max-width: 100%;
	transform: translateY(-2px);
}

.fp-app-hero-gauge-wrap {
	grid-area: 1 / 1;
	justify-self: end;
	align-self: baseline;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 0;
	height: 0;
	max-height: 0;
	margin: 0;
	color: rgba(255, 255, 255, 0.92);
	overflow: hidden;
	opacity: 0;
	max-width: 0;
	min-width: 0;
	pointer-events: none;
	line-height: 0;
	/* Tätare mot "STARKARE" + 3px ned (nålanimeringen är på barnet, så transform här krockar inte) */
	transform: translate(-14px, 3px);
}

.fp-app-hero-gauge-wrap svg {
	width: 100%;
	height: 100%;
	display: block;
}

@media (prefers-reduced-motion: no-preference) {
	.fp-app-hero-gauge-wrap {
		animation: fp-hero-gauge-slot 7s cubic-bezier(0.45, 0, 0.55, 1) infinite;
	}
}

@media (prefers-reduced-motion: reduce) {
	.fp-app-hero-gauge-wrap {
		display: none;
	}
}

@keyframes fp-hero-gauge-slot {
	0%,
	40% {
		opacity: 0;
		max-width: 0;
		min-width: 0;
		width: 0;
		height: 0;
		max-height: 0;
	}
	44%,
	90% {
		opacity: 1;
		max-width: 1.35em;
		min-width: 0;
		width: 0.9em;
		height: 0.95em;
		max-height: 1.05em;
	}
	94%,
	100% {
		opacity: 0;
		max-width: 0;
		min-width: 0;
		width: 0;
		height: 0;
		max-height: 0;
	}
}

/* lucide-animated GaugeIcon — svep riktning (var kändes omvänd) */
.fp-app-hero-gauge-wrap .fp-lucide-gauge-needle {
	will-change: transform;
}

@media (prefers-reduced-motion: no-preference) {
	.fp-app-hero-gauge-wrap .fp-lucide-gauge-needle {
		animation: fp-hero-gauge-needle 3.2s cubic-bezier(0.45, 0, 0.55, 1) infinite alternate;
	}
}

@keyframes fp-hero-gauge-needle {
	0% {
		transform: translate(12px, 14px) rotate(58deg) translate(-12px, -14px);
	}
	100% {
		transform: translate(12px, 14px) rotate(-6deg) translate(-12px, -14px);
	}
}

.fp-app-hero-rot-sizer {
	grid-area: 1 / 1;
	display: grid;
	grid-template: auto / auto;
	justify-items: start;
	align-items: baseline;
	visibility: hidden;
	pointer-events: none;
}

.fp-app-hero-rot-sizer > span {
	grid-area: 1 / 1;
	white-space: nowrap;
	justify-self: start;
}

.fp-app-hero-rot-stack {
	grid-area: 1 / 1;
	display: grid;
	grid-template: auto / auto;
	align-items: baseline;
	justify-items: start;
	min-width: 0;
	/* Justerar mot versal-baseline som "Vi bygger" / "innebandyspelare" (såg för högt upp) */
	transform: translateY(0.06em);
}

.fp-app-hero-rot-word {
	grid-area: 1 / 1;
	white-space: nowrap;
	will-change: opacity, transform, filter;
}

@media (prefers-reduced-motion: no-preference) {
	.fp-app-hero-rot-word--a {
		animation: fp-hero-rot-a 7s cubic-bezier(0.45, 0, 0.55, 1) infinite;
	}

	.fp-app-hero-rot-word--b {
		animation: fp-hero-rot-b 7s cubic-bezier(0.45, 0, 0.55, 1) infinite;
	}
}

@media (prefers-reduced-motion: reduce) {
	.fp-app-hero-rot-word--b {
		opacity: 0;
		visibility: hidden;
	}

	.fp-app-hero-rot-sizer > span:nth-child(2) {
		display: none;
	}
}

@keyframes fp-hero-rot-a {
	0%,
	40% {
		opacity: 1;
		transform: translateY(0) scale(1);
		filter: blur(0);
	}
	44%,
	90% {
		opacity: 0;
		transform: translateY(0.05em) scale(0.97);
		filter: blur(3px);
	}
	94%,
	100% {
		opacity: 1;
		transform: translateY(0) scale(1);
		filter: blur(0);
	}
}

@keyframes fp-hero-rot-b {
	0%,
	40% {
		opacity: 0;
		transform: translateY(-0.05em) scale(0.97);
		filter: blur(3px);
	}
	44%,
	90% {
		opacity: 1;
		transform: translateY(0) scale(1);
		filter: blur(0);
	}
	94%,
	100% {
		opacity: 0;
		transform: translateY(0.05em) scale(0.97);
		filter: blur(3px);
	}
}

.fp-app-hero-morph-tail {
	max-width: 100%;
	min-width: 0;
}

.fp-app-hero-line.fp-app-accent {
	color: var(--fp-accent);
	text-shadow: 0 0 20px var(--fp-accent-glow), 0 0 40px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.2);
}

.fp-app-hero-line--headline-morph .fp-app-accent {
	color: var(--fp-accent);
	text-shadow: 0 0 20px var(--fp-accent-glow), 0 0 40px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.2);
}

.fp-app-hero-tagline {
	font-size: 1rem;
	font-weight: 600;
	color: var(--fp-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	margin: 0 0 2.5rem;
}

.fp-app-role-section {
	margin-top: 2rem;
}

/* Luft mellan rollvalet och priskorten (särskilt mobil där toggle blir hög) */
.fp-app-role-section--below-hero {
	margin-bottom: 1.75rem;
}

.fp-app-role-question {
	font-size: clamp(1.5rem, 4vw, 2.25rem);
	font-weight: 900;
	line-height: 1.1;
	letter-spacing: -0.02em;
	margin: 0 0 1rem;
	text-transform: uppercase;
}

.fp-app-role-question .fp-app-accent {
	color: var(--fp-accent);
}

.fp-app-role-toggle {
	display: inline-flex;
	align-items: center;
	background: var(--fp-bg-card);
	border-radius: 999px;
	padding: 0.35rem;
	gap: 0.5rem;
	border: 1px solid rgba(255,255,255,0.08);
}

.fp-app-role-btn {
	display: inline-block;
	text-decoration: none;
	font-size: 0.9rem;
	font-weight: 800;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	padding: 0.75rem 1.5rem;
	min-height: var(--fp-touch-target); /* Touch-friendly */
	border: none;
	border-radius: 999px;
	cursor: pointer;
	background: transparent;
	color: var(--fp-text-muted);
	transition: background 0.15s ease, color 0.15s ease, transform 0.1s ease;
	-webkit-tap-highlight-color: transparent;
	tap-highlight-color: transparent;
	-webkit-user-select: none;
	user-select: none;
}

.fp-app-role-btn:active {
	transform: scale(0.98);
}

.fp-app-role-btn.is-active {
	background: var(--fp-accent);
	color: var(--fp-bg);
}

/* Hover endast på desktop */
@media (hover: hover) and (pointer: fine) {
	.fp-app-role-btn:not(.is-active):hover {
		color: var(--fp-text);
	}
}

.fp-app-role-or {
	font-size: 0.7rem;
	color: var(--fp-text-muted);
	text-transform: uppercase;
	padding: 0 0.25rem;
}

.fp-app-hero-trial {
	font-size: 0.8rem;
	color: var(--fp-accent);
	font-weight: 600;
	margin: 0.75rem 0 0;
	letter-spacing: 0.02em;
}

/* Cards section */
.fp-app-offer {
	margin-bottom: 3rem;
}

.fp-app-cards-role.is-hidden {
	display: none !important;
}

.fp-app-cards-role:not(.is-hidden) {
	width: 100%;
	display: grid;
}

.fp-app-cards {
	display: grid;
	grid-template-columns: 1fr; /* Mobilförst: en kolumn */
	gap: 1.25rem;
}

/* Två kolumner på större skärmar */
@media (min-width: 768px) {
	.fp-app-cards {
		grid-template-columns: repeat(2, 1fr);
		gap: 1.5rem;
	}
}

.fp-app-card {
	background: var(--fp-bg-card);
	border: 1px solid var(--fp-border);
	border-radius: var(--fp-radius);
	padding: 1.5rem;
	display: flex;
	flex-direction: column;
	gap: 1.25rem;
	width: 100%;
	-webkit-tap-highlight-color: transparent;
	tap-highlight-color: transparent;
}

@media (min-width: 768px) {
	.fp-app-card {
		padding: 1.75rem;
	}
}

.fp-app-card-header {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 1rem;
}

.fp-app-card-title-wrap {
	flex: 1;
}

.fp-app-card-title {
	font-size: clamp(1.1rem, 3.2vw, 1.4rem);
	font-weight: 900;
	margin: 0 0 0.2rem;
	text-transform: uppercase;
	letter-spacing: -0.02em;
	line-height: 1.2;
}

.fp-app-card-title .fp-app-accent {
	color: var(--fp-accent);
}

.fp-app-card-title-all-accent {
	color: var(--fp-accent);
}

.fp-app-card-subtitle {
	font-size: 0.7rem;
	font-weight: 600;
	color: var(--fp-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	margin: 0;
}

.fp-app-card-subtitle-nowrap {
	white-space: nowrap;
}

@media (max-width: 639px) {
	.fp-app-card-subtitle-nowrap {
		white-space: normal;
	}
	.fp-app-card-header,
	.fp-app-card-title-wrap {
		min-width: 0;
	}
}

.fp-app-card-price {
	text-align: center;
	flex-shrink: 0;
	width: 100%;
	margin-top: 0.25rem;
}

.fp-app-card-amount {
	display: block;
	font-size: clamp(1.35rem, 3vw, 1.65rem);
	font-weight: 900;
	letter-spacing: -0.02em;
	line-height: 1;
	color: var(--fp-text);
}

.fp-app-card-period {
	font-size: 0.65rem;
	color: var(--fp-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.05em;
	margin-top: 0.15rem;
	display: block;
}

/* Keep card content stable on narrow cards. */
@media (max-width: 1023px) {
	.fp-app-card {
		gap: 1rem;
	}
	.fp-app-card-header {
		flex-direction: column;
		gap: 0.6rem;
	}
}

.fp-app-card-features {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	row-gap: 0.7rem;
	font-size: 0.8rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.02em;
	font-style: normal;
	color: var(--fp-text);
	line-height: 1.45;
}

.fp-app-card-features li {
	position: relative;
	padding-left: 0;
	margin-bottom: 0;
	display: flex;
	align-items: flex-start;
	gap: 0.58rem;
}

.fp-app-card-features li::before {
	display: none;
}

.fp-feature-icon {
	width: 1.28rem;
	height: 1.28rem;
	flex: 0 0 1.28rem;
	color: var(--fp-accent);
	margin-top: 0.02rem;
	transform: translateZ(0);
	transition: transform 360ms ease, opacity 360ms ease;
}

@media (hover: hover) and (pointer: fine) {
	.fp-app-card-features li:hover .fp-feature-icon {
		transform: scale(1.08);
	}
}

.fp-app-card-features li:active .fp-feature-icon {
	transform: scale(0.96);
}

.fp-feature-text {
	display: inline-block;
}

@keyframes fp-lucide-draw {
	0% {
		stroke-dashoffset: 56;
		opacity: 0.8;
	}
	60% {
		stroke-dashoffset: 6;
		opacity: 1;
	}
	100% {
		stroke-dashoffset: 0;
		opacity: 1;
	}
}

.fp-app-card-cta {
	margin-top: auto;
	padding-top: 0.5rem;
}

.fp-app-card-trial {
	font-size: 0.75rem;
	color: var(--fp-text-muted);
	margin: 0.5rem 0 0;
	font-weight: 600;
	text-align: center;
}

.fp-app-btn {
	display: inline-block;
	width: 100%;
	text-align: center;
	padding: 1rem 1.5rem;
	min-height: var(--fp-touch-target); /* Touch-friendly */
	font-size: 0.95rem;
	font-weight: 800;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	text-decoration: none;
	border-radius: var(--fp-radius-sm);
	transition: opacity 0.15s ease, transform 0.1s ease, background 0.15s ease;
	border: 2px solid transparent;
	-webkit-tap-highlight-color: transparent;
	tap-highlight-color: transparent;
	-webkit-user-select: none;
	user-select: none;
	cursor: pointer;
}

.fp-app-btn:active {
	transform: scale(0.98);
	opacity: 0.9;
}

/* Hover endast på desktop */
@media (hover: hover) and (pointer: fine) {
	.fp-app-btn:hover {
		opacity: 0.95;
		transform: translateY(1px);
	}
}

.fp-app-btn-primary {
	background: var(--fp-accent);
	color: var(--fp-bg);
}

.fp-app-btn-membership {
	position: relative;
	overflow: hidden;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

/* Ikon ↔ etikett: samma marginal som .fp-app-btn-login > .fp-ui-icon (margin fungerar jämnt i flex + äldre iOS) */
.fp-app-btn-membership > .fp-ui-icon {
	width: 1.22rem;
	height: 1.22rem;
	flex: 0 0 1.22rem;
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 0;
	align-self: center;
	opacity: 1;
	margin-inline-end: 0.5rem;
	/* Vertikal optisk centrering mot versal etikett (chevron-krets sitter högt i rutan) */
	transform: translateY(calc(0.14em + 2px)) translateZ(0);
}

.fp-app-btn-membership .fp-app-btn-label {
	display: inline-block;
	line-height: 1.2;
	align-self: center;
}

.fp-app-btn-membership::after {
	content: "";
	position: absolute;
	top: -160%;
	left: -55%;
	width: 34%;
	height: 420%;
	background: linear-gradient(
		100deg,
		rgba(255, 255, 255, 0) 0%,
		rgba(255, 255, 255, 0.5) 50%,
		rgba(255, 255, 255, 0) 100%
	);
	transform: translateX(-260%) rotate(18deg);
	animation: fp-membership-glare 20s ease-in-out infinite;
	pointer-events: none;
}

.fp-app-btn-apply {
	background: transparent;
	color: #fff;
	border-color: var(--fp-accent);
}

@keyframes fp-membership-glare {
	0%,
	92%,
	100% {
		transform: translateX(-260%) rotate(18deg);
	}
	96% {
		transform: translateX(520%) rotate(18deg);
	}
}

/* Lucide stroke-draw on hover (same pattern as nav + feature list) */
@media (hover: hover) and (pointer: fine) {
	.fp-app-btn-membership:hover .fp-ui-icon {
		transform: translateY(calc(0.14em + 2px)) scale(1.06) translateZ(0);
		opacity: 1;
	}

	.fp-app-btn-membership:hover .fp-ui-icon svg path,
	.fp-app-btn-membership:hover .fp-ui-icon svg rect,
	.fp-app-btn-membership:hover .fp-ui-icon svg circle {
		animation: fp-lucide-draw 980ms cubic-bezier(0.22, 1, 0.36, 1) both;
	}
}

.fp-app-btn-membership:active .fp-ui-icon {
	transform: translateY(calc(0.14em + 2px)) scale(0.96) translateZ(0);
}

.fp-app-btn-outline {
	background: transparent;
	color: var(--fp-accent);
	border-color: var(--fp-accent);
}

.fp-app-btn-danger {
	background: #b91c1c;
	color: #fff;
	border-color: #b91c1c;
}

.fp-app-btn-sm {
	padding: 0.5rem 1rem;
	font-size: 0.9rem;
	min-height: 0;
}

/* Team – samma vita och gulgröna tema som resten */
.fp-app-team {
	margin-bottom: 3rem;
	color: var(--fp-text);
}

.fp-app-team-title {
	font-size: clamp(2rem, 5vw, 3rem);
	font-weight: 900;
	text-transform: uppercase;
	letter-spacing: -0.03em;
	line-height: 1.05;
	margin: 0 0 2rem;
	color: var(--fp-text);
}

.fp-app-team-title .fp-app-accent {
	color: var(--fp-accent);
}

.fp-app-founders {
	background: var(--fp-bg-card);
	border-radius: var(--fp-radius);
	padding: 2rem;
	margin-bottom: 1.5rem;
	border: 1px solid rgba(255,255,255,0.06);
	position: relative;
	overflow: hidden;
}

.fp-app-founders::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(135deg, rgba(0,0,0,0.6) 0%, transparent 60%);
	pointer-events: none;
}

.fp-app-founders-inner {
	position: relative;
	z-index: 1;
}

.fp-app-founders-badge {
	display: inline-block;
	background: var(--fp-accent);
	color: var(--fp-bg);
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	padding: 0.35rem 0.75rem;
	border-radius: 999px;
	margin-bottom: 0.75rem;
}

.fp-app-founders-names {
	font-size: clamp(2rem, 5vw, 3rem);
	font-weight: 900;
	line-height: 1.05;
	margin: 0 0 0.75rem;
	text-transform: uppercase;
	letter-spacing: -0.03em;
}

.fp-app-founders-names .fp-app-accent {
	color: var(--fp-accent);
}

.fp-app-founders-desc {
	font-size: 0.95rem;
	line-height: 1.5;
	color: var(--fp-text-muted);
	margin: 0;
	max-width: 560px;
}

.fp-app-team-grid {
	display: grid;
	grid-template-columns: 1fr; /* Mobilförst */
	gap: 1rem;
}

@media (min-width: 640px) {
	.fp-app-team-grid {
		grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	}
}

.fp-app-team-card {
	display: flex;
	align-items: center;
	gap: 1.25rem;
	background: var(--fp-bg-card);
	border-radius: var(--fp-radius);
	padding: 1.25rem;
	border: 1px solid rgba(255,255,255,0.06);
}

.fp-app-team-card-photo {
	flex: 0 0 auto;
	width: 96px;
	min-width: 96px;
	background: rgba(255,255,255,0.06);
	border-radius: var(--fp-radius-sm) 0 0 var(--fp-radius-sm);
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
}

.fp-app-team-card-img {
	display: block;
	height: 100%;
	width: 100%;
	object-fit: cover;
}

.fp-app-team-card-photo:not(.fp-app-team-card-photo-placeholder) {
	align-self: stretch;
}

.fp-app-team-card-photo-placeholder {
	width: 80px;
	height: 80px;
	min-width: 80px;
	font-size: 0.7rem;
	color: var(--fp-text-muted);
	text-transform: uppercase;
}

.fp-app-team-card-info {
	flex: 1;
	min-width: 0;
	text-align: left;
}

.fp-app-team .fp-app-team-card-name {
	color: var(--fp-text);
}

.fp-app-team-card-name {
	font-size: 1.5rem;
	font-weight: 900;
	margin: 0 0 0.2rem;
	text-transform: uppercase;
	letter-spacing: -0.01em;
	line-height: 1.1;
	text-align: left;
}

.fp-app-team-card-name-word {
	display: block;
}

.fp-app-team-card-role {
	font-size: 0.9rem;
	font-weight: 800;
	color: var(--fp-accent);
	text-transform: uppercase;
	letter-spacing: 0.02em;
	margin: 0 0 0.15rem;
}

.fp-app-team-card-badge {
	display: inline-block;
	font-size: 0.7rem;
	font-weight: 600;
	color: var(--fp-bg);
	background: var(--fp-accent);
	padding: 0.25rem 0.5rem;
	border-radius: 999px;
	margin: 0 0 0.35rem;
	letter-spacing: 0.03em;
	text-align: left;
	align-self: flex-start;
}

.fp-app-team-card-spec {
	font-size: 0.8rem;
	color: var(--fp-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.03em;
	margin: 0;
	text-align: left;
}

.fp-app-team-card-actions {
	margin: 0.6rem 0 0;
	font-size: 0.85rem;
}

.fp-app-team-card-link {
	color: var(--fp-accent);
	text-decoration: none;
	font-weight: 600;
}

.fp-app-team-card-link:hover,
.fp-app-team-card-link:focus {
	color: var(--fp-accent);
	text-decoration: underline;
}

.fp-app-team-card-sep {
	color: var(--fp-text-muted);
	font-weight: 400;
}

.fp-app-clubs {
	margin: 0 auto 3rem;
	padding: 1.5rem 0 0.5rem;
	text-align: center;
}

.fp-app-clubs-eyebrow {
	margin: 0 0 2rem;
	font-size: clamp(1.5rem, 4vw, 2.25rem);
	font-weight: 900;
	line-height: 1.1;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	color: var(--fp-text);
}

.fp-app-clubs-eyebrow .fp-app-accent {
	color: var(--fp-accent);
}

.fp-app-clubs-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	align-items: center;
	justify-items: center;
	gap: 1.25rem 1.75rem;
	max-width: 760px;
	margin: 0 auto;
}

.fp-app-clubs-item {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 88px;
	width: 100%;
}

.fp-app-clubs-logo {
	max-height: 84px;
	max-width: 100%;
	width: auto;
	height: auto;
	object-fit: contain;
	display: block;
}

@media (max-width: 640px) {
	.fp-app-clubs {
		padding: 1rem 0 0.25rem;
		margin-bottom: 2rem;
	}
	.fp-app-clubs-eyebrow {
		margin-bottom: 1.25rem;
	}
	.fp-app-clubs-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1.25rem 1rem;
		max-width: 360px;
	}
	.fp-app-clubs-item {
		min-height: 72px;
	}
	.fp-app-clubs-logo {
		max-height: 68px;
	}
}

body.fp-team-modal-open {
	overflow: hidden !important;
	overscroll-behavior: none !important;
	touch-action: none !important;
}

body.fp-upplagg-activate-modal-open {
	overflow: hidden;
}

.fp-team-modal {
	position: fixed;
	inset: 0;
	display: none;
	align-items: center;
	justify-content: center;
	padding: 1rem;
	z-index: 2000;
}

.fp-team-modal[aria-hidden="false"] {
	display: flex;
}

.fp-team-modal-backdrop {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.68);
	backdrop-filter: blur(3px);
	-webkit-backdrop-filter: blur(3px);
	touch-action: none;
	overscroll-behavior: contain;
}

.fp-team-modal-dialog {
	position: relative;
	z-index: 1;
	width: min(980px, calc(100vw - 2rem));
	max-height: min(90vh, 860px);
	overflow-y: auto;
	background: linear-gradient(180deg, rgba(15, 15, 15, 0.97), rgba(12, 12, 12, 0.98));
	border: 1px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.35);
	border-radius: 20px;
	box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5);
	padding: 1rem 1rem 1.25rem;
}

.fp-team-modal-content {
	padding: 0.5rem 0.2rem 0.2rem;
	display: grid;
	grid-template-columns: minmax(0, 1fr) 360px;
	gap: 1.4rem;
	align-items: stretch;
	position: relative;
}

.fp-team-modal-copy {
	padding: 0.25rem 0.4rem 0.25rem 0.15rem;
	overflow-y: auto;
	max-height: min(76vh, 760px);
}

.fp-team-modal-media {
	display: flex;
	align-items: stretch;
}

.fp-team-modal-photo-wrap {
	width: 100%;
	min-height: 430px;
	border-radius: 16px;
	overflow: hidden;
	background: rgba(255, 255, 255, 0.06);
	border: 1px solid rgba(255, 255, 255, 0.08);
	position: relative;
}

.fp-team-modal-photo {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.fp-team-modal-close {
	appearance: none;
	border: 1px solid rgba(255, 255, 255, 0.2);
	background: rgba(255, 255, 255, 0.06);
	color: var(--fp-text);
	border-radius: 999px;
	padding: 0.6rem 1rem;
	font-weight: 700;
	font-size: 0.9rem;
	line-height: 1;
	cursor: pointer;
}

.fp-team-modal-role {
	margin: 0.9rem 0 0.45rem;
	color: var(--fp-accent);
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.fp-team-modal-title {
	margin: 0.5rem 0 0;
	color: #fff;
	font-size: clamp(1.55rem, 3.6vw, 2.2rem);
	font-weight: 900;
	letter-spacing: -0.02em;
	line-height: 1.1;
	text-transform: uppercase;
	text-shadow: 0 2px 16px rgba(0, 0, 0, 0.55);
}

.fp-team-modal-photo-overlay {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 48%;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.82) 100%);
	pointer-events: none;
	z-index: 1;
}

.fp-team-modal-action-bar {
	display: none;
}

@media (min-width: 1024px) {
	.fp-team-modal-title {
		position: absolute;
		right: 1.2rem;
		bottom: 1rem;
		left: calc(100% - 360px + 1rem);
		z-index: 2;
		margin: 0;
	}
}

.fp-team-modal-specialty {
	margin: 0.55rem 0 0;
	color: var(--fp-text);
	font-size: 0.9rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

.fp-team-modal-rich {
	margin-top: 0.8rem;
}

.fp-team-modal-intro {
	margin: 0.95rem 0 0;
	color: var(--fp-text-muted);
	font-size: 0.98rem;
	line-height: 1.7;
	max-width: 50ch;
}

.fp-team-modal-section {
	margin-top: 1rem;
}

.fp-team-modal-section-title {
	margin: 0 0 0.5rem;
	font-size: 1rem;
	line-height: 1.35;
	color: var(--fp-text);
	font-weight: 800;
}

.fp-team-modal-paragraph {
	margin: 0.45rem 0 0;
	color: var(--fp-text-muted);
	font-size: 0.95rem;
	line-height: 1.65;
}

.fp-team-modal-link {
	color: var(--fp-accent);
	text-decoration: underline;
	text-underline-offset: 2px;
	word-break: break-word;
}

.fp-team-modal-link:hover,
.fp-team-modal-link:focus {
	color: var(--fp-text);
}

.fp-team-modal-cta {
	margin: 0.75rem 0 0;
}

.fp-team-modal-cta .fp-app-btn {
	display: inline-flex;
	align-items: center;
	width: auto;
	min-height: 0;
	padding: 0.55rem 1.1rem;
	font-size: 0.85rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: none;
	border-radius: 999px;
}

.fp-team-modal-list {
	margin: 0.6rem 0 0;
	padding-left: 1.2rem;
	color: var(--fp-text-muted);
	font-size: 0.94rem;
	line-height: 1.55;
}

.fp-team-modal-list li + li {
	margin-top: 0.34rem;
}

/* Replace default bullets with an icon marker (stronger identity). */
.fp-team-modal-list {
	list-style: none;
	padding-left: 0;
}

.fp-team-modal-list li {
	position: relative;
	padding-left: 1.55rem;
}

.fp-team-modal-list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.22em;
	width: 1.05rem;
	height: 1.05rem;
	background: var(--fp-accent);
	-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M20%206%209%2017l-5-5%27/%3E%3C/svg%3E") no-repeat center / contain;
	mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M20%206%209%2017l-5-5%27/%3E%3C/svg%3E") no-repeat center / contain;
	opacity: 0.95;
}

@media (max-width: 1023px) {
	.fp-team-modal {
		padding: 0;
		align-items: stretch;
	}

	.fp-team-modal-dialog {
		width: 100vw;
		height: 100vh;
		height: 100dvh;
		max-height: 100vh;
		max-height: 100dvh;
		border-radius: 0;
		border: 0;
		padding: 0;
		display: flex;
		flex-direction: column;
		overflow: hidden;
		background: var(--brand-bg, #0d0d0d);
	}

	.fp-team-modal-dialog .fp-team-modal-close,
	.fp-team-modal .fp-team-modal-close {
		position: relative;
		flex: 0 0 auto;
		align-self: flex-start;
		z-index: 5;
		display: inline-flex;
		align-items: center;
		gap: 0.35rem;
		min-height: 44px;
		padding: 0.7rem 1.2rem;
		margin: calc(0.75rem + env(safe-area-inset-top)) 0 0.6rem 1rem;
		-webkit-appearance: none !important;
		appearance: none !important;
		background: var(--brand-accent, #D4D41E) !important;
		color: var(--brand-bg, #0a0a0a) !important;
		border: 0 !important;
		box-shadow: 0 6px 14px rgba(0, 0, 0, 0.35);
	}

	.fp-team-modal-close::before {
		content: "←";
		font-size: 1.05rem;
		font-weight: 900;
		line-height: 1;
	}

	.fp-team-modal-content {
		flex: 1 1 auto;
		display: flex;
		flex-direction: column;
		grid-template-columns: 1fr;
		gap: 0;
		padding: 0;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		overscroll-behavior: contain;
		touch-action: pan-y;
		background-image: none;
	}

	.fp-team-modal-content::before {
		display: none;
	}

	.fp-team-modal-media {
		display: flex;
		justify-content: center;
		order: 0;
		margin: 0.75rem 0 0;
		padding: 0 1rem;
	}

	.fp-team-modal-photo-wrap {
		width: clamp(200px, 58vw, 260px);
		aspect-ratio: 3 / 4;
		min-height: 0;
		height: auto;
		border-radius: 16px;
		border: 1px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.25);
		background: rgba(255, 255, 255, 0.04);
		overflow: hidden;
		-webkit-mask-image: none;
		mask-image: none;
		box-shadow: 0 12px 28px -10px rgba(0, 0, 0, 0.6);
	}

	.fp-team-modal-photo {
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center 15%;
	}

	.fp-team-modal-photo-overlay {
		display: none;
	}

	.fp-team-modal-copy {
		order: 1;
		position: relative;
		z-index: 1;
		padding: 1.5rem 1rem 1.25rem;
		max-height: none;
		overflow-y: visible;
	}

	.fp-team-modal-cta {
		display: none;
	}

	.fp-team-modal-action-bar {
		flex: 0 0 auto;
		padding: 0.6rem 1rem calc(0.6rem + env(safe-area-inset-bottom));
		background: linear-gradient(180deg, rgba(var(--brand-bg-rgb, 13, 13, 13), 0) 0%, rgba(var(--brand-bg-rgb, 13, 13, 13), 0.92) 35%, var(--brand-bg, #0d0d0d) 100%);
		display: flex;
	}

	.fp-team-modal-action-bar[hidden] {
		display: none;
	}

	.fp-team-modal-action-bar-btn {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		min-height: 48px;
		padding: 0.85rem 1.25rem;
		border-radius: 999px;
		font-weight: 800;
		letter-spacing: 0.02em;
		text-transform: none;
		font-size: 1rem;
		box-shadow: 0 10px 24px -8px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.5);
	}

	.fp-team-modal-title {
		position: static;
		margin-top: 0.3rem;
		font-size: clamp(1.5rem, 6vw, 2rem);
		color: #fff;
		text-shadow: none;
	}

	.fp-team-modal-role {
		margin-top: 0;
	}

	.fp-team-modal-specialty,
	.fp-team-modal-intro,
	.fp-team-modal-paragraph,
	.fp-team-modal-list {
		color: var(--fp-text-muted);
		text-shadow: none;
	}

	.fp-team-modal-section-title {
		color: var(--fp-text);
		text-shadow: none;
	}
}

/* Du vet väl om att du kan */
.fp-app-you-can {
	margin-bottom: 3.25rem;
}
.fp-app-you-can-title {
	font-size: clamp(1.5rem, 4vw, 2.25rem);
	font-weight: 900;
	line-height: 1.15;
	letter-spacing: -0.02em;
	text-transform: uppercase;
	margin: 0 0 1.25rem;
	color: var(--fp-accent);
	text-align: center;
}
.fp-app-you-can-friskvard {
	background: #090909;
	border: 0;
	border-radius: var(--fp-radius);
	margin-bottom: 1rem;
}
.fp-app-you-can-friskvard__inner {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	padding: 1.25rem;
	align-items: center;
	text-align: center;
}
.fp-app-you-can-friskvard__head {
	display: grid;
	gap: 0.5rem;
	justify-items: center;
}
.fp-app-you-can-friskvard__lede {
	margin: 0;
	color: rgba(255, 255, 255, 0.86);
	font-size: 0.95rem;
	line-height: 1.45;
}
.fp-app-you-can-friskvard__logos {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 0.5rem 1rem;
}
.fp-app-you-can-friskvard__logo {
	display: block;
	max-height: 24px;
	width: auto;
}
.fp-app-you-can-friskvard__logo--benify {
	max-height: 30px;
}
.fp-app-you-can-friskvard__cta-wrap {
	margin: 0;
}
.fp-app-you-can-friskvard__cta {
	display: inline-block;
	color: #fff;
	font-size: 0.9rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	text-decoration: none;
	border-bottom: 2px solid var(--brand-accent, #D4D41E);
	padding-bottom: 0.15rem;
	box-shadow: none;
	background: transparent;
	transition: border-bottom-color 0.2s ease, color 0.2s ease;
}
.fp-app-you-can-friskvard__cta:hover,
.fp-app-you-can-friskvard__cta:focus-visible {
	color: #fff;
	background: transparent;
	border-bottom-color: #f5f23a;
	outline: none;
}

/* Tema-länkar (t.ex. underline/hover-bakgrund) ska inte ändra friskvårds-CTA:n. */
.fp-landing-page .fp-app-you-can-friskvard a.fp-app-you-can-friskvard__cta,
.fp-landing-page .fp-app-you-can-friskvard a.fp-app-you-can-friskvard__cta:visited {
	color: #fff;
	background: transparent;
	background-color: transparent;
	text-decoration: none;
	box-shadow: none;
}
.fp-landing-page .fp-app-you-can-friskvard a.fp-app-you-can-friskvard__cta:hover,
.fp-landing-page .fp-app-you-can-friskvard a.fp-app-you-can-friskvard__cta:focus,
.fp-landing-page .fp-app-you-can-friskvard a.fp-app-you-can-friskvard__cta:focus-visible {
	color: #fff;
	background: transparent;
	background-color: transparent;
	text-decoration: none;
	box-shadow: none;
}

.fp-app-you-can-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem;
}
.fp-app-you-can-block {
	min-height: 100%;
}
.fp-app-you-can-block__surface {
	position: relative;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	gap: 1rem;
	min-height: 100%;
	background: linear-gradient(160deg, #101117 0%, #171a22 100%);
	border: 1px solid var(--fp-border);
	border-radius: var(--fp-radius);
	padding: 1.4rem;
}
.fp-app-you-can-block__media {
	position: absolute;
	inset: 0;
	z-index: 0;
	isolation: isolate;
}
.fp-app-you-can-block__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.fp-app-you-can-block__scrim {
	position: absolute;
	inset: 0;
	z-index: 1;
	background:
		linear-gradient(180deg, rgba(5, 6, 10, 0.05) 0%, rgba(5, 6, 10, 0.18) 38%, rgba(3, 4, 8, 0.82) 62%, rgba(1, 2, 6, 0.94) 78%, rgba(0, 0, 0, 0.97) 100%);
}
.fp-app-you-can-block__blur-foot {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 72%;
	z-index: 2;
	pointer-events: none;
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
	mask-image: linear-gradient(to top, #000 18%, rgba(0, 0, 0, 0.55) 55%, transparent 100%);
	-webkit-mask-image: linear-gradient(to top, #000 18%, rgba(0, 0, 0, 0.55) 55%, transparent 100%);
}
.fp-app-you-can-block__offer-badge,
.fp-app-you-can-podcast__chip,
.fp-app-you-can-block__head,
.fp-app-you-can-block__cta-wrap {
	position: relative;
	z-index: 3;
}
.fp-app-you-can-block__offer-badge {
	align-self: flex-start;
	border: 1px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.55);
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.14);
	color: #f9ff77;
	font-size: 0.72rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	padding: 0.32rem 0.58rem;
	border-radius: 999px;
}
.fp-app-you-can-block__head {
	display: grid;
	gap: 0.55rem;
}
.fp-app-you-can-block__title {
	margin: 0;
	color: #fff;
	font-size: clamp(1.2rem, 2.2vw, 1.55rem);
	line-height: 1.2;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.65), 0 0 24px rgba(0, 0, 0, 0.45);
}
.fp-app-you-can-block__lede {
	margin: 0;
	color: rgba(255, 255, 255, 0.94);
	font-size: 0.95rem;
	line-height: 1.5;
	max-width: 44ch;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}
.fp-app-you-can-block__cta-wrap {
	margin: 0;
}
.fp-app-you-can-block__cta {
	display: inline-flex;
}

.fp-app-you-can-podcast__chip {
	display: inline-flex;
	align-items: center;
	align-self: flex-start;
	flex: 0 0 auto;
	width: max-content;
	max-width: 100%;
	margin: 0;
	box-sizing: border-box;
	gap: 0.45rem;
	font-size: 0.72rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	padding: 0.32rem 0.58rem;
	border-radius: 999px;
	border: 1px solid rgba(255, 255, 255, 0.2);
	background: rgba(8, 10, 14, 0.72);
	color: rgba(255, 255, 255, 0.92);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06) inset;
}
.fp-app-you-can-podcast__spotify-icon {
	width: 1rem;
	height: 1rem;
	color: #1ed760;
}
@media (hover: hover) and (pointer: fine) {
	.fp-app-you-can-block__surface:hover {
		border-color: var(--fp-accent);
		transform: translateY(-1px);
	}
}

@media (min-width: 768px) {
	.fp-app-you-can-friskvard {
		width: 100vw;
		margin-left: calc(50% - 50vw);
		margin-right: calc(50% - 50vw);
		border-radius: 0;
	}
	.fp-app-you-can-friskvard__inner {
		max-width: 1280px;
		margin: 0 auto;
		padding: 1.3rem 2rem 1.4rem;
	}
	.fp-app-you-can-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 1.25rem;
	}
	.fp-app-you-can-block__surface {
		min-height: 360px;
	}
}

@media (max-width: 767px) {
	.fp-app-you-can-friskvard__cta-wrap {
		text-align: center;
	}
	.fp-app-you-can-block__cta {
		width: 100%;
		justify-content: center;
	}
}

/* ========== Kom igång-sida (planväljare + rollval) ========== */
.fp-kom-igang-main {
	max-width: 1000px;
	margin: 0 auto;
	padding-top: 0.5rem;
}
.fp-kom-igang-intro {
	margin-bottom: 2rem;
}
.fp-kom-igang-subtitle {
	font-size: 1rem;
	color: var(--fp-text-muted);
	margin: 0 0 2rem;
	line-height: 1.5;
}
.fp-kom-igang-roll {
	margin-bottom: 2.5rem;
}
.fp-kom-igang-roll-title {
	font-size: 1.15rem;
	font-weight: 800;
	color: var(--fp-accent);
	margin: 0 0 1rem;
	text-transform: uppercase;
	letter-spacing: 0.02em;
}
.fp-kom-igang-roll-cards {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem;
}
@media (min-width: 600px) {
	.fp-kom-igang-roll-cards {
		grid-template-columns: repeat(2, 1fr);
	}
}
.fp-kom-igang-roll-card {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	text-align: left;
	background: var(--fp-bg-card);
	border: 1px solid var(--fp-border);
	border-radius: var(--fp-radius);
	padding: 1.5rem;
	text-decoration: none;
	color: inherit;
	transition: border-color 0.2s ease, transform 0.2s ease;
}
.fp-kom-igang-roll-card:hover {
	border-color: var(--fp-accent);
	transform: translateY(-2px);
}
.fp-kom-igang-roll-icon {
	font-size: 2rem;
	margin-bottom: 0.5rem;
	display: block;
}
.fp-kom-igang-roll-name {
	font-size: 1.25rem;
	font-weight: 800;
	color: var(--fp-accent);
	text-transform: uppercase;
	margin: 0 0 0.5rem;
}
.fp-kom-igang-roll-desc {
	font-size: 0.9rem;
	color: var(--fp-text-muted);
	line-height: 1.5;
	margin: 0 0 1rem;
	flex-grow: 1;
}
.fp-kom-igang-roll-cta {
	font-size: 0.85rem;
	font-weight: 700;
	color: var(--fp-accent);
}
/* Informationssida (kom-igang med roll) */
.fp-kom-igang-info .fp-kom-igang-subtitle {
	margin-bottom: 1.5rem;
	max-width: 56ch;
}
.fp-kom-igang-features {
	list-style: none;
	margin: 0 0 1.5rem;
	padding: 0;
	font-size: 1rem;
	line-height: 1.6;
	color: var(--fp-text);
}
.fp-kom-igang-features li {
	position: relative;
	padding-left: 1.5rem;
	margin-bottom: 0.5rem;
}
.fp-kom-igang-features li::before {
	content: "+";
	position: absolute;
	left: 0;
	color: var(--fp-accent);
	font-weight: 900;
}
.fp-kom-igang-friskvard {
	font-size: 0.95rem;
	color: var(--fp-text-muted);
	margin: 0 0 2rem;
}
.fp-kom-igang-cta {
	margin-top: 2rem;
	padding-top: 1.5rem;
	border-top: 1px solid rgba(255,255,255,0.08);
}
.fp-kom-igang-kop-btn {
	display: inline-block;
	min-width: 200px;
	text-align: center;
	padding: 1rem 1.5rem;
	font-size: 1.1rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin-bottom: 0.75rem;
}
.fp-kom-igang-cta-note {
	font-size: 0.85rem;
	color: var(--fp-text-muted);
	margin: 0;
	line-height: 1.4;
}
.fp-kom-igang-plans-hint {
	font-size: 0.9rem;
	color: var(--fp-text-muted);
	text-align: center;
	margin: 0 0 1.5rem;
	line-height: 1.4;
}
.fp-plans-fallback {
	border-top: 1px solid rgba(255,255,255,0.06);
	padding-top: 2rem;
}
.fp-plans-subtitle {
	font-size: 0.85rem;
	color: var(--fp-text-muted);
	text-align: center;
	margin: -0.5rem 0 1rem;
}
.fp-kom-igang-title {
	font-size: clamp(1.75rem, 4vw, 2.25rem);
	font-weight: 900;
	color: var(--fp-text);
	margin: 0 0 1.5rem;
	text-transform: uppercase;
	letter-spacing: -0.02em;
}
.fp-kom-igang-how-title {
	font-size: 1.2rem;
	font-weight: 800;
	color: var(--fp-accent);
	margin: 0 0 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.02em;
}
.fp-kom-igang-how-list {
	list-style: none;
	margin: 0;
	padding: 0;
	color: var(--fp-text);
	font-size: 0.95rem;
	line-height: 1.6;
}
.fp-kom-igang-how-list li {
	position: relative;
	padding-left: 1.25rem;
	margin-bottom: 0.5rem;
}
.fp-kom-igang-how-list li::before {
	content: "+";
	position: absolute;
	left: 0;
	color: var(--fp-accent);
	font-weight: 900;
}
.fp-plans {
	margin-bottom: 3rem;
}
.fp-plans-title {
	font-size: clamp(1.5rem, 4vw, 2rem);
	font-weight: 900;
	color: var(--fp-accent);
	margin: 0 0 1.5rem;
	text-transform: uppercase;
	letter-spacing: -0.02em;
	text-align: center;
}
.fp-plans-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem;
	margin-bottom: 1.5rem;
}
@media (min-width: 640px) {
	.fp-plans-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 1.25rem;
	}
}
@media (min-width: 900px) {
	.fp-plans-grid {
		grid-template-columns: repeat(3, 1fr);
		gap: 1.25rem;
	}
}
.fp-plan-card {
	background: var(--fp-bg-card);
	border: 1px solid var(--fp-border);
	border-radius: var(--fp-radius);
	padding: 1.5rem;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.5rem;
	transition: border-color 0.2s ease;
}
.fp-plan-card:hover {
	border-color: var(--fp-accent);
}
.fp-plan-label {
	font-size: 0.85rem;
	font-weight: 700;
	color: var(--fp-accent);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin: 0;
}
.fp-plan-price {
	font-size: 1.75rem;
	font-weight: 900;
	color: var(--fp-text);
	margin: 0;
	line-height: 1;
}
.fp-plan-period {
	font-size: 0.8rem;
	color: var(--fp-text-muted);
	margin: 0;
}
.fp-plan-permonth {
	font-size: 0.85rem;
	font-weight: 700;
	color: var(--fp-accent);
	margin: 0.15rem 0 0;
}
.fp-betalning-order-permonth {
	font-size: 0.9rem;
	font-weight: 700;
	color: var(--fp-accent);
	margin: 0.15rem 0 0;
}
.fp-plan-btn {
	width: 100%;
	margin-top: 0.5rem;
	text-align: center;
	font-size: 0.85rem;
	padding: 0.75rem 1rem;
}
.fp-plans-note {
	text-align: center;
	font-size: 0.9rem;
	color: var(--fp-text-muted);
	margin: 0 0 0.75rem;
}
.fp-plans-friskvard {
	text-align: center;
	font-size: 0.9rem;
	color: var(--fp-text);
	margin: 0;
}
.fp-plans-friskvard-link {
	color: var(--fp-accent);
	font-weight: 700;
	text-decoration: none;
}
.fp-plans-friskvard-link:hover {
	text-decoration: underline;
}

/* ========== Träningsval (mellanlager Mina träningsupplägg) ========== */
.fp-traningsval .fp-app-main {
	max-width: 800px;
}
.fp-traningsval-hero {
	margin-bottom: 1.5rem;
}
.fp-traningsval-title {
	font-size: 1.75rem;
	font-weight: 800;
	color: var(--fp-text);
	text-transform: uppercase;
	letter-spacing: 0.02em;
	margin: 0 0 0.35rem;
}
.fp-traningsval-subtitle {
	font-size: 1rem;
	color: var(--fp-text-muted);
	margin: 0 0 1.5rem;
}
.fp-traningsval-cards {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem;
}
@media (min-width: 600px) {
	.fp-traningsval-cards {
		grid-template-columns: repeat(3, 1fr);
	}
}
.fp-traningsval-card.fp-card {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: 160px;
	padding: 0;
	border: 1px solid rgba(255,255,255,0.06);
	border-radius: var(--fp-radius);
	overflow: hidden;
	text-decoration: none;
	color: inherit;
	background: var(--fp-bg-card);
	transition: transform 0.2s ease, border-color 0.2s;
}
.fp-traningsval-card.fp-card:hover {
	transform: translateY(-4px);
	border-color: var(--fp-accent);
}
.fp-traningsval-card .fp-card-bg {
	background-color: var(--fp-bg-card);
	background-size: cover;
	background-position: center;
}
.fp-traningsval-card-sasongsplanering .fp-card-bg {
	background-image: url('fp-traningsval-sasongsplanering.webp');
}
.fp-traningsval-card-upplagg .fp-card-bg {
	background-image: url('fp-traningsval-upplagg.webp');
	background-position: center 30%;
}
.fp-traningsval-card-inspiration .fp-card-bg {
	background-image: url('fp-traningsval-inspiration.webp');
	background-position: center 30%;
}
.fp-traningsval-card .fp-card-overlay {
	background: linear-gradient(to top, rgba(0,0,0,0.97) 0%, rgba(0,0,0,0.9) 25%, rgba(0,0,0,0.6) 55%, rgba(0,0,0,0.25) 100%);
	z-index: 0;
}
.fp-traningsval-card .fp-card-content {
	z-index: 1;
}
.fp-traningsval-card-title {
	font-size: 1.15rem;
	font-weight: 800;
	color: #fff;
	margin: 0 0 0.25rem;
	line-height: 1.2;
	text-shadow: 0 1px 3px rgba(0,0,0,0.5);
}
.fp-traningsval-card-desc {
	font-size: 0.85rem;
	color: rgba(255,255,255,0.9);
	margin: 0 0 0.5rem;
	line-height: 1.35;
	text-shadow: 0 1px 2px rgba(0,0,0,0.5);
}
.fp-traningsval-card .fp-card-content {
	padding: 1.25rem 1.5rem;
}
.fp-traningsval-card .fp-card-cta {
	font-size: 0.8rem;
	font-weight: 600;
	color: var(--fp-accent);
	text-shadow: 0 1px 2px rgba(0,0,0,0.5);
}

/* ========== Fystester ========== */
.fp-fystester .fp-app-main {
	padding-top: 2rem;
}
.fp-fystester-hero {
	margin-bottom: 2rem;
}
.fp-fystester-title {
	font-size: clamp(1.75rem, 4vw, 2.5rem);
	font-weight: 900;
	color: var(--fp-text);
	margin: 0 0 0.35rem;
	text-transform: uppercase;
	letter-spacing: -0.02em;
}
.fp-fystester-desc {
	color: var(--fp-text-muted);
	font-size: 0.95rem;
	line-height: 1.45;
	margin: 0 0 0.5rem;
}
.fp-fystester-msg-success {
	color: var(--fp-accent);
	font-weight: 600;
	margin: 0.5rem 0 0;
}
.fp-fystester-kravspec-toggle {
	margin-top: 1rem;
	margin-bottom: 0.5rem;
}
.fp-fystester-admin-link-wrap {
	margin: 0.75rem 0 0;
}
.fp-fystester-admin-link {
	font-size: 0.875rem;
	color: var(--fp-text-muted);
	text-decoration: none;
	transition: color 0.2s;
}
.fp-fystester-admin-link:visited,
.fp-fystester-admin-link:hover,
.fp-fystester-admin-link:focus,
.fp-fystester-admin-link:active {
	color: var(--fp-accent) !important;
}
.fp-fystester-manage-btn-wrap {
	margin: 0.8rem 0 0;
}
.fp-fystester-manage-btn,
.fp-fystester-manage-btn:visited {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 0.52rem 0.95rem;
	border-radius: 10px;
	border: 1px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.55);
	color: var(--fp-accent);
	background: transparent;
	text-decoration: none;
	font-weight: 700;
	font-size: 0.88rem;
	letter-spacing: 0.01em;
	transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.fp-fystester-manage-btn:hover,
.fp-fystester-manage-btn:focus {
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.12);
	color: var(--fp-accent) !important;
	border-color: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.85);
}
.fp-fystester-toggle-link {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	text-decoration: none;
	color: var(--fp-text-muted) !important;
	font-size: 0.9rem;
	transition: color 0.15s;
}
.fp-fystester-toggle-link:hover,
.fp-fystester-toggle-link:focus,
.fp-fystester-toggle-link:active {
	color: var(--fp-accent) !important;
}
.fp-fystester-toggle-track {
	display: inline-flex;
	align-items: center;
	width: 2.5rem;
	height: 1.35rem;
	background: rgba(255,255,255,0.12);
	border-radius: 999px;
	padding: 0.15rem;
	transition: background 0.2s;
}
.fp-fystester-toggle-on .fp-fystester-toggle-track {
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.35);
}
.fp-fystester-toggle-thumb {
	display: block;
	width: 1rem;
	height: 1rem;
	background: var(--fp-text-muted);
	border-radius: 50%;
	transition: transform 0.2s, background 0.2s;
}
.fp-fystester-toggle-on .fp-fystester-toggle-thumb {
	transform: translateX(1.05rem);
	background: var(--fp-accent);
}
.fp-fystester-section-title {
	font-size: 1.15rem;
	font-weight: 800;
	color: var(--fp-text);
	margin: 0 0 1rem;
	letter-spacing: -0.02em;
}
.fp-fystester-coach-log {
	margin-bottom: 2rem;
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 0.75rem;
	background: rgba(0, 0, 0, 0.2);
	overflow: hidden;
}
.fp-fystester-coach-log[open] {
	border-color: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.25);
}
.fp-fystester-coach-log-summary {
	list-style: none;
	font-size: 1rem;
	font-weight: 700;
	color: var(--fp-text);
	padding: 0.75rem 1rem;
	cursor: pointer;
	display: flex;
	align-items: center;
	gap: 0.5rem;
	transition: background 0.2s, color 0.2s;
}
.fp-fystester-coach-log-summary::-webkit-details-marker { display: none; }
.fp-fystester-coach-log-summary::before {
	content: '▶';
	font-size: 0.65rem;
	opacity: 0.7;
	transition: transform 0.2s;
}
.fp-fystester-coach-log[open] .fp-fystester-coach-log-summary::before {
	transform: rotate(90deg);
}
.fp-fystester-coach-log-summary:hover {
	background: rgba(255, 255, 255, 0.05);
	color: var(--fp-accent);
}
.fp-fystester-coach-log .fp-fystester-coach-log-desc,
.fp-fystester-coach-log .fp-fystester-form {
	padding: 0 1rem 1rem;
}
.fp-fystester-coach-log-desc {
	font-size: 0.9rem;
	color: var(--fp-text-muted);
	margin: 0 0 1rem;
	line-height: 1.4;
}
.fp-fystester-form-coach select,
.fp-fystester-form-coach input[type="text"],
.fp-fystester-form-coach input[type="date"] { max-width: 260px; }
/* Tränare: fokustester — undvik systemblå (legend/checkboxar) */
.fp-fystester .fp-fystester-coach-focus-fieldset {
	border: 1px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.35);
	border-radius: 0.5rem;
	padding: 0.75rem 1rem 1rem;
	margin: 1rem 0 0;
}
.fp-fystester .fp-fystester-coach-focus-legend {
	padding: 0 0.35rem;
	color: var(--fp-accent);
	font-size: 0.95rem;
	font-weight: 700;
}
.fp-fystester .fp-fystester-coach-focus-hint {
	font-size: 0.9rem;
	color: var(--fp-text-muted);
	margin: 0 0 0.75rem;
	line-height: 1.45;
}
.fp-fystester .fp-fystester-coach-focus-list {
	list-style: none;
	margin: 0;
	padding: 0;
}
.fp-fystester .fp-fystester-coach-focus-list li {
	margin: 0.35rem 0;
}
.fp-fystester .fp-fystester-coach-focus-label {
	display: flex;
	align-items: flex-start;
	gap: 0.5rem;
	cursor: pointer;
	font-weight: 500;
	color: var(--fp-text);
}
.fp-fystester .fp-fystester-coach-focus-check,
.fp-fystester .fp-fystester-select-check {
	accent-color: var(--fp-accent);
	width: 1.1em;
	height: 1.1em;
	flex-shrink: 0;
	margin-top: 0.15em;
}
/* Spelare: synlig info om lagets/tränarens inställningar */
.fp-fystester-player-lag-coach-box {
	margin: 1rem 0 1.25rem;
	padding: 1rem 1.1rem;
	border: 1px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.35);
	border-radius: 0.65rem;
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.06);
}
.fp-fystester-player-lag-coach-box--compact {
	margin-top: 0.5rem;
	margin-bottom: 1rem;
}
.fp-fystester-player-lag-coach-title {
	margin: 0 0 0.5rem;
	font-size: 0.95rem;
	font-weight: 800;
	color: var(--fp-accent);
	letter-spacing: -0.02em;
}
.fp-fystester-player-lag-coach-line {
	margin: 0 0 0.4rem;
	font-size: 0.9rem;
	color: var(--fp-text);
	line-height: 1.45;
}
.fp-fystester-player-lag-coach-tests {
	font-weight: 700;
	color: var(--fp-text);
}
.fp-fystester-player-lag-coach-note {
	margin: 0.5rem 0 0;
	font-size: 0.85rem;
	color: var(--fp-text-muted);
	line-height: 1.45;
}
/* Spelare: scoreboard som kort per test */
.fp-fystester-scoreboard-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem;
	margin-bottom: 2rem;
}
@media (min-width: 560px) {
	.fp-fystester-scoreboard-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}
@media (min-width: 900px) {
	.fp-fystester-scoreboard-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}
.fp-fystester-scoreboard-card {
	background: rgba(255,255,255,0.04);
	border: 1px solid var(--fp-border);
	border-radius: var(--fp-radius-sm);
	padding: 1.25rem;
}
.fp-fystester-scoreboard-card-title {
	font-size: 1rem;
	font-weight: 800;
	color: var(--fp-text);
	margin: 0 0 1rem;
	letter-spacing: -0.01em;
}
.fp-fystester-scoreboard-card-title .fp-fystester-unit {
	font-weight: 500;
	color: var(--fp-text-muted);
	font-size: 0.85em;
}
.fp-fystester-scoreboard-card-body {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}
.fp-fystester-scoreboard-row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 0.75rem;
}
.fp-fystester-label {
	font-size: 0.8rem;
	color: var(--fp-text-muted);
}
.fp-fystester-value {
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--fp-text);
}
.fp-fystester-value-mine {
	color: var(--fp-accent);
	font-weight: 700;
}
.fp-fystester-status { display: inline-block; padding: 0.25rem 0.6rem; border-radius: 999px; font-size: 0.75rem; font-weight: 600; margin-top: 0.5rem; align-self: flex-start; }
.fp-fystester-status-ok { background: rgba(34, 197, 94, 0.2); color: #4ade80; }
.fp-fystester-status-miss { background: rgba(239, 68, 68, 0.2); color: #f87171; }
.fp-fystester-status-near { background: rgba(234, 179, 8, 0.2); color: #facc15; }
.fp-fystester-status-none { background: rgba(255,255,255,0.08); color: var(--fp-text-muted); }
/* Tränare: kort per spelare */
.fp-fystester-coach-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem;
	margin-bottom: 2rem;
}
@media (min-width: 560px) {
	.fp-fystester-coach-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}
@media (min-width: 900px) {
	.fp-fystester-coach-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}
.fp-fystester-coach-card {
	background: rgba(255,255,255,0.04);
	border: 1px solid var(--fp-border);
	border-radius: var(--fp-radius-sm);
	padding: 1.25rem;
}
.fp-fystester-coach-card-name {
	font-size: 1rem;
	font-weight: 800;
	color: var(--fp-text);
	margin: 0 0 0.75rem;
	letter-spacing: -0.01em;
	padding-bottom: 0.5rem;
	border-bottom: 1px solid rgba(255,255,255,0.08);
}
.fp-fystester-coach-card-list {
	list-style: none;
	padding: 0;
	margin: 0;
}
.fp-fystester-coach-card-list li {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 0.75rem;
	padding: 0.35rem 0.6rem 0.35rem 0.7rem;
	font-size: 0.9rem;
	border-bottom: 1px solid rgba(255,255,255,0.04);
	border-left: 3px solid transparent;
	border-radius: 4px;
	transition: background-color 0.15s ease;
}
.fp-fystester-coach-card-list li:last-child {
	border-bottom: 0;
}
.fp-fystester-coach-card-list li.fp-fystester-row-ok {
	background: rgba(34, 197, 94, 0.08);
	border-left-color: #4ade80;
}
.fp-fystester-coach-card-list li.fp-fystester-row-near {
	background: rgba(234, 179, 8, 0.08);
	border-left-color: #facc15;
}
.fp-fystester-coach-card-list li.fp-fystester-row-miss {
	background: rgba(239, 68, 68, 0.08);
	border-left-color: #f87171;
}
.fp-fystester-coach-card-list li.fp-fystester-row-none {
	border-left-color: rgba(255,255,255,0.12);
}
.fp-fystester-coach-test {
	color: var(--fp-text-muted);
}
.fp-fystester-coach-value {
	font-weight: 600;
	color: var(--fp-text);
}
.fp-fystester-coach-value-wrap {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 0.25rem;
}
.fp-fystester-coach-value-wrap .fp-fystester-coach-value {
	font-size: 0.95rem;
}
.fp-fystester-coach-krav {
	font-size: 0.75rem;
	color: var(--fp-text-muted);
}
.fp-fystester-coach-value-wrap .fp-fystester-status {
	margin-top: 0;
}
.fp-fystester-coach-kpis {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 0.75rem;
	margin: 0.5rem 0 1rem;
}
@media (min-width: 600px) {
	.fp-fystester-coach-kpis {
		grid-template-columns: repeat(4, 1fr);
	}
}
.fp-fystester-kpi {
	background: var(--fp-bg-card);
	border: 1px solid var(--fp-border, rgba(255,255,255,0.08));
	border-radius: 10px;
	padding: 0.85rem 0.95rem;
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
}
.fp-fystester-kpi-num {
	font-size: 1.55rem;
	font-weight: 800;
	color: var(--fp-text);
	line-height: 1.1;
}
.fp-fystester-kpi-lbl {
	font-size: 0.78rem;
	color: var(--fp-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.04em;
}
.fp-fystester-kpi-ok { border-left: 3px solid #4ade80; }
.fp-fystester-kpi-miss { border-left: 3px solid #f87171; }

.fp-fystester-coach-controls {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	align-items: center;
	margin-bottom: 1rem;
}
.fp-fystester-coach-search input[type="search"] {
	min-width: 200px;
	padding: 0.5rem 0.75rem;
	border: 1px solid var(--fp-border);
	border-radius: 6px;
	background: var(--fp-bg-card);
	color: var(--fp-text);
	font-size: 0.9rem;
}
.fp-fystester-coach-filter {
	display: flex;
	align-items: center;
	gap: 0.4rem;
	font-size: 0.85rem;
	color: var(--fp-text-muted);
	cursor: pointer;
}
.fp-fystester-coach-filter input[type="checkbox"] {
	accent-color: var(--fp-accent);
	width: 16px;
	height: 16px;
}
.fp-fystester-coach-sort {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	font-size: 0.85rem;
	color: var(--fp-text-muted);
}
.fp-fystester-coach-sort-lbl { white-space: nowrap; }
.fp-fystester-coach-sort select {
	padding: 0.4rem 0.6rem;
	border: 1px solid var(--fp-border);
	border-radius: 6px;
	background: var(--fp-bg-card);
	color: var(--fp-text);
	font-size: 0.85rem;
	cursor: pointer;
}

.fp-fystester-coach-matrix-wrap {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border: 1px solid var(--fp-border, rgba(255,255,255,0.08));
	border-radius: 10px;
	background: var(--fp-bg-card);
	margin-bottom: 1rem;
}
.fp-fystester-coach-matrix {
	border-collapse: separate;
	border-spacing: 0;
	width: 100%;
	font-size: 0.88rem;
}
.fp-fystester-coach-matrix thead th {
	position: sticky;
	top: 0;
	background: rgba(20,20,20,0.98);
	color: var(--fp-text-muted);
	font-weight: 700;
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	padding: 0.7rem 0.8rem;
	text-align: left;
	border-bottom: 1px solid var(--fp-border, rgba(255,255,255,0.08));
	white-space: nowrap;
	z-index: 2;
}
.fp-fystester-coach-matrix th.fp-fystester-matrix-player-col {
	position: sticky;
	left: 0;
	background: rgba(20,20,20,0.98);
	z-index: 3;
	min-width: 120px;
}
.fp-fystester-coach-matrix tbody th.fp-fystester-matrix-player-col {
	background: var(--fp-bg-card);
	color: var(--fp-text);
	font-weight: 600;
	text-transform: none;
	letter-spacing: normal;
	font-size: 0.9rem;
	z-index: 1;
	white-space: normal;
	word-break: break-word;
	max-width: 180px;
}
@media (max-width: 480px) {
	.fp-fystester-coach-matrix th.fp-fystester-matrix-player-col {
		min-width: 100px;
	}
	.fp-fystester-coach-matrix tbody th.fp-fystester-matrix-player-col {
		max-width: 130px;
		padding: 0.5rem 0.55rem;
		font-size: 0.82rem;
	}
	.fp-fystester-coach-matrix thead th { padding: 0.55rem 0.55rem; }
	.fp-fystester-matrix-cell { padding: 0.55rem 0.55rem; }
	.fp-fystester-matrix-value { margin-right: 0.25rem; }
	.fp-fystester-matrix-trend { margin-right: 0.2rem; }
	.fp-fystester-matrix-dot { width: 16px; height: 16px; font-size: 0.65rem; }
}
.fp-fystester-coach-matrix .fp-fystester-matrix-test-name {
	display: block;
}
.fp-fystester-coach-matrix .fp-fystester-matrix-test-unit {
	display: block;
	font-size: 0.7rem;
	color: var(--fp-text-subtle);
	font-weight: 500;
	margin-top: 0.15rem;
	text-transform: lowercase;
	letter-spacing: 0;
}
.fp-fystester-matrix-cell {
	padding: 0.75rem 0.8rem;
	border-bottom: 1px solid rgba(255,255,255,0.04);
	white-space: nowrap;
	vertical-align: middle;
}
.fp-fystester-matrix-row:last-child .fp-fystester-matrix-cell,
.fp-fystester-matrix-row:last-child th { border-bottom: 0; }
.fp-fystester-matrix-value {
	display: inline-block;
	font-weight: 600;
	color: var(--fp-text);
	margin-right: 0.4rem;
}
.fp-fystester-matrix-value-empty {
	color: var(--fp-text-subtle);
	font-weight: 400;
}
.fp-fystester-matrix-dot {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	font-size: 0.7rem;
	font-weight: 800;
	color: var(--brand-bg, #0a0a0a);
	vertical-align: middle;
}
.fp-fystester-matrix-dot-ok    { background: #4ade80; }
.fp-fystester-matrix-dot-near  { background: #facc15; }
.fp-fystester-matrix-dot-miss  { background: #f87171; color: #fff; }
.fp-fystester-matrix-cell-ok   { background: rgba(74,222,128,0.06); }
.fp-fystester-matrix-cell-near { background: rgba(250,204,21,0.06); }
.fp-fystester-matrix-cell-miss { background: rgba(248,113,113,0.08); }
.fp-fystester-matrix-focus { box-shadow: inset 0 -2px 0 var(--fp-accent); }
.fp-fystester-matrix-trend {
	display: inline-block;
	font-size: 0.78rem;
	font-weight: 700;
	margin-right: 0.3rem;
	vertical-align: baseline;
	line-height: 1;
}
.fp-fystester-matrix-trend-up   { color: #4ade80; }
.fp-fystester-matrix-trend-down { color: #f87171; }
.fp-fystester-matrix-cell.is-stale .fp-fystester-matrix-value,
.fp-fystester-matrix-cell.is-stale .fp-fystester-matrix-trend {
	opacity: 0.5;
}
.fp-fystester-matrix-cell.is-stale .fp-fystester-matrix-dot {
	opacity: 0.7;
}
.fp-fystester-matrix-player-meta {
	display: block;
	font-size: 0.72rem;
	color: var(--fp-text-muted);
	font-weight: 400;
	margin-top: 0.15rem;
	letter-spacing: 0;
	text-transform: none;
}
.fp-fystester-matrix-player-meta-stale {
	color: #f87171;
}
.fp-fystester-matrix-player-meta-empty {
	color: var(--fp-text-subtle);
	font-style: italic;
}
/* Drill-down: expand-knapp + utfälld rad */
.fp-fystester-matrix-expand-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	margin-right: 0.45rem;
	padding: 0;
	background: transparent;
	border: 1px solid rgba(255,255,255,0.08);
	border-radius: 5px;
	color: var(--fp-text-muted);
	cursor: pointer;
	vertical-align: middle;
	transition: background-color 0.15s ease, color 0.15s ease;
}
.fp-fystester-matrix-expand-btn:hover,
.fp-fystester-matrix-expand-btn:focus-visible {
	background: rgba(255,255,255,0.08);
	color: var(--fp-text);
	outline: none;
}
.fp-fystester-matrix-expand-chevron {
	display: inline-block;
	font-size: 0.75rem;
	line-height: 1;
	transition: transform 0.18s ease;
}
.fp-fystester-matrix-expand-btn[aria-expanded="true"] .fp-fystester-matrix-expand-chevron {
	transform: rotate(90deg);
}
.fp-fystester-matrix-expand-btn[aria-expanded="true"] {
	background: rgba(255,255,255,0.08);
	color: var(--fp-text);
}
.fp-fystester-matrix-drilldown {
	background: rgba(0,0,0,0.18);
}
.fp-fystester-matrix-drilldown[hidden] { display: none; }
.fp-fystester-matrix-drilldown-cell {
	padding: 1rem 1rem 1.25rem;
	border-bottom: 1px solid rgba(255,255,255,0.08);
}
.fp-fystester-matrix-drilldown .fp-fystester-history-grid {
	margin: 0;
}
.fp-fystester-matrix-drilldown-empty {
	color: var(--fp-text-muted);
	font-size: 0.85rem;
	margin: 0;
	padding: 0.5rem 0;
	font-style: italic;
}
@media (max-width: 480px) {
	.fp-fystester-matrix-expand-btn { width: 20px; height: 20px; margin-right: 0.3rem; }
	.fp-fystester-matrix-drilldown-cell { padding: 0.75rem 0.6rem 1rem; }
}
.fp-fystester-coach-legend {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	font-size: 0.78rem;
	color: var(--fp-text-muted);
	margin: 0 0 1.5rem;
}
.fp-fystester-legend-item {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
}

.fp-fystester-log { margin-bottom: 2rem; }
.fp-fystester-form label { display: block; font-weight: 600; font-size: 0.9rem; margin-bottom: 0.35rem; color: var(--fp-text); }
.fp-fystester-form select,
.fp-fystester-form input[type="text"],
.fp-fystester-form input[type="date"] {
	width: 100%;
	max-width: 280px;
	padding: 0.5rem 0.75rem;
	border: 1px solid var(--fp-border);
	border-radius: 6px;
	background: var(--fp-bg-card);
	color: var(--fp-text);
	margin-bottom: 1rem;
}
.fp-fystester-form button { margin-top: 0.5rem; }
.fp-fystester-history-desc {
	margin: 0 0 1rem;
	color: var(--fp-text-muted);
	font-size: 0.9rem;
}
.fp-fystester-history-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0.85rem;
}
@media (min-width: 560px) {
	.fp-fystester-history-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}
@media (min-width: 1020px) {
	.fp-fystester-history-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}
.fp-fystester-history-card {
	position: relative;
	background: rgba(255,255,255,0.04);
	border: 1px solid var(--fp-border);
	border-radius: var(--fp-radius-sm);
	padding: 1rem 1.1rem 1.05rem;
	display: flex;
	flex-direction: column;
	gap: 0.55rem;
	color: var(--fp-accent);
}
.fp-fystester-history-card.is-pb {
	border-color: rgba(250, 204, 21, 0.45);
	background: linear-gradient(180deg, rgba(250, 204, 21, 0.08), rgba(255,255,255,0.04));
}
.fp-fystester-history-card-head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 0.5rem;
}
.fp-fystester-history-card-title {
	margin: 0;
	font-size: 0.92rem;
	font-weight: 700;
	color: var(--fp-text);
	letter-spacing: -0.005em;
	line-height: 1.25;
}
.fp-fystester-history-card-title .fp-fystester-unit {
	font-weight: 500;
	color: var(--fp-text-muted);
	font-size: 0.85em;
}
.fp-fystester-pb-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.25rem;
	background: rgba(250, 204, 21, 0.18);
	color: #facc15;
	font-size: 0.7rem;
	font-weight: 700;
	padding: 0.2rem 0.5rem;
	border-radius: 999px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	flex-shrink: 0;
}
.fp-fystester-history-hero {
	display: flex;
	align-items: baseline;
	gap: 0.6rem;
	flex-wrap: wrap;
}
.fp-fystester-history-value {
	font-size: 1.8rem;
	font-weight: 800;
	color: var(--fp-text);
	letter-spacing: -0.02em;
	line-height: 1.05;
}
.fp-fystester-history-value-unit {
	font-size: 0.95rem;
	font-weight: 500;
	color: var(--fp-text-muted);
	margin-left: 0.15rem;
}
.fp-fystester-history-date {
	font-size: 0.8rem;
	color: var(--fp-text-muted);
}
.fp-fystester-history-delta {
	margin: 0;
	font-size: 0.82rem;
	font-weight: 600;
	display: inline-flex;
	align-items: baseline;
	gap: 0.35rem;
}
.fp-fystester-history-delta-lbl {
	font-weight: 400;
	color: var(--fp-text-muted);
	font-size: 0.75rem;
}
.fp-fystester-delta-up { color: #4ade80; }
.fp-fystester-delta-down { color: #f87171; }
.fp-fystester-delta-flat { color: var(--fp-text-muted); }
.fp-fystester-history-delta-first {
	color: var(--fp-text-muted);
	font-weight: 400;
	font-size: 0.8rem;
}
.fp-fystester-spark {
	height: 40px;
	color: var(--fp-accent);
	opacity: 0.85;
}
.fp-fystester-history-card.is-pb .fp-fystester-spark { color: #facc15; }
.fp-fystester-spark-svg {
	width: 100%;
	height: 100%;
	display: block;
}
.fp-fystester-history-all {
	margin-top: 0.15rem;
	border-top: 1px solid rgba(255,255,255,0.06);
	padding-top: 0.5rem;
}
.fp-fystester-history-all-summary {
	cursor: pointer;
	font-size: 0.8rem;
	color: var(--fp-text-muted);
	list-style: none;
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
	padding: 0.1rem 0;
}
.fp-fystester-history-all-summary::-webkit-details-marker { display: none; }
.fp-fystester-history-all-summary::after {
	content: '▾';
	font-size: 0.7em;
	transition: transform 0.15s ease;
}
.fp-fystester-history-all[open] .fp-fystester-history-all-summary::after {
	transform: rotate(180deg);
}
.fp-fystester-history-all-summary:hover { color: var(--fp-text); }
.fp-fystester-history-all-list {
	list-style: none;
	margin: 0.55rem 0 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	max-height: 220px;
	overflow-y: auto;
}
.fp-fystester-history-all-item {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 0.75rem;
	padding: 0.3rem 0.45rem;
	border-radius: 6px;
	font-size: 0.85rem;
	background: rgba(255,255,255,0.025);
}
.fp-fystester-history-all-item.is-best {
	background: rgba(250, 204, 21, 0.1);
}
.fp-fystester-history-all-date {
	color: var(--fp-text-muted);
	font-variant-numeric: tabular-nums;
}
.fp-fystester-history-all-val {
	color: var(--fp-text);
	font-weight: 600;
	font-variant-numeric: tabular-nums;
}
.fp-fystester-history-all-best {
	color: #facc15;
	margin-left: 0.15rem;
}
.fp-fystester-empty { color: var(--fp-text-muted); margin: 1rem 0; }
.fp-fystester-empty-wrap { margin-top: 1rem; }
.fp-fystester-select-list {
	list-style: none;
	margin: 0.75rem 0 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.55rem;
}
.fp-fystester-select-item {
	background: rgba(255,255,255,0.03);
	border: 1px solid var(--fp-border);
	border-radius: 10px;
	padding: 0.55rem 0.75rem;
}
.fp-fystester-select-item-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.8rem;
}
.fp-fystester-select-label {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	cursor: pointer;
	flex: 1 1 auto;
	min-width: 0;
}
.fp-fystester-select-check {
	accent-color: var(--fp-accent);
}
.fp-fystester-select-name {
	color: var(--fp-text);
	font-weight: 600;
}
.fp-fystester-select-name .fp-fystester-unit {
	color: var(--fp-text-muted);
}
.fp-fystester-select-instruction-btn,
.fp-fystester-select-instruction-btn:visited {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 34px;
	padding: 0.3rem 0.65rem;
	border-radius: 8px;
	border: 1px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.5);
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.08);
	color: var(--fp-accent);
	font-size: 0.76rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	text-decoration: none;
	white-space: nowrap;
	flex: 0 0 auto;
}
.fp-fystester-select-instruction-btn:hover,
.fp-fystester-select-instruction-btn:focus {
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.16);
	border-color: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.8);
	color: var(--fp-accent) !important;
	text-decoration: underline;
}
.fp-fystester-select-actions {
	margin-top: 0.85rem;
	display: flex;
	align-items: center;
	gap: 0.85rem;
}
.fp-fystester-select-cancel,
.fp-fystester-select-cancel:visited {
	color: var(--fp-text-muted);
	text-decoration: none;
}
.fp-fystester-select-cancel:hover,
.fp-fystester-select-cancel:focus {
	color: var(--fp-accent) !important;
	text-decoration: underline;
}

/* ========== Betalningssida ========== */
.fp-betalning-roll-badge {
	display: inline-block;
	padding: 0.35rem 0.85rem;
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.15);
	border: 1px solid var(--fp-accent);
	border-radius: 999px;
	font-size: 0.8rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--fp-accent);
	margin: 0 0 1.25rem;
}
.fp-roll-switch {
	display: inline-flex;
	gap: 0.25rem;
	padding: 0.25rem;
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.35);
	border-radius: 999px;
	margin: 0 0 1.5rem;
}
.fp-roll-switch-btn {
	display: inline-block;
	padding: 0.45rem 1.1rem;
	border-radius: 999px;
	font-size: 0.8rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--fp-text-muted);
	text-decoration: none;
	transition: background 0.15s ease, color 0.15s ease;
}
.fp-roll-switch-btn:hover {
	color: var(--fp-text);
}
.fp-roll-switch-btn.is-active {
	background: var(--fp-accent);
	color: #111;
}
.fp-roll-switch-btn.is-active:hover {
	color: #111;
}
.fp-betalning-plans {
	margin-bottom: 1.5rem;
}
.fp-betalning-plans .fp-plan-card {
	min-height: auto;
}
.fp-betalning-plan-card .fp-plan-btn {
	margin-top: 0.75rem;
}
.fp-betalning-trial-note {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.55rem;
	width: fit-content;
	max-width: 100%;
	margin: -0.25rem auto 1.5rem;
	padding: 0.55rem 1.15rem;
	font-size: 1rem;
	font-weight: 700;
	color: var(--fp-accent);
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.1);
	border: 1px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.4);
	border-radius: 999px;
	text-align: center;
	box-shadow: 0 0 18px var(--fp-accent-glow);
}
.fp-betalning-trial-note::before {
	content: "✓";
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1.35rem;
	height: 1.35rem;
	border-radius: 50%;
	background: var(--fp-accent);
	color: var(--brand-bg, #0a0a0a);
	font-size: 0.85rem;
	font-weight: 900;
	flex-shrink: 0;
}
.fp-kom-igang-info-block {
	margin-top: 2.5rem;
	padding-top: 2rem;
	border-top: 1px solid rgba(255,255,255,0.08);
}
.fp-kom-igang-lead {
	font-size: 1.05rem;
	line-height: 1.65;
	color: var(--fp-text);
	margin: 0 0 2rem;
	max-width: 65ch;
}
.fp-kom-igang-info-section {
	margin-bottom: 2rem;
}
.fp-kom-igang-info-section:last-of-type {
	margin-bottom: 0;
}
.fp-kom-igang-info-section-title {
	font-size: 1.15rem;
	font-weight: 800;
	color: var(--fp-accent);
	text-transform: uppercase;
	letter-spacing: 0.02em;
	margin: 0 0 0.75rem;
}
.fp-kom-igang-info-body {
	font-size: 1rem;
	line-height: 1.65;
	color: var(--fp-text);
	margin: 0;
	max-width: 65ch;
}
.fp-kom-igang-info-section img,
.fp-kom-igang-info-section .fp-kom-igang-info-section-img {
	margin-top: 1rem;
	margin-bottom: 0.5rem;
	max-width: 100%;
	height: auto;
	border-radius: var(--fp-radius);
}
.fp-kom-igang-info-summary {
	font-size: 0.95rem;
	line-height: 1.6;
	color: var(--fp-text-muted);
	margin: 2rem 0 0;
	padding-top: 1.5rem;
	border-top: 1px solid rgba(255,255,255,0.08);
}
/* === Friskvård-sida — egen layout === */
.fp-friskvard-page .fp-kom-igang-main {
	padding-bottom: 4rem;
}
.fp-friskvard-block {
	margin-top: 1.25rem;
}
.fp-friskvard-hero {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 1rem;
	margin: 0 0 3rem;
	max-width: 62ch;
}
.fp-friskvard-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	background: var(--fp-accent);
	color: var(--fp-bg);
	font-weight: 800;
	font-size: 0.78rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	padding: 0.45rem 0.9rem;
	border-radius: 999px;
	box-shadow: 0 0 0 4px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.12);
}
.fp-friskvard-badge svg {
	width: 14px;
	height: 14px;
}
.fp-friskvard-title {
	font-size: clamp(2rem, 5.5vw, 3rem);
	font-weight: 900;
	line-height: 1.05;
	letter-spacing: -0.02em;
	margin: 0;
	color: var(--fp-text);
}
.fp-friskvard-title-accent {
	color: var(--fp-accent);
}
.fp-friskvard-lead {
	font-size: 1.1rem;
	line-height: 1.55;
	color: rgba(255, 255, 255, 0.78);
	margin: 0;
}
.fp-friskvard-lead strong {
	color: var(--fp-text);
	font-weight: 700;
	border-bottom: 2px solid var(--fp-accent);
	padding-bottom: 1px;
}

.fp-friskvard-section {
	margin: 0 0 2.5rem;
}
.fp-friskvard-eyebrow {
	font-size: 0.78rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	color: var(--fp-accent);
	margin: 0 0 1rem;
}

/* Steg-flöde */
.fp-friskvard-steps {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0.75rem;
	margin: 0;
	padding: 0;
	list-style: none;
}
.fp-friskvard-step {
	background: var(--fp-bg-card);
	border: 1px solid rgba(255, 255, 255, 0.06);
	border-radius: var(--fp-radius);
	padding: 1.5rem 1.25rem 1.25rem;
	display: flex;
	flex-direction: column;
	gap: 0.65rem;
	position: relative;
	transition: border-color 0.2s ease, transform 0.2s ease;
}
.fp-friskvard-step:hover {
	border-color: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.25);
}
.fp-friskvard-step__num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.4rem;
	height: 2.4rem;
	background: var(--fp-accent);
	color: var(--fp-bg);
	border-radius: 999px;
	font-weight: 900;
	font-size: 1.15rem;
	box-shadow: 0 0 0 5px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.1);
	margin-bottom: 0.25rem;
}
.fp-friskvard-step__title {
	font-size: 1rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin: 0;
	color: var(--fp-text);
}
.fp-friskvard-step__desc {
	margin: 0;
	color: rgba(255, 255, 255, 0.7);
	font-size: 0.94rem;
	line-height: 1.5;
}

/* Portaler */
.fp-friskvard-portals {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 0.75rem;
}
.fp-friskvard-portal {
	background: #000;
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: var(--fp-radius);
	padding: 2.25rem 1.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 140px;
	transition: border-color 0.2s ease, transform 0.2s ease;
}
.fp-friskvard-portal:hover {
	border-color: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.4);
	transform: translateY(-1px);
}
.fp-friskvard-portal img {
	display: block;
	max-height: 56px;
	max-width: 70%;
	width: auto;
	margin: 0;
	border-radius: 0;
}

/* Kvitto-block */
.fp-friskvard-receipt {
	display: flex;
	gap: 1rem;
	align-items: flex-start;
	background: var(--fp-bg-card);
	border: 1px solid rgba(255, 255, 255, 0.06);
	border-radius: var(--fp-radius);
	padding: 1.5rem;
}
.fp-friskvard-receipt__icon {
	flex: 0 0 28px;
	width: 28px;
	height: 28px;
	color: var(--fp-accent);
	margin-top: 0.1rem;
}
.fp-friskvard-receipt p {
	margin: 0;
	color: rgba(255, 255, 255, 0.78);
	line-height: 1.6;
	font-size: 1rem;
}

/* CTA-låda */
.fp-friskvard-cta-wrap {
	text-align: center;
	padding: 2.5rem 1.5rem;
	background: linear-gradient(160deg, rgba(var(--brand-accent-rgb, 212, 212, 30), 0.08) 0%, rgba(var(--brand-accent-rgb, 212, 212, 30), 0.02) 100%);
	border: 1px solid var(--fp-border);
	border-radius: var(--fp-radius);
	margin-top: 2.5rem;
}
.fp-friskvard-cta-tag {
	font-size: 0.78rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	color: rgba(255, 255, 255, 0.55);
	margin: 0 0 0.9rem;
}
.fp-friskvard-cta-btn {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	background: var(--fp-accent);
	color: var(--fp-bg);
	font-size: 1.05rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	padding: 1rem 2rem;
	border-radius: var(--fp-radius);
	text-decoration: none;
	transition: transform 0.15s ease, box-shadow 0.15s ease;
	box-shadow: 0 8px 24px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.22);
}
.fp-friskvard-cta-btn:hover,
.fp-friskvard-cta-btn:focus-visible {
	transform: translateY(-2px);
	box-shadow: 0 12px 32px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.38);
	color: var(--fp-bg);
	outline: none;
}
.fp-friskvard-cta-btn svg {
	width: 20px;
	height: 20px;
}
/* Mobil */
@media (max-width: 720px) {
	.fp-friskvard-steps {
		grid-template-columns: 1fr;
	}
	.fp-friskvard-portals {
		grid-template-columns: 1fr;
	}
	.fp-friskvard-hero {
		margin-bottom: 2rem;
	}
	.fp-friskvard-cta-wrap {
		padding: 2rem 1.25rem;
	}
	.fp-friskvard-receipt {
		padding: 1.25rem;
	}
}
.fp-kom-igang-plan-title {
	text-align: center;
}
.fp-kom-igang-main .fp-betalning-roll-badge {
	display: block;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}
.fp-betalning-main {
	max-width: 900px;
	margin: 0 auto;
	padding-top: 0.5rem;
}
.fp-betalning-title {
	font-size: clamp(1.75rem, 4vw, 2.25rem);
	font-weight: 900;
	color: var(--fp-accent);
	margin: 0 0 1.5rem;
	text-transform: uppercase;
	letter-spacing: -0.02em;
}
.fp-betalning-layout {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2rem;
	margin-bottom: 2rem;
}
@media (min-width: 768px) {
	.fp-betalning-layout {
		grid-template-columns: 320px 1fr;
		align-items: start;
	}
}
.fp-betalning-order-title {
	font-size: 1rem;
	font-weight: 700;
	color: var(--fp-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.06em;
	margin: 0 0 0.75rem;
}
.fp-betalning-order-card {
	background: var(--fp-bg-card);
	border: 1px solid var(--fp-border);
	border-radius: var(--fp-radius);
	padding: 1.5rem;
}
.fp-betalning-order-label {
	font-size: 1.1rem;
	font-weight: 800;
	color: var(--fp-accent);
	text-transform: uppercase;
	margin: 0 0 0.35rem;
}
.fp-betalning-order-price {
	font-size: 1.75rem;
	font-weight: 900;
	color: var(--fp-text);
	margin: 0;
	line-height: 1;
}
.fp-betalning-order-period {
	font-size: 0.9rem;
	color: var(--fp-text-muted);
	margin: 0 0 0.75rem;
}
.fp-betalning-order-trial {
	font-size: 0.8rem;
	color: var(--fp-accent);
	margin: 0;
}
.fp-betalning-methods-title {
	font-size: 1.15rem;
	font-weight: 700;
	color: var(--fp-text);
	margin: 0 0 0.5rem;
	text-transform: none;
	letter-spacing: -0.02em;
}
.fp-betalning-methods-lead {
	font-size: 0.9rem;
	color: var(--fp-text-muted);
	line-height: 1.5;
	margin: 0 0 1.25rem;
	max-width: 36rem;
}
.fp-betalning-pay-panel {
	background: var(--fp-bg-card);
	border: 1px solid var(--fp-border);
	border-radius: var(--fp-radius);
	padding: 1.25rem 1.35rem;
	margin-bottom: 0.25rem;
}
.fp-betalning-pay-panel--wc {
	padding: 0;
	overflow: hidden;
}
.fp-betalning-profile-form.fp-betalning-pay-panel {
	margin-bottom: 0;
}
.fp-betalning-profile-form.fp-betalning-pay-panel .fp-betalning-profile-grid {
	margin-bottom: 0;
}
.fp-betalning-stripe-cta {
	margin-top: 1.35rem;
	padding-top: 1.25rem;
	border-top: 1px solid var(--fp-border);
}
.fp-betalning-stripe-note {
	font-size: 0.8rem;
	color: var(--fp-text-muted);
	line-height: 1.45;
	margin: 0.65rem 0 0;
	max-width: 32rem;
}
.fp-betalning-terms {
	margin-top: 1.25rem;
	padding-top: 1.1rem;
	border-top: 1px solid var(--fp-border);
}
.fp-betalning-terms-label {
	display: flex;
	align-items: flex-start;
	gap: 0.7rem;
	font-size: 0.85rem;
	line-height: 1.5;
	color: var(--fp-text-muted);
	cursor: pointer;
}
.fp-betalning-terms-label input[type="checkbox"] {
	flex-shrink: 0;
	width: 18px;
	height: 18px;
	margin-top: 0.18rem;
	accent-color: var(--fp-accent);
	cursor: pointer;
}
.fp-betalning-terms-label a {
	color: var(--fp-accent);
	text-decoration: underline;
}
.fp-betalning-wc-terms-note {
	font-size: 0.85rem;
	color: var(--fp-text-muted);
	margin: 0 0 1rem;
	line-height: 1.5;
}
.fp-betalning-wc-terms-note a {
	color: var(--fp-accent);
	text-decoration: underline;
}
.fp-betalning-pay-list {
	list-style: none;
	margin: 0;
	padding: 0;
}
.fp-betalning-pay-item {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.85rem 1rem;
	padding: 1rem 1.35rem;
	border-bottom: 1px solid var(--fp-border);
}
.fp-betalning-pay-item:last-child {
	border-bottom: none;
}
.fp-betalning-pay-item-text {
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
	min-width: 0;
	flex: 1 1 12rem;
}
.fp-betalning-pay-item-label {
	font-size: 0.95rem;
	font-weight: 700;
	color: var(--fp-text);
	letter-spacing: -0.01em;
}
.fp-betalning-pay-item-desc {
	font-size: 0.8rem;
	color: var(--fp-text-muted);
	line-height: 1.35;
}
.fp-betalning-btn-inline {
	width: auto;
	min-width: 6.5rem;
	flex-shrink: 0;
	align-self: center;
	text-align: center;
}
@media (max-width: 480px) {
	.fp-betalning-pay-item {
		flex-direction: column;
		align-items: stretch;
	}
	.fp-betalning-btn-inline {
		width: 100%;
		min-width: 0;
	}
}
.fp-betalning-profile-form {
	margin-bottom: 0.5rem;
}
.fp-betalning-profile-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0.75rem;
	margin-bottom: 1rem;
}
@media (min-width: 768px) {
	.fp-betalning-profile-grid {
		grid-template-columns: 1fr 1fr;
	}
	.fp-betalning-profile-grid .fp-betalning-profile-field--full {
		grid-column: 1 / -1;
	}
}
.fp-betalning-profile-grid p {
	margin: 0;
}
.fp-betalning-profile-grid label {
	display: block;
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--fp-text-muted);
	margin-bottom: 0.35rem;
}
.fp-betalning-profile-grid input {
	width: 100%;
	padding: 0.65rem 0.75rem;
	border: 1px solid var(--fp-border);
	border-radius: var(--fp-radius-sm);
	background: rgba(255, 255, 255, 0.04);
	color: var(--fp-text);
}
.fp-betalning-profile-grid input:focus {
	outline: none;
	border-color: var(--fp-accent);
	box-shadow: 0 0 0 2px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.2);
}
.fp-betalning-method {
	background: var(--fp-bg-card);
	border: 1px solid var(--fp-border);
	border-radius: var(--fp-radius);
	padding: 1.5rem;
	margin-bottom: 1rem;
	transition: border-color 0.2s ease;
}
.fp-betalning-method:hover {
	border-color: var(--fp-accent);
}
.fp-betalning-method-icon {
	font-size: 1.75rem;
	margin-bottom: 0.5rem;
}
.fp-betalning-method-name {
	font-size: 1.1rem;
	font-weight: 800;
	color: var(--fp-accent);
	text-transform: uppercase;
	margin: 0 0 0.5rem;
}
.fp-betalning-method-desc {
	font-size: 0.9rem;
	color: var(--fp-text-muted);
	line-height: 1.45;
	margin: 0 0 1rem;
}
.fp-betalning-btn {
	width: 100%;
	text-align: center;
}
.fp-betalning-wc-admin-note {
	font-size: 0.85rem;
	color: #fbbf24;
	margin: 0 0 1rem;
	padding: 0.75rem 1rem;
	background: rgba(251, 191, 36, 0.12);
	border: 1px solid rgba(251, 191, 36, 0.35);
	border-radius: var(--fp-radius-sm);
}
.fp-betalning-secure {
	text-align: center;
	font-size: 0.8rem;
	color: var(--fp-text-muted);
	margin: 0;
}

/* FAQ */
.fp-app-faq {
	padding: 3rem 1.25rem 3.5rem;
	max-width: 720px;
	margin: 0 auto;
}
.fp-app-faq .fp-app-team-title {
	text-align: center;
	margin-bottom: 2rem;
}
.fp-app-faq-list {
	display: flex;
	flex-direction: column;
	gap: 0;
}
.fp-app-faq-item {
	border-bottom: 1px solid var(--fp-border);
	transition: background-color 0.2s ease;
}
.fp-app-faq-item:first-child {
	border-top: 1px solid var(--fp-border);
}
.fp-app-faq-q {
	font-size: 1rem;
	font-weight: 700;
	color: var(--fp-text);
	padding: 1rem 0;
	cursor: pointer;
	list-style: none;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
}
.fp-app-faq-q::-webkit-details-marker {
	display: none;
}
.fp-app-faq-q::after {
	content: '+';
	font-size: 1.25rem;
	font-weight: 600;
	color: var(--fp-accent);
	flex-shrink: 0;
}
.fp-app-faq-item[open] .fp-app-faq-q::after {
	content: '−';
}
.fp-app-faq-q:hover {
	color: var(--fp-accent);
}
.fp-app-faq-a {
	padding: 0 0 1rem;
}
.fp-app-faq-a p {
	font-size: 0.95rem;
	line-height: 1.6;
	color: var(--fp-text-muted);
	margin: 0;
}

/* Footer */
.fp-app-footer {
	text-align: center;
	padding: 1.5rem 1.25rem;
	padding-bottom: max(1.5rem, env(safe-area-inset-bottom, 0px) + 1.5rem);
	border-top: 1px solid rgba(255,255,255,0.06);
}

.fp-app-footer-text {
	font-size: 0.8rem;
	color: var(--fp-text-muted);
	margin: 0;
}

/* ========== HEMSDIA: Montserrat + centrerad hero (påverkar INTE appen) ========== */
body.fyscoach-app-landing .fp-landing-page {
	font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
body.fyscoach-app-landing .fp-landing-page .fp-app-hero {
	text-align: center;
}
body.fyscoach-app-landing .fp-landing-page .fp-app-role-section {
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
}

/* Dölj Astra header/footer så bara vår app-header/footer syns */
body.fyscoach-app-landing .site-header,
body.fyscoach-app-landing .site-footer,
body.fyscoach-app-landing .ast-mobile-popup-drawer {
	display: none !important;
}

body.fyscoach-app-landing {
	--fp-bg: var(--brand-bg, #0a0a0a);
	background: var(--fp-bg);
}

/* Mörk bakgrund även om body-klass saknas (t.ex. cache/theme-problem) */
body:has(.fp-app-wrap) {
	background: var(--brand-bg, #0a0a0a);
}

/* Content-area full bredd så vår centrerade main får plats (ingen padding-ändring) */
body.fyscoach-app-landing #content,
body.fyscoach-app-landing .site-content,
body.fyscoach-app-landing #primary,
body.fyscoach-app-landing .content-area {
	width: 100%;
	max-width: none;
}
body.fyscoach-app-landing #content,
body.fyscoach-app-landing .site-content {
	padding: 0;
}

/* App-specifika optimeringar */
body.fyscoach-app-landing {
	overflow-x: clip;
	-webkit-overflow-scrolling: touch;
	touch-action: pan-y; /* Endast vertikal scroll */
}

/*
 * Startsidan: .fp-app-wrap har overflow-x:hidden vilket annars gör att position:sticky
 * på headern inte följer viewport. clip begränsar horisontell spill utan samma bieffekt.
 */
body.fyscoach-app-landing .fp-app-wrap.fp-landing-page {
	overflow-x: clip;
}

/* Startsida: header följer scroll + kompakt läge (klass sätts i template-app-landing.php) */
body.fyscoach-app-landing .fp-landing-page .fp-app-header {
	position: sticky;
	top: 0;
	z-index: 50;
	transition:
		padding 0.22s ease,
		box-shadow 0.22s ease,
		background-color 0.22s ease,
		border-color 0.22s ease;
}

body.fyscoach-app-landing .fp-landing-page .fp-app-header.fp-landing-header--compact {
	padding-top: max(0.5rem, env(safe-area-inset-top, 0px) + 0.5rem);
	padding-bottom: 0.5rem;
	background: rgba(var(--brand-bg-rgb, 10, 10, 10), 0.88);
	border-bottom-color: rgba(255, 255, 255, 0.08);
	box-shadow: 0 8px 28px rgba(0, 0, 0, 0.55);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
}

body.fyscoach-app-landing .fp-landing-page .fp-app-header.fp-landing-header--compact .fp-app-logo-img {
	height: 38px;
	max-width: min(320px, 72vw);
}

body.fyscoach-app-landing .fp-landing-page .fp-app-header.fp-landing-header--compact .fp-app-nav-link,
body.fyscoach-app-landing .fp-landing-page .fp-app-header.fp-landing-header--compact .fp-app-btn-login {
	font-size: 0.72rem;
	padding: 0.38rem 0.55rem;
}

body.fyscoach-app-landing .fp-landing-page .fp-app-header.fp-landing-header--compact .fp-app-logo,
body.fyscoach-app-landing .fp-landing-page .fp-app-header.fp-landing-header--compact .fp-app-nav {
	transform: translateY(0);
}

@media (min-width: 1024px) {
	body.fyscoach-app-landing .fp-landing-page .fp-app-header.fp-landing-header--compact {
		padding-top: max(0.55rem, env(safe-area-inset-top, 0px) + 0.55rem);
		padding-bottom: 0.55rem;
		padding-left: 2rem;
		padding-right: 2rem;
	}

	body.fyscoach-app-landing .fp-landing-page .fp-app-header.fp-landing-header--compact .fp-app-logo-img {
		height: 44px;
		max-width: min(380px, 45vw);
	}

	body.fyscoach-app-landing .fp-landing-page .fp-app-header.fp-landing-header--compact .fp-app-nav-link,
	body.fyscoach-app-landing .fp-landing-page .fp-app-header.fp-landing-header--compact .fp-app-btn-login {
		font-size: 0.78rem;
		padding: 0.42rem 0.7rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	body.fyscoach-app-landing .fp-landing-page .fp-app-header {
		transition: none;
	}
}

/* Förhindra text selection på knappar (app-känsla) */
.fp-app-btn,
.fp-app-role-btn,
.fp-app-nav-link,
.fp-app-btn-login {
	-webkit-user-select: none;
	user-select: none;
	-webkit-touch-callout: none;
}

/* Smooth scroll för anchor links */
html {
	scroll-behavior: smooth;
}

/* ========== Mobil (< 640px) – header, hero, role-toggle ========== */
@media (max-width: 639px) {
	.fp-landing-page .fp-app-main {
		padding-left: 0;
		padding-right: 0;
		max-width: none;
	}
	/* Hero / erbjudande / rollväljare finns bara på startsidan – begränsa så övriga app-vyer inte påverkas. */
	.fp-landing-page .fp-app-hero {
		border-radius: 0;
	}
	.fp-landing-page .fp-app-hero-inner {
		padding: 2rem 1.25rem;
		max-width: none;
	}
	.fp-landing-page .fp-app-offer {
		padding-left: 1.25rem;
		padding-right: 1.25rem;
	}
	.fp-landing-page .fp-app-role-section--below-hero,
	.fp-landing-page .fp-app-team,
	.fp-landing-page .fp-app-you-can {
		padding-left: 1.25rem;
		padding-right: 1.25rem;
	}
	.fp-landing-page .fp-app-header-inner {
		flex-wrap: wrap;
		justify-content: center;
		gap: 0.75rem;
	}
	.fp-landing-page .fp-app-logo {
		flex: 0 0 auto;
		min-width: 0;
	}
	.fp-landing-page .fp-app-logo-img {
		height: 42px;
		max-width: min(380px, 92vw);
	}
	.fp-landing-page .fp-app-nav {
		flex: 1 1 100%;
		justify-content: center;
		gap: 0.5rem;
		order: 3;
	}
	.fp-landing-page .fp-app-nav-link,
	.fp-landing-page .fp-app-btn-login {
		font-size: 0.7rem;
		padding: 0.4rem 0.5rem;
	}
	.fp-landing-page .fp-app-role-section {
		width: 100%;
	}
	.fp-landing-page .fp-app-role-section--below-hero {
		margin-bottom: 2.5rem;
	}
	.fp-landing-page .fp-app-role-toggle {
		flex-direction: column;
		width: 100%;
		max-width: 100%;
		padding: 0.6rem;
		gap: 0.5rem;
		align-items: stretch;
		overflow: hidden;
		border-radius: 30px;
	}
	.fp-landing-page .fp-app-role-btn {
		width: 100%;
		max-width: 100%;
		flex: none;
		font-size: 0.85rem;
		padding: 0.75rem 1rem;
		text-align: center;
		border-radius: var(--fp-radius-sm);
		box-sizing: border-box;
	}
	.fp-landing-page .fp-app-role-or {
		font-size: 0.7rem;
		text-align: center;
		padding: 0.1rem 0;
	}

	/* Övriga app-vyer: logga vänster, nav höger (radbryt bara vid många länkar – inte centrerad fullbredds-rad som på startsidan). */
	.fp-app-wrap:not(.fp-landing-page) .fp-app-header-inner {
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: center;
		gap: 0.5rem;
		row-gap: 0.35rem;
	}
	.fp-app-wrap:not(.fp-landing-page) .fp-app-logo {
		flex: 1 1 auto;
		min-width: 0;
	}
	.fp-app-wrap:not(.fp-landing-page) .fp-app-logo-img {
		height: 40px;
		max-width: min(200px, 48vw);
		object-position: left center;
	}
	.fp-app-wrap:not(.fp-landing-page) .fp-app-nav {
		flex: 0 1 auto;
		max-width: 100%;
		justify-content: flex-end;
		flex-wrap: wrap;
		gap: 0.35rem;
	}
	.fp-app-wrap:not(.fp-landing-page) .fp-app-nav-link,
	.fp-app-wrap:not(.fp-landing-page) .fp-app-btn-login {
		font-size: 0.65rem;
		padding: 0.35rem 0.45rem;
	}
	.fp-app-wrap:not(.fp-landing-page) .fp-app-btn-login {
		white-space: nowrap;
	}
}

/* Tablet/desktop: logga + nav visuellt lite lågt i headern – flytta upp i takt (mobil oförändrad) */
@media (min-width: 640px) {
	.fp-app-logo,
	.fp-app-nav {
		transform: translateY(-6px);
	}
}

/* Safe area support för iPhone notch */
@supports (padding: max(0px)) {
	.fp-app-header {
		padding-left: max(1.25rem, env(safe-area-inset-left));
		padding-right: max(1.25rem, env(safe-area-inset-right));
	}
	.fp-app-main {
		padding-left: max(1.25rem, env(safe-area-inset-left));
		padding-right: max(1.25rem, env(safe-area-inset-right));
	}
	@media (max-width: 639px) {
		.fp-landing-page .fp-app-main {
			padding-left: max(0px, env(safe-area-inset-left));
			padding-right: max(0px, env(safe-area-inset-right));
		}
		.fp-app-hero-inner {
			padding-left: max(1.25rem, env(safe-area-inset-left) + 0.5rem);
			padding-right: max(1.25rem, env(safe-area-inset-right) + 0.5rem);
		}
		.fp-app-offer {
			padding-left: max(1.25rem, env(safe-area-inset-left));
			padding-right: max(1.25rem, env(safe-area-inset-right));
		}
		.fp-app-role-section--below-hero,
		.fp-app-team,
		.fp-app-you-can {
			padding-left: max(1.25rem, env(safe-area-inset-left));
			padding-right: max(1.25rem, env(safe-area-inset-right));
		}
	}
}

/* ========== Desktop / hemsida (1024px+) ========== */
@media (min-width: 1024px) {
	/* Huvudcontainer centrerad på sidan */
	.fp-app-main {
		max-width: 1280px;
		margin-left: auto;
		margin-right: auto;
		padding-left: 2rem;
		padding-right: 2rem;
	}

	.fp-app-view[data-view] {
		width: 100%;
	}

	.fp-app-header-inner {
		max-width: 1280px;
		margin-left: auto;
		margin-right: auto;
		padding: 0 0.5rem;
	}

	.fp-app-header {
		padding-left: 2rem;
		padding-right: 2rem;
		padding-top: max(1.25rem, env(safe-area-inset-top, 0px) + 1.25rem);
	}

	.fp-app-logo-img {
		height: 54px;
		max-width: min(440px, 50vw);
	}

	.fp-app-nav {
		gap: 1.25rem;
		flex-wrap: nowrap;
	}

	.fp-app-nav-link {
		font-size: 0.85rem;
		padding: 0.5rem 0.85rem;
	}

	.fp-app-btn-login {
		font-size: 0.85rem;
		padding: 0.6rem 1.25rem;
	}

	.fp-app-main {
		max-width: 1280px;
		padding: 2.5rem 2rem 4rem;
		padding-bottom: max(4rem, env(safe-area-inset-bottom, 0px) + 4rem);
	}

	/* Min sida tränarvy: innehåll högt upp, kompakt */
	.fp-min-sida .fp-min-sida-tranare-view.fp-app-main {
		padding-top: 1rem;
		padding-bottom: 3rem;
	}

	/* Hero – centrerad, mer luft och större typografi på desktop */
	.fp-app-hero {
		margin-bottom: 4rem;
		min-height: 520px;
		padding-top: 0.5rem;
		text-align: center;
		width: 100%;
	}
	.fp-app-hero-inner {
		padding: 3rem 2rem;
	}

	.fp-app-hero-title {
		font-size: clamp(2rem, 4vw, 2.75rem);
		margin-bottom: 1rem;
	}

	.fp-app-hero-tagline {
		font-size: 1.1rem;
		margin-bottom: 3rem;
	}

	.fp-app-role-section {
		margin-top: 2.5rem;
		text-align: center;
		display: flex;
		flex-direction: column;
		align-items: center;
		width: 100%;
	}

	.fp-app-role-section--below-hero {
		margin-bottom: 2rem;
	}

	.fp-app-role-question {
		font-size: clamp(1.75rem, 2.5vw, 2.5rem);
		margin-bottom: 1.25rem;
	}

	/* Kort – centrerat, begränsad maxbredd på desktop */
	.fp-app-offer {
		margin-bottom: 4rem;
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.fp-app-cards {
		grid-template-columns: repeat(2, 1fr);
		gap: 2rem;
		max-width: 900px;
		margin: 0 auto;
		width: 100%;
	}

	.fp-app-card {
		padding: 2rem;
		max-width: 440px;
		justify-self: center;
	}

	.fp-app-card-title {
		font-size: 1.35rem;
	}

	.fp-app-card-amount {
		font-size: 1.6rem;
	}

	.fp-app-card-features {
		font-size: 0.82rem;
	}

	.fp-app-btn {
		max-width: 320px;
		margin-left: auto;
		margin-right: auto;
		display: block;
	}

	/* Du vet väl – desktop */
	.fp-app-you-can {
		margin-bottom: 4rem;
		max-width: 900px;
		margin-left: auto;
		margin-right: auto;
		width: 100%;
	}
	.fp-app-you-can-title {
		margin-bottom: 1.5rem;
	}
	.fp-app-you-can-cards {
		gap: 1.5rem;
	}
	.fp-app-you-can-card {
		padding: 1.5rem;
	}
	.fp-app-you-can-text {
		font-size: 1rem;
	}

	/* Team-sektion på desktop – centrerad */
	.fp-app-team {
		margin-bottom: 4rem;
		max-width: 900px;
		margin-left: auto;
		margin-right: auto;
		width: 100%;
		text-align: center;
	}

	.fp-app-team .fp-app-team-title {
		text-align: center;
	}

	.fp-app-founders {
		margin-left: auto;
		margin-right: auto;
	}

	.fp-app-founders-desc {
		margin-left: auto;
		margin-right: auto;
	}

	.fp-app-team-grid {
		justify-content: center;
		margin: 0 auto;
	}

	.fp-app-team-title {
		font-size: clamp(2.25rem, 3.5vw, 3.25rem);
		margin-bottom: 2.5rem;
	}

	.fp-app-founders {
		padding: 2.5rem;
		margin-bottom: 2rem;
	}

	.fp-app-founders-names {
		font-size: clamp(2.25rem, 3.5vw, 3.25rem);
	}

	.fp-app-founders-desc {
		font-size: 1rem;
		max-width: 640px;
	}

	.fp-app-team-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 1.25rem;
	}

	.fp-app-team-card {
		padding: 1.5rem;
		max-width: 420px;
		justify-self: center;
	}

	.fp-app-team-card-photo {
		width: 120px;
		min-width: 120px;
		border-radius: var(--fp-radius-sm) 0 0 var(--fp-radius-sm);
	}

	.fp-app-team-card-photo-placeholder {
		width: 96px;
		height: 96px;
		min-width: 96px;
	}

	.fp-app-team-card-name {
		font-size: 1.6rem;
	}

	/* Coaching-vy på desktop */
	.fp-coaching-hero {
		margin-bottom: 3.5rem;
		padding-top: 1rem;
	}

	.fp-coaching-eyebrow {
		font-size: 0.95rem;
		margin-bottom: 1.5rem;
	}

	.fp-coaching-line {
		width: 3rem;
	}

	.fp-coaching-title {
		font-size: clamp(2.75rem, 4.5vw, 4rem);
		margin-bottom: 1.25rem;
	}

	.fp-coaching-desc {
		font-size: 0.95rem;
		max-width: 640px;
		margin-bottom: 2.5rem;
	}

	.fp-coaching-cta .fp-app-btn {
		max-width: 380px;
		margin: 0 auto;
	}

	.fp-coaching-needs {
		margin-top: 3rem;
		max-width: 900px;
		margin-left: auto;
		margin-right: auto;
		width: 100%;
		text-align: center;
	}

	.fp-coaching-needs-title,
	.fp-coaching-needs-sub {
		text-align: center;
	}

	.fp-coaching-needs-title {
		font-size: clamp(1.75rem, 2.5vw, 2.75rem);
		margin-bottom: 0.75rem;
	}

	.fp-coaching-needs-sub {
		font-size: 0.85rem;
		margin-bottom: 1.5rem;
	}

	.fp-coaching-cards {
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: center;
		gap: 1.25rem;
	}

	.fp-coaching-need-card {
		flex: 1 1 260px;
		max-width: 320px;
		padding: 2rem;
	}

	.fp-coaching-need-abbr {
		font-size: 2.5rem;
	}

	.fp-coaching-need-name {
		font-size: 1.2rem;
	}

	/* Footer desktop – centrerad */
	.fp-app-footer {
		padding: 2rem;
		width: 100%;
		text-align: center;
	}

	.fp-app-footer-text {
		font-size: 0.85rem;
		margin: 0 auto;
	}
}

/* ========== Stor desktop (1280px+) ========== */
@media (min-width: 1280px) {
	.fp-app-header-inner {
		max-width: 1400px;
	}

	.fp-app-main {
		max-width: 1400px;
		padding-left: 3rem;
		padding-right: 3rem;
	}

	.fp-app-hero-title {
		font-size: 3rem;
	}

	.fp-app-cards {
		max-width: 1000px;
	}

	.fp-app-team,
	.fp-coaching-needs {
		max-width: 1000px;
	}
}

/* ========== Min sida (inloggad dashboard) ========== */
.fp-min-sida .fp-app-main {
	padding-top: 2rem;
}
/* Tränarvy: tydlig panel, luftigt och modernt */
.fp-min-sida-tranare-view.fp-app-main {
	padding-top: 1rem;
	padding-bottom: max(2rem, env(safe-area-inset-bottom));
	min-height: 0;
	align-self: flex-start;
	flex: 0 0 auto;
}
/* Dashboard = hero + Nästa pass + Närvaro – en tydlig, modern panel */
.fp-min-sida-tranare-dashboard {
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.04) 0%, transparent 100%);
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 1.25rem;
	padding: 1.5rem 1.25rem 1.5rem;
	margin-bottom: 1.25rem;
	box-shadow: 0 4px 24px rgba(0, 0, 0, 0.25);
}
.fp-min-sida-tranare-dashboard .fp-min-sida-hero {
	margin-bottom: 1rem;
	padding-bottom: 0.75rem;
	border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}
.fp-min-sida-tranare-dashboard .fp-min-sida-title {
	font-size: clamp(1.35rem, 3vw, 1.6rem);
	font-weight: 800;
	color: #fff;
	margin: 0 0 0.2rem;
	letter-spacing: -0.02em;
}
.fp-min-sida-tranare-dashboard .fp-min-sida-roll {
	font-size: 0.8125rem;
	color: var(--fp-text-muted);
	margin: 0;
	font-weight: 500;
}
.fp-min-sida-tranare-dashboard .fp-min-sida-tranare-main {
	margin-bottom: 0;
	padding: 0;
	background: none;
	border: none;
	border-radius: 0;
	box-shadow: none;
}
.fp-min-sida-tranare-dashboard .fp-min-sida-admin-title {
	font-size: 0.75rem;
	font-weight: 800;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--fp-accent);
	margin: 0 0 0.75rem;
}
.fp-min-sida-tranare-dashboard .fp-min-sida-admin-card {
	background: rgba(0, 0, 0, 0.35);
	border: 1px solid rgba(255, 255, 255, 0.15);
	color: #fff;
}
.fp-min-sida-tranare-dashboard .fp-min-sida-admin-card:hover {
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.15);
	border-color: var(--fp-accent);
}
.fp-min-sida-tranare-dashboard .fp-min-sida-admin-card-label {
	color: #fff;
	font-weight: 700;
}
.fp-min-sida-tranare-dashboard .fp-min-sida-admin-card-icon {
	color: rgba(255, 255, 255, 0.6);
}
/* Pass i schemat + Pass genomförda av spelare – inuti samma panel, lika tydlig som Tränarverktyg */
.fp-min-sida-pass-section-in-dashboard {
	margin-top: 1rem;
	padding-top: 1rem;
	border-top: 1px solid rgba(255, 255, 255, 0.1);
	background: none;
	border-radius: 0;
	box-shadow: none;
	margin-bottom: 0;
	padding-left: 0;
	padding-right: 0;
}
.fp-min-sida-tranare-dashboard .fp-min-sida-pass-section-coach .fp-min-sida-pass-coach-header .fp-min-sida-section-title {
	font-size: 0.75rem;
	font-weight: 800;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--fp-accent);
	margin: 0;
}
.fp-min-sida-tranare-dashboard .fp-min-sida-pass-intro {
	color: rgba(255, 255, 255, 0.85);
	font-size: 0.9rem;
	margin-bottom: 0.75rem;
}
.fp-min-sida-tranare-dashboard .fp-min-sida-pass-chips {
	margin-bottom: 1rem;
}
.fp-min-sida-tranare-dashboard .fp-min-sida-pass-chip {
	background: rgba(0, 0, 0, 0.4);
	border: 1px solid rgba(255, 255, 255, 0.15);
	color: #fff;
}
.fp-min-sida-tranare-dashboard .fp-min-sida-pass-players-title {
	font-size: 0.75rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--fp-accent);
	margin: 0 0 0.5rem;
}
.fp-min-sida-tranare-dashboard .fp-min-sida-pass-player-card-link {
	background: rgba(0, 0, 0, 0.35);
	border: 1px solid rgba(255, 255, 255, 0.12);
	color: #fff;
}
.fp-min-sida-tranare-dashboard .fp-min-sida-pass-player-card-link:hover {
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.12);
	border-color: var(--fp-accent);
}
.fp-min-sida-tranare-dashboard .fp-min-sida-pass-player-name,
.fp-min-sida-tranare-dashboard .fp-min-sida-pass-player-count {
	color: #fff;
}
.fp-min-sida-tranare-view .fp-min-sida-hero {
	margin-bottom: 0.5rem;
	padding-bottom: 0.25rem;
}
.fp-min-sida-tranare-view .fp-min-sida-title {
	font-size: clamp(1.15rem, 2.5vw, 1.5rem);
}
.fp-min-sida-tranare-view .fp-min-sida-roll {
	font-size: 0.8125rem;
	margin-top: 0.15rem;
}
.fp-min-sida-tranare-view .fp-min-sida-tranare-main {
	margin-bottom: 1.25rem;
	padding: 1.25rem 1rem;
}
.fp-min-sida-tranare-view .fp-min-sida-pass-section-coach {
	margin-bottom: 1.25rem;
	padding: 1.25rem 1rem;
	background: var(--fp-bg-card);
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 1rem;
	box-shadow: 0 2px 16px rgba(0, 0, 0, 0.25);
}
.fp-min-sida-tranare-view .fp-min-sida-pass-section-coach .fp-min-sida-pass-coach-header .fp-min-sida-section-title,
.fp-min-sida-tranare-view .fp-min-sida-pass-coach-title {
	font-size: 0.75rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--fp-accent);
	margin: 0;
}
.fp-min-sida-tranare-view .fp-min-sida-pass-intro,
.fp-min-sida-tranare-view .fp-min-sida-pass-players-title {
	color: var(--fp-text);
	font-size: 0.9rem;
}
.fp-min-sida-tranare-view .fp-min-sida-pass-players-title {
	font-size: 0.8rem;
	font-weight: 800;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--fp-accent);
	margin-bottom: 0.5rem;
}
.fp-min-sida-tranare-view .fp-min-sida-pass-player-card-link {
	background: rgba(0, 0, 0, 0.25);
	border: 1px solid rgba(255, 255, 255, 0.1);
}
.fp-min-sida-tranare-view .fp-min-sida-pass-player-name {
	color: #fff;
}
.fp-min-sida-tranare-view .fp-min-sida-admin-title,
.fp-min-sida-tranare-view .fp-min-sida-pass-coach-title {
	font-size: 0.9375rem;
	margin-bottom: 0.5rem;
}
.fp-min-sida-hero {
	margin-bottom: 1.5rem;
}
.fp-min-sida-title {
	font-size: clamp(1.5rem, 3.5vw, 2rem);
	font-weight: 700;
	color: var(--fp-text);
	margin: 0 0 0.2rem;
	letter-spacing: -0.02em;
	text-transform: none;
}
.fp-min-sida-roll {
	color: var(--fp-text-muted);
	font-size: 0.875rem;
	margin: 0;
}
.fp-min-sida-settings {
	margin-top: 2rem;
	padding-top: 1rem;
	border-top: 1px solid rgba(255,255,255,0.06);
}
.fp-min-sida-settings-form {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	flex-wrap: wrap;
}
.fp-min-sida-settings-form.fp-min-sida-settings-form--weights-col {
	flex-direction: column;
	align-items: flex-start;
}
.fp-min-sida-settings-form.fp-min-sida-settings-form--weights-col .fp-min-sida-settings-btn {
	margin-top: 0.25rem;
}
.fp-min-sida-settings-hint {
	margin: 0;
	font-size: 0.8125rem;
	line-height: 1.45;
	color: var(--fp-text-muted);
	max-width: 28rem;
}
.fp-min-sida-settings-subtitle {
	font-size: 0.95rem;
	font-weight: 700;
	color: var(--fp-text);
	margin: 0 0 0.5rem;
	letter-spacing: 0.02em;
}
.fp-min-sida-settings-check {
	display: flex;
	align-items: center;
	gap: 0.4rem;
	cursor: pointer;
	color: var(--fp-text-muted);
	font-size: 0.9rem;
}
.fp-min-sida-settings-check input {
	width: 1em;
	height: 1em;
}
.fp-min-sida-settings-check span {
	color: var(--fp-text-muted);
}
.fp-min-sida-settings-btn {
	padding: 0.35rem 0.75rem;
	font-size: 0.85rem;
	background: transparent;
	border: 1px solid rgba(255,255,255,0.25);
	border-radius: 4px;
	color: var(--fp-text-muted);
	cursor: pointer;
}
.fp-min-sida-settings-btn:hover {
	color: var(--fp-accent);
	border-color: var(--fp-accent);
}
.fp-min-sida-settings-label {
	font-weight: 600;
	color: var(--fp-text);
	margin: 0 0 0.5rem;
	font-size: 0.9rem;
}
/* Profilinställningar – samma synliga kortlayout som onboarding */
.fp-min-sida-profile-section {
	max-width: 560px;
	margin: 0 auto 2rem;
	padding: 2rem 1.75rem;
	background: var(--fp-bg-card);
	border: 1px solid rgba(255,255,255,0.08);
	border-radius: 16px;
	box-shadow: 0 4px 24px rgba(0,0,0,0.2);
	color: var(--fp-text);
}
.fp-min-sida-profile-section .fp-back-link {
	display: inline-block;
	margin-bottom: 1.25rem;
}
.fp-min-sida-profile-section .fp-min-sida-section-title {
	margin-top: 0;
	margin-bottom: 1.25rem;
}
.fp-min-sida-profile-summary {
	margin-bottom: 1.75rem;
	padding: 1.25rem 1rem;
	background: rgba(255,255,255,0.04);
	border: 1px solid rgba(255,255,255,0.08);
	border-radius: 12px;
}
.fp-min-sida-profile-summary-title {
	font-size: 0.85rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--fp-text-muted);
	margin: 0 0 0.75rem;
}
.fp-min-sida-profile-summary-list {
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: 0.95rem;
	line-height: 1.6;
	color: var(--fp-text);
}
.fp-min-sida-profile-summary-list li {
	margin: 0.25rem 0;
}
.fp-min-sida-profile-summary-list strong {
	color: var(--fp-text-muted);
	font-weight: 500;
	margin-right: 0.35rem;
}
.fp-min-sida-profile-section .fp-min-sida-settings {
	border-top: none;
	padding-top: 0;
	margin-top: 1rem;
}
.fp-min-sida-settings-row-full {
	flex-basis: 100%;
	margin-top: 1rem;
}
.fp-min-sida-cancel-wrap {
	margin-top: 2rem;
	padding-top: 1.5rem;
	border-top: 1px solid rgba(255,255,255,0.08);
}
.fp-min-sida-cancel-link {
	color: var(--fp-text-muted);
	font-size: 0.9rem;
	text-decoration: none;
}
.fp-min-sida-cancel-link:hover {
	color: #e57373;
}
.fp-min-sida-cancel-note {
	color: var(--fp-text-muted);
	font-size: 0.875rem;
	margin: 0;
}

/* ========== Avsluta medlemskap – enkel ja/nej ========== */
.fp-avsluta-main {
	max-width: 420px;
	margin: 0 auto;
	padding-top: 2rem;
}
.fp-avsluta-content {
	background: var(--fp-bg-card);
	border: 1px solid rgba(255,255,255,0.08);
	border-radius: 16px;
	padding: 2rem 1.75rem;
}
.fp-avsluta-content .fp-back-link {
	display: inline-block;
	margin-bottom: 1.25rem;
}
.fp-avsluta-title {
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--fp-text);
	margin: 0 0 1rem;
	letter-spacing: -0.02em;
}
.fp-avsluta-debite {
	color: var(--fp-text-muted);
	font-size: 0.95rem;
	margin: 0 0 1.75rem;
	line-height: 1.5;
}
.fp-avsluta-question {
	font-size: 1rem;
	font-weight: 600;
	color: var(--fp-text);
	margin: 0 0 1.25rem;
}
.fp-avsluta-buttons {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}
.fp-avsluta-form {
	margin: 0;
}
.fp-avsluta-form .fp-app-btn {
	width: 100%;
}
.fp-churn-fieldset {
	margin: 1.5rem 0;
	padding: 1rem 1.1rem 1.1rem;
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 12px;
	background: rgba(255, 255, 255, 0.03);
	text-align: left;
}
.fp-churn-legend {
	font-weight: 600;
	font-size: 1rem;
	padding: 0 0.4rem;
	color: var(--fp-text);
}
.fp-churn-intro {
	margin: 0.25rem 0 0.85rem;
	font-size: 0.9rem;
	color: var(--fp-text-muted);
	line-height: 1.45;
}
.fp-churn-reasons {
	list-style: none;
	margin: 0 0 1rem;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.45rem;
}
.fp-churn-reasons li { margin: 0; }
.fp-churn-reasons label {
	display: flex;
	align-items: center;
	gap: 0.55rem;
	cursor: pointer;
	font-size: 0.95rem;
	line-height: 1.4;
	color: var(--fp-text);
}
.fp-churn-reasons input[type="radio"] {
	margin: 0;
	width: 18px;
	height: 18px;
	accent-color: var(--fp-accent);
	flex-shrink: 0;
}
.fp-churn-feedback-wrap {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
}
.fp-churn-feedback-label {
	font-size: 0.92rem;
	font-weight: 500;
	color: var(--fp-text);
}
.fp-churn-feedback-input {
	width: 100%;
	box-sizing: border-box;
	padding: 0.7rem 0.85rem;
	border-radius: 10px;
	border: 1px solid rgba(255, 255, 255, 0.16);
	background: rgba(0, 0, 0, 0.25);
	color: inherit;
	font: inherit;
	resize: vertical;
	min-height: 3.5rem;
}
.fp-churn-feedback-input:focus {
	outline: 2px solid var(--fp-accent);
	outline-offset: 1px;
}
.fp-avsluta-buttons .fp-app-btn {
	display: block;
	text-align: center;
	text-decoration: none;
	padding: 0.85rem 1.25rem;
	border-radius: 10px;
	font-weight: 600;
	font-size: 1rem;
	border: none;
	cursor: pointer;
	transition: opacity 0.2s;
}
.fp-avsluta-btn-yes {
	background: var(--fp-accent);
	color: var(--brand-bg, #0a0a0a);
}
.fp-avsluta-btn-yes:hover {
	opacity: 0.95;
}
.fp-avsluta-btn-no {
	background: transparent;
	color: var(--fp-text-muted);
	border: 1px solid rgba(255,255,255,0.2);
}
.fp-avsluta-btn-no:hover {
	color: var(--fp-text);
	border-color: rgba(255,255,255,0.35);
}
.fp-avsluta-btn-disabled {
	opacity: 0.6;
	cursor: not-allowed;
}
.fp-avsluta-no-woo {
	font-size: 0.875rem;
	color: var(--fp-text-muted);
	margin: -0.25rem 0 0;
}

.fp-min-sida-goals-form { margin-bottom: 1.25rem; }
.fp-min-sida-goals-checkboxes {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1rem;
	margin-bottom: 0.75rem;
}
.fp-min-sida-goals-checkboxes .fp-min-sida-settings-check { margin: 0; }

/* Onboarding – första inlogg (snyggt, modernt formulär) */
.fp-onboarding-section {
	max-width: 520px;
	margin: 0 auto 2rem;
	padding: 2rem 1.75rem;
	background: var(--fp-bg-card);
	border: 1px solid rgba(255,255,255,0.08);
	border-radius: 16px;
	box-shadow: 0 4px 24px rgba(0,0,0,0.2);
}
.fp-onboarding-header {
	margin-bottom: 1.75rem;
	text-align: center;
}
.fp-onboarding-title {
	font-size: 1.6rem;
	font-weight: 800;
	color: var(--fp-text);
	margin: 0 0 0.4rem;
	letter-spacing: -0.02em;
}
.fp-onboarding-desc {
	color: var(--fp-text-muted);
	font-size: 0.95rem;
	line-height: 1.5;
	margin: 0;
}
.fp-onboarding-form {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}
.fp-onboarding-block {
	margin: 0;
}
.fp-onboarding-label {
	font-weight: 600;
	color: var(--fp-text);
	font-size: 0.9rem;
	margin: 0 0 0.6rem;
	display: block;
}
/* Redskap – kortval */
.fp-onboarding-equipment-cards {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0.75rem;
}
.fp-onboarding-equipment-card {
	margin: 0;
	cursor: pointer;
}
.fp-onboarding-equipment-card input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}
.fp-onboarding-equipment-card-inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 1.25rem 1rem;
	background: rgba(255,255,255,0.03);
	border: 2px solid rgba(255,255,255,0.1);
	border-radius: 12px;
	transition: all 0.2s ease;
}
.fp-onboarding-equipment-card:hover .fp-onboarding-equipment-card-inner,
.fp-onboarding-equipment-card input:focus-visible + .fp-onboarding-equipment-card-inner {
	border-color: rgba(255,255,255,0.25);
	background: rgba(255,255,255,0.06);
}
.fp-onboarding-equipment-card input:checked + .fp-onboarding-equipment-card-inner {
	border-color: var(--fp-accent);
	background: rgba(var(--brand-accent-rgb, 212, 212, 30),0.08);
	box-shadow: 0 0 0 1px var(--fp-accent);
}
.fp-onboarding-equipment-card input:checked + .fp-onboarding-equipment-card-inner .fp-onboarding-equipment-badge {
	background: var(--fp-accent);
	opacity: 1;
}
.fp-onboarding-equipment-badge {
	display: block;
	width: 24px;
	height: 4px;
	border-radius: 2px;
	background: rgba(255,255,255,0.3);
	opacity: 0.6;
	transition: all 0.2s ease;
}
.fp-onboarding-equipment-label {
	font-weight: 600;
	font-size: 0.95rem;
	color: var(--fp-text);
}
/* Ålder-input */
.fp-onboarding-input {
	width: 100%;
	max-width: 100px;
	padding: 0.6rem 0.9rem;
	background: rgba(255,255,255,0.04);
	border: 1px solid rgba(255,255,255,0.12);
	border-radius: 10px;
	color: var(--fp-text);
	font-size: 1.05rem;
	transition: border-color 0.2s;
}
.fp-onboarding-input:focus {
	outline: none;
	border-color: var(--fp-accent);
}
.fp-onboarding-input::placeholder {
	color: var(--fp-text-muted);
	opacity: 0.7;
}
/* Träningsmål – chip-stil */
.fp-onboarding-goals {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}
.fp-onboarding-goal-chip {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.5rem 0.9rem;
	background: rgba(255,255,255,0.04);
	border: 1px solid rgba(255,255,255,0.1);
	border-radius: 999px;
	cursor: pointer;
	font-size: 0.9rem;
	color: var(--fp-text);
	transition: all 0.2s ease;
}
.fp-onboarding-goal-chip:hover {
	background: rgba(255,255,255,0.08);
	border-color: rgba(255,255,255,0.2);
}
.fp-onboarding-goal-chip input {
	flex-shrink: 0;
	accent-color: var(--fp-accent);
}
.fp-onboarding-goal-chip input:checked + span {
	font-weight: 600;
}
.fp-onboarding-goal-chip:has(input:checked) {
	border-color: var(--fp-accent);
	background: rgba(var(--brand-accent-rgb, 212, 212, 30),0.08);
}
.fp-onboarding-submit { margin: 0.25rem 0 0; }
.fp-onboarding-btn {
	width: 100%;
	padding: 0.85rem 1.5rem;
	font-size: 1rem;
	font-weight: 700;
	border-radius: 10px;
}
.fp-min-sida-select,
.fp-min-sida-input {
	width: 100%;
	max-width: 200px;
	padding: 0.5rem 0.75rem;
	background: rgba(255,255,255,0.04);
	border: 1px solid rgba(255,255,255,0.12);
	border-radius: 8px;
	color: var(--fp-text);
	font-size: 0.95rem;
}

/* Rekommenderade upplägg */
.fp-min-sida-recommended {
	margin-bottom: 2rem;
}
/* Sekundär rekommendation för lagspelare – tydligare att det är "extra" efter lagets schema */
.fp-min-sida-recommended-secondary {
	margin-top: 2rem;
	padding-top: 1.5rem;
	border-top: 1px solid rgba(255,255,255,0.06);
}
.fp-min-sida-recommended-desc {
	color: var(--fp-text-muted);
	font-size: 0.9rem;
	margin: 0 0 1rem;
}
.fp-min-sida-recommended-cards {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem;
}
@media (min-width: 640px) {
	.fp-min-sida-recommended-cards {
		grid-template-columns: repeat(2, 1fr);
	}
}
@media (min-width: 900px) {
	.fp-min-sida-recommended-cards {
		grid-template-columns: repeat(3, 1fr);
	}
}
.fp-card-recommended .fp-card-bg {
	background-image: var(--fp-card-bg, url('https://images.unsplash.com/photo-1518611012118-696072aa579a?w=800&q=80'));
}

.fp-min-sida-cards {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 0.75rem;
	max-width: 1200px;
	margin: 0 auto;
}
@media (min-width: 640px) {
	.fp-min-sida-cards {
		gap: 1rem;
		grid-template-columns: repeat(4, 1fr);
	}
}

/* Kort med bakgrundsbild – standardbilder från Unsplash (ersätt med egna i style.css vid behov) */
.fp-min-sida-card.fp-card {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: 140px;
	padding: 0;
	border: 1px solid rgba(255,255,255,0.06);
	border-radius: var(--fp-radius);
	overflow: hidden;
	text-decoration: none;
	color: inherit;
	transition: transform 0.2s ease, border-color 0.2s;
}
@media (min-width: 640px) {
	.fp-min-sida-card.fp-card {
		min-height: 160px;
	}
}
.fp-min-sida-card.fp-card:hover {
	transform: translateY(-4px);
	border-color: var(--fp-accent);
}
.fp-min-sida-card .fp-card-content {
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
	padding: 1rem 1.25rem;
}
@media (min-width: 640px) {
	.fp-min-sida-card .fp-card-content {
		gap: 0.5rem;
		padding: 1.25rem 1.5rem;
	}
}
.fp-min-sida-card .fp-card-label {
	margin-bottom: 0;
}
.fp-min-sida-card .fp-card-title {
	margin: 0;
}
.fp-min-sida-card .fp-card-desc {
	margin: 0 0 0.2rem;
}
.fp-min-sida-card.fp-card-muted {
	opacity: 0.7;
	pointer-events: none;
}
.fp-card-bg {
	position: absolute;
	inset: 0;
	background: var(--fp-bg-card);
	background-size: cover;
	background-position: center;
}
.fp-card-traningsupplagg .fp-card-bg {
	background-image: var(--fp-card-bg, url('https://images.unsplash.com/photo-1518611012118-696072aa579a?w=800&q=80'));
}
.fp-card-ovningsbank .fp-card-bg {
	background-image: var(--fp-card-bg, url('https://images.unsplash.com/photo-1581009146145-b5ef050c149e?w=800&q=80'));
}
.fp-card-receptbank .fp-card-bg {
	background-image: var(--fp-card-bg, url('https://images.unsplash.com/photo-1546069901-ba9599a7e63c?w=800&q=80'));
}
.fp-card-fystester .fp-card-bg {
	background-image: var(--fp-card-bg, url('https://images.unsplash.com/photo-1571019614242-c5c5dee9f50b?w=800&q=80'));
}
.fp-card-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(0,0,0,0.92) 0%, rgba(0,0,0,0.4) 50%, rgba(0,0,0,0.1) 100%);
	pointer-events: none;
}
.fp-card-content {
	position: relative;
	z-index: 1;
	width: 100%;
	padding: 1.25rem 1.5rem;
}
.fp-card-label {
	display: block;
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--fp-accent);
	margin-bottom: 0.35rem;
}
.fp-min-sida-card .fp-card-title {
	font-size: 0.95rem;
	font-weight: 800;
	letter-spacing: -0.02em;
	line-height: 1.2;
	color: var(--fp-text);
	margin: 0 0 0.25rem;
}
@media (min-width: 640px) {
	.fp-min-sida-card .fp-card-title {
		font-size: 1.05rem;
	}
}
.fp-min-sida-card .fp-card-desc {
	font-size: 0.7rem;
	color: rgba(255,255,255,0.65);
	line-height: 1.35;
	margin: 0 0 0.2rem;
}
@media (min-width: 640px) {
	.fp-min-sida-card .fp-card-desc {
		font-size: 0.75rem;
	}
}
.fp-card-title {
	font-size: 1.15rem;
	font-weight: 800;
	letter-spacing: -0.02em;
	line-height: 1.2;
	color: var(--fp-text);
	margin: 0 0 0.25rem;
}
.fp-card-desc {
	font-size: 0.8rem;
	color: rgba(255,255,255,0.65);
	line-height: 1.4;
	margin: 0 0 0.5rem;
}
.fp-card-cta {
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.02em;
	color: var(--fp-accent);
}
.fp-min-sida-section-title {
	font-size: 1.25rem;
	font-weight: 800;
	color: var(--fp-accent);
	text-transform: uppercase;
	margin: 0 0 1rem;
}
/* Idag-kort: progress-badge + motivation + en tydlig CTA */
.fp-min-sida-today {
	margin-bottom: 1rem;
	padding: 1.5rem 1.25rem;
	background: linear-gradient(145deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.01) 100%);
	border: 1px solid rgba(255,255,255,0.08);
	border-radius: 1rem;
	box-shadow: 0 4px 24px rgba(0,0,0,0.2);
}
.fp-min-sida-today-below {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}
.fp-min-sida-today-current {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
	margin: 0;
	padding-bottom: 1rem;
	border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}
.fp-min-sida-today-plan-ctx {
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
	margin: 0;
	padding: 0;
	border: none;
}
.fp-min-sida-today-next {
	display: flex;
	flex-direction: column;
	gap: 0.55rem;
	margin: 0;
	padding-top: 0.15rem;
}
.fp-min-sida-today-next-kicker {
	margin: 0;
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--fp-text-muted);
}
.fp-min-sida-today-plan-kicker {
	display: block;
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--fp-accent);
}
.fp-min-sida-today-plan-name {
	display: block;
	font-size: 1.05rem;
	font-weight: 800;
	color: var(--fp-text);
	line-height: 1.25;
}
a.fp-min-sida-today-plan-name.fp-min-sida-today-plan-link {
	text-decoration: none;
	color: inherit;
	cursor: pointer;
	transition: color 0.15s ease, opacity 0.15s ease;
}
a.fp-min-sida-today-plan-name.fp-min-sida-today-plan-link:hover {
	color: var(--fp-accent);
}
a.fp-min-sida-today-plan-name.fp-min-sida-today-plan-link:focus-visible {
	color: var(--fp-accent);
	outline: 2px solid var(--fp-accent);
	outline-offset: 3px;
	border-radius: 2px;
}
.fp-min-sida-today-rec-hint {
	margin: 0;
	font-size: 0.8125rem;
	line-height: 1.45;
	color: var(--fp-text-muted);
}
.fp-min-sida-today-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem 1rem;
}
.fp-min-sida-today-badge {
	display: inline-flex;
	align-items: baseline;
	gap: 0.25rem;
	padding: 0.35rem 0.65rem;
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.15);
	border-radius: 999px;
	font-size: 0.875rem;
	font-weight: 600;
}
.fp-min-sida-today-badge-num {
	color: var(--fp-accent);
}
.fp-min-sida-today-badge-of {
	color: var(--fp-text-muted);
	font-weight: 500;
}
.fp-min-sida-today-motivation {
	margin: 0;
	font-size: 0.9375rem;
	color: var(--fp-text-muted);
	line-height: 1.4;
}
/* Medlemmar utan lag */
.fp-min-sida-today-no-team .fp-min-sida-today-cta {
	margin-top: 0;
}
.fp-min-sida-today-cta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	min-width: 0;
	min-height: 56px;
	padding: 1rem 1.25rem;
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.12);
	border: 1px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.25);
	border-radius: 0.75rem;
	text-decoration: none;
	color: inherit;
	transition: border-color 0.2s, background 0.2s, box-shadow 0.2s, transform 0.15s ease;
}
.fp-min-sida-today-cta:hover {
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.18);
	border-color: var(--fp-accent);
	box-shadow: 0 0 0 2px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.2);
	transform: translateY(-1px);
}
.fp-min-sida-today-cta-text {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
	align-items: flex-start;
}
.fp-min-sida-today-cta-label {
	display: block;
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--fp-accent);
}
.fp-min-sida-today-name {
	font-weight: 700;
	font-size: 1.125rem;
	color: var(--fp-text);
	line-height: 1.2;
}
.fp-min-sida-today-cta .fp-min-sida-today-arrow {
	flex-shrink: 0;
	font-size: 1.25rem;
	color: var(--fp-accent);
	font-weight: 700;
}

/* Starta nästa pass: full accent-yta som primärknapp (måste ligga efter .fp-min-sida-today-cta så bakgrund inte skrivs över). */
.fp-min-sida-today-cta.fp-min-sida-today-cta--in-current {
	margin-top: 0.1rem;
	background: linear-gradient(168deg, #e8e83a 0%, var(--fp-accent) 42%, #b0b015 100%);
	border: 1px solid rgba(0, 0, 0, 0.12);
	color: var(--fp-bg);
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.38) inset,
		0 12px 40px -14px var(--fp-accent-glow),
		0 2px 10px rgba(0, 0, 0, 0.22);
}

.fp-min-sida-today-cta.fp-min-sida-today-cta--in-current .fp-min-sida-today-cta-label {
	color: rgba(var(--brand-bg-rgb, 10, 10, 10), 0.68);
}

.fp-min-sida-today-cta.fp-min-sida-today-cta--in-current .fp-min-sida-today-name {
	color: var(--fp-bg);
	font-weight: 800;
	letter-spacing: -0.015em;
}

.fp-min-sida-today-cta.fp-min-sida-today-cta--in-current .fp-min-sida-today-arrow {
	color: var(--fp-bg);
}

.fp-min-sida-today-cta.fp-min-sida-today-cta--in-current:hover {
	background: linear-gradient(168deg, #f4f44a 0%, #e0e028 48%, var(--fp-accent) 100%);
	border-color: rgba(255, 255, 255, 0.45);
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.48) inset,
		0 16px 48px -12px var(--fp-accent-glow),
		0 0 0 1px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.4);
	transform: translateY(-1px);
}

.fp-min-sida-today-cta.fp-min-sida-today-cta--in-current:focus-visible {
	outline: 2px solid var(--fp-accent);
	outline-offset: 3px;
}

.fp-min-sida-today-cta.fp-min-sida-today-cta--in-current:active {
	transform: translateY(0);
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.28) inset,
		0 6px 28px -10px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.35);
}

/* Min sida: egen rad under idag-kortet (inte gömd i samma panel) */
.fp-min-sida-loggbok-entry {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin: 0 0 2rem;
	padding: 1rem 1.2rem;
	background: linear-gradient(145deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.02) 100%);
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 0.85rem;
	text-decoration: none;
	color: inherit;
	-webkit-tap-highlight-color: transparent;
	transition:
		border-color 0.2s ease,
		background 0.2s ease,
		transform 0.15s ease,
		box-shadow 0.2s ease;
}
.fp-min-sida-loggbok-entry-text {
	display: flex;
	flex-direction: column;
	gap: 0.3rem;
	min-width: 0;
}
.fp-min-sida-loggbok-entry-title {
	font-weight: 800;
	font-size: 1rem;
	color: var(--fp-text);
	line-height: 1.25;
}
.fp-min-sida-loggbok-entry-desc {
	font-size: 0.8125rem;
	color: var(--fp-text-muted);
	line-height: 1.45;
}
.fp-min-sida-loggbok-entry-arrow {
	flex-shrink: 0;
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--fp-accent);
}
@media (hover: hover) and (pointer: fine) {
	.fp-min-sida-loggbok-entry:hover {
		border-color: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.35);
		background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.08);
		box-shadow: 0 0 0 1px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.12);
		transform: translateY(-1px);
	}
}
.fp-min-sida-loggbok-entry:focus-visible {
	outline: 2px solid var(--fp-accent);
	outline-offset: 3px;
}

/* ========== Loggbok (template-loggbok) ========== */
.fp-app-wrap.fp-loggbok .fp-app-main {
	max-width: 800px;
	margin-left: auto;
	margin-right: auto;
	padding: 1.25rem 1.25rem 2rem;
	padding-bottom: max(2rem, env(safe-area-inset-bottom));
	box-sizing: border-box;
}
.fp-loggbok-hero {
	margin-bottom: 1.5rem;
}
.fp-loggbok-hero .fp-back-link {
	margin-bottom: 0.75rem;
}
.fp-loggbok-title {
	font-size: clamp(1.35rem, 4vw, 1.65rem);
	font-weight: 800;
	color: var(--fp-text) !important;
	margin: 0 0 0.4rem;
	letter-spacing: -0.02em;
	line-height: 1.2;
}
.fp-loggbok-desc {
	margin: 0;
	font-size: 0.9375rem;
	color: var(--fp-text-muted);
	line-height: 1.5;
	max-width: 36rem;
}
.fp-loggbok-stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
	gap: 0.75rem;
	margin-bottom: 1.5rem;
}
.fp-loggbok-stat {
	background: var(--fp-bg-card);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: var(--fp-radius);
	padding: 0.85rem 1rem;
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
}
.fp-loggbok-stat-num {
	font-size: 1.375rem;
	font-weight: 800;
	color: var(--fp-accent);
	line-height: 1.1;
}
.fp-loggbok-stat-label {
	font-size: 0.75rem;
	font-weight: 600;
	color: var(--fp-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.05em;
}
.fp-loggbok-empty-wrap {
	background: var(--fp-bg-card);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: var(--fp-radius);
	padding: 1.25rem;
}
.fp-loggbok-empty {
	margin: 0;
	font-size: 0.9375rem;
	color: var(--fp-text-muted);
	line-height: 1.55;
}
.fp-loggbok-exercises {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}
.fp-loggbok-card {
	background: var(--fp-bg-card);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: var(--fp-radius);
	overflow: hidden;
}
.fp-loggbok-card-summary {
	list-style: none;
	cursor: pointer;
	padding: 1rem 1.15rem;
	display: flex;
	flex-direction: column;
	gap: 0.65rem;
	margin: 0;
}
.fp-loggbok-card-summary::-webkit-details-marker,
.fp-loggbok-card-summary::marker {
	display: none;
}
.fp-loggbok-card[open] .fp-loggbok-card-summary {
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.fp-loggbok-card-top {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 0.75rem;
}
.fp-loggbok-card-name {
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--fp-text) !important;
	margin: 0;
	line-height: 1.25;
	flex: 1;
	min-width: 0;
}
.fp-loggbok-progress {
	flex-shrink: 0;
	font-size: 0.8rem;
	font-weight: 700;
	padding: 0.2rem 0.45rem;
	border-radius: 6px;
	line-height: 1.2;
}
.fp-loggbok-progress-up {
	background: rgba(74, 222, 128, 0.15);
	color: #86efac;
}
.fp-loggbok-progress-down {
	background: rgba(248, 113, 113, 0.15);
	color: #fca5a5;
}
.fp-loggbok-progress-flat {
	background: rgba(255, 255, 255, 0.08);
	color: var(--fp-text-muted);
}
.fp-loggbok-progress-new {
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.15);
	color: var(--fp-accent);
}
.fp-loggbok-card-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem 1rem;
	font-size: 0.8125rem;
	color: var(--fp-text-muted);
}
.fp-loggbok-pb strong {
	color: var(--fp-text);
	font-weight: 700;
}
.fp-loggbok-last-date {
	margin-left: auto;
}
@media (max-width: 480px) {
	.fp-loggbok-last-date {
		margin-left: 0;
		flex-basis: 100%;
	}
}
.fp-loggbok-sparkline {
	display: block;
	width: 100%;
	max-width: 140px;
	height: auto;
	max-height: 48px;
	margin-top: 0.25rem;
	align-self: flex-end;
	flex-shrink: 0;
}
.fp-loggbok-card-history {
	padding: 0 1rem 1rem;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}
.fp-loggbok-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.8125rem;
}
.fp-loggbok-table th,
.fp-loggbok-table td {
	padding: 0.5rem 0.65rem;
	text-align: left;
	border-bottom: 1px solid rgba(255, 255, 255, 0.06);
	color: var(--fp-text);
}
.fp-loggbok-table th {
	font-size: 0.7rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--fp-text-muted);
	background: rgba(0, 0, 0, 0.2);
}
.fp-loggbok-row-pr {
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.06);
}
.fp-loggbok-pr-badge {
	display: inline-block;
	font-size: 0.65rem;
	font-weight: 800;
	vertical-align: middle;
	margin-left: 0.25rem;
	padding: 0.1rem 0.35rem;
	border-radius: 4px;
	background: var(--fp-accent);
	color: var(--brand-bg, #0a0a0a);
}

/* Mina pass – statistik och nästa pass */
.fp-min-sida-pass-section {
	margin-bottom: 2rem;
	padding: 1.5rem;
	background: var(--fp-bg-card);
	border: 1px solid rgba(255,255,255,0.06);
	border-radius: var(--fp-radius);
}
.fp-min-sida-pass-heading {
	font-size: 1rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--fp-accent);
	margin: 0 0 1.25rem;
}
.fp-min-sida-pass-grid {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 1.25rem 2rem;
	align-items: center;
	margin-bottom: 1.25rem;
}
@media (max-width: 500px) {
	.fp-min-sida-pass-grid {
		grid-template-columns: 1fr;
		gap: 1rem;
		align-items: stretch;
	}
}
.fp-min-sida-pass-block {
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
}
.fp-pass-count .fp-pass-number {
	font-size: 2.25rem;
	font-weight: 800;
	letter-spacing: -0.02em;
	color: var(--fp-accent);
	line-height: 1;
}
.fp-pass-label {
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--fp-text-muted);
}
.fp-pass-latest .fp-pass-name {
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--fp-text);
}
.fp-pass-date {
	font-size: 0.85rem;
	color: var(--fp-text-muted);
}
.fp-min-sida-pass-cta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 1rem 1.25rem;
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.08);
	border: 1px solid var(--fp-border);
	border-radius: var(--fp-radius-sm);
	text-decoration: none;
	color: inherit;
	transition: border-color 0.2s, background 0.2s;
	min-height: var(--fp-touch-target);
}
.fp-min-sida-pass-cta:hover {
	border-color: var(--fp-accent);
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.12);
}
.fp-pass-cta-content {
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
}
.fp-pass-cta-label {
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--fp-accent);
}
.fp-pass-cta-name {
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--fp-text);
}
.fp-pass-cta-arrow {
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--fp-accent);
	flex-shrink: 0;
}
.fp-min-sida-pass-done {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.75rem;
	padding: 1rem 1.25rem;
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.06);
	border: 1px solid rgba(255,255,255,0.06);
	border-radius: var(--fp-radius-sm);
}
.fp-min-sida-pass-done-link {
	text-decoration: none;
	color: inherit;
	transition: border-color 0.2s, background 0.2s;
	min-height: var(--fp-touch-target);
	justify-content: space-between;
}
.fp-min-sida-pass-done-link:hover {
	border-color: var(--fp-accent);
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.1);
}
.fp-pass-done-content {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
}
.fp-pass-done-label {
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--fp-accent);
	opacity: 0.9;
}
.fp-pass-done-next {
	font-size: 1rem;
	font-weight: 700;
	color: var(--fp-text);
}
.fp-min-sida-pass-done-link:hover .fp-pass-done-next {
	color: var(--fp-accent);
}
.fp-pass-done-arrow {
	font-size: 1.2rem;
	font-weight: 700;
	color: var(--fp-accent);
	flex-shrink: 0;
}
.fp-min-sida-msg {
	margin-top: 0.75rem;
	padding: 0.5rem 0;
	font-size: 0.95rem;
}
.fp-min-sida-msg-success {
	color: var(--fp-accent);
}
.fp-min-sida-msg-error {
	color: #b00020;
}
/* Tränare: passlista (read-only) och spelarstatistik */
.fp-min-sida-pass-intro {
	color: var(--fp-text-muted);
	font-size: 0.95rem;
	margin: 0 0 1rem;
}
.fp-min-sida-pass-list-readonly {
	list-style: none;
	margin: 0 0 1.5rem;
	padding: 0;
}
.fp-min-sida-pass-list-readonly li {
	padding: 0.35rem 0;
	border-bottom: 1px solid rgba(255,255,255,0.06);
	display: flex;
	flex-wrap: wrap;
	gap: 0.25rem;
}
.fp-min-sida-pass-list-readonly li:last-child {
	border-bottom: none;
}
.fp-min-sida-pass-desc {
	color: var(--fp-text-muted);
	font-size: 0.9rem;
	font-weight: normal;
}
.fp-min-sida-subsection-title {
	font-size: 1rem;
	font-weight: 700;
	color: var(--fp-text);
	margin: 0 0 0.75rem;
	text-transform: none;
}
.fp-min-sida-players-stats {
	list-style: none;
	margin: 0;
	padding: 0;
}
.fp-min-sida-player-stat {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0.5rem 0;
	border-bottom: 1px solid rgba(255,255,255,0.06);
}
.fp-min-sida-player-stat:last-child {
	border-bottom: none;
}
.fp-min-sida-player-name {
	font-weight: 500;
}
.fp-min-sida-player-count {
	color: var(--fp-accent);
	font-weight: 700;
}

/* Tränarverktyg – placerat högt upp, kort-layout */
.fp-min-sida-admin {
	margin-bottom: 2rem;
}
.fp-min-sida-admin-top {
	margin-top: 0;
}
.fp-min-sida-admin-title {
	font-size: 1rem;
	font-weight: 800;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--fp-accent);
	margin: 0 0 1rem;
}
.fp-min-sida-admin-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0.75rem;
}
@media (max-width: 600px) {
	.fp-min-sida-admin-grid {
		grid-template-columns: 1fr;
	}
}
.fp-min-sida-admin-card {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.35rem;
	padding: 1rem 1.25rem;
	background: rgba(255,255,255,0.04);
	border: 1px solid var(--fp-border);
	border-radius: var(--fp-radius-sm);
	text-decoration: none;
	color: inherit;
	transition: border-color 0.2s, background 0.2s;
}
.fp-min-sida-admin-card:hover {
	border-color: var(--fp-accent);
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.06);
}
.fp-min-sida-admin-card-icon {
	font-size: 0.7rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--fp-text-muted);
}
.fp-min-sida-admin-card-label {
	font-size: 0.95rem;
	font-weight: 700;
	color: var(--fp-text);
}
/* Tränarverktyg – samma panelstil som "Idag"-kortet (fp-min-sida-today) */
.fp-min-sida-tranare-main {
	margin-bottom: 1.25rem;
	padding: 1.25rem 1.25rem;
	background: linear-gradient(145deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.01) 100%);
	border: 1px solid rgba(255,255,255,0.08);
	border-radius: 1rem;
	box-shadow: 0 4px 24px rgba(0,0,0,0.2);
}
.fp-min-sida-tranare-main .fp-min-sida-section-title {
	margin-bottom: 0.75rem;
}
.fp-min-sida-tranare-no-lag,
.fp-min-sida-tranare-no-schema {
	font-size: 0.9rem;
	color: var(--fp-text-muted);
	margin: 0 0 1rem;
	padding: 1rem 1.15rem;
	line-height: 1.5;
	max-width: 36em;
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 0.75rem;
}
/* Kompakt länkrad istället för stora Tränarverktyg-kort */
.fp-min-sida-tranare-links {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.25rem 0.35rem;
	margin-bottom: 1.25rem;
	font-size: 0.8125rem;
}
.fp-min-sida-traningsval-tranare {
	margin-top: 0.35rem;
}
.fp-min-sida-tranare-plan-intro {
	margin: 0 0 0.75rem;
	color: var(--fp-text-muted);
	font-size: 0.95rem;
}
.fp-min-sida-today-cta--coach-highlight {
	margin-bottom: 0.65rem;
}
.fp-min-sida-tranare-coaching-hint {
	margin: 0 0 0.9rem;
	color: var(--fp-text-muted);
	font-size: 0.8rem;
	line-height: 1.45;
	max-width: 64ch;
	opacity: 0.9;
}
.fp-min-sida-tranare-coach-link-wrap {
	margin: 0 0 0.9rem;
}
.fp-min-sida-tranare-coach-link {
	font-size: 0.85rem;
	color: var(--fp-accent);
	text-decoration: none;
	border-bottom: 1px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.45);
	padding-bottom: 1px;
}
.fp-min-sida-tranare-coach-link:hover {
	color: #f1f277;
	border-bottom-color: rgba(241, 242, 119, 0.75);
}
.fp-min-sida-coach-empty {
	padding: 1rem 1.1rem;
	background: rgba(255, 255, 255, 0.03);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 0.8rem;
}
.fp-min-sida-coach-empty-title {
	margin: 0 0 0.45rem;
	font-size: 1rem;
	color: var(--fp-text);
}
.fp-min-sida-coach-empty-desc {
	margin: 0 0 0.8rem;
	font-size: 0.9rem;
	color: var(--fp-text-muted);
	line-height: 1.45;
	max-width: 62ch;
}
.fp-min-sida-coach-empty-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.55rem;
}
.fp-min-sida-tranare-links a {
	color: var(--fp-text-muted);
	text-decoration: none;
	padding: 0.4rem 0.7rem;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.05);
	border: 1px solid rgba(255, 255, 255, 0.08);
	transition: color 0.2s, background 0.2s, border-color 0.2s;
}
.fp-min-sida-tranare-links a:hover {
	color: var(--fp-accent);
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.08);
	border-color: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.25);
}
.fp-min-sida-tranare-links-sep {
	color: var(--fp-text-muted);
	opacity: 0.4;
	user-select: none;
	font-size: 0.65rem;
}
.fp-min-sida-tranare-main .fp-min-sida-admin-card {
	background: rgba(0,0,0,0.2);
	border: 1px solid rgba(255,255,255,0.08);
	border-radius: 0.75rem;
	transition: transform 0.2s, border-color 0.2s, background 0.2s;
}
.fp-min-sida-tranare-main .fp-min-sida-admin-card:hover {
	transform: translateY(-2px);
	border-color: var(--fp-accent);
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.08);
	box-shadow: 0 2px 12px rgba(0,0,0,0.15);
}
.fp-min-sida-tranare-main .fp-min-sida-admin-card-label {
	color: var(--fp-text);
}
/* Tränarvy: mindre marginal mellan sektioner */
.fp-min-sida-tranare-view .fp-min-sida-tranare-main {
	margin-bottom: 1rem;
}

/* Bjud in spelare – visas i tränarlänkraden (dashboard) */
/* Tränare: Fystester och resultat – mindre tydlig (Prio 2) */
/* Formulärsidan (när man tryckt på knappen) */
.fp-min-sida-invite-form-section {
	max-width: 480px;
	margin: 0.5rem 0 2rem;
	padding: 1.25rem 1.1rem 1.75rem;
	box-sizing: border-box;
	/* Tvinga ljus text – undvik att h3/brödtext ärv mörk färg från parent theme */
	color: #fff;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.06) 0%, rgba(255, 255, 255, 0.02) 100%);
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 1rem;
}
.fp-min-sida-invite-title {
	font-size: 1rem;
	font-weight: 800;
	color: var(--fp-text);
	margin: 0 0 0.35rem;
}
.fp-min-sida-invite-locate {
	font-size: 0.85rem;
	color: rgba(255, 255, 200, 0.95);
	margin: 0 0 0.75rem;
	padding: 0.5rem 0.65rem;
	border-left: 3px solid var(--fp-accent);
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.08);
	border-radius: 0 6px 6px 0;
	line-height: 1.45;
}
.fp-min-sida-invite-subtitle {
	font-size: 0.8125rem;
	font-weight: 800;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--fp-accent);
	margin: 1.25rem 0 0.5rem;
	line-height: 1.3;
}
.fp-min-sida-invite-subtitle:first-of-type {
	margin-top: 0.75rem;
}
.fp-min-sida-invite-hr {
	border: none;
	border-top: 1px solid rgba(255, 255, 255, 0.12);
	margin: 1.25rem 0 0.5rem;
}
.fp-min-sida-invite-capacity {
	font-size: 0.9rem;
	color: rgba(255, 255, 255, 0.88);
	margin: 0 0 0.25rem;
	font-weight: 600;
}
.fp-min-sida-invite-desc {
	font-size: 0.9rem;
	color: rgba(226, 232, 240, 0.92);
	margin: 0 0 1rem;
	line-height: 1.5;
}
.fp-min-sida-invite-join-actions {
	margin-top: 1rem;
}
.fp-min-sida-invite-join-actions p,
.fp-min-sida-invite-join-actions-inner {
	margin: 0 0 0.75rem;
	display: flex;
	flex-wrap: wrap;
	gap: 0.65rem;
	align-items: center;
	justify-content: flex-start;
}
.fp-min-sida-invite-form-section .fp-min-sida-invite-join-actions button.fp-app-btn {
	appearance: none;
	-webkit-appearance: none;
	font-family: inherit;
	cursor: pointer;
}
.fp-min-sida-invite-join-actions .fp-app-btn {
	width: auto;
	flex: 0 1 auto;
	max-width: 100%;
	box-sizing: border-box;
	padding: 0.7rem 1.1rem;
	min-height: max(2.75rem, var(--fp-touch-target));
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.03em;
	text-transform: none;
	line-height: 1.2;
}
/* Smala telefoner: stapla laglänk-knapparna så etiketter inte klämms ihop på en rad */
@media (max-width: 380px) {
	.fp-min-sida-invite-join-actions-inner {
		flex-direction: column;
		align-items: stretch;
	}
	.fp-min-sida-invite-join-actions .fp-app-btn {
		width: 100%;
		justify-content: center;
	}
}
.fp-min-sida-invite-join-primary {
	min-width: min(100%, 11rem);
}
.fp-min-sida-invite-form-section .fp-min-sida-invite-btn-revoke.fp-app-btn-outline {
	border-color: rgba(255, 255, 255, 0.38);
	color: rgba(248, 250, 252, 0.95);
	background: rgba(255, 255, 255, 0.04);
}
@media (hover: hover) and (pointer: fine) {
	.fp-min-sida-invite-form-section .fp-min-sida-invite-btn-revoke.fp-app-btn-outline:hover {
		border-color: rgba(255, 255, 255, 0.52);
		color: #fff;
		background: rgba(255, 255, 255, 0.08);
	}
}
.fp-min-sida-invite-form-section .fp-min-sida-invite-join-actions .fp-app-btn:focus-visible {
	outline: none;
	box-shadow: 0 0 0 2px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.45);
}
.fp-min-sida-invite-btn-revoke {
	margin-left: 0;
}
.fp-min-sida-invite-active-msg {
	padding: 0.65rem 0.75rem;
	margin-bottom: 0.85rem !important;
	border-radius: 8px;
	border: 1px solid rgba(255, 255, 255, 0.1);
	background: rgba(0, 0, 0, 0.22);
}
.fp-min-sida-invite-form-section .fp-min-sida-msg {
	font-size: 0.9rem;
}
.fp-min-sida-invite-missing-page p {
	margin: 0 0 0.65rem;
}
.fp-min-sida-invite-missing-page p:last-child {
	margin-bottom: 0;
}
.fp-min-sida-invite-missing-page .fp-app-btn {
	margin-top: 0.35rem;
	display: inline-block;
	text-decoration: none;
}
.fp-min-sida-invite-form-section label[for="fp_join_link_readonly"],
.fp-min-sida-invite-link-label {
	display: block;
	font-weight: 600;
	font-size: 0.9rem;
	margin-bottom: 0.35rem;
	color: #fff;
}
.fp-min-sida-invite-link-result {
	margin: 0 0 1.25rem;
	padding: 1rem 1rem 1.1rem;
	border-radius: 12px;
	border: 1px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.35);
	background: linear-gradient(165deg, rgba(var(--brand-accent-rgb, 212, 212, 30), 0.14) 0%, rgba(0, 0, 0, 0.35) 100%);
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
}
.fp-min-sida-invite-link-result-lead {
	margin: 0 0 0.35rem;
	font-size: 1.05rem;
	font-weight: 800;
	color: #fff;
	letter-spacing: -0.02em;
}
.fp-min-sida-invite-link-result-hint {
	margin: 0 0 0.85rem;
	font-size: 0.88rem;
	line-height: 1.45;
	color: rgba(248, 250, 252, 0.9);
}
.fp-min-sida-invite-link-row {
	display: flex;
	flex-wrap: wrap;
	align-items: stretch;
	gap: 0.5rem;
	margin: 0 0 0.35rem;
}
.fp-min-sida-invite-form-section #fp_join_link_readonly,
.fp-min-sida-invite-form-section .fp-min-sida-invite-link-field {
	flex: 1 1 12rem;
	min-width: 0;
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	padding: 0.65rem 0.8rem;
	border-radius: 8px;
	border: 1px solid rgba(255, 255, 255, 0.22);
	background: rgba(0, 0, 0, 0.5);
	color: #fff;
	font-size: 0.8125rem;
	line-height: 1.35;
	word-break: break-all;
}
.fp-min-sida-invite-copy-btn {
	flex: 0 0 auto;
	width: auto;
	min-width: 7.5rem;
	align-self: stretch;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.65rem 1rem;
	font-size: 0.8rem;
	transition: background 0.2s ease, box-shadow 0.2s ease, transform 0.1s ease;
}
.fp-min-sida-invite-copy-btn.fp-app-btn-primary.is-copied {
	background: rgba(34, 197, 94, 0.95) !important;
	color: #052e16 !important;
	border-color: transparent !important;
	box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.35);
}
.fp-min-sida-invite-link-foot {
	margin: 0.35rem 0 0;
	min-height: 1.25em;
	font-size: 0.82rem;
	line-height: 1.4;
	color: rgba(226, 232, 240, 0.92);
}
@media (max-width: 420px) {
	.fp-min-sida-invite-link-row .fp-min-sida-invite-copy-btn {
		flex: 1 1 100%;
		width: 100%;
		min-width: 0;
	}
}
.fp-min-sida-invite-form label {
	display: block;
	font-weight: 600;
	font-size: 0.9rem;
	margin-bottom: 0.35rem;
	color: var(--fp-text);
}
.fp-min-sida-invite-form textarea {
	width: 100%;
	max-width: 400px;
	padding: 0.5rem 0.75rem;
	border: 1px solid var(--fp-border);
	border-radius: 6px;
	background: var(--fp-bg-card);
	color: var(--fp-text);
	font-family: inherit;
	font-size: 0.95rem;
	margin-bottom: 1rem;
}
.fp-min-sida-invite-form button {
	margin-top: 0.25rem;
}

/* Tränare: spelardetalj – genomförda pass + viktsprogression */
.fp-min-sida-coach-spelare-stack {
	max-width: 40rem;
	margin-inline: auto;
}
.fp-min-sida-coach-spelare-stack .fp-min-sida-hero {
	border-bottom: none;
	margin-bottom: 0.5rem;
}
.fp-coach-spelare-weights-stack {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}
.fp-spelare-detail-section--cards {
	border-top: none;
	padding-top: 0;
}
.fp-spelare-detail-heading--stack {
	margin-bottom: 0.35rem;
}
.fp-spelare-detail-weights-lead {
	margin: 0 0 0.75rem;
	font-size: 0.875rem;
	line-height: 1.45;
	color: var(--fp-text-muted);
}
.fp-coach-spelare-remove .fp-spelare-remove-form {
	margin-top: 0.75rem;
}
.fp-spelare-detail-section {
	margin-bottom: 2rem;
	padding: 1.25rem 0;
	border-top: 1px solid rgba(255,255,255,0.08);
}
.fp-spelare-detail-heading {
	font-size: 1rem;
	font-weight: 800;
	letter-spacing: 0.04em;
	color: var(--fp-accent);
	margin: 0 0 0.75rem;
}
.fp-spelare-detail-pass-list,
.fp-spelare-detail-weight-list {
	list-style: none;
	margin: 0;
	padding: 0;
}
.fp-spelare-detail-pass-list li,
.fp-spelare-detail-weight-list li {
	padding: 0.4rem 0;
	border-bottom: 1px solid rgba(255,255,255,0.06);
	font-size: 0.95rem;
	color: var(--fp-text);
}
.fp-spelare-detail-date {
	color: var(--fp-text-muted);
	margin-right: 0.5rem;
}
.fp-spelare-detail-empty {
	color: var(--fp-text-muted);
	font-size: 0.95rem;
	margin: 0;
}
.fp-spelare-detail-exercise {
	margin-bottom: 1.25rem;
}
.fp-spelare-detail-exercise-name {
	font-size: 0.9rem;
	font-weight: 700;
	color: var(--fp-text);
	margin: 0 0 0.35rem;
}
.fp-spelare-remove-desc {
	color: var(--fp-text-muted);
	font-size: 0.9rem;
	margin: 0 0 1rem;
	line-height: 1.45;
}
.fp-spelare-remove-form .fp-app-btn-sm {
	max-width: 22rem;
	margin-inline: auto;
	display: block;
}

/* Tränare: pass-sektion – samma panelstil som Idag/Tränarverktyg, kompakt */
.fp-min-sida-pass-section-coach {
	padding: 1.25rem 1.25rem;
	background: linear-gradient(145deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.01) 100%);
	border: 1px solid rgba(255,255,255,0.08);
	border-radius: 1rem;
	box-shadow: 0 4px 24px rgba(0,0,0,0.2);
}
.fp-min-sida-tranare-view .fp-min-sida-pass-section-coach {
	margin-bottom: 1rem;
}
.fp-min-sida-pass-coach-header {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin-bottom: 0.5rem;
}
.fp-min-sida-pass-coach-header .fp-min-sida-section-title {
	margin-bottom: 0;
}
.fp-min-sida-pass-coach-badge {
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	padding: 0.2rem 0.5rem;
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.15);
	color: var(--fp-accent);
	border-radius: 999px;
}
.fp-min-sida-pass-section-coach .fp-min-sida-pass-intro {
	margin-bottom: 0.75rem;
	font-size: 0.9rem;
	color: var(--fp-text-muted);
}
.fp-min-sida-pass-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-bottom: 0;
}
.fp-min-sida-pass-chip {
	display: inline-block;
	padding: 0.35rem 0.75rem;
	font-size: 0.8rem;
	font-weight: 600;
	color: var(--fp-text);
	background: rgba(255,255,255,0.06);
	border: 1px solid rgba(255,255,255,0.08);
	border-radius: 999px;
}
.fp-min-sida-pass-players-wrap {
	margin-top: 1rem;
	padding-top: 1rem;
	border-top: 1px solid rgba(255,255,255,0.08);
}
.fp-min-sida-tranare-view .fp-min-sida-pass-players-grid {
	gap: 0.5rem;
}
.fp-min-sida-pass-players-title {
	font-size: 0.95rem;
	font-weight: 800;
	letter-spacing: 0.04em;
	color: var(--fp-accent);
	margin: 0 0 0.5rem;
	text-transform: uppercase;
}
.fp-min-sida-tranare-view .fp-min-sida-pass-players-title {
	margin-bottom: 0.5rem;
}
.fp-min-sida-pass-players-grid {
	display: flex;
	flex-direction: column;
	gap: 0.75rem;
}
.fp-min-sida-pass-player-card {
	background: rgba(0,0,0,0.2);
	border-radius: 0.75rem;
	padding: 0.75rem 1rem;
	border: 1px solid rgba(255,255,255,0.08);
}
.fp-min-sida-pass-player-card-link {
	display: block;
	text-decoration: none;
	color: inherit;
	transition: border-color 0.2s, background 0.2s, transform 0.2s;
}
.fp-min-sida-pass-player-card-link:hover {
	border-color: var(--fp-accent);
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.08);
	transform: translateY(-1px);
}
.fp-min-sida-pass-player-info {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	margin-bottom: 0.5rem;
}
.fp-min-sida-pass-player-name {
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--fp-text);
}
.fp-min-sida-pass-player-count {
	font-size: 0.85rem;
	font-weight: 700;
	color: var(--fp-accent);
}
.fp-min-sida-pass-player-bar {
	height: 6px;
	background: rgba(255,255,255,0.08);
	border-radius: 999px;
	overflow: hidden;
}
.fp-min-sida-pass-player-bar-fill {
	height: 100%;
	background: linear-gradient(90deg, var(--fp-accent), rgba(var(--brand-accent-rgb, 212, 212, 30), 0.6));
	border-radius: 999px;
	transition: width 0.3s ease;
}

/* Tränare: Säsongsplanering – nästa pass + närvaromatris */
.fp-min-sida-sasong-title {
	font-size: 1.1rem;
	font-weight: 800;
	color: var(--fp-text);
	margin: 0 0 0.35rem;
}
/* Säsongsplanering + Närvaro inne i dashboard – Nästa pass som tydlig hero-CTA */
.fp-min-sida-pass-in-dashboard {
	margin-top: 0;
	padding-top: 0;
	border-top: none;
	background: none;
	box-shadow: none;
}
.fp-min-sida-pass-in-dashboard .fp-min-sida-sasong-title {
	font-size: 1rem;
	font-weight: 800;
	color: var(--fp-text);
	margin: 0 0 0.5rem;
}
.fp-min-sida-pass-in-dashboard .fp-min-sida-pass-intro {
	font-size: 0.875rem;
	color: var(--fp-text-muted);
	margin: 0 0 1rem;
	line-height: 1.4;
}
/* Nästa pass – stor, tydlig huvudknapp (hero) */
.fp-min-sida-pass-in-dashboard .fp-min-sida-nasta-pass-cta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.4rem 0.75rem;
	text-decoration: none;
	margin-bottom: 1.25rem;
	padding: 1.25rem 1.5rem;
	border-radius: 1rem;
	background: linear-gradient(135deg, rgba(var(--brand-accent-rgb, 212, 212, 30), 0.28) 0%, rgba(var(--brand-accent-rgb, 212, 212, 30), 0.14) 100%);
	border: 1px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.5);
	color: var(--fp-text);
	transition: background 0.2s, border-color 0.2s, transform 0.15s;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.2);
}
.fp-min-sida-pass-in-dashboard .fp-min-sida-nasta-pass-cta:hover {
	background: linear-gradient(135deg, rgba(var(--brand-accent-rgb, 212, 212, 30), 0.35) 0%, rgba(var(--brand-accent-rgb, 212, 212, 30), 0.2) 100%);
	border-color: var(--fp-accent);
	transform: translateY(-1px);
	box-shadow: 0 4px 16px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.15);
}
.fp-min-sida-pass-in-dashboard .fp-min-sida-nasta-pass-label {
	width: 100%;
	font-size: 0.65rem;
	font-weight: 800;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--fp-accent);
	opacity: 0.95;
}
.fp-min-sida-pass-in-dashboard .fp-min-sida-nasta-pass-schema {
	width: 100%;
	font-size: 0.75rem;
	font-weight: 600;
	color: var(--fp-text-muted);
	margin-top: -0.2rem;
}
.fp-min-sida-pass-in-dashboard .fp-min-sida-nasta-pass-name {
	font-weight: 800;
	font-size: 1.25rem;
	letter-spacing: -0.01em;
	flex: 1;
	min-width: 0;
	color: #fff;
}
.fp-min-sida-pass-in-dashboard .fp-min-sida-nasta-pass-arrow {
	font-size: 1.35rem;
	font-weight: 700;
	color: var(--fp-accent);
	opacity: 1;
}
/* Sekundär CTA när alla pass är klara */
.fp-min-sida-pass-in-dashboard .fp-min-sida-nasta-pass-cta-secondary {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.65rem 1rem;
	font-size: 0.9rem;
	font-weight: 600;
	background: rgba(255, 255, 255, 0.06);
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 0.5rem;
	margin-bottom: 1rem;
}
.fp-min-sida-pass-in-dashboard .fp-min-sida-nasta-pass-cta-secondary:hover {
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.1);
	border-color: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.3);
}
.fp-min-sida-tranare-dashboard .fp-min-sida-traningsval-tranare + .fp-min-sida-pass-section-coach {
	margin-top: 0.6rem;
}
/* Tränare: KPI-rad + sekundär CTA i dashboard */
.fp-min-sida-coach-kpi {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0.5rem 0.65rem;
	margin: 0 0 1rem;
	padding: 0.65rem 0.75rem;
	background: rgba(0, 0, 0, 0.22);
	border: 1px solid rgba(255, 255, 255, 0.07);
	border-radius: 0.75rem;
}
.fp-min-sida-coach-kpi-item {
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
}
.fp-min-sida-coach-kpi-value {
	font-size: 1.2rem;
	font-weight: 800;
	color: #fff;
	line-height: 1.1;
}
.fp-min-sida-coach-kpi-value--text {
	font-size: 0.78rem;
	font-weight: 700;
	line-height: 1.25;
	color: var(--fp-accent);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.fp-min-sida-coach-kpi-label {
	font-size: 0.62rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--fp-text-muted);
	line-height: 1.25;
}
.fp-min-sida-coach-kpi-item--next {
	grid-column: span 1;
}
.fp-min-sida-coach-kpi-item--invite {
	text-decoration: none;
	color: inherit;
	cursor: pointer;
	transition: background 0.15s, transform 0.15s;
	border-radius: 0.4rem;
	margin: -0.25rem -0.4rem;
	padding: 0.25rem 0.4rem;
}
.fp-min-sida-coach-kpi-item--invite .fp-min-sida-coach-kpi-value {
	color: var(--fp-accent);
}
.fp-min-sida-coach-kpi-item--invite:hover {
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.1);
}
.fp-min-sida-coach-kpi-item--invite:hover .fp-min-sida-coach-kpi-label {
	color: var(--fp-accent);
}
.fp-min-sida-coach-secondary-cta {
	margin: 0.35rem 0 0;
	text-align: center;
	font-size: 0.85rem;
}
.fp-min-sida-coach-secondary-cta-link {
	color: var(--fp-accent);
	text-decoration: none;
	border-bottom: 1px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.4);
	padding-bottom: 1px;
}
.fp-min-sida-coach-secondary-cta-link:hover {
	color: #f1f277;
	border-bottom-color: rgba(241, 242, 119, 0.75);
}
.fp-min-sida-pass-in-dashboard .fp-min-sida-nasta-pass-cta--invite-primary {
	border-color: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.65);
	box-shadow: 0 2px 16px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.12);
	margin-bottom: 0.4rem;
}
.fp-min-sida-narvaro-modern {
	margin-top: 0.75rem;
	padding-top: 0.75rem;
	border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.fp-min-sida-narvaro-modern-title {
	font-size: 0.75rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--fp-accent);
	margin: 0 0 0.35rem;
}
.fp-min-sida-narvaro-desc {
	font-size: 0.8rem;
	color: var(--fp-text-muted);
	line-height: 1.45;
	margin: 0 0 0.65rem;
	max-width: 42em;
}
.fp-min-sida-narvaro-modern--single {
	margin-top: 0.55rem;
	padding-top: 0.55rem;
}
.fp-min-sida-narvaro-modern--single .fp-min-sida-narvaro-modern-title {
	margin-bottom: 0.2rem;
}
.fp-min-sida-narvaro-modern--single .fp-min-sida-narvaro-desc {
	margin-bottom: 0.45rem;
	font-size: 0.78rem;
	max-width: 38em;
}
.fp-min-sida-narvaro-modern--single .fp-min-sida-narvaro-list {
	gap: 0.28rem;
}
.fp-min-sida-narvaro-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
}
.fp-narvaro-card-link {
	display: flex;
	align-items: center;
	flex-wrap: nowrap;
	gap: 0.75rem;
	padding: 0.6rem 0.85rem;
	background: rgba(0, 0, 0, 0.25);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 10px;
	text-decoration: none;
	color: inherit;
	transition: border-color 0.2s, background 0.2s;
}
.fp-narvaro-card-link:hover {
	background: rgba(255, 255, 255, 0.06);
	border-color: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.3);
}
.fp-narvaro-card-name {
	font-weight: 600;
	font-size: 0.95rem;
	color: var(--fp-text);
	flex: 1;
	min-width: 0;
}
.fp-narvaro-card-passes {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	flex: 0 1 clamp(8rem, 26vw, 14rem);
	min-width: 8rem;
}
.fp-narvaro-progress-track {
	position: relative;
	display: block;
	width: 100%;
	height: 0.45rem;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.1);
	border: 1px solid rgba(255, 255, 255, 0.12);
	overflow: hidden;
}
.fp-narvaro-progress-fill {
	position: absolute;
	inset: 0 auto 0 0;
	height: 100%;
	background: linear-gradient(90deg, rgba(var(--brand-accent-rgb, 212, 212, 30), 0.35) 0%, rgba(var(--brand-accent-rgb, 212, 212, 30), 0.9) 100%);
	border-radius: inherit;
}
.fp-narvaro-progress-text {
	font-size: 0.75rem;
	font-weight: 700;
	color: var(--fp-text-muted);
	min-width: 2.4rem;
	text-align: right;
}
.fp-narvaro-card-sum {
	font-size: 0.8rem;
	font-weight: 700;
	color: var(--fp-text-muted);
	min-width: 2.5rem;
	text-align: right;
}

.fp-min-sida-nasta-pass-block {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	flex-wrap: wrap;
	margin: 1rem 0 1.25rem;
	padding: 1rem 1.25rem;
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.12);
	border: 1px solid var(--fp-accent);
	border-radius: var(--fp-radius-sm);
}
.fp-min-sida-nasta-pass-label {
	font-size: 0.75rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--fp-accent);
}
.fp-min-sida-nasta-pass-cta {
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--fp-text);
	text-decoration: none;
	transition: color 0.2s;
}
.fp-min-sida-nasta-pass-cta:hover {
	color: var(--fp-accent);
}
.fp-min-sida-narvaro-wrap {
	margin-top: 1rem;
	padding-top: 1rem;
	border-top: 1px solid rgba(255,255,255,0.08);
}
.fp-min-sida-narvaro-table-wrap {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}
.fp-min-sida-narvaro-table {
	width: 100%;
	min-width: 320px;
	border-collapse: collapse;
	font-size: 0.9rem;
}
.fp-min-sida-narvaro-table th,
.fp-min-sida-narvaro-table td {
	padding: 0.5rem 0.4rem;
	text-align: center;
	border-bottom: 1px solid rgba(255,255,255,0.06);
}
.fp-min-sida-narvaro-table th {
	font-weight: 700;
	color: var(--fp-text-muted);
	font-size: 0.75rem;
	letter-spacing: 0.03em;
}
.fp-narvaro-col-player {
	text-align: left !important;
	padding-left: 0 !important;
	min-width: 120px;
}
.fp-narvaro-col-pass {
	min-width: 2.5rem;
}
.fp-narvaro-col-sum {
	font-weight: 700;
	color: var(--fp-accent);
	font-size: 0.85rem;
}
.fp-narvaro-player-link {
	color: var(--fp-text);
	text-decoration: none;
	font-weight: 600;
}
.fp-narvaro-player-link:hover {
	color: var(--fp-accent);
}
.fp-narvaro-done {
	color: var(--fp-accent);
	font-weight: 700;
}
.fp-narvaro-pending {
	color: var(--fp-text-muted);
	font-size: 0.85rem;
}

/* ========== Mina träningsupplägg (lista upplägg) ========== */
.fp-upplagg-list .fp-app-main,
.fp-schema-single .fp-app-main {
	max-width: 800px;
	margin-left: auto;
	margin-right: auto;
	padding: 1.5rem 1.25rem;
	padding-bottom: max(2rem, env(safe-area-inset-bottom));
}
.fp-back-link {
	display: inline-block;
	color: var(--fp-accent) !important;
	text-decoration: none;
	font-size: 0.9rem;
	margin-bottom: 1rem;
	font-weight: 600;
}
.fp-back-link:visited,
.fp-back-link:hover,
.fp-back-link:focus,
.fp-back-link:active {
	color: var(--fp-accent) !important;
	text-decoration: underline;
}
.fp-upplagg-hero,
.fp-schema-passes-list .fp-schema-title,
.fp-pass-detail .fp-pass-detail-title {
	margin-bottom: 1rem;
}
.fp-pass-detail-single .fp-pass-detail-pass-title {
	font-size: 0.95rem;
	color: var(--fp-text-muted);
	margin: 0 0 0.25rem;
	font-weight: 600;
}
.fp-pass-detail-single .fp-pass-detail-ex-title {
	font-size: 1.75rem;
	font-weight: 800;
	color: var(--fp-text);
	margin: 0 0 1rem;
	line-height: 1.2;
}
.fp-pass-detail-single .fp-ovning-video-wrap {
	margin-bottom: 1.5rem;
}
.fp-pass-ex-video-link {
	display: inline-block;
	color: var(--fp-accent);
	font-weight: 600;
	margin-bottom: 1rem;
}
.fp-pass-ex-nav {
	margin-top: 1.5rem;
}
.fp-pass-ex-nav .fp-app-btn,
.fp-pass-ex-nav form .fp-app-btn {
	width: auto;
}
.fp-pass-detail-all .fp-pass-exercise-block {
	margin-bottom: 2.5rem;
	padding-bottom: 2rem;
	border-bottom: 1px solid var(--fp-border);
}
.fp-pass-detail-all .fp-pass-exercise-block:last-child {
	border-bottom: 0;
	padding-bottom: 0;
}
.fp-pass-detail-all .fp-pass-detail-ex-title {
	font-size: 1.75rem;
	font-weight: 800;
	color: #fff;
	margin: 0 0 1rem;
	line-height: 1.2;
}
/* Superset: ram grupperar övningar; titeln är etikett (inte samma hierarki som övningstitel). */
.fp-pass-detail-all .fp-pass-superset-wrap,
.fp-pass-detail-single .fp-pass-superset-wrap {
	margin: 0 0 1.75rem;
	padding: 1rem 1rem 1.25rem;
	border: 1px solid var(--fp-border, rgba(255, 255, 255, 0.12));
	border-radius: 0.75rem;
	border-left-width: 3px;
	border-left-color: var(--fp-accent, var(--brand-accent, #D4D41E));
	background: rgba(255, 255, 255, 0.02);
}
.fp-pass-detail-all .fp-pass-superset-title,
.fp-pass-detail-single .fp-pass-superset-title {
	margin: 0 0 1rem;
	padding: 0;
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	line-height: 1.3;
	color: var(--fp-accent);
	text-shadow: 0 0 12px var(--fp-accent-glow), 0 0 24px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.18);
}
.fp-pass-detail-all .fp-pass-superset-wrap .fp-pass-exercise-block:last-child {
	margin-bottom: 0;
	padding-bottom: 0;
}
.fp-upplagg-title {
	font-size: 1.75rem;
	font-weight: 800;
	color: var(--fp-text);
	margin: 0 0 0.5rem;
}
.fp-upplagg-desc {
	color: var(--fp-text-muted);
	font-size: 1rem;
	margin: 0 0 1.5rem;
}
.fp-upplagg-team-official-notice {
	margin: -0.75rem 0 1.25rem;
	padding: 0.75rem 1rem;
	font-size: 0.875rem;
	line-height: 1.45;
	color: var(--fp-text-muted);
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.08);
	border: 1px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.25);
	border-radius: 0.65rem;
	max-width: 52ch;
}
.fp-upplagg-empty {
	padding: 2rem;
	text-align: center;
	color: var(--fp-text-muted);
}
.fp-upplagg-cards {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem;
}
@media (min-width: 600px) {
	.fp-upplagg-cards {
		grid-template-columns: repeat(2, 1fr);
	}
}
.fp-upplagg-card.fp-card {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: 160px;
	padding: 0;
	border: 1px solid rgba(255,255,255,0.06);
	border-radius: var(--fp-radius);
	overflow: hidden;
	text-decoration: none;
	color: inherit;
	transition: transform 0.2s ease, border-color 0.2s;
}
.fp-upplagg-card.fp-card:hover {
	transform: translateY(-4px);
	border-color: var(--fp-accent);
}
/* Tydligt valt aktivt upplägg (spelare) – ram + glow, skiljer från övriga kort. */
.fp-upplagg-card.fp-card.fp-upplagg-card--is-active-schema {
	border-color: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.78);
	box-shadow:
		0 0 0 1px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.35),
		0 0 28px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.22),
		inset 0 0 0 1px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.1);
}
.fp-upplagg-card.fp-card.fp-upplagg-card--is-active-schema:hover {
	border-color: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.95);
	box-shadow:
		0 0 0 1px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.45),
		0 0 36px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.28),
		inset 0 0 0 1px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.14);
}
.fp-upplagg-card-wrap--inactive .fp-upplagg-card.fp-card:not(.fp-upplagg-card--is-active-schema) {
	filter: saturate(0.88) brightness(0.94);
	border-color: rgba(255, 255, 255, 0.05);
}
.fp-upplagg-card-wrap--inactive .fp-upplagg-card.fp-card:not(.fp-upplagg-card--is-active-schema):hover {
	filter: saturate(0.95) brightness(0.98);
	border-color: rgba(255, 255, 255, 0.12);
	transform: translateY(-3px);
}
.fp-upplagg-card--complete {
	border-color: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.45);
}
.fp-upplagg-card--complete:hover {
	border-color: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.65);
}
.fp-upplagg-card.fp-upplagg-card--is-active-schema.fp-upplagg-card--complete {
	border-color: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.82);
	box-shadow:
		0 0 0 1px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.4),
		0 0 32px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.26),
		inset 0 0 0 1px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.12);
}
.fp-upplagg-card-complete-overlay {
	position: absolute;
	inset: 0;
	border-radius: inherit;
	z-index: 4;
	pointer-events: none;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(
		165deg,
		rgba(0, 0, 0, 0.5) 0%,
		rgba(0, 0, 0, 0.68) 48%,
		rgba(0, 0, 0, 0.58) 100%
	);
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05);
}
.fp-upplagg-card-complete-check {
	font-size: clamp(2.5rem, 11vw, 3.75rem);
	line-height: 1;
	font-weight: 900;
	color: var(--fp-accent);
	text-shadow:
		0 0 26px var(--fp-accent-glow),
		0 0 52px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.45),
		0 2px 14px rgba(0, 0, 0, 0.85);
	filter: drop-shadow(0 1px 3px rgba(0, 0, 0, 0.9));
}
.fp-upplagg-card .fp-card-bg {
	background-image: var(--fp-card-bg, none);
}
.fp-upplagg-card .fp-card-overlay {
	background: linear-gradient(to top, rgba(0,0,0,0.97) 0%, rgba(0,0,0,0.85) 35%, rgba(0,0,0,0.5) 65%, rgba(0,0,0,0.25) 100%);
}
.fp-upplagg-card .fp-card-meta {
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--fp-accent);
	margin-bottom: 0.25rem;
}
.fp-upplagg-card .fp-card-title {
	font-size: 1.2rem;
	margin-bottom: 0.35rem;
}
.fp-upplagg-card-wrap {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 0.45rem;
}
.fp-upplagg-card-progress {
	position: absolute;
	top: 0.45rem;
	right: 0.45rem;
	max-width: calc(100% - 5.5rem);
	padding: 0.2rem 0.5rem;
	border-radius: 999px;
	background: var(--fp-accent);
	color: var(--fp-bg);
	font-size: 0.65rem;
	font-weight: 800;
	line-height: 1.25;
	text-align: center;
	letter-spacing: 0.02em;
	white-space: nowrap;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35), 0 0 12px var(--fp-accent-glow);
	pointer-events: none;
	z-index: 3;
}
.fp-upplagg-card-progress--complete {
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.4), 0 0 14px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.45);
}
.fp-upplagg-card-active-badge {
	position: absolute;
	top: 0.5rem;
	left: 0.5rem;
	padding: 0.2rem 0.5rem;
	border-radius: 999px;
	background: rgba(0, 0, 0, 0.55);
	color: var(--fp-accent, #6ee7b7);
	font-size: 0.65rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	pointer-events: none;
	z-index: 3;
}
.fp-upplagg-card-wrap--active .fp-upplagg-card-active-badge {
	background: rgba(0, 0, 0, 0.72);
	box-shadow:
		0 0 0 1px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.55),
		0 2px 12px rgba(0, 0, 0, 0.45);
}
.fp-upplagg-card-active-badge--inactive {
	color: rgba(255, 255, 255, 0.68);
	border: 1px solid rgba(255, 255, 255, 0.14);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}
/* Radåtgärd under kort: inte fullbredds “primärknapp”, undvik massiv gul yta på mobil. */
.fp-upplagg-card-actions {
	margin: 0;
	width: 100%;
	display: flex;
	justify-content: flex-start;
}

/* Aktivera-program: dialog ska ligga inuti .fp-app-wrap (tema-variabler + gula knappar). Explicit hex som skydd mot Astra-läckage. */
.fp-upplagg-activate-modal.fp-bockat-modal {
	padding: max(0.75rem, env(safe-area-inset-top, 0px)) 1rem max(0.75rem, env(safe-area-inset-bottom, 0px));
	box-sizing: border-box;
}
.fp-upplagg-activate-modal .fp-bockat-modal-backdrop {
	background: rgba(0, 0, 0, 0.78);
}
@supports (backdrop-filter: blur(6px)) {
	.fp-upplagg-activate-modal .fp-bockat-modal-backdrop {
		backdrop-filter: blur(6px);
		-webkit-backdrop-filter: blur(6px);
	}
}
.fp-upplagg-activate-modal .fp-bockat-modal-inner {
	background: var(--brand-surface, #1a1a1a);
	color: #ffffff;
	border: 1px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.45);
	box-shadow:
		0 0 0 1px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.12),
		0 20px 56px rgba(0, 0, 0, 0.65);
	width: 100%;
	max-width: 21rem;
	margin: 0 auto;
	box-sizing: border-box;
	padding: 1.5rem 1.35rem 1.4rem;
}
.fp-upplagg-activate-modal .fp-bockat-modal-text {
	color: #ffffff;
	margin-bottom: 1.25rem;
	font-weight: 600;
}
.fp-upplagg-activate-modal .fp-app-btn-primary {
	background: var(--brand-accent, #D4D41E) !important;
	color: var(--brand-bg, #0a0a0a) !important;
	border-color: var(--brand-accent, #D4D41E) !important;
}
.fp-upplagg-activate-modal .fp-app-btn-outline {
	background: transparent !important;
	color: var(--brand-accent, #D4D41E) !important;
	border-color: var(--brand-accent, #D4D41E) !important;
}
@media (hover: hover) and (pointer: fine) {
	.fp-upplagg-activate-modal .fp-app-btn-outline:hover {
		background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.08) !important;
	}
}

.fp-upplagg-active-form {
	margin: 0;
	width: auto;
	max-width: 100%;
}
.fp-upplagg-active-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: auto;
	max-width: 100%;
	min-height: 2.5rem;
	padding: 0.35rem 0.85rem;
	border: 1px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.45);
	border-radius: 999px;
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.06);
	color: var(--fp-accent);
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.02em;
	line-height: 1.25;
	text-align: center;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
	tap-highlight-color: transparent;
	box-shadow: none;
	transition:
		background 0.18s ease,
		color 0.18s ease,
		border-color 0.18s ease,
		transform 0.12s ease;
}
.fp-upplagg-active-btn:active {
	transform: scale(0.98);
}
.fp-upplagg-active-btn:focus-visible {
	outline: 2px solid var(--fp-accent);
	outline-offset: 3px;
}
@media (hover: hover) and (pointer: fine) {
	.fp-upplagg-active-btn:hover {
		background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.11);
		border-color: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.65);
	}
}
.fp-upplagg-active-btn.fp-upplagg-active-btn--current {
	background: rgba(0, 0, 0, 0.45);
	color: var(--fp-accent);
	border: 1px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.35);
	font-weight: 600;
	letter-spacing: 0.03em;
	font-size: 0.68rem;
	box-shadow: none;
}
@media (hover: hover) and (pointer: fine) {
	.fp-upplagg-active-btn.fp-upplagg-active-btn--current:hover {
		background: rgba(0, 0, 0, 0.38);
		color: var(--fp-accent);
		border-color: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.5);
	}
}
.fp-upplagg-active-btn-secondary {
	background: transparent;
	color: rgba(255, 255, 255, 0.55);
	font-weight: 500;
	font-size: 0.68rem;
	border: 1px solid rgba(255, 255, 255, 0.14);
	box-shadow: none;
}
@supports (backdrop-filter: blur(12px)) {
	.fp-upplagg-active-btn-secondary {
		backdrop-filter: blur(12px);
		-webkit-backdrop-filter: blur(12px);
		background: rgba(255, 255, 255, 0.03);
	}
}
.fp-upplagg-active-btn-secondary:hover {
	background: rgba(255, 255, 255, 0.06);
	color: var(--fp-text-muted);
	border-color: rgba(255, 255, 255, 0.2);
	box-shadow: none;
}
@media (hover: hover) and (pointer: fine) {
	.fp-upplagg-active-btn-secondary:hover {
		transform: none;
	}
}
.fp-schema-active-panel {
	margin: 0 0 1.25rem;
	padding: 1rem 1.1rem;
	background: var(--fp-bg-card);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: var(--fp-radius);
}
.fp-schema-active-msg {
	margin: 0 0 0.75rem;
	font-size: 0.95rem;
	color: var(--fp-text-muted);
}
.fp-schema-active-form {
	margin: 0;
}
.fp-schema-active-form + .fp-schema-active-form {
	margin-top: 0.65rem;
}
.single-fp_traningsschema .fp-schema-active-panel .fp-app-btn {
	width: 100%;
	max-width: 100%;
}

/* ========== Upplägg: lista pass ========== */
.fp-schema-title {
	font-size: 1.75rem;
	font-weight: 800;
	color: var(--fp-text);
	margin: 0 0 0.5rem;
}
.fp-schema-desc {
	color: var(--fp-text-muted);
	margin: 0 0 1.5rem;
}
.fp-schema-empty {
	color: var(--fp-text-muted);
	margin: 0;
}
.fp-pass-cards {
	display: grid;
	gap: 1rem;
}
.fp-pass-week-stack {
	display: grid;
	gap: 1.25rem;
}
.fp-pass-week-group {
	background: var(--fp-week-bg, var(--brand-surface-2, #111111));
	border: 1px solid var(--fp-week-border, rgba(255, 255, 255, 0.08));
	border-radius: var(--fp-radius);
	padding: 1rem 1rem 1.25rem;
}
.fp-pass-week-group--0 {
	--fp-week-bg: #0e0e0e;
	--fp-week-border: rgba(255, 255, 255, 0.06);
}
.fp-pass-week-group--1 {
	--fp-week-bg: #141414;
	--fp-week-border: rgba(255, 255, 255, 0.10);
}
.fp-pass-week-group--2 {
	--fp-week-bg: var(--brand-bg, #0a0a0a);
	--fp-week-border: rgba(255, 255, 255, 0.08);
}
.fp-pass-week-group--3 {
	--fp-week-bg: #171717;
	--fp-week-border: rgba(255, 255, 255, 0.13);
}
.fp-pass-week-group-header {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 0.75rem;
	padding: 0.25rem 0.25rem 0.85rem;
	margin-bottom: 0.85rem;
	border-bottom: 1px solid var(--fp-week-border, rgba(255, 255, 255, 0.08));
}
.fp-pass-week-group-title {
	margin: 0;
	font-size: 1.05rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: var(--fp-text);
}
.fp-pass-week-group-count {
	font-size: 0.8rem;
	color: var(--fp-text-subtle);
	font-variant-numeric: tabular-nums;
}
.fp-pass-card {
	position: relative;
	display: block;
	padding: 1.25rem;
	background: var(--fp-bg-card);
	border: 1px solid var(--fp-border);
	border-radius: var(--fp-radius);
	text-decoration: none;
	color: inherit;
	transition: border-color 0.2s, box-shadow 0.2s;
	min-height: var(--fp-touch-target);
	overflow: hidden;
}
.fp-pass-card-grid {
	display: grid;
	grid-template-columns: auto 1fr;
	grid-template-areas: "num title" "num preview";
	gap: 0.25rem 1rem;
	align-items: start;
	position: relative;
	z-index: 0;
}
.fp-pass-card:hover {
	border-color: var(--fp-accent);
	box-shadow: 0 0 0 1px var(--fp-accent);
}
.fp-pass-card-done {
	border-color: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.55);
	border-color: color-mix(in srgb, var(--fp-accent) 58%, transparent);
}
.fp-pass-card-done:hover {
	border-color: var(--fp-accent);
	box-shadow: 0 0 0 1px var(--fp-accent-glow);
}
.fp-pass-card-done-overlay {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, 0.5);
	border-radius: inherit;
	pointer-events: none;
	z-index: 1;
}
.fp-pass-card-done-check {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 3rem;
	height: 3rem;
	border-radius: 50%;
	background: var(--fp-accent);
	color: var(--fp-bg);
	font-size: 1.65rem;
	font-weight: 800;
	line-height: 3rem;
	text-align: center;
	box-shadow: 0 4px 24px rgba(0, 0, 0, 0.4), 0 0 28px var(--fp-accent-glow);
	pointer-events: none;
	z-index: 2;
}
.fp-pass-card-num {
	grid-area: num;
	width: 2.25rem;
	height: 2.25rem;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--fp-accent);
	color: var(--fp-bg);
	font-weight: 800;
	font-size: 1rem;
	border-radius: var(--fp-radius-sm);
}
.fp-pass-card-title {
	grid-area: title;
	font-size: 1.15rem;
	font-weight: 700;
	color: var(--fp-text);
	margin: 0;
}
.fp-pass-card-preview {
	grid-area: preview;
	font-size: 0.9rem;
	color: var(--fp-text-muted);
	margin: 0;
	line-height: 1.4;
}

/* ========== Pass-detaljvy (övningskort) ========== */
.fp-pass-detail-title {
	font-size: 1.75rem;
	font-weight: 800;
	color: var(--fp-text);
	margin: 0 0 0.75rem;
}
.fp-pass-detail-desc {
	color: var(--fp-text-muted);
	font-size: 1rem;
	line-height: 1.6;
	margin: 0 0 2rem;
}
.fp-pass-detail-desc p {
	margin: 0 0 0.75rem;
}
.fp-pass-detail-desc p:last-child {
	margin-bottom: 0;
}
.fp-pass-weights-pref-note {
	margin: -1rem 0 1.25rem;
	font-size: 0.875rem;
	line-height: 1.45;
	color: var(--fp-text-muted);
	max-width: 36rem;
}
.fp-pass-weights-pref-note .fp-pass-weights-pref-link {
	color: var(--fp-accent);
	text-decoration: underline;
	text-underline-offset: 2px;
}
.fp-pass-weights-pref-note .fp-pass-weights-pref-link:hover {
	color: var(--fp-text);
}
.fp-pass-exercises-heading {
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--fp-accent);
	margin: 0 0 1rem;
	text-transform: uppercase;
}
.fp-pass-exercises {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	margin-bottom: 2rem;
}
.fp-exercise-card {
	display: grid;
	grid-template-columns: 140px 1fr;
	gap: 1rem;
	align-items: start;
	padding: 1rem;
	background: var(--fp-bg-card);
	border: 1px solid var(--fp-border);
	border-radius: var(--fp-radius);
}
@media (max-width: 480px) {
	.fp-exercise-card {
		grid-template-columns: 1fr;
	}
}
.fp-exercise-media {
	position: relative;
	border-radius: var(--fp-radius-sm);
	overflow: hidden;
	aspect-ratio: 16/10;
	background: rgba(255,255,255,0.06);
}
.fp-exercise-video-thumb,
.fp-exercise-video-btn {
	display: block;
	position: relative;
	width: 100%;
	height: 100%;
	text-decoration: none;
	color: inherit;
	border: none;
	padding: 0;
	background: none;
	cursor: pointer;
	text-align: left;
}
.fp-exercise-video-btn:hover .fp-exercise-play {
	background: rgba(0,0,0,0.5);
}
.fp-exercise-video-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.fp-exercise-play {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(0,0,0,0.35);
}
.fp-exercise-play::after {
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 12px 0 12px 20px;
	border-color: transparent transparent transparent var(--fp-text);
	margin-left: 4px;
}
.fp-exercise-video-placeholder-wrap,
.fp-exercise-video-placeholder {
	width: 100%;
	height: 100%;
	display: block;
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.12);
}
.fp-exercise-body {
	min-width: 0;
}
.fp-exercise-name {
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--fp-text);
	margin: 0 0 0.5rem;
	line-height: 1.3;
}
.fp-exercise-name a {
	color: var(--fp-accent);
	text-decoration: none;
}
.fp-exercise-name a:hover {
	text-decoration: underline;
}
.fp-exercise-params {
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: 0.95rem;
	color: var(--fp-text-muted);
	line-height: 1.6;
}
.fp-exercise-params li + li {
	margin-top: 0.2rem;
}
.fp-exercise-weight-wrap {
	margin-top: 0.75rem;
}
.fp-exercise-weight-label {
	display: block;
	font-size: 0.85rem;
	color: var(--fp-text-muted);
	margin-bottom: 0.25rem;
}
.fp-exercise-weight-hint {
	display: block;
	font-size: 0.8rem;
	line-height: 1.45;
	color: var(--fp-text-muted);
	margin-bottom: 0.4rem;
	max-width: 42rem;
}
.fp-exercise-weight-set-inputs {
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
	margin-bottom: 0.25rem;
}
.fp-exercise-weight-set-row {
	display: flex;
	align-items: center;
	gap: 0.35rem;
}
.fp-exercise-weight-set-row label {
	font-size: 0.85rem;
	color: var(--fp-text-muted);
	min-width: 2.5rem;
}
.fp-exercise-weight-input {
	width: 70px;
	padding: 0.35rem 0.5rem;
	font-size: 0.95rem;
	background: var(--brand-surface, #1a1a1a) !important;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border: 1px solid rgba(255,255,255,0.25);
	border-radius: 4px;
	color: var(--fp-text) !important;
}
.fp-exercise-weight-input:focus {
	outline: none;
	border-color: var(--fp-accent);
	background: #252525 !important;
}
.fp-exercise-weight-input::placeholder {
	color: var(--fp-text-muted);
	opacity: 0.7;
}
.fp-exercise-weight-history {
	margin-top: 0.5rem;
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.35rem 0.75rem;
	font-size: 0.8rem;
	color: var(--fp-text-muted);
}
.fp-exercise-weight-history-label {
	font-weight: 600;
	margin-right: 0.25rem;
}
.fp-exercise-weight-history-item {
	display: inline-block;
	padding: 0.15rem 0.4rem;
	background: rgba(255,255,255,0.06);
	border-radius: 4px;
}
.fp-exercise-weight-history-empty {
	font-style: italic;
	opacity: 0.85;
}
.fp-pass-bocka-wrap {
	margin-top: 2rem;
	padding-top: 1.5rem;
	border-top: 1px solid rgba(255,255,255,0.08);
}
.fp-pass-bocka-form .fp-app-btn {
	min-height: var(--fp-touch-target);
}
.fp-pass-bockad-card {
	display: flex;
	align-items: center;
	gap: 0.85rem;
	padding: 0.75rem 1rem;
	margin-bottom: 1rem;
	background: rgba( var(--fp-accent-rgb, 212, 212, 30), 0.08 );
	border: 1px solid rgba( var(--fp-accent-rgb, 212, 212, 30), 0.25 );
	border-radius: 10px;
}
.fp-pass-bockad-icon {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	flex-shrink: 0;
	background: var(--fp-accent);
	color: var(--fp-bg-dark, var(--brand-bg, #0d0d0d));
	font-size: 0.85rem;
	font-weight: 700;
	border-radius: 50%;
}
.fp-pass-bockad-text {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
}
.fp-pass-bockad-count {
	font-weight: 600;
	font-size: 0.95rem;
	letter-spacing: 0.01em;
	color: var(--fp-text);
}
.fp-pass-bockad-date {
	font-size: 0.8rem;
	opacity: 0.8;
	color: var(--fp-text);
}
.fp-pass-bockad-msg {
	color: var(--fp-accent);
	font-weight: 600;
	margin: 0 0 1rem;
	padding: 0.5rem 0;
}
.fp-bockat-modal {
	position: fixed;
	inset: 0;
	z-index: 99999;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.2s, visibility 0.2s;
}
.fp-bockat-modal.fp-bockat-modal-open {
	opacity: 1;
	visibility: visible;
}
.fp-bockat-modal-backdrop {
	position: absolute;
	inset: 0;
	background: rgba(0,0,0,0.7);
}
.fp-bockat-modal-inner {
	position: relative;
	background: var(--fp-bg-card);
	border: 1px solid var(--fp-border);
	border-radius: var(--fp-radius);
	padding: 2rem 2.25rem;
	text-align: center;
	box-shadow: 0 20px 60px rgba(0,0,0,0.5);
	max-width: 400px;
}
.fp-bockat-modal-text {
	margin: 0 0 1.5rem;
	font-size: 1.05rem;
	font-weight: 500;
	line-height: 1.5;
	letter-spacing: 0.01em;
	color: var(--fp-text);
}
.fp-bockat-modal-text .fp-bockat-accent {
	display: block;
	margin-top: 0.35rem;
	font-weight: 600;
	font-size: 0.95rem;
	color: var(--fp-accent);
	letter-spacing: 0.02em;
}
.fp-bockat-modal-weights-warning {
	margin: 0 0 1rem;
	font-size: 0.9rem;
	color: var(--fp-text-muted, #666);
}
.fp-pass-feedback-form {
	margin: 0 0 1rem;
}
.fp-pass-feedback-label {
	margin: 0 0 0.5rem;
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--fp-text);
}
.fp-pass-feedback-buttons {
	display: flex;
	gap: 0.5rem;
	flex-wrap: wrap;
	margin-bottom: 0.5rem;
}
.fp-pass-feedback-btn-wrap {
	display: inline-block;
}
.fp-pass-feedback-radio {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}
.fp-pass-feedback-radio:focus + .fp-pass-feedback-btn {
	outline: 2px solid var(--fp-accent);
	outline-offset: 2px;
}
.fp-pass-feedback-radio:checked + .fp-pass-feedback-btn {
	border-color: var(--fp-accent);
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.15);
}
.fp-pass-feedback-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 50%;
	border: 2px solid var(--fp-border);
	background: var(--fp-bg-card);
	color: var(--fp-text);
	font-size: 1rem;
	font-weight: 700;
	cursor: pointer;
	transition: border-color 0.2s, background 0.2s;
}
.fp-pass-feedback-btn-wrap:hover .fp-pass-feedback-btn {
	border-color: var(--fp-accent);
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.1);
}
.fp-pass-feedback-comment-label {
	margin: 0.75rem 0 0.25rem;
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--fp-text);
}
.fp-pass-feedback-comment {
	width: 100%;
	max-width: 100%;
	padding: 0.5rem 0.75rem;
	margin-bottom: 0.75rem;
	border: 1px solid var(--fp-border);
	border-radius: 6px;
	background: var(--fp-bg-card);
	color: var(--fp-text);
	font-size: 0.9rem;
	font-family: inherit;
	resize: vertical;
	box-sizing: border-box;
}
.fp-pass-feedback-submit {
	margin-top: 0.25rem;
}
.fp-bockat-modal-btn {
	display: block;
	width: 100%;
	font-weight: 700;
	letter-spacing: 0.04em;
}
.fp-bockat-modal-rating-error {
	margin: 0 0 0.75rem;
	font-size: 0.85rem;
	color: #f87171;
	text-align: center;
}
.fp-bockat-modal-skip {
	display: block;
	width: 100%;
	margin-top: 0.75rem;
	padding: 0.45rem;
	background: transparent;
	border: none;
	color: var(--fp-text-muted);
	font-size: 0.85rem;
	font-weight: 600;
	cursor: pointer;
	text-decoration: underline;
	text-underline-offset: 2px;
	-webkit-tap-highlight-color: transparent;
}
.fp-bockat-modal-skip:hover {
	color: var(--fp-accent);
}
.fp-upplagg-activate-modal-actions {
	display: flex;
	flex-direction: column;
	gap: 0.65rem;
	margin-top: 0.15rem;
}
.fp-pass-feedback-form .fp-pass-feedback-label {
	text-align: center;
}
.fp-pass-feedback-form .fp-pass-feedback-buttons {
	justify-content: center;
}

/* Video-modal (pass-detaljvy) */
.fp-video-modal {
	position: fixed;
	inset: 0;
	z-index: 99999;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.2s ease, visibility 0.2s ease;
}
.fp-video-modal.fp-video-modal-open {
	opacity: 1;
	visibility: visible;
}
.fp-video-modal-backdrop {
	position: absolute;
	inset: 0;
	background: rgba(0,0,0,0.85);
}
.fp-video-modal-inner {
	position: relative;
	width: 90%;
	max-width: 900px;
	background: var(--fp-bg-card);
	border-radius: var(--fp-radius);
	overflow: hidden;
	box-shadow: 0 20px 60px rgba(0,0,0,0.5);
}
.fp-video-modal-close {
	position: absolute;
	top: 0.5rem;
	right: 0.5rem;
	z-index: 2;
	width: 40px;
	height: 40px;
	border: none;
	background: rgba(0,0,0,0.6);
	color: #fff;
	font-size: 1.5rem;
	line-height: 1;
	cursor: pointer;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
}
.fp-video-modal-close:hover {
	background: rgba(0,0,0,0.8);
}
.fp-video-modal-title {
	position: absolute;
	top: 0.5rem;
	left: 0.5rem;
	right: 3rem;
	z-index: 2;
	font-size: 1rem;
	font-weight: 700;
	color: #fff;
	text-shadow: 0 1px 2px rgba(0,0,0,0.8);
	margin: 0;
	pointer-events: none;
}
.fp-video-modal-player {
	position: relative;
	width: 100%;
	padding-bottom: 56.25%;
	background: #000;
}
.fp-video-modal-player iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

/* ========== Övningsbank (arkiv + enkelvy) ========== */
.fp-ovning-archive .fp-app-main,
.fp-ovning-single .fp-app-main {
	max-width: 900px;
	margin-left: auto;
	margin-right: auto;
}
.fp-ovning-hero {
	margin-bottom: 1.5rem;
}
.fp-ovning-archive-title {
	font-size: 1.75rem;
	font-weight: 800;
	color: var(--fp-text);
	margin: 0 0 0.5rem;
}
.fp-ovning-archive-desc {
	font-size: 1rem;
	color: var(--fp-text-muted);
	line-height: 1.5;
	margin: 0;
}
.fp-ovning-results-loading .fp-ovning-grid,
.fp-ovning-results-loading .fp-ovning-empty {
	opacity: 0.6;
	pointer-events: none;
}
.fp-recept-results-loading .fp-recept-grid,
.fp-recept-results-loading .fp-recept-empty {
	opacity: 0.6;
	pointer-events: none;
}
.fp-ovning-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1rem;
	margin-bottom: 1.5rem;
}
.fp-ovning-filter-form {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
}
.fp-ovning-search {
	width: 100%;
	min-width: 160px;
	max-width: 220px;
	appearance: none;
	background: var(--fp-bg-card);
	border: 1px solid var(--fp-border);
	border-radius: var(--fp-radius-sm);
	color: var(--fp-text);
	font-size: 0.95rem;
	padding: 0.6rem 1rem;
	min-height: var(--fp-touch-target);
}
.fp-ovning-search::placeholder {
	color: var(--fp-text-muted);
}
.fp-ovning-search:focus {
	outline: none;
	border-color: var(--fp-accent);
}
.fp-ovning-search-btn {
	appearance: none;
	background: var(--fp-accent);
	color: var(--fp-bg);
	border: none;
	border-radius: var(--fp-radius-sm);
	font-size: 0.9rem;
	font-weight: 600;
	padding: 0.6rem 1rem;
	min-height: var(--fp-touch-target);
	cursor: pointer;
}
.fp-ovning-search-btn:hover {
	opacity: 0.95;
}
.fp-ovning-select {
	appearance: none;
	background: var(--fp-bg-card);
	border: 1px solid var(--fp-border);
	border-radius: var(--fp-radius-sm);
	color: var(--fp-text);
	font-size: 0.95rem;
	font-weight: 600;
	padding: 0.6rem 2.25rem 0.6rem 1rem;
	min-height: var(--fp-touch-target);
	cursor: pointer;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none' stroke='%239ca3af' stroke-width='2'%3E%3Cpath d='M2 4l4 4 4-4'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 0.75rem center;
}
.fp-ovning-category-heading {
	font-size: 1.25rem;
	font-weight: 800;
	color: var(--fp-text);
	margin: 0;
}
.fp-ovning-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1rem;
}
@media (min-width: 600px) {
	.fp-ovning-grid {
		grid-template-columns: repeat(3, 1fr);
		gap: 1.25rem;
	}
}
.fp-ovning-card.fp-card {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: 140px;
	padding: 0;
	border: 1px solid rgba(255,255,255,0.06);
	border-radius: var(--fp-radius);
	overflow: hidden;
	text-decoration: none;
	color: inherit;
	transition: transform 0.2s ease, border-color 0.2s;
}
.fp-ovning-card.fp-card:hover {
	transform: translateY(-4px);
	border-color: var(--fp-accent);
}
.fp-ovning-card .fp-card-bg {
	background-image: var(--fp-card-bg, url('ovning-placeholder.svg'));
	background-color: var(--fp-bg-card);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}
.fp-ovning-card .fp-card-img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	background-color: var(--fp-bg-card);
}
.fp-ovning-card .fp-card-img--placeholder {
	object-fit: contain;
}
.fp-ovning-card .fp-card-content {
	padding: 1rem 1.25rem;
}
.fp-ovning-card .fp-card-title {
	font-size: 1rem;
	font-weight: 800;
	margin: 0;
}
.fp-ovning-play {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(0,0,0,0.35);
	pointer-events: none;
}
.fp-ovning-play::after {
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 14px 0 14px 24px;
	border-color: transparent transparent transparent rgba(255,255,255,0.95);
	margin-left: 4px;
}
.fp-ovning-empty {
	padding: 2rem;
	text-align: center;
	color: var(--fp-text-muted);
}
.fp-ovning-empty p { margin: 0 0 0.75rem; }
.fp-ovning-link-all {
	color: var(--fp-accent);
	font-weight: 600;
	text-decoration: none;
}
.fp-ovning-link-all:hover { text-decoration: underline; }
.fp-ovning-single-title {
	font-size: 1.75rem;
	font-weight: 800;
	color: var(--fp-text);
	margin: 0 0 1rem;
	line-height: 1.2;
}
.fp-ovning-video-wrap {
	margin-bottom: 1.5rem;
	border-radius: var(--fp-radius);
	overflow: hidden;
	background: #000;
	box-shadow: 0 4px 20px rgba(0,0,0,0.3);
}
.fp-ovning-video-inner {
	position: relative;
	width: 100%;
	padding-bottom: 56.25%;
}
.fp-ovning-video-inner iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}
.fp-ovning-video-poster {
	cursor: pointer;
}
.fp-ovning-video-poster img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.fp-ovning-video-play-btn {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(0,0,0,0.35);
	border: 0;
	cursor: pointer;
	padding: 0;
}
.fp-ovning-video-play-btn::after {
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 20px 0 20px 34px;
	border-color: transparent transparent transparent rgba(255,255,255,0.95);
	margin-left: 6px;
}
.fp-ovning-video-play-btn:hover { background: rgba(0,0,0,0.45); }

/* Fasad-knapp: YouTube-stilad röd play-knapp ovanpå postern. */
.fp-youtube-facade .fp-ovning-video-poster { cursor: pointer; }
.fp-youtube-facade .fp-ovning-video-play-btn {
	background: transparent;
	transition: opacity 0.15s ease;
}
.fp-youtube-facade .fp-ovning-video-play-btn::after { content: none; }
.fp-youtube-facade .fp-ovning-video-play-btn svg {
	width: 68px;
	height: 48px;
	filter: drop-shadow(0 2px 8px rgba(0,0,0,0.45));
	transition: transform 0.15s ease;
}
.fp-youtube-facade .fp-ovning-video-play-btn .fp-yt-play-bg {
	transition: fill 0.15s ease, fill-opacity 0.15s ease;
}
.fp-youtube-facade:hover .fp-ovning-video-play-btn .fp-yt-play-bg,
.fp-youtube-facade .fp-ovning-video-play-btn:hover .fp-yt-play-bg,
.fp-youtube-facade .fp-ovning-video-play-btn:focus-visible .fp-yt-play-bg {
	fill: #ff0000;
	fill-opacity: 1;
}
.fp-youtube-facade .fp-ovning-video-play-btn:focus-visible {
	outline: 3px solid #fff;
	outline-offset: 2px;
}
.fp-youtube-facade .fp-youtube-facade-iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}
.fp-youtube-facade .fp-ovning-video-iframe-wrap {
	position: relative;
	width: 100%;
	padding-bottom: 56.25%;
}
@media (max-width: 480px) {
	.fp-youtube-facade .fp-ovning-video-play-btn svg {
		width: 56px;
		height: 40px;
	}
}
.fp-ovning-content {
	font-size: 1rem;
	line-height: 1.7;
	color: var(--fp-text-muted);
}
.fp-ovning-content p { margin: 0 0 1rem; }
.fp-ovning-section { margin-top: 2rem; }
.fp-ovning-section-title { font-size: 1.1rem; font-weight: 700; color: var(--fp-text); margin: 0 0 0.75rem; }
.fp-ovning-pass-params { list-style: none; margin: 0 0 1rem; padding: 0; display: flex; flex-wrap: wrap; gap: 0.5rem 1rem; font-size: 1rem; color: var(--fp-text-muted); }
.fp-ovning-pass-nav { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 1rem; }
.fp-ovning-pass-nav .fp-app-btn { flex-shrink: 0; }
.fp-ovning-alt-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 1rem; }
.fp-ovning-alt-item { margin: 0; }
.fp-ovning-alt-link { display: block; color: var(--fp-text); text-decoration: none; border-radius: var(--fp-radius); overflow: hidden; background: var(--fp-bg-card, var(--brand-surface, #1a1a1a)); border: 1px solid var(--fp-border); transition: border-color 0.2s, box-shadow 0.2s; }
.fp-ovning-alt-link:hover { border-color: var(--fp-accent); box-shadow: 0 4px 12px rgba(0,0,0,0.2); color: var(--fp-text); }
.fp-ovning-alt-thumb { position: relative; display: block; width: 100%; padding-bottom: 56.25%; background: #111; }
.fp-ovning-alt-thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.fp-ovning-alt-play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: rgba(0,0,0,0.4); pointer-events: none; }
.fp-ovning-alt-play::after { content: ""; width: 0; height: 0; border-style: solid; border-width: 12px 0 12px 20px; border-color: transparent transparent transparent rgba(255,255,255,0.9); margin-left: 4px; }
.fp-ovning-alt-title { display: block; padding: 0.6rem 0.75rem; font-size: 0.9rem; font-weight: 600; line-height: 1.3; }

/* ========== Receptbank (arkiv + enkelvy) ========== */
.fp-recept-archive .fp-app-main,
.fp-recept-single .fp-app-main {
	max-width: 900px;
	margin-left: auto;
	margin-right: auto;
}
.fp-recept-hero {
	margin-bottom: 1.5rem;
}
.fp-recept-archive-title {
	font-size: 1.75rem;
	font-weight: 800;
	color: var(--fp-text);
	margin: 0 0 0.5rem;
}
.fp-recept-archive-desc {
	color: var(--fp-text-muted);
	font-size: 1rem;
	margin: 0 0 1.5rem;
}
.fp-recept-tanka-pa {
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.08);
	border: 1px solid var(--fp-border);
	border-radius: var(--fp-radius);
	padding: 1.25rem 1.5rem;
	margin-bottom: 1.5rem;
}
.fp-recept-tanka-pa-title {
	font-size: 0.9rem;
	font-weight: 800;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--fp-accent);
	margin: 0 0 0.5rem;
}
.fp-recept-tanka-pa-intro {
	font-size: 0.95rem;
	color: var(--fp-text);
	line-height: 1.5;
	margin: 0 0 0.75rem;
}
.fp-recept-tanka-pa-list {
	margin: 0;
	padding-left: 1.25rem;
	color: var(--fp-text-muted);
	font-size: 0.9rem;
	line-height: 1.6;
}
.fp-recept-tanka-pa-list li {
	margin-bottom: 0.35rem;
}
.fp-recept-ref {
	font-size: 0.72em;
	font-weight: 700;
	color: var(--fp-accent);
	margin-left: 0.1rem;
}
.fp-recept-hand-guide {
	margin-top: 1rem;
	border-top: 1px solid rgba(255,255,255,0.08);
	padding-top: 1rem;
}
.fp-recept-hand-guide summary {
	cursor: pointer;
	font-size: 0.9rem;
	font-weight: 700;
	color: var(--fp-accent);
	text-transform: uppercase;
	letter-spacing: 0.04em;
	list-style: none;
	-webkit-user-select: none;
	user-select: none;
}
.fp-recept-hand-guide summary::-webkit-details-marker { display: none; }
.fp-recept-hand-guide summary::after {
	content: " +";
	opacity: 0.8;
}
.fp-recept-hand-guide[open] summary::after {
	content: " −";
}
.fp-recept-hand-guide-inner {
	padding-top: 1rem;
}
.fp-recept-hand-intro {
	font-size: 0.9rem;
	color: var(--fp-text);
	line-height: 1.5;
	margin: 0 0 1rem;
}
.fp-recept-hand-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1rem;
	margin-bottom: 1rem;
}
@media (min-width: 500px) {
	.fp-recept-hand-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}
.fp-recept-hand-item {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
}
.fp-recept-hand-icon {
	font-size: 1.5rem;
	line-height: 1;
	margin-bottom: 0.15rem;
}
.fp-recept-hand-item strong {
	font-size: 0.85rem;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--fp-accent);
}
.fp-recept-hand-item p {
	font-size: 0.85rem;
	color: var(--fp-text-muted);
	line-height: 1.4;
	margin: 0;
}
.fp-recept-hand-note {
	font-size: 0.85rem;
	color: var(--fp-text-muted);
	line-height: 1.4;
	margin: 0;
	padding-top: 0.5rem;
	border-top: 1px solid rgba(255,255,255,0.06);
}
.fp-recept-sources {
	margin-top: 1rem;
	border-top: 1px solid rgba(255,255,255,0.08);
	padding-top: 1rem;
}
.fp-recept-sources summary {
	cursor: pointer;
	font-size: 0.85rem;
	font-weight: 700;
	color: var(--fp-text);
	list-style: none;
	-webkit-user-select: none;
	user-select: none;
}
.fp-recept-sources summary::-webkit-details-marker { display: none; }
.fp-recept-sources summary::after {
	content: " +";
	opacity: 0.8;
	color: var(--fp-accent);
}
.fp-recept-sources[open] summary::after {
	content: " −";
}
.fp-recept-sources-inner {
	padding-top: 0.85rem;
}
.fp-recept-sources-list {
	margin: 0;
	padding-left: 1.25rem;
	font-size: 0.82rem;
	line-height: 1.55;
	color: var(--fp-text-muted);
}
.fp-recept-sources-list li {
	margin-bottom: 0.35rem;
}
.fp-recept-sources-list a {
	color: var(--fp-text);
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 2px;
}
.fp-recept-sources-reviewed {
	margin: 0.7rem 0 0;
	font-size: 0.78rem;
	color: var(--fp-text-muted);
}
.fp-recept-medical-note {
	margin: 0.45rem 0 0;
	padding-left: 0.65rem;
	border-left: 2px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.55);
	font-size: 0.8rem;
	line-height: 1.45;
	color: var(--fp-text);
	font-style: italic;
}
.fp-recept-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1rem;
	margin-bottom: 1.5rem;
}
.fp-recept-filters {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem;
}
.fp-recept-filter-form {
	flex-shrink: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem;
}
.fp-recept-search {
	width: 100%;
	min-width: 160px;
	max-width: 220px;
	appearance: none;
	background: var(--fp-bg-card);
	border: 1px solid var(--fp-border);
	border-radius: var(--fp-radius-sm);
	color: var(--fp-text);
	font-size: 0.95rem;
	padding: 0.6rem 1rem;
	min-height: var(--fp-touch-target);
}
.fp-recept-search::placeholder {
	color: var(--fp-text-muted);
}
.fp-recept-search:focus {
	outline: none;
	border-color: var(--fp-accent);
}
.fp-recept-search-btn {
	appearance: none;
	background: var(--fp-accent);
	color: var(--fp-bg);
	border: none;
	border-radius: var(--fp-radius-sm);
	font-size: 0.9rem;
	font-weight: 600;
	padding: 0.6rem 1rem;
	min-height: var(--fp-touch-target);
	cursor: pointer;
}
.fp-recept-search-btn:hover {
	opacity: 0.95;
}
.fp-recept-favoriter-link {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	color: var(--fp-text-muted);
	text-decoration: none;
	font-size: 0.95rem;
	font-weight: 600;
	padding: 0.5rem 0.75rem;
	border-radius: var(--fp-radius-sm);
	border: 1px solid transparent;
	transition: color 0.2s, border-color 0.2s;
}
.fp-recept-favoriter-link:hover,
.fp-recept-favoriter-active {
	color: var(--fp-accent);
	border-color: var(--fp-border);
}
.fp-recept-select {
	appearance: none;
	background: var(--fp-bg-card);
	border: 1px solid var(--fp-border);
	border-radius: var(--fp-radius-sm);
	color: var(--fp-text);
	font-size: 0.95rem;
	font-weight: 600;
	padding: 0.6rem 2.25rem 0.6rem 1rem;
	min-height: var(--fp-touch-target);
	cursor: pointer;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none' stroke='%239ca3af' stroke-width='2'%3E%3Cpath d='M2 4l4 4 4-4'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 0.75rem center;
}
.fp-recept-select:focus {
	outline: none;
	border-color: var(--fp-accent);
}
.fp-recept-category-heading {
	font-size: 1.25rem;
	font-weight: 800;
	color: var(--fp-text);
	margin: 0;
}
.fp-recept-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1rem;
}
.fp-recept-card-wrap {
	position: relative;
}
.fp-recept-card-wrap.fp-recept-card-opening::after {
	content: "Laddar recept...";
	position: absolute;
	top: 8px;
	left: 8px;
	z-index: 3;
	padding: 0.3rem 0.55rem;
	border-radius: 999px;
	font-size: 0.78rem;
	font-weight: 600;
	letter-spacing: 0.01em;
	background: rgba(17,17,17,0.86);
	color: #fff;
	border: 1px solid rgba(255,255,255,0.2);
}
@media (min-width: 600px) {
	.fp-recept-grid {
		grid-template-columns: repeat(3, 1fr);
		gap: 1.25rem;
	}
}
.fp-recept-card.fp-card {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: 140px;
	padding: 0;
	border: 1px solid rgba(255,255,255,0.06);
	border-radius: var(--fp-radius);
	overflow: hidden;
	text-decoration: none;
	color: inherit;
	transition: transform 0.2s ease, border-color 0.2s;
}
.fp-recept-card.fp-card:hover {
	transform: translateY(-4px);
	border-color: var(--fp-accent);
}
.fp-recept-card .fp-card-bg {
	background-image: var(--fp-card-bg, url('https://images.unsplash.com/photo-1546069901-ba9599a7e63c?w=800&q=80'));
	background-color: var(--fp-bg-card);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}
.fp-recept-card .fp-card-bg-img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	background: var(--fp-bg-card);
	display: block;
}
.fp-recept-card .fp-card-content {
	padding: 1rem 1.25rem;
	position: relative;
	z-index: 1;
}
.fp-recept-card-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem;
	margin-bottom: 0.35rem;
}
.fp-recept-card-tag {
	font-size: 0.7rem;
	font-weight: 600;
	letter-spacing: 0.03em;
	background: rgba(255,255,255,0.2);
	padding: 0.2rem 0.5rem;
	border-radius: 999px;
}
.fp-recept-card .fp-card-title {
	font-size: 1rem;
	font-weight: 800;
	margin: 0;
}
.fp-recept-card-favorit {
	position: absolute;
	top: 0.6rem;
	right: 0.6rem;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	color: rgba(255,255,255,0.85);
	background: rgba(0,0,0,0.4);
	border: 0;
	padding: 0;
	margin: 0;
	border-radius: 50%;
	text-decoration: none;
	z-index: 2;
	cursor: pointer;
	line-height: 0;
	appearance: none;
	-webkit-appearance: none;
	transition: color 0.2s, background 0.2s;
}
.fp-recept-card-favorit svg {
	display: block;
	width: 22px;
	height: 22px;
	flex-shrink: 0;
	pointer-events: none;
}
.fp-recept-card-favorit:hover {
	color: var(--fp-accent);
	background: rgba(0,0,0,0.6);
}
.fp-recept-card-favorit.fp-recept-favorit-on {
	color: var(--fp-accent);
}
.fp-recept-empty {
	padding: 2rem;
	text-align: center;
	color: var(--fp-text-muted);
}
.fp-recept-empty p {
	margin: 0 0 0.75rem;
}
.fp-recept-link-all {
	color: var(--fp-accent);
	font-weight: 600;
	text-decoration: none;
}
.fp-recept-link-all:hover {
	text-decoration: underline;
}
.fp-recept-pagination {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	margin-top: 1rem;
}
.fp-recept-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.1rem;
	padding: 0.4rem 0.65rem;
	border: 1px solid rgba(255,255,255,0.16);
	border-radius: 8px;
	color: var(--fp-text);
	text-decoration: none;
	font-weight: 600;
}
.fp-recept-pagination .page-numbers.current {
	background: var(--fp-accent);
	border-color: var(--fp-accent);
	color: #111;
}
.fp-recept-pagination .page-numbers:hover {
	border-color: var(--fp-accent);
}
.fp-recept-loading-indicator {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	margin: 0.5rem 0 0.8rem;
	padding: 0.35rem 0.65rem;
	border-radius: 999px;
	border: 1px solid rgba(255,255,255,0.18);
	color: var(--fp-text-muted);
	font-size: 0.9rem;
	opacity: 0;
	transition: opacity 0.15s ease;
}
.fp-recept-loading-indicator.is-visible {
	opacity: 1;
}
.fp-recept-loading-spinner {
	width: 14px;
	height: 14px;
	border: 2px solid rgba(255,255,255,0.25);
	border-top-color: var(--fp-accent);
	border-radius: 50%;
	animation: fp-spin 0.8s linear infinite;
}
@keyframes fp-spin {
	to { transform: rotate(360deg); }
}
.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0,0,0,0);
	white-space: nowrap;
	border: 0;
}

/* Recept enkelvy */
.fp-recept-single-main {
	padding-top: 0.5rem;
}
.fp-recept-article {
	margin-bottom: 2rem;
}
.fp-recept-single-header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 0.75rem;
}
.fp-recept-single-header .fp-recept-single-title {
	flex: 1;
	margin: 0;
}
.fp-recept-favorit-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	color: var(--fp-text-muted);
	text-decoration: none;
	transition: color 0.2s;
}
.fp-recept-favorit-btn:hover,
.fp-recept-favorit-btn.fp-recept-favorit-on {
	color: var(--fp-accent);
}
.fp-recept-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-bottom: 1rem;
}
.fp-recept-tag {
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.03em;
	background: rgba(255,255,255,0.08);
	padding: 0.35rem 0.75rem;
	border-radius: 999px;
	border: 1px solid var(--fp-border);
}
.fp-recept-single-title {
	font-size: 1.75rem;
	font-weight: 800;
	color: var(--fp-text);
	margin: 0 0 1rem;
	line-height: 1.2;
}
.fp-recept-image {
	margin-bottom: 1.5rem;
	border-radius: var(--fp-radius);
	overflow: hidden;
	background: var(--fp-bg-card);
}
.fp-recept-image img {
	width: 100%;
	height: auto;
	display: block;
	vertical-align: middle;
}
.fp-recept-label {
	font-size: 0.85rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--fp-accent);
	margin: 0 0 0.35rem;
}
.fp-recept-portions,
.fp-recept-nutrition {
	margin-bottom: 1.25rem;
}
.fp-recept-portions-text,
.fp-recept-nutrition-text {
	font-size: 1rem;
	color: var(--fp-text);
	margin: 0;
	line-height: 1.5;
}
.fp-recept-nutrition-hint {
	font-size: 0.85rem;
	color: var(--fp-text-muted);
	line-height: 1.4;
	margin: 0.5rem 0 0;
	font-style: italic;
}
.fp-recept-note {
	margin-bottom: 1.5rem;
}
.fp-recept-note-text {
	font-size: 0.95rem;
	color: var(--fp-text-muted);
	font-style: italic;
	margin: 0;
	line-height: 1.5;
}
.fp-recept-content {
	font-size: 1rem;
	line-height: 1.65;
	color: var(--fp-text);
}
.fp-recept-content p {
	margin: 0 0 1rem;
}
.fp-recept-content p:last-child {
	margin-bottom: 0;
}
.fp-recept-content ul,
.fp-recept-content ol {
	margin: 0 0 1rem;
	padding-left: 1.5rem;
}
.fp-recept-content h2,
.fp-recept-content h3 {
	font-size: 1.15rem;
	font-weight: 700;
	margin: 1.25rem 0 0.5rem;
	color: var(--fp-text);
}
.fp-recept-content h2:first-child,
.fp-recept-content h3:first-child {
	margin-top: 0;
}

/* ========== Inloggningssida (/logga-in/) ========== */
.fp-login-page .fp-app-main {
	max-width: 440px;
	margin-left: auto;
	margin-right: auto;
	padding-top: 2rem;
	padding-bottom: 3rem;
}
.fp-login-card {
	background: var(--fp-bg-card);
	border: 1px solid var(--fp-border);
	border-radius: var(--fp-radius);
	padding: 2rem 1.5rem;
}
.fp-login-title {
	font-size: 1.75rem;
	font-weight: 800;
	color: var(--fp-text);
	margin: 0 0 0.5rem;
	text-transform: uppercase;
	letter-spacing: -0.02em;
}
.fp-login-desc {
	font-size: 0.9rem;
	color: var(--fp-text-muted);
	line-height: 1.5;
	margin: 0 0 1.5rem;
}
.fp-login-error {
	background: rgba(239, 68, 68, 0.15);
	border: 1px solid rgba(239, 68, 68, 0.4);
	color: #fca5a5;
	padding: 0.75rem 1rem;
	border-radius: var(--fp-radius-sm);
	font-size: 0.9rem;
	margin: 0 0 1.25rem;
}
.fp-login-message {
	color: var(--fp-accent);
	font-size: 0.9rem;
	margin: 0 0 1.25rem;
}
.fp-login-card--success {
	border-color: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.45);
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.18);
}
.fp-login-success-banner {
	margin: 0 0 1.5rem;
	padding: 1.25rem 1.2rem 1.35rem;
	border-radius: var(--fp-radius-sm);
	border: 1px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.35);
	border-left-width: 4px;
	border-left-color: var(--fp-accent);
	background: linear-gradient(165deg, rgba(var(--brand-accent-rgb, 212, 212, 30), 0.12) 0%, rgba(15, 23, 42, 0.06) 100%);
}
.fp-login-success-kicker {
	margin: 0 0 0.35rem;
	font-size: 0.72rem;
	font-weight: 800;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--fp-accent);
}
.fp-login-success-title {
	margin: 0 0 0.65rem;
	font-size: 1.35rem;
	font-weight: 800;
	line-height: 1.2;
	color: var(--fp-text);
	letter-spacing: -0.02em;
}
.fp-login-success-text {
	margin: 0 0 1.1rem;
	font-size: 0.95rem;
	line-height: 1.55;
	color: var(--fp-text-muted);
}
.fp-login-success-cta-wrap {
	margin: 0;
}
.fp-login-success-cta-wrap .fp-app-btn {
	width: 100%;
	box-sizing: border-box;
	text-decoration: none;
}
.fp-login-success-cta:focus-visible {
	outline: 2px solid var(--fp-accent);
	outline-offset: 2px;
}
.fp-join-lag-form .fp-join-lag-submit-row {
	margin-top: 0.25rem;
	margin-bottom: 0;
}
.fp-join-lag-form .fp-join-lag-submit-row .fp-app-btn {
	transition: opacity 0.15s ease, transform 0.1s ease, box-shadow 0.2s ease;
}
.fp-join-lag-form .fp-join-lag-submit-row .fp-app-btn:active {
	box-shadow: 0 0 0 3px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.25);
}
.fp-login-form-wrap {
	margin-bottom: 1rem;
}
.fp-login-form-wrap label {
	display: block;
	font-size: 0.8rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--fp-text-muted);
	margin-bottom: 0.35rem;
}
.fp-login-form-wrap .input {
	width: 100%;
	background: var(--fp-bg);
	border: 1px solid var(--fp-border);
	border-radius: var(--fp-radius-sm);
	color: var(--fp-text);
	font-size: 1rem;
	padding: 0.75rem 1rem;
	margin-bottom: 1.25rem;
	box-sizing: border-box;
}
.fp-login-form-wrap .input:focus {
	outline: none;
	border-color: var(--fp-accent);
}
.fp-login-form-wrap .input::placeholder {
	color: var(--fp-text-muted);
	opacity: 0.8;
}
.fp-login-form-wrap .login-remember {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin-bottom: 1.25rem;
}
.fp-login-form-wrap .login-remember input {
	width: auto;
	margin: 0;
	accent-color: var(--fp-accent);
}
.fp-login-form-wrap .login-remember label {
	display: inline;
	margin: 0;
	text-transform: none;
	letter-spacing: 0;
	font-size: 0.9rem;
}
.fp-login-form-wrap .login-submit {
	margin-bottom: 0;
}
.fp-login-form-wrap .login-submit input,
.fp-login-form-wrap #fp-wp-submit {
	width: 100%;
	padding: 1rem 1.5rem;
	min-height: var(--fp-touch-target);
	font-size: 0.95rem;
	font-weight: 800;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	background: var(--fp-accent);
	color: var(--fp-bg);
	border: none;
	border-radius: var(--fp-radius-sm);
	cursor: pointer;
	transition: opacity 0.15s ease, transform 0.1s ease;
}
.fp-login-form-wrap .login-submit input:hover,
.fp-login-form-wrap .login-submit input:focus,
.fp-login-form-wrap #fp-wp-submit:hover,
.fp-login-form-wrap #fp-wp-submit:focus {
	opacity: 0.95;
}
.fp-login-form-wrap .login-submit input:active,
.fp-login-form-wrap #fp-wp-submit:active {
	transform: scale(0.98);
}
.fp-login-lost {
	margin: 0;
	text-align: center;
}
.fp-login-lost a {
	color: var(--fp-accent);
	font-size: 0.9rem;
	font-weight: 600;
	text-decoration: none;
}
.fp-login-lost a:hover {
	text-decoration: underline;
}
.fp-login-footer {
	margin-top: auto;
	padding-top: 2rem;
}

/* ── Spelarlista (tränare) ── */
.fp-min-sida-spelarlista { margin: 2rem 0; }
.fp-spelarlista-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0.5rem; }
.fp-spelarlista-card {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	background: var(--brand-surface, #1a1a1a);
	border-radius: 12px;
	padding: 0.75rem 1rem;
	text-decoration: none !important;
	color: #fff !important;
}
.fp-spelarlista-avatar {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: var(--brand-accent, #D4D41E);
	color: var(--brand-bg, #0a0a0a);
	font-weight: 800;
	font-size: 1rem;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	text-transform: uppercase;
}
.fp-spelarlista-info {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.fp-spelarlista-name { font-weight: 700; font-size: 0.9rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fp-spelarlista-bar-wrap { background: #333; border-radius: 99px; height: 5px; overflow: hidden; }
.fp-spelarlista-bar { display: block; height: 100%; background: var(--brand-accent, #D4D41E); border-radius: 99px; transition: width 0.3s; }
.fp-spelarlista-pct { font-size: 0.8rem; font-weight: 700; color: var(--brand-accent, #D4D41E); white-space: nowrap; flex-shrink: 0; }

/* Rekommenderat block har margin-bottom; träningsplan-sektionen följer direkt under för spelare. */
.fp-min-sida-recommended + .fp-min-sida-traningsval {
	margin-top: 0;
}

/* ── Fystester: referensgrupp (kön + nivå) ── */
.fp-fystester-reference-form {
	margin: 0.75rem 0 1rem;
	padding: 0.9rem;
	border: 1px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.4);
	border-radius: 12px;
	background: rgba(255, 255, 255, 0.02);
	max-width: 760px;
}
.fp-fystester-reference-row {
	display: flex;
	gap: 0.65rem;
	flex-wrap: wrap;
	align-items: flex-end;
}
.fp-fystester-reference-row p {
	margin: 0;
	flex: 1 1 180px;
}
.fp-fystester-reference-form label {
	color: var(--brand-accent, #D4D41E);
	font-weight: 700;
}
.fp-fystester-reference-row select {
	width: 100%;
}
.fp-fystester-reference-submit-wrap {
	flex: 0 0 auto !important;
}
.fp-fystester-reference-submit {
	min-height: 44px;
	padding: 0.5rem 0.9rem;
}
.fp-fystester-reference-note {
	margin: 0.6rem 0 0;
	font-size: 0.82rem;
	color: var(--fp-text-muted);
}
.fp-fystester-reference-badge {
	margin: 0 0 0.55rem;
	font-size: 0.75rem;
	color: var(--brand-accent, #D4D41E);
	letter-spacing: 0.02em;
}

/* ========== Radera konto (Apple-required deletion flow) ========== */
.fp-radera-warning {
	background: var(--fp-bg-card);
	border: 1px solid rgba(239, 68, 68, 0.35);
	border-left: 4px solid rgba(239, 68, 68, 0.9);
	border-radius: var(--fp-radius-sm);
	padding: 1rem 1.15rem;
	margin: 1rem 0 1.5rem;
	color: var(--fp-text);
}
.fp-radera-warning p { margin: 0 0 0.6rem; line-height: 1.55; }
.fp-radera-warning p:last-child { margin-bottom: 0; }
.fp-radera-warning strong { color: #fca5a5; }
.fp-radera-list {
	margin: 0.5rem 0 0.75rem 1.25rem;
	padding: 0;
	color: var(--fp-text-muted);
}
.fp-radera-list li { margin: 0.25rem 0; }
.fp-radera-confirm-label {
	margin-top: 0.65rem;
	font-weight: 600;
	color: var(--fp-text);
	display: block;
}
.fp-radera-input {
	font-family: ui-monospace, Menlo, Consolas, monospace;
	letter-spacing: 2px;
	text-transform: uppercase;
	padding: 0.7rem 0.95rem;
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: var(--fp-radius-sm);
	width: 100%;
	max-width: 280px;
	font-size: 1rem;
	color: var(--fp-text);
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.fp-radera-input:focus,
.fp-radera-input:focus-visible {
	outline: none;
	border-color: rgba(239, 68, 68, 0.6);
	box-shadow: 0 0 0 4px rgba(239, 68, 68, 0.15);
}
.fp-app-btn-danger {
	background: rgba(239, 68, 68, 0.15);
	color: #fecaca;
	border: 1px solid rgba(239, 68, 68, 0.5);
}
.fp-app-btn-danger:hover,
.fp-app-btn-danger:focus {
	background: rgba(239, 68, 68, 0.22);
	border-color: rgba(239, 68, 68, 0.7);
	color: #fff;
}
.fp-radera-error {
	background: rgba(239, 68, 68, 0.12);
	border: 1px solid rgba(239, 68, 68, 0.35);
	border-radius: var(--fp-radius-sm);
	padding: 0.85rem 1rem;
	margin: 0.75rem 0 1rem;
	color: #fecaca;
	font-size: 0.95rem;
	line-height: 1.5;
}

/* ========== Sökresultat (search.php) ========== */
.fp-search-page .fp-app-main {
	max-width: 880px;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 4rem;
}
.fp-search-hero {
	padding: 1.25rem 0 1.5rem;
}
.fp-search-title {
	font-size: clamp(1.6rem, 3.5vw, 2.2rem);
	font-weight: 800;
	line-height: 1.15;
	margin: 0.75rem 0 1.25rem;
	letter-spacing: -0.02em;
	color: var(--fp-text);
}
.fp-search-form {
	display: flex;
	gap: 0.6rem;
	flex-wrap: wrap;
}
.fp-search-input {
	flex: 1 1 240px;
	height: 48px;
	padding: 0 1rem;
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 12px;
	color: var(--fp-text);
	font-size: 1rem;
	font-family: inherit;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
	-webkit-appearance: none;
	appearance: none;
}
.fp-search-input::placeholder {
	color: var(--fp-text-muted);
	opacity: 0.7;
}
.fp-search-input:focus,
.fp-search-input:focus-visible {
	outline: none;
	border-color: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.6);
	box-shadow: 0 0 0 4px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.15);
}
/* Sök-knapp matchar login-submit (yellow gradient + fysisk botten-skirt). */
.fp-search-submit,
.fp-app-btn.fp-search-submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 48px;
	width: auto;
	padding: 0 1.5rem;
	white-space: nowrap;
	background: linear-gradient(180deg, var(--brand-accent-light, #e6e633) 0%, var(--brand-accent-dark, #c8c81b) 100%);
	color: var(--brand-bg, #0a0a0a);
	font-weight: 800;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	border: 0;
	border-radius: 12px;
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.45),
		inset 0 -4px 0 rgba(0, 0, 0, 0.20);
	cursor: pointer;
	font-family: inherit;
	transition: transform 0.08s ease, filter 0.15s ease, box-shadow 0.12s ease;
	min-height: 0;
}
.fp-search-submit:hover,
.fp-app-btn.fp-search-submit:hover {
	filter: brightness(1.05);
	color: var(--brand-bg, #0a0a0a);
	transform: none;
	opacity: 1;
}
.fp-search-submit:active,
.fp-app-btn.fp-search-submit:active {
	transform: translateY(2px);
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.3),
		inset 0 -1px 0 rgba(0, 0, 0, 0.18);
}
.fp-search-submit:focus-visible,
.fp-app-btn.fp-search-submit:focus-visible {
	outline: 3px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.45);
	outline-offset: 3px;
}
.fp-search-meta {
	margin: 1.25rem 0 0.75rem;
	font-size: 0.85rem;
	color: var(--fp-text-muted);
	letter-spacing: 0.02em;
}
.fp-search-results {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.65rem;
}
.fp-search-result-link {
	display: grid;
	grid-template-columns: 96px 1fr auto;
	gap: 1rem;
	align-items: center;
	background: var(--fp-bg-card);
	border: 1px solid var(--fp-border);
	border-radius: var(--fp-radius);
	padding: 0.85rem;
	color: var(--fp-text);
	text-decoration: none;
	transition: border-color 0.15s ease, transform 0.15s ease, background 0.15s ease;
}
.fp-search-result-link:hover {
	border-color: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.5);
	background: rgba(255, 255, 255, 0.03);
	transform: translateY(-1px);
}
.fp-search-result-thumb {
	width: 96px;
	height: 72px;
	border-radius: var(--fp-radius-sm);
	background-size: cover;
	background-position: center;
	background-color: rgba(255, 255, 255, 0.03);
	flex-shrink: 0;
}
.fp-search-result-thumb--empty {
	background-image: linear-gradient(135deg, rgba(var(--brand-accent-rgb, 212, 212, 30), 0.12) 0%, rgba(56, 96, 220, 0.10) 100%);
}
.fp-search-result-body {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	min-width: 0;
}
.fp-search-result-kicker {
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--brand-accent, #D4D41E);
}
.fp-search-result-title {
	font-size: 1rem;
	font-weight: 700;
	color: var(--fp-text);
	line-height: 1.3;
}
.fp-search-result-excerpt {
	font-size: 0.85rem;
	color: var(--fp-text-muted);
	line-height: 1.45;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.fp-search-result-arrow {
	color: var(--fp-text-muted);
	transition: transform 0.15s ease, color 0.15s ease;
}
.fp-search-result-arrow svg {
	width: 20px;
	height: 20px;
}
.fp-search-result-link:hover .fp-search-result-arrow {
	transform: translateX(3px);
	color: var(--brand-accent, #D4D41E);
}
.fp-search-pagination {
	margin: 2rem 0 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	justify-content: center;
}
.fp-search-pagination a,
.fp-search-pagination span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 0.75rem;
	border-radius: var(--fp-radius-sm);
	border: 1px solid var(--fp-border);
	color: var(--fp-text);
	text-decoration: none;
	font-size: 0.9rem;
	transition: border-color 0.15s ease, background 0.15s ease;
}
.fp-search-pagination a:hover {
	border-color: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.5);
	background: rgba(255, 255, 255, 0.03);
}
.fp-search-pagination .current {
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.15);
	border-color: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.45);
	color: var(--brand-accent, #D4D41E);
	font-weight: 700;
}
.fp-search-empty {
	text-align: center;
	padding: 3rem 1rem 4rem;
}
.fp-search-empty-title {
	font-size: 1.5rem;
	font-weight: 800;
	margin: 0 0 0.5rem;
	color: var(--fp-text);
}
.fp-search-empty-text {
	margin: 0 0 1.5rem;
	color: var(--fp-text-muted);
	line-height: 1.55;
}
.fp-search-empty-links {
	display: inline-flex;
	gap: 0.6rem;
	flex-wrap: wrap;
	justify-content: center;
}
.fp-search-empty-links .fp-app-btn {
	width: auto;
	padding: 0.7rem 1.25rem;
	min-height: 44px;
}
.fp-search-empty-btn {
	background: var(--fp-bg-card);
	color: var(--fp-text);
	border: 1px solid var(--fp-border);
}

/* ========== 404-sidan ========== */
.fp-404-page .fp-app-main {
	max-width: 1180px;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 4rem;
}
.fp-404-layout {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2.5rem;
	padding-top: 1rem;
	align-items: start;
}
@media (min-width: 900px) {
	.fp-404-layout {
		grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
		gap: 3.5rem;
	}
}
.fp-404-hero {
	text-align: left;
	padding: 1rem 0 0;
}
@media (max-width: 899px) {
	.fp-404-hero {
		text-align: center;
		padding-bottom: 0.5rem;
		border-bottom: 1px solid rgba(255, 255, 255, 0.06);
		margin-bottom: 0;
	}
}
.fp-404-code {
	margin: 0;
	font-size: clamp(5rem, 18vw, 9rem);
	font-weight: 900;
	letter-spacing: -0.04em;
	line-height: 1;
	background: linear-gradient(135deg, rgba(var(--brand-accent-rgb, 212, 212, 30), 0.85) 0%, rgba(var(--brand-accent-rgb, 212, 212, 30), 0.25) 60%, rgba(var(--brand-accent-rgb, 212, 212, 30), 0.08) 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	color: transparent;
	user-select: none;
}
.fp-404-title {
	font-size: clamp(1.5rem, 3.2vw, 2.1rem);
	font-weight: 800;
	margin: 0.5rem 0 0.85rem;
	color: var(--fp-text);
	letter-spacing: -0.02em;
}
.fp-404-text {
	max-width: 520px;
	margin: 0 0 1.75rem;
	color: var(--fp-text-muted);
	line-height: 1.55;
}
.fp-404-cta {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	max-width: 480px;
	margin: 0;
}
@media (max-width: 899px) {
	.fp-404-text { margin: 0 auto 1.75rem; }
	.fp-404-cta { margin: 0 auto; }
}
.fp-404-cta-primary {
	width: auto;
	display: inline-block;
	padding: 0.85rem 2rem;
}
.fp-404-search {
	display: flex;
	gap: 0.5rem;
}
.fp-404-search .fp-search-input {
	height: 48px;
	flex: 1;
}
.fp-404-search .fp-search-submit {
	width: auto;
	padding: 0 1.5rem;
	height: 48px;
}

.fp-404-recs {
	display: flex;
	flex-direction: column;
	gap: 2rem;
	position: relative;
}
.fp-404-recs-eyebrow {
	margin: 0 0 1rem;
	font-size: 0.7rem;
	font-weight: 800;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--fp-text-muted);
}
.fp-404-rec-group {
	display: flex;
	flex-direction: column;
}
.fp-404-rec-head {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: 0.75rem;
	margin-bottom: 0.85rem;
}
.fp-404-rec-head-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 8px;
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.12);
	color: var(--brand-accent, #D4D41E);
}
.fp-404-rec-head-icon svg {
	width: 18px;
	height: 18px;
}
.fp-404-rec-title {
	font-size: 1rem;
	font-weight: 800;
	color: var(--fp-text);
	margin: 0;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}
.fp-404-rec-more {
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	font-size: 0.78rem;
	font-weight: 700;
	color: rgba(245, 245, 244, 0.7);
	text-decoration: none;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	transition: color 0.15s ease, gap 0.15s ease;
}
.fp-404-rec-more svg {
	width: 14px;
	height: 14px;
	transition: transform 0.15s ease;
}
.fp-404-rec-more:hover {
	color: var(--brand-accent, #D4D41E);
}
.fp-404-rec-more:hover svg {
	transform: translateX(2px);
}
.fp-404-rec-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}
.fp-404-rec-card {
	display: grid;
	grid-template-columns: 84px 1fr auto;
	gap: 1rem;
	align-items: center;
	background: var(--fp-bg-card);
	border: 1px solid rgba(255, 255, 255, 0.06);
	border-radius: var(--fp-radius);
	padding: 0.65rem 0.95rem 0.65rem 0.65rem;
	color: var(--fp-text);
	text-decoration: none;
	transition: border-color 0.18s ease, transform 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
	position: relative;
	overflow: hidden;
}
.fp-404-rec-card::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: 3px;
	background: linear-gradient(180deg, var(--brand-accent, #D4D41E) 0%, rgba(var(--brand-accent-rgb, 212, 212, 30), 0.3) 100%);
	opacity: 0;
	transition: opacity 0.18s ease;
}
.fp-404-rec-card:hover {
	border-color: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.4);
	background: rgba(255, 255, 255, 0.025);
	transform: translateY(-1px);
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
}
.fp-404-rec-card:hover::before { opacity: 1; }
.fp-404-rec-thumb {
	width: 84px;
	height: 64px;
	border-radius: var(--fp-radius-sm);
	background-size: cover;
	background-position: center;
	background-color: rgba(255, 255, 255, 0.03);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	position: relative;
}
.fp-404-rec-thumb--empty {
	background-image: linear-gradient(135deg, rgba(var(--brand-accent-rgb, 212, 212, 30), 0.18) 0%, rgba(56, 96, 220, 0.10) 100%);
}
.fp-404-rec-thumb--icon {
	width: 56px;
	height: 56px;
	border-radius: var(--fp-radius-sm);
	background: linear-gradient(135deg, rgba(var(--brand-accent-rgb, 212, 212, 30), 0.18) 0%, rgba(56, 96, 220, 0.10) 100%);
	border: 1px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.18);
}
.fp-404-rec-thumb-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: var(--brand-accent, #D4D41E);
}
.fp-404-rec-thumb-icon svg {
	width: 22px;
	height: 22px;
	stroke-width: 2;
}
.fp-404-rec-body {
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
	min-width: 0;
}
.fp-404-rec-card-kicker {
	font-size: 0.66rem;
	font-weight: 800;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: rgba(245, 245, 244, 0.55);
	transition: color 0.15s ease;
}
.fp-404-rec-card:hover .fp-404-rec-card-kicker {
	color: var(--brand-accent, #D4D41E);
}
.fp-404-rec-card-title {
	font-size: 0.95rem;
	font-weight: 700;
	color: var(--fp-text);
	line-height: 1.3;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.fp-404-rec-card-arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	color: rgba(245, 245, 244, 0.4);
	transition: transform 0.18s ease, color 0.18s ease, background 0.18s ease;
}
.fp-404-rec-card-arrow svg {
	width: 16px;
	height: 16px;
}
.fp-404-rec-card:hover .fp-404-rec-card-arrow {
	color: var(--brand-bg, #0a0a0a);
	background: var(--brand-accent, #D4D41E);
	transform: translateX(2px);
}
.fp-404-rec-card--text {
	grid-template-columns: 56px 1fr auto;
	padding: 0.8rem 0.95rem 0.8rem 0.65rem;
}
.fp-404-rec-card-sub {
	font-size: 0.85rem;
	color: var(--fp-text-muted);
	line-height: 1.45;
	margin-top: 0.1rem;
}
.fp-404-rec-list--marketing {
	gap: 0.55rem;
}
@media (max-width: 480px) {
	.fp-404-rec-card {
		grid-template-columns: 64px 1fr auto;
		gap: 0.7rem;
		padding: 0.55rem 0.75rem 0.55rem 0.55rem;
	}
	.fp-404-rec-thumb {
		width: 64px;
		height: 52px;
	}
	.fp-404-rec-card-arrow {
		width: 28px;
		height: 28px;
	}
}
@media (max-width: 600px) {
	.fp-search-result-link {
		grid-template-columns: 72px 1fr;
	}
	.fp-search-result-thumb {
		width: 72px;
		height: 60px;
	}
	.fp-search-result-arrow {
		display: none;
	}
}

/* ===========================================================
   Kom igång – produktnära mockuper, feature-rader och onboarding-flöde
   =========================================================== */

.fp-kom-igang-product {
	margin-top: 3rem;
	padding-top: 2.5rem;
	border-top: 1px solid rgba(255, 255, 255, 0.06);
}

.fp-feature-row {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.75rem;
	align-items: center;
	margin: 2.5rem 0 3.25rem;
}
@media (min-width: 860px) {
	.fp-feature-row {
		grid-template-columns: 1.05fr 0.95fr;
		gap: 4rem;
		margin: 3rem 0 4rem;
	}
	.fp-feature-row-reverse .fp-feature-text {
		order: 2;
	}
	.fp-feature-row-reverse .fp-feature-mockup {
		order: 1;
	}
}
.fp-feature-row-pair {
	margin-top: 3.25rem;
}
@media (min-width: 860px) {
	.fp-feature-row-pair {
		margin-top: 4rem;
	}
}

.fp-feature-eyebrow {
	font-size: 0.78rem;
	font-weight: 800;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--fp-accent);
	margin: 0 0 0.6rem;
}
.fp-feature-title {
	font-size: clamp(1.4rem, 2.4vw, 1.85rem);
	font-weight: 800;
	color: var(--fp-text);
	margin: 0 0 1rem;
	line-height: 1.2;
	letter-spacing: -0.01em;
}
.fp-feature-body {
	font-size: 1rem;
	line-height: 1.65;
	color: var(--fp-text);
	margin: 0 0 1.1rem;
	max-width: 50ch;
}
.fp-feature-list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}
.fp-feature-list li {
	position: relative;
	padding-left: 1.6rem;
	color: var(--fp-text-muted);
	font-size: 0.95rem;
	line-height: 1.5;
}
.fp-feature-list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.45em;
	width: 0.85rem;
	height: 0.85rem;
	border-radius: 50%;
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.18);
	box-shadow: inset 0 0 0 2px var(--fp-accent);
}

.fp-feature-mockup {
	display: flex;
	justify-content: center;
	position: relative;
}
/* Mjukt accentljus bakom telefonen – ger djup utan att skrika */
.fp-feature-mockup::before {
	content: "";
	position: absolute;
	inset: 10% 0;
	background: radial-gradient(50% 50% at 50% 50%, rgba(var(--brand-accent-rgb, 212, 212, 30), 0.16), transparent 70%);
	filter: blur(28px);
	z-index: 0;
	pointer-events: none;
}
.fp-feature-mockup > * {
	position: relative;
	z-index: 1;
}

/* Telefonram – minimal, men igenkännlig */
.fp-phone {
	width: 100%;
	max-width: 300px;
	border-radius: 38px;
	padding: 10px;
	background: linear-gradient(160deg, #2c2c2c, var(--brand-bg, #0d0d0d) 60%);
	box-shadow:
		0 30px 60px -20px rgba(0, 0, 0, 0.75),
		0 0 0 1px rgba(255, 255, 255, 0.06),
		inset 0 0 0 1px rgba(255, 255, 255, 0.04);
	position: relative;
}
.fp-phone::before {
	/* Dynamic-island-aktig pill */
	content: "";
	position: absolute;
	top: 16px;
	left: 50%;
	transform: translateX(-50%);
	width: 86px;
	height: 24px;
	background: #050505;
	border-radius: 999px;
	z-index: 2;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04);
}
.fp-phone::after {
	/* Home indicator */
	content: "";
	position: absolute;
	bottom: 14px;
	left: 50%;
	transform: translateX(-50%);
	width: 110px;
	height: 4px;
	background: rgba(255, 255, 255, 0.55);
	border-radius: 2px;
	z-index: 3;
	pointer-events: none;
}
.fp-phone-screen {
	background: linear-gradient(180deg, #0e0e0e, var(--fp-bg) 35%);
	border-radius: 28px;
	overflow: hidden;
	min-height: 560px;
	display: flex;
	flex-direction: column;
	color: var(--fp-text);
}
.fp-phone-status {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 14px 22px 6px;
	font-size: 0.72rem;
	font-weight: 700;
	color: var(--fp-text);
	letter-spacing: 0.02em;
	font-variant-numeric: tabular-nums;
}
.fp-phone-time {
	display: inline-block;
	min-width: 32px;
}
.fp-phone-status-icons {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: var(--fp-text);
}
.fp-phone-cellular {
	display: inline-flex;
	align-items: flex-end;
	gap: 1.5px;
	height: 9px;
}
.fp-phone-cellular > span {
	display: block;
	width: 2.5px;
	background: currentColor;
	border-radius: 0.5px;
}
.fp-phone-cellular > span:nth-child(1) { height: 3px; }
.fp-phone-cellular > span:nth-child(2) { height: 5px; }
.fp-phone-cellular > span:nth-child(3) { height: 7px; }
.fp-phone-cellular > span:nth-child(4) { height: 9px; }
.fp-phone-5g {
	font-size: 0.6rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	margin: 0 1px 0 2px;
}
.fp-phone-wifi {
	width: 13px;
	height: 10px;
	fill: currentColor;
}
.fp-phone-battery {
	display: inline-block;
	width: 22px;
	height: 10px;
	border: 1px solid currentColor;
	border-radius: 2.5px;
	position: relative;
	box-sizing: border-box;
}
.fp-phone-battery::before {
	content: "";
	position: absolute;
	left: 1.5px;
	top: 1.5px;
	bottom: 1.5px;
	width: 14px;
	background: currentColor;
	border-radius: 1px;
}
.fp-phone-battery::after {
	content: "";
	position: absolute;
	right: -3px;
	top: 3px;
	width: 1.5px;
	height: 4px;
	background: currentColor;
	border-radius: 0 1px 1px 0;
}

/* --- Mockup: Min sida --- */
.fp-mock-min-sida {
	padding: 1.25rem 1rem 0;
	display: flex;
	flex-direction: column;
	gap: 0.85rem;
	flex: 1;
}
.fp-mock-greeting {
	font-size: 1.15rem;
	font-weight: 800;
	color: var(--fp-text);
	margin: 0.2rem 0 0.5rem;
}
.fp-mock-card {
	background: var(--fp-bg-card);
	border: 1px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.18);
	border-radius: 1rem;
	padding: 0.95rem 1rem;
}
.fp-mock-card-secondary {
	border-color: rgba(255, 255, 255, 0.08);
}
.fp-mock-eyebrow {
	font-size: 0.65rem;
	font-weight: 800;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--fp-accent);
	margin: 0 0 0.3rem;
}
.fp-mock-card-title {
	font-size: 0.95rem;
	font-weight: 700;
	color: var(--fp-text);
	margin: 0 0 0.55rem;
	line-height: 1.25;
}
.fp-mock-card-title-sm {
	font-size: 0.92rem;
	font-weight: 700;
	color: var(--fp-text);
	margin: 0 0 0.2rem;
}
.fp-mock-card-body-sm {
	font-size: 0.78rem;
	color: var(--fp-text-muted);
	margin: 0;
}
.fp-mock-progress-row {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	margin-bottom: 0.7rem;
}
.fp-mock-progress-pill {
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.12);
	border: 1px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.3);
	color: var(--fp-text);
	border-radius: 999px;
	padding: 0.2rem 0.7rem;
	font-size: 0.78rem;
}
.fp-mock-progress-pill strong {
	color: var(--fp-accent);
	font-weight: 800;
}
.fp-mock-progress-text {
	font-size: 0.78rem;
	color: var(--fp-text-muted);
}
.fp-mock-progress-bar {
	height: 6px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.06);
	overflow: hidden;
	margin: 0 0 0.85rem;
}
.fp-mock-progress-bar > span {
	display: block;
	height: 100%;
	background: linear-gradient(90deg, var(--brand-accent, #D4D41E), #f7f76b);
	border-radius: inherit;
}
.fp-mock-cta {
	display: flex;
	align-items: center;
	gap: 0.7rem;
	background: linear-gradient(135deg, #e7e733, #c8c81a);
	color: var(--brand-bg, #0a0a0a);
	border-radius: 0.85rem;
	padding: 0.75rem 0.85rem;
	text-decoration: none;
	font-weight: 700;
	box-shadow: 0 8px 24px -10px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.6);
}
.fp-mock-cta-icon {
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: rgba(0, 0, 0, 0.18);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 0.7rem;
	color: var(--brand-bg, #0a0a0a);
	flex-shrink: 0;
}
.fp-mock-cta-stack {
	display: flex;
	flex-direction: column;
	flex: 1;
	min-width: 0;
	line-height: 1.15;
}
.fp-mock-cta-label {
	font-size: 0.6rem;
	font-weight: 800;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	opacity: 0.7;
}
.fp-mock-cta-title {
	font-size: 0.95rem;
	font-weight: 800;
}
.fp-mock-cta-arrow {
	font-weight: 800;
	font-size: 1rem;
}
.fp-mock-tabbar {
	margin-top: auto;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 0.2rem;
	padding: 0.6rem 0.35rem 1.5rem;
	border-top: 1px solid rgba(255, 255, 255, 0.05);
	font-size: 0.58rem;
	letter-spacing: 0.04em;
	font-weight: 700;
	color: var(--fp-text-subtle);
	text-align: center;
	background: linear-gradient(180deg, transparent, rgba(255, 255, 255, 0.015));
}
.fp-mock-tab {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
	color: inherit;
}
.fp-mock-tab-icon {
	width: 18px;
	height: 18px;
	color: currentColor;
	opacity: 0.85;
}
.fp-mock-tab-active {
	color: var(--fp-accent);
}
.fp-mock-tab-active .fp-mock-tab-icon {
	opacity: 1;
	filter: drop-shadow(0 0 4px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.45));
}

/* --- Mockup: Pass-vy --- */
.fp-mock-pass,
.fp-mock-fystest,
.fp-mock-invite,
.fp-mock-matrix {
	padding: 1rem 1rem 1.5rem;
	display: flex;
	flex-direction: column;
	gap: 0.55rem;
}
.fp-mock-back {
	font-size: 0.78rem;
	color: var(--fp-accent);
	margin: 0 0 0.2rem;
	font-weight: 600;
}
.fp-mock-pass-title {
	font-size: 1.15rem;
	font-weight: 800;
	color: var(--fp-text);
	margin: 0;
	letter-spacing: -0.01em;
}
.fp-mock-pass-meta {
	font-size: 0.78rem;
	color: var(--fp-text-muted);
	margin: 0 0 0.5rem;
}
.fp-mock-exlist {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 0.45rem;
}
.fp-mock-ex {
	display: grid;
	grid-template-columns: 36px 1fr 22px;
	gap: 0.55rem;
	align-items: center;
	background: var(--fp-bg-card);
	border: 1px solid rgba(255, 255, 255, 0.06);
	border-radius: 0.7rem;
	padding: 0.4rem 0.6rem 0.4rem 0.4rem;
}
.fp-mock-ex-active {
	border-color: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.45);
	box-shadow: 0 0 0 1px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.25);
}
.fp-mock-ex-done {
	opacity: 0.55;
}
.fp-mock-ex-thumb {
	width: 36px;
	height: 36px;
	border-radius: 0.45rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: rgba(255, 255, 255, 0.85);
	overflow: hidden;
	position: relative;
}
.fp-mock-ex-thumb svg {
	width: 100%;
	height: 100%;
}
.fp-mock-ex-thumb-a { background: radial-gradient(120% 80% at 30% 20%, #3a3a18, #16160a 70%); }
.fp-mock-ex-thumb-b { background: radial-gradient(120% 80% at 70% 30%, #2c1c12, #0e0604 70%); }
.fp-mock-ex-thumb-c { background: radial-gradient(120% 80% at 30% 30%, #1c2c14, #0a1404 70%); }
.fp-mock-ex-thumb-d { background: radial-gradient(120% 80% at 50% 30%, #1c1c2a, #06060c 70%); }
.fp-mock-ex-thumb-e { background: radial-gradient(120% 80% at 60% 30%, #2a1c2c, #0c060c 70%); }
.fp-mock-ex-body {
	display: flex;
	flex-direction: column;
	gap: 0.1rem;
	min-width: 0;
}
.fp-mock-ex-name {
	font-size: 0.85rem;
	font-weight: 700;
}
.fp-mock-ex-sets {
	font-size: 0.72rem;
	color: var(--fp-text-muted);
}
.fp-mock-ex-sets em {
	font-style: normal;
	color: var(--fp-accent);
}
.fp-mock-ex-check {
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: var(--fp-accent);
	color: var(--brand-bg, #0a0a0a);
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 800;
	font-size: 0.8rem;
}
.fp-mock-ex-check-empty {
	background: transparent;
	border: 1.5px solid rgba(255, 255, 255, 0.2);
}

/* --- Mockup: par-kort (Övningsbank + Kostbank) --- */
.fp-feature-row-pair {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.5rem;
}
@media (min-width: 720px) {
	.fp-feature-row-pair {
		grid-template-columns: 1fr 1fr;
		gap: 1.75rem;
	}
}
.fp-feature-pair-card {
	background: var(--fp-bg-card);
	border: 1px solid rgba(255, 255, 255, 0.06);
	border-radius: var(--fp-radius);
	padding: 1.25rem 1.25rem 1.5rem;
	display: flex;
	flex-direction: column;
}
.fp-feature-pair-mockup {
	margin: -0.25rem -0.25rem 1.1rem;
	padding: 0;
	background: transparent;
	border-radius: 1rem;
	border: 0;
	position: relative;
}
.fp-mock-screen {
	background: linear-gradient(180deg, #111, var(--brand-bg, #0a0a0a) 40%);
	border: 1px solid rgba(255, 255, 255, 0.06);
	border-radius: 1.1rem;
	padding: 0;
	overflow: hidden;
	box-shadow:
		0 14px 40px -22px rgba(0, 0, 0, 0.7),
		inset 0 0 0 1px rgba(255, 255, 255, 0.02);
}
.fp-mock-screen-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0.7rem 0.95rem;
	background: rgba(255, 255, 255, 0.025);
	border-bottom: 1px solid rgba(255, 255, 255, 0.05);
	font-size: 0.75rem;
	color: var(--fp-text-muted);
}
.fp-mock-screen-title {
	font-weight: 800;
	color: var(--fp-text);
	font-size: 0.85rem;
	letter-spacing: -0.005em;
}
.fp-mock-screen-bar-icons {
	color: var(--fp-text-muted);
	font-size: 0.95rem;
	letter-spacing: 0.1em;
}
.fp-mock-screen .fp-mock-bank,
.fp-mock-screen .fp-mock-recept {
	padding: 0.85rem;
}
.fp-mock-screen .fp-mock-bank-chips-tight {
	padding: 0.85rem 0.85rem 0;
}

/* Övningsbank-mockup */
.fp-mock-bank {
	display: flex;
	flex-direction: column;
	gap: 0.65rem;
}
.fp-mock-bank-search {
	display: flex;
	align-items: center;
	gap: 0.55rem;
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(255, 255, 255, 0.06);
	border-radius: 0.6rem;
	padding: 0.5rem 0.75rem;
	color: var(--fp-text-muted);
	font-size: 0.85rem;
}
.fp-mock-bank-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem;
}
.fp-mock-chip {
	font-size: 0.72rem;
	padding: 0.25rem 0.6rem;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(255, 255, 255, 0.08);
	color: var(--fp-text-muted);
}
.fp-mock-chip-active {
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.15);
	border-color: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.55);
	color: var(--fp-accent);
}
.fp-mock-bank-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0.5rem;
}
.fp-mock-bank-tile {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	background: rgba(255, 255, 255, 0.03);
	border: 1px solid rgba(255, 255, 255, 0.06);
	border-radius: 0.55rem;
	padding: 0.45rem;
	font-size: 0.78rem;
	color: var(--fp-text);
}
.fp-mock-bank-thumb {
	display: block;
	height: 64px;
	border-radius: 0.55rem;
	background: linear-gradient(135deg, #2a2a18, #1a1a0a);
	position: relative;
	overflow: hidden;
	color: rgba(255, 255, 255, 0.78);
}
.fp-mock-bank-thumb-a { background: radial-gradient(120% 80% at 30% 20%, #3a3a18, #16160a 70%); }
.fp-mock-bank-thumb-b { background: radial-gradient(120% 80% at 70% 30%, #1c2c14, #0a1404 70%); }
.fp-mock-bank-thumb-c { background: radial-gradient(120% 80% at 50% 30%, #2c1c12, #0e0604 70%); }
.fp-mock-bank-thumb-d { background: radial-gradient(120% 80% at 60% 30%, #1c1c2a, #06060c 70%); }
.fp-mock-bank-thumb::before {
	/* Mjuk vinjettering – ger "fotokänsla" */
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(80% 60% at 50% 35%, transparent, rgba(0, 0, 0, 0.45) 100%);
	pointer-events: none;
}
.fp-mock-bank-svg {
	position: absolute;
	inset: 6px;
	width: calc(100% - 12px);
	height: calc(100% - 12px);
	stroke: currentColor;
	fill: none;
	stroke-linecap: round;
	stroke-linejoin: round;
	opacity: 0.9;
}
.fp-mock-bank-time {
	position: absolute;
	top: 5px;
	right: 5px;
	background: rgba(0, 0, 0, 0.65);
	color: rgba(255, 255, 255, 0.95);
	font-size: 0.55rem;
	padding: 1px 4px;
	border-radius: 3px;
	font-weight: 700;
	letter-spacing: 0.04em;
	font-variant-numeric: tabular-nums;
	backdrop-filter: blur(2px);
}
.fp-mock-bank-play {
	position: absolute;
	left: 6px;
	bottom: 5px;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.9);
	color: var(--brand-bg, #0a0a0a);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 0.55rem;
	padding-left: 1px;
	box-shadow: 0 4px 10px -3px rgba(0, 0, 0, 0.6);
}

/* Kostbank-mockup */
.fp-mock-recept {
	display: flex;
	flex-direction: column;
	gap: 0.55rem;
}
.fp-mock-recept-card {
	display: grid;
	grid-template-columns: 76px 1fr;
	gap: 0.7rem;
	background: rgba(255, 255, 255, 0.03);
	border: 1px solid rgba(255, 255, 255, 0.06);
	border-radius: 0.6rem;
	padding: 0.5rem;
	overflow: hidden;
}
.fp-mock-recept-thumb {
	height: 76px;
	width: 76px;
	border-radius: 0.5rem;
	position: relative;
	overflow: hidden;
}
.fp-mock-recept-thumb::after {
	/* Mjuk topglans – ger fotokänsla snarare än platt färg */
	content: "";
	position: absolute;
	inset: 0;
	background:
		radial-gradient(120% 70% at 30% 15%, rgba(255, 255, 255, 0.18), transparent 55%),
		radial-gradient(80% 50% at 70% 85%, rgba(0, 0, 0, 0.4), transparent 60%);
	pointer-events: none;
}
.fp-mock-recept-thumb-1 {
	background: linear-gradient(160deg, #6b4520, #2d1a0a 70%);
}
.fp-mock-recept-thumb-2 {
	background: linear-gradient(160deg, #5a2424, #2d0e0e 70%);
}
.fp-mock-plate {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 64px;
	height: 64px;
	border-radius: 50%;
	background:
		radial-gradient(circle at 50% 50%, #f0eadd 0 50%, #d8d0c0 56%, #c8bfac 100%);
	box-shadow:
		inset 0 0 0 2px rgba(0, 0, 0, 0.12),
		inset 0 -4px 8px rgba(0, 0, 0, 0.18),
		0 2px 6px rgba(0, 0, 0, 0.35);
}
.fp-mock-food {
	position: absolute;
	border-radius: 50%;
	z-index: 1;
}
/* Tallrik 1 – kyckling, quinoa, rotfrukter */
.fp-mock-food-1a {
	left: 18px; top: 16px;
	width: 22px; height: 18px;
	background: radial-gradient(circle at 35% 35%, #f1c98a, #b87a3a 70%, #6e4218);
	border-radius: 45% 55% 60% 40% / 60% 40% 60% 40%;
	box-shadow: inset -2px -2px 3px rgba(0, 0, 0, 0.25);
}
.fp-mock-food-1b {
	left: 38px; top: 38px;
	width: 22px; height: 18px;
	background: radial-gradient(circle at 30% 30%, #f5d678, #c89c2a);
	border-radius: 50%;
	box-shadow:
		inset -2px -2px 3px rgba(0, 0, 0, 0.18),
		2px 2px 0 -1px #c89c2a, -3px 1px 0 -1px #b08820;
}
.fp-mock-food-1c {
	left: 16px; top: 38px;
	width: 18px; height: 16px;
	background: radial-gradient(circle at 35% 30%, #d28a4c, #7a3e1a);
	border-radius: 40% 60% 55% 45% / 50% 50% 55% 45%;
}
/* Tallrik 2 – pasta + tomat */
.fp-mock-food-2a {
	left: 14px; top: 14px;
	width: 48px; height: 32px;
	background:
		repeating-linear-gradient(115deg, #f0c060 0 2px, #d6a040 2px 4px, #f0c060 4px 6px);
	border-radius: 50%;
	box-shadow: inset 0 -3px 4px rgba(0, 0, 0, 0.22);
	opacity: 0.92;
}
.fp-mock-food-2b {
	left: 20px; top: 36px;
	width: 14px; height: 14px;
	background: radial-gradient(circle at 35% 30%, #ff7060, #c02828 70%);
	border-radius: 50%;
	box-shadow: inset -1px -2px 2px rgba(0, 0, 0, 0.3);
}
.fp-mock-food-2c {
	left: 40px; top: 42px;
	width: 12px; height: 12px;
	background: radial-gradient(circle at 35% 30%, #ff7060, #c02828 70%);
	border-radius: 50%;
	box-shadow: inset -1px -2px 2px rgba(0, 0, 0, 0.3);
}
.fp-mock-save {
	position: absolute;
	top: 4px;
	right: 5px;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	background: rgba(0, 0, 0, 0.45);
	color: #fff;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 0.65rem;
	z-index: 2;
	backdrop-filter: blur(2px);
}
.fp-mock-recept-body {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
	min-width: 0;
}
.fp-mock-recept-tag {
	font-size: 0.6rem;
	font-weight: 800;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--fp-accent);
	margin: 0;
}
.fp-mock-recept-title {
	font-size: 0.85rem;
	font-weight: 700;
	margin: 0;
	line-height: 1.25;
}
.fp-mock-recept-meta {
	font-size: 0.72rem;
	color: var(--fp-text-muted);
	margin: 0;
}

/* --- Mockup: Fystester (spelar-vy) --- */
.fp-mock-test-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	background: var(--fp-bg-card);
	border-left: 3px solid rgba(255, 255, 255, 0.1);
	border-radius: 0.6rem;
	padding: 0.6rem 0.85rem;
}
.fp-mock-test-row-ok    { border-left-color: #4ade80; }
.fp-mock-test-row-near  { border-left-color: #facc15; }
.fp-mock-test-row-miss  { border-left-color: #f87171; }
.fp-mock-test-row-empty { border-left-color: rgba(255,255,255,0.15); }
.fp-mock-test-name {
	font-size: 0.88rem;
	font-weight: 700;
	margin: 0;
}
.fp-mock-test-meta {
	font-size: 0.7rem;
	color: var(--fp-text-muted);
	margin: 0;
}
.fp-mock-test-value {
	font-size: 1rem;
	font-weight: 800;
	color: var(--fp-accent);
	font-variant-numeric: tabular-nums;
}
.fp-mock-test-add {
	font-size: 1.4rem;
	color: var(--fp-text-muted);
	width: 1.6rem;
	height: 1.6rem;
	border-radius: 50%;
	border: 1.5px dashed rgba(255, 255, 255, 0.18);
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

/* --- Mockup: Tränar-dashboard --- */
.fp-mock-coach {
	padding: 1rem 1rem 0;
	display: flex;
	flex-direction: column;
	gap: 0.7rem;
}
.fp-mock-stats-row {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0.4rem;
}
.fp-mock-stat {
	background: var(--fp-bg-card);
	border: 1px solid rgba(255, 255, 255, 0.06);
	border-radius: 0.6rem;
	padding: 0.55rem 0.4rem;
	text-align: center;
}
.fp-mock-stat strong {
	display: block;
	font-size: 1.2rem;
	font-weight: 800;
	color: var(--fp-accent);
	line-height: 1;
}
.fp-mock-stat span {
	display: block;
	font-size: 0.62rem;
	margin-top: 0.25rem;
	color: var(--fp-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.06em;
}
.fp-mock-section-title {
	font-size: 0.7rem;
	font-weight: 800;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--fp-text-muted);
	margin: 0.4rem 0 0.1rem;
}
.fp-mock-player-row {
	display: grid;
	grid-template-columns: 32px 1fr 14px;
	gap: 0.7rem;
	align-items: center;
	background: var(--fp-bg-card);
	border: 1px solid rgba(255, 255, 255, 0.06);
	border-radius: 0.6rem;
	padding: 0.55rem 0.7rem;
}
.fp-mock-avatar {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.18);
	color: var(--fp-accent);
	font-size: 0.7rem;
	font-weight: 800;
	display: flex;
	align-items: center;
	justify-content: center;
}
.fp-mock-player-body {
	min-width: 0;
}
.fp-mock-player-name {
	margin: 0;
	font-size: 0.85rem;
	font-weight: 700;
}
.fp-mock-player-meta {
	margin: 0;
	font-size: 0.7rem;
	color: var(--fp-text-muted);
}
.fp-mock-dot {
	width: 12px;
	height: 12px;
	border-radius: 50%;
	display: inline-block;
}
.fp-mock-dot-ok    { background: #4ade80; }
.fp-mock-dot-near  { background: #facc15; }
.fp-mock-dot-miss  { background: #f87171; }

/* --- Mockup: Bjud in spelare --- */
.fp-mock-input-label {
	font-size: 0.68rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--fp-text-muted);
	margin: 0.5rem 0 0.2rem;
	font-weight: 700;
}
.fp-mock-textarea,
.fp-mock-input {
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 0.55rem;
	padding: 0.55rem 0.7rem;
	font-size: 0.78rem;
	color: var(--fp-text);
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
	min-height: 2.4rem;
}
.fp-mock-textarea span,
.fp-mock-input span {
	display: block;
}
.fp-mock-cta-button {
	margin-top: 0.6rem;
	background: var(--fp-accent);
	color: var(--brand-bg, #0a0a0a);
	border: 0;
	border-radius: 0.55rem;
	padding: 0.7rem 0.9rem;
	font-size: 0.85rem;
	font-weight: 800;
	letter-spacing: 0.02em;
	cursor: default;
}
.fp-mock-input-helper {
	font-size: 0.7rem;
	color: var(--fp-text-muted);
	margin: 0.4rem 0 0;
	text-align: center;
}

/* --- Mockup: Lag-matris --- */
.fp-mock-matrix-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 0.78rem;
	background: var(--fp-bg-card);
	border-radius: 0.6rem;
	overflow: hidden;
}
.fp-mock-matrix-table th,
.fp-mock-matrix-table td {
	padding: 0.45rem 0.5rem;
	text-align: center;
	border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.fp-mock-matrix-table thead th {
	font-size: 0.7rem;
	font-weight: 700;
	color: var(--fp-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.06em;
}
.fp-mock-matrix-table tbody th {
	text-align: left;
	font-weight: 700;
	color: var(--fp-text);
	white-space: nowrap;
}
.fp-mock-matrix-table tr:last-child th,
.fp-mock-matrix-table tr:last-child td {
	border-bottom: 0;
}
.fp-mock-mdot {
	display: inline-block;
	width: 12px;
	height: 12px;
	border-radius: 50%;
}
.fp-mock-legend {
	display: flex;
	flex-wrap: wrap;
	gap: 0.85rem;
	font-size: 0.7rem;
	color: var(--fp-text-muted);
	margin-top: 0.65rem;
	justify-content: center;
}
.fp-mock-legend > span {
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
}

/* ==========================================
   Mockup-tillägg: Nästa steg-kort (Min sida)
   ========================================== */
.fp-mock-next-step {
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
	margin-top: -0.2rem;
}
.fp-mock-next-step-label {
	font-size: 0.62rem;
	font-weight: 800;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--fp-text-muted);
	margin: 0 0 0.1rem 0.2rem;
}
.fp-mock-next-step-card {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.7rem;
	background: linear-gradient(180deg, rgba(var(--brand-accent-rgb, 212, 212, 30), 0.1), rgba(var(--brand-accent-rgb, 212, 212, 30), 0.02));
	border: 1px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.4);
	border-radius: 0.85rem;
	padding: 0.7rem 0.9rem;
}
.fp-mock-next-step-card > div { min-width: 0; }
.fp-mock-next-step-title {
	font-size: 0.95rem;
	font-weight: 800;
	color: var(--fp-text);
	margin: 0;
	letter-spacing: -0.01em;
}
.fp-mock-next-step-arrow {
	color: var(--fp-accent);
	font-size: 1.1rem;
	font-weight: 800;
	flex-shrink: 0;
}

/* ==========================================
   Mockup-tillägg: Fystester med kravspec-badges
   ========================================== */
.fp-mock-pass-title-lg {
	font-size: 1.35rem;
	font-weight: 900;
	letter-spacing: 0.02em;
	margin-bottom: 0.1rem;
}
.fp-mock-kravspec-card {
	position: relative;
	background: var(--fp-bg-card);
	border: 1px solid rgba(255, 255, 255, 0.07);
	border-radius: 0.85rem;
	padding: 0.7rem 0.85rem 0.85rem;
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
}
.fp-mock-kravspec-title {
	font-size: 0.95rem;
	font-weight: 800;
	color: var(--fp-text);
	margin: 0;
}
.fp-mock-kravspec-title span {
	font-size: 0.72rem;
	font-weight: 600;
	color: var(--fp-text-muted);
	margin-left: 0.2rem;
}
.fp-mock-kravspec-ref {
	font-size: 0.65rem;
	font-weight: 700;
	color: var(--fp-accent);
	letter-spacing: 0.04em;
	margin: 0 0 0.35rem;
}
.fp-mock-kravspec-row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	font-size: 0.78rem;
	color: var(--fp-text-muted);
}
.fp-mock-kravspec-val {
	color: var(--fp-text);
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}
.fp-mock-kravspec-best {
	color: var(--fp-accent);
	font-weight: 800;
	font-variant-numeric: tabular-nums;
}
.fp-mock-kravspec-badge {
	align-self: flex-start;
	margin-top: 0.4rem;
	font-size: 0.7rem;
	font-weight: 700;
	padding: 0.2rem 0.65rem;
	border-radius: 999px;
	border: 1px solid transparent;
}
.fp-mock-kravspec-badge-ok {
	background: rgba(74, 222, 128, 0.12);
	border-color: rgba(74, 222, 128, 0.4);
	color: #4ade80;
}
.fp-mock-kravspec-badge-under {
	background: rgba(248, 113, 113, 0.12);
	border-color: rgba(248, 113, 113, 0.4);
	color: #f87171;
}

/* ==========================================
   Mockup-tillägg: Realistiska övningsthumbar
   – mörk gradient med ljus från ena hörnet
     simulerar gymljus i video
   ========================================== */
.fp-mock-bank-thumb,
.fp-mock-ex-thumb {
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05);
}
.fp-mock-bank-thumb::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
		radial-gradient(60% 60% at 75% 18%, rgba(255, 230, 140, 0.16), transparent 55%),
		radial-gradient(50% 50% at 20% 80%, rgba(0, 0, 0, 0.55), transparent 60%);
	pointer-events: none;
	z-index: 1;
}
.fp-mock-bank-svg { z-index: 2; }
.fp-mock-bank-time,
.fp-mock-bank-play { z-index: 3; }

/* ==========================================
   Intro-hero ovanför planer (spelare + appen)
   ========================================== */
.fp-kom-igang-intro-hero {
	max-width: 720px;
	margin: 0.25rem auto 2.25rem;
	text-align: center;
	padding: 0 0.5rem;
}
.fp-kom-igang-intro-eyebrow {
	font-size: 0.72rem;
	font-weight: 800;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--fp-accent);
	margin: 0 0 0.7rem;
}
.fp-kom-igang-intro-title {
	font-size: clamp(1.85rem, 4.4vw, 2.6rem);
	font-weight: 900;
	color: var(--fp-text);
	line-height: 1.1;
	letter-spacing: -0.02em;
	margin: 0 0 0.9rem;
}
.fp-kom-igang-intro-title em {
	color: var(--fp-accent);
	font-style: normal;
}
.fp-kom-igang-intro-body {
	font-size: 1.05rem;
	line-height: 1.6;
	color: var(--fp-text-muted);
	margin: 0 auto;
	max-width: 56ch;
}
.fp-kom-igang-intro-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem 0.55rem;
	justify-content: center;
	margin-top: 1.25rem;
}
.fp-kom-igang-intro-pill {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	font-size: 0.78rem;
	font-weight: 700;
	color: var(--fp-text);
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.08);
	border: 1px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.25);
	border-radius: 999px;
	padding: 0.35rem 0.8rem;
}
.fp-kom-igang-intro-pill::before {
	content: "";
	width: 0.55rem;
	height: 0.55rem;
	border-radius: 50%;
	background: var(--fp-accent);
	box-shadow: 0 0 8px var(--fp-accent-glow);
}

/* Plats för "Välj din plan" på samma sida som intro */
.fp-kom-igang-main .fp-kom-igang-intro-hero + .fp-betalning-title {
	margin-top: 0.25rem;
}

/* ==========================================
   Pass-vyn: fotorealistiska övningsthumbar
   Använder riktiga gymbilder + play-overlay
   för att inte se ut som streckgubbar
   ========================================== */
.fp-mock-ex-thumb-photo {
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	position: relative;
}
.fp-mock-ex-thumb-photo::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(160deg, rgba(0,0,0,0.05), rgba(0,0,0,0.55));
	pointer-events: none;
}
.fp-mock-ex-play {
	position: relative;
	z-index: 1;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.92);
	color: var(--brand-bg, #0a0a0a);
	font-size: 0.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	padding-left: 1px;
	box-shadow: 0 2px 6px rgba(0,0,0,0.5);
}
.fp-mock-ex-thumb-1 { background-image: url("fp-traningsval-upplagg.jpg"); }
.fp-mock-ex-thumb-2 { background-image: url("hero-gym.png"); }
.fp-mock-ex-thumb-3 { background-image: url("fp-traningsval-sasongsplanering.jpg"); }
.fp-mock-ex-thumb-4 { background-image: url("fp-traningsval-inspiration.jpg"); }
.fp-mock-ex-thumb-5 { background-image: url("landing-trial-training.png"); }

/* ==========================================
   Kostbank-mockup – egen feature-row med
   fotorealistiska receptkort (emoji-mat)
   ========================================== */
.fp-mock-kost {
	padding: 1rem 1rem 1.5rem;
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
}
.fp-mock-kost-chips {
	margin: 0.1rem 0 0.4rem;
}
.fp-mock-recipe-list {
	display: flex;
	flex-direction: column;
	gap: 0.55rem;
}
.fp-mock-recipe {
	display: grid;
	grid-template-columns: 72px 1fr;
	gap: 0.75rem;
	background: var(--fp-bg-card);
	border: 1px solid rgba(255, 255, 255, 0.06);
	border-radius: 0.75rem;
	padding: 0.55rem;
	overflow: hidden;
}
.fp-mock-recipe-photo {
	position: relative;
	height: 72px;
	width: 72px;
	border-radius: 0.55rem;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06);
}
.fp-mock-recipe-photo::before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		radial-gradient(circle at 30% 25%, rgba(255, 235, 180, 0.18), transparent 55%),
		radial-gradient(circle at 70% 80%, rgba(0, 0, 0, 0.55), transparent 65%);
	pointer-events: none;
}
/* Recept med riktigt foto – fyll hela thumben med uppladdad/lokal bild */
.fp-mock-recipe-photo-real {
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}
.fp-mock-recipe-photo-real::before {
	display: none;
}
.fp-mock-recipe-photo-pasta {
	background-image: url("recipe-pasta.jpg");
}
.fp-mock-recipe-photo-chicken {
	background-image: url("recipe-chicken.jpg");
}
.fp-mock-recipe-photo-bowl {
	background-image: url("/wp-content/uploads/2026/02/C1_matbilder_4-300x196.jpg");
}
.fp-mock-recipe-emoji {
	position: relative;
	z-index: 1;
	font-size: 2.1rem;
	line-height: 1;
	filter: drop-shadow(0 2px 6px rgba(0,0,0,0.45));
}
.fp-mock-recipe-save {
	position: absolute;
	top: 5px;
	right: 5px;
	z-index: 2;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: rgba(0, 0, 0, 0.55);
	color: rgba(255, 255, 255, 0.85);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 0.7rem;
	backdrop-filter: blur(2px);
}
.fp-mock-recipe-saved {
	color: #f87171;
	background: rgba(0, 0, 0, 0.6);
}
.fp-mock-recipe-body {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
	min-width: 0;
	justify-content: center;
}
.fp-mock-recipe-title {
	font-size: 0.9rem;
	font-weight: 800;
	color: var(--fp-text);
	margin: 0;
	line-height: 1.25;
}
.fp-mock-recipe-meta {
	font-size: 0.72rem;
	color: var(--fp-text-muted);
	margin: 0;
}

/* ==========================================
   "Så kommer du igång" – när blocket sitter direkt
   under planer behöver vi mindre top-padding
   ========================================== */
.fp-kom-igang-flow-top {
	margin-top: 2.75rem;
	padding-top: 0;
	border-top: 0;
}

/* ==========================================
   Tight-variant av kom-igang-title – när ingen
   lead-text följer ska första feature-raden
   ligga nära rubriken
   ========================================== */
.fp-kom-igang-title-tight {
	margin-bottom: 0.25rem;
}
.fp-kom-igang-title-tight + .fp-feature-row {
	margin-top: 0.75rem;
}
@media (min-width: 860px) {
	.fp-kom-igang-title-tight + .fp-feature-row {
		margin-top: 1rem;
	}
}
/* När info-blocket inleds med tight-title, drag in lite extra */
.fp-kom-igang-info-block:has(.fp-kom-igang-title-tight) {
	padding-top: 1.25rem;
}

/* ==========================================
   Toolbar med roll-väljare + tillbaka
   Sitter högst upp i main, ovanför rubriken
   ========================================== */
.fp-kom-igang-toolbar {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.75rem;
	margin-bottom: 1.5rem;
}
.fp-kom-igang-toolbar .fp-back-link-toolbar {
	margin: 0;
	font-size: 0.9rem;
}
.fp-role-switcher {
	display: inline-flex;
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 999px;
	padding: 4px;
	gap: 2px;
}
.fp-role-switcher-option {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.45rem 1.1rem;
	font-size: 0.85rem;
	font-weight: 700;
	color: var(--fp-text-muted) !important;
	text-decoration: none !important;
	border-radius: 999px;
	letter-spacing: 0.02em;
	transition: background-color 0.18s ease, color 0.18s ease;
	min-height: 0;
}
@media (hover: hover) and (pointer: fine) {
	.fp-role-switcher-option:hover {
		color: var(--fp-text) !important;
		background: rgba(255, 255, 255, 0.04);
	}
}
.fp-role-switcher-option-active,
.fp-role-switcher-option-active:hover,
.fp-role-switcher-option-active:focus,
.fp-role-switcher-option-active:visited {
	background: var(--fp-accent);
	color: var(--brand-bg, #0a0a0a) !important;
	box-shadow: 0 2px 12px -4px var(--fp-accent-glow);
}
@media (max-width: 480px) {
	.fp-role-switcher-option {
		padding: 0.4rem 0.9rem;
		font-size: 0.8rem;
	}
}

/* ==========================================
   Liten kontextrad ovanför plan-rubriken
   ========================================== */
.fp-kom-igang-plan-subtitle {
	text-align: center;
	color: var(--fp-text-muted);
	font-size: 0.95rem;
	margin: -0.5rem 0 1.5rem;
	letter-spacing: 0;
}

/* ==========================================
   Slut-CTA – stort kort efter Fystester
   ========================================== */
.fp-kom-igang-final-cta {
	margin: 3.5rem auto 1.5rem;
	max-width: 640px;
	text-align: center;
	background: linear-gradient(180deg, rgba(var(--brand-accent-rgb, 212, 212, 30), 0.06), rgba(var(--brand-accent-rgb, 212, 212, 30), 0.015));
	border: 1px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.3);
	border-radius: var(--fp-radius);
	padding: 2rem 1.5rem;
}
.fp-kom-igang-final-cta-title {
	font-size: clamp(1.4rem, 3.4vw, 1.9rem);
	font-weight: 900;
	color: var(--fp-text);
	margin: 0 0 0.65rem;
	letter-spacing: -0.01em;
}
.fp-kom-igang-final-cta-body {
	color: var(--fp-text-muted);
	font-size: 1rem;
	line-height: 1.55;
	margin: 0 auto 1.3rem;
	max-width: 48ch;
}
.fp-kom-igang-final-cta-btn {
	min-width: 220px;
}

/* ==========================================
   Sticky CTA på mobil – syns när användaren
   scrollat förbi plan-listan
   ========================================== */
.fp-kom-igang-sticky-cta {
	display: none;
}
@media (max-width: 768px) {
	.fp-kom-igang-sticky-cta {
		display: block;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		padding: 0.6rem 0.85rem calc(0.6rem + env(safe-area-inset-bottom));
		background: linear-gradient(180deg, rgba(var(--brand-bg-rgb, 10, 10, 10), 0) 0%, rgba(var(--brand-bg-rgb, 10, 10, 10), 0.85) 30%, rgba(var(--brand-bg-rgb, 10, 10, 10), 0.97) 100%);
		z-index: 50;
		pointer-events: none;
		opacity: 1;
		transform: translateY(0);
		transition: opacity 0.22s ease, transform 0.22s ease;
	}
	.fp-kom-igang-sticky-cta.is-hidden {
		opacity: 0;
		transform: translateY(60%);
		pointer-events: none;
	}
	.fp-kom-igang-sticky-btn {
		pointer-events: auto;
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 0.5rem;
		width: 100%;
		background: var(--fp-accent);
		color: var(--brand-bg, #0a0a0a);
		font-weight: 800;
		text-transform: uppercase;
		letter-spacing: 0.05em;
		text-decoration: none;
		font-size: 0.95rem;
		padding: 0.95rem 1rem;
		border-radius: 999px;
		box-shadow: 0 10px 24px -8px rgba(0, 0, 0, 0.7), 0 0 0 1px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.5);
	}
	.fp-kom-igang-sticky-arrow {
		font-size: 0.95rem;
		font-weight: 900;
	}
	/* Ge plats för sticky-knappen så innehåll och footer inte täcks */
	.fp-kom-igang-page .fp-kom-igang-main {
		padding-bottom: calc(5.5rem + env(safe-area-inset-bottom));
	}
	.fp-kom-igang-page .fp-app-footer {
		padding-bottom: 5.5rem;
	}
}

/* ==========================================
   Plan-kort på mobil – kompaktare så de inte
   tar 3 hela skärmar att scrolla förbi
   ========================================== */
@media (max-width: 639px) {
	.fp-plan-card.fp-betalning-plan-card {
		padding: 1rem 1rem 1.1rem;
		flex-direction: row;
		align-items: center;
		flex-wrap: wrap;
		gap: 0.3rem 0.6rem;
		text-align: left;
	}
	.fp-plan-card.fp-betalning-plan-card .fp-plan-label {
		flex: 0 0 auto;
		font-size: 0.78rem;
		margin: 0;
		opacity: 0.9;
	}
	.fp-plan-card.fp-betalning-plan-card .fp-plan-price {
		flex: 1 1 auto;
		text-align: right;
		font-size: 1.55rem;
		margin: 0;
		line-height: 1.1;
	}
	.fp-plan-card.fp-betalning-plan-card .fp-plan-period,
	.fp-plan-card.fp-betalning-plan-card .fp-plan-permonth {
		flex: 1 1 100%;
		margin: 0;
		font-size: 0.78rem;
		color: var(--fp-text-muted);
		text-align: left;
	}
	.fp-plan-card.fp-betalning-plan-card .fp-plan-permonth {
		color: var(--fp-accent);
		font-weight: 700;
	}
	.fp-plan-card.fp-betalning-plan-card .fp-plan-btn {
		flex: 1 1 100%;
		margin-top: 0.5rem;
	}
}

/* ==========================================
   Pass-vyn set-rad – stryk Set-etiketten på smal
   skärm för att ge utrymme åt input-rutorna
   ========================================== */
@media (max-width: 380px) {
	.fp-mock-passdetail-setrow {
		grid-template-columns: auto 1fr 1fr;
		gap: 0.35rem;
	}
	.fp-mock-passdetail-setlabel {
		font-size: 0.72rem;
	}
	.fp-mock-passdetail-input {
		padding: 0.35rem 0.5rem;
		font-size: 0.75rem;
	}
}

/* ==========================================
   Större telefon-mockup på mobil så texten
   i mockupen blir läsbar
   ========================================== */
@media (max-width: 480px) {
	.fp-phone {
		max-width: 340px;
	}
}

/* ==========================================
   Pass-detalj: utfälld övning som i riktiga appen
   – titel, video, params och logga-set-rader
   ========================================== */
.fp-mock-passdetail {
	padding: 1rem 1rem 1.5rem;
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
}
.fp-mock-passdetail-title {
	font-size: 1.3rem;
	font-weight: 800;
	color: var(--fp-text);
	margin: 0 0 0.2rem;
	letter-spacing: -0.01em;
}
.fp-mock-passdetail-video {
	position: relative;
	height: 130px;
	border-radius: 0.7rem;
	overflow: hidden;
	background-image:
		linear-gradient(180deg, rgba(0,0,0,0.25), rgba(0,0,0,0.55)),
		url("fp-traningsval-sasongsplanering.jpg");
	background-size: cover;
	background-position: center;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06);
}
.fp-mock-passdetail-playbtn {
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.95);
	color: var(--brand-bg, #0a0a0a);
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1rem;
	padding-left: 2px;
	box-shadow: 0 6px 18px -4px rgba(0,0,0,0.6);
}
.fp-mock-passdetail-duration {
	position: absolute;
	bottom: 7px;
	right: 8px;
	background: rgba(0, 0, 0, 0.7);
	color: #fff;
	padding: 1.5px 5px;
	border-radius: 3px;
	font-size: 0.62rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	font-variant-numeric: tabular-nums;
}
.fp-mock-passdetail-params {
	list-style: none;
	padding: 0;
	margin: 0.2rem 0 0.3rem;
	display: flex;
	flex-wrap: wrap;
	gap: 0.45rem;
}
.fp-mock-passdetail-params li {
	font-size: 0.72rem;
	font-weight: 700;
	color: var(--fp-text);
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.1);
	border: 1px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.3);
	border-radius: 999px;
	padding: 0.25rem 0.65rem;
}
.fp-mock-passdetail-loghint {
	font-size: 0.7rem;
	font-weight: 800;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--fp-text-muted);
	margin: 0.3rem 0 0;
}
.fp-mock-passdetail-setrow {
	display: grid;
	grid-template-columns: 50px 1fr 1fr;
	gap: 0.45rem;
	align-items: center;
}
.fp-mock-passdetail-setlabel {
	font-size: 0.78rem;
	font-weight: 700;
	color: var(--fp-text);
}
.fp-mock-passdetail-input {
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 0.5rem;
	padding: 0.4rem 0.65rem;
	font-size: 0.8rem;
	color: var(--fp-text-muted);
	text-align: left;
	font-variant-numeric: tabular-nums;
}
.fp-mock-passdetail-input-filled {
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.08);
	border-color: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.35);
	color: var(--fp-accent);
	font-weight: 700;
}

/* ==========================================
   Onboarding-flöde – 4 stegs-kort med koppling
   ========================================== */
.fp-kom-igang-flow {
	margin-top: 4rem;
	padding-top: 2.5rem;
	border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.fp-kom-igang-flow .fp-kom-igang-title {
	margin-bottom: 1.75rem;
}
.fp-flow-steps {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.25rem;
	counter-reset: fp-flow;
	position: relative;
}
@media (min-width: 720px) {
	.fp-flow-steps {
		grid-template-columns: repeat(2, 1fr);
		gap: 1.5rem;
	}
}
@media (min-width: 1080px) {
	.fp-flow-steps {
		grid-template-columns: repeat(4, 1fr);
		gap: 1.25rem;
	}
}
.fp-flow-step {
	background: var(--fp-bg-card);
	border: 1px solid rgba(255, 255, 255, 0.06);
	border-radius: var(--fp-radius);
	padding: 1.5rem 1.4rem 1.6rem;
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}
.fp-flow-step::before {
	/* Diskret uppåt-ljus från accent */
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	pointer-events: none;
	background: linear-gradient(180deg, rgba(var(--brand-accent-rgb, 212, 212, 30), 0.08), transparent 35%);
}
.fp-flow-num {
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 50%;
	background: var(--fp-accent);
	color: var(--brand-bg, #0a0a0a);
	font-weight: 900;
	font-size: 1.1rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 0 24px -6px var(--fp-accent-glow);
	margin-bottom: 0.4rem;
}
.fp-flow-step-title {
	font-size: 1.05rem;
	font-weight: 800;
	color: var(--fp-text);
	margin: 0;
	letter-spacing: -0.01em;
}
.fp-flow-step-body {
	font-size: 0.92rem;
	line-height: 1.55;
	color: var(--fp-text-muted);
	margin: 0;
}
/* Pilar mellan steg på desktop */
@media (min-width: 1080px) {
	.fp-flow-step:not(:last-child)::after {
		content: "";
		position: absolute;
		top: 50%;
		right: -0.85rem;
		transform: translateY(-50%);
		width: 1rem;
		height: 1rem;
		border-top: 2px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.55);
		border-right: 2px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.55);
		rotate: 45deg;
		z-index: 2;
	}
}

/* === Kom igång > Coaching (spelare): specialitet-tabs och coach-paneler === */
.fp-kom-igang-title-accent {
	color: var(--fp-accent);
}

.fp-coach-tabs {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 0.4rem;
	margin: 0 0 1.5rem;
	padding: 0;
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(255, 255, 255, 0.06);
	border-radius: 14px;
}
.fp-coach-tab {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.4rem;
	padding: 0.85rem 0.4rem;
	border: 0 !important;
	border-radius: 12px;
	background: transparent !important;
	color: var(--fp-text-muted);
	font: inherit;
	cursor: pointer;
	transition: background 0.15s ease, box-shadow 0.15s ease, color 0.15s ease, transform 0.05s ease;
	-webkit-tap-highlight-color: transparent;
}
.fp-coach-tab:hover {
	background: rgba(255, 255, 255, 0.04) !important;
	color: var(--fp-text);
}
.fp-coach-tab:active {
	transform: scale(0.98);
}
.fp-coach-tab:focus,
.fp-coach-tab:focus-visible {
	outline: 0 !important;
	box-shadow: none !important;
	background: transparent !important;
	color: var(--fp-text-muted) !important;
}
.fp-coach-tab.fp-coach-tab-active,
.fp-coach-tab.fp-coach-tab-active:focus,
.fp-coach-tab.fp-coach-tab-active:focus-visible,
.fp-coach-tab.fp-coach-tab-active:active,
.fp-coach-tab.fp-coach-tab-active:hover {
	background: var(--fp-bg-card) !important;
	color: var(--fp-text) !important;
	box-shadow: 0 0 0 2px var(--fp-accent), 0 6px 22px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.18) !important;
}
.fp-coach-tab-photo {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	overflow: hidden;
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.12);
	border: 1.5px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.35);
	flex-shrink: 0;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.fp-coach-tab-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 18%;
	display: block;
}
.fp-coach-tab-photo-fallback {
	color: var(--fp-accent);
	font-weight: 800;
	font-size: 0.95rem;
	letter-spacing: 0.02em;
}
.fp-coach-tab-active .fp-coach-tab-photo {
	border-color: var(--fp-accent);
	box-shadow: 0 0 0 2px rgba(var(--brand-accent-rgb, 212, 212, 30), 0.22);
}
.fp-coach-tab-text {
	display: flex;
	flex-direction: column;
	align-items: center;
	line-height: 1.2;
	gap: 0.15rem;
	min-width: 0;
	max-width: 100%;
}
.fp-coach-tab-spec {
	font-size: 0.82rem;
	font-weight: 700;
	letter-spacing: 0.01em;
	text-align: center;
}
.fp-coach-tab-name {
	font-size: 0.72rem;
	font-weight: 500;
	color: var(--fp-text-subtle);
	letter-spacing: 0.01em;
	text-align: center;
	max-width: 100%;
}
.fp-coach-tab-name-short {
	display: none;
}
.fp-coach-tab-active .fp-coach-tab-name {
	color: var(--fp-text-muted);
}

@media (max-width: 720px) {
	.fp-coach-tab-name-full {
		display: none;
	}
	.fp-coach-tab-name-short {
		display: inline;
	}
}

@media (max-width: 520px) {
	.fp-coach-tabs {
		gap: 0.25rem;
	}
	.fp-coach-tab {
		padding: 0.7rem 0.25rem;
		gap: 0.35rem;
	}
	.fp-coach-tab-photo {
		width: 36px;
		height: 36px;
	}
	.fp-coach-tab-photo-fallback {
		font-size: 0.82rem;
	}
	.fp-coach-tab-spec {
		font-size: 0.72rem;
	}
	.fp-coach-tab-name {
		font-size: 0.65rem;
	}
}

.fp-coach-panel {
	background: var(--fp-bg-card);
	border: 1px solid rgba(255, 255, 255, 0.06);
	border-radius: 18px;
	padding: 1.5rem;
	margin: 0 0 1.25rem;
}
.fp-coach-panel[hidden] {
	display: none;
}

.fp-coach-panel-hero {
	display: flex;
	align-items: center;
	gap: 1.5rem;
	margin-bottom: 1.5rem;
}
.fp-coach-panel-photo {
	flex: 0 0 auto;
	width: 140px;
	height: 140px;
	border-radius: 50%;
	overflow: hidden;
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.12);
	border: 2px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.35);
	display: flex;
	align-items: center;
	justify-content: center;
}
.fp-coach-panel-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 15%;
	display: block;
}
.fp-coach-panel-photo-fallback {
	font-size: 2.5rem;
	font-weight: 800;
	color: var(--fp-accent);
}
.fp-coach-panel-intro {
	flex: 1 1 auto;
	min-width: 0;
}
.fp-coach-panel-eyebrow {
	margin: 0 0 0.3rem;
	font-size: 0.72rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--fp-accent);
	font-weight: 700;
}
.fp-coach-panel-name {
	margin: 0 0 0.2rem;
	font-size: clamp(1.35rem, 3vw, 1.65rem);
	font-weight: 800;
	letter-spacing: -0.01em;
	color: var(--fp-text);
}
.fp-coach-panel-role {
	margin: 0 0 0.75rem;
	font-size: 0.92rem;
	color: var(--fp-text-subtle);
	font-weight: 500;
}
.fp-coach-panel-lead {
	margin: 0;
	font-size: 0.98rem;
	line-height: 1.6;
	color: var(--fp-text-muted);
}

.fp-coach-panel-body {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.75rem;
	margin-bottom: 1.5rem;
}
.fp-coach-panel-col {
	min-width: 0;
}
.fp-coach-panel-coltitle {
	margin: 0 0 0.85rem;
	font-size: 0.78rem;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	font-weight: 700;
	color: var(--fp-text-muted);
}
.fp-coach-panel-list {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 0.55rem;
}
.fp-coach-panel-list li {
	position: relative;
	padding-left: 1.6rem;
	font-size: 0.95rem;
	line-height: 1.5;
	color: var(--fp-text);
}
.fp-coach-panel-list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.45rem;
	width: 0.85rem;
	height: 0.5rem;
	border-left: 2px solid var(--fp-accent);
	border-bottom: 2px solid var(--fp-accent);
	transform: rotate(-45deg);
	border-bottom-left-radius: 2px;
}
.fp-coach-panel-flow {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 0.85rem;
}
.fp-coach-panel-flow li {
	display: flex;
	gap: 0.85rem;
	align-items: flex-start;
}
.fp-coach-panel-flow-num {
	flex: 0 0 auto;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: rgba(var(--brand-accent-rgb, 212, 212, 30), 0.15);
	color: var(--fp-accent);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 0.85rem;
	font-weight: 800;
	border: 1px solid rgba(var(--brand-accent-rgb, 212, 212, 30), 0.45);
}
.fp-coach-panel-flow-text {
	min-width: 0;
}
.fp-coach-panel-flow-title {
	margin: 0 0 0.15rem;
	font-size: 0.95rem;
	font-weight: 700;
	color: var(--fp-text);
	letter-spacing: -0.005em;
}
.fp-coach-panel-flow-body {
	margin: 0;
	font-size: 0.88rem;
	line-height: 1.5;
	color: var(--fp-text-muted);
}

.fp-coach-panel-cta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	align-items: center;
	justify-content: center;
	margin-bottom: 0.85rem;
}
.fp-coach-panel-btn-primary {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: auto;
	min-height: 0;
	padding: 0.55rem 1.4rem;
	font-size: 0.85rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	border-radius: 999px;
}
.fp-coach-panel-note {
	margin: 0;
	font-size: 0.8rem;
	color: var(--fp-text-subtle);
	line-height: 1.5;
	text-align: center;
}

@media (max-width: 720px) {
	.fp-coach-panel {
		padding: 1.25rem 1rem;
		border-radius: 16px;
	}
	.fp-coach-panel-hero {
		flex-direction: column;
		text-align: center;
		gap: 1rem;
	}
	.fp-coach-panel-photo {
		width: 120px;
		height: 120px;
	}
	.fp-coach-panel-body {
		grid-template-columns: 1fr;
		gap: 1.25rem;
	}
	.fp-coach-panel-cta {
		flex-direction: row;
		justify-content: center;
		align-items: center;
	}
}



/* ================================================================
   Hockey-specifika yt-overrides. Scopade på body.fp-brand-hockey,
   träffar aldrig floorball. Klubbsektionen dold tills klubbar finns.
   Foton dämpas och tonas i petrol så de smälter in i bakgrunden.
   ================================================================ */
.fp-brand-hockey .fp-app-clubs { display: none; }
.fp-brand-hockey .fp-app-you-can-friskvard { background: #15252F; }
.fp-brand-hockey .fp-friskvard-portal { background: #15252F; }
.fp-brand-hockey .fp-app-hero-overlay {
	background: linear-gradient(to bottom, rgba(29, 50, 64, 0.55) 0%, rgba(29, 50, 64, 0.8) 50%, #1D3240 100%);
}
.fp-brand-hockey .fp-app-hero-bg { filter: saturate(0.7); }
.fp-brand-hockey .fp-app-you-can-block__media::after {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(29, 50, 64, 0.45);
	pointer-events: none;
}
.fp-brand-hockey .fp-app-you-can-block__img { filter: saturate(0.7); }