/* =====================================================
   FLUENT FORMS PRO - JCTGBTG DARK THEME
===================================================== */

.fluentform,
.frm-fluent-form{
  background:#0c0c0d;
  color:#ffffff;
  font-family:Inter, Arial, sans-serif;
}

/* spacing */
.fluentform .ff-el-group{
  margin-bottom:18px;
}

/* labels */
.fluentform label,
.fluentform .ff-el-input--label label{
  color:#d1d5db;
  font-size:13px;
  font-weight:800;
  letter-spacing:normal;
  text-transform:none;
}

/* standard fields */
.fluentform input,
.fluentform textarea,
.fluentform select,
.fluentform .ff-el-form-control{
  width:100%;
  min-height:44px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:#111111 !important;
  color:#ffffff !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.02);
}

.fluentform input,
.fluentform select,
.fluentform .ff-el-form-control{
  height:44px;
}

.fluentform textarea,
.fluentform textarea.ff-el-form-control{
  height:auto;
  min-height:120px;
  border-radius:20px;
  padding:14px 16px;
}

.fluentform option{
  background:#111111;
  color:#ffffff;
}

/* placeholders */
.fluentform input::placeholder,
.fluentform textarea::placeholder,
.fluentform .choices__input::placeholder,
.fluentform .choices__input--cloned::placeholder,
.frm-fluent-form input::placeholder,
.frm-fluent-form textarea::placeholder{
  color:rgba(255,255,255,.78) !important;
  opacity:1 !important;
}

.fluentform input::-moz-placeholder,
.fluentform textarea::-moz-placeholder{
  color:rgba(255,255,255,.78) !important;
  opacity:1 !important;
}

/* focus */
.fluentform input:focus,
.fluentform textarea:focus,
.fluentform select:focus,
.fluentform .ff-el-form-control:focus{
  border-color:#d4af37 !important;
  outline:none !important;
  box-shadow:0 0 0 3px rgba(212,175,55,.18) !important;
}

/* v3.38.657 — GLOBAL FLUENT FORMS SELECT FIX (Safari + Chrome).
   Remove native menulist chrome so dropdowns retain the same full pill shape everywhere. */
.fluentform select,
.frm-fluent-form select,
.fluentform select.ff-el-form-control{
  box-sizing:border-box !important;
  width:100% !important;
  height:44px !important;
  min-height:44px !important;
  max-height:44px !important;

  appearance:none !important;
  -webkit-appearance:none !important;
  -moz-appearance:none !important;

  background-color:#111111 !important;
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;

  border:1px solid rgba(255,255,255,.12) !important;
  border-radius:999px !important;

  color-scheme:dark !important;
  padding:0 40px 0 16px !important;
  line-height:44px !important;

  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' fill='none' stroke='%23ffffff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat:no-repeat !important;
  background-position:right 16px center !important;
  background-size:12px 8px !important;
}

/* dropdown options */
.fluentform select option,
.frm-fluent-form select option{
  background:#111111 !important;
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
}

/* focus */
.fluentform select:focus,
.frm-fluent-form select:focus{
  border-color:#d4af37 !important;
  box-shadow:0 0 0 3px rgba(212,175,55,.18) !important;
  outline:none !important;
}

/* =====================================================
   BUTTONS
===================================================== */

.fluentform .ff-btn-submit,
.fluentform button[type="submit"],
.fluentform input[type="submit"],
.fluentform .ff-btn-next,
.fluentform .ff-btn-prev,
.fluentform .ff_step_nav button,
.fluentform .ff-step-nav button,
.fluentform .ff-btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  height:38px !important;
  min-width:110px !important;
  padding:0 14px !important;
  border:0 !important;
  border-radius:999px !important;
  background:#ffffff !important;
  color:#111111 !important;
  font-size:12px !important;
  font-weight:900 !important;
  line-height:1 !important;
  text-transform:none !important;
  letter-spacing:normal !important;
  cursor:pointer !important;
  transition:background .2s ease, color .2s ease;
}

.fluentform .ff-btn-submit:hover,
.fluentform button[type="submit"]:hover,
.fluentform input[type="submit"]:hover,
.fluentform .ff-btn-next:hover,
.fluentform .ff-btn-prev:hover,
.fluentform .ff_step_nav button:hover,
.fluentform .ff-step-nav button:hover,
.fluentform .ff-btn:hover{
  background:#d4af37 !important;
  color:#111111 !important;
}

/* =====================================================
   ERRORS / SUCCESS
===================================================== */

.fluentform .ff-el-is-error input,
.fluentform .ff-el-is-error textarea,
.fluentform .ff-el-is-error select{
  border-color:#ef4444 !important;
}

.fluentform .error,
.fluentform .ff-el-is-error .text-danger,
.fluentform .ff-el-is-error .ff-el-help-message{
  color:#fecaca !important;
  font-size:12px;
}

.fluentform .ff-message-success{
  background:rgba(50,213,131,.14);
  color:#9ff6c1;
  border:1px solid rgba(50,213,131,.28);
  border-radius:18px;
  padding:14px 18px;
}

/* =====================================================
   SECTIONS / HEADINGS
===================================================== */

.fluentform .ff-el-section-title{
  color:#ffffff;
  font-weight:900;
}

.fluentform .ff-el-section-break,
.fluentform .ff-el-input--content{
  color:#d1d5db;
}

/* =====================================================
   CHOICES.JS MULTISELECT - CLEAN VERSION
===================================================== */

.fluentform .choices{
  width:100% !important;
  min-height:44px !important;
  height:auto !important;
  border:1px solid rgba(255,255,255,.12) !important;
  border-radius:22px !important;
  background:#111111 !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.02) !important;
  margin-top:8px !important;
  overflow:visible !important;
}

.fluentform .choices__inner{
  min-height:42px !important;
  height:auto !important;
  padding:7px 14px !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  display:flex !important;
  align-items:flex-start !important;
  overflow:visible !important;
}

.fluentform .choices__list--multiple{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  gap:6px !important;
  margin:0 !important;
  padding:0 !important;
  overflow:visible !important;
  width:100% !important;
}

.fluentform .choices__list--multiple .choices__item{
  margin:0 !important;
  padding:7px 10px !important;
  min-height:28px !important;
  height:auto !important;
  line-height:1.25 !important;
  background:#d4af37 !important;
  color:#111111 !important;
  border:0 !important;
  border-radius:999px !important;
  font-weight:800 !important;
  max-width:100% !important;
  white-space:normal !important;
}

.fluentform .choices__input,
.fluentform .choices__input--cloned,
.fluentform input.choices__input,
.fluentform input.choices__input--cloned{
  height:28px !important;
  min-height:28px !important;
  line-height:28px !important;
  margin:0 !important;
  padding:0 !important;
  border:none !important;
  box-shadow:none !important;
  outline:none !important;
  background:transparent !important;
  color:#ffffff !important;
  min-width:180px !important;
}

/* choices dropdown */
.fluentform .choices__list--dropdown,
.fluentform .choices__list[aria-expanded]{
  background:#111111 !important;
  color:#ffffff !important;
  border:1px solid rgba(255,255,255,.12) !important;
  border-radius:18px !important;
  overflow:hidden !important;
  z-index:9999 !important;
}

.fluentform .choices__list--dropdown .choices__item,
.fluentform .choices__list[aria-expanded] .choices__item{
  color:#ffffff !important;
  padding:10px 14px !important;
  font-size:13px !important;
}

.fluentform .choices__item--choice:hover,
.fluentform .choices__item--selectable.is-highlighted{
  background:#d4af37 !important;
  color:#111111 !important;
}

/* remove choices arrows */
.fluentform .choices::after,
.fluentform .choices[data-type*="select-one"]::after,
.fluentform .choices[data-type*="select-multiple"]::after{
  display:none !important;
  content:none !important;
}

/* =====================================================
   CHECKBOXES / RADIO
===================================================== */

.fluentform input[type="checkbox"]{
  appearance:none;
  -webkit-appearance:none;
  width:20px !important;
  height:20px !important;
  min-height:20px !important;
  border-radius:6px !important;
  border:1px solid rgba(255,255,255,.18) !important;
  background:#111111 !important;
  display:inline-grid;
  place-content:center;
  cursor:pointer;
  vertical-align:middle;
  position:relative;
  margin-right:8px;
}

.fluentform input[type="checkbox"]::after{
  content:"✓";
  font-size:13px;
  font-weight:900;
  color:#111111;
  transform:scale(0);
  transition:transform .15s ease;
  line-height:1;
}

.fluentform input[type="checkbox"]:checked{
  background:#d4af37 !important;
  border-color:#d4af37 !important;
}

.fluentform input[type="checkbox"]:checked::after{
  transform:scale(1);
}

.fluentform input[type="checkbox"]:focus{
  outline:none !important;
  box-shadow:0 0 0 3px rgba(212,175,55,.18) !important;
}

.fluentform input[type="radio"]{
  accent-color:#d4af37;
}

/* =====================================================
   ACCORDION
===================================================== */

.fluentform .ff-accordion,
.frm-fluent-form .ff-accordion{
  border:1px solid rgba(255,255,255,.08) !important;
  border-radius:18px !important;
  overflow:hidden !important;
  background:#111111 !important;
  margin-bottom:14px !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.02) !important;
}

.fluentform .ff-accordion-item,
.frm-fluent-form .ff-accordion-item{
  border-bottom:1px solid rgba(255,255,255,.06) !important;
  background:#111111 !important;
}

.fluentform .ff-accordion-item:last-child,
.frm-fluent-form .ff-accordion-item:last-child{
  border-bottom:0 !important;
}

.fluentform .ff-accordion-header,
.fluentform .ff-accordion-title,
.fluentform .ff-accordion-button,
.frm-fluent-form .ff-accordion-header,
.frm-fluent-form .ff-accordion-title,
.frm-fluent-form .ff-accordion-button{
  width:100% !important;
  background:#111111 !important;
  color:#ffffff !important;
  padding:12px 14px !important;
  font-size:13px !important;
  font-weight:800 !important;
  border:0 !important;
  text-align:left !important;
  line-height:1.3 !important;
  box-shadow:none !important;
}

.fluentform .ff-accordion-header:hover,
.fluentform .ff-accordion-title:hover,
.fluentform .ff-accordion-button:hover,
.fluentform .ff-accordion-item.active .ff-accordion-header,
.fluentform .ff-accordion-item.active .ff-accordion-title,
.fluentform .ff-accordion-item.active .ff-accordion-button{
  background:#181818 !important;
  color:#d4af37 !important;
}

.fluentform .ff-accordion-content,
.fluentform .ff-accordion-body,
.frm-fluent-form .ff-accordion-content,
.frm-fluent-form .ff-accordion-body{
  background:#0f0f0f !important;
  color:#ffffff !important;
  padding:12px 14px !important;
  font-size:13px !important;
  line-height:1.45 !important;
}

.fluentform .ff-accordion-header:before,
.fluentform .ff-accordion-header:after,
.fluentform .ff-accordion-title:before,
.fluentform .ff-accordion-title:after,
.fluentform .ff-accordion-button:before,
.fluentform .ff-accordion-button:after,
.frm-fluent-form .ff-accordion-header:before,
.frm-fluent-form .ff-accordion-header:after,
.frm-fluent-form .ff-accordion-title:before,
.frm-fluent-form .ff-accordion-title:after,
.frm-fluent-form .ff-accordion-button:before,
.frm-fluent-form .ff-accordion-button:after{
  display:none !important;
  content:none !important;
}

/* =====================================================
   SMALL FIELD FIXES
===================================================== */

.fluentform .ff-el-group:has(input[type="tel"]) .ff-el-input--label,
.fluentform .ff-el-group:has(input[name*="mobile_number"]) .ff-el-input--label,
.fluentform .ff-el-group:has(input[name*="phone"]) .ff-el-input--label{
  margin-bottom:-8px !important;
  display:block !important;
}

/* =====================================================
   MOBILE
===================================================== */

@media(max-width:768px){

  .fluentform .choices__list--multiple{
    flex-direction:column !important;
    align-items:stretch !important;
  }

  .fluentform .choices__list--multiple .choices__item{
    width:100% !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
  }

  .fluentform .choices__input,
  .fluentform .choices__input--cloned{
    width:100% !important;
    min-width:100% !important;
  }

  .fluentform .ff-btn-submit,
  .fluentform button[type="submit"],
  .fluentform input[type="submit"],
  .fluentform .ff-btn-next,
  .fluentform .ff-btn-prev,
  .fluentform .ff_step_nav button,
  .fluentform .ff-step-nav button,
  .fluentform .ff-btn{
    width:100% !important;
  }
}

/* =====================================
   CLEAN FIX: MULTISELECT (BALANCED)
===================================== */

.fluentform .choices{
  width:100% !important;
  min-height:44px !important;
  border-radius:22px !important;
  background:#111 !important;
  border:1px solid rgba(255,255,255,.12) !important;
  padding:4px 10px !important;
}

/* container */
.fluentform .choices__inner{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:center !important;
  gap:6px !important;
  padding:4px 0 !important;
  min-height:34px !important;
}

/* selected pills */
.fluentform .choices__list--multiple .choices__item{
  background:#d4af37 !important;
  color:#111 !important;
  border-radius:999px !important;
  padding:6px 10px !important;
  font-size:12px !important;
  font-weight:800 !important;
  line-height:1 !important;
  white-space:nowrap !important;
}

/* IMPORTANT: input behavior */
.fluentform .choices__input,
.fluentform .choices__input--cloned{
  flex:1 !important;
  min-width:120px !important;
  height:28px !important;
  background:transparent !important;
  color:#fff !important;
  border:none !important;
  outline:none !important;
  padding:0 !important;
  margin:0 !important;
}

/* placeholder fix */
.fluentform .choices__input::placeholder{
  text-align:left !important;
  color:rgba(255,255,255,.75) !important;
}

/* dropdown */
.fluentform .choices__list--dropdown{
  background:#111 !important;
  border-radius:16px !important;
  border:1px solid rgba(255,255,255,.12) !important;
}

.fluentform .choices__item--choice:hover{
  background:#d4af37 !important;
  color:#111 !important;
}

/* =====================================
   FIX: NEXT / PREVIOUS BUTTON SPACING (MOBILE)
===================================== */

@media(max-width:768px){

  /* make buttons stack nicely */
  .fluentform .ff-step-nav,
  .fluentform .ff_step_nav{
    display:flex !important;
    flex-direction:column !important;
    gap:10px !important;
  }

  /* ensure full width but spaced */
  .fluentform .ff-btn-next,
  .fluentform .ff-btn-prev,
  .fluentform .ff-btn{
    width:100% !important;
    margin:0 !important;
  }

  /* fallback spacing (in case gap fails) */
  .fluentform .ff-btn-prev{
    margin-bottom:20px !important;
  }

}


/* Suite mobile invariant: text-entry controls stay >=16px to prevent iOS zoom. */
@media(max-width:768px){
  .fluentform input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
  .fluentform textarea,
  .fluentform select,
  .fluentform .ff-el-form-control,
  .fluentform .choices__input,
  .fluentform .choices__input--cloned,
  .frm-fluent-form input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
  .frm-fluent-form textarea,
  .frm-fluent-form select,
  .frm-fluent-form .ff-el-form-control{
    font-size:16px !important;
  }
}