/**
 * Markerkaart: bedoeld voor gebruik op de baan, op een telefoon, met één hand.
 * Vandaar grote raakvlakken (minimaal 44px) en veel contrast.
 */

.njgt-mk {
	max-width: 560px;
	margin: 0 auto;
	font-family: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	color: #12211A;
}
.njgt-mk__kop { margin: 0 0 .3rem; }
.njgt-mk__uit { margin: 0 0 1rem; color: #5C6B62; }
.njgt-mk__leeg { color: #5C6B62; font-style: italic; }

/* --- flightkeuze --- */
.njgt-mk__kies { margin-bottom: 1rem; }
.njgt-mk__kies select { width: 100%; padding: .7rem; border: 1px solid #DFE4DC; border-radius: 10px; font: inherit; }
.njgt-mk__flights { list-style: none; margin: 0; padding: 0; }
.njgt-mk__flights li { margin-bottom: .6rem; }
.njgt-mk__flights a {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: .2rem .7rem;
	padding: .9rem 1rem;
	background: #fff;
	border: 1px solid #DFE4DC;
	border-radius: 12px;
	text-decoration: none;
	color: inherit;
}
.njgt-mk__fnr { font-weight: 800; font-size: 1.05rem; color: #1F5137; }
.njgt-mk__tijd { font-variant-numeric: tabular-nums; color: #5C6B62; text-align: right; }
.njgt-mk__marker,
.njgt-mk__spelers { grid-column: 1 / -1; font-size: .88rem; color: #5C6B62; }
.njgt-mk__marker { font-weight: 700; color: #1F5137; }
.njgt-mk__klaar { grid-column: 1 / -1; font-size: .82rem; color: #1B7A2E; font-weight: 700; }

/* --- kaart --- */
.njgt-mk__head { display: flex; align-items: flex-start; justify-content: space-between; gap: .8rem; margin-bottom: .7rem; }
.njgt-mk__head h2 { margin: 0; font-size: 1.15rem; }
.njgt-mk__head p { margin: .1rem 0 0; font-size: .85rem; color: #5C6B62; }
.njgt-mk__terug { font-weight: 700; color: #1F5137; text-decoration: none; white-space: nowrap; }

.njgt-mk__holes { display: grid; grid-template-columns: repeat(9, 1fr); gap: 5px; margin-bottom: .8rem; }
.njgt-mk__holes button {
	padding: .7rem 0;
	border: 1px solid #DFE4DC;
	border-radius: 9px;
	background: #fff;
	font: 700 .95rem/1 inherit;
	color: #12211A;
	cursor: pointer;
}
.njgt-mk__holes button.is-klaar { background: #E6EFE8; border-color: #C3DBCB; }
.njgt-mk__holes button.is-nu { background: #1F5137; border-color: #1F5137; color: #fff; }

.njgt-mk__kaart {
	background: #fff;
	border: 1px solid #DFE4DC;
	border-radius: 14px;
	padding: .9rem;
	margin-bottom: .7rem;
}
.njgt-mk__holekop { font-size: 1.5rem; font-weight: 800; margin-bottom: .5rem; }

.njgt-mk__speler { border-top: 1px solid #EEF3EC; padding-top: .8rem; margin-top: .8rem; }
.njgt-mk__speler:first-child { border-top: 0; padding-top: 0; margin-top: 0; }
.njgt-mk__snaam { font-weight: 700; font-size: 1rem; margin-bottom: .5rem; }
.njgt-mk__chips { display: flex; flex-wrap: wrap; gap: 6px; }
.njgt-mk__chips button {
	min-width: 46px;
	height: 46px;
	padding: 0 .7rem;
	border: 1px solid #DFE4DC;
	border-radius: 10px;
	background: #fff;
	font: 700 1.05rem/1 inherit;
	font-variant-numeric: tabular-nums;
	color: #12211A;
	cursor: pointer;
}
.njgt-mk__chips button.is-gekozen { background: #1F5137; border-color: #1F5137; color: #fff; }
.njgt-mk__pu { min-width: 96px !important; font-size: .85rem !important; color: #5C6B62 !important; }
.njgt-mk__pu.is-gekozen { background: #8A3B3B !important; border-color: #8A3B3B !important; color: #fff !important; }
.njgt-mk__sub { margin: .5rem 0 0; font-size: .85rem; color: #5C6B62; }

.njgt-mk__nav { display: flex; gap: 8px; margin-top: 1rem; }
.njgt-mk__nav button {
	flex: 1;
	padding: .85rem 0;
	border: 1px solid #DFE4DC;
	border-radius: 11px;
	background: #fff;
	font: 700 1rem/1 inherit;
	color: #12211A;
	cursor: pointer;
}
.njgt-mk__btn--ja { background: #1F5137 !important; border-color: #1F5137 !important; color: #fff !important; }

/* --- overzicht --- */
.njgt-mk__tot { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.njgt-mk__tot th,
.njgt-mk__tot td { padding: .4rem .2rem; text-align: center; font-size: .88rem; border-bottom: 1px solid #EEF3EC; }
.njgt-mk__tot th { font-size: .75rem; color: #5C6B62; }
.njgt-mk__tot .njgt-mk__h { font-weight: 700; }
.njgt-mk__tot tr.is-nu { background: #F4F8F3; }
.njgt-mk__tot tfoot td { font-weight: 800; border-bottom: 0; border-top: 2px solid #12211A; padding-top: .5rem; }

/* --- doorgeven --- */
.njgt-mk__doorgeef { text-align: center; }
.njgt-mk__status { margin: .7rem 0 0; font-size: .85rem; color: #5C6B62; }
.njgt-mk__wis { margin-top: .6rem; border: 0; background: none; color: #8A3B3B; font: 700 .85rem/1 inherit; cursor: pointer; padding: .5rem; }

@media print { .njgt-mk__holes, .njgt-mk__nav, .njgt-mk__doorgeef { display: none; } }
