/*
Theme Name: Watersportocassion.nl
Theme URI: https://example.com
Author: Watersportocassion.nl
Description: Marktplaats-thema voor tweedehands watersportmateriaal, responsief opgezet (volwaardige homepage op desktop, optimaal bruikbaar op mobiel). Gebruikers kunnen advertenties plaatsen (30 dagen gratis, daarna 2 betaalde pakketten), bieden op boten en contact opnemen met de verkoper.
Version: 2.0
Requires Plugins: woocommerce
Text Domain: watersport-occasions
*/

:root{
  --zeegroen: #1b4b8f;        /* rijk blauw, iets donkerder dan een fel standaardblauw */
  --zeegroen-donker: #0e2c56; /* diepblauw voor verloop, footer, donkere accenten */
  --zeegroen-licht: #e8edf9;  /* lichte tint voor badges/status */
  --zand: #ffffff;            /* paginabachtergrond: wit */
  --zand-donker: #f1f4f7;     /* neutraal lichtgrijs voor placeholders */
  --accent: #a9bfe0;          /* zachte blauwe accenttint */
  --amber: #c9973d;
  --tekst: #17202b;
  --tekst-licht: #5b6b7c;
  --rand: #dde4ec;
  --wit: #ffffff;
  --content-breedte: 1180px;
  --form-breedte: 560px;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  color:var(--tekst);
  background:var(--zand);
  font-size:17px;
  line-height:1.65;
  padding-bottom:calc(64px + env(safe-area-inset-bottom)); /* ruimte voor mobiele bottom-nav */
  letter-spacing:-0.005em;
}
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
.wo-site-main{ display:block; }

/* ---------------------------------------------------
   Site-header (desktop: volledige balk met menu)
--------------------------------------------------- */
.wo-site-header{
  background:var(--wit); border-bottom:1px solid var(--rand);
  position:sticky; top:0; z-index:40;
}
.wo-site-header-inner{
  max-width:var(--content-breedte); margin:0 auto;
  display:flex; align-items:center; justify-content:space-between;
  height:84px; padding:0 24px; gap:24px;
}
.wo-logo{ font-size:23px; font-weight:700; color:var(--zeegroen-donker); display:flex; align-items:center; gap:11px; flex-shrink:0; }
.wo-logo-badge{ display:flex; flex-shrink:0; }
.wo-logo-badge svg{ width:42px; height:42px; }
.wo-logo-tekst .accent{ color:var(--zeegroen); font-weight:500; }
.wo-nav-desktop{ display:none; align-items:center; gap:30px; font-size:15px; font-weight:500; color:var(--tekst); }
.wo-nav-desktop .wo-nav-cta{
  background:var(--zeegroen); color:var(--wit); padding:11px 20px; border-radius:12px; font-weight:600;
}
@media (min-width:860px){
  .wo-nav-desktop{ display:flex; }
}

/* ---------------------------------------------------
   Hero (homepage)
--------------------------------------------------- */
.wo-hero{
  background:linear-gradient(135deg, var(--zeegroen), var(--zeegroen-donker));
  color:var(--wit); padding:64px 20px 48px; text-align:center;
  position:relative; overflow:visible; border-bottom:none;
}
.wo-hero-inner{ max-width:720px; margin:0 auto; }
.wo-hero h1{ font-size:34px; font-weight:800; margin:0 0 16px; color:var(--wit); line-height:1.15; }
.wo-hero p{ font-size:17px; color:var(--zand); opacity:.92; margin:0; }
@media (min-width:900px){
  .wo-hero-inner.wo-hero-split{
    max-width:var(--content-breedte); display:flex; align-items:center; justify-content:space-between; gap:48px; text-align:left;
  }
  .wo-hero-tekst{ flex:1; max-width:520px; }
  .wo-hero-tekst .wo-hero-ctas{ justify-content:flex-start; margin-left:0; }
  .wo-hero-slideshow{ flex-shrink:0; width:440px; margin:0 !important; }
}
@media (min-width:860px){
  .wo-hero{ padding:100px 20px 80px; }
  .wo-hero h1{ font-size:52px; }
  .wo-hero p{ font-size:19px; }
}

/* ---------------------------------------------------
   Algemene content-breedte
--------------------------------------------------- */
.wo-wrap{ max-width:var(--content-breedte); margin:0 auto; padding:0 20px; }
.wo-form-wrap{ max-width:var(--form-breedte); margin:0 auto; padding:24px 20px; }

/* Pagina-titelbalk (mobiel + smalle content-pagina's) */
.wo-topbar{
  display:flex; align-items:center; justify-content:center; height:64px; padding:0 16px;
  background:var(--wit); border-bottom:1px solid var(--rand); position:relative;
}
.wo-topbar a.wo-back{ position:absolute; left:16px; color:var(--zeegroen); }
.wo-topbar h1{ font-size:18px; font-weight:700; color:var(--zeegroen-donker); margin:0; text-align:center; }

/* ---------------------------------------------------
   Mobiele bottom-navigatie (alleen < 860px)
--------------------------------------------------- */
.wo-bottomnav{
  position:fixed; bottom:0; left:0; right:0;
  background:var(--wit); border-top:1px solid var(--rand);
  display:flex; height:calc(64px + env(safe-area-inset-bottom));
  padding-bottom:env(safe-area-inset-bottom);
  z-index:30;
}
.wo-bottomnav a{
  flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:2px; font-size:11px; color:var(--tekst-licht);
}
.wo-bottomnav a.actief{ color:var(--zeegroen); font-weight:600; }
@media (min-width:860px){
  body{ padding-bottom:0; }
  .wo-bottomnav{ display:none; }
}

/* ---------------------------------------------------
   Knoppen & formulieren
--------------------------------------------------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  height:48px; padding:0 20px; border-radius:12px; font-weight:600; font-size:15px;
  border:1px solid transparent; cursor:pointer; width:100%;
}
.btn-primair{ background:var(--zeegroen); color:var(--wit); }
.btn-outline{ background:var(--wit); border-color:var(--zeegroen); color:var(--zeegroen); }
.btn-gevaar{ background:var(--wit); border-color:#fecaca; color:#dc2626; }
.btn-klein{ height:auto; padding:8px 14px; font-size:13px; width:auto; }

input[type=text], input[type=email], input[type=password], input[type=number], select, textarea{
  width:100%; height:48px; padding:0 14px; border:1px solid var(--rand); border-radius:12px;
  font-size:15px; background:var(--wit); color:var(--tekst); font-family:inherit;
}
textarea{ height:auto; padding:12px 14px; }
label{ font-size:13px; font-weight:600; color:var(--tekst-licht); display:block; margin-bottom:4px; }
.veld{ margin-bottom:12px; }

/* ---------------------------------------------------
   Grid met boten (responsief: 2 -> 3 -> 4 -> 5 kolommen)
--------------------------------------------------- */
.wo-grid{ display:grid; grid-template-columns:1fr 1fr; gap:22px; padding:32px 20px; max-width:var(--content-breedte); margin:0 auto; }
@media (min-width:600px){ .wo-grid{ grid-template-columns:repeat(3,1fr); gap:26px; } }
@media (min-width:860px){ .wo-grid{ grid-template-columns:repeat(4,1fr); gap:30px; padding:48px 20px; } }

.wo-kaart{ background:var(--wit); border:1px solid var(--rand); border-radius:18px; overflow:hidden; transition:box-shadow .2s, transform .2s; }
.wo-kaart:hover{ box-shadow:0 12px 32px rgba(11,37,69,.10); transform:translateY(-3px); }
.wo-kaart .wo-foto{ height:170px; background:var(--zand-donker); position:relative; }
@media (min-width:600px){ .wo-kaart .wo-foto{ height:190px; } }
@media (min-width:860px){ .wo-kaart .wo-foto{ height:210px; } }
.wo-kaart .wo-foto img{ width:100%; height:100%; object-fit:cover; }
.wo-badge{
  position:absolute; top:10px; left:10px; background:var(--amber); color:var(--wit);
  font-size:11px; font-weight:700; padding:4px 10px; border-radius:6px;
}
.wo-kaart .wo-info{ padding:16px 18px 20px; }
.wo-kaart h3{ font-size:14.5px; margin:0 0 8px; font-weight:700; color:var(--tekst); line-height:1.35; }
.wo-kaart .wo-prijs{ font-size:17px; font-weight:800; color:var(--zeegroen); }
.wo-kaart .wo-meta-regel{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin-top:10px; }
.wo-kaart .wo-locatie{ font-size:12px; color:var(--tekst-licht); }
.wo-kaart .wo-meta-chip{ font-size:11px; color:var(--tekst-licht); background:var(--zand); padding:2px 8px; border-radius:6px; }
@media (min-width:860px){
  .wo-kaart .wo-info{ padding:20px 22px 24px; }
  .wo-kaart h3{ font-size:16px; }
  .wo-kaart .wo-prijs{ font-size:19px; }
}

/* Filters */
.wo-filters{ display:flex; gap:10px; overflow-x:auto; padding:0 20px 20px; max-width:var(--content-breedte); margin:0 auto; }
.wo-filters a{
  flex-shrink:0; padding:10px 18px; border-radius:999px; font-size:13px; font-weight:600;
  background:var(--wit); border:1.5px solid var(--rand); color:var(--tekst-licht); transition:all .15s;
}
.wo-filters a.actief{ background:var(--zeegroen); border-color:var(--zeegroen); color:var(--wit); }
.wo-filters a:hover:not(.actief){ border-color:var(--zeegroen); color:var(--zeegroen); }

/* Zoekbalk (in hero op desktop, los blok op mobiel) */
.wo-zoek-wrap{ max-width:640px; margin:0 auto; padding:0 20px; position:relative; }
.wo-zoek{
  display:flex; align-items:center; gap:12px; height:60px; padding:0 22px;
  border-radius:999px; background:var(--wit); margin:24px auto 0;
  box-shadow:0 12px 32px rgba(14,44,86,.14); border:1px solid var(--rand);
}
.wo-zoek-icoon{ color:var(--zeegroen); font-size:18px; flex-shrink:0; }
.wo-zoek input{ border:none; height:auto; padding:0; box-shadow:none; font-size:15px; }
.wo-zoek input::placeholder{ color:var(--tekst-licht); }
.wo-zoek-knop{
  flex-shrink:0; height:40px; padding:0 20px; border-radius:999px; background:var(--zeegroen);
  color:var(--wit); font-size:13.5px; font-weight:600; border:none; cursor:pointer;
}

/* ---------------------------------------------------
   Detailpagina
--------------------------------------------------- */
.wo-detail-wrap{ max-width:900px; margin:0 auto; padding:0 20px 40px; }
.wo-detail-foto{ height:260px; background:var(--zand-donker); border-radius:18px; overflow:hidden; margin-top:20px; }
@media (min-width:860px){ .wo-detail-foto{ height:400px; } }
.wo-detail-foto img{ width:100%; height:100%; object-fit:cover; }
.wo-detail-body{ padding:20px 0; }
.wo-detail-body h2{ font-size:20px; margin:0 0 4px; color:var(--zeegroen-donker); }
.wo-detail-prijs{ font-size:24px; font-weight:800; color:var(--zeegroen); margin-bottom:10px; }
.wo-meta-rij{ display:flex; flex-wrap:wrap; gap:14px; font-size:13px; color:var(--tekst-licht); margin-bottom:16px; }
.wo-verkoper-box{ border:1px solid var(--rand); border-radius:12px; padding:14px; margin:16px 0; background:var(--wit); max-width:420px; }
.wo-verkoper-box .naam{ font-weight:600; color:var(--zeegroen-donker); font-size:14px; }
.wo-verkoper-box .label{ font-size:11px; color:var(--tekst-licht); }
.wo-detail-acties{ max-width:420px; }

/* ---------------------------------------------------
   Advertenties-lijst (dashboard)
--------------------------------------------------- */
.wo-ad-rij{ display:flex; gap:12px; background:var(--wit); border:1px solid var(--rand); border-radius:18px; padding:12px; margin-bottom:8px; }
.wo-ad-rij .wo-thumb{ width:64px; height:64px; border-radius:6px; background:var(--zand-donker); flex-shrink:0; }
.wo-status{ display:inline-block; font-size:11px; padding:2px 6px; border-radius:4px; }
.wo-status.actief{ background:var(--zeegroen-licht); color:var(--zeegroen); }
.wo-status.verlopen{ background:#f1f5f4; color:var(--tekst-licht); }
.wo-ad-acties{ display:flex; gap:14px; padding:0 4px 12px; font-size:13px; font-weight:600; color:var(--zeegroen); }

/* Pakketkaarten */
.wo-pakket{
  display:flex; justify-content:space-between; align-items:center; width:100%;
  border:1px solid var(--rand); background:var(--wit); border-radius:18px; padding:16px; margin-bottom:12px; text-align:left;
}
.wo-pakket .naam{ font-weight:700; font-size:15px; color:var(--zeegroen-donker); }
.wo-pakket .details{ font-size:12.5px; color:var(--tekst-licht); margin-top:2px; }
.wo-pakket .prijs{ font-weight:700; font-size:15px; color:var(--zeegroen-donker); }

/* ---------------------------------------------------
   Footer (volle breedte)
--------------------------------------------------- */
.wo-footer{ background:var(--zand); border-top:1px solid var(--rand); color:var(--tekst); padding:48px 20px 32px; font-size:13.5px; margin-top:24px; text-align:center; }
.wo-footer-inner{ max-width:var(--content-breedte); margin:0 auto; display:flex; flex-direction:column; align-items:center; }
.wo-footer h4{ color:var(--zeegroen-donker); font-size:15px; margin:0 0 10px; }
.wo-footer p{ color:var(--tekst-licht); opacity:1; max-width:600px; margin-left:auto; margin-right:auto; }
.wo-footer-grid{ display:grid; grid-template-columns:1fr 1fr; gap:32px; margin:28px 0; max-width:480px; text-align:left; }
@media (min-width:860px){ .wo-footer-grid{ grid-template-columns:repeat(4,auto); max-width:none; justify-content:center; } }
.wo-footer-grid ul{ list-style:none; padding:0; margin:0; }
.wo-footer-grid li{ margin-bottom:8px; }
.wo-footer-grid a{ color:var(--zeegroen); opacity:.9; }
.wo-footer .btn{ max-width:300px; margin:0 auto; }
.wo-footer .copyright{ border-top:1px solid var(--rand); padding-top:16px; margin-top:24px; color:var(--tekst-licht); opacity:.75; font-size:11.5px; width:100%; }

/* Meldingen */
.wo-melding{ border-radius:12px; padding:12px 14px; font-size:13.5px; margin-bottom:12px; }
.wo-melding.succes{ background:var(--zeegroen-licht); border:1px solid #a7f3d0; color:#065f46; }
.wo-melding.fout{ background:#fef2f2; border:1px solid #fecaca; color:#b91c1c; }

/* Lege staat */
.wo-leeg{ text-align:center; padding:60px 20px; color:var(--tekst-licht); font-size:13.5px; grid-column:1/-1; }

/* ---------------------------------------------------
   Typografie-verfijning
--------------------------------------------------- */
/* Lettertype wordt geladen via functions.php (wp_enqueue_style + preconnect) i.p.v. @import, voor snelheid */
h1, h2, h3, .wo-logo{ font-family:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; font-weight:700; letter-spacing:-0.02em; }

/* Hero CTA's */
.wo-hero-ctas{ display:flex; flex-direction:column; gap:10px; margin-top:22px; max-width:320px; margin-left:auto; margin-right:auto; }
.btn-hero-primair{ background:var(--wit); color:var(--zeegroen-donker); font-weight:700; }
.btn-hero-outline{ background:rgba(255,255,255,.12); border:1.5px solid rgba(255,255,255,.5); color:var(--wit); }
@media (min-width:600px){
  .wo-hero-ctas{ flex-direction:row; max-width:none; }
  .wo-hero-ctas .btn{ width:auto; padding:0 28px; }
}

/* ---------------------------------------------------
   Categorie-snelkoppelingen
--------------------------------------------------- */
.wo-categorieen{ background:var(--wit); border-bottom:1px solid var(--rand); }
.wo-categorieen-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:14px; padding:28px 20px; }
@media (min-width:480px){ .wo-categorieen-grid{ grid-template-columns:repeat(3,1fr); } }
@media (min-width:860px){ .wo-categorieen-grid{ grid-template-columns:repeat(5,1fr); } }
.wo-categorie-kaart{
  display:flex; flex-direction:column; align-items:center; gap:8px;
  padding:22px 10px; border-radius:18px; background:var(--zand);
  font-size:12.5px; font-weight:600; color:var(--zeegroen-donker); text-align:center;
  transition:background .2s, transform .2s;
}
.wo-categorie-kaart:hover{ background:var(--zeegroen-licht); transform:translateY(-2px); }
.wo-categorie-icoon{ font-size:28px; }

/* ---------------------------------------------------
   Secties: titel + generieke sectie-padding
--------------------------------------------------- */
.wo-sectie-titel{ font-size:22px; text-align:center; color:var(--zeegroen-donker); margin:0 0 36px; }
@media (min-width:860px){ .wo-sectie-titel{ font-size:30px; margin:0 0 48px; } }
.wo-voordelen, .wo-stappen{ padding:56px 0; text-align:center; }
.wo-testimonials{ padding:56px 0; background:var(--zand-donker); text-align:center; }
@media (min-width:860px){ .wo-voordelen, .wo-stappen, .wo-testimonials{ padding:80px 0; } }

/* Voordelen */
.wo-voordelen-grid{ display:grid; grid-template-columns:1fr; gap:20px; }
@media (min-width:700px){ .wo-voordelen-grid{ grid-template-columns:repeat(3,1fr); gap:24px; } }
.wo-voordeel-kaart{ background:var(--wit); border:1px solid var(--rand); border-radius:20px; padding:32px 24px; text-align:center; }
.wo-voordeel-icoon{ font-size:32px; display:block; margin-bottom:14px; }
.wo-voordeel-kaart h3{ font-size:16px; margin:0 0 8px; color:var(--zeegroen-donker); }
.wo-voordeel-kaart p{ font-size:13.5px; color:var(--tekst-licht); margin:0; line-height:1.6; }

/* Stappen */
.wo-stappen-grid{ display:grid; grid-template-columns:1fr 1fr; gap:28px; }
@media (min-width:700px){ .wo-stappen-grid{ grid-template-columns:repeat(5,1fr); gap:24px; } }
.wo-stap{ text-align:center; }
.wo-stap-nummer{
  display:inline-flex; align-items:center; justify-content:center;
  width:38px; height:38px; border-radius:50%; background:var(--zeegroen); color:var(--wit);
  font-weight:700; font-size:15px; margin-bottom:12px;
}
.wo-stap h3{ font-size:14px; margin:0 0 5px; color:var(--zeegroen-donker); }
.wo-stap p{ font-size:12.5px; color:var(--tekst-licht); margin:0; line-height:1.5; }

/* Testimonials */
.wo-testimonials-grid{ display:grid; grid-template-columns:1fr; gap:20px; }
@media (min-width:700px){ .wo-testimonials-grid{ grid-template-columns:repeat(3,1fr); gap:24px; } }
.wo-testimonial{ background:var(--wit); border-radius:20px; padding:28px 24px; margin:0; border:1px solid var(--rand); text-align:left; }
.wo-testimonial p{ font-size:14px; color:var(--tekst); line-height:1.65; margin:0 0 14px; font-style:italic; }
.wo-testimonial cite{ font-size:12.5px; font-weight:600; color:var(--zeegroen); font-style:normal; }

/* CTA-band onderaan */
.wo-cta-band{ background:var(--zand); border-top:1px solid var(--rand); border-bottom:1px solid var(--rand); padding:52px 0; text-align:center; }
.wo-cta-band-inner{ display:flex; flex-direction:column; gap:20px; align-items:center; text-align:center; max-width:560px; margin:0 auto; }
.wo-cta-band-inner h2{ color:var(--zeegroen-donker); font-size:24px; margin:0 0 6px; }
.wo-cta-band-inner p{ color:var(--tekst-licht); font-size:15px; margin:0; }
.btn-cta-band{ background:var(--zeegroen); color:var(--wit); font-weight:700; width:100%; }
@media (min-width:700px){
  .btn-cta-band{ width:auto; padding:0 32px; }
}

/* ---------------------------------------------------
   Detailpagina 2.0: breadcrumbs, galerij, zijbalk
--------------------------------------------------- */
body.single-boot{ background:#f7f9fb; }

.wo-breadcrumbs{ background:#f7f9fb; border-bottom:1px solid var(--rand); padding:16px 0; font-size:13px; color:var(--tekst-licht); }
.wo-breadcrumbs a{ color:var(--tekst-licht); }
.wo-breadcrumbs a:hover{ color:var(--zeegroen); }
.wo-breadcrumbs span{ margin:0 6px; opacity:.5; }
.wo-breadcrumbs strong{ color:var(--tekst); font-weight:600; }

.wo-detail-grid{ display:grid; grid-template-columns:1fr; gap:24px; padding:24px 20px 60px; }
@media (min-width:960px){ .wo-detail-grid{ grid-template-columns:1fr 360px; gap:32px; align-items:start; } }

.wo-terug-link{ display:inline-block; font-size:13.5px; color:var(--zeegroen); margin-bottom:16px; font-weight:600; }

.wo-galerij-hoofd{ background:var(--zand-donker); border-radius:20px; overflow:hidden; height:320px; }
@media (min-width:600px){ .wo-galerij-hoofd{ height:440px; } }
.wo-galerij-hoofd img{ width:100%; height:100%; object-fit:cover; }
.wo-galerij-thumbs{ display:flex; gap:8px; overflow-x:auto; margin-top:10px; padding-bottom:4px; }
.wo-thumb-knop{ flex-shrink:0; width:68px; height:68px; border-radius:10px; object-fit:cover; border:2px solid transparent; cursor:pointer; }
.wo-thumb-knop.actief{ border-color:var(--zeegroen); }

.wo-detail-omschrijving{ background:var(--wit); border:1px solid var(--rand); border-radius:18px; padding:24px; margin-top:24px; }
.wo-detail-omschrijving h2{ font-size:17px; margin:0 0 12px; color:var(--zeegroen-donker); }
.wo-detail-omschrijving p{ color:var(--tekst); line-height:1.65; font-size:14px; }

.wo-sidebar-card{ background:var(--wit); border:1px solid var(--rand); border-radius:18px; padding:22px; margin-bottom:16px; }
.wo-sidebar-kop{ font-size:14px; margin:0 0 14px; color:var(--zeegroen-donker); }
.wo-detail-titel{ font-size:19px; margin:0 0 10px; color:var(--tekst); line-height:1.35; }
.wo-detail-prijs{ font-size:24px; font-weight:800; color:var(--zeegroen); margin-bottom:12px; }
.wo-sidebar-card .wo-meta-rij{ display:flex; flex-wrap:wrap; gap:10px; font-size:13px; color:var(--tekst-licht); margin-bottom:8px; align-items:center; }
.wo-categorie-chip{ background:var(--zeegroen-licht); color:var(--zeegroen); font-size:11.5px; font-weight:600; padding:3px 10px; border-radius:999px; }

.wo-verkoper-rij{ display:flex; align-items:center; gap:12px; }
.wo-verkoper-avatar{ width:40px; height:40px; border-radius:50%; background:var(--zeegroen-licht); display:flex; align-items:center; justify-content:center; font-size:18px; }
.wo-verkoper-naam{ font-weight:600; color:var(--tekst); font-size:14.5px; }

.wo-login-hint{ text-align:center; font-size:12px; color:var(--tekst-licht); margin-top:12px; }

/* ---------------------------------------------------
   Badges & favoriet-knop op kaarten
--------------------------------------------------- */
.wo-badge-premium{ background:#7c3aed; }
.wo-badge-top{ background:var(--amber); }
.wo-favoriet{
  position:absolute; top:8px; right:8px; width:28px; height:28px; border-radius:50%;
  background:rgba(255,255,255,.9); display:flex; align-items:center; justify-content:center;
  font-size:14px; color:var(--tekst-licht);
}

/* ---------------------------------------------------
   Hero met golfvorm onderaan
--------------------------------------------------- */
.wo-hero{ position:relative; overflow:visible; }
.wo-hero-golf{ position:absolute; bottom:-1px; left:0; width:100%; line-height:0; }
.wo-hero-golf svg{ width:100%; height:40px; display:block; }
@media (min-width:860px){ .wo-hero-golf svg{ height:64px; } }

.wo-hero-app{ display:inline-flex; align-items:center; gap:10px; margin-top:18px; }
.wo-app-badge{ background:#000; color:#fff; font-size:11px; border-radius:8px; padding:6px 12px; display:inline-block; }
.wo-app-badge small{ display:block; font-size:8.5px; opacity:.8; }
.wo-hero-app span{ font-size:12.5px; color:var(--tekst-licht); }

/* ---------------------------------------------------
   CTA-kaart (ingesloten in plaats van volle breedte)
--------------------------------------------------- */
.wo-cta-band{ background:transparent; border:none; padding:20px; }
.wo-cta-kaart{
  background:linear-gradient(135deg, var(--zeegroen), var(--zeegroen-donker));
  border-radius:24px; padding:48px 24px; text-align:center; max-width:var(--content-breedte); margin:0 auto;
}
.wo-cta-kaart h2{ color:var(--wit); font-size:24px; margin:0 0 8px; }
.wo-cta-kaart p{ color:var(--zand); opacity:.9; font-size:15px; margin:0 0 24px; }
.wo-cta-knoppen{ display:flex; flex-direction:column; gap:10px; max-width:340px; margin:0 auto; }
@media (min-width:600px){ .wo-cta-knoppen{ flex-direction:row; justify-content:center; max-width:none; } .wo-cta-knoppen .btn{ width:auto; padding:0 28px; } }
.btn-cta-wit{ background:var(--wit); color:var(--zeegroen-donker); font-weight:700; }
.btn-cta-outline{ background:transparent; border:1.5px solid rgba(255,255,255,.4); color:var(--wit); }

/* ---------------------------------------------------
   Footer 2.0: donker, meerdere kolommen
--------------------------------------------------- */
.wo-footer{ background:var(--zeegroen-donker); border-top:none; color:var(--zand); padding:56px 20px 28px; font-size:14.5px; margin-top:32px; text-align:left; }
.wo-footer-top{ display:grid; grid-template-columns:1fr; gap:32px; max-width:var(--content-breedte); margin:0 auto 32px; }
@media (min-width:860px){ .wo-footer-top{ grid-template-columns:1.2fr 0.8fr 0.8fr 1fr 0.9fr; gap:24px; } }
.wo-footer-logo{ display:flex; align-items:center; gap:8px; font-size:17px; font-weight:700; color:var(--wit); margin-bottom:10px; }
.wo-footer-logo .accent{ color:var(--accent); }
.wo-footer-top p{ color:var(--accent); opacity:.9; font-size:13px; max-width:280px; margin:0; }
.wo-footer-kolom h4{ color:var(--wit); font-size:14px; margin:0 0 14px; }
.wo-footer-kolom ul{ list-style:none; padding:0; margin:0; }
.wo-footer-kolom li{ margin-bottom:9px; }
.wo-footer-kolom a{ color:var(--accent); opacity:.9; font-size:13px; }
.wo-footer-kolom a:hover{ opacity:1; color:var(--wit); }
.wo-footer-appbox p{ color:var(--accent); opacity:.85; font-size:12.5px; margin:0 0 12px; }
.wo-footer .copyright{ max-width:var(--content-breedte); margin:0 auto; text-align:center; border-top:1px solid rgba(255,255,255,.1); padding-top:20px; color:var(--accent); opacity:.6; }

/* Categorie-kaarten groot (homepage) */
.wo-categorie-kaart-groot{ padding:26px 18px; align-items:flex-start; text-align:left; gap:4px; }
.wo-categorie-kaart-groot .wo-categorie-icoon{ background:var(--zeegroen-licht); width:44px; height:44px; border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:20px; margin-bottom:8px; }
.wo-categorie-titel{ font-size:15px; font-weight:700; color:var(--zeegroen-donker); }
.wo-categorie-sub{ font-size:12px; font-weight:400; color:var(--tekst-licht); }

/* Uitgelicht-kop boven het aanbod */
.wo-uitgelicht-kop{ text-align:center; margin-bottom:8px; }
.wo-uitgelicht-label{ color:var(--amber); font-weight:700; font-size:12.5px; display:inline-flex; align-items:center; gap:4px; margin-bottom:4px; }
.wo-uitgelicht-kop h2{ font-size:22px; color:var(--zeegroen-donker); margin:4px 0 0; }
@media (min-width:860px){ .wo-uitgelicht-kop h2{ font-size:28px; } }

/* Vergelijkingstabel (over-ons pagina) */
.wo-vergelijk-tabel{ width:100%; border-collapse:collapse; background:var(--wit); border-radius:16px; overflow:hidden; min-width:480px; }
.wo-vergelijk-tabel th, .wo-vergelijk-tabel td{ padding:14px 16px; text-align:center; border-bottom:1px solid var(--rand); font-size:13.5px; }
.wo-vergelijk-tabel th:first-child, .wo-vergelijk-tabel td:first-child{ text-align:left; color:var(--tekst-licht); font-weight:500; }
.wo-vergelijk-tabel thead th{ background:var(--zeegroen-licht); color:var(--zeegroen-donker); font-weight:700; }
.wo-vergelijk-tabel tbody tr:last-child td{ border-bottom:none; }

/* ---------------------------------------------------
   Uitgebreid formulier: secties, rijen, uploadvak
--------------------------------------------------- */
.wo-form-sectie{ background:var(--wit); border:1px solid var(--rand); border-radius:18px; padding:28px; margin-bottom:24px; }
.wo-form-sectie .veld{ margin-bottom:16px; }
.wo-form-koptekst{ font-size:15.5px; margin:0 0 6px; color:var(--zeegroen-donker); }
.wo-form-hint{ font-size:12.5px; color:var(--tekst-licht); margin:0 0 14px; }
.wo-veld-rij{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:4px; }
.wo-veld-rij-3{ grid-template-columns:1fr; }
@media (min-width:600px){ .wo-veld-rij-3{ grid-template-columns:1fr 1fr 1fr; } }
.wo-foto-upload-vak{
  width:120px; height:120px; border:1.5px dashed var(--rand); border-radius:14px; background:var(--zand);
  display:flex; flex-direction:column; align-items:center; justify-content:center; cursor:pointer;
}

/* ---------------------------------------------------
   Pakketkaarten (nieuwe stijl met kenmerkenlijst)
--------------------------------------------------- */
.wo-limiet-melding{ background:#fff7ed; border:1px solid #fed7aa; border-radius:14px; padding:16px 18px; margin-bottom:20px; font-size:13.5px; color:#9a3412; }
.wo-limiet-melding strong{ display:block; margin-bottom:4px; }
.wo-limiet-melding p{ margin:0; }

.wo-pakketten-grid{ display:grid; grid-template-columns:1fr; gap:20px; align-items:stretch; }
@media (min-width:700px){ .wo-pakketten-grid{ grid-template-columns:repeat(3,1fr); } }
.wo-pakket-kaart{
  position:relative; background:var(--wit); border:1.5px solid var(--rand); border-radius:20px;
  padding:30px 24px; text-align:center; display:flex; flex-direction:column; align-items:center; transition:transform .2s;
}
.wo-pakket-populair{
  border-color:var(--zeegroen); box-shadow:0 10px 30px rgba(19,64,116,.16);
  animation:wo-nudge 2.8s ease-in-out infinite;
}
.wo-pakket-populair:hover{ animation-play-state:paused; }
@keyframes wo-nudge{
  0%, 100% { transform:scale(1) translateY(0); box-shadow:0 10px 30px rgba(19,64,116,.16); }
  50% { transform:scale(1.03) translateY(-4px); box-shadow:0 20px 44px rgba(19,64,116,.26); }
}
.wo-pakket-badge{
  position:absolute; top:-12px; left:50%; transform:translateX(-50%);
  background:var(--zeegroen); color:var(--wit); font-size:11.5px; font-weight:700; padding:5px 16px; border-radius:999px;
  box-shadow:0 4px 12px rgba(19,64,116,.35);
}
.wo-pakket-badge-grijs{ background:var(--tekst-licht); box-shadow:none; }
.wo-pakket-uitgeschakeld{ opacity:.55; animation:none; }
.wo-pakket-icoon{ font-size:26px; margin-bottom:8px; }
.wo-pakket-naam{ font-size:15.5px; font-weight:700; color:var(--zeegroen-donker); margin-bottom:6px; }
.wo-pakket-prijs-groot{ font-size:26px; font-weight:800; color:var(--tekst); margin-bottom:16px; }
.wo-pakket-prijs-groot span{ font-size:12px; font-weight:400; color:var(--tekst-licht); }
.wo-pakket-kenmerken{ list-style:none; padding:0; margin:0 0 20px; text-align:left; width:100%; }
.wo-pakket-kenmerken li{ font-size:13px; color:var(--tekst); padding:5px 0; }
.wo-pakket-kaart .btn{ margin-top:auto; }

/* ---------------------------------------------------
   Dashboard 2.0: tabbladen, kaarten, badges, menu
--------------------------------------------------- */
.wo-tabbladen{ display:flex; gap:8px; margin-bottom:20px; overflow-x:auto; }
.wo-tabbladen a{ flex-shrink:0; padding:9px 18px; border-radius:10px; font-size:13.5px; font-weight:600; background:var(--wit); border:1.5px solid var(--rand); color:var(--tekst-licht); }
.wo-tabbladen a.actief{ background:var(--zeegroen); border-color:var(--zeegroen); color:var(--wit); }

.wo-ad-kaart{ display:flex; gap:14px; background:var(--wit); border:1px solid var(--rand); border-radius:16px; padding:16px; margin-bottom:14px; }
.wo-ad-thumb{ width:88px; height:88px; border-radius:10px; background:var(--zand-donker); flex-shrink:0; display:flex; align-items:center; justify-content:center; font-size:22px; overflow:hidden; }
.wo-ad-inhoud{ flex:1; min-width:0; }
.wo-ad-titelrij{ display:flex; justify-content:space-between; align-items:flex-start; gap:8px; }
.wo-ad-titelrij h3{ font-size:15px; margin:0; color:var(--tekst); line-height:1.35; }

.wo-ad-menu{ position:relative; }
.wo-ad-menu-knop{ background:none; border:none; font-size:18px; color:var(--tekst-licht); cursor:pointer; padding:2px 8px; }
.wo-ad-menu-lijst{ display:none; position:absolute; right:0; top:26px; background:var(--wit); border:1px solid var(--rand); border-radius:10px; box-shadow:0 8px 24px rgba(0,0,0,.1); min-width:180px; z-index:10; overflow:hidden; }
.wo-ad-menu-lijst.open{ display:block; }
.wo-ad-menu-lijst a{ display:block; padding:10px 14px; font-size:13px; color:var(--tekst); border-bottom:1px solid var(--rand); }
.wo-ad-menu-lijst a:last-child{ border-bottom:none; }
.wo-ad-menu-lijst a.wo-verwijder-link{ color:#dc2626; }
.wo-ad-menu-lijst a:hover{ background:var(--zand); }

.wo-ad-badges{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:8px 0; }
.wo-status.verkocht{ background:#fee2e2; color:#b91c1c; }
.wo-status.concept{ background:#f1f5f4; color:var(--tekst-licht); }
.wo-badge-pakket{ font-size:11px; font-weight:600; padding:2px 8px; border-radius:4px; background:var(--zeegroen-licht); color:var(--zeegroen); }
.wo-ad-datum{ font-size:11.5px; color:var(--tekst-licht); }

.wo-ad-onderrij{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; margin-top:6px; }
.wo-ad-prijsweergave{ display:flex; align-items:center; gap:14px; }
.wo-ad-prijsweergave .wo-prijs{ font-size:16px; font-weight:700; color:var(--zeegroen); }

.wo-upgrade-knoppen{ display:flex; flex-wrap:wrap; gap:8px; }
.wo-upgrade-knop{
  font-size:11.5px; font-weight:600; padding:6px 12px; border-radius:999px;
  background:var(--zeegroen-licht); color:var(--zeegroen); white-space:nowrap;
}
.wo-upgrade-knop-premium{ background:#fef3c7; color:#92400e; }

/* ---------------------------------------------------
   Dropdown-menu 'Boten' in header
--------------------------------------------------- */
.wo-nav-dropdown{ position:relative; padding-bottom:12px; margin-bottom:-12px; }
.wo-nav-pijl{ font-size:10px; opacity:.6; }
.wo-nav-dropdown-paneel{
  display:none; position:absolute; top:100%; left:50%; transform:translateX(-50%);
  background:var(--wit); border:1px solid var(--rand); border-radius:14px; box-shadow:0 16px 40px rgba(0,0,0,.12);
  padding:20px; gap:28px; min-width:420px; z-index:50; margin-top:0;
}
.wo-nav-dropdown:hover .wo-nav-dropdown-paneel,
.wo-nav-dropdown-paneel:hover{ display:flex; }
.wo-nav-dropdown-kolom{ display:flex; flex-direction:column; gap:6px; min-width:150px; }
.wo-nav-dropdown-kop{ font-weight:700; color:var(--zeegroen-donker); font-size:13.5px; margin-bottom:4px; }
.wo-nav-dropdown-kolom a{ font-size:12.5px; color:var(--tekst-licht); padding:3px 0; }
.wo-nav-dropdown-kolom a:hover{ color:var(--zeegroen); }

/* Dashboard iets luchtiger en met groter lettertype */
.wo-ad-kaart{ padding:20px; gap:18px; margin-bottom:18px; }
.wo-ad-thumb{ width:96px; height:96px; }
.wo-ad-titelrij h3{ font-size:16.5px; }
.wo-ad-prijsweergave .wo-prijs{ font-size:18px; }
.wo-ad-datum{ font-size:12.5px; }
.wo-badge-pakket{ font-size:12px; padding:3px 10px; }
.wo-upgrade-knop{ font-size:12.5px; padding:7px 14px; }
.wo-tabbladen a{ font-size:14.5px; padding:10px 20px; }

/* Fotopreview met verwijderknoppen */
.wo-foto-preview-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(84px,1fr)); gap:10px; margin-top:12px; }
.wo-foto-preview-item{ position:relative; width:100%; aspect-ratio:1; border-radius:10px; overflow:hidden; border:1px solid var(--rand); }
.wo-foto-preview-item img{ width:100%; height:100%; object-fit:cover; }
.wo-foto-preview-verwijder{
  position:absolute; top:4px; right:4px; width:22px; height:22px; border-radius:50%;
  background:rgba(0,0,0,.65); color:#fff; border:none; font-size:14px; line-height:1; cursor:pointer;
}

/* ---------------------------------------------------
   Hero-slideshow met recent geplaatste advertenties
--------------------------------------------------- */
.wo-hero-slideshow{ position:relative; max-width:680px; margin:32px auto 0; border-radius:20px; overflow:hidden; box-shadow:0 20px 50px rgba(0,0,0,.25); }
.wo-slide{ display:none; position:relative; height:220px; }
.wo-slide.actief{ display:block; }
.wo-slide img{ width:100%; height:100%; object-fit:cover; }
.wo-slide-placeholder{ width:100%; height:100%; display:flex; align-items:center; justify-content:center; font-size:40px; background:var(--zand-donker); color:var(--accent); }
.wo-slide-titel{
  position:absolute; left:0; right:0; bottom:0; padding:16px; text-align:left;
  background:linear-gradient(0deg, rgba(0,0,0,.7), transparent); color:#fff; font-size:14.5px; font-weight:600;
}
@media (min-width:860px){ .wo-slide{ height:300px; } }
.wo-slide-dots{ position:absolute; bottom:10px; right:14px; display:flex; gap:6px; }
.wo-slide-dot{ width:7px; height:7px; border-radius:50%; background:rgba(255,255,255,.5); }
.wo-slide-dot.actief{ background:#fff; }

/* Placeholder-icoon voor kaarten zonder foto */
.wo-foto-placeholder{ width:100%; height:100%; display:flex; align-items:center; justify-content:center; font-size:28px; color:var(--accent); background:var(--zand-donker); }

/* ---------------------------------------------------
   Categoriepagina (taxonomy-boot_type.php)
--------------------------------------------------- */
.wo-categorie-grid{ display:grid; grid-template-columns:1fr; gap:24px; padding:28px 20px 60px; }
@media (min-width:900px){ .wo-categorie-grid{ grid-template-columns:260px 1fr; align-items:start; } }
.wo-categorie-lijst{ list-style:none; margin:0; padding:0; }
.wo-categorie-lijst > li{ margin-bottom:4px; }
.wo-categorie-lijst > li > a{ display:block; padding:9px 10px; border-radius:8px; font-weight:600; font-size:13.5px; color:var(--tekst); }
.wo-categorie-lijst > li > a.actief{ background:var(--zeegroen-licht); color:var(--zeegroen); }
.wo-categorie-sublijst{ list-style:none; margin:2px 0 8px; padding-left:14px; border-left:2px solid var(--rand); }
.wo-categorie-sublijst a{ display:block; padding:6px 10px; font-size:13px; color:var(--tekst-licht); border-radius:6px; }
.wo-categorie-sublijst a.actief{ color:var(--zeegroen); font-weight:700; background:var(--zeegroen-licht); }
.wo-categorie-sublijst a:hover{ color:var(--zeegroen); }

.wo-categorie-titel{ font-size:24px; color:var(--zeegroen-donker); margin:0 0 8px; }
.wo-categorie-omschrijving{ font-size:14px; color:var(--tekst-licht); margin:0 0 20px; }
.wo-categorie-zoekbalk{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:14px; }
.wo-categorie-zoek-input{ flex:1; min-width:220px; display:flex; align-items:center; gap:8px; height:46px; padding:0 16px; border:1px solid var(--rand); border-radius:10px; background:var(--wit); }
.wo-categorie-zoek-input input{ border:none; height:auto; padding:0; }
.wo-categorie-sort{ height:46px; padding:0 14px; border-radius:10px; border:1px solid var(--rand); background:var(--wit); font-size:13.5px; }
.wo-categorie-telling{ font-size:13px; color:var(--tekst-licht); margin:0 0 16px; }
@media (min-width:600px){ .wo-categorie-grid .wo-grid{ grid-template-columns:repeat(3,1fr) !important; } }

/* Zoekicoon met uitklapbaar zoekveld in header */
.wo-nav-zoek{ position:relative; }
.wo-nav-zoek-knop{ background:none; border:none; font-size:16px; cursor:pointer; color:var(--tekst); padding:4px; }
.wo-nav-zoek-paneel{
  display:none; position:absolute; top:100%; right:0; margin-top:14px; background:var(--wit);
  border:1px solid var(--rand); border-radius:12px; box-shadow:0 14px 34px rgba(0,0,0,.14); padding:10px; z-index:50;
}
.wo-nav-zoek-paneel.open{ display:block; }
.wo-nav-zoek-paneel input{ width:260px; height:42px; padding:0 12px; border:1px solid var(--rand); border-radius:8px; font-size:14px; }

/* ---------------------------------------------------
   WooCommerce "Mijn account" / winkelmandje / afrekenen in themastijl
--------------------------------------------------- */
.woocommerce-account .woocommerce,
.woocommerce-cart .woocommerce,
.woocommerce-checkout .woocommerce{
  max-width:var(--content-breedte); margin:0 auto; padding:32px 20px 60px;
  display:flex; flex-direction:column; gap:24px;
}
@media (min-width:800px){
  .woocommerce-account .woocommerce{ flex-direction:row; align-items:flex-start; }
}
.woocommerce-MyAccount-navigation{ flex-shrink:0; width:100%; }
@media (min-width:800px){ .woocommerce-MyAccount-navigation{ width:230px; } }
.woocommerce-MyAccount-navigation ul{ list-style:none; margin:0; padding:0; background:var(--wit); border:1px solid var(--rand); border-radius:16px; overflow:hidden; }
.woocommerce-MyAccount-navigation li{ border-bottom:1px solid var(--rand); }
.woocommerce-MyAccount-navigation li:last-child{ border-bottom:none; }
.woocommerce-MyAccount-navigation li a{ display:block; padding:13px 18px; color:var(--tekst); font-size:14px; font-weight:600; }
.woocommerce-MyAccount-navigation li.is-active a{ background:var(--zeegroen-licht); color:var(--zeegroen); }
.woocommerce-MyAccount-navigation li a:hover{ background:var(--zand); }

.woocommerce-MyAccount-content{ flex:1; min-width:0; background:var(--wit); border:1px solid var(--rand); border-radius:16px; padding:28px; }
.woocommerce-MyAccount-content p{ color:var(--tekst); line-height:1.7; font-size:14.5px; }
.woocommerce-MyAccount-content mark{ background:none; color:var(--zeegroen); font-weight:700; }
.woocommerce-MyAccount-content .button{
  display:inline-flex; align-items:center; justify-content:center; height:44px; padding:0 20px;
  border-radius:10px; font-weight:600; font-size:14px; background:var(--zeegroen); color:var(--wit) !important;
  border:none; text-decoration:none;
}
.woocommerce-MyAccount-content table{ width:100%; border-collapse:collapse; }
.woocommerce-MyAccount-content th, .woocommerce-MyAccount-content td{ padding:12px 10px; border-bottom:1px solid var(--rand); font-size:13.5px; text-align:left; }
.woocommerce-MyAccount-content fieldset{ border:1px solid var(--rand); border-radius:12px; padding:16px; margin-bottom:16px; }
.woocommerce-MyAccount-content legend{ padding:0 8px; font-weight:700; color:var(--zeegroen-donker); font-size:13.5px; }

/* Winkelmandje/afrekenen-tabellen */
.woocommerce-cart .woocommerce, .woocommerce-checkout .woocommerce{ flex-direction:column; }
.woocommerce table.shop_table{ width:100%; border-collapse:collapse; background:var(--wit); border:1px solid var(--rand); border-radius:16px; overflow:hidden; }
.woocommerce table.shop_table th, .woocommerce table.shop_table td{ padding:14px; border-bottom:1px solid var(--rand); font-size:13.5px; }

/* ---------------------------------------------------
   Cookiemelding
--------------------------------------------------- */
.wo-cookiemelding{
  position:fixed; bottom:0; left:0; right:0; z-index:100;
  background:var(--zeegroen-donker); color:var(--zand);
  padding:16px 20px; display:none; align-items:center; justify-content:center; gap:16px; flex-wrap:wrap;
  box-shadow:0 -8px 24px rgba(0,0,0,.15);
}
.wo-cookiemelding.zichtbaar{ display:flex; }
.wo-cookiemelding p{ margin:0; font-size:13.5px; max-width:560px; color:var(--zand); }
.wo-cookiemelding a{ color:var(--wit); text-decoration:underline; }
.wo-cookiemelding-knoppen{ display:flex; gap:10px; flex-shrink:0; }
.wo-cookie-btn{ height:38px; padding:0 18px; border-radius:8px; font-size:13px; font-weight:600; border:none; cursor:pointer; }
.wo-cookie-accepteer{ background:var(--wit); color:var(--zeegroen-donker); }
.wo-cookie-weiger{ background:transparent; color:var(--zand); border:1px solid rgba(255,255,255,.35) !important; }

/* Login/registreren-tabs */
.wo-login-tabs{ display:flex; background:var(--zand); border-radius:10px; padding:4px; margin-bottom:18px; }
.wo-login-tabs a{ flex:1; text-align:center; padding:9px 0; border-radius:8px; font-size:13.5px; font-weight:600; color:var(--tekst-licht); }
.wo-login-tabs a.actief{ background:var(--wit); color:var(--tekst); box-shadow:0 1px 4px rgba(0,0,0,.08); }

.wo-btn-google{ display:flex; align-items:center; justify-content:center; gap:10px; width:100%; background:var(--wit); border:1px solid var(--rand); color:var(--tekst); font-weight:600; font-size:14.5px; border-radius:10px; padding:11px 16px; text-decoration:none; box-sizing:border-box; transition:background .15s,box-shadow .15s; }
.wo-btn-google:hover{ background:var(--zand); box-shadow:0 1px 4px rgba(0,0,0,.08); }
.wo-of-scheiding{ display:flex; align-items:center; text-align:center; color:var(--tekst-licht); font-size:12.5px; margin:16px 0; }
.wo-of-scheiding::before, .wo-of-scheiding::after{ content:""; flex:1; border-bottom:1px solid var(--rand); }
.wo-of-scheiding span{ padding:0 12px; }

/* Specificatietabel op detailpagina */
.wo-specificaties-tabel{ width:100%; border-collapse:collapse; }
.wo-specificaties-tabel td{ padding:11px 4px; border-bottom:1px solid var(--rand); font-size:13.5px; }
.wo-specificaties-tabel td:first-child{ color:var(--tekst-licht); width:45%; }
.wo-specificaties-tabel td:last-child{ font-weight:600; color:var(--tekst); text-align:right; }
.wo-specificaties-tabel tr:last-child td{ border-bottom:none; }

/* Zakelijke-verkoper-badge */
.wo-zakelijk-badge{
  display:inline-block; margin-left:6px; font-size:11px; font-weight:700; padding:3px 9px;
  border-radius:999px; background:#fef3c7; color:#92400e;
}

/* Zakelijk-account promotiebanner in dashboard */
.wo-zakelijk-promo{
  display:flex; align-items:center; gap:14px; margin-top:16px; padding:16px 18px;
  background:var(--zeegroen-licht); border:1px solid var(--zeegroen); border-radius:14px; flex-wrap:wrap;
}
.wo-zakelijk-promo strong{ font-size:13.5px; color:var(--zeegroen-donker); }
.wo-zakelijk-promo p{ font-size:12.5px; color:var(--tekst-licht); margin:2px 0 0; }
.wo-zakelijk-promo > div{ flex:1; min-width:200px; }

/* ---------------------------------------------------
   Standaard WP-loginformulier (wp_login_form) matchen met themastijl
--------------------------------------------------- */
#loginform p{ margin:0 0 14px; }
#loginform label{ font-size:13px; font-weight:600; color:var(--tekst-licht); display:block; margin-bottom:4px; }
#loginform .forgetmenot{ display:flex; align-items:center; gap:8px; margin-bottom:16px !important; }
#loginform .forgetmenot input[type=checkbox]{ width:auto; height:auto; }
#loginform .forgetmenot label{ margin:0; font-weight:400; color:var(--tekst); font-size:13.5px; }
#loginform .login-submit{ margin:0 !important; }
#loginform input#wp-submit,
.woocommerce-MyAccount-content input[type=submit],
.woocommerce form input[type=submit]{
  display:inline-flex; align-items:center; justify-content:center;
  height:48px; width:100%; padding:0 20px; border-radius:10px; font-weight:600; font-size:15px;
  background:var(--zeegroen); color:var(--wit) !important; border:none; cursor:pointer;
  text-shadow:none; box-shadow:none;
}
#loginform input#wp-submit:hover{ background:var(--zeegroen-donker); }

/* ---------------------------------------------------
   Blog: overzicht en artikel
--------------------------------------------------- */
.wo-blog-grid{ display:grid; grid-template-columns:1fr; gap:24px; padding:32px 20px 60px; }
@media (min-width:700px){ .wo-blog-grid{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1000px){ .wo-blog-grid{ grid-template-columns:repeat(3,1fr); } }

.wo-blog-kaart{ background:var(--wit); border:1px solid var(--rand); border-radius:18px; overflow:hidden; transition:box-shadow .2s, transform .2s; }
.wo-blog-kaart:hover{ box-shadow:0 12px 32px rgba(11,37,69,.10); transform:translateY(-3px); }
.wo-blog-foto{ height:180px; background:var(--zand-donker); }
.wo-blog-foto img{ width:100%; height:100%; object-fit:cover; }
.wo-blog-info{ padding:20px 22px 24px; }
.wo-blog-datum{ font-size:11.5px; color:var(--tekst-licht); font-weight:600; text-transform:uppercase; letter-spacing:.03em; }
.wo-blog-kaart h2{ font-size:17px; margin:8px 0 8px; color:var(--tekst); line-height:1.35; }
.wo-blog-kaart p{ font-size:13.5px; color:var(--tekst-licht); line-height:1.6; margin:0 0 12px; }
.wo-blog-lees-meer{ font-size:13px; font-weight:700; color:var(--zeegroen); }

.wo-blog-artikel{ max-width:760px; padding:24px 20px 60px; }
.wo-blog-artikel h1{ font-size:28px; color:var(--tekst); margin:8px 0 20px; line-height:1.25; }
@media (min-width:860px){ .wo-blog-artikel h1{ font-size:36px; } }
.wo-blog-artikel-foto{ border-radius:18px; overflow:hidden; margin-bottom:28px; }
.wo-blog-artikel-inhoud{ font-size:15.5px; line-height:1.85; color:var(--tekst); }
.wo-blog-artikel-inhoud h2{ font-size:22px; margin:32px 0 14px; color:var(--zeegroen-donker); }
.wo-blog-artikel-inhoud h3{ font-size:18px; margin:26px 0 12px; color:var(--zeegroen-donker); }
.wo-blog-artikel-inhoud p{ margin:0 0 18px; }
.wo-blog-artikel-inhoud ul, .wo-blog-artikel-inhoud ol{ margin:0 0 18px; padding-left:22px; }
.wo-blog-artikel-inhoud li{ margin-bottom:8px; }
.wo-blog-artikel-inhoud a{ color:var(--zeegroen); text-decoration:underline; }
.wo-blog-artikel-inhoud blockquote{ border-left:3px solid var(--zeegroen); padding:4px 0 4px 18px; margin:20px 0; color:var(--tekst-licht); font-style:italic; }

/* ---------------------------------------------------
   Carrousel op de detailpagina
--------------------------------------------------- */
.wo-galerij-hoofd{ position:relative; }
.wo-carrousel-pijl{
  position:absolute; top:50%; transform:translateY(-50%); width:40px; height:40px; border-radius:50%;
  background:rgba(255,255,255,.9); border:none; font-size:22px; color:var(--tekst); cursor:pointer;
  display:flex; align-items:center; justify-content:center; box-shadow:0 4px 12px rgba(0,0,0,.15); z-index:2;
}
.wo-carrousel-pijl:hover{ background:var(--wit); }
.wo-carrousel-vorige{ left:12px; }
.wo-carrousel-volgende{ right:12px; }
.wo-carrousel-teller{
  position:absolute; bottom:12px; right:12px; background:rgba(0,0,0,.6); color:#fff;
  font-size:12px; font-weight:600; padding:4px 10px; border-radius:999px; z-index:2;
}
.wo-carrousel-dots{ display:flex; justify-content:center; gap:6px; margin-top:10px; }
.wo-carrousel-dot{ width:7px; height:7px; border-radius:50%; background:var(--rand); cursor:pointer; transition:background .15s; }
.wo-carrousel-dot.actief{ background:var(--zeegroen); width:18px; border-radius:4px; }

/* Statistiekenrij bovenaan het dashboard */
.wo-dash-statsrij{ display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:20px; }
.wo-dash-stat{ background:var(--wit); border:1px solid var(--rand); border-radius:14px; padding:16px 10px; text-align:center; display:flex; flex-direction:column; gap:4px; }
.wo-dash-stat-getal{ font-size:22px; font-weight:800; color:var(--tekst); }
.wo-dash-stat span:last-child{ font-size:11.5px; color:var(--tekst-licht); font-weight:600; text-transform:uppercase; letter-spacing:.03em; }
@media (min-width:600px){ .wo-dash-stat-getal{ font-size:26px; } }

/* Uitgelicht (eerste) blogbericht groter */
@media (min-width:700px){
  .wo-blog-uitgelicht{ grid-column:1 / -1; display:grid; grid-template-columns:1.2fr 1fr; }
  .wo-blog-uitgelicht .wo-blog-foto{ height:100%; min-height:280px; }
  .wo-blog-uitgelicht .wo-blog-info{ display:flex; flex-direction:column; justify-content:center; padding:28px 32px; }
  .wo-blog-uitgelicht h2{ font-size:24px; }
  .wo-blog-uitgelicht p{ font-size:14.5px; }
}

/* Bestaande foto's beheren: herschikken en verwijderen */
.wo-foto-preview-item{ position:relative; }
.wo-foto-preview-knoppen{
  position:absolute; bottom:4px; left:4px; right:4px; display:flex; gap:3px; justify-content:center;
  opacity:0; transition:opacity .15s;
}
.wo-foto-preview-item:hover .wo-foto-preview-knoppen{ opacity:1; }
.wo-foto-verplaats, .wo-foto-preview-verwijder-bestaand{
  width:22px; height:22px; border-radius:6px; border:none; background:rgba(0,0,0,.65); color:#fff;
  font-size:12px; cursor:pointer; display:flex; align-items:center; justify-content:center;
}
.wo-foto-preview-verwijder-bestaand{ background:rgba(185,28,28,.85); }

/* Advertentie delen */
.wo-deel-knop{
  width:100%; height:44px; margin-top:12px; border-radius:10px; border:1px solid var(--rand);
  background:var(--wit); color:var(--zeegroen); font-weight:600; font-size:13.5px; cursor:pointer;
  display:flex; align-items:center; justify-content:center; gap:6px;
}
.wo-deel-knop:hover{ background:var(--zeegroen-licht); }
.wo-deel-opties{ display:none; flex-direction:column; gap:6px; margin-top:8px; }
.wo-deel-opties.open{ display:flex; }
.wo-deel-opties a, .wo-deel-opties button{
  display:flex; align-items:center; height:38px; padding:0 14px; border-radius:8px;
  border:1px solid var(--rand); background:var(--wit); font-size:13px; color:var(--tekst);
  cursor:pointer; text-decoration:none;
}
.wo-deel-opties a:hover, .wo-deel-opties button:hover{ background:var(--zand); }

/* Video-embed op de detailpagina */
.wo-video-embed{ position:relative; padding-bottom:56.25%; height:0; overflow:hidden; border-radius:12px; }
.wo-video-embed iframe{ position:absolute; top:0; left:0; width:100%; height:100%; border:0; }