.elementor-163 .elementor-element.elementor-element-8140695{--display:flex;--min-height:calc(100vh - 140px);--justify-content:center;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--padding-top:60px;--padding-bottom:60px;--padding-left:60px;--padding-right:60px;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-163 .elementor-element.elementor-element-32049eb .ts-login-head span.vx-step-title{font-size:33px;}.elementor-163 .elementor-element.elementor-element-32049eb .ts-login .ts-btn-2{border-radius:50px;color:#FFFFFF;background:#0058FF;}.elementor-163 .elementor-element.elementor-element-32049eb .ts-login .ts-btn-2 i{color:#FFFFFF;}.elementor-163 .elementor-element.elementor-element-32049eb .ts-login .ts-btn-2 svg{fill:#FFFFFF;}.elementor-163 .elementor-element.elementor-element-32049eb .ts-login .ts-btn-2:hover{background:var( --e-global-color-0d1f28c );}.elementor-163 .elementor-element.elementor-element-32049eb .ts-login .ts-google-btn{border-radius:5px;}.elementor-163 .elementor-element.elementor-element-32049eb div.ts-filter i{font-size:24px;}.elementor-163 .elementor-element.elementor-element-32049eb div.ts-filter svg{width:24px;height:24px;min-width:24px;}.elementor-163 .elementor-element.elementor-element-32049eb div.ts-filter{grid-gap:10px;}.elementor-163 .elementor-element.elementor-element-32049eb .ts-welcome-message{align-items:center;text-align:center;}@media(max-width:1024px){.elementor-163 .elementor-element.elementor-element-8140695{--padding-top:40px;--padding-bottom:100px;--padding-left:40px;--padding-right:40px;}}@media(min-width:768px){.elementor-163 .elementor-element.elementor-element-8140695{--content-width:500px;}}@media(max-width:767px){.elementor-163 .elementor-element.elementor-element-8140695{--justify-content:flex-start;--padding-top:30px;--padding-bottom:100px;--padding-left:30px;--padding-right:30px;}}/* Start custom CSS for ts-login, class: .elementor-element-32049eb *//* ============================================
   UNIFIED TOGGLE SWITCH STYLES
   Both switches will look exactly the same
   ============================================ */

/* FIRST SWITCH - onoffswitch */
.onoffswitch {
  position: relative;
  display: inline-block;
  width: 46px;
  height: 26px;
}

.onoffswitch input[type="checkbox"] {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  border: 0;
  padding: 0;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  overflow: hidden;
  white-space: nowrap;
}

.onoffswitch .onoffswitch-label {
  display: block;
  overflow: hidden;
  cursor: pointer;
  width: 46px;
  height: 26px;
  padding: 0;
  line-height: 21px;
  background: #e4e4e6;
  border-radius: 36px;
  transition: background-color .14s ease-in;
  position: relative;
}

/* Knob for first switch */
.onoffswitch .onoffswitch-label::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 3px;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  background: #fff;
  border-radius: 50%;
  border: 1px solid rgba(0, 0, 0, .05);
  box-shadow: 0 2px 4px rgba(0, 0, 0, .18);
  z-index: 2;
  transition: left .2s ease;
}

/* ON state for first switch */
.onoffswitch input[type="checkbox"]:checked + .onoffswitch-label {
  background: #0b5cff;
}

.onoffswitch input[type="checkbox"]:checked + .onoffswitch-label::before {
  left: calc(100% - 3px - 20px);
}

/* Focus state for first switch */
.onoffswitch input[type="checkbox"]:focus-visible + .onoffswitch-label {
  box-shadow: 0 0 0 3px rgba(11, 92, 255, .25);
}

/* ============================================ */

/* SECOND SWITCH - T&C switch (already styled correctly) */
.ts-form .ts-form-group.tos-group .container-checkbox {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  line-height: 1;
}

.ts-form .ts-form-group.tos-group .container-checkbox input[type="checkbox"] {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  border: 0;
  padding: 0;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  overflow: hidden;
  white-space: nowrap;
}

/* TRACK */
.ts-form .ts-form-group.tos-group .container-checkbox .checkmark {
  position: relative !important;
  display: inline-block !important;
  width: 46px !important;
  height: 26px !important;
  padding: 0;
  line-height: 21px;
  background: #e4e4e6 !important;
  border: none !important;
  border-radius: 36px !important;
  box-shadow: none !important;
  overflow: hidden !important;
  transition: background-color .14s ease-in;
}

/* KNOB */
.ts-form .ts-form-group.tos-group .container-checkbox .checkmark::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 3px;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  background: #fff;
  border-radius: 50%;
  border: 1px solid rgba(0, 0, 0, .05);
  box-shadow: 0 2px 4px rgba(0, 0, 0, .18);
  z-index: 2;
  transition: left .2s ease;
}

.ts-form .ts-form-group.tos-group .container-checkbox .checkmark::after {
  content: none !important;
}

.ts-form .ts-form-group.tos-group .container-checkbox .checkmark svg,
.ts-form .ts-form-group.tos-group .container-checkbox .checkmark i {
  display: none !important;
}

/* ON state */
.ts-form .ts-form-group.tos-group .container-checkbox input[type="checkbox"]:checked + .checkmark {
  background: #0b5cff !important;
  border-color: #0b5cff !important;
}

.ts-form .ts-form-group.tos-group .container-checkbox input[type="checkbox"]:checked + .checkmark::before {
  left: calc(100% - 3px - 20px);
}

/* Focus ring */
.ts-form .ts-form-group.tos-group .container-checkbox input[type="checkbox"]:focus-visible + .checkmark {
  box-shadow: 0 0 0 3px rgba(11, 92, 255, .25) !important;
}


/* ============================================
   ALTERNATIVE OPTION 2: Make both switches display with text BELOW the toggle (vertical)
   Uncomment this section and comment out Option 1 if you prefer vertical layout
   ============================================ */


.ts-form-group.switcher-label > label,
.ts-form .ts-form-group > label {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  font-size: var(--e-global-typography-text-font-size);
  color: var(--ts-shade-1);
  white-space: normal;
  text-overflow: ellipsis;
  overflow: hidden;
}

.ts-form .ts-form-group.tos-group {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
}

.ts-form .ts-form-group.tos-group .container-checkbox {
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  line-height: 1;
}

.ts-login .ts-form-group p.field-info {
  font-size: var(--e-global-typography-text-font-size);
  color: var(--ts-shade-1);
  white-space: normal;
  text-overflow: ellipsis;
  overflow: hidden;
  margin: 0;
  width: 100%;
}
*/eld-info {
  font-size: var(--e-global-typography-text-font-size);
  display: flex;
  flex-wrap: wrap;
  text-overflow: ellipsis;
  color: var(--ts-shade-1);
  white-space: normal;
  gap: 5px; /* Modern property that replaces grid-gap/row-gap/column-gap */
  align-items: center;
  overflow: hidden;
}/* End custom CSS */