/* ============================================================
   Urban Foods — Waar staan we (marktkalender)
   Zelfde lichte huisstijl als de soeppagina, zelfstandig opgezet:
   deze pagina hangt niet af van de lichte stijllaag.
   ============================================================ */
.uf-markt{
  --room:#F3EEE9; --room2:#E9E1D8; --wit:#FFFFFF;
  --ink:#220D0A; --fg2:#5A4A44; --fg3:#8B7B74;
  --klei:#A73A1C; --klei2:#7E2911; --camel:#BF926B; --petrol:#446A77; --groen:#5A845A;
  --lijn:rgba(34,13,10,.12); --lijn2:rgba(34,13,10,.07);
  --kop:"Neulis Neue","neulis-neue","Outfit",system-ui,sans-serif;
  --tekst:"Museo","Museo Slab","Bitter",Georgia,serif;
  --max:1000px; --r:14px;
  font-family:var(--tekst); color:var(--ink); background:var(--room);
  line-height:1.65; font-size:16px; -webkit-font-smoothing:antialiased;
  /* De pagina staat in een smalle kolom van het thema, met donker ernaast.
     Deze twee regels laten de crème doorlopen tot de schermrand zonder
     iets aan de opbouw van de pagina te veranderen. */
  box-shadow:0 0 0 100vmax var(--room);
  clip-path:inset(0 -100vmax);
  /* Onderaan ruimte als PADDING, niet als marge op het laatste blok: een
     marge van het laatste kind valt samen met die van de houder en verdwijnt
     naar buiten, waardoor het blok tegen de voet plakte. */
  padding-bottom:88px;
}
.uf-markt *,.uf-markt *::before,.uf-markt *::after{box-sizing:border-box}
.uf-markt h1,.uf-markt h2,.uf-markt h3{font-family:var(--kop);font-weight:700;
  line-height:1.12;letter-spacing:-.025em;margin:0;color:var(--ink)}
.uf-markt p{margin:0}
.uf-markt em{font-style:italic;color:var(--klei);font-weight:400}
.uf-markt .wrap{max-width:var(--max);margin:0 auto;padding:0 22px}

.uf-markt .kop{padding:74px 0 30px}
.uf-markt .eyebrow{font-family:var(--kop);font-size:12px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:var(--klei);margin-bottom:14px}
.uf-markt h1{font-size:clamp(34px,4.6vw,54px);margin-bottom:16px}
.uf-markt .lede{font-size:18px;color:var(--fg2);max-width:60ch}

/* Melding dat de gegevens voorlopig zijn — die moet je niet kunnen missen. */
.uf-markt .proef{display:flex;gap:12px;align-items:flex-start;margin:26px 0 0;
  padding:16px 18px;border:1.5px dashed var(--camel);border-radius:var(--r);
  background:rgba(191,146,107,.08);font-size:14.5px;color:var(--fg2)}
.uf-markt .proef b{color:var(--ink);font-family:var(--kop)}

/* Vandaag, groot bovenaan */
.uf-markt .nu{margin:34px 0 0;padding:30px 28px;border-radius:var(--r);
  background:var(--ink);color:#F6EFE9;display:grid;gap:6px}
.uf-markt .nu .lb{font-family:var(--kop);font-size:12px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--camel)}
.uf-markt .nu .plaats{font-family:var(--kop);font-size:clamp(26px,3.6vw,38px);color:#fff}
.uf-markt .nu .detail{color:rgba(246,239,233,.72);font-size:15.5px}
.uf-markt .nu.dicht .plaats{color:rgba(246,239,233,.86);font-size:23px}

/* De lijst als tijdlijn met kaarten ----------------------------
   Zelfde opbouw als de conceptkaarten van de foodtruckboeking: een vierkant
   links, titel met labels, omschrijving eronder en het uur rechts. De lijn
   met bollen erlangs maakt zichtbaar dat het een route door de tijd is. */
.uf-markt .lijst{position:relative;margin:38px 0 0;padding-left:38px}
.uf-markt .lijst::before{content:"";position:absolute;left:13px;top:14px;bottom:14px;
  width:2px;background:linear-gradient(180deg,var(--camel),rgba(191,146,107,.25))}
.uf-markt .rij{position:relative;display:grid;grid-template-columns:74px 1fr auto;
  gap:18px;align-items:center;background:var(--wit);border:1px solid var(--lijn2);
  border-radius:var(--r);padding:14px 18px;margin-bottom:12px;
  transition:border-color 150ms ease,box-shadow 150ms ease,transform 150ms ease}
.uf-markt .rij:hover{border-color:var(--petrol);
  box-shadow:0 0 0 3px rgba(68,106,119,.10);transform:translateY(-1px)}
/* De bol op de lijn */
.uf-markt .rij::before{content:"";position:absolute;left:-31px;top:calc(50% - 6px);
  width:12px;height:12px;border-radius:50%;background:var(--camel);
  box-shadow:0 0 0 4px var(--room)}
.uf-markt .rij.vandaag::before{background:var(--klei);box-shadow:0 0 0 4px var(--room),0 0 0 7px rgba(167,58,28,.18)}
.uf-markt .rij.vandaag{border-color:var(--klei)}
.uf-markt .rij.weg::before{background:var(--fg3)}

/* Het datumvierkant, op de plaats van de foto bij de conceptkaarten */
.uf-markt .datum{display:flex;flex-direction:column;align-items:center;justify-content:center;
  width:74px;height:74px;border-radius:11px;background:var(--ink);color:#F6EFE9;
  font-family:var(--kop);line-height:1.05}
.uf-markt .datum .dagnr{font-size:25px;font-weight:800;letter-spacing:-.02em}
.uf-markt .datum .maand{font-size:11px;font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;color:var(--camel);margin-top:3px}
.uf-markt .datum .dagnaam{font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;
  color:rgba(246,239,233,.5);margin-top:2px}
.uf-markt .rij.vandaag .datum{background:var(--klei)}
.uf-markt .rij.vandaag .datum .maand{color:rgba(255,255,255,.85)}
.uf-markt .rij.weg .datum{background:var(--room2);color:var(--fg3)}
.uf-markt .rij.weg .datum .maand{color:var(--fg3)}

.uf-markt .plek b{font-family:var(--kop);font-size:18px;display:block;margin-bottom:5px}
.uf-markt .tags{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:5px}
.uf-markt .tag{font-family:var(--kop);font-size:10px;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;padding:3px 9px;border-radius:999px}
.uf-markt .tag.markt{background:rgba(90,132,90,.13);color:var(--groen)}
.uf-markt .tag.event{background:rgba(68,106,119,.13);color:var(--petrol)}
.uf-markt .tag.weg{background:rgba(167,58,28,.11);color:var(--klei)}
.uf-markt .tag.gerecht{background:rgba(191,146,107,.16);color:#8A5A38}
.uf-markt .plek span{font-size:14.5px;color:var(--fg2)}
.uf-markt .uren{font-family:var(--kop);font-size:15px;color:var(--ink);white-space:nowrap}
.uf-markt .rij.weg .plek b{text-decoration:line-through;color:var(--fg3)}
.uf-markt .rij.weg .uren{text-decoration:line-through;color:var(--fg3)}
.uf-markt .reden{color:var(--klei)}

.uf-markt .slot{margin:40px 0 0;padding:26px 28px;border:1px solid var(--lijn2);
  border-radius:var(--r);background:var(--wit);display:flex;gap:20px;
  align-items:center;justify-content:space-between;flex-wrap:wrap}
.uf-markt .slot p{font-size:15.5px;color:var(--fg2);max-width:52ch}
.uf-markt .knop{display:inline-flex;align-items:center;gap:9px;padding:14px 24px;
  border-radius:999px;font-family:var(--kop);font-weight:700;font-size:15px;
  text-decoration:none;background:var(--klei);color:#fff;
  transition:background 140ms ease,transform 140ms ease}
.uf-markt .knop:hover{background:var(--petrol);transform:translateY(-1px)}

@media (max-width:720px){
  .uf-markt .kop{padding:48px 0 22px}
  .uf-markt .lijst{padding-left:26px}
  .uf-markt .lijst::before{left:7px}
  .uf-markt .rij{grid-template-columns:56px 1fr;gap:12px;padding:12px 14px}
  .uf-markt .rij::before{left:-25px}
  .uf-markt .datum{width:56px;height:56px}
  .uf-markt .datum .dagnr{font-size:19px}
  .uf-markt .uren{grid-column:2;font-size:14px;color:var(--fg2)}
  .uf-markt .slot{flex-direction:column;align-items:flex-start}
  .uf-markt .knop{width:100%;justify-content:center}
  .uf-markt > *{min-width:0}
}
/* wpautop plakt lege paragrafen tussen blokken. */
.uf-markt > p:empty, .uf-markt .wrap > p:empty{display:none}