/*
 * Compass Pro — FluentForms Overrides
 * Loaded conditionally on pages containing a FluentForm.
 * Depends on: style.css (inherits CSS custom properties from :root)
 * Version: 1.1.0
 */

/* ==========================================================================
   Labels & Inputs
   ========================================================================== */
.frm-fluent-form .ff-el-input--label label{
  font-family:Sora,sans-serif;font-weight:600;font-size:.82rem;color:var(--ink);margin-bottom:.4rem}
.frm-fluent-form .ff-el-is-required .ff-required-mark,
.frm-fluent-form .asterisk-right label:after{color:var(--magenta)}
.frm-fluent-form .ff-el-form-control,
.frm-fluent-form select.ff-el-form-control,
.frm-fluent-form textarea.ff-el-form-control{
  width:100%;padding:.8rem .95rem;border:1px solid var(--line);border-radius:11px;
  font-family:Inter,system-ui,sans-serif;font-size:.95rem;color:var(--ink);background:var(--paper);
  box-shadow:none;transition:border-color .15s,box-shadow .15s}
.frm-fluent-form textarea.ff-el-form-control{resize:vertical;min-height:120px}
.frm-fluent-form .ff-el-form-control:focus{
  outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(58,111,224,.12);background:var(--white)}
.frm-fluent-form .ff-el-form-check-input,
.frm-fluent-form .ff_gdpr_field{accent-color:var(--blue);margin-top:.25rem}
.frm-fluent-form .ff-el-form-check-label,
.frm-fluent-form .ff_tc_label{font-size:.85rem;color:var(--muted);font-family:Inter,system-ui,sans-serif}
.frm-fluent-form .ff-el-form-check{
  display:flex;align-items:center;gap:.45rem;font-weight:500;font-family:Inter,sans-serif;font-size:.92rem;color:var(--ink-soft)}
.frm-fluent-form .ff-el-group{margin-bottom:1.1rem}

/* ==========================================================================
   Submit + Nav Buttons
   ========================================================================== */
.frm-fluent-form .ff-btn-submit,
.ff-default .ff-btn,
.ff-default .ff-btn-secondary:not(.ff_btn_no_style),
.ff-default .ff-btn-submit{
  display:inline-flex;align-items:center;gap:.5rem;font-family:"Sora",sans-serif;font-weight:600;font-size:.98rem;
  padding:.85rem 1.5rem;border-radius:999px!important;cursor:pointer;border:0!important;white-space:nowrap;
  transition:transform .18s,box-shadow .18s;
  background:var(--grad)!important;color:#fff!important}
.frm-fluent-form .ff-btn-submit{width:100%;justify-content:center}
.ff-default .ff-btn:hover,.frm-fluent-form .ff-btn-submit:hover{transform:translateY(-2px)}
.ff-default .ff-btn-prev{visibility:hidden}

/* ==========================================================================
   Range Slider (rangeslider.js)
   ========================================================================== */
.ff-default{
  --slider-track-bg:#e9ecf3;--slider-track-h:8px;
  --slider-handle-size:24px;--slider-handle-shadow:0 4px 12px -2px rgba(58,111,224,.45);
  --slider-value-color:#3a6fe0}
.ff-default input[type="range"]{opacity:0;position:absolute;width:1px;height:1px;pointer-events:none}
.ff-default .ff_slider_wrapper{padding:1.25rem 0 .25rem}
.ff-default .rangeslider.rangeslider--horizontal{
  height:var(--slider-track-h)!important;background:var(--slider-track-bg)!important;border-radius:999px!important;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.04)!important;border:0!important;position:relative;margin:.5rem 0 1rem}
.ff-default .rangeslider--horizontal .rangeslider__fill{
  height:var(--slider-track-h)!important;background:linear-gradient(135deg,#3a6fe0,#5b8cff)!important;
  border-radius:999px!important;box-shadow:0 0 12px -2px rgba(58,111,224,.4)!important;top:0!important}
.ff-default .rangeslider--horizontal .rangeslider__handle{
  width:var(--slider-handle-size)!important;height:var(--slider-handle-size)!important;
  top:50%!important;transform:translateY(-50%);background:#fff!important;border:2px solid #3a6fe0!important;
  border-radius:50%!important;box-shadow:var(--slider-handle-shadow)!important;cursor:grab;
  transition:box-shadow .18s,border-color .18s,background .18s}
.ff-default .rangeslider__handle::after,.ff-default .rangeslider__handle::before{display:none!important}
.ff-default .rangeslider--horizontal .rangeslider__handle:hover{
  border-color:#5b8cff!important;box-shadow:0 0 0 6px rgba(58,111,224,.12),0 6px 18px -2px rgba(58,111,224,.55)!important}
.ff-default .rangeslider--active .rangeslider__handle,
.ff-default .rangeslider--horizontal .rangeslider__handle:active{
  cursor:grabbing;background:linear-gradient(135deg,#3a6fe0,#5b8cff)!important;border-color:#fff!important;
  box-shadow:0 0 0 8px rgba(58,111,224,.15),0 8px 20px -2px rgba(58,111,224,.6)!important}
.ff-default .ff_slider_wrapper input[type="range"]:focus-visible+.rangeslider .rangeslider__handle{
  border-color:#5b8cff!important;box-shadow:0 0 0 4px rgba(58,111,224,.25),0 4px 12px -2px rgba(58,111,224,.45)!important}
.ff-default .ff_range_value{
  display:inline-block;font-family:"Sora",sans-serif;font-weight:700;font-size:.75rem;color:#3a6fe0;
  background:rgba(58,111,224,.08);padding:.35rem .9rem;border-radius:999px;margin-top:.75rem;
  min-width:3ch;text-align:center;box-shadow:inset 0 0 0 1px rgba(58,111,224,.15)}
.ff-default .rangeslider--disabled{opacity:.5;pointer-events:none}

/* ==========================================================================
   Step Header
   ========================================================================== */
body .fluentform .ff-step-header{margin:0 0 2.5rem!important}
body .fluentform .ff-step-titles{
  counter-reset:ffstep 0!important;display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;
  justify-content:space-between!important;align-items:flex-start!important;list-style:none!important;
  margin:0 0 2rem!important;padding:6px 0 0!important;position:relative!important;width:100%!important;
  table-layout:unset!important;overflow:visible!important;text-align:initial!important}
body .fluentform .ff-step-titles::before{
  content:""!important;position:absolute!important;top:24px!important;left:12%!important;right:12%!important;
  height:3px!important;background:#e9ecf3!important;border-radius:999px!important;z-index:0!important;display:block!important}
body .fluentform .ff-step-titles>li{
  counter-increment:ffstep 1!important;display:flex!important;flex-direction:column!important;
  align-items:center!important;justify-content:flex-start!important;gap:.6rem!important;flex:1 1 0!important;
  min-width:0!important;max-width:none!important;position:relative!important;z-index:1!important;padding:0 .5rem!important;
  background:transparent!important;border:0!important;text-align:center!important;list-style:none!important;
  margin:0!important;vertical-align:initial!important;color:#94a3b8!important;font-size:inherit!important}
body .fluentform .ff-step-titles>li::before{
  content:counter(ffstep)!important;display:flex!important;align-items:center!important;justify-content:center!important;
  width:36px!important;height:36px!important;min-width:36px!important;max-width:36px!important;flex:0 0 36px!important;
  border-radius:50%!important;background:#fff!important;background-image:none!important;border:2px solid #e9ecf3!important;
  color:#94a3b8!important;font-family:"Sora",sans-serif!important;font-weight:700!important;font-size:1rem!important;
  line-height:1!important;box-shadow:0 2px 6px -2px rgba(0,0,0,.08)!important;transition:all .25s ease!important;
  position:static!important;transform:none!important;top:auto!important;left:auto!important;right:auto!important;
  bottom:auto!important;margin:0!important;padding:0!important;counter-increment:unset!important}
body .fluentform .ff-step-titles>li::after{
  display:none!important;content:none!important;background:transparent!important;height:0!important;width:0!important}
body .fluentform .ff-step-titles>li .ff-step-title-text{
  display:block!important;font-family:"Sora",sans-serif!important;font-size:.875rem!important;font-weight:500!important;
  color:#94a3b8!important;text-align:center!important;line-height:1.35!important;max-width:12rem!important;
  margin:0 auto!important;transition:color .25s ease!important}
body .fluentform .ff-step-titles>li.ff_active::before{
  background:linear-gradient(135deg,#3a6fe0,#5b8cff)!important;border-color:transparent!important;
  color:#fff!important;box-shadow:0 6px 18px -4px rgba(58,111,224,.55)!important;transform:scale(1.1)!important}
body .fluentform .ff-step-titles>li.ff_active .ff-step-title-text{color:#3a6fe0!important;font-weight:600!important}
body .fluentform .ff-step-titles>li.ff_completed::before,
body .fluentform .ff-step-titles>li.ff_step_complete::before{
  content:"✓"!important;background:#3a6fe0!important;border-color:transparent!important;color:#fff!important;font-size:1.1rem!important}
body .fluentform .ff-step-titles>li.ff_completed .ff-step-title-text,
body .fluentform .ff-step-titles>li.ff_step_complete .ff-step-title-text{color:#3a6fe0!important}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media(max-width:640px){
  body .fluentform .ff-step-titles>li .ff-step-title-text{font-size:.75rem!important;max-width:6rem!important}
  body .fluentform .ff-step-titles>li::before{
    width:30px!important;height:30px!important;min-width:30px!important;max-width:30px!important;
    flex:0 0 30px!important;font-size:.9rem!important}
  body .fluentform .ff-step-titles::before{top:21px!important}
}

@media(max-width:480px){
  .ff-default .rangeslider--horizontal .rangeslider__handle{width:28px!important;height:28px!important}
  .ff-default .rangeslider.rangeslider--horizontal{height:10px!important}
  .ff-default .rangeslider--horizontal .rangeslider__fill{height:10px!important}
}