// Copyright (c) 2014, 2023, Oracle and/or its affiliates.  Licensed under The Universal Permissive License (UPL), Version 1.0 as shown at https://oss.oracle.com/licenses/upl/

// !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
// WARNING: do not directly import this file, instead import the 
//          version in your base theme's directory, 
//          for example alta/widgets/_oj.alta.filepicker.scss
// !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

@import "../../utilities/oj.utilities";

@if $includeFilePickerClasses != false  {
  @include module-include-once("common.filepicker") {
        
    // This is to prevent the flash of unstyled content before the html becomes JET components.
    @if $initialVisibility == hidden {
      oj-file-picker:not(.oj-complete) {
        visibility: hidden;
      }
    }

    .oj-filepicker {
      display: inline-block;
    }


    .oj-filepicker-no-trigger.oj-filepicker {
      max-width: 400px;
      width: 100%;
      display:block;
    }

    .oj-filepicker-clickable {
      height: 100%;
    }

    .oj-filepicker-container {
      height: 100%;
    }

    .oj-filepicker-dropzone,
    .oj-filepicker-disabled {
      // center containing items
      justify-content: space-between;

      // vertically center containing items
      align-items: center;

      height: 100%;
      box-sizing: border-box;

        border-width: $filePickerBorderWidth;
        border-style: $filePickerBorderStyle;
        border-radius: $filePickerBorderRadius;
        padding: $filePickerPadding;
    }

    .oj-filepicker-dropzone {
      background-color: $filePickerBgColor;
      border-color: $filePickerBorderColor;
    }

    .oj-filepicker-disabled {
      background-color: $filePickerBgColorDisabled;
      border-color: $filePickerBorderColorDisabled;
    }

    .oj-filepicker-dropzone.oj-invalid-drop {
      border-color: $borderColorError;
    }
    .oj-filepicker-dropzone.oj-valid-drop,
    .oj-filepicker.oj-valid-drop,
    .oj-filepicker-dropzone:active { 
        background-color: $filePickerBgColorActive;

    }

    /* 
     * Suppress focus ring
     */
    .oj-filepicker-dropzone:not(.oj-focus-highlight):focus {
      outline: none;
    }

    .oj-filepicker-text { 

        font-size: $filePickerTextFontSize;
        color: $filePickerTextColor;
        margin-bottom:  6px;
        font-weight: $filePickerTextFontWeight;
    }

    .oj-filepicker-secondary-text {
        color: $filePickerTextColor;
        font-size: $filePickerSecondaryTextFontSize;
        font-weight: $filePickerSecondaryTextFontWeight;
    }

    .oj-filepicker-disabled .oj-filepicker-text,
    .oj-filepicker-disabled .oj-filepicker-secondary-text {
      color: $textColorDisabled;
    }
    
  }
}