/* styles.css */
:root{
  --nlfr:#800000;
  --bd22: rgba(128,0,0,.22);
  --bd18: rgba(128,0,0,.18);
  --bd35: rgba(128,0,0,.35);
  --bg06: rgba(128,0,0,.06);
  --bg05: rgba(128,0,0,.05);
  --bg03: rgba(128,0,0,.03);
  --txt:#111;
  --muted:#444;
}

*{ box-sizing:border-box; }

body{
  margin:0;
  background:#fff;
  color:var(--txt);
  font-family: Mulish, Arial, sans-serif;
  line-height:1.8em;
}

.nlfr-wrap{
  max-width:900px;
  margin:18px auto;
  padding:0 12px;
}

.nlfr-box{
  border:1px solid var(--bd18);
  background:#fff;
  border-radius:14px;
  padding:14px 16px;
  margin:0 0 14px 0;
}

.nlfr-title{
  font-family:Poppins, Arial, sans-serif;
  color:var(--nlfr);
  font-weight:700;
  font-size:22px;
  margin:0 0 6px 0;
}

.nlfr-sub{ margin:0; }

.nlfr-h{
  font-family:Poppins, Arial, sans-serif;
  color:var(--nlfr);
  font-weight:700;
  margin:0 0 10px 0;
}

.nlfr-callout{
  border-left:5px solid var(--nlfr);
  background:var(--bg05);
  border-radius:12px;
  padding:12px 14px;
  margin:0 0 14px 0;
}

.nlfr-callout-title{
  font-family:Poppins, Arial, sans-serif;
  color:var(--nlfr);
  font-weight:700;
  margin:0 0 6px 0;
}

.nlfr-label{
  display:block;
  font-weight:700;
  margin:0 0 4px 0;
}

.nlfr-field{ margin:0 0 10px 0; }

.nlfr-row{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:flex-start;
}

.nlfr-input{
  flex:1;
  min-width:180px;
  padding:10px 10px;
  border:1px solid var(--bd22);
  border-radius:10px;
  font:inherit;
  background:#fff;
}

.nlfr-select{
  width:100%;
  padding:10px 10px;
  border:1px solid var(--bd22);
  border-radius:10px;
  font:inherit;
  background:#fff;
}

.nlfr-btn{
  padding:10px 12px;
  border:1px solid var(--bd35);
  border-radius:10px;
  background:var(--bg06);
  color:var(--nlfr);
  font-weight:700;
  cursor:pointer;
  font:inherit;
}

.nlfr-btn-primary{
  width:100%;
  padding:12px 12px;
  border:1px solid var(--bd35);
  border-radius:12px;
  background:var(--nlfr);
  color:#fff;
  font-weight:800;
  cursor:pointer;
  font:inherit;
}

.nlfr-status{
  margin:8px 0 0 0;
  font-size:14px;
  color:var(--muted);
}

.nlfr-summary{
  margin:10px 0 0 0;
  padding:10px 12px;
  border:1px dashed var(--bd35);
  border-radius:12px;
  background:var(--bg03);
}

.nlfr-summary-title{
  font-weight:700;
  color:var(--nlfr);
}

.nlfr-links{ margin:10px 0 0 0; }

.nlfr-link-strong{
  color:var(--nlfr);
  text-decoration:underline;
  font-weight:700;
}

.nlfr-link{
  color:var(--nlfr);
  text-decoration:underline;
}

.nlfr-help{
  font-size:13px;
  color:var(--muted);
}

.nlfr-noscript{
  margin-top:10px;
  border:1px solid var(--bd22);
  border-radius:12px;
  padding:10px 12px;
  background:#fff;
}

.nlfr-textarea{
  width:100%;
  padding:10px 10px;
  border:1px solid var(--bd22);
  border-radius:12px;
  font-family: Mulish, Arial, sans-serif;
  line-height:1.6;
}

.nlfr-btnlink{
  padding:10px 12px;
  border:1px solid var(--bd35);
  border-radius:10px;
  background:#fff;
  color:var(--nlfr);
  font-weight:800;
  text-decoration:none;
  display:inline-block;
}

.nlfr-foot{
  font-size:13px;
  color:var(--muted);
  margin:0 0 10px 0;
}

.nlfr-hidden{ display:none; }

.nlfr-mb10{ margin:0 0 10px 0; }
.nlfr-mt10{ margin-top:10px; }
.nlfr-mt6{ margin-top:6px; }

.nlfr-eu{
  border:1px solid var(--bd22);
  border-radius:12px;
  padding:12px 14px;
  background:#fff;
  margin:12px 0 0 0;
}

.nlfr-eu-title{
  font-weight:800;
  color:var(--nlfr);
  margin:0 0 6px 0;
}

.nlfr-ul{
  margin:0;
  padding-left:18px;
}

.nlfr-ul li{ margin:6px 0; }

/* Cards produced by JS */
.nlfr-card{
  border:1px solid rgba(128,0,0,.16);
  border-radius:14px;
  padding:12px 12px;
  margin:0 0 10px 0;
  background:#fff;
}

.nlfr-card-head{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}

.nlfr-card-title{
  font-family:Poppins, Arial, sans-serif;
  color:var(--nlfr);
  font-weight:800;
  font-size:16px;
  flex:1;
  min-width:220px;
}

.nlfr-card-links{
  margin-top:10px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

/* Peil-label: stempel bij de uitkomst en voettekstalinea. Alleen zichtbaar als PEIL_LABEL_AAN true is. */
.peil-stempel:focus-visible, .peil-alinea a:focus-visible{ outline:2px solid #800000; outline-offset:3px; border-radius:4px; }
.peil-stempel-rij{ display:flex; justify-content:flex-end; margin-top:12px; }
.peil-stempel{ display:inline-flex; align-items:center; gap:9px; min-height:44px; max-width:100%; padding:4px 12px 4px 4px; border:1px solid #eadede; border-radius:999px; background:#fff; color:#800000; text-decoration:none; transition:border-color .15s, background .15s; }
.peil-stempel svg{ flex:none; width:36px; height:36px; display:block; opacity:.85; filter:drop-shadow(0 1px 0 rgba(255,255,255,.9)) drop-shadow(0 -1px 0 rgba(128,0,0,.12)); }
.peil-stempel__tk{ display:flex; flex-direction:column; line-height:1.25; min-width:0; overflow-wrap:anywhere; }
.peil-stempel__t1{ font-size:13px; font-weight:700; color:#7a1f1f; }
.peil-stempel__t2{ font-size:12px; color:#6a5d58; }
.peil-stempel:hover{ border-color:#cfa9a9; background:#fcf7f7; }
.peil-pijl{ display:inline-block; margin-left:.25em; font-size:12px; line-height:1; color:inherit; transition:transform .15s; }
@media (prefers-reduced-motion: no-preference){ .peil-stempel:hover .peil-pijl{ transform:translate(2px,-2px); } }
.peil-stempel:hover .peil-stempel__t1{ text-decoration:underline; text-underline-offset:2px; }
.peil-merk{ flex:none; display:inline-block; width:18px; height:18px; border-radius:50%; background:#800000; color:#fff; font:700 12px/18px system-ui, sans-serif; text-align:center; text-decoration:none; }
.peil-alinea{ position:relative; margin:12px 0 0; padding-left:26px; max-width:72ch; font-size:13px; line-height:1.6em; color:#555; }
.peil-alinea[hidden], #peilStempel[hidden]{ display:none; }
.peil-alinea .peil-merk{ position:absolute; left:0; top:3px; }
.peil-alinea strong{ color:#222; }
.peil-alinea a{ display:inline-block; padding:6px 0; color:#800000; text-decoration:underline; text-underline-offset:3px; }
.peil-alinea{ margin:14px 0 0; }
