/* =========================================================================
   RAGenbrug — front-end styles for the calculator & sell form.
   Reuses the theme's design tokens (--rag-*) with safe fallbacks so the
   shortcodes also look acceptable on other themes.
   ========================================================================= */

.rag-calc,
.rag-sellform,
.rag-receipt,
.rag-createform,
.rag-extras {
	--_surface: var(--rag-surface, #fff);
	--_border: var(--rag-border, rgba(19, 32, 26, 0.12));
	--_text: var(--rag-text, #13201a);
	--_muted: var(--rag-muted, #5e6b62);
	--_gold: var(--rag-gold-600, #b98a2e);
	--_gold-deep: var(--rag-gold-700, #9c6f22);
	--_green: var(--rag-forest-700, #155234);
	--_radius: var(--rag-radius, 16px);
	--_radius-sm: var(--rag-radius-sm, 9px);
}

/* The plugin's own lists must never inherit a theme's prose bullets/indent
   (the RA Genbrug theme draws a gold dot on every .rag-prose ul li). */
/* Specificity is deliberately high: the theme styles `.rag-prose ul li`, which
   would otherwise win over a plain `.rag-extras li` selector. */
.rag-extras ul,
.rag-extras ul li,
.rag-sellform ul,
.rag-sellform ul li,
.rag-prices ul,
.rag-prices ul li {
	list-style: none;
	margin: 0;
	padding-left: 0;
}
.rag-extras li::before,
.rag-extras li::marker,
.rag-sellform li::before,
.rag-sellform li::marker,
.rag-prices li::before,
.rag-prices li::marker {
	content: none !important;
	display: none !important;
}

/* Honeypot — visually & semantically hidden, still in the DOM for bots. */
.rag-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* ---------------------------- Calculator ---------------------------- */
.rag-calc {
	background: var(--_surface);
	border: 1px solid var(--_border);
	border-radius: var(--_radius);
	padding: clamp(1.3rem, 3vw, 1.9rem);
	box-shadow: var(--rag-shadow, 0 14px 34px -16px rgba(11, 36, 25, 0.22));
}
.rag-calc__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 1.2rem;
}
.rag-calc__title {
	font-family: var(--rag-font-display, Georgia, serif);
	font-size: 1.35rem;
	color: var(--_green);
}
.rag-calc__rows {
	display: flex;
	flex-direction: column;
	gap: 0.9rem;
}
.rag-calc__row {
	display: grid;
	grid-template-columns: 1.5fr 0.9fr auto auto;
	gap: 0.8rem;
	align-items: end;
	padding-bottom: 0.9rem;
	border-bottom: 1px dashed var(--_border);
}
.rag-calc__row:last-child {
	border-bottom: 0;
	padding-bottom: 0;
}
.rag-calc__rowest {
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
	padding-bottom: 0.55rem;
}
.rag-calc__rowest-label {
	font-size: 0.7rem;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--_muted);
}
.rag-calc__rowest-value {
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	color: var(--_green);
	white-space: nowrap;
}
.rag-calc__remove {
	align-self: center;
	width: 2rem;
	height: 2rem;
	border-radius: 50%;
	border: 1px solid var(--_border);
	background: var(--_surface);
	color: var(--_muted);
	font-size: 1.25rem;
	line-height: 1;
	cursor: pointer;
	transition: color 0.15s, border-color 0.15s;
}
.rag-calc__remove:hover {
	color: #c0573f;
	border-color: #c0573f;
}
.rag-calc__add {
	margin-top: 1rem;
	width: 100%;
	background: none;
	border: 1.5px dashed color-mix(in srgb, var(--_gold) 55%, transparent);
	color: var(--_gold-deep);
	font: inherit;
	font-weight: 600;
	padding: 0.65rem 1rem;
	border-radius: var(--_radius-sm);
	cursor: pointer;
	transition: background 0.15s, border-color 0.15s;
}
.rag-calc__add:hover {
	background: color-mix(in srgb, var(--_gold) 8%, transparent);
	border-color: var(--_gold);
}
.rag-calc__result {
	margin-top: 1.3rem;
	padding: 1.2rem 1.3rem;
	border-radius: var(--_radius-sm);
	background: linear-gradient(135deg, color-mix(in srgb, var(--_green) 96%, #000), var(--rag-forest-900, #0b2419));
	color: #fff;
	display: grid;
	gap: 0.15rem;
}
.rag-calc__result-label {
	font-size: 0.78rem;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	color: var(--rag-gold-400, #dabd77);
}
.rag-calc__result-value {
	font-family: var(--rag-font-display, Georgia, serif);
	font-size: clamp(2rem, 1.4rem + 2.4vw, 2.9rem);
	font-weight: 500;
	line-height: 1.05;
	font-variant-numeric: tabular-nums;
}
.rag-calc__result-rate {
	font-size: 0.85rem;
	color: rgba(255, 255, 255, 0.7);
	font-variant-numeric: tabular-nums;
}
.rag-calc__note {
	margin: 0.9rem 0 1.2rem;
	font-size: 0.82rem;
	color: var(--_muted);
}

/* ------------------------------ Fields ------------------------------ */
.rag-field {
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
}
.rag-field > span {
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--_text);
}
.rag-field input,
.rag-field select,
.rag-field textarea {
	width: 100%;
	padding: 0.75rem 0.9rem;
	border: 1.5px solid var(--rag-border-strong, rgba(19, 32, 26, 0.22));
	border-radius: var(--_radius-sm);
	background: var(--_surface);
	color: var(--_text);
	font: inherit;
	transition: border-color 0.2s, box-shadow 0.2s;
}
.rag-field textarea {
	resize: vertical;
	min-height: 7rem;
}
.rag-field input:focus,
.rag-field select:focus,
.rag-field textarea:focus {
	outline: none;
	border-color: var(--_gold);
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--_gold) 16%, transparent);
}
.rag-req {
	color: var(--_gold-deep);
}

/* ------------------------------ Form ------------------------------ */
.rag-sellform {
	background: var(--_surface);
	border: 1px solid var(--_border);
	border-radius: var(--_radius);
	padding: clamp(1.4rem, 3vw, 2.2rem);
	box-shadow: var(--rag-shadow, 0 14px 34px -16px rgba(11, 36, 25, 0.22));
}
.rag-sellform__title {
	font-size: 1.5rem;
	margin-bottom: 1.3rem;
	color: var(--_green);
}
.rag-form__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.1rem;
}
.rag-field--full {
	grid-column: 1 / -1;
}
/* Required choice: pickup or drop-off. */
.rag-choice {
	margin: 1.3rem 0 0.4rem;
	padding: 0;
	border: 0;
}
.rag-choice__legend {
	padding: 0;
	margin-bottom: 0.6rem;
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--_text);
}
.rag-choice__opt {
	display: flex;
	align-items: center;
	gap: 0.65rem;
	padding: 0.85rem 1rem;
	margin-bottom: 0.5rem;
	border: 1.5px solid var(--rag-border-strong, rgba(19, 32, 26, 0.22));
	border-radius: var(--_radius-sm);
	background: var(--_surface);
	cursor: pointer;
	transition: border-color 0.15s, background 0.15s;
}
.rag-choice__opt:hover {
	border-color: var(--_gold);
}
.rag-choice__opt input {
	width: 18px;
	height: 18px;
	accent-color: var(--_green);
	flex-shrink: 0;
	margin: 0;
}
.rag-choice__opt:has(input:checked) {
	border-color: var(--_green);
	background: color-mix(in srgb, var(--_green) 5%, var(--_surface));
}
.rag-choice__opt input:focus-visible {
	outline: 2px solid var(--_gold);
	outline-offset: 2px;
}

/* Quiet "visit us" note under the handover choice. */
.rag-visit {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.15rem 0.5rem;
	margin: 0.7rem 0 0;
	font-size: 0.82rem;
	line-height: 1.5;
	color: var(--_muted);
}
.rag-visit__label {
	font-weight: 600;
	color: var(--_text);
}
.rag-visit__note {
	opacity: 0.85;
}

/* Standard price disclaimer — present, but never loud. */
.rag-disclaimer {
	margin: 0.7rem 0 0;
	font-size: 0.7rem;
	line-height: 1.45;
	font-weight: 400;
	color: var(--_muted);
	opacity: 0.75;
}
.rag-disclaimer--prices {
	margin-top: 0.5rem;
}
.rag-disclaimer--form {
	margin: -0.4rem 0 1.2rem;
}
/* On the dark hero panel the muted token is too dark to read. */
.rag-prices--hero .rag-disclaimer {
	color: var(--rag-on-dark-muted, rgba(255, 255, 255, 0.62));
}

.rag-consent {
	display: flex;
	align-items: flex-start;
	gap: 0.6rem;
	margin: 1.3rem 0;
	font-size: 0.9rem;
	color: var(--_muted);
}
.rag-consent input {
	margin-top: 0.2rem;
	width: 18px;
	height: 18px;
	accent-color: var(--_green);
	flex-shrink: 0;
}

/* ----------------------------- Notices ----------------------------- */
.rag-formnotice {
	padding: 1rem 1.2rem;
	border-radius: var(--_radius-sm);
	margin-bottom: 1.4rem;
	border: 1px solid var(--_border);
	border-left: 4px solid var(--_green);
	background: color-mix(in srgb, var(--rag-leaf-500, #2f9e62) 8%, var(--_surface));
}
.rag-formnotice--ok {
	border-left-color: var(--rag-leaf-500, #2f9e62);
}
.rag-formnotice--err {
	border-left-color: #c0573f;
	background: color-mix(in srgb, #c0573f 7%, var(--_surface));
}
.rag-formnotice strong {
	display: block;
	margin-bottom: 0.2rem;
	color: var(--_green);
}

/* --------------------- "We also buy" extras strip -------------------- */
.rag-extras {
	margin-top: 1.6rem;
	padding: clamp(1.2rem, 2.5vw, 1.6rem);
	border: 1px solid var(--_border);
	border-radius: var(--_radius);
	background: var(--_surface);
	box-shadow: var(--rag-shadow-sm, 0 6px 18px -12px rgba(11, 36, 25, 0.25));
}
.rag-extras__title {
	font-size: 0.74rem;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	font-weight: 700;
	color: var(--_gold-deep);
	margin: 0 0 1rem;
}
.rag-extras__list {
	display: grid;
	gap: 0.2rem;
}
/* Label + price on one line, note underneath — stays aligned at any width.
   (Selector includes the list so it outranks the theme's `.rag-prose ul li`.) */
.rag-extras ul li.rag-extras__item {
	display: grid;
	grid-template-columns: 1fr auto;
	align-items: baseline;
	column-gap: 1rem;
	row-gap: 0.2rem;
	padding: 0.8rem 0;
	border-top: 1px solid var(--_border);
}
.rag-extras__item:first-child,
.rag-extras__item--featured + .rag-extras__item {
	border-top: 0;
}
.rag-extras__label {
	font-weight: 600;
	font-size: 1.02rem;
	color: var(--_text);
	min-width: 0;
}
.rag-extras__price {
	grid-column: 2;
	grid-row: 1;
	font-weight: 700;
	color: var(--_gold-deep);
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}
.rag-extras__note {
	grid-column: 1 / -1;
	margin: 0;
	font-size: 0.86rem;
	line-height: 1.45;
	color: var(--_muted);
}
/* Pletsølv — highlighted so it stands out clearly. */
.rag-extras ul li.rag-extras__item--featured {
	border-top: 0;
	margin-bottom: 0.5rem;
	padding: 1.15rem 1.25rem;
	border-radius: var(--_radius-sm);
	background: linear-gradient(135deg, color-mix(in srgb, var(--_green) 96%, #000), var(--rag-forest-900, #0b2419));
	color: #fff;
}
.rag-extras__item--featured .rag-extras__label {
	color: #fff;
	font-size: 1.18rem;
	font-weight: 700;
}
.rag-extras__item--featured .rag-extras__price {
	color: var(--rag-gold-400, #dabd77);
	font-size: 1.18rem;
}
.rag-extras__item--featured .rag-extras__note {
	color: rgba(255, 255, 255, 0.8);
	margin-top: 0.15rem;
}

@media (max-width: 520px) {
	.rag-extras__item {
		grid-template-columns: 1fr;
	}
	.rag-extras__price {
		grid-column: 1;
		grid-row: auto;
	}
}

/* ------------------ Sell form: calculator line items ----------------- */
.rag-sellform__items {
	margin: 0.2rem 0 0.4rem;
	padding: 1rem 1.1rem;
	border: 1px solid var(--_border);
	border-radius: var(--_radius-sm);
	background: color-mix(in srgb, var(--_green) 4%, var(--_surface));
}
.rag-sellform__items-title {
	font-size: 0.76rem;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	font-weight: 700;
	color: var(--_green);
	margin-bottom: 0.7rem;
}
.rag-sellform__items-list {
	display: grid;
	gap: 0.15rem;
}
.rag-sellform__item {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.25rem 0.7rem;
	padding: 0.5rem 0;
	border-top: 1px solid var(--_border);
}
.rag-sellform__item:first-child {
	border-top: 0;
}
.rag-sellform__item-label {
	flex: 1 1 55%;
	font-weight: 600;
	color: var(--_text);
}
.rag-sellform__item-amount {
	color: var(--_muted);
	font-variant-numeric: tabular-nums;
}
.rag-sellform__item-est {
	margin-left: auto;
	font-weight: 700;
	color: var(--_green);
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}
.rag-sellform__item-remove {
	flex-shrink: 0;
	border: 0;
	background: transparent;
	color: var(--_muted);
	font-size: 1.25rem;
	line-height: 1;
	cursor: pointer;
	padding: 0 0.15rem;
	border-radius: 6px;
	transition: color 0.15s, background 0.15s;
}
.rag-sellform__item-remove:hover {
	color: #c0573f;
	background: color-mix(in srgb, #c0573f 12%, transparent);
}
.rag-sellform__items-total {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 1rem;
	margin-top: 0.7rem;
	padding-top: 0.6rem;
	border-top: 2px solid var(--_border);
	font-weight: 700;
	color: var(--_green);
}
.rag-sellform__items-total [data-rag-items-total] {
	font-variant-numeric: tabular-nums;
}
.rag-sellform__items-note {
	margin-top: 0.5rem;
	font-size: 0.78rem;
	color: var(--_muted);
}

@media (max-width: 600px) {
	.rag-calc__row,
	.rag-form__grid {
		grid-template-columns: 1fr;
	}
	.rag-calc__row {
		gap: 0.5rem;
		align-items: stretch;
	}
	.rag-calc__remove {
		justify-self: end;
	}
}

/* -------------------------------------------------------------------------
   Billedvedhaeftning
   ---------------------------------------------------------------------- */

.rag-photos {
	margin: 1.4rem 0 0;
}

.rag-photos__title {
	margin: 0 0 0.2rem;
	font-weight: 600;
	color: var(--_text);
}

.rag-photos__optional {
	font-weight: 400;
	color: var(--_muted);
}

.rag-photos__help {
	margin: 0 0 0.8rem;
	font-size: 0.88rem;
	line-height: 1.5;
	color: var(--_muted);
}

/* Slipzonen. Den er ogsaa en knap: paa mobil findes traek-og-slip ikke, og
   uden noget at trykke paa ville feltet vaere dekoration. */
.rag-photos__drop {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 0.4rem 0.8rem;
	padding: 1.4rem 1.1rem;
	border: 2px dashed var(--_border);
	border-radius: var(--_radius);
	background: color-mix(in srgb, var(--_surface) 60%, transparent);
	text-align: center;
	transition: border-color 0.2s, background 0.2s;
}

.rag-photos__drop.is-over {
	border-color: var(--_green);
	background: color-mix(in srgb, var(--_green) 7%, transparent);
}

/* Feltet skjules for oejet, men ikke for tastaturet: labelen er knappen. */
.rag-photos__input {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

.rag-photos__input:focus-visible + .rag-photos__choose {
	outline: 2px solid var(--_green);
	outline-offset: 3px;
}

.rag-photos__choose {
	cursor: pointer;
}

.rag-photos__hint {
	font-size: 0.88rem;
	color: var(--_muted);
}

.rag-photos__list {
	list-style: none;
	margin: 0.9rem 0 0;
	padding: 0;
	display: grid;
	gap: 0.6rem;
}

.rag-photos__list li::before {
	content: none;
}

/* Fast gitter frem for en raekke der ombryder: navnet og krydset oeverst,
   menuen paa sin egen linje under. Det holder paa en telefon uden at
   "Hører til" braekker midt over, og giver menuen plads nok til at ligne
   noget man skal tage stilling til. */
.rag-photos__item {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	grid-template-areas:
		"billede navn fjern"
		"billede valg valg";
	align-items: center;
	gap: 0.35rem 0.75rem;
	padding: 0.65rem;
	border: 1px solid var(--_border);
	border-radius: var(--_radius-sm);
	background: var(--_surface);
}

.rag-photos__item.is-uploading {
	opacity: 0.75;
}

.rag-photos__item.is-failed {
	border-color: #c0573f;
}

.rag-photos__thumb {
	grid-area: billede;
	width: 56px;
	height: 56px;
	object-fit: cover;
	border-radius: var(--_radius-sm);
	background: color-mix(in srgb, var(--_text) 6%, transparent);
}

.rag-photos__meta {
	grid-area: navn;
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.1rem 0.6rem;
	min-width: 0;
}

.rag-photos__name {
	flex: 1 1 100%;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 0.9rem;
	font-weight: 600;
}

.rag-photos__status {
	font-size: 0.8rem;
	color: var(--_muted);
	font-variant-numeric: tabular-nums;
}

.rag-photos__item.is-failed .rag-photos__status {
	color: #c0573f;
}

/* Tilknytningen vises kun naar der er linjer at knytte til - uden linjer er
   hele partiet det eneste mulige svar, og saa er der intet at spoerge om. */
.rag-photos__assign {
	grid-area: valg;
	display: none;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.3rem 0.6rem;
}

.rag-photos.has-lines .rag-photos__assign {
	display: flex;
}

.rag-photos__assign-label {
	flex: 0 0 auto;
	white-space: nowrap;
	font-size: 0.8rem;
	font-weight: 600;
	color: var(--_muted);
}

.rag-photos__assign select {
	flex: 1 1 11rem;
	min-width: 0;
	max-width: 22rem;
	min-height: 40px;
	padding: 0.45rem 0.7rem;
	font-size: 0.9rem;
	border: 1.5px solid var(--_border);
	border-radius: var(--_radius-sm);
	background: var(--_surface);
	color: var(--_text);
	cursor: pointer;
}

.rag-photos__assign select:focus-visible {
	outline: 2px solid var(--_green);
	outline-offset: 2px;
}

/* ---- Et billede uden svar ----
   Gult frem for roedt: der er ikke gaaet noget galt endnu, der mangler
   bare et valg. Markeringen sidder baade paa kortet og paa selve menuen,
   saa den ogsaa kan ses efter et hurtigt blik ned over listen. */
.rag-photos__item.needs-choice {
	border-color: #c98a1f;
	background: color-mix(in srgb, #c98a1f 7%, var(--_surface));
}

.rag-photos__item.needs-choice .rag-photos__assign select {
	border-color: #c98a1f;
	box-shadow: 0 0 0 3px color-mix(in srgb, #c98a1f 20%, transparent);
}

.rag-photos__item.needs-choice .rag-photos__assign-label {
	color: #8a5d10;
}

.rag-photos__item.needs-choice .rag-photos__assign-label::after {
	content: " *";
	color: #c98a1f;
}

/* Staar kun naar der faktisk er noget at vaelge imellem. */
.rag-photos__require {
	display: none;
	margin: 0.7rem 0 0;
	font-size: 0.86rem;
	color: var(--_muted);
}

.rag-photos.has-lines .rag-photos__require {
	display: block;
}

.rag-photos__remove {
	flex: 0 0 auto;
	display: inline-grid;
	place-items: center;
	width: 28px;
	height: 28px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--_muted);
	font-size: 1.15rem;
	line-height: 1;
	cursor: pointer;
	transition: background 0.2s, color 0.2s;
}

.rag-photos__remove:hover {
	background: #c0573f;
	color: #fff;
}

.rag-photos__error {
	margin: 0.7rem 0 0;
	font-size: 0.86rem;
	color: #c0573f;
}

/* Send-knappen venter paa at billederne er fremme. */
.rag-form button[type="submit"].is-waiting {
	opacity: 0.55;
	cursor: progress;
}

/* -------------------------------------------------------------------------
   Kvittering efter indsendelse
   Erstatter formularen frem for at staa over den: bliver formularen
   staaende, sender den tvivlende sin henvendelse en gang til.
   ---------------------------------------------------------------------- */

.rag-receipt {
	padding: clamp(1.6rem, 5vw, 2.6rem) clamp(1.1rem, 4vw, 2rem);
	border: 1px solid var(--_border);
	border-radius: var(--_radius);
	background: var(--_surface);
	box-shadow: var(--rag-shadow, 0 14px 34px -16px rgba(11, 36, 25, 0.22));
	text-align: center;
}

.rag-receipt:focus {
	outline: none;
}

.rag-receipt__mark {
	display: inline-grid;
	place-items: center;
	width: 58px;
	height: 58px;
	margin: 0 0 0.9rem;
	border-radius: 50%;
	background: color-mix(in srgb, var(--_green) 12%, transparent);
	color: var(--_green);
}

/* Temaet saetter stoerrelser paa .rag-prose h3 og .rag-prose p (0-2-0 og
   0-1-1). Et enkelt klassenavn taber til dem, og overskriften endte med at
   staa i broedtekststoerrelse. Elementnavnet i selektoren afgoer det uanset
   hvilken raekkefoelge de to stylesheets indlaeses i. */
.rag-receipt h3.rag-receipt__title {
	margin: 0 0 0.6rem;
	font-family: var(--rag-font-display, Georgia, serif);
	font-size: clamp(1.35rem, 1rem + 1.6vw, 1.8rem);
	line-height: 1.2;
	color: var(--rag-forest-900, #0b2419);
}

.rag-receipt p.rag-receipt__lead {
	max-width: 46ch;
	margin: 0 auto 1.1rem;
	line-height: 1.6;
	color: var(--_text);
}

.rag-receipt p.rag-receipt__note {
	margin: 0 0 0.35rem;
	font-size: 0.9rem;
	color: var(--_muted);
}

.rag-receipt p.rag-receipt__contact {
	margin: 0;
	font-weight: 600;
}

.rag-receipt__contact a {
	color: var(--_green);
}

/* -------------------------------------------------------------------------
   Vareoprettelse
   Bruges paa en telefon, staaende op, med en ting i den anden haand. Store
   trykflader, faa felter, og ingenting der kan gaa galt.
   ---------------------------------------------------------------------- */

.rag-createform {
	--_touch: 48px;
}

.rag-createform__lead {
	margin: 0 0 1.4rem;
	color: var(--_muted);
	line-height: 1.55;
}

.rag-createform .rag-field input,
.rag-createform .rag-field select,
.rag-createform .rag-field textarea {
	min-height: var(--_touch);
	font-size: 1rem; /* Under 16px zoomer iOS ind ved fokus. */
}

.rag-createform .rag-field textarea {
	min-height: 6rem;
}

.rag-createform .rag-field > span {
	font-size: 0.95rem;
}

/* ---- Kategorier som trykflader ---- */

.rag-cats {
	margin: 1.4rem 0 0;
}

.rag-cats__hint {
	margin: 0 0 0.9rem;
	font-size: 0.88rem;
	color: var(--_muted);
}

.rag-cats__group + .rag-cats__group {
	margin-top: 1rem;
}

.rag-cats__head {
	margin: 0 0 0.45rem;
	font-size: 0.78rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--_green);
}

.rag-cats__row {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}

.rag-cats__pill {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	min-height: 42px;
	padding: 0.4rem 0.9rem;
	border: 1.5px solid var(--rag-border-strong, rgba(19, 32, 26, 0.22));
	border-radius: var(--rag-radius-pill, 999px);
	background: var(--_surface);
	cursor: pointer;
	font-size: 0.92rem;
	transition: border-color 0.15s, background 0.15s;
}

.rag-cats__pill input {
	width: 18px;
	height: 18px;
	margin: 0;
	accent-color: var(--_green);
}

.rag-cats__pill:has(input:checked) {
	border-color: var(--_green);
	background: color-mix(in srgb, var(--_green) 8%, var(--_surface));
	font-weight: 600;
}

.rag-cats__pill input:focus-visible {
	outline: 2px solid var(--_gold);
	outline-offset: 3px;
}

/* ---- Knappen der afslutter det hele ---- */

.rag-createform__submit {
	width: 100%;
	margin-top: 1.6rem;
	min-height: 56px;
	font-size: 1.05rem;
}

/* ---- Kvitteringen ---- */

.rag-createform--done {
	padding: clamp(1.8rem, 6vw, 2.8rem) clamp(1.2rem, 4vw, 2rem);
	border: 1px solid var(--_border);
	border-radius: var(--rag-radius, 16px);
	background: var(--_surface);
	box-shadow: var(--rag-shadow, 0 14px 34px -16px rgba(11, 36, 25, 0.22));
	text-align: center;
}

.rag-createform__done-title {
	margin: 0 0 0.4rem;
	font-family: var(--rag-font-display, Georgia, serif);
	font-size: clamp(1.35rem, 1rem + 1.6vw, 1.8rem);
	color: var(--rag-forest-900, #0b2419);
}

.rag-createform__done-name {
	margin: 0 0 0.9rem;
	font-weight: 600;
}

.rag-createform__done-text {
	max-width: 40ch;
	margin: 0 auto 1.4rem;
	color: var(--_muted);
	line-height: 1.6;
}

/* Kameraknappen er kun for enheder man rører ved. Paa en computer med mus
   aabner den blot den samme filvaelger som knappen ved siden af, og to
   knapper til det samme er værre end én. */
/* To klassenavn dybt: temaets .rag-btn saetter ogsaa display og indlaeses
   efter pluginnets stylesheet, saa ét klassenavn taber paa raekkefoelgen. */
.rag-photos .rag-photos__choose--camera {
	display: none;
}

@media (pointer: coarse) {
	.rag-photos .rag-photos__choose--camera {
		display: inline-flex;
	}
}

/* -------------------------------------------------------------------------
   Kategorivalg i to trin
   Seksten kategorier kan staa paa én skaerm. Hundrede kan ikke, og en mur
   af piller er ulaeselig laenge foer det. Derfor: vaelg gruppen foerst.
   ---------------------------------------------------------------------- */

.rag-pick__search {
	width: 100%;
	min-height: 48px;
	margin: 0 0 0.9rem;
	padding: 0.7rem 0.9rem;
	border: 1.5px solid var(--rag-border-strong, rgba(19, 32, 26, 0.22));
	border-radius: var(--_radius-sm);
	background: var(--_surface);
	font: inherit;
	font-size: 1rem;
}

.rag-pick__chosen {
	display: flex;
	flex-wrap: wrap;
	gap: 0.45rem;
	margin: 0 0 0.9rem;
	min-height: 2.2rem;
}

.rag-pick__none {
	margin: 0;
	font-size: 0.88rem;
	color: var(--_muted);
}

.rag-pick__chip {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	min-height: 38px;
	padding: 0.3rem 0.5rem 0.3rem 0.9rem;
	border: 0;
	border-radius: var(--rag-radius-pill, 999px);
	background: var(--_green);
	color: #fff;
	font: inherit;
	font-size: 0.9rem;
	font-weight: 600;
	cursor: pointer;
}

.rag-pick__chip em {
	display: inline-grid;
	place-items: center;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.22);
	font-style: normal;
	font-size: 1rem;
	line-height: 1;
}

.rag-pick__chip:hover em {
	background: rgba(255, 255, 255, 0.4);
}

.rag-pick__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr));
	gap: 0.6rem;
}

.rag-pick__group {
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
	min-height: 68px;
	padding: 0.8rem 1rem;
	border: 1.5px solid var(--rag-border-strong, rgba(19, 32, 26, 0.22));
	border-radius: var(--_radius-sm);
	background: var(--_surface);
	color: var(--_text);
	font: inherit;
	text-align: left;
	cursor: pointer;
	transition: border-color 0.15s, background 0.15s;
}

.rag-pick__group strong {
	font-size: 1rem;
}

.rag-pick__group small {
	font-size: 0.8rem;
	color: var(--_muted);
}

.rag-pick__group:hover {
	border-color: var(--_gold);
}

.rag-pick__group.has-chosen {
	border-color: var(--_green);
	background: color-mix(in srgb, var(--_green) 7%, var(--_surface));
}

.rag-pick__group.has-chosen small {
	color: var(--_green);
	font-weight: 600;
}

.rag-pick__back {
	margin: 0 0 0.6rem;
	padding: 0.4rem 0;
	border: 0;
	background: none;
	color: var(--_green);
	font: inherit;
	font-weight: 600;
	cursor: pointer;
}

.rag-pick__head {
	margin: 0 0 0.6rem;
	font-size: 0.78rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--_muted);
}

.rag-pick__row {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}

.rag-pick__option {
	min-height: 46px;
	padding: 0.55rem 1rem;
	border: 1.5px solid var(--rag-border-strong, rgba(19, 32, 26, 0.22));
	border-radius: var(--rag-radius-pill, 999px);
	background: var(--_surface);
	color: var(--_text);
	font: inherit;
	font-size: 0.95rem;
	cursor: pointer;
	transition: border-color 0.15s, background 0.15s;
}

.rag-pick__option:hover {
	border-color: var(--_gold);
}

.rag-pick__option.is-chosen {
	border-color: var(--_green);
	background: var(--_green);
	color: #fff;
	font-weight: 600;
}

/* Skraldespanden paa vareoprettelsen.
   Roed, men ikke skrigende - den staar ved siden af overskriften og skal kunne
   findes uden at vaere det foerste oejet lander paa. */
.rag-createform__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 0.4rem;
}

.rag-createform__top .rag-sellform__title { margin: 0; }

.rag-createform__ryd {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.5rem 0.8rem;
	border: 1px solid #e3c9c9;
	border-radius: var(--rag-radius-pill, 999px);
	background: #fdf5f5;
	color: #a12d2d;
	font: inherit;
	font-size: 0.9rem;
	font-weight: 600;
	cursor: pointer;
	line-height: 1;
}

.rag-createform__ryd:hover,
.rag-createform__ryd:focus-visible {
	background: #f8e8e8;
	border-color: #d3a5a5;
}

.rag-createform__ryd svg { flex: none; }

/* Spoergsmaalet foer der ryddes. Staar i siden, ikke i en dialogboks - se
   kommentaren i ragenbrug.js. */
.rag-createform__rydspoerg {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.6rem;
	padding: 0.9rem 1rem;
	margin: 0 0 1rem;
	background: #fdf5f5;
	border: 1px solid #e3c9c9;
	border-radius: 8px;
}

.rag-createform__rydspoerg p {
	margin: 0;
	flex: 1 1 100%;
	color: #7a2020;
	font-weight: 600;
}

.rag-createform__rydja,
.rag-createform__rydnej {
	padding: 0.6rem 1rem;
	border-radius: var(--rag-radius-pill, 999px);
	font: inherit;
	font-weight: 600;
	cursor: pointer;
	border: 1px solid transparent;
	min-height: 44px;
}

.rag-createform__rydja { background: #a12d2d; color: #fff; }
.rag-createform__rydja:hover:not(:disabled) { background: #8a2424; }
.rag-createform__rydja:disabled { opacity: 0.7; cursor: default; }

.rag-createform__rydnej { background: #fff; border-color: #d3a5a5; color: #7a2020; }
.rag-createform__rydnej:hover:not(:disabled) { background: #f8e8e8; }

/* ---------------------------------------------------------------------------
   Gennemgang

   Varen vises med WooCommerces egen skabelon - det er den, kunden faar at se,
   og det er den, der skal doemmes. Herunder styles kun baren og begrundelsen.

   Baren klaeber til toppen under scroll. Admin-bjaelken ligger oeverst og er
   selv fastgjort, saa baren skal begynde under den - ellers forsvinder
   knapperne ind bag den, praecis naar man scroller ned til det, man skal
   doemme.
   --------------------------------------------------------------------------- */

.rag-gennemgang {
	max-width: 62rem;
	margin: 0 auto;
}

.rag-gennemgang__bar {
	position: -webkit-sticky;
	position: sticky;
	/* Site-headeren er selv sticky. Hoejden maales af JS og lagres her, saa
	   baren klaeber lige under den i stedet for ind bag den. */
	top: var(--rag-gtop, 0px);
	z-index: 60;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: .5rem .9rem;
	margin: 0 0 1.2rem;
	padding: .7rem 0;
	background: var(--rag-cream, #fbf8f1);
	box-shadow: 0 .6rem .6rem -.6rem rgba(0, 0, 0, .18);
}

.rag-gennemgang__knapper {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: .5rem;
	flex: 1 1 20rem;
}

.rag-gbtn {
	min-height: 3.25rem;
	padding: .6rem .5rem;
	border: 2px solid transparent;
	border-radius: 8px;
	font: inherit;
	font-weight: 700;
	font-size: 1.02rem;
	color: #fff;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
}

.rag-gbtn--afvis   { background: #b3261e; }
.rag-gbtn--godkend { background: #1c6b3c; }
.rag-gbtn--naeste  { background: transparent; color: inherit; border-color: rgba(0, 0, 0, .25); }

.rag-gbtn:focus-visible { outline: 3px solid var(--rag-gold-400, #c9a227); outline-offset: 2px; }
.rag-gbtn:active { transform: translateY(1px); }

.rag-gennemgang__grund {
	margin: 0 0 1.4rem;
	padding: .9rem;
	border: 1px solid rgba(0, 0, 0, .15);
	border-radius: 8px;
	background: #fff;
}

.rag-gennemgang__grund label {
	display: block;
	font-weight: 600;
	margin-bottom: .35rem;
}

.rag-gennemgang__grund textarea {
	width: 100%;
	padding: .6rem;
	border: 1px solid rgba(0, 0, 0, .25);
	border-radius: 6px;
	font: inherit;
	resize: vertical;
}

.rag-gennemgang__grundknapper {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .75rem;
	margin-top: .8rem;
}

.rag-gennemgang__fortryd {
	padding: .6rem .4rem;
	border: 0;
	background: none;
	font: inherit;
	color: inherit;
	text-decoration: underline;
	cursor: pointer;
	/* 44 px at ramme med en finger. */
	min-height: 44px;
}

.rag-gennemgang__grund textarea[aria-invalid="true"] {
	border-color: #b3261e;
	box-shadow: 0 0 0 3px rgba(179, 38, 30, .15);
}

.rag-gennemgang__hint,
.rag-gennemgang__tael {
	margin: .4rem 0 0;
	font-size: .88rem;
	opacity: .7;
}

.rag-gennemgang__tael { margin: 0; white-space: nowrap; }

.rag-gennemgang__besked {
	margin: 0 0 1rem;
	padding: .7rem .9rem;
	border-radius: 6px;
	border-left: 4px solid;
}

.rag-gennemgang__besked--ok   { border-color: #1c6b3c; background: #eef6f0; }
.rag-gennemgang__besked--fejl { border-color: #b3261e; background: #fbeeed; }

/* Sikkerhedsnet: gaar Woos galleri-script galt, skal billederne stadig vaere
   synlige. Uden det staar de der med opacity: 0, og siden ser tom ud. */
.rag-gennemgang__preview .woocommerce-product-gallery {
	opacity: 1 !important;
}

/* Kladden har ingen "koeb"-knap der giver mening her, og relaterede varer er
   stoej naar man skal doemme én ting. */
.rag-gennemgang__preview form.cart,
.rag-gennemgang__preview .related,
.rag-gennemgang__preview .up-sells {
	display: none;
}

.rag-gennemgang__tom {
	text-align: center;
	padding: 3rem 1rem;
}

/* ---------------------------------------------------------------------------
   Naermeste pakkeshops i kassen

   "pshop", ikke "shop": temaet bruger .rag-shop som varesidens container
   (<div class="rag-shop rag-container">). Reglerne her ramte aldrig, saa laenge
   plugin-CSS'en kun blev indlaest i kassen - men da den ogsaa kom med paa
   varesider, blev varesiden pludselig fuld bredde med en hvid ramme om.

   Ligger over GLS' egen knap. Store trykflader: det her vaelges paa en telefon
   med den ene haand, mens den anden holder pakken.
   --------------------------------------------------------------------------- */

.rag-pshops {
	margin: 0 0 .9rem;
}

.rag-pshops__titel {
	margin: 0 0 .5rem;
	font-weight: 700;
	font-size: .95rem;
}

.rag-pshops__liste {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: .5rem;
}

.rag-pshop {
	display: grid;
	gap: .15rem;
	width: 100%;
	min-height: 3.4rem;
	padding: .7rem .9rem;
	text-align: left;
	font: inherit;
	background: #fff;
	border: 2px solid rgba(0, 0, 0, .16);
	border-radius: 10px;
	cursor: pointer;
	position: relative;
	-webkit-tap-highlight-color: transparent;
}

.rag-pshop:hover { border-color: rgba(0, 0, 0, .32); }
.rag-pshop:focus-visible { outline: 3px solid var(--rag-gold-400, #c9a227); outline-offset: 2px; }

.rag-pshop.is-valgt {
	border-color: var(--rag-forest-700, #1c6b3c);
	background: color-mix(in srgb, var(--rag-forest-700, #1c6b3c) 6%, #fff);
}

.rag-pshop__navn { font-weight: 700; padding-right: 4.5rem; }
.rag-pshop__adresse { font-size: .9rem; opacity: .85; padding-right: 4.5rem; }
.rag-pshop__meta { font-size: .82rem; opacity: .65; }

/* Maerkatet i hjoernet, saa navnet ikke skubbes rundt naar teksten skifter
   fra "Vælg" til "Valgt". */
.rag-pshop__vaelg {
	position: absolute;
	top: .7rem;
	right: .9rem;
	font-size: .8rem;
	font-weight: 700;
	color: var(--rag-forest-700, #1c6b3c);
}

.rag-pshop.is-valgt .rag-pshop__vaelg::before {
	content: '✓ ';
}

.rag-pshops__besked,
.rag-pshops__note {
	margin: .3rem 0;
	font-size: .85rem;
	opacity: .7;
}

.rag-pshops__besked--fejl { color: #b3261e; opacity: 1; }

/* Pladsholdere, mens GLS svarer (~1 sek.). Samme hoejde som et rigtigt kort,
   saa kassen ikke hopper, naar listen kommer. */
.rag-pshop--skelet {
	min-height: 4.6rem;
	cursor: default;
	border-color: rgba(0, 0, 0, .08);
	background: linear-gradient(90deg, rgba(0, 0, 0, .04) 0%, rgba(0, 0, 0, .08) 40%, rgba(0, 0, 0, .04) 80%) 0 0 / 300% 100%;
	animation: rag-pshop-skelet 1.2s ease-in-out infinite;
}

@keyframes rag-pshop-skelet {
	from { background-position: 100% 0; }
	to { background-position: 0 0; }
}

@media (prefers-reduced-motion: reduce) {
	.rag-pshop--skelet { animation: none; }
}

/* Grunden til, at "Godkend ordre" er graa - lige under knappen. */
.rag-bestil-hint {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: .35rem .6rem;
	margin: .7rem 0 0;
	font-size: .86rem;
	line-height: 1.45;
	text-align: center;
}

.rag-bestil-hint__gaa {
	padding: .2rem 0;
	border: 0;
	background: none;
	color: var(--rag-forest-700, #1c6b3c);
	font: inherit;
	font-weight: 700;
	text-decoration: underline;
	text-underline-offset: 2px;
	cursor: pointer;
	min-height: 44px;
}

.rag-bestil-hint__gaa:focus-visible { outline: 3px solid var(--rag-gold-400, #c9a227); outline-offset: 2px; }

/* ---------------------------------------------------------------------------
   Reservation
   --------------------------------------------------------------------------- */

/* Baren vises kun de sidste minutter. Klaeber til toppen, saa den ikke
   forsvinder op, mens man kigger paa en vare - men den fylder én linje, ikke
   en halv skaerm. */
/* hidden-attributten skal vinde over display:flex herunder. Browserens egen
   [hidden] { display: none } er en regel som alle andre, og en author-regel med
   display:flex slaar den - saa baren stod som en tom guldstribe i toppen af
   hver eneste side. */
.rag-res-bar[hidden] { display: none; }

.rag-res-bar {
	position: sticky;
	top: 0;
	z-index: 90;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: .5rem .9rem;
	padding: .6rem 1rem;
	background: var(--rag-gold-500, #c9a227);
	color: #1d1a10;
	font-size: .95rem;
	text-align: center;
}

.rag-res-bar--udloebet {
	background: #b3261e;
	color: #fff;
}

.rag-res-bar__tid {
	font-variant-numeric: tabular-nums;
}

.rag-res-bar__knap {
	padding: .35rem .8rem;
	border: 2px solid currentColor;
	border-radius: 999px;
	background: transparent;
	color: inherit;
	font: inherit;
	font-weight: 700;
	font-size: .88rem;
	cursor: pointer;
	text-decoration: none;
}

.rag-res-bar__knap:hover { background: rgba(0, 0, 0, .08); }
.rag-res-bar__knap:disabled { opacity: .55; cursor: default; }

/* En reserveret vare er ikke udsolgt. Den staar der stadig, blot daempet -
   den kommer maaske tilbage om ti minutter. */
.rag-reserveret {
	color: #8a6d1f;
	font-weight: 600;
}

.rag-reserveret-knap {
	opacity: .55;
	cursor: default;
	pointer-events: none;
}

/* Forklaringen der traeder i stedet for koebsknappen. */
.rag-reserveret-boks {
	margin: 1.2rem 0;
	padding: 1rem 1.1rem;
	border: 1px solid rgba(138, 109, 31, .35);
	border-left: 4px solid #8a6d1f;
	border-radius: 8px;
	background: rgba(201, 162, 39, .08);
}

.rag-reserveret-boks strong { display: block; margin-bottom: .3rem; }
.rag-reserveret-boks p { margin: 0; font-size: .93rem; opacity: .85; }

/* "Lagt til side til dig" - loeftet, med uret paa. Groen, fordi det er en god
   besked; den anden boks er gylden, fordi den er en forhindring. */
.rag-reserveret-boks--min {
	border-color: rgba(28, 107, 60, .35);
	border-left-color: #1c6b3c;
	background: rgba(28, 107, 60, .07);
}

.rag-nedtaelling {
	font-variant-numeric: tabular-nums;
	font-weight: 700;
}

.rag-reserveret-boks.is-udloebet {
	border-left-color: #8a6d1f;
	background: rgba(201, 162, 39, .08);
}

/* Ventelisten. */
.rag-venteliste { margin: 1.2rem 0; }
.rag-venteliste label { display: block; font-weight: 700; margin-bottom: .3rem; }
.rag-venteliste__loefte,
.rag-venteliste__note { margin: .3rem 0 .6rem; font-size: .88rem; opacity: .75; }
.rag-venteliste__raekke { display: flex; flex-wrap: wrap; gap: .5rem; }
.rag-venteliste__raekke input[type="email"] {
	flex: 1 1 14rem;
	min-height: 2.9rem;
	padding: .5rem .8rem;
	border: 1px solid rgba(0, 0, 0, .25);
	border-radius: 8px;
	font: inherit;
}
.rag-venteliste__kvittering {
	padding: .9rem 1rem;
	border-left: 4px solid #1c6b3c;
	border-radius: 8px;
	background: rgba(28, 107, 60, .07);
}
/* Honeypot: usynligt for mennesker, udfyldt af maskiner. */
.rag-venteliste__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ---------------------------------------------------------------------
   Fortrydelse.

   En kunde, der er ved at fortryde, er sjaeldent i godt humoer. Siden skal
   vaere kort, rolig og uden noget, der ligner et forsoeg paa at tale ham fra
   det. Derfor ingen advarselsfarver og ingen fremhaevet "fortsæt handlen".
   ------------------------------------------------------------------ */

.rag-fortryd {
	max-width: 44rem;
}

.rag-fortryd__intro {
	margin-bottom: 1.6rem;
}

.rag-fortryd__form .rag-field {
	display: block;
	margin-bottom: 1.1rem;
}

.rag-fortryd__form .rag-field > span {
	display: block;
	margin-bottom: 0.3rem;
	font-weight: 600;
}

.rag-fortryd__form .rag-field small {
	display: block;
	margin-top: 0.3rem;
	font-size: 0.82rem;
	opacity: 0.75;
}

.rag-fortryd__form input[type="text"],
.rag-fortryd__form input[type="email"],
.rag-fortryd__form textarea {
	width: 100%;
	padding: 0.7rem 0.8rem;
	border: 1px solid var(--rag-linje, #ddd8c8);
	border-radius: 8px;
	font: inherit;
	/* 16 px eller derover. Under det zoomer iOS ind, naar feltet faar fokus,
	   og kunden skal saa selv zoome ud igen. */
	font-size: 1rem;
	background: #fff;
}

.rag-fortryd__udkast,
.rag-fortryd-form__tekst {
	padding: 1rem 1.1rem;
	border: 1px solid var(--rag-linje, #ddd8c8);
	border-radius: 10px;
	background: #faf8f2;
	white-space: pre-wrap;
	font-family: inherit;
	font-size: 0.92rem;
	line-height: 1.6;
	overflow-x: auto;
}

.rag-fortryd__knapper {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1rem;
	margin-top: 1.2rem;
}

.rag-fortryd__tilbage {
	font-size: 0.9rem;
}

.rag-fortryd__alternativ {
	margin-top: 1.8rem;
	padding-top: 1.2rem;
	border-top: 1px solid var(--rag-linje, #ddd8c8);
	font-size: 0.92rem;
}

/* Honeypot: skjult for oejet, men ikke med display:none - nogle robotter
   springer netop de felter over. */
.rag-fortryd__hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

@media print {
	.rag-fortryd-form__print,
	.rag-fortryd-form > p:first-child {
		display: none;
	}

	.rag-fortryd-form__tekst {
		border: 0;
		background: none;
		padding: 0;
	}
}

/* Gennemgang: det, der venter - og det, der ikke er klar endnu. */

.rag-gennemgang__afventer {
	margin: 0 0 1rem;
	padding: .7rem .9rem;
	border-left: 3px solid var(--rag-gold-400, #c9a227);
	background: #fbf6e7;
	font-size: .92rem;
}

.rag-gennemgang__ikke-klar {
	margin: 2.5rem 0 0;
	padding-top: 1rem;
	border-top: 1px solid rgba(0, 0, 0, .12);
	font-size: .92rem;
}

.rag-gennemgang__ikke-klar summary {
	cursor: pointer;
	font-weight: 600;
	/* 44 px at ramme med en finger. */
	min-height: 44px;
	display: flex;
	align-items: center;
}

.rag-gennemgang__ikke-klar ul {
	margin: .5rem 0 0;
	padding-left: 1.1rem;
}

.rag-gennemgang__ikke-klar li {
	margin: .25rem 0;
}

.rag-gennemgang__ikke-klar li span {
	opacity: .7;
}