/* ═══════════════════════════════════════════════════════════════
   plaats-premium.css — premium restyle van het plaats-formulier.
   RESTYLE, geen vervanging: puur presentatie, scoped onder .plaats--premium.
   Raakt NIETS buiten dat blok → non-premium pagina's ongewijzigd.
   Kleuren: diep cobalt-neon-blauw #0033cc (interactie/actief) + diep neon-rood
   #cc0022 (nadruk), NIET gemengd (behalve sliders). Goud = CTA. Fonts/tokens uit de huisstijl.
   ═══════════════════════════════════════════════════════════════ */
.plaats--premium{
  --pblue:#0033cc; --pblue-lite:#4d7bff; --pred:#cc0022; --pred-lite:#ff2a44;
  --pgold:#c9a961; --pborder:rgba(255,255,255,0.12); --prad:18px;
  --pmuted:rgba(244,246,252,0.60); --pfaint:rgba(244,246,252,0.40);
  --pfield:rgba(255,255,255,0.04);
  --pglow-blue:0 0 16px rgba(30,90,255,0.55);
  position:relative;
  grid-template-columns:0.82fr 1.18fr;
  gap:24px;
  font-size:14px;
}
@media (max-width:960px){ .plaats--premium{ grid-template-columns:1fr; } }

/* Neon-sfeergloed, contained binnen het form-blok */
.plaats--premium::before{
  content:"";position:absolute;inset:-40px -20px;z-index:0;pointer-events:none;border-radius:24px;
  background:
    radial-gradient(50% 40% at 8% 0%, rgba(0,51,204,0.16), transparent 60%),
    radial-gradient(45% 40% at 100% 4%, rgba(204,0,34,0.12), transparent 55%);
}
.plaats--premium > *{ position:relative; z-index:1; }

/* ── Per-type hero-statement bovenaan de rail (hergebruikt typedesc-i18n) ── */
.plaats--premium .pp-rail-hero{
  border:1px solid var(--pborder); border-radius:var(--prad); padding:20px 20px 18px;
  background:
    linear-gradient(180deg,rgba(255,255,255,0.06),rgba(255,255,255,0.02)),
    radial-gradient(120% 90% at 0% 0%, rgba(0,51,204,0.28), transparent 55%),
    radial-gradient(120% 90% at 100% 100%, rgba(204,0,34,0.16), transparent 55%);
  box-shadow:0 14px 44px rgba(0,0,0,.45);
}
.plaats--premium .pp-rail-eyebrow{
  display:inline-block; font-size:10.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:#f4f6fc; padding:5px 11px; border-radius:999px; border:1px solid var(--pborder);
  background:rgba(0,51,204,0.15); margin-bottom:11px;
}
.plaats--premium .pp-rail-statement{
  margin:0; font-family:"Montserrat",inherit; font-weight:800; font-size:clamp(17px,1.9vw,20px);
  line-height:1.18; letter-spacing:-.01em; color:#f4f6fc;
}

/* ── Hero-rail (hergebruikt de bestaande sidebar, verplaatst naar links) ── */
.plaats--premium .plaats-sidebar{
  order:-1; align-self:start; position:sticky; top:16px;
  display:flex; flex-direction:column; gap:16px;
}
.plaats--premium .plaats-sidebar-card{
  position:relative; overflow:hidden;
  border:1px solid var(--pborder); border-radius:var(--prad);
  padding:22px 20px;
  background:
    linear-gradient(180deg,rgba(255,255,255,0.06),rgba(255,255,255,0.02)),
    radial-gradient(120% 90% at 0% 0%, rgba(0,51,204,0.30), transparent 55%),
    radial-gradient(120% 90% at 100% 100%, rgba(204,0,34,0.18), transparent 55%);
  box-shadow:0 16px 50px rgba(0,0,0,.45);
}
.plaats--premium .plaats-sidebar-title{
  font-family:"Montserrat",inherit; font-weight:800; font-size:16px; letter-spacing:-.01em; margin:0 0 12px; color:#f4f6fc;
}
.plaats--premium .plaats-sidebar-card--premium .plaats-sidebar-title{
  color:var(--pgold) !important; text-shadow:0 0 10px rgba(201,169,97,.35);
}
.plaats--premium .plaats-sidebar-steps{ counter-reset:ppstep; list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px; }
.plaats--premium .plaats-sidebar-steps li{ counter-increment:ppstep; position:relative; padding-left:34px; font-size:13px; color:var(--pmuted); line-height:1.5; }
.plaats--premium .plaats-sidebar-steps li::before{
  content:counter(ppstep); position:absolute; left:0; top:0;
  width:24px;height:24px;border-radius:8px;display:grid;place-items:center;
  font-family:"Montserrat"; font-weight:800; font-size:12px; color:#fff; background:var(--pblue); box-shadow:var(--pglow-blue);
}
.plaats--premium .plaats-sidebar-benefits{ list-style:none; margin:0 0 12px; padding:0; display:flex; flex-direction:column; gap:9px; font-size:13px; color:var(--pmuted); }
.plaats--premium .plaats-sidebar-benefits li{ padding-left:18px; position:relative; }
.plaats--premium .plaats-sidebar-benefits li::before{ content:"✓"; position:absolute; left:0; color:var(--pblue-lite); font-weight:700; }
.plaats--premium .plaats-sidebar-link{ color:var(--pblue-lite); font-weight:600; font-size:13px; text-decoration:none; }
.plaats--premium .plaats-sidebar-link:hover{ text-decoration:underline; }

/* ── Form ── */
.plaats--premium .plaats-form{ counter-reset:ppsec; gap:16px; }

/* Elke zichtbare sectie → glass-kaart met genummerde badge.
   Verborgen secties (display:none via data-show-for) tellen NIET mee in de counter. */
.plaats--premium .plaats-section{
  counter-increment:ppsec;
  position:relative;
  border:1px solid var(--pborder); border-radius:var(--prad);
  background:linear-gradient(180deg,rgba(255,255,255,0.045),rgba(255,255,255,0.015));
  box-shadow:0 10px 34px rgba(0,0,0,.30);
  padding:18px 20px 20px; margin:0;
}
.plaats--premium .plaats-section-title{
  display:flex; align-items:center; gap:11px;
  font-family:"Montserrat",inherit; font-size:15px; font-weight:700; letter-spacing:-.01em; margin:0 0 15px; color:#f4f6fc;
}
.plaats--premium .plaats-section-title::before{
  content:counter(ppsec);
  flex:0 0 auto; width:28px;height:28px;border-radius:9px;display:grid;place-items:center;
  font-family:"Montserrat"; font-weight:800; font-size:13px; color:#fff; background:var(--pblue); box-shadow:var(--pglow-blue);
}

/* Velden — compact + neon focus */
.plaats--premium .plaats-grid{ gap:13px; }
.plaats--premium .plaats-label{ font-size:12px; font-weight:600; color:#f4f6fc; letter-spacing:.01em; }
.plaats--premium .plaats-field input,
.plaats--premium .plaats-field select,
.plaats--premium .plaats-field textarea{
  font-size:13px; color:#f4f6fc;
  background:var(--pfield); border:1px solid var(--pborder); border-radius:10px;
  padding:9px 12px; transition:border-color .16s, box-shadow .16s, background .16s;
}
.plaats--premium .plaats-field textarea{ min-height:76px; line-height:1.5; }
.plaats--premium .plaats-field input:focus,
.plaats--premium .plaats-field select:focus,
.plaats--premium .plaats-field textarea:focus{
  outline:none; border-color:var(--pblue-lite); background:rgba(0,51,204,.10);
  box-shadow:0 0 0 2px rgba(0,51,204,.5),0 0 20px rgba(30,90,255,.30);
}
.plaats--premium .plaats-help{ font-size:11.5px; color:var(--pfaint); line-height:1.45; }
.plaats--premium .plaats-char-count{ font-size:11px; color:var(--pfaint); }

/* Type-pills → premium chips (actief = solide blauw) */
.plaats--premium .plaats-type-pills{ gap:8px; }
.plaats--premium .plaats-type-pill{
  font-size:12.5px; font-weight:600; padding:7px 14px; border-radius:999px;
  border:1px solid var(--pborder); background:var(--pfield); color:var(--pmuted); transition:.15s;
}
.plaats--premium .plaats-type-pill:hover{ border-color:var(--pblue-lite); color:#f4f6fc; background:var(--pfield); }
.plaats--premium .plaats-type-pill.is-active{
  color:#fff; background:var(--pblue); border-color:transparent;
  box-shadow:0 0 16px rgba(30,90,255,.5),0 3px 12px rgba(0,51,204,.3);
}
.plaats--premium .plaats-type-pill .plaats-type-pill-label{ color:inherit; }
.plaats--premium .plaats-type-desc-card{ border:1px solid var(--pborder); border-radius:12px; background:var(--pfield); padding:12px 14px; }
.plaats--premium .plaats-type-desc-dest-icon{ color:var(--pblue-lite); }

/* Chips gegenereerd uit selects (plaats-premium.js). Onderliggende select blijft
   in de DOM (source-of-truth voor submit + bestaande JS) maar wordt visueel verborgen. */
.plaats--premium select.pp-has-chips{
  position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
  clip:rect(0 0 0 0); clip-path:inset(50%); border:0; white-space:nowrap;
}
.plaats--premium .pp-chips{ display:flex; flex-wrap:wrap; gap:8px; }
.plaats--premium .pp-chip{
  cursor:pointer; user-select:none; font:inherit; font-size:12.5px; font-weight:600;
  padding:7px 13px; border-radius:999px; border:1px solid var(--pborder);
  background:var(--pfield); color:var(--pmuted); transition:.15s; display:inline-flex; align-items:center; gap:6px;
}
.plaats--premium .pp-chip:hover{ border-color:var(--pblue-lite); color:#f4f6fc; }
.plaats--premium .pp-chip.sel{ color:#fff; background:var(--pblue); border-color:transparent; box-shadow:0 0 16px rgba(30,90,255,.55),0 3px 12px rgba(0,51,204,.35); }
.plaats--premium .pp-chip .pp-tick{ opacity:0; font-size:10.5px; transition:.15s; }
.plaats--premium .pp-chip.sel .pp-tick{ opacity:1; }

/* Beschikbaarheid-widget (#720) → premium look */
.plaats--premium .plaats-avail{ border:1px solid var(--pborder); border-radius:12px; background:rgba(255,255,255,.02); padding:14px; }
.plaats--premium .plaats-avail-group{ margin-top:10px; }
.plaats--premium .plaats-avail-group-title{ font-size:12px; font-weight:700; color:#f4f6fc; margin-bottom:8px; }
.plaats--premium .plaats-avail-add{
  font:inherit; font-size:12px; font-weight:600; cursor:pointer; color:var(--pblue-lite);
  background:var(--pfield); border:1px solid var(--pborder); border-radius:8px; padding:7px 12px; transition:.15s;
}
.plaats--premium .plaats-avail-add:hover{ border-color:var(--pblue-lite); background:rgba(0,51,204,.10); }
.plaats--premium .plaats-avail-rows input,
.plaats--premium .plaats-avail-rows select{ font-size:12.5px; }

/* Premium-context / pricing-widget: subtiele goud-accent behouden, in de kaart-stijl */
.plaats--premium .plaats-section-premium-toggle,
.plaats--premium .plaats-section-duration{ /* erven de kaart-stijl van .plaats-section */ }

/* Uploadveld */
.plaats--premium .plaats-upload-drop,
.plaats--premium [class*="upload"]{ border-radius:12px; }

/* ── CTA (goud) ── */
.plaats--premium .plaats-submit,
.plaats--premium .plaats-submit.btn-primary{
  font-family:"Montserrat",inherit; font-weight:800; font-size:15px; letter-spacing:.01em;
  color:#0b0a06; border:0; border-radius:12px; padding:14px 30px; cursor:pointer;
  background:linear-gradient(135deg,#e8d9a8,var(--pgold));
  box-shadow:0 8px 24px rgba(201,169,97,.30),inset 0 1px 0 rgba(255,255,255,.5);
  transition:transform .16s, box-shadow .16s;
}
.plaats--premium .plaats-submit:hover{ transform:translateY(-2px); box-shadow:0 14px 38px rgba(201,169,97,.48),inset 0 1px 0 rgba(255,255,255,.6); }
.plaats--premium .plaats-submit:active{ transform:translateY(0); }
.plaats--premium .plaats-submit-note{ font-size:11.5px; color:var(--pfaint); }

/* Required-markering + validatie-tekst in accent */
.plaats--premium .plaats-field.is-invalid input,
.plaats--premium .plaats-field.is-invalid select,
.plaats--premium .plaats-field.is-invalid textarea{ border-color:var(--pred-lite); box-shadow:0 0 0 2px rgba(204,0,34,.30); }

/* ── Mobiel ── */
@media (max-width:960px){
  .plaats--premium .plaats-sidebar{ position:static; } /* rail bovenaan (order:-1 behouden) */
}
@media (max-width:540px){
  .plaats--premium .plaats-section{ padding:16px 15px 18px; }
  .plaats--premium .plaats-grid{ gap:12px; }
}