
/* JFB UX Overrides v1.3.1 — Multistep-only Progress + Brand colors */
:root{
  --jfb-primary:#4f46e5;
  --jfb-primary-contrast:#fff;
  --jfb-border:#d1d5db;
  --jfb-hover:#f3f4f6;
  --jfb-bg:#fff;
  --jfb-radius:12px;
  --jfb-shadow:0 8px 24px rgba(0,0,0,.08);
  /* Branding for completed bar */
  --jfb-brand-start:#000175;
  --jfb-brand-end:#1b567f;
}
.jet-form-builder, .jet-form-builder-row, .jet-form-builder__field-wrap, .elementor-widget-container { overflow: visible !important; }

/* hide original select but keep it working */
.jfb-ms-origin-hidden{
  position:absolute !important;
  opacity:0 !important;
  pointer-events:none !important;
  width:0 !important; height:0 !important;
}

/* Multi-select custom UI */
.jfb-ms{ position:relative; width:100%; }
.jfb-ms__control{
  min-height:44px; width:100%;
  background:var(--jfb-bg);
  border:1px solid var(--jfb-border);
  border-radius:var(--jfb-radius);
  padding:6px 40px 6px 10px;
  display:flex; flex-wrap:wrap; align-items:center; gap:6px;
  cursor:pointer; box-shadow:none;
}
.jfb-ms__placeholder{ color:#6b7280; line-height:1.6; }
.jfb-ms__chip{
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 10px;
  background:#eef2ff;
  color:#3730a3;
  border-radius:999px;
  font-size:13px;
}
.jfb-ms__chip-remove{ display:inline-block; width:14px; height:14px; border-radius:999px; line-height:14px; text-align:center; font-size:12px; cursor:pointer; }
.jfb-ms__arrow{ position:absolute; right:10px; top:50%; transform:translateY(-50%); pointer-events:none; }
.jfb-ms__dropdown{
  position:absolute; left:0; right:0; top:calc(100% + 6px);
  background:#fff; border:1px solid var(--jfb-border); border-radius:12px; box-shadow:var(--jfb-shadow);
  max-height:260px; overflow:auto; z-index:9999; display:none;
}
.jfb-ms.is-open .jfb-ms__dropdown{ display:block; }
.jfb-ms__option{ padding:10px 12px; cursor:pointer; display:flex; align-items:center; justify-content:space-between; }
.jfb-ms__option:hover{ background:var(--jfb-hover); }
.jfb-ms__option.is-selected{ background:#eef2ff; color:#3730a3; }
.jfb-ms__option-check{ font-size:12px; opacity:.7; }

/* Radios as horizontal pills (no DOM reflow) */
.jet-form-builder .jfb-radio-field{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.jet-form-builder .jfb-radio-field label.jet-form-builder__field-label.for-radio{
  display:inline-flex; align-items:center; gap:8px;
  padding:10px 14px;
  border:1px solid var(--jfb-border);
  border-radius:var(--jfb-radius);
  background:var(--jfb-bg);
  color:#111827;
  cursor:pointer; user-select:none;
  transition:background .15s ease,border-color .15s ease,box-shadow .15s ease;
}
.jet-form-builder .jfb-radio-field label.jet-form-builder__field-label.for-radio > input[type="radio"]{
  position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}
.jet-form-builder .jfb-radio-field label.jet-form-builder__field-label.for-radio.is-checked{
  background:var(--jfb-brand-start); color:var(--jfb-primary-contrast); border-color:var(--jfb-brand-start);
  box-shadow:0 0 0 3px rgba(0,1,117,.15);
}

/* ===== Field-based Percentage Progress (multistep only) ===== */
.jfb-progress{ margin: 10px 0 16px 0; }
.jfb-progress__track{
  height: 8px; background: #e5e7eb; border-radius: 999px; position:relative; overflow:hidden;
}
.jfb-progress__bar{
  height:100%; width:0%;
  background: linear-gradient(90deg, var(--jfb-brand-start), var(--jfb-brand-end));
  border-radius:999px; transition: width .25s ease;
}
.jfb-progress__label{
  margin-top:6px; font-size:13px; color:#374151; display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap;
}
.jfb-progress__meta{ opacity:.8; }
.jfb-progress__label strong{ color:#111827; }
