/*
* Licensed to the Apache Software Foundation (ASF) under one or more
* contributor license agreements.  See the NOTICE file distributed with
* this work for additional information regarding copyright ownership.
* The ASF licenses this file to You under the Apache License, Version 2.0
* (the "License"); you may not use this file except in compliance with
* the License.  You may obtain a copy of the License at
*
*     http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/

/* Inputs */
@mixin fds-input-element-theme($theme) {
  $primaryColor: map-get(map-get($theme, primary), 500);
  $primaryColorHover: map-get(map-get($theme, primary), 100);
  $accentColor: map-get(map-get($theme, accent), 500);
  $accentColorHover: map-get(map-get($theme, accent), 100);

  body[fds] .mat-input-container {
    min-width: 200px;
  }

  body[fds] .mat-input-wrapper {
    margin: 0;
    padding-bottom: 0;
  }

  body[fds] input.mat-input-element, body[fds] textarea.mat-input-element {
    border-radius: 2px;
    color: $grey2;
    border: 1px solid $grey8;
    height: 32px;
    padding: 0px 10px;
    width: calc(100% - 20px);
    background-color: white;
  }

  body[fds] textarea.mat-input-element {
    padding: 10px 10px;
  }

  body[fds] input.mat-input-element[disabled], body[fds] textarea.mat-input-element[disabled] {
    background: $grey9;
    color: $grey10;
    border: 1px solid $grey9;
  }

  body[fds] .mat-input-subscript-wrapper {
    margin-top: 18px;
    width: calc(100% - 23px);
  }

  body[fds] input.mat-input-element:focus, body[fds] textarea.mat-input-element:focus {
    border-color: $accentColor;
  }

  body[fds] .mat-input-underline {
    display: none;
  }

  body[fds] .mat-input-placeholder {
    font-size: 14px;
    color: $grey3;
    font-weight: 300;
  }

  body[fds] .mat-form-field-empty.mat-form-field-label {
    top: 29px;
    left: 10px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: calc(100% - 44px);
  }

  body[fds] mat-input-container.mat-focused .mat-input-placeholder {
    transform: translateY(-26px) translateX(-10px) scale(0.75);
  }

  body[fds] .mat-form-field-can-float.mat-form-field-should-float .mat-form-field-placeholder {
    transform: translateY(-26px) translateX(-10px) scale(.75);
  }

  body[fds] .mat-form-field-can-float .mat-form-field-autofill-control:-webkit-autofill + .mat-form-field-placeholder-wrapper .mat-form-field-placeholder {
    transform: translateY(-26px) translateX(-10px) scale(.75);
  }

  body[fds] .input-button {
    top: -3px;
    border-left: none !important;
  }

  body[fds] .input-button.mat-raised-button[disabled] {
    opacity: 1;
  }

  body[fds] .mat-hint {
    color: $grey3;
  }
}