.hfv-form-wrap { max-width: 760px; margin: 1rem auto; }
.hfv-form {
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:8px;
  padding:16px;
  /* Lettertype van het formulier (pas aan naar wens) */
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji", sans-serif;
}

/* ---------- Responsief formulier ---------- */
@media (max-width: 768px) {
  .hfv-form {
    width: 95% !important;
    margin: 0 auto;
  }
}


.hfv-field { margin-bottom: 12px; }
.hfv-field label { display:block; font-weight:600; margin-bottom:6px; }

/* Park vraag (Ja/Nee) */
.hfv-radio-row{ display:flex; gap:16px; flex-wrap:wrap; }
.hfv-radio{ display:flex; align-items:center; gap:8px; font-weight:500; }
.hfv-radio input[type="radio"]{ width:auto; }
.hfv-field input[type="text"],
.hfv-field input[type="email"]{
  width:100%; padding:10px; border:1px solid #d1d5db; border-radius:6px; box-sizing:border-box;
}
.hfv-btn { display:inline-block; padding:10px 14px; border:1px solid #d1d5db; border-radius:6px; background:#111827; color:#fff; cursor:pointer; }
.hfv-btn:hover { background:#000; }
.hfv-results { margin-top:16px; }
.hfv-feedback { margin-top:12px; padding:10px; border-radius:6px; border:1px solid transparent; }
.hfv-feedback.success { border-color:#10b981; background:#ecfdf5; color:#065f46; }
.hfv-feedback.error { border-color:#ef4444; background:#fef2f2; color:#991b1b; }
.hfv-closed { padding:14px; border-radius:8px; background:#fff7ed; border:1px solid #fed7aa; color:#7c2d12; }

/* Tabel met prijzen (forceer kolombreedtes via colgroup) */
.hfv-table {
  width:100%;
  border-collapse:collapse;
  margin:12px 0;
  table-layout:fixed;          /* belangrijk: respecteer kolombreedtes */
}
.hfv-table th, .hfv-table td {
  padding:4px 6px;             /* nog compacter */
  border-bottom:1px solid #e5e7eb;
  vertical-align:middle;
  line-height:1.25;
}

/* kolombreedtes */
.hfv-table col.hfv-col-check  { width: 28px; margin: 0px 15px!important; padding-right:5px!important; }   /* nog smaller voor checkbox */
.hfv-table col.hfv-col-price  { width: 90px; }  /* breder zodat € + bedrag passen */
.hfv-table col.hfv-col-name   { width: auto; }   /* neemt rest op */

/* Groepeertabel (aantal + unit + totaal) */
.hfv-table col.hfv-col-qty   { width: 90px; }
.hfv-table col.hfv-col-unit  { width: 130px; }
.hfv-table col.hfv-col-total { width: 110px; }

.hfv-table thead th { background:#f9fafb; text-align:left; font-weight:600; padding:10px }

/* uitlijning van cellen */
.hfv-table th:first-child,
.hfv-table td:first-child { text-align:center; }
.hfv-table th:last-child,
.hfv-table td:last-child { text-align:right; }

/* checkbox iets compacter */
.hfv-table td:first-child input[type="checkbox"]{
  width:16px; height:16px; margin:0; display:inline-block;
}

/* aantal dropdown */
.hfv-qty{
  width: 72px;
  padding: 8px 34px 8px 10px;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  background-color: #fff;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  line-height: 1.2;
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='%236b7280' d='M5.5 7.5 10 12l4.5-4.5 1.5 1.5L10 15 4 9z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 16px 16px;
}

.hfv-qty:focus{
  outline: none;
  box-shadow: 0 0 0 3px rgba(59,130,246,0.25);
  border-color: #93c5fd;
}

.hfv-bike-top{
  font-weight: 600;
}

.hfv-col-right { text-align:right!important; }
.hfv-col-center { text-align:center; }
.hfv-table tfoot td { background:#f9fafb; font-weight:600; }


.entry-content tr td {padding:10px 5px;}


/* Voorwaarden */
.hfv-terms label { display:flex; align-items:center; gap:10px; font-weight:500; }
.hfv-terms input[type="checkbox"]{ width:auto; }

/* Flatpickr */
.flatpickr-input { width:100%; padding:10px; border:1px solid #d1d5db; border-radius:6px; box-sizing:border-box; background:#fff; }
.flatpickr-calendar { font-family: inherit; }
.flatpickr-day.hfv-day-red { background:#ffe4e6 !important; border-color:#fecdd3 !important; color:#991b1b !important; }
.flatpickr-day.hfv-day-orange { background:#ffedd5 !important; border-color:#fed7aa !important; color:#9a3412 !important; }
.flatpickr-day.hfv-day-red.flatpickr-disabled,
.flatpickr-day.flatpickr-disabled { cursor:not-allowed; opacity:0.9; }

/* Startdatum in eind-kalender als positief signaal (groen) */
.flatpickr-day.hfv-day-green { background:#dcfce7 !important; border-color:#bbf7d0 !important; color:#166534 !important; }


/* subtitel onder fietsnaam (formaat) */
.hfv-bike-meta{
  margin-top:2px;
  font-size:12px;
  color:#6b7280;   /* grijs */
  font-style:italic;
}

/* Loading state voor submitknop */
.hfv-btn.is-loading {
  position: relative;
  pointer-events: none;
  opacity: 0.9;
}
.hfv-btn.is-loading::after {
  content: "";
  position: absolute;
  right: 10px;
  top: 50%;
  width: 16px;
  height: 16px;
  margin-top: -8px;
  border-radius: 50%;
  border: 2px solid currentColor;
  border-top-color: transparent;
  animation: hfvspin .8s linear infinite;
}
@keyframes hfvspin { to { transform: rotate(360deg); } }