
/* ============================================================
   GF CIRCULAR PROGRESS - CSS
   ============================================================
   Scoped under these container classes:
     .quote-hero   -> form 18
     .hero-form-nz -> form 29
   Add more container classes to every :is(...) list below if
   you add the ring to further forms.
   ============================================================ */

:is(.quote-hero, .hero-form-nz) [id^="gf_progressbar_wrapper_"]{
  display:flex;
  align-items:center;
  gap:24px;
  border-radius:0;
  margin-bottom:24px;
}

/* Asterisk color override */
.gform_wrapper.gravity-theme .gfield_required{
  color:#fff!important;
}

/* GF's own step-title heading (e.g. "Moving From") is replaced
   by .gfcp-title, so hide the original everywhere it appears. */
.form-steps-label{
  display:none !important;
}
#worldwide-quote-form .form-steps-label,
#popup-location-finder .form-steps-label{
  display:block !important;
}
#worldwide-quote-form .gfield_radio label,
#popup-location-finder .gfield_radio label{
  color:#fff!important;
}

/* Hide the default Gravity Forms bar/labels */
:is(.quote-hero, .hero-form-nz) [id^="gf_progressbar_wrapper_"] .gf_progressbar_title,
:is(.quote-hero, .hero-form-nz) [id^="gf_progressbar_wrapper_"] .gf_progressbar{
  display:none;
}

:is(.quote-hero, .hero-form-nz) .gfcp-ring{
  position:relative;
  width:92px;
  height:92px;
  flex:none;
}

:is(.quote-hero, .hero-form-nz) .gfcp-ring svg{
  width:100%;
  height:100%;
  transform:rotate(-90deg); /* start the arc at 12 o'clock */
}

:is(.quote-hero, .hero-form-nz) .gfcp-ring circle{
  fill:none;
  stroke-width:8;
}

:is(.quote-hero, .hero-form-nz) .gfcp-ring .gfcp-track{
  stroke:#5c7a99;
  opacity:.55;
}

:is(.quote-hero, .hero-form-nz) .gfcp-ring .gfcp-fill{
  stroke:#f6d64a;
  stroke-linecap:round;
  transition:stroke-dashoffset .5s ease;
}

:is(.quote-hero, .hero-form-nz) .gfcp-ring-label{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  color:#eef3f8;
  font-weight:400;
}

:is(.quote-hero, .hero-form-nz) .gfcp-ring-label .gfcp-step{
  font-size:13px;
  letter-spacing:.3px;
  margin-bottom:2px;
}

:is(.quote-hero, .hero-form-nz) .gfcp-ring-label .gfcp-count{
  font-size:22px;
  font-weight:700;
}

:is(.quote-hero, .hero-form-nz) .gfcp-title{
  color:#fff;
  font-style:italic;
  font-weight:900;
  font-size:20px;
  line-height:1.2;
}
