:root{
  --bg:#3a5a40;
  --bg-mobile:#2f4a36;
  --card:#ffffff;
  --nav:#ffffff;
  --border:#2a4a38;
}
body{
  font-family:Arial;
  max-width:1100px;
  margin:auto;
  padding:20px;
  background:var(--bg)!important;
}
nav{
  background:var(--nav)!important;
  padding:12px 16px;
  border-radius:12px;
  margin-bottom:18px;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
  justify-content:space-between;
  box-shadow:0 4px 20px rgba(0,0,0,.3);
  position:sticky;
  top:10px;
  z-index:10;
  border:1px solid var(--border);
}
.nav-left{display:flex;align-items:center;gap:12px;flex-wrap:wrap;flex:1}
.site-logo{height:56px;width:auto;display:block;max-width:200px;object-fit:contain}
.site-logo-link{background:transparent!important;padding:0!important;border:0!important}
nav a.iconbtn{text-decoration:none;color:#222;padding:8px 12px;border-radius:999px;font-size:14px;display:inline-flex;align-items:center;gap:6px;background:#f3f4f6}
nav a.iconbtn:hover{background:#e5e7eb}
.icon{width:20px;height:20px;stroke-width:2;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;display:block}
.quotes-nav{flex:1;display:flex;justify-content:center;align-items:center;min-width:200px}
.quotes-nav > div{margin:0!important;width:100%;text-align:center;justify-content:center}
.middle-row{display:flex;gap:12px;align-items:center;justify-content:center;margin:0 auto 16px auto;max-width:900px}
.searchbox{flex:0 0 360px;background:var(--card);padding:14px;border-radius:12px;border:1px solid var(--border);display:flex;gap:8px;justify-content:center}
.searchbox input{flex:1;padding:12px;border:1px solid #ccc;border-radius:10px;text-align:center}
.searchbox button{padding:12px 18px;background:#111;color:#fff;border:0;border-radius:10px;font-weight:700;cursor:pointer}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;justify-content:center}
.card{background:var(--card);border:1px solid var(--border);border-radius:12px;overflow:hidden;text-decoration:none;color:#000}
.card img{width:100%;height:160px;object-fit:cover;background:#f3f4f6}
.info{padding:10px;text-align:center}
.badge{background:#ff3b30;color:#fff;font-size:11px;font-weight:800;padding:2px 6px;border-radius:999px;margin-left:2px}

/* FIX advertentie pagina badges - ZWART en zichtbaar */
.box .badge, .verkooppanel .badge, p .badge, div .badge:not(nav .badge){
  background:#111 !important;
  color:#fff !important;
  font-size:13px !important;
  font-weight:800 !important;
  padding:7px 14px !important;
  border:2px solid #111 !important;
}
.box .badge:nth-child(2){
  background:#fff !important;
  color:#111 !important;
}
.box .meta{color:#111 !important;font-weight:700 !important}

@media (max-width:700px){
  body{padding:0;background:var(--bg-mobile)!important;font-size:18px}
  nav{border-radius:0;top:0;margin-bottom:0;padding:10px 12px;gap:8px}
  nav a.iconbtn{font-size:16px!important;padding:10px 14px!important}
  .site-logo{height:44px!important;max-width:150px!important}
  .quotes-nav{display:none!important}
  .middle-row{flex-direction:column;max-width:100%;padding:12px;margin:0}
  .searchbox{flex:1 1 100%;width:100%;border-radius:12px;box-sizing:border-box;padding:12px}
  .searchbox input{font-size:18px!important;padding:16px!important}
  .searchbox button{font-size:18px!important;padding:16px 20px!important}
  .grid{padding:12px;grid-template-columns:1fr 1fr;gap:12px}
  .info b{font-size:16px!important}
  .info small{font-size:14px!important}
}