.pjm-booking-root {
	/* Isolér plugin'ets stacking-kontekst så indhold ikke bløder over fixed/sticky topmenu. */
	position: relative;
	z-index: 0;
	isolation: isolate;
	/* Forhindrer horizontal overflow uanset hvilken container widget'et placeres i. */
	max-width: 100%;
	min-width: 0;
	overflow-x: clip;
	box-sizing: border-box;
	--pjm-primary: #1f4e79;
	--pjm-accent: #e6a532;
	--pjm-button-bg: #1f4e79;
	--pjm-button-text: #ffffff;
	--pjm-chip-bg: #1f4e79;
	--pjm-chip-text: #ffffff;
	--pjm-card-bg: #f7f5ef;
	--pjm-card-border: #e5e1d6;
	--pjm-heading: #1f4e79;
	--pjm-text: #2a2a2a;
	--pjm-bg: #ffffff;
	--pjm-text-soft: #6b6b6b;
	--pjm-radius: 12px;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
	color: var(--pjm-text);
}

.pjm-cta-button {
	display: inline-flex; align-items: center; gap: 8px;
	background: var(--pjm-button-bg); color: var(--pjm-button-text);
	border: 0; padding: 14px 28px; border-radius: 999px;
	font-size: 16px; font-weight: 600; cursor: pointer;
	transition: filter 0.15s, transform 0.15s;
}
.pjm-cta-button:hover { filter: brightness(0.92); transform: translateY(-1px); }
.pjm-cta-button:focus { outline: 3px solid color-mix(in srgb, var(--pjm-primary) 30%, transparent); outline-offset: 2px; }

.pjm-inline-wrap { width: 100%; }

.pjm-flow {
	background: var(--pjm-bg);
	border: 1px solid var(--pjm-card-border);
	border-radius: var(--pjm-radius);
	padding: 28px;
}

.pjm-stepper {
	display: flex; gap: 6px; margin-bottom: 24px; flex-wrap: wrap;
}
.pjm-step-pill {
	display: flex; align-items: center; gap: 8px;
	padding: 6px 14px; background: var(--pjm-card-bg);
	border-radius: 999px; font-size: 13px; color: var(--pjm-text-soft);
}
.pjm-step-pill--done { background: var(--pjm-primary); color: #fff; cursor: pointer; }
.pjm-step-pill--current { background: var(--pjm-accent); color: #fff; font-weight: 600; }
.pjm-step-num {
	background: rgba(255,255,255,0.3); width: 20px; height: 20px;
	border-radius: 50%; display: flex; align-items: center; justify-content: center;
	font-size: 12px; font-weight: 700;
}
.pjm-step-pill:not(.pjm-step-pill--done):not(.pjm-step-pill--current) .pjm-step-num {
	background: #c3c4c7; color: #fff;
}

.pjm-step-heading { margin: 0 0 6px; font-size: 22px; color: var(--pjm-heading); }
.pjm-step-sub { margin: 0 0 20px; color: var(--pjm-text-soft); }

.pjm-card-grid {
	display: grid; gap: 16px;
	grid-template-columns: repeat(var(--pjm-cpr-d, 4), minmax(0, 1fr));
}
.pjm-card {
	background: var(--pjm-card-bg);
	border: 1px solid var(--pjm-card-border);
	border-radius: var(--pjm-radius);
	padding: 26px 24px;
	cursor: pointer;
	transition: all 0.2s ease;
	text-align: left;
	font-family: inherit;
	min-height: 130px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 6px;
	position: relative;
	box-shadow: 0 1px 2px rgba(0,0,0,0.04);
	overflow: hidden;
}
.pjm-card--has-image {
	padding: 0;
	justify-content: flex-start;
	gap: 0;
}
.pjm-card-image {
	width: 100%;
	aspect-ratio: 16/9;
	object-fit: cover;
	display: block;
	background: var(--pjm-card-bg);
}
.pjm-card--has-image .pjm-card-body {
	padding: 18px 22px 22px;
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
}
.pjm-card:hover {
	background: #fff;
	border-color: var(--pjm-primary);
	box-shadow: 0 8px 22px color-mix(in srgb, var(--pjm-primary) 18%, transparent);
	transform: translateY(-3px);
}
.pjm-card:focus { outline: 3px solid color-mix(in srgb, var(--pjm-primary) 30%, transparent); outline-offset: 2px; }
.pjm-card-title {
	font-size: 20px; font-weight: 700; color: var(--pjm-heading);
	margin: 0; line-height: 1.25; letter-spacing: -0.01em;
	/* Lange sammensatte ord (fx "Graviditetsscanninger") skal bryde i stedet for at flyde ud over kortet.
	   hyphens:auto deler pænt ved stavelser (kræver lang="da"); overflow-wrap er sikkerhedsnet. */
	overflow-wrap: break-word;
	word-break: break-word;
	hyphens: auto;
	min-width: 0;
}
.pjm-card-meta { font-size: 14px; color: var(--pjm-text-soft); margin: 0; line-height: 1.45; }
.pjm-card-icon { font-size: 32px; margin-bottom: 4px; display: block; }

.pjm-service-group { margin-bottom: 36px; }
.pjm-service-group:last-child { margin-bottom: 0; }
.pjm-service-group-head {
	margin-bottom: 18px;
	padding: 14px 18px;
	background: var(--pjm-card-bg);
	border-left: 4px solid var(--pjm-primary);
	border-radius: 6px;
}

/* Bundle explicit-width mode: hver kort har sin egen valgte bredde.
   4-kol grid på desktop, 2-kol på mobil, 1-kol på tiny. */
.pjm-flat-explicit {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 12px;
	align-items: stretch;
	min-width: 0;
	max-width: 100%;
}
.pjm-flat-card {
	grid-column: span var(--pjm-w-d, 1);
	min-width: 0;
	max-width: 100%;
	display: flex;
}
.pjm-flat-card > .pjm-service-card,
.pjm-flat-card > .pjm-flip-card {
	width: 100%;
}

/* Bundle flat-mode: fast 4-kolonners outer grid (2 på mobil, 1 på tiny).
   Hvert underemne-block spænder over antal kort i underemnet, med tom plads
   til højre når der er færre end 4 kort. */
.pjm-flat-row {
	display: grid;
	grid-template-columns: repeat(var(--pjm-cpr-d, 4), minmax(0, 1fr));
	gap: 12px;
	align-items: start;
	min-width: 0;
	max-width: 100%;
}
.pjm-subcat-block {
	grid-column: span var(--pjm-cols-d, 1);
	display: flex;
	flex-direction: column;
	min-width: 0;
	max-width: 100%;
	box-sizing: border-box;
}
.pjm-subcat-block .pjm-service-group-head--segment {
	margin-bottom: 12px;
}
.pjm-subcat-grid {
	display: grid !important;
	grid-template-columns: repeat(var(--pjm-cols-d, 1), minmax(0, 1fr)) !important;
	gap: 12px;
	flex: 1 1 auto;
}
.pjm-service-group-title {
	margin: 0;
	font-size: 19px;
	font-weight: 700;
	color: var(--pjm-heading);
	letter-spacing: -0.01em;
	line-height: 1.25;
}
.pjm-service-group-hint {
	margin: 4px 0 0;
	font-size: 13px;
	color: var(--pjm-text-soft);
	font-style: italic;
}

.pjm-service-grid {
	display: grid; gap: 12px;
	grid-template-columns: repeat(var(--pjm-cpr-d, 4), minmax(0, 1fr));
	align-items: stretch;
}
.pjm-service-card {
	background: var(--pjm-card-bg);
	border: 1px solid var(--pjm-card-border);
	border-radius: var(--pjm-radius);
	overflow: hidden;
	cursor: pointer;
	transition: all 0.2s ease;
	display: flex;
	flex-direction: column;
	text-align: left;
	font-family: inherit;
	padding: 0;
	margin: 0;
	box-shadow: 0 1px 2px rgba(0,0,0,0.04);
	height: 100%;
}
.pjm-service-card:hover {
	border-color: var(--pjm-primary);
	box-shadow: 0 8px 24px color-mix(in srgb, var(--pjm-primary) 18%, transparent);
	transform: translateY(-3px);
}
.pjm-service-card:hover .pjm-service-header {
	background: color-mix(in srgb, var(--pjm-primary) 8%, var(--pjm-card-bg));
}
.pjm-service-card:focus { outline: 3px solid color-mix(in srgb, var(--pjm-primary) 30%, transparent); outline-offset: 2px; }

.pjm-service-header {
	margin: 0;
	padding: 8px 16px 10px;
	background: var(--pjm-card-bg);
	border-bottom: 1px solid var(--pjm-card-border);
	transition: background 0.2s ease;
	/* Holder kort i samme række nogenlunde aligned, uden at spilde plads over 1-linje-titler. */
	min-height: 54px;
	display: flex;
	align-items: center;
}
.pjm-service-card h5.pjm-service-title,
.pjm-booking-root .pjm-service-title {
	margin: 0 !important;
	padding: 0 !important;
	line-height: 1.25 !important;
}
.pjm-booking-root .pjm-service-card,
.pjm-booking-root .pjm-service-header {
	margin: 0;
}
.pjm-service-title {
	margin: 0;
	font-size: 18px;
	font-weight: 700;
	color: var(--pjm-heading);
	line-height: 1.25;
	letter-spacing: -0.01em;
}

.pjm-service-image {
	width: 100%; aspect-ratio: 16/9; object-fit: cover;
	background: var(--pjm-card-bg);
	display: block;
}
.pjm-service-body {
	padding: 14px 16px 16px;
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	gap: 8px;
	background: var(--pjm-bg);
}
/* Visuel rækkefølge (via flex order): beskrivelse → features → locations (centreret) → meta (i bunden).
   Både locations og meta har margin-top:auto, så flex deler den ekstra plads ligeligt mellem dem —
   locations ender i kortets vertikale midte, meta i bunden. */
.pjm-service-body .pjm-service-desc { order: 1; }
.pjm-service-body .pjm-service-features-list { order: 2; }
.pjm-service-body .pjm-service-locations {
	order: 3;
	margin-top: auto;
}
.pjm-service-body .pjm-service-meta {
	order: 4;
	margin-top: auto;
}
.pjm-service-locations {
	display: flex; flex-direction: column; gap: 4px;
	align-items: center;
	padding: 8px 0;
	border-top: 1px solid var(--pjm-card-border);
	border-bottom: 1px solid var(--pjm-card-border);
	margin: 4px 0;
	text-align: center;
}
.pjm-loc-label {
	display: inline-flex; align-items: center; gap: 5px;
	font-size: 11px; font-weight: 600; text-transform: uppercase;
	letter-spacing: 0.04em; color: var(--pjm-text-soft);
	justify-content: center;
}
.pjm-loc-icon { color: var(--pjm-primary); flex-shrink: 0; }
.pjm-loc-tags { display: flex; flex-wrap: wrap; gap: 4px; justify-content: center; }
.pjm-loc-tag {
	display: inline-block;
	font-size: 12px; font-weight: 500;
	background: var(--pjm-chip-bg); color: var(--pjm-chip-text);
	padding: 3px 10px;
	border-radius: 999px;
	line-height: 1.4;
}
.pjm-service-desc { margin: 0; font-size: 13px; color: var(--pjm-text-soft); line-height: 1.5; }
.pjm-service-meta { display: flex; justify-content: space-between; align-items: center; padding-top: 8px; border-top: 1px solid var(--pjm-card-border); }
.pjm-service-price { font-weight: 600; color: var(--pjm-text); }
.pjm-service-duration { font-size: 12px; color: var(--pjm-text-soft); }
/* Bolt-temaet farver <p>/tekst blå (link-look) på mobil — tving service-beskrivelse + varighed til dæmpet grå. */
.pjm-service-desc, .pjm-service-duration { color: var(--pjm-text-soft, #6b6b6b) !important; }
.pjm-service-book {
	background: var(--pjm-button-bg); color: var(--pjm-button-text); border: 0; padding: 6px 12px;
	border-radius: 6px; font-size: 13px; font-weight: 600;
}

.pjm-service-features-list {
	margin: 0; padding: 0; list-style: none;
	display: flex; flex-direction: column; gap: 4px;
}
.pjm-service-features-list li {
	position: relative;
	padding-left: 20px;
	font-size: 13px; line-height: 1.45;
	color: var(--pjm-text);
}
.pjm-service-features-list li::before {
	content: "";
	position: absolute; left: 4px; top: 7px;
	width: 6px; height: 6px;
	background: var(--pjm-primary);
	border-radius: 50%;
}

.pjm-back-btn {
	background: var(--pjm-card-bg);
	border: 1px solid var(--pjm-card-border);
	color: var(--pjm-primary);
	cursor: pointer;
	padding: 9px 18px;
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 18px;
	font-family: inherit;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	border-radius: 999px;
	transition: all 0.15s ease;
}
.pjm-back-btn:hover {
	background: var(--pjm-primary);
	color: #fff;
	border-color: var(--pjm-primary);
	text-decoration: none;
	transform: translateX(-2px);
}
.pjm-back-btn--inline {
	margin: 22px 0 0;
	display: inline-flex;
}

/* Booking-step: knap-række lige over booking-boksen (tilbage + vælg anden klinik). */
.pjm-booking-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
	margin: 18px 0 16px;
}
.pjm-booking-actions .pjm-back-btn {
	margin-bottom: 0;
}
.pjm-switch-clinic-btn {
	background: var(--pjm-switch-bg, #2f8a5b);
	color: #ffffff;
	border: 1px solid var(--pjm-switch-bg, #2f8a5b);
	cursor: pointer;
	padding: 9px 18px;
	font-size: 14px;
	font-weight: 600;
	font-family: inherit;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	border-radius: 999px;
	transition: all 0.15s ease;
}
.pjm-switch-clinic-btn:hover {
	filter: brightness(0.93);
	transform: translateY(-1px);
	text-decoration: none;
	color: #ffffff;
}
.pjm-switch-clinic-btn:focus {
	outline: 3px solid color-mix(in srgb, #2f8a5b 35%, transparent);
	outline-offset: 2px;
}

/* Klinik-switcher: knap-row over ugevisning, vises som "Vis Hillerød / Vis Gothersgade ..." */
.pjm-clinic-switcher {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 14px;
}
.pjm-clinic-switch-btn {
	background: #fff;
	color: #1f4e79;
	border: 1px solid #d4cfc1;
	border-radius: 999px;
	padding: 8px 16px;
	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	transition: all .15s;
}
.pjm-clinic-switch-btn:hover {
	background: #1f4e79;
	color: #fff;
	border-color: #1f4e79;
}
.pjm-clinic-switch-btn--all {
	background: #fef5fa;
	border-color: #F7A5C9;
	color: #a83d75;
}
.pjm-clinic-switch-btn--all:hover {
	background: #F7A5C9;
	border-color: #F7A5C9;
	color: #fff;
}

.pjm-empty-state {
	text-align: center; padding: 40px 20px; color: var(--pjm-text-soft);
}

.pjm-custom-html {
	padding: 4px 0;
}

.pjm-bundle-toggle {
	display: flex;
	justify-content: flex-start;
	margin-bottom: 18px;
}
.pjm-bundle-show-all-btn {
	background: transparent;
	border: 1px dashed var(--pjm-primary);
	color: var(--pjm-primary);
	cursor: pointer;
	padding: 9px 18px;
	font-size: 14px;
	font-weight: 600;
	font-family: inherit;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	border-radius: 999px;
	transition: all 0.15s ease;
}
.pjm-bundle-show-all-btn:hover {
	background: var(--pjm-primary);
	color: #fff;
	border-style: solid;
	transform: translateX(2px);
}
.pjm-bundle-show-all-btn svg { transition: transform 0.15s; }
.pjm-bundle-show-all-btn:hover svg { transform: translateX(2px); }

/* Sticky påmindelses-bjælke forneden i booking-trinnet. */
.pjm-sticky-reminder {
	position: fixed;
	left: 50%;
	bottom: 0;
	transform: translate(-50%, 120%);
	z-index: 99999;
	display: flex;
	align-items: center;
	gap: 12px;
	width: calc(100% - 24px);
	max-width: 720px;
	margin: 0 0 12px;
	padding: 14px 16px;
	/* Bjælken hægtes på <body> — uden for .pjm-booking-root — så CSS-variablerne findes
	   ikke her. Brug faste hex-værdier, ellers bliver baggrunden transparent. */
	background: #1f4e79;
	color: #fff;
	border-radius: 12px;
	box-shadow: 0 6px 24px rgba(0, 0, 0, 0.28);
	font-size: 15px;
	line-height: 1.4;
	opacity: 0;
	transition: transform 0.32s ease, opacity 0.32s ease;
}
.pjm-sticky-reminder.is-visible { transform: translate(-50%, 0); opacity: 1; }
.pjm-sticky-reminder-icon { font-size: 20px; flex: 0 0 auto; }
.pjm-sticky-reminder-text { flex: 1 1 auto; }
.pjm-sticky-reminder-text strong { color: #f0b53d; letter-spacing: 0.3px; }
.pjm-sticky-reminder-close {
	flex: 0 0 auto;
	width: 32px;
	height: 32px;
	border: 0;
	background: rgba(255, 255, 255, 0.16);
	color: #fff;
	font-size: 22px;
	line-height: 1;
	border-radius: 50%;
	cursor: pointer;
	transition: background 0.2s ease;
}
.pjm-sticky-reminder-close:hover { background: rgba(255, 255, 255, 0.3); }
@media (max-width: 480px) {
	.pjm-sticky-reminder { font-size: 14px; padding: 12px 14px; }
}

.pjm-iframe-wrap {
	position: relative;
	min-height: 600px;
	border: 1px solid var(--pjm-card-border);
	border-radius: var(--pjm-radius);
	overflow: hidden;
	background: var(--pjm-card-bg);
}
.pjm-iframe-wrap iframe {
	width: 100%;
	min-height: 600px;
	height: 100%;
	border: 0;
	display: block;
}
.pjm-iframe-loading {
	position: absolute; inset: 0;
	display: flex; justify-content: center; align-items: center;
	color: var(--pjm-text-soft);
}

@media (max-width: 600px) {
	.pjm-feat-m-hide { display: none !important; }
	.pjm-flow { padding: 18px; }
	/* Kategori-kort: 2 i linje på mobil. */
	.pjm-card-grid { grid-template-columns: repeat(var(--pjm-cpr-m, 2), minmax(0, 1fr)); gap: 10px; }
	.pjm-card { padding: 18px 14px; min-height: 110px; }
	.pjm-card-title { font-size: 16px; }
	.pjm-card-meta { font-size: 12px; }
	/* Ydelses-kort: 2 i linje på mobil — kompaktere indhold. */
	.pjm-service-grid { grid-template-columns: repeat(var(--pjm-cpr-m, 2), minmax(0, 1fr)); gap: 10px; }
	.pjm-service-header { padding: 12px 12px; }
	.pjm-service-title { font-size: 15px; line-height: 1.2; }
	.pjm-service-body { padding: 10px 12px 12px; gap: 6px; }
	.pjm-service-locations { padding: 6px 0; margin: 2px 0; }
	.pjm-loc-label { font-size: 10px; }
	.pjm-loc-tag { font-size: 11px !important; padding: 2px 8px !important; }
	.pjm-service-desc { font-size: 12px; line-height: 1.4; }
	.pjm-service-meta { flex-direction: column; align-items: stretch; gap: 8px; padding-top: 6px; }
	.pjm-service-price { font-size: 14px; }
	.pjm-service-book { text-align: center; padding: 8px 12px; }
	.pjm-service-features { padding-top: 8px; margin-top: 6px; }
	.pjm-service-features li { font-size: 12px; padding-left: 16px; }
	.pjm-service-features li::before { left: 2px; top: 6px; width: 5px; height: 5px; }
	.pjm-features-label { font-size: 10px; margin-bottom: 4px; }
	/* Underemne-bjælke lidt mindre på mobil. */
	.pjm-service-group-head { padding: 10px 14px; }
	.pjm-service-group-title { font-size: 17px; }
	/* Mobil: stack underemner vertikalt — hver blok i fuld bredde, kort altid maks 50%. */
	.pjm-flat-row { grid-template-columns: 1fr; gap: 14px; }
	.pjm-subcat-block { grid-column: 1; }
	.pjm-subcat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px; }
	/* Explicit-width mode på mobil: 2-kol grid, hver kort spænder sin mobil-bredde. */
	.pjm-flat-explicit { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
	.pjm-flat-card { grid-column: span var(--pjm-w-m, 1); }
	.pjm-iframe-wrap, .pjm-iframe-wrap iframe { min-height: 500px; }
}
@media (max-width: 420px) {
	/* Helt små skærme: fald tilbage til 1 kort pr. linje for begge. */
	.pjm-card-grid { grid-template-columns: 1fr; }
	.pjm-service-grid { grid-template-columns: 1fr; }
	.pjm-clinic-grid { grid-template-columns: 1fr; }
	.pjm-flat-row { grid-template-columns: 1fr; }
	.pjm-subcat-block { grid-column: 1 / -1; }
	.pjm-subcat-grid { grid-template-columns: 1fr !important; }
	.pjm-flat-explicit { grid-template-columns: 1fr; }
	.pjm-flat-card { grid-column: 1 / -1; }
}

/* ---------- Flip-card (klinik-valg på bagsiden af ydelses-kort) ---------- */
/* Safari-noter:
   - `transform-style: preserve-3d` paa et `display: grid`-element bliver flattenet i Safari
     -> back-face roterer men `backface-visibility: hidden` virker ikke -> kortet ser spejlvendt ud.
   - Loesning: absolut-positionerede faces inde i en almindelig (relative) inner. -webkit-prefixes
     paa transform-egenskaberne for ekstra robusthed paa aeldre iOS-versioner. */
.pjm-flip-card {
	-webkit-perspective: 1200px;
	perspective: 1200px;
	position: relative;
	display: block;
	height: 100%;
	min-width: 0;
	max-width: 100%;
	box-sizing: border-box;
}
.pjm-flip-card__inner {
	position: relative;
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transition: -webkit-transform 0.55s cubic-bezier(0.2, 0.7, 0.2, 1);
	transition: transform 0.55s cubic-bezier(0.2, 0.7, 0.2, 1);
	height: 100%;
	min-height: 100%;
	min-width: 0;
	max-width: 100%;
	will-change: transform;
}
.pjm-flip-card.is-flipped .pjm-flip-card__inner {
	-webkit-transform: rotateY(180deg);
	transform: rotateY(180deg);
}
.pjm-flip-face {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	min-width: 0;
	max-width: 100%;
	box-sizing: border-box;
}
/* Front-face: i flow — bidrager med hoejde til card. Bagside er absolut overlay. */
.pjm-flip-face--front {
	position: relative;
	z-index: 2;
	-webkit-transform: rotateY(0deg);
	transform: rotateY(0deg);
	height: 100%;
	/* Hjørne-afrunding: overflow:hidden + border-radius klipper ikke paalideligt paa et
	   backface-visibility:hidden-element i en preserve-3d-kontekst (WebKit) -> firkantede
	   hjoerner foer flip. Genhaandhaev radius + tving klipning med radial-mask (Safari-fix). */
	border-radius: var(--pjm-radius);
	overflow: hidden;
	-webkit-mask-image: -webkit-radial-gradient(white, black);
}
.pjm-flip-face--back {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	-webkit-transform: rotateY(180deg);
	transform: rotateY(180deg);
	background: var(--pjm-bg);
	border: 1px solid var(--pjm-card-border);
	border-radius: 8px;
	padding: 16px 16px 12px;
	display: flex;
	flex-direction: column;
	/* Top-aligner header; klinik-knapperne vokser og fylder resten af kortet, så
	   de er umulige at overse (tidligere bottom-aligned -> blev overset i bunden). */
	justify-content: flex-start;
	pointer-events: none;
	box-sizing: border-box;
	overflow: hidden;
}
.pjm-flip-card.is-flipped .pjm-flip-face--back { pointer-events: auto; }
/* Valgt/flippet kort: lyserød (primær) kant + blød ring, så det er tydeligt hvilket kort man vælger tillæg til. */
.pjm-flip-card.is-flipped .pjm-flip-face--back {
	border-color: var(--pjm-primary);
	box-shadow: 0 0 0 2px color-mix(in srgb, var(--pjm-primary) 30%, transparent);
}
.pjm-flip-card.is-flipped .pjm-flip-face--front { pointer-events: none; }

/* Klinik-valg billede øverst på bagsiden — analogt med forsidens .pjm-service-image.
   Med margin-bottom: auto forbliver billedet i toppen selv om back-face har justify-content: flex-end. */
.pjm-flip-back-image {
	width: calc(100% + 32px);
	margin: -16px -16px 12px;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	display: block;
	background: var(--pjm-card-bg);
	border-radius: 8px 8px 0 0;
	flex-shrink: 0;
}

/* Tillægs-billede: edge-to-edge i flip-bagsiden (modsvarer back-facens 16px padding) — analogt med forsidens .pjm-service-image. */
.pjm-flip-addon-image {
	width: calc(100% + 32px);
	margin: 0 -16px 14px;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	display: block;
	background: var(--pjm-card-bg);
	flex-shrink: 0;
}

/* Tillægs-panel (flip-bagside): fuld-bleed margin matcher back-facens padding; body + knapper styres via klasser så mobil kan justeres. */
.pjm-flip-addon-panel { flex-direction: column; flex: 1; margin: -16px -16px -12px; }
.pjm-addon-body { padding: 14px 16px 16px; }
.pjm-addon-btn { padding: 14px; }

.pjm-flip-back-btn {
	position: absolute;
	top: 6px;
	right: 8px;
	background: transparent;
	border: 0;
	font-size: 24px;
	line-height: 1;
	color: var(--pjm-heading);
	cursor: pointer;
	padding: 4px 8px;
	border-radius: 4px;
	opacity: 0.6;
	transition: opacity 0.15s, background 0.15s;
}
.pjm-flip-back-btn:hover,
.pjm-flip-back-btn:focus {
	opacity: 1;
	background: rgba(0, 0, 0, 0.05);
	outline: none;
}
.pjm-flip-back-head {
	margin-bottom: 10px;
	padding-right: 28px;
}
.pjm-flip-back-title {
	margin: 0 0 2px;
	font-size: 15px;
	color: var(--pjm-heading);
	font-weight: 600;
}
.pjm-flip-back-sub {
	margin: 0;
	font-size: 13px;
	color: var(--pjm-text);
	opacity: 0.7;
}
.pjm-flip-clinics {
	display: flex;
	flex-direction: column;
	gap: 5px;
	/* Fylder al resterende højde på bagsiden; knapperne deler pladen ligeligt. */
	flex: 1 1 auto;
	min-height: 0;
}
.pjm-flip-clinics-head { margin: -16px -16px 10px !important; }
.pjm-flip-clinic {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 12px;
	background: #fff;
	border: 1px solid var(--pjm-card-border);
	border-radius: 6px;
	cursor: pointer;
	text-align: left;
	font: inherit;
	color: var(--pjm-text);
	transition: border-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
	width: 100%;
	min-width: 0;
	max-width: 100%;
	box-sizing: border-box;
	/* Hver klinik-knap vokser og deler bagsidens højde ligeligt -> store tap-mål der fylder kortet. */
	flex: 1 1 0;
	min-height: 44px;
}
.pjm-flip-clinic:hover,
.pjm-flip-clinic:focus {
	border-color: var(--pjm-primary);
	transform: translateY(-1px);
	box-shadow: 0 3px 8px rgba(0,0,0,0.05);
	outline: none;
}
.pjm-flip-clinic__icon {
	flex-shrink: 0;
	width: 30px; height: 30px;
	display: flex; align-items: center; justify-content: center;
	background: color-mix(in srgb, var(--pjm-primary) 12%, transparent);
	color: var(--pjm-primary);
	border-radius: 50%;
}
.pjm-flip-clinic__text {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
}
.pjm-flip-clinic__name {
	font-size: 14px;
	font-weight: 600;
	color: var(--pjm-heading);
	line-height: 1.3;
	overflow-wrap: break-word;
	word-break: break-word;
}
.pjm-flip-clinic__meta {
	font-size: 12px;
	color: var(--pjm-text);
	opacity: 0.7;
	margin-top: 1px;
	overflow-wrap: break-word;
	word-break: break-word;
}
.pjm-flip-clinic__arrow {
	flex-shrink: 0;
	color: var(--pjm-primary);
	font-weight: 600;
}
.pjm-booking-clinic {
	color: var(--pjm-primary);
	font-weight: 500;
}

/* Mobil: kompaktere bagside for at passe i smal grid-kolonne. */
@media (max-width: 600px) {
	.pjm-flip-face--back { padding: 12px 10px 10px; }
	.pjm-flip-back-image { width: calc(100% + 20px); margin: -12px -10px 10px; }
	.pjm-flip-addon-image { width: calc(100% + 20px); margin: 0 -10px 12px; }
	.pjm-flip-addon-panel { margin: -12px -10px -10px; }
	.pjm-addon-body { padding: 14px 14px 70px; }
	.pjm-addon-btn { padding: 21px 14px; }
	.pjm-flip-back-btn { top: 2px; right: 4px; font-size: 22px; padding: 2px 6px; }
	.pjm-flip-back-head { margin-bottom: 8px; padding-right: 24px; }
	.pjm-flip-back-title { font-size: 14px; }
	.pjm-flip-back-sub { font-size: 11px; line-height: 1.25; }
	.pjm-flip-clinics { gap: 6px; }
	.pjm-flip-clinic { padding: 8px 10px; gap: 8px; }
	.pjm-flip-clinic__icon { width: 24px; height: 24px; }
	.pjm-flip-clinic__icon svg { width: 13px; height: 13px; }
	.pjm-flip-clinic__name { font-size: 13px; }
	.pjm-flip-clinic__meta { font-size: 11px; }
	.pjm-flip-clinic__arrow { font-size: 14px; }
}

/* Helt små skærme: skjul adresse-meta og pile for at give plads til navnet. */
@media (max-width: 420px) {
	.pjm-flip-clinic__meta { display: none; }
	.pjm-flip-clinic__arrow { display: none; }
	.pjm-flip-clinic { padding: 10px 12px; }
}

/* Reduced motion: spring flip-animation over. */
@media (prefers-reduced-motion: reduce) {
	.pjm-flip-card__inner { transition: none; }
}

/* ===== Native booking flow (v1.58 — mode="native") ===== */
.pjm-native-clinic-badge { display:inline-block; background:#F7A5C9; color:#fff; font-size:10px; font-weight:700; padding:2px 7px; border-radius:10px; margin-right:8px; vertical-align:middle; text-transform:uppercase; letter-spacing:.3px; }
.pjm-flip-clinic--all { background:#fef5fa !important; border-color:#F7A5C9 !important; }
.pjm-flip-clinic--all .pjm-flip-clinic__icon { color:#d36ca0 !important; }
.pjm-flip-clinic--all .pjm-flip-clinic__name { color:#a83d75 !important; }

/* Flip-klinik: "Vis"/"To" + navn på to linjer + tydelig adresse (v1.62.26) */
.pjm-flip-clinic__verb { display:block; font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.06em; color:#888; line-height:1.2; }
.pjm-flip-clinic__name { display:block; font-weight:700; }
.pjm-flip-clinic__meta { display:block; font-size:13px; font-weight:700; color:#444; margin-top:2px; }
.pjm-flip-clinic--all .pjm-flip-clinic__verb { color:#d36ca0; }

.pjm-flow-lang-bar { display:flex; justify-content:flex-end; gap:6px; margin:0 0 10px; }
.pjm-flow-lang-btn { background:#fff; border:1px solid #d4cfc1; color:#1f4e79; padding:6px 14px; border-radius:999px; font-size:13px; font-weight:600; cursor:pointer; font-family:inherit; transition:all .15s; }
.pjm-flow-lang-btn.is-active { background:#1f4e79; color:#fff; border-color:#1f4e79; }
.pjm-flow-lang-btn:hover:not(.is-active) { background:#eef4fb; }

.pjm-native-lang-bar { display:flex; justify-content:flex-end; gap:6px; margin-bottom:6px; }
.pjm-native-lang-btn { background:#fff; border:1px solid #d4cfc1; color:#1f4e79; padding:5px 12px; border-radius:999px; font-size:12px; font-weight:600; cursor:pointer; font-family:inherit; }
.pjm-native-lang-btn.is-active { background:#1f4e79; color:#fff; border-color:#1f4e79; }
.pjm-native-lang-btn:hover { background:#eef4fb; }
.pjm-native-lang-btn.is-active:hover { background:#1f4e79; }

.pjm-native-wrap { font-family: inherit; color: #222; touch-action: pan-y; max-width:100%; overflow-x:hidden; }
.pjm-native-wrap * { max-width:100%; }
.pjm-native-auth-box h3, .pjm-native-auth-box p { overflow-wrap:anywhere; }
.pjm-native-week-head { display:flex; justify-content:space-between; align-items:center; gap:8px; padding:12px 16px; background:#f7f5ef; border:1px solid #e5e1d6; border-radius:8px 8px 0 0; font-weight:600; color:#1f4e79; position:sticky; top:0; z-index:5; }
.pjm-native-week-nav { background:#fff; border:1px solid #d4cfc1; color:#1f4e79; cursor:pointer; font-size:13px; padding:8px 14px; font-family:inherit; border-radius:6px; min-width:44px; min-height:40px; font-weight:700; line-height:1; }
.pjm-native-week-nav:hover { background:#1f4e79; color:#fff; border-color:#1f4e79; }
.pjm-native-week-mobile-nav { display:none; }
@media (max-width:680px) {
	.pjm-native-wrap { font-size:12px; }
	.pjm-native-week-head { padding:8px 6px; font-size:12px; gap:4px; }
	.pjm-native-week-nav-text { display:none; }
	.pjm-native-week-nav { font-size:20px; padding:4px 10px; min-width:36px; }
	.pjm-native-week-mobile-nav { display:flex; gap:8px; padding:8px 0; }
	.pjm-native-week-mobile-nav button { flex:1; background:#fff; border:1px solid #d4cfc1; color:#1f4e79; border-radius:6px; padding:10px; font-weight:600; font-family:inherit; font-size:13px; min-height:44px; cursor:pointer; }
	.pjm-native-week-mobile-nav button:active { background:#1f4e79; color:#fff; }
	.pjm-native-pract-head { padding:8px 8px; font-size:12px; gap:6px; }
	.pjm-native-pract-head img, .pjm-native-avatar { width:30px; height:30px; }
	.pjm-native-week-grid { gap:0; }
	.pjm-native-day { padding:4px 1px; min-height:50px; border-right:0; box-sizing:border-box; min-width:0; overflow:hidden; }
	.pjm-native-day-head { font-size:9px; margin-bottom:3px; }
	.pjm-native-day-head .num { font-size:11px; }
	.pjm-native-slot { font-size:10px; padding:4px 1px; margin:2px 0; border-radius:3px; }
	.pjm-native-empty-day { font-size:10px; padding:10px 0; }
}
@media (max-width:380px) {
	.pjm-native-day { padding:3px 0; }
	.pjm-native-day-head { font-size:8px; }
	.pjm-native-day-head .num { font-size:10px; }
	.pjm-native-slot { font-size:9px; padding:3px 0; }
}
.pjm-native-pract { border:1px solid #e5e1d6; border-top:0; }
.pjm-native-pract-head { display:flex; align-items:center; gap:10px; padding:10px 14px; background:#f7f5ef; border-bottom:1px solid #e5e1d6; font-weight:600; color:#1f4e79; font-size:14px; }
.pjm-native-pract-head img, .pjm-native-avatar { width:42px; height:42px; border-radius:50%; object-fit:cover; }
.pjm-native-avatar { display:flex; align-items:center; justify-content:center; color:#fff; font-weight:700; font-size:14px; }
.pjm-native-week-grid { display:grid; grid-template-columns:repeat(7, 1fr); }
.pjm-native-day { padding:10px 6px; border-right:1px solid #f0ebe1; min-height:80px; background:#fff; }
.pjm-native-day:last-child { border-right:0; }
.pjm-native-day-head { text-align:center; font-size:11px; color:#888; font-weight:600; margin-bottom:6px; line-height:1.2; }
.pjm-native-day-head .num { display:block; color:#222; font-size:14px; font-weight:700; }
.pjm-native-day-head.today .num { color:#1f4e79; }
.pjm-native-slot { display:block; width:100%; background:#7ea287; color:#fff; border:0; padding:6px 4px; border-radius:4px; font-size:12px; cursor:pointer; margin:3px 0; font-weight:600; font-family:inherit; }
.pjm-native-slot:hover { background:#5f8369; }
.pjm-native-empty-day { color:#ccc; text-align:center; font-size:11px; padding:18px 0; }
.pjm-native-no-slots { padding:30px; text-align:center; color:#888; background:#fff; border:1px solid #e5e1d6; border-top:0; border-radius:0 0 8px 8px; }

.pjm-native-summary { background:#f7f8fa; border-left:4px solid #1f4e79; padding:14px 16px; border-radius:8px; margin-bottom:18px; font-size:14px; line-height:1.7; }
.pjm-native-summary b { color:#666; font-weight:500; min-width:90px; display:inline-block; }
.pjm-native-summary .muted { color:#888; }
.pjm-native-timer-bar { padding:10px 14px; background:#e6f0fa; border-left:3px solid #1f4e79; color:#1a3a5a; border-radius:6px; font-size:13px; margin-bottom:14px; }
.pjm-native-auth { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:14px; }
@media (max-width:680px) { .pjm-native-auth { grid-template-columns:1fr; } }
.pjm-native-auth-box { background:#fff; border:1px solid #e5e1d6; border-radius:8px; padding:18px; }
.pjm-native-auth-box h3 { margin:0 0 10px; font-size:16px; color:#1f4e79; }
.pjm-native-field { margin:8px 0; }
.pjm-native-field label { display:block; font-size:12px; font-weight:600; margin-bottom:3px; color:#444; }
.pjm-native-field input { width:100%; padding:9px 11px; border:1px solid #ccc; border-radius:5px; font-size:13px; box-sizing:border-box; font-family:inherit; }
.pjm-native-field input[type=checkbox], .pjm-native-field input[type=radio] { width:auto; flex:0 0 auto; padding:0; margin:0; }
.pjm-native-btn { background:#fff; color:#1f4e79; border:1px solid #1f4e79; padding:10px 18px; border-radius:6px; font-size:14px; font-weight:600; cursor:pointer; font-family:inherit; }
.pjm-native-btn:hover { opacity:.9; }
.pjm-native-btn:disabled { opacity:.5; cursor:not-allowed; }
.pjm-native-btn-primary { background:#3e7bb5; color:#fff; border-color:#3e7bb5; }
.pjm-native-btn-primary:hover { background:#326390; border-color:#326390; opacity:1; }
.pjm-native-error { background:#fee; border-left:3px solid #b32d2e; color:#7c1d1d; padding:8px 12px; border-radius:5px; font-size:13px; margin:6px 0; }
.pjm-native-success { padding:20px; background:#e9f7e9; border:1px solid #c5e4c5; border-radius:8px; }
.pjm-native-success h3 { margin:0 0 10px; color:#0f7a3e; }
