/*
 * Ophalen bij een DHL-punt (servicepunt.php), live sinds 26 oktober 2026,
 * vanaf 24 oktober achter ?staging=true. Laadt op de winkelmand en bij afrekenen.
 *
 * Het derde keuzevlak onder Bezorgadres volgt de twee van
 * afrekenen-kader.css: dezelfde rij, dezelfde lijn ertussen, en de onderste
 * rij rondt zijn hoeken af zolang er geen vak onder open is. Kleuren uit
 * winkelmand.css (--nrd-m-*), dat hier ook laadt.
 */

/* In het overzicht ---------------------------------------------------------- */

/*
 * Met een punt zijn er twee tarieven, allebei met hetzelfde bedrag. Welke het
 * is, kies je met de keuzevlakken (servicepunt.js). In het overzicht en in de
 * winkelmand staat dus alleen het gekozen bedrag, zonder keuzerondje. Zonder
 * :has() blijven de rondjes staan; kiest de klant daar een tarief, dan volgt
 * de bezorgkeuze (naHerberekening in servicepunt.js).
 */
#shipping_method > li:has(> input.shipping_method[type="radio"]:not(:checked)) {
	display: none;
}

#shipping_method > li:has(> input.shipping_method[type="radio"]) > input.shipping_method {
	display: none;
}

/*
 * De naam voor het bedrag (servicepunt.php) alleen waar de rondjes blijven
 * staan. Een browser zonder @supports selector() kent ook :has() niet.
 */
@supports selector(:has(a)) {
	.nrd-tarief-naam {
		display: none;
	}
}

/* De knop en het adres die de plugin van Sendcloud bij het tarief zet. */
#sendcloudshipping_service_point_select,
#sendcloudshipping_service_point_selected_label {
	display: none;
}

/* Het derde keuzevlak ------------------------------------------------------- */

.nrd-kassa .nrd-bezorg__velden + .nrd-bezorg__keuze {
	border-top: 1px solid var(--nrd-m-lijn, #d6e5df);
}

/* Geen tarief meer voor een punt (servicepunt.js, na een herberekening). */
.nrd-kassa .nrd-bezorg__keuze[hidden] {
	display: none;
}

.nrd-kassa .nrd-bezorg:has(input[value="ander"]:checked) .nrd-bezorg__keuze--punt {
	border-radius: 0 0 12px 12px;
}

.nrd-kassa .nrd-bezorg:has(input[value="punt"]:checked) .nrd-bezorg__velden {
	display: none;
}

.nrd-kassa .nrd-bezorg__punt {
	padding: 18px 20px 20px;
	border-top: 1px solid var(--nrd-m-lijn, #d6e5df);
}

.nrd-kassa .nrd-bezorg:not(:has(input[value="punt"]:checked)) .nrd-bezorg__punt {
	display: none;
}

/* Het gekozen punt: naam, adres, en rechts "Ander punt kiezen". */
.nrd-kassa .nrd-punt {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: start;
	column-gap: 16px;
}

.nrd-kassa .nrd-punt[hidden],
.nrd-kassa .nrd-punt-leeg[hidden],
.nrd-kassa .nrd-punt__soort[hidden] {
	display: none;
}

.nrd-kassa .nrd-punt > p {
	grid-column: 1;
	margin: 0;
}

.nrd-kassa .nrd-punt__naam {
	color: var(--nrd-m-petrol, #31545b);
	font-family: Acme, var(--theme-font-family, sans-serif);
	font-size: 19px;
	font-weight: 400;
	line-height: 1.2;
	overflow-wrap: anywhere;
}

.nrd-kassa .nrd-punt__adres {
	padding-top: 4px;
	color: var(--theme-palette-color-2, #121723);
	font-size: 15px;
	line-height: 1.5;
}

.nrd-kassa .nrd-punt__soort {
	justify-self: start;
	margin-top: 8px;
	padding: 3px 10px;
	border-radius: 999px;
	background: var(--theme-palette-color-7, #eef5f2);
	color: var(--nrd-m-petrol, #31545b);
	font-size: 13px;
	font-weight: 600;
	line-height: 1.35;
}

/* Tekstknop, zoals "Bedrijfsnaam toevoegen" (afrekenen-kader.css). */
.nrd-kassa .nrd-punt__ander {
	grid-column: 2;
	grid-row: 1;
	margin: 0;
	padding: 2px 0;
	border: 0;
	background: none;
	color: var(--nrd-m-petrol, #31545b);
	font: inherit;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.35;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
	cursor: pointer;
}

.nrd-kassa .nrd-punt__ander:hover {
	text-decoration-thickness: 2px;
}

.nrd-kassa .nrd-punt__ander:focus-visible {
	outline: 2px solid var(--nrd-m-petrol, #31545b);
	outline-offset: 3px;
	border-radius: 6px;
}

/* Nog geen punt: een zin en de petrol knop die de kaart opent. */
.nrd-kassa .nrd-punt-leeg__uitleg {
	margin: 0 0 12px;
	color: var(--nrd-m-rustig, #557277);
	font-size: 14px;
	font-weight: 600;
	line-height: 1.5;
	text-wrap: pretty;
}

.nrd-kassa .nrd-punt-leeg__knop {
	--theme-button-background-initial-color: var(--nrd-m-petrol, #31545b);
	--theme-button-background-hover-color: var(--theme-palette-color-2, #121723);
	--theme-button-min-height: 48px;
	margin: 0;
}

.nrd-kassa .nrd-punt__fout {
	margin: 12px 0 0;
	color: #b42318;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.4;
}

.nrd-kassa .nrd-punt__fout[hidden] {
	display: none;
}

@media (max-width: 689.98px) {
	.nrd-kassa .nrd-bezorg__punt {
		padding: 16px 16px 18px;
	}

	.nrd-kassa .nrd-punt {
		grid-template-columns: minmax(0, 1fr);
	}

	.nrd-kassa .nrd-punt__ander {
		grid-column: 1;
		grid-row: auto;
		justify-self: start;
		margin-top: 10px;
	}

	.nrd-kassa .nrd-punt-leeg__knop {
		width: 100%;
	}
}