/*
 * Copyright (c) 2008-2016 Haulmont.
 *
 * Licensed 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.
 *
 */

@mixin halo-cuba-fileupload($primary-stylename: c-fileupload) {
  .#{$primary-stylename} {
    position: relative;

    .v-button {
      @include box-defaults;

      .v-mac & {
        // workaround to prevent appearing of empty system tooltip
        z-index: 5;
      }
    }
  }

  .#{$primary-stylename}:hover .v-button {
    &:after {
      @if $v-background-color {
        $bg: darken($v-background-color, 25%);
        @if is-dark-color($v-background-color) {
          $bg: lighten($v-background-color, 15%);
        }
        background-color: rgba($bg, .1);
      }
    }
  }

  .#{$primary-stylename} .v-button-focus {
      &:after {
        @include valo-button-focus-style($v-background-color);
      }
  }

  .#{$primary-stylename} input {
    display: block;
    cursor: pointer;
    position: absolute;
    //z-index: -1;
    opacity: 0;

    text-align: right;

    margin: 0;
    top: 0;
    right: 0;

    width: 100%;
    height: 100%;

    @include box-defaults;

    // hide caret of input
    .v-ie & {
      -ms-user-select: none;
    }
  }

  .#{$primary-stylename}.v-disabled input {
    cursor: default;
  }

  .#{$primary-stylename} input[type="file"]::-webkit-file-upload-button {
    cursor: pointer;
    display: block;

    width: 100%;
    height: 100%;

    max-width: 100%;
    max-height: 100%;

    @include box-defaults;
  }

  .#{$primary-stylename}.v-disabled input[type="file"]::-webkit-file-upload-button {
    cursor: default;
  }

  .#{$primary-stylename}.v-has-width .v-button {
    width: 100%;
  }

  .#{$primary-stylename}.v-has-height .v-button {
    height: 100%;
  }

  .#{$primary-stylename}-progresswindow.v-window {
    width: 500px;

    .content-pane {
      outline: 0;
    }

    .vertical-panel {
      width: 100%;
      @include box-defaults;

      display: inline-block;
    }

    .v-label.upload-file-label {
      font-family: $v-font-family;
      font-size: $v-font-size;
      line-height: $v-line-height;
    }

    .v-label.upload-file-label,
    .upload-progressbar,
    .v-button.upload-cancel-button {
      margin-top: $v-layout-margin-top;
    }

    .upload-cancel-button {
      float: right;
    }
  }

  .dropzone-container {
    border: 2px dashed $v-font-color;
  }

  .v-layout.#{$primary-stylename}-dropzone {
    position: relative;
    border: 0;

    &:before {
      @include box-defaults;

      content: "";
      position: absolute;
      z-index: 10;

      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      width: 100%;
      height: 100%;

      border: 2px dashed $v-focus-color;
    }

    &:after {
      content: attr(dropzone-prompt);
      font-size: $v-font-size--h1;
      position: absolute;
      background: $v-panel-background-color;
      border: valo-border();
      padding: ceil($v-unit-size/2);
      border-radius: $v-border-radius;

      z-index: 10;

      display: block;
      top: 50%;
      left: 50%;

      -webkit-transform: translateY(-50%) translateX(-50%);
      -moz-transform: translateY(-50%) translateX(-50%);
      -ms-transform: translateY(-50%) translateX(-50%);
      transform: translateY(-50%) translateX(-50%);
    }

    &[dropzone-prompt=""]:after {
      display: none;
    }

    & > div {
      opacity: 0.4;
    }
  }
}