/* 
Theme Name: Epool
Theme URI: https://epool.de/
Description: 
Author: OptiTrust IT Services GmbH
Author URI: https://optitrust.io/
Template: hello-elementor
Version: 2.0.0
Text Domain: epool
*/

@media (min-width: 1024px){
.epool-form-holder.epool-multistep .gform_page.swiper-slide{
	padding: 0px 10px!important;
	overflow: unset !important;
}

.epool-form-holder.epool-multistep .gf_progressbar_wrapper{
	padding: 0px 10px!important;
}
}

.epool-form-holder.epool-multistep form .gfield.gfield--type-image_choice .validation_message{
	margin-top: 20px !important;
}

.epool-form-holder.epool-multistep form .gfield .validation_message{
	margin-top: 7px !important;
}

/* Layout: label left, switch right */
#helperTextToggle.pt-toggle {
	display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: 0;
    border: 0;
    float: right;
}

/* Keep Gravity Forms spacing predictable */
#helperTextToggle .ginput_container_checkbox{
  margin: 0;
  flex: 0 0 auto; /* don't stretch the switch area */
}

/* Right-align the choice wrapper so the switch hugs the right edge */
#helperTextToggle .gchoice_helpText {
  display: flex;
  justify-content: flex-end;
}

/* Hide the real checkbox (still accessible via the <label for=...>) */
#helperTextToggle .gfield-choice-input  {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* Switch track (shadcn-like) */
#helperTextToggle #label_helpText  {
  /* visually hide the text content "True" */
  font-size: 0;

  position: relative;
  display: inline-flex;
  align-items: center;
  width: 42px;              /* track width */
  height: 24px;             /* track height */
  border-radius: 9999px;    /* fully rounded */
  background: #e5e7eb;      /* neutral track */
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.08);
  cursor: pointer;
  transition: background-color .2s ease, box-shadow .2s ease;
}

/* Thumb */
#helperTextToggle #label_helpText::after {
  content: "";
  position: absolute;
  left: 2px;
  top: 2px;
  width: 20px;
  height: 20px;
  border-radius: 9999px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0,0,0,.25);
  transition: transform .2s ease;
  will-change: transform;
}

/* Checked (active) state — use the requested orange */
#helperTextToggle .gfield-choice-input:checked + #label_helpText {
  background: #e9560c;
}

#helperTextToggle .gfield-choice-input:checked + #label_helpText::after {
  transform: translateX(18px);
}

/* Focus-visible ring (shadcn-esque) */
#helperTextToggle .gfield-choice-input:focus-visible + #label_helpText{
  box-shadow:
    0 0 0 2px #fff,
    0 0 0 4px rgba(233, 86, 12, .6);
  outline: none;
}

/* Disabled look (optional) */
#helperTextToggle .gfield-choice-input:disabled + #label_helpText {
  opacity: .5;
  cursor: not-allowed;
}

/*******************************************/
/*******************************************/
/* ===== Toggle layout: label left, switch right ===== */
.gfield--type-checkbox.pt-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: .75rem;
    padding: 0;
    border: 0;
    width: 100%;
    flex-direction: row-reverse;
}

.gfield--type-checkbox.pt-toggle .gform-field-label{margin-bottom: 0!important;}

/* Keep GF spacing predictable; don't let the switch area stretch */
.gfield--type-checkbox.pt-toggle .ginput_container_checkbox {
  margin: 0;
  flex: 0 0 auto;
}

/* Right-align the choice wrapper so the switch hugs the right edge */
.gfield--type-checkbox.pt-toggle .gfield_checkbox {
  display: flex;
  justify-content: flex-end;
}

/* Remove extra margins Gravity Forms may add on the choice */
.gfield--type-checkbox.pt-toggle .gchoice {
  margin: 0;
}

/* ===== Hide the native checkbox (still accessible via label[for]) ===== */
.gfield--type-checkbox.pt-toggle .gfield-choice-input {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* ===== Switch track (style the inline label as the control) ===== */
.gfield--type-checkbox.pt-toggle .gform-field-label--type-inline {
  /* visually hide the text content "True" */
  font-size: 0;

  position: relative;
  display: inline-flex;
  align-items: center;
  width: 42px;              /* track width */
  height: 24px;             /* track height */
  border-radius: 9999px;    /* fully rounded */
  background: #e5e7eb;      /* neutral track */
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.08);
  cursor: pointer;
  transition: background-color .2s ease, box-shadow .2s ease;
}

/* Thumb */
.gfield--type-checkbox.pt-toggle .gform-field-label--type-inline::after {
  content: "";
  position: absolute;
  left: 2px;
  top: 2px;
  width: 20px;
  height: 20px;
  border-radius: 9999px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0,0,0,.25);
  transition: transform .2s ease;
  will-change: transform;
}

/* ===== Checked (active) state — orange track ===== */
.gfield--type-checkbox.pt-toggle .gfield-choice-input:checked + .gform-field-label--type-inline {
  background: #e9560c;
}

.gfield--type-checkbox.pt-toggle .gfield-choice-input:checked + .gform-field-label--type-inline::after {
  transform: translateX(18px);
}

/* ===== Focus-visible ring for keyboard users ===== */
.gfield--type-checkbox.pt-toggle .gfield-choice-input:focus-visible + .gform-field-label--type-inline {
  box-shadow:
    0 0 0 2px #fff,
    0 0 0 4px rgba(233, 86, 12, .6);
  outline: none;
}

/* ===== Disabled look (optional) ===== */
.gfield--type-checkbox.pt-toggle .gfield-choice-input:disabled + .gform-field-label--type-inline {
  opacity: .5;
  cursor: not-allowed;
}
