////
/// Toggle Scheme
/// @group toggle
////

@use 'src/module/color';
@use 'src/module/disabled';

@mixin _toggle-scheme($legacy: false) {
  #{ns(toggle)} {
    label {
      @include color.text(label grey, (legacy:$legacy));

      @include before {
        @include color.text(active blue-france, (legacy:$legacy));
        @include color.data-uri-svg(border action-high blue-france, (legacy: $legacy), $toggle-unchecked-svg);
      }

      @include after {
        @include color.text(active blue-france, (legacy:$legacy));
        @include color.box-shadow(action-high blue-france, (legacy:$legacy), all-1-in);
        @include color.background(default grey, (legacy:$legacy));
      }
    }

    input[type="checkbox"] {
      @include color.box-shadow(action-high blue-france, (legacy:$legacy), all-1-in);

      &:checked {
        @include color.background(active blue-france, (legacy:$legacy));

        ~ #{ns(toggle__label)} {
          @include before {
            @include color.data-uri-svg((border active blue-france) (border active blue-france), (legacy: $legacy), $toggle-checked-svg);
          }

          @include after {
            @include color.data-uri-svg(active blue-france, (legacy: $legacy), $toggle-svg);
          }
        }
      }

      @include disabled.selector((), (legacy: $legacy, box-shadow: true)) {
        &:checked {
          @include disabled.colors((legacy: $legacy, background: true));

          ~ #{ns(toggle__label)} {
            @include before {
              @include color.data-uri-svg((background disabled grey) (background disabled grey), (legacy: $legacy), $toggle-checked-svg);
            }

            @include after {
              @include color.data-uri-svg(text disabled grey, (legacy: $legacy), $toggle-svg);
            }
          }
        }

        ~ #{ns(toggle__label)} {
          @include before {
            @include disabled.colors((legacy: $legacy, text: true));
            @include color.data-uri-svg((background disabled grey), (legacy: $legacy), $toggle-unchecked-svg);
          }

          @include after {
            @include disabled.colors((legacy: $legacy, text: true, box-shadow: true));
          }
        }
      }
    }

    #{ns(hint-text)} {
      @include color.text(mention grey, (legacy:$legacy));
    }

    &--border-bottom {
      @include color.box-shadow(default grey, (legacy:$legacy), bottom-1-in);
    }

    &--valid {
      @include before('') {
        @include color.background(border plain success, (legacy:$legacy));
      }
    }

    &--error {
      @include before('') {
        @include color.background(border plain error, (legacy:$legacy));
      }
    }
  }

  #{ns(toggle--error)},
  #{ns(fieldset--error)} #{ns(toggle)} {
    label {
      @include color.text(default error, (legacy:$legacy));

      @include before {
        @include color.text(default error, (legacy:$legacy));
        @include color.data-uri-svg(border plain error, (legacy: $legacy), $toggle-unchecked-svg);
      }

      @include after {
        @include color.box-shadow(border plain error, (legacy:$legacy), all-1-in);
      }
    }

    input[type="checkbox"] {
      &:checked {
        ~ #{ns(toggle__label)} {
          @include before {
            @include color.data-uri-svg((border plain error) (active blue-france), (legacy: $legacy), $toggle-checked-svg);
          }
        }
      }
    }
  }

  #{ns(toggle--valid)},
  #{ns(fieldset--valid)} #{ns(toggle)} {
    label {
      @include color.text(default success, (legacy:$legacy));

      @include before {
        @include color.text(default success, (legacy:$legacy));
        @include color.data-uri-svg(border plain success, (legacy: $legacy), $toggle-unchecked-svg);
      }

      @include after {
        @include color.box-shadow(border plain success, (legacy:$legacy), all-1-in);
      }
    }

    input[type="checkbox"] {
      &:checked {
        ~ #{ns(toggle__label)} {
          @include before {
            @include color.data-uri-svg((border plain success) (active blue-france), (legacy: $legacy), $toggle-checked-svg);
          }
        }
      }
    }
  }
}