/*
 * Anmeldelser på stedsiden: sammendrag, formular med detaljer og
 * detaljerne under hver anmeldelse. Bygger på child-temaets tokens og
 * Listifys stjerneikoner (Ionicons).
 */

/* ------------------------------------------------------------------ */
/* Besked efter indsendelse                                            */
/* ------------------------------------------------------------------ */

.gc-anm-besked {
	margin: 0 0 20px;
	padding: 14px 16px;
	border-radius: var(--gc-radius-lille, 10px);
	border-left: 4px solid var(--gc-mos, #5b6e45);
	background: var(--gc-salvie-lys, #dde5d6);
	color: var(--gc-tekst, #26302a);
	scroll-margin-top: 120px;
}

.gc-anm-besked--afventer {
	border-left-color: var(--gc-okker, #c9973f);
	background: var(--gc-sand, #ede4d3);
}

.gc-anm-besked p {
	margin: 0;
}

.gc-anm-besked strong {
	color: var(--gc-tekst, #26302a);
}

/* ------------------------------------------------------------------ */
/* Sammendrag over anmeldelserne                                       */
/* ------------------------------------------------------------------ */

/* Kortet er en container: layoutet følger kolonnens bredde, ikke skærmens
   (Listifys indholdskolonne er smal på tablets). */
.gc-anm-oversigt {
	container-type: inline-size;
	margin: 0 0 28px;
	padding: 20px;
	border: 1px solid var(--gc-kant, #e2dacb);
	border-radius: var(--gc-radius, 14px);
	background: var(--gc-creme, #f7f3ec);
}

.gc-anm-oversigt__indre {
	display: grid;
	gap: 20px;
}

.gc-anm-oversigt__samlet {
	text-align: center;
}

.gc-anm-oversigt__tal {
	margin: 0 0 4px;
	font-family: var(--gc-font-overskrift, Georgia, serif);
	font-size: 44px;
	font-weight: 600;
	line-height: 1;
	color: var(--gc-tekst, #26302a);
	font-variant-numeric: tabular-nums;
}

/* Listify giver alle .listing-stars en margen med !important (til kortets pop-op). */
.gc-anm-oversigt .gc-anm-oversigt__stjerner {
	display: inline-flex !important;
	gap: 2px;
	margin: 0 !important;
	line-height: 1;
}

.gc-anm-oversigt .gc-anm-oversigt__stjerner .listing-star {
	margin: 0;
	font-size: 22px;
	color: var(--gc-okker, #c9973f);
}

.gc-anm-oversigt__antal {
	margin: 6px 0 0;
	font-size: 14px;
	color: var(--gc-tekst-bloed, #4a554d);
}

.gc-anm-oversigt__detaljer {
	display: grid;
	gap: 12px;
	align-content: center;
}

.gc-anm-bars {
	display: grid;
	gap: 10px;
	margin: 0;
}

.gc-anm-bar {
	display: grid;
	gap: 4px;
}

.gc-anm-bar dt {
	margin: 0;
	font-size: 14px;
	font-weight: 500;
	color: var(--gc-tekst, #26302a);
}

.gc-anm-bar dd {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0;
}

.gc-anm-bar__spor {
	flex: 1;
	min-width: 60px;
	height: 8px;
	overflow: hidden;
	border-radius: 999px;
	background: var(--gc-salvie-lys, #dde5d6);
}

.gc-anm-bar__fyld {
	display: block;
	height: 100%;
	border-radius: inherit;
	background: var(--gc-mos, #5b6e45);
}

.gc-anm-bar__tal {
	min-width: 2.2em;
	font-weight: 600;
	text-align: right;
	color: var(--gc-tekst, #26302a);
	font-variant-numeric: tabular-nums;
}

.gc-anm-oversigt__intro,
.gc-anm-oversigt__note {
	margin: 0;
	font-size: 14px;
	color: var(--gc-tekst-bloed, #4a554d);
}

.gc-anm-oversigt--tom .gc-anm-oversigt__intro {
	font-size: 16px;
	color: var(--gc-tekst, #26302a);
}

.gc-anm-oversigt .gc-anm-oversigt__knap {
	display: block;
	width: 100%;
	text-align: center;
}

@container (min-width: 400px) {
	.gc-anm-bar {
		grid-template-columns: minmax(130px, 44%) 1fr;
		align-items: center;
		gap: 12px;
	}

	.gc-anm-oversigt .gc-anm-oversigt__knap {
		display: inline-block;
		width: auto;
		justify-self: start;
	}
}

@container (min-width: 580px) {
	.gc-anm-oversigt__indre {
		grid-template-columns: minmax(140px, 180px) 1fr;
		align-items: center;
	}

	.gc-anm-oversigt__samlet {
		padding-right: 20px;
		border-right: 1px solid var(--gc-kant, #e2dacb);
	}

	.gc-anm-oversigt--uden-samlet .gc-anm-oversigt__indre {
		grid-template-columns: 1fr;
	}

	.gc-anm-oversigt--tom .gc-anm-oversigt__indre {
		grid-template-columns: 1fr auto;
	}
}

@media (min-width: 700px) {
	.gc-anm-oversigt {
		padding: 24px;
	}
}

/* ------------------------------------------------------------------ */
/* Formularen                                                          */
/* ------------------------------------------------------------------ */

/* Listifys samlede vurdering, når den mangler ved afsendelse. */
.gc-anm-form .comment-form-rating--listify.gc-anm-mangler .stars .star::before {
	color: var(--gc-terracotta, #b8683f);
}

.gc-anm-fejl {
	margin: -12px 0 20px;
	color: #9a4f2b;
	font-size: 14px;
	font-weight: 600;
}

/* Værten giver ikke stjerner til sit eget sted, og svar (?replytocom=) har ingen. */
.gc-anm-form--vaert .comment-form-rating--listify,
.gc-anm-form--svar .comment-form-rating--listify {
	display: none;
}

.gc-anm-felter {
	display: grid;
	gap: 18px;
	margin: 0 0 22px;
}

.gc-anm-valgfrit {
	display: inline-block;
	margin-left: 6px;
	padding: 1px 8px;
	border-radius: 999px;
	background: var(--gc-sand, #ede4d3);
	color: var(--gc-tekst-bloed, #4a554d);
	font-size: 12px;
	font-weight: 500;
	line-height: 1.6;
	vertical-align: middle;
}

/* "Bedøm gerne i detaljer" – klappes ud. */
.gc-anm-detaljer {
	border: 1px solid var(--gc-kant, #e2dacb);
	border-radius: var(--gc-radius-lille, 10px);
	background: var(--gc-hvid, #fffdf9);
}

.gc-anm-detaljer > summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	min-height: 50px;
	padding: 12px 16px;
	cursor: pointer;
	list-style: none;
	font-weight: 600;
	color: var(--gc-tekst, #26302a);
	border-radius: inherit;
}

.gc-anm-detaljer > summary::-webkit-details-marker {
	display: none;
}

.gc-anm-detaljer > summary::after {
	content: "";
	flex: none;
	width: 9px;
	height: 9px;
	margin-right: 4px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg) translateY(-3px);
	transition: transform 0.2s ease;
}

.gc-anm-detaljer[open] > summary::after {
	transform: rotate(-135deg) translateY(-3px);
}

.gc-anm-detaljer > summary:focus-visible {
	outline: 2px solid var(--gc-skov, #2f4a3a);
	outline-offset: 2px;
}

.gc-anm-detaljer__titel .gc-anm-valgfrit {
	margin-right: auto;
}

.gc-anm-detaljer__indhold {
	padding: 0 16px 12px;
}

.gc-anm-kriterie {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 2px 12px;
	padding: 8px 0;
	border-top: 1px solid var(--gc-kant, #e2dacb);
}

.gc-anm-kriterie__navn {
	font-size: 15px;
	font-weight: 500;
	color: var(--gc-tekst, #26302a);
}

.gc-anm-kriterie__valg {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.gc-anm-kriterie__ord {
	min-width: 6.5em;
	font-size: 13px;
	color: var(--gc-tekst-bloed, #4a554d);
}

.gc-anm-detaljer__note {
	margin: 6px 0 0;
	font-size: 13px;
	color: var(--gc-tekst-bloed, #4a554d);
}

/* Stjerner som radioknapper: DOM-rækkefølgen er 5 → 1 og vendes visuelt,
   så "~" rammer den valgte og alle lavere. */
.gc-anm-vaelg-stjerner {
	display: inline-flex;
	flex-direction: row-reverse;
	align-items: center;
}

.gc-anm-vaelg-stjerner input {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: 0;
	opacity: 0;
	pointer-events: none;
}

.comment-form .gc-anm-vaelg-stjerner label {
	display: inline-block;
	margin: 0;
	padding: 6px 3px;
	cursor: pointer;
	line-height: 1;
	font-size: 26px;
	color: var(--gc-okker, #c9973f);
}

.gc-anm-vaelg-stjerner label::before {
	display: inline-block;
	font-family: "Ionicons";
	font-style: normal;
	font-weight: 400;
	line-height: 1;
	speak: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	content: "\f3ae"; /* ion-android-star-outline */
}

.gc-anm-vaelg-stjerner input:checked ~ label::before {
	content: "\f2fc"; /* ion-android-star */
}

@media (hover: hover) {
	.gc-anm-vaelg-stjerner:hover input ~ label::before {
		content: "\f3ae";
	}

	.gc-anm-vaelg-stjerner:hover label:hover::before,
	.gc-anm-vaelg-stjerner:hover label:hover ~ label::before {
		content: "\f2fc";
	}
}

.gc-anm-vaelg-stjerner input:focus-visible + label {
	border-radius: 6px;
	outline: 2px solid var(--gc-skov, #2f4a3a);
	outline-offset: 1px;
}

/* Hvornår og hvem. */
.gc-anm-tur {
	display: grid;
	gap: 16px;
}

.gc-anm-tur__felt {
	margin: 0;
}

.comment-form .gc-anm-tur__felt > label,
.gc-anm-selskab__titel {
	display: block;
	margin: 0 0 6px;
	font-weight: 500;
	color: var(--gc-tekst, #26302a);
}

.gc-anm-tur select {
	width: 100%;
	max-width: 340px;
	min-height: 46px;
}

.gc-anm-valgchips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.comment-form .gc-anm-valgchip {
	position: relative;
	display: inline-block;
	margin: 0;
	cursor: pointer;
}

.gc-anm-valgchip input {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: 0;
	opacity: 0;
	pointer-events: none;
}

.gc-anm-valgchip span {
	display: inline-flex;
	align-items: center;
	min-height: 42px;
	padding: 8px 16px;
	border: 1px solid var(--gc-kant, #e2dacb);
	border-radius: 999px;
	background: var(--gc-hvid, #fffdf9);
	color: var(--gc-tekst, #26302a);
	font-size: 14px;
	font-weight: 500;
	line-height: 1.2;
	transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.gc-anm-valgchip:hover span {
	border-color: var(--gc-salvie, #a9b8a0);
}

.gc-anm-valgchip input:checked + span {
	border-color: var(--gc-skov, #2f4a3a);
	background: var(--gc-skov, #2f4a3a);
	color: #fff;
}

.gc-anm-valgchip input:focus-visible + span {
	outline: 2px solid var(--gc-skov, #2f4a3a);
	outline-offset: 2px;
}

.gc-anm-valgchip--hund span::before {
	content: "\f47a"; /* ion-ios-paw */
	margin-right: 6px;
	font-family: "Ionicons";
	font-size: 16px;
	line-height: 1;
}

/* Hjælpetekst under navn og e-mail. */
.gc-anm-hjaelp {
	display: block;
	margin-top: 4px;
	font-size: 13px;
	color: var(--gc-tekst-bloed, #4a554d);
}

/* Samtykke til cookies: afkrydsning og tekst på samme linje. */
.gc-anm-form .comment-form-cookies-consent {
	display: flex;
	align-items: flex-start;
	gap: 10px;
}

.gc-anm-form .comment-form-cookies-consent input {
	flex: none;
	margin: 3px 0 0;
}

.gc-anm-form .comment-form-cookies-consent label {
	display: inline;
	margin: 0;
}

/* Tekstfeltets etiket skifter, når formularen bruges til et svar. */
.gc-anm-kun-svar,
.commentlist .comment-respond .gc-anm-kun-anmeldelse {
	display: none;
}

.commentlist .comment-respond .gc-anm-kun-svar {
	display: inline;
}

/* Svar har ingen stjerner eller detaljer – Listify gemmer dem heller ikke. */
.commentlist .comment-respond .comment-form-rating--listify,
.commentlist .comment-respond .gc-anm-felter,
.commentlist .comment-respond .gc-anm-fejl {
	display: none;
}

/* ------------------------------------------------------------------ */
/* Under hver anmeldelse                                               */
/* ------------------------------------------------------------------ */

.gc-anm-review {
	margin: 10px 0 6px;
}

.gc-anm-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.gc-anm-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin: 0;
	padding: 4px 10px;
	border-radius: 999px;
	background: var(--gc-salvie-lys, #dde5d6);
	color: var(--gc-skov, #2f4a3a);
	font-size: 13px;
	font-weight: 500;
	line-height: 1.4;
}

.gc-anm-chip__vaerdi {
	display: inline-flex;
	align-items: center;
	gap: 3px;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}

.gc-anm-chip .listing-star {
	font-size: 13px;
	color: var(--gc-okker, #c9973f);
}

.gc-anm-rejse {
	margin: 8px 0 0;
	font-size: 14px;
	color: var(--gc-tekst-bloed, #4a554d);
}

/* Venlig note i stedet for Listifys korte "afventer godkendelse". */
.commentlist .comment-awaiting-moderation {
	display: none;
}

.gc-anm-afventer {
	display: inline-block;
	margin: 6px 0 10px;
	padding: 6px 12px;
	border-radius: var(--gc-radius-lille, 10px);
	background: var(--gc-sand, #ede4d3);
	color: var(--gc-tekst, #26302a);
	font-size: 14px;
}

@media (prefers-reduced-motion: reduce) {
	.gc-anm-detaljer > summary::after,
	.gc-anm-valgchip span {
		transition: none;
	}
}