/*
 * shop-css.scss
 * -----------------------------------------------
*/


@mixin form-control() {
  display: block;
  width: 100%;
  height: $input-height;
  padding: $input-padding-y $input-padding-x;
  font-size: $font-size-base;
  line-height: $input-line-height;
  color: $input-color;
  background-color: $input-bg;
  background-clip: padding-box;
  border: $input-border-width solid $input-border-color;

  // Note: This has no effect on <select>s in some browsers, due to the limited stylability of `<select>`s in CSS.
  @if $enable-rounded {
  // Manually use the if/else instead of the mixin to account for iOS override
  border-radius: $input-border-radius;
  } @else {
  // Otherwise undo the iOS default
  border-radius: 0;
  }

  @include box-shadow($input-box-shadow);
  @include transition($input-transition);

  // Unstyle the caret on `<select>`s in IE10+.
  &::-ms-expand {
  background-color: transparent;
  border: 0;
  }

  // Customize the `:focus` state to imitate native WebKit styles.
  //@include form-control-focus();

  // Placeholder
  &::placeholder {
  color: $input-placeholder-color;
  // Override Firefox's unusual default opacity; see https://github.com/twbs/bootstrap/pull/11526.
  opacity: 1;
  }

  // Disabled and read-only inputs
  //
  // HTML5 says that controls under a fieldset > legend:first-child won't be
  // disabled if the fieldset is disabled. Due to implementation difficulty, we
  // don't honor that edge case; we style them as disabled anyway.
  &:disabled,
  &[readonly] {
  background-color: $input-disabled-bg;
  // iOS fix for unreadable disabled content; see https://github.com/twbs/bootstrap/issues/11655.
  opacity: 1;
  }
  height: calc(2.25rem + 9px);
  padding: 8px 16px;
  outline: 0;
  &::placeholder {
    color: #686a6f;
    opacity: 1;
  }
  &:-ms-input-placeholder {
    color: #686a6f;
  }
  &::-ms-input-placeholder {
    color: #686a6f;
  }
}
.woocommerce {
  .button {
    //.button();
  }
  .woocommerce-Input {
    @include form-control();
  }
  .woocommerce-form-row {
    margin-left: 0;
    margin-right: 0;
  }
  
}
.woocommerce {
  .woocommerce-form-login {
    .input-text {
      @include form-control();
    }
    .input-text {
      &:active, &:focus {
        box-shadow: 0 0 0 2px var(--theme-color1);
      }
    }
  }
  
}