/* UitWandelen — eigen styling, geen thema-wijzigingen. */

.uw-single,
.uw-archief {
	max-width: 1100px;
	margin: 0 auto;
	padding: 0 16px;
}

/* --- kaart --- */
.uw-kaart {
	height: 380px;
	margin: 20px 0;
	border-radius: 10px;
	overflow: hidden;
	background: #eef1ec;
}
.uw-kaart--groot { height: 520px; }
@media (max-width: 600px) {
	.uw-kaart { height: 300px; }
	.uw-kaart--groot { height: 360px; }
}

/* --- merknaam --- */
.uw-merk {
	margin: 0 0 2px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #1d4e2f;
}
.uw-merk a { color: inherit; text-decoration: none; }
.uw-merk a:hover { text-decoration: underline; }

/* --- foto op de routepagina --- */
.uw-foto { margin: 18px 0 0; }
.uw-foto img {
	display: block;
	width: 100%;
	height: auto;
	max-height: 460px;
	object-fit: cover;
	border-radius: 10px;
}
.uw-foto__credit { margin: 6px 2px 0; font-size: 12.5px; color: #7a7f74; }

/* --- routekop --- */
.uw-route__feiten {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 18px;
	padding: 0;
	margin: 12px 0 0;
	font-size: 15px;
	color: #4a4f45;
}
.uw-route__feiten strong { color: #1d4e2f; }

/* --- wandelroute van de week --- */
.uw-weektip {
	margin: 20px 0 26px;
	padding: 20px 22px;
	background: #1d4e2f;
	color: #f3f6f1;
	border-radius: 12px;
}
/* Met foto: beeld links, tekst rechts. Zonder foto blijft de oude opmaak staan. */
.uw-weektip--foto {
	display: flex;
	gap: 0;
	padding: 0;
	overflow: hidden;
}
.uw-weektip--foto .uw-weektip__media { flex: 0 0 38%; min-height: 220px; }
.uw-weektip--foto .uw-weektip__media img {
	display: block; width: 100%; height: 100%;
	object-fit: cover;
}
.uw-weektip--foto .uw-weektip__tekstblok { flex: 1; padding: 20px 22px; }
@media (max-width: 680px) {
	.uw-weektip--foto { flex-direction: column; }
	.uw-weektip--foto .uw-weektip__media { flex: none; width: 100%; min-height: 180px; }
}
.uw-weektip__label {
	margin: 0 0 4px;
	font-size: 12px; font-weight: 700;
	letter-spacing: .09em; text-transform: uppercase;
	color: #a8d8b9;
}
.uw-weektip__titel { margin: 0 0 6px; font-size: 22px; line-height: 1.25; }
.uw-weektip__titel a { color: #fff; text-decoration: none; }
.uw-weektip__titel a:hover { text-decoration: underline; }
.uw-weektip__feiten { margin: 0 0 8px; font-size: 14px; color: #c9e2d2; }
.uw-weektip__tekst { margin: 0 0 8px; font-size: 15px; max-width: 62ch; }
.uw-weektip__let { margin: 0 0 10px; font-size: 13.5px; color: #c9e2d2; }
.uw-archief .uw-weektip a.uw-knop,
.uw-weektip a.uw-knop {
	/* Moet specifieker zijn dan `.uw-archief a.uw-knop` hierboven, anders wint die
	   met wit-op-wit als resultaat. Nagemeten in de browser, niet op het oog. */
	background: #fff;
	color: #1d4e2f !important;
}

/* --- filters --- */
.uw-filters {
	display: flex;
	flex-wrap: wrap;
	align-items: end;
	gap: 14px;
	margin: 18px 0;
}
.uw-filter__wrap { display: flex; flex-direction: column; gap: 4px; font-size: 14px; }
.uw-filter {
	padding: 7px 10px;
	border: 1px solid #d6d9d2;
	border-radius: 7px;
	background: #fff;
	min-width: 150px;
}
.uw-teller { margin-left: auto; font-size: 14px; color: #6b7065; }

/* --- lijst --- */
.uw-lijst {
	list-style: none;
	padding: 0;
	display: grid;
	gap: 16px;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}
.uw-lijst__item {
	border: 1px solid #e6e8e3;
	border-radius: 10px;
	padding: 16px;
	background: #fff;
	overflow: hidden;
}
/* Kaart mét foto: beeld tegen de rand, tekst met eigen padding eronder. */
.uw-lijst__item--foto { padding: 0 0 16px; }
.uw-lijst__item--foto > .uw-lijst__link,
.uw-lijst__item--foto > .uw-lijst__excerpt { padding-left: 16px; padding-right: 16px; }
.uw-lijst__foto { display: block; }
.uw-lijst__foto img {
	display: block; width: 100%; height: 170px;
	object-fit: cover;
	background: #eef1ec;
}
.uw-lijst__link { text-decoration: none; color: inherit; }
.uw-lijst__titel { font-size: 17px; margin: 0 0 6px; }
.uw-lijst__feiten { margin: 0 0 8px; font-size: 14px; color: #1d4e2f; font-weight: 600; }
.uw-lijst__excerpt { margin: 0; font-size: 14px; color: #5a5f55; }

/* --- knop / download --- */
/* Knoptekst geforceerd wit.
   Gemeten op uitgroningen.com: het thema zette de link op #1b2a22 op onze #1d4e2f
   achtergrond - vrijwel onleesbaar. `a.uw-knop` alleen was niet genoeg, want de
   themaregel heeft dezelfde specificiteit en laadt later. Het Uit-netwerk draait
   ongelijke themageneraties, dus hier is !important op puur de tekstkleur de enige
   uitkomst die overal houdt. */
.uw-single a.uw-knop,
.uw-archief a.uw-knop,
a.uw-knop,
a.uw-knop:visited,
a.uw-knop:hover,
a.uw-knop:focus {
	color: #fff !important;
	text-decoration: none;
}
.uw-knop {
	display: inline-block;
	padding: 9px 16px;
	border-radius: 8px;
	background: #1d4e2f;
	color: #fff;
	text-decoration: none;
	font-size: 14px;
	font-weight: 600;
}
.uw-knop:hover { background: #163d25; }

/* --- looproutebeschrijving --- */
.uw-route-uitleg { margin: 30px 0; }
.uw-route-uitleg__intro { font-size: 15px; color: #4a4f45; max-width: 62ch; }
.uw-etappes {
	list-style: none;
	counter-reset: etappe;
	padding: 0;
	margin: 18px 0 0;
	border-left: 2px solid #d9e0d5;
}
.uw-etappe {
	position: relative;
	counter-increment: etappe;
	padding: 0 0 18px 34px;
	font-size: 15px;
	line-height: 1.55;
}
.uw-etappe::before {
	content: counter(etappe);
	position: absolute;
	left: -13px;
	top: 1px;
	width: 24px; height: 24px;
	border-radius: 50%;
	background: #1d4e2f;
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	display: flex; align-items: center; justify-content: center;
}
.uw-etappe__tekst { display: block; }
.uw-etappe__cum { display: block; margin-top: 2px; font-size: 13px; color: #868c7e; }
.uw-route-uitleg__slot { margin-top: 6px; font-size: 13.5px; color: #5f6459; max-width: 62ch; }

.uw-signalen {
	margin: 18px 0 0;
	padding: 12px 16px;
	background: #f6f4ee;
	border-radius: 9px;
	font-size: 14px;
}
.uw-signalen__kop { margin: 0 0 6px; font-size: 15px; }
.uw-signalen ul { margin: 0; padding-left: 18px; }
.uw-signaal { margin: 3px 0; }
.uw-signaal--let-op { color: #8a5a10; }
.uw-signaal__meters { color: #868c7e; font-size: 13px; }

/* --- stops: betaald en gratis blijven visueel gescheiden --- */
.uw-stops { margin: 28px 0; }
.uw-stops__kop { font-size: 16px; margin: 18px 0 8px; }
.uw-stops__lijst { list-style: none; padding: 0; margin: 0; }
.uw-stop {
	padding: 9px 0;
	border-bottom: 1px solid #eceee9;
	font-size: 15px;
}
.uw-stop__afstand { color: #797f73; font-size: 13px; }
.uw-stops__rest { margin: 10px 0 0; font-size: 13.5px; color: #6b7065; font-style: italic; }

/* Betaalde plaatsingen: eigen blok, eigen achtergrond, altijd gelabeld. */
.uw-stops__lijst--betaald {
	background: #fbf7ef;
	border: 1px solid #ecdfc4;
	border-radius: 9px;
	padding: 4px 14px;
}
.uw-adlabel {
	display: inline-block;
	font-size: 10.5px;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: #8a7440;
	background: #f2e6cd;
	border-radius: 4px;
	padding: 2px 7px;
	vertical-align: middle;
}

/* --- sponsor --- */
.uw-sponsor {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
	margin: 18px 0;
	padding: 12px 16px;
	background: #fbf7ef;
	border: 1px solid #ecdfc4;
	border-radius: 9px;
	font-size: 14px;
}
.uw-sponsor__intro { color: #6b6250; }
.uw-sponsor__naam { font-weight: 700; color: #3d3a32; }
.uw-sponsor__logo { max-height: 38px; width: auto; display: block; }

/* --- voettekst, disclaimer, bron --- */
.uw-route__voet { margin-top: 28px; font-size: 13.5px; color: #5f6459; }
.uw-gecontroleerd { color: #1d4e2f; }
.uw-waarschuwing {
	padding: 10px 14px;
	background: #fdf3e7;
	border-left: 3px solid #d08a2c;
	border-radius: 4px;
}
.uw-disclaimer { font-style: italic; }
.uw-bron { font-size: 12.5px; color: #7a7f74; margin-top: 14px; }

/* --- "ligt aan N routes" op de POI-pagina --- */
.uw-oproutes { margin: 26px 0; }
.uw-oproutes ul { padding-left: 18px; }

/* ── Praktisch dossier ─────────────────────────────────────────────────────────
   Staat vóór de looproute: eerst weten of je er kunt komen. */
.uw-praktisch{margin:28px 0;padding:22px 24px;background:var(--alt,#f2f5f7);
  border:1px solid var(--alt-border,#dde5ea);border-radius:14px;}
.uw-praktisch h2{margin:0 0 4px;font-size:22px;}
.uw-praktisch h3{margin:20px 0 8px;font-size:15px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--text-soft,#6b655c);}
.uw-praktisch__start h3{margin-top:12px;}
.uw-startadres{margin:0 0 10px;font-size:16px;line-height:1.5;}
.uw-startadres strong{font-size:18px;}
.uw-praktisch__nav{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:0 0 4px;}
/* Bewust NIET .uw-knop: die klasse draagt hierboven `color:#fff !important` (nodig omdat
   het thema op sommige sites de knoptekst onleesbaar maakte). Een lichte variant daarvan
   maken kan dus alleen met nóg een !important, en dat is een wedloop die niemand wint.
   Deze knop staat op een lichte achtergrond en krijgt daarom zijn eigen klasse. */
.uw-praktisch__knop{display:inline-block;padding:9px 16px;border-radius:8px;
  background:#fff;color:#1a1817;border:1px solid var(--card-border,#d8d3c8);
  text-decoration:none;font-size:14px;font-weight:600;}
.uw-praktisch__knop:hover,.uw-praktisch__knop:focus{border-color:var(--accent,#e0a33c);
  color:#1a1817;text-decoration:none;}
/* Raster over de BLOKKEN, niet over losse dt/dd: met een <dl> belandden kop en lijst
   in aparte rastercellen en raakten ze visueel van elkaar los. */
.uw-vz{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:18px 26px;margin:0;align-items:start;}
.uw-vz__blok{min-width:0;}
.uw-vz__kop{font-weight:700;font-size:14px;margin:0 0 5px;text-transform:none;
  letter-spacing:0;color:inherit;}
.uw-vz__lijst{margin:0;padding:0;list-style:none;}
.uw-vz__lijst li{font-size:14px;line-height:1.45;margin:0 0 5px;}
.uw-vz__naam{font-weight:600;}
.uw-vz__afstand{color:var(--text-soft,#6b655c);}
.uw-vz__afstand::before{content:" · ";}
.uw-vz__extra{color:var(--text-soft,#6b655c);font-style:italic;}
.uw-vz__extra::before{content:" · ";}
.uw-praktisch__leeg{margin:16px 0 0;padding:10px 14px;background:#fff;
  border-left:3px solid var(--accent,#e0a33c);font-size:14px;line-height:1.5;}
.uw-praktisch__tips ul{margin:0;padding-left:20px;}
.uw-praktisch__tips li{font-size:14px;line-height:1.5;margin:0 0 5px;}
.uw-praktisch__bron{margin:18px 0 0;font-size:12.5px;line-height:1.45;
  color:var(--muted,#908a80);}
@media(max-width:600px){
  .uw-praktisch{padding:18px 16px;}
  .uw-vz{grid-template-columns:1fr;}
}

/* Schematisch knooppuntbordje bij het vertrekpunt. */
.uw-startbord{display:flex;align-items:flex-start;gap:16px;margin:0 0 14px;
  padding:14px 16px;background:#fff;border:1px solid var(--card-border,#d8d3c8);
  border-radius:12px;}
.uw-knpbord{flex:0 0 auto;display:block;}
.uw-startbord__uitleg{margin:0;font-size:14px;line-height:1.5;}
.uw-startbord__noot{display:block;margin-top:6px;font-size:12.5px;
  color:var(--muted,#908a80);}
@media(max-width:520px){
  .uw-startbord{flex-direction:column;align-items:center;text-align:center;}
}
.uw-vz__meer .uw-vz__naam{font-weight:600;color:var(--text-body-2,#3a3733);}

/* Noodnummers op de routepagina. Rustig van vorm, maar 112 moet er meteen uitspringen. */
.uw-nood{margin:20px 0 0;padding:16px 18px;background:#fff;
  border:1px solid var(--card-border,#d8d3c8);border-left:4px solid #C4342B;border-radius:12px;}
.uw-nood h3{margin:0 0 10px;font-size:15px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--text-soft,#6b655c);}
.uw-nood__lijst{margin:0;padding:0;list-style:none;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px 22px;}
.uw-nood__item{font-size:14px;line-height:1.4;}
.uw-nood__item a{text-decoration:none;color:inherit;}
.uw-nood__item strong{font-size:17px;}
.uw-nood__item--spoed strong{font-size:22px;color:#C4342B;}
.uw-nood__label{display:block;color:var(--text-body-2,#3a3733);}
.uw-nood__extra{display:block;font-size:12.5px;color:var(--muted,#908a80);}
.uw-nood__locatie{margin:12px 0 0;font-size:13.5px;line-height:1.5;
  color:var(--text-body-2,#3a3733);}
.uw-nood__aed{margin:14px 0 0;padding-top:12px;border-top:1px solid var(--divider,#efebe2);}
.uw-nood__aed h4{margin:0 0 6px;font-size:14px;font-weight:700;}
.uw-nood__aed ul{margin:0;padding:0;list-style:none;}
/* Per AED staat de toegankelijkheid vooraan, want die beslist of je er iets aan hebt.
   De kleur is ondersteunend: de kop zegt het ook in woorden, zodat het zonder kleur
   (of voor wie kleur niet onderscheidt) even duidelijk blijft. Scheidingstekens staan
   in de opmaak zelf en niet in ::before-content, want die overleeft geen kopieeractie. */
.uw-nood__aed li{font-size:13.5px;line-height:1.45;margin:0 0 10px;
  padding-left:10px;border-left:3px solid var(--divider,#efebe2);}
.uw-nood__aed li:last-child{margin-bottom:0;}
.uw-aed__kop{font-weight:700;}
.uw-aed__afstand{color:var(--text-soft,#6b655c);}
.uw-aed__afstand::before{content:"\2002\00B7\2002";}
.uw-aed__tijden{display:block;font-size:12.5px;color:var(--text-body-2,#3a3733);}
.uw-aed__waar{display:block;font-size:12.5px;color:var(--text-body-2,#3a3733);}
.uw-aed__nav{display:inline-block;margin-top:2px;font-size:12.5px;}
.uw-aed--vrij{border-left-color:#2E7D4F;}
.uw-aed--vrij .uw-aed__kop{color:#215C3A;}
.uw-aed--openingstijden{border-left-color:#B8791B;}
.uw-aed--openingstijden .uw-aed__kop{color:#8A5A12;}
.uw-aed--onbekend{border-left-color:#B4ADA2;}
.uw-aed--besloten{border-left-color:#C4342B;}
.uw-aed--besloten .uw-aed__kop{color:#A32A22;}
.uw-nood__aednoot{margin:8px 0 0;font-size:12.5px;line-height:1.5;color:var(--text-body-2,#3a3733);}

/* Geschiktheid van de route zelf — staat bewust vóór de voorzieningen, zodat een badge
   als "rolstoeltoegankelijk" bij een halte niet gelezen wordt als oordeel over de route. */
.uw-geschikt{margin:0 0 18px;padding:14px 16px;background:#fff;
  border:1px solid var(--card-border,#d8d3c8);border-radius:12px;}
.uw-geschikt h3{margin:0 0 8px;}
.uw-geschikt dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:6px 14px;}
/* Het oordeel staat in het zwart bij het label, niet in de gekleurde toelichting:
   daar werd overheen gelezen. Alleen de reden is gedempt. */
.uw-geschikt__label{font-weight:700;font-size:14px;}
.uw-geschikt__oordeel{font-weight:700;}
.uw-geschikt__oordeel--let{color:#A8331F;}
.uw-geschikt__waarde{margin:0;font-size:14px;line-height:1.45;color:var(--text-body-2,#3a3733);}
.uw-geschikt__noot{margin:10px 0 0;font-size:12.5px;line-height:1.45;color:var(--muted,#908a80);}
@media(max-width:520px){ .uw-geschikt dl{grid-template-columns:1fr;gap:2px;} }

/* UitWandelen-logo: het Uit-merk plus het woord, zelfde opbouw als de sitekop
   (script-merk + woord in de sitefont). */
.uw-logo{display:inline-flex;align-items:baseline;gap:9px;text-decoration:none;
  color:inherit;line-height:1;}
.uw-logo:hover{text-decoration:none;}
.uw-logo__merk{height:34px;width:auto;display:block;transform:translateY(4px);}
.uw-logo__woord{font-size:15px;font-weight:600;letter-spacing:.18em;
  text-transform:uppercase;color:var(--text-body-2,#3a3733);}
.uw-merk{margin:0 0 10px;}
@media(max-width:520px){
  .uw-logo__merk{height:28px;}
  .uw-logo__woord{font-size:13px;letter-spacing:.14em;}
}

/* "Wat voor wandeling is dit?" — staat vóór de techniek, want dat is wat je eerst
   wilt weten. */
.uw-sfeer{margin:20px 0 4px;padding:18px 20px;background:var(--alt,#f2f5f7);
  border-radius:14px;}
.uw-sfeer h2{margin:0 0 8px;font-size:20px;}
.uw-sfeer p{margin:0 0 8px;font-size:15.5px;line-height:1.6;}
.uw-sfeer p:last-child{margin-bottom:0;}
.uw-sfeer__kern{font-size:16.5px;}
.uw-sfeer__plekken strong{font-weight:700;}
.uw-sfeer__tegen{color:var(--text-body-2,#3a3733);}

/* ── Mobiele agenda-balk uit op UitWandelen-pagina's ──────────────────────────
   Het thema plakt onderaan mobiel een vaste balk "Open de agenda" (.ug-mobile-cta /
   .ua-mobile-cta). Twee redenen om die hier weg te laten:

   1. Hij is off-topic. Wie een wandelroute leest wil de GPX of de andere routes, niet
      de evenementenagenda.
   2. Hij dekt inhoud af. In de in-app browser van WhatsApp is de layout-viewport hoger
      dan het zichtbare venster, waardoor een `position:fixed` balk middenin beeld landt
      in plaats van onderaan — gemeld met screenshot op 15-08-2026. De balk zelf is
      correct gebouwd (bottom:0 + safe-area-inset); dit is een eigenaardigheid van die
      browsercontext die je met CSS niet betrouwbaar kunt opvangen.

   Deze stylesheet laadt uitsluitend op wandelroute-pagina's (zie Uitwandelen_Map::nodig),
   dus de balk blijft overal elders gewoon staan. De bijbehorende body-padding halen we
   ook weg, anders blijft er een gat van 72px onderaan. */
.ug-mobile-cta,
.ua-mobile-cta{display:none!important;}
body.uitgr,
body.uitams{padding-bottom:0!important;}
