/* Make the popup content feel stable */
#elementor-popup-modal-3113 .dialog-message {
  overflow: hidden; /* prevents overflow during animation */
}

/* Wrapper that contains both gate + form */
#elementor-popup-modal-3113 #nrFormWrap {
  position: relative;
}

/* Ensure BOTH panels occupy space consistently */
#elementor-popup-modal-3113 #nrEmailGate,
#elementor-popup-modal-3113 #nrFormWrap .fluentform {
  transition: opacity .35s ease, transform .35s ease;
  will-change: opacity, transform;
}

/* Default state: show gate, hide form */
#elementor-popup-modal-3113 .nr-email-gate {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

#elementor-popup-modal-3113 #nrFormWrap .fluentform {
  opacity: 0;
  transform: translateY(10px);
  pointer-events: none;
}

/* Passed state: hide gate, show form */
#elementor-popup-modal-3113.nr-gate-passed .nr-email-gate {
  opacity: 0;
  transform: translateY(-10px);
  pointer-events: none;
}

#elementor-popup-modal-3113.nr-gate-passed #nrFormWrap .fluentform {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

/* If you're currently using .is-hidden, stop using display:none for the form */
#elementor-popup-modal-3113 #nrFormWrap.is-hidden {
  display: block;     /* override any display:none */
  opacity: 1;         /* keep wrapper visible */
}

/* Accessibility: respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  #elementor-popup-modal-3113 #nrEmailGate,
  #elementor-popup-modal-3113 #nrFormWrap,
  #elementor-popup-modal-3113 #nrFormWrap .fluentform {
    transition: none !important;
    transform: none !important;
  }
}

/* =========================================================
   Scoped styles for Elementor Popup ID 3113 ONLY
   Root scope: #elementor-popup-modal-3113
   ========================================================= */

#elementor-popup-modal-3113 .ff-hidden-calc{
  display:none !important;
}

/* -------------------------
   Popup / Step layout tightening
   ------------------------- */
#elementor-popup-modal-3113 .fluentform .ff-step-body{
  padding-top:10px !important;
}

#elementor-popup-modal-3113 .fluentform .ff-el-group{
  margin-bottom:14px !important;
}

#elementor-popup-modal-3113 .fluentform .ff-step-body h1,
#elementor-popup-modal-3113 .fluentform .ff-step-body h2,
#elementor-popup-modal-3113 .fluentform .ff-step-body h3{
  margin:8px 0 10px !important;
}

/* -------------------------
   Progress bar (shorter + centred)
   ------------------------- */
#elementor-popup-modal-3113 .fluentform .ff-el-progress-status{
  display:none !important;
}

#elementor-popup-modal-3113 .fluentform .ff-step-header .ff-el-progress{
  max-width:420px !important;
  margin:10px auto 14px !important;

  height:10px !important;
  border-radius:999px !important;
  background:rgba(106,63,142,0.12) !important;
  overflow:hidden !important;
}

#elementor-popup-modal-3113 .fluentform .ff-step-header .ff-el-progress-bar{
  height:10px !important;
  border-radius:999px !important;
  background:#6a3f8e !important;
}

#elementor-popup-modal-3113 .fluentform .ff-step-header .ff-el-progress-bar span{
  display:none !important;
}

/* -------------------------
   Sliders (range fields) compact + clear
   ------------------------- */
#elementor-popup-modal-3113 .fluentform .ff-el-input--label{
  margin-bottom:6px !important;
}

#elementor-popup-modal-3113 .fluentform .ff_slider_wrapper{
  margin-top:6px !important;
  position:relative;
  padding-bottom:18px; /* space for 0/10 */
}

/* Slider track — 10 distinct grey zones */
#elementor-popup-modal-3113 .fluentform .rangeslider--horizontal{
  height: 8px !important;
  border-radius: 999px !important;

  background:
    /* tick markers */
    repeating-linear-gradient(
      to right,
      rgba(0,0,0,0.18) 0,
      rgba(0,0,0,0.18) 1px,
      transparent 1px,
      transparent 10%
    ),
    /* stepped grey zones */
    linear-gradient(
      to right,
      #f2f3f5 0%,
      #f2f3f5 10%,
      #e9eaee 10%,
      #e9eaee 20%,
      #e0e2e7 20%,
      #e0e2e7 30%,
      #d7dae0 30%,
      #d7dae0 40%,
      #ced2d9 40%,
      #ced2d9 50%,
      #c5cad2 50%,
      #c5cad2 60%,
      #bcc2cb 60%,
      #bcc2cb 70%,
      #b3bac4 70%,
      #b3bac4 80%,
      #aab2bd 80%,
      #aab2bd 90%,
      #a1aab6 90%,
      #a1aab6 100%
    ) !important;

  box-shadow: none !important;
}





#elementor-popup-modal-3113 .fluentform .rangeslider__fill{
  height:8px !important;
  border-radius:999px !important;
  background:#6F8F8A !important;
}

#elementor-popup-modal-3113 .fluentform .rangeslider__handle{
  width:18px !important;
  height:18px !important;
  top:-5px !important;
  border:2px solid #6F8F8A !important;
  background:#fff !important;
  box-shadow:0 1px 3px rgba(0,0,0,0.18) !important;
}

#elementor-popup-modal-3113 .fluentform .ff_range_value{
  margin-top:6px !important;
  text-align:center !important;
  font-weight:700 !important;
  color:#2e2e2e !important;
  line-height:1 !important;
}

#elementor-popup-modal-3113 .fluentform .ff_slider_wrapper::before{
  content:"0";
  position:absolute;
  left:0;
  bottom:0;
  font-size:12px;
  color:#666;
}

#elementor-popup-modal-3113 .fluentform .ff_slider_wrapper::after{
  content:"10";
  position:absolute;
  right:0;
  bottom:0;
  font-size:12px;
  color:#666;
}

#elementor-popup-modal-3113 .fluentform .ff-el-group .ff-el-input--content{
  margin-bottom:0 !important;
}

/* Kill any forced min-heights that create dead space */
#elementor-popup-modal-3113 .fluentform .ff-step-body,
#elementor-popup-modal-3113 .fluentform .fluentform-step{
  min-height:0 !important;
}

/* Defensive: progress bar shouldn’t eat clicks */
#elementor-popup-modal-3113 .ff-el-progress-bar{
  pointer-events:none;
}

/* -------------------------
   Popup header media (video/title area)
   ------------------------- */
#elementor-popup-modal-3113 .popup-media{
  width:100%;
}

#elementor-popup-modal-3113 .is-hidden:not(#nrFormWrap){
  display:none !important;
}


#elementor-popup-modal-3113 [data-popup-header="true"] .elementor-widget-html,
#elementor-popup-modal-3113 [data-popup-header="true"] .elementor-widget-container{
  width:100% !important;
  max-width:100% !important;
}

/* Vimeo wrapper: no absolute positioning */
#elementor-popup-modal-3113 .popup-video-wrap{
  width:100% !important;
  max-width:100% !important;
  margin:0 auto !important;
  overflow:hidden !important;
  border-radius:18px !important;
  aspect-ratio:16 / 9 !important;
}

#elementor-popup-modal-3113 .popup-video-wrap iframe{
  width:100% !important;
  height:100% !important;
  border:0 !important;
  display:block !important;
}

/* -------------------------
   Step title styling + BACKGROUND IMAGE
   ------------------------- */
#elementor-popup-modal-3113 #popupStepTitle{
  display:block;
  text-align:center;
  font-weight:800;
  color:#6a3f8e;
  font-size:24px;
  line-height:1.2;

  padding:36px 24px;
  border-radius:18px;

  background-image:url("https://therapeuticcoachingportal.com/wp-content/uploads/2026/01/Untitled-design.webp");
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;

  position:relative; /* for overlay */
  overflow:hidden;
}

#elementor-popup-modal-3113 #popupStepTitle::before{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(255,255,255,0.25);
  z-index:0;
}

#elementor-popup-modal-3113 #popupStepTitle{
  z-index:1;
}

#popupStepTitle {
  padding-bottom: 6px;
}

#popupStepHint {
  font-size: 12px !important;
  color: #2E2E2E !important;
  line-height: 1.4;
  font-weight: 400;
  opacity: 0.9;

  /* aligns visually with the title */
  padding-bottom: 14px;

  /* inherits the header background automatically */
}

#popupStepHint.is-hidden {
  display: none;
}
/* Keeps your existing title styling on .popup-step-title intact */

#popupStepTitle .popup-step-title-text{
  /* If your title is currently centred via .popup-step-title, leave this alone */
}

#popupStepTitle .popup-step-hint{
  margin-top: 6px;
  font-size: 15px;
  line-height: 1.4;
  font-weight: 400;
  opacity: 0.95;
}


/* -------------------------
   Buttons (replaces Elementor "selector" placeholder)
   ------------------------- */
#elementor-popup-modal-3113 .fluentform .ff-btn{
  background-color:#6a3f8e;
  color:#ffffff;
  border-radius:10px;
  padding:12px 22px;
  font-size:14px;
  font-weight:600;
  letter-spacing:0.02em;
  border:none;
  box-shadow:none;
  transition:background-color 0.2s ease;
  min-width:140px;
}

#elementor-popup-modal-3113 .fluentform .ff-btn:hover,
#elementor-popup-modal-3113 .fluentform .ff-btn:focus{
  background-color:#5a3477;
}

#elementor-popup-modal-3113 .fluentform .ff-btn-prev{
  background-color:#e6e6e6;
  color:#333333;
}

#elementor-popup-modal-3113 .fluentform .ff-btn-prev:hover{
  background-color:#d8d8d8;
}

#elementor-popup-modal-3113 .fluentform .ff-btn-submit{
  background-color:#f2b84b;
  color:#2e2e2e;
}

#elementor-popup-modal-3113 .fluentform .ff-btn-submit:hover{
  background-color:#e0a93f;
}

#elementor-popup-modal-3113 .fluentform .step-nav{
  margin-top:24px;
}

/* Last step alignment */
#elementor-popup-modal-3113 .fluentform .ff-step-t-container{
  display:flex !important;
  align-items:flex-end !important;
  justify-content:space-between !important;
  gap:16px;
}

#elementor-popup-modal-3113 .fluentform .ff-step-t-container .step-nav,
#elementor-popup-modal-3113 .fluentform .ff-step-t-container .ff_submit_btn_wrapper{
  display:flex !important;
  align-items:flex-end !important;
  margin:0 !important;
  padding:0 !important;
}

#elementor-popup-modal-3113 .fluentform .ff-step-t-container .ff-btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  line-height:1 !important;
  padding:14px 26px !important;
  margin:0 !important;
}

#elementor-popup-modal-3113 .fluentform .ff-step-t-container .ff_submit_btn_wrapper{
  position:relative;
  top:0 !important;
}

/* Small spacing polish for any h4+p blocks inside the form */
#elementor-popup-modal-3113 .ff-el-group h4{
  margin-bottom:0.25em;
}
#elementor-popup-modal-3113 .ff-el-group h4 + p{
  margin-top:0;
}
#elementor-popup-modal-3113 .nr-gate-active #popupVideoBlock {
  display: none !important;
}
#elementor-popup-modal-3113 .nr-gate-active #popupStepTitle {
  display: none !important;
}
/* Force the gate visible by default */
#elementor-popup-modal-3113 #nrEmailGate{
  display:block !important;
}

/* Force the form hidden until gate passes */
#elementor-popup-modal-3113 #nrFormWrap{
  display:none;
}
#elementor-popup-modal-3113.nr-gate-passed #nrFormWrap{
  display:block;
}
#elementor-popup-modal-3113.nr-gate-passed #nrEmailGate{
  display:none !important;
}

/* While gated: show video, hide title */
#elementor-popup-modal-3113:not(.nr-gate-passed) #popupVideoBlock{
  display:block !important;
}

#elementor-popup-modal-3113:not(.nr-gate-passed) #popupStepTitle{
  display:none !important;
}

/* Gate visible by default 
#elementor-popup-modal-3113 #nrEmailGate { display:block !important; }

/* Form hidden until gate passes */
/* #elementor-popup-modal-3113 #nrFormWrap { display:none !important; }
#elementor-popup-modal-3113.nr-gate-passed #nrFormWrap { display:block !important; }
#elementor-popup-modal-3113.nr-gate-passed #nrEmailGate { display:none !important; }*/


/* =========================================================
   New Roots Email Gate — match questionnaire styling
   Scoped to popup 3113 only
   ========================================================= */

#elementor-popup-modal-3113{
  /* Try to inherit Elementor global colours if present */
  --nr-primary: #6a3f8e;
  --nr-text: var(--e-global-color-text, #2E2E2E);
  --nr-muted: var(--e-global-color-secondary, #6b7280);
  --nr-border: rgba(0,0,0,.14);
  --nr-bg: #fff;
  --nr-radius: 10px;
}

/* Gate container */
#elementor-popup-modal-3113 #nrEmailGate.nr-email-gate{
  max-width: 520px;
  margin: 0 auto;
  padding: 8px 0 0;
  color: var(--nr-text);
  font-family: inherit;
}

/* Title */
#elementor-popup-modal-3113 .nr-email-title{
  font-size: 34px;
  line-height: 1.15;
  font-weight: 700;
  margin: 14px 0 22px;
  letter-spacing: -0.02em;
  color:  var(--nr-primary);
}

/* Labels */
#elementor-popup-modal-3113 .nr-email-label{
  display: block;
  font-size: 14px;
  font-weight: 600;
  color: var(--nr-text);
  margin: 0 0 14px;
}

/* Input fields */
#elementor-popup-modal-3113 .nr-email-input,
#elementor-popup-modal-3113 .nr-name-input{
  width: 100%;
  height: 44px;
  padding: 10px 14px;
  border: 1px solid var(--nr-border);
  border-radius: var(--nr-radius);
  background: var(--nr-bg);
  font-size: 16px;
  line-height: 1.2;
  outline: none;
  transition: border-color .15s ease, box-shadow .15s ease;
  box-sizing: border-box;
}

/* Focus style (subtle “form” focus like Fluent Forms) */
#elementor-popup-modal-3113 .nr-email-input:focus,
#elementor-popup-modal-3113 .nr-name-input:focus{
  border-color: color-mix(in srgb, var(--nr-primary) 55%, #ffffff);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--nr-primary) 18%, transparent);
}

/* Placeholder */
#elementor-popup-modal-3113 .nr-email-input::placeholder,
#elementor-popup-modal-3113 .nr-name-input::placeholder{
  color: rgba(31,42,55,.45);
}

/* First/Last name layout (if you wrap them) */
#elementor-popup-modal-3113 .nr-name-row{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-bottom: 6px;
}
@media (max-width: 520px){
  #elementor-popup-modal-3113 .nr-name-row{
    grid-template-columns: 1fr;
  }
}

/* Consent row */
#elementor-popup-modal-3113 .nr-consent{
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 12px 0 18px;
  font-size: 14px;
  color: var(--nr-text);
  user-select: none;
}

#elementor-popup-modal-3113 .nr-consent input[type="checkbox"]{
  width: 18px;
  height: 18px;
  accent-color: var(--nr-primary);
}

/* CTA Button — “Continue” vibe */
#elementor-popup-modal-3113 .nr-email-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 46px;
  padding: 0 22px;
  border: 0;
  border-radius: 8px;
  background: var(--nr-primary);
  color: #fff;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  font-size: 13px;
  cursor: pointer;
  transition: transform .06s ease, filter .15s ease, opacity .15s ease;
}

#elementor-popup-modal-3113 .nr-email-btn:hover{
  filter: brightness(.96);
}

#elementor-popup-modal-3113 .nr-email-btn:active{
  transform: translateY(1px);
}

#elementor-popup-modal-3113 .nr-email-btn:disabled{
  opacity: .55;
  cursor: not-allowed;
}

/* Error message (clean, not shouty) */
#elementor-popup-modal-3113 .nr-email-error{
  margin-top: 12px;
  color: #b42318;
  font-size: 13px;
  font-weight: 600;
}
/* ===========================
   Gate ↔ Form transition (Popup 3113)
   =========================== */

#elementor-popup-modal-3113 .dialog-message{
  overflow:hidden;
}

/* Keep both blocks in layout so transitions can run */
#elementor-popup-modal-3113 #nrEmailGate,
#elementor-popup-modal-3113 #nrFormWrap{
  display:block !important;
}

/* Default state: gate visible, form hidden */
#elementor-popup-modal-3113 #nrEmailGate{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
  transition:opacity .35s ease, transform .35s ease;
  will-change:opacity, transform;
}

#elementor-popup-modal-3113 #nrFormWrap{
  opacity:0;
  transform:translateY(10px);
  pointer-events:none;
  transition:opacity .35s ease, transform .35s ease;
  will-change:opacity, transform;
}

/* Passed: gate hidden, form visible */
#elementor-popup-modal-3113.nr-gate-passed #nrEmailGate{
  opacity:0;
  transform:translateY(-10px);
  pointer-events:none;
}

#elementor-popup-modal-3113.nr-gate-passed #nrFormWrap{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}

/* Hide header video/title while gated (optional; keep if you like) */
#elementor-popup-modal-3113:not(.nr-gate-passed) #popupVideoBlock,
#elementor-popup-modal-3113:not(.nr-gate-passed) #popupStepTitle{
  display:none !important;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  #elementor-popup-modal-3113 #nrEmailGate,
  #elementor-popup-modal-3113 #nrFormWrap{
    transition:none !important;
    transform:none !important;
  }
}
#elementor-popup-modal-3113 #nrEmailGate,
#elementor-popup-modal-3113 #nrFormWrap{
  backface-visibility: hidden;
  transform: translateZ(0);
}
/* ===========================
   SAFE SMOOTHING (Popup 3113)
   Does NOT alter .is-hidden logic
   =========================== */

/* Smooth gate -> form appearance */
#elementor-popup-modal-3113 #nrEmailGate,
#elementor-popup-modal-3113 #nrFormWrap{
  transition: opacity .28s ease, transform .28s ease;
  will-change: opacity, transform;
}

/* Default: gate visible, form hidden */
#elementor-popup-modal-3113 #nrEmailGate{
  opacity: 1;
  transform: translateY(0);
}

#elementor-popup-modal-3113 #nrFormWrap{
  opacity: 0;
  transform: translateY(10px);
  pointer-events: none;
}

/* After gate passed: gate fades, form appears */
#elementor-popup-modal-3113.nr-gate-passed #nrEmailGate{
  opacity: 0;
  transform: translateY(-10px);
  pointer-events: none;
}

#elementor-popup-modal-3113.nr-gate-passed #nrFormWrap{
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

/* IMPORTANT: do not allow old display:none rules to kill animation */
#elementor-popup-modal-3113 #nrFormWrap{
  display:block !important;
}

@media (max-width: 767px){

  /* Ensure the popup can scroll */
  #elementor-popup-modal-3113 .dialog-message{
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    max-height: 100vh;
    padding-bottom: 96px; /* space for sticky bar */
  }

  /* Sticky nav bar */
  #elementor-popup-modal-3113 .step-nav{
    position: sticky;
    bottom: 0;
    z-index: 9999;
    background: #fff;
    padding: 12px 16px;
    margin: 0;
    box-shadow: 0 -8px 18px rgba(0,0,0,.10);
  }

  /* Make the buttons behave nicely in a bar (no floats) */
  #elementor-popup-modal-3113 .step-nav::after{ content:""; display:block; clear:both; }

  #elementor-popup-modal-3113 .step-nav button{
    float: none !important;
    width: auto;
  }

  #elementor-popup-modal-3113 .step-nav{
    display: flex;
    gap: 12px;
    justify-content: space-between;
    align-items: center;
  }

  #elementor-popup-modal-3113 .step-nav [data-action="prev"],
  #elementor-popup-modal-3113 .step-nav [data-action="next"]{
    flex: 1;
    min-width: 0;
  }
}
/* =========================
   DESKTOP FIX — allow last step buttons to be clickable
   ========================= */

@media (min-width: 768px){

  /* Remove mobile-only padding */
  #elementor-popup-modal-3113 .dialog-message{
    padding-bottom: 0 !important;
    overflow-y: auto;
  }

  /* Return buttons to normal flow on desktop */
  #elementor-popup-modal-3113 .step-nav{
    position: static !important;
    box-shadow: none !important;
    background: transparent !important;
    padding: 0 !important;
    margin-top: 24px;
  }

}
@media (min-width: 768px){
  #elementor-popup-modal-3113 .dialog-message{
    max-height: 85vh;
  }
}
.ff-el-group.ff_submit_btn_wrapper {
  text-align: right !important;
}

#fluentform_4 .ff-el-input--label label {
  color: #2E2E2E !important;
}
#fluentform_4 .ff-step-header::before {
  content: "Your Progress" !important;
  display: block !important;
  margin-bottom: 6px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: #6a3f8e !important;
  text-align: center !important;
}
#expatAutoPdfStatus{
  color: #2E2E2E;
  font-size: 14px;
  line-height: 1.4;
}
/* Align final "See my results" button to the right */
#elementor-popup-modal-3113 
.fluentform 
.ff_submit_btn_wrapper {
  display: flex !important;
  justify-content: flex-end !important;
}
