/* Medlemsformuläret på /bli-medlem/.
   Editorial-huvudet (eyebrow → kursiv titel → accentlinje → lede) är samma
   mönster som övriga subsidor, därför döljer temat WP-titeln här. */

.gbm-wrap {
	max-width: var(--gb-container, 1100px);
	margin: 0 auto;
	font-family: var(--gb-font-body, 'Source Serif 4', Georgia, serif);
	color: var(--gb-ink-soft, #3A332B);
}

.gbm-eyebrow {
	font-size: 12px;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--gb-muted, #6B6258);
	font-weight: 500;
	margin: 0 0 10px;
}

.gbm-titel {
	font-family: var(--gb-font-display, 'EB Garamond', Georgia, serif);
	font-style: italic;
	font-weight: 400;
	font-size: clamp(32px, 5vw, 44px);
	line-height: 1.1;
	color: var(--gb-ink, #1F1B16);
	margin: 0 0 18px;
}
.gbm-titel em { font-style: italic; color: var(--sec, #9C4A2A); }

.gbm-linje {
	width: 64px;
	height: 2px;
	background: var(--gb-accent, #9C4A2A);
	margin: 0 0 26px;
}

.gbm-lede {
	max-width: 62ch;
	font-size: 18px;
	line-height: 1.6;
	margin: 0 0 32px;
}

.gbm-fel {
	max-width: 62ch;
	margin: 0 0 24px;
	padding: 14px 18px;
	border-left: 3px solid var(--gb-accent, #9C4A2A);
	background: var(--gb-accent-soft, rgba(156, 74, 42, 0.08));
	font-size: 15.5px;
}

/* ── Formuläret ─────────────────────────────────────────────────────────── */

.gbm-formular { max-width: 620px; }

.gbm-falt { margin: 0 0 18px; }

.gbm-falt label {
	display: block;
	font-size: 14px;
	font-style: italic;
	color: var(--gb-ink, #1F1B16);
	margin: 0 0 6px;
}

.gbm-krav { color: var(--gb-accent, #9C4A2A); font-style: normal; }

.gbm-falt input,
.gbm-falt textarea {
	width: 100%;
	box-sizing: border-box;
	padding: 11px 13px;
	font-family: inherit;
	font-size: 16px;           /* under 16px zoomar iOS in vid fokus */
	color: var(--gb-ink, #1F1B16);
	background: var(--gb-bg, #FFFFFF);
	border: 1px solid var(--gb-border, #E8E2D6);
	border-radius: 3px;
	transition: border-color 140ms ease, box-shadow 140ms ease;
}
.gbm-falt input:focus,
.gbm-falt textarea:focus {
	outline: none;
	border-color: var(--gb-accent, #9C4A2A);
	box-shadow: 0 0 0 3px var(--gb-accent-soft, rgba(156, 74, 42, 0.08));
}
.gbm-falt .gbm-invalid { border-color: var(--gb-accent, #9C4A2A); }
.gbm-falt textarea { resize: vertical; }

.gbm-rad { display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; }
.gbm-rad--smal { grid-template-columns: 160px 1fr; }

.gbm-samtycke {
	margin: 6px 0 26px;
	padding: 14px 16px;
	background: var(--gb-bg-warm, #FAF7F1);
	border-radius: 3px;
	font-size: 14.5px;
	line-height: 1.5;
}
.gbm-samtycke.gbm-invalid { box-shadow: inset 3px 0 0 var(--gb-accent, #9C4A2A); }
.gbm-samtycke label { display: flex; gap: 10px; align-items: flex-start; }
.gbm-samtycke input { margin-top: 3px; flex: 0 0 auto; }

.gbm-knapp {
	padding: 13px 30px;
	font-family: inherit;
	font-size: 16px;
	color: #FFFFFF;
	background: var(--gb-accent, #9C4A2A);
	border: 0;
	border-radius: 3px;
	cursor: pointer;
	transition: background 160ms ease;
}
.gbm-knapp:hover,
.gbm-knapp:focus-visible { background: var(--gb-ink, #1F1B16); }

.gbm-not {
	margin: 12px 0 0;
	font-size: 13.5px;
	color: var(--gb-muted, #6B6258);
}

/* Honungsfällan ska vara osynlig men inte display:none — vissa robotar hoppar
   över det som är helt borttaget ur layouten. */
.gbm-honung {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* ── Kvittensen ─────────────────────────────────────────────────────────── */

.gbm-kvittens { max-width: 620px; }

.gbm-betalruta {
	margin: 0 0 26px;
	padding: 28px 30px;
	background: var(--gb-bg, #FFFFFF);
	border: 1px solid var(--gb-border, #E8E2D6);
	border-radius: 4px;
}

.gbm-betalrubrik {
	font-family: var(--gb-font-display, 'EB Garamond', Georgia, serif);
	font-style: italic;
	font-weight: 400;
	font-size: 24px;
	color: var(--gb-ink, #1F1B16);
	margin: 0 0 14px;
}

.gbm-belopp {
	font-family: var(--gb-font-display, 'EB Garamond', Georgia, serif);
	font-size: 34px;
	color: var(--gb-accent, #9C4A2A);
	margin: 0 0 16px;
	line-height: 1;
}
.gbm-belopp span {
	font-family: var(--gb-font-body, Georgia, serif);
	font-size: 14px;
	font-style: italic;
	color: var(--gb-muted, #6B6258);
}

.gbm-betalinfo {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 8px 22px;
	margin: 0 0 16px;
	font-variant-numeric: tabular-nums;
}
.gbm-betalinfo dt { font-style: italic; color: var(--gb-muted, #6B6258); font-size: 14px; }
.gbm-betalinfo dd { margin: 0; font-size: 17px; color: var(--gb-ink, #1F1B16); }

.gbm-betalnot,
.gbm-efterord { font-size: 14.5px; color: var(--gb-muted, #6B6258); margin: 0; }
.gbm-betalnot { padding-top: 14px; border-top: 1px solid var(--gb-border, #E8E2D6); }
.gbm-efterord { margin-top: 8px; }

@media (max-width: 500px) {
	.gbm-rad, .gbm-rad--smal { grid-template-columns: 1fr; }
	.gbm-betalruta { padding: 22px 20px; }
}