// 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/

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


// ----- start dependencies ---------

// set up include variables before importing dependencies
@if $includeSelectClasses != false {
  $includeIconClasses:              true !global;
  $includePopupClasses:             true !global;
  $includeLabelClasses:             true !global;
  $includeMessagingClasses:         true !global;
  $includeFormControlCommonClasses: true !global;
  $includeListboxClasses:           true !global;
}

// import dependencies
@import "../../common/helpers/oj.common.helpers"; 
@import "oj.alta.android.icons";
@import "oj.alta.android.messaging";
@import "oj.alta.android.popup";
@import "oj.alta.android.formcontrol.label";
@import "oj.alta.android.formcontrol.common";
@import "oj.alta.android.formcontrol.listbox";

// ----- end dependencies ---------


// import classes defined in the common directory
@import "../../common/widgets/oj.common.formcontrol.select";


@if $includeSelectClasses != false {
  @include module-include-once("alta.android.select") {
    // In Android, the HTML select has fixed padding before the text.
    // Need to override $formControlPaddingHorizontal to avoid double padding
    // or select won't align with other form controls
    .oj-select-select {
      @include oj-ltr() {
        padding-left: 0;
      }
      @include oj-rtl() {
        padding-right: 0;
      }    
    }

    .oj-select .oj-select-multiple-open-icon {
      display:none;
    }

    .oj-select .oj-select-select::-ms-expand {
      display:none;
    }

    .oj-select-select {
      -moz-appearance:none;
    }

    // We want the placeholder style on the select for themes where we render
    // triggers + dropdowns (iOS and Android), but not for themes where we
    // render a menulist (Alta and Windows).  (In the latter case, only the
    // placeholder option is styled).
    .oj-select-select.oj-select-default[multiple] {

        color: $formControlPlaceholderColor;
        font-style: $formControlPlaceholderFontStyle;        
      
    }
    // android oj-select-many has a native select element with no icon, so doesn't need the padding-right here.
    .oj-form-control-text-align-right oj-select-many .oj-select .oj-select-select,
    oj-select-many.oj-form-control-text-align-right .oj-select .oj-select-select {
      @include oj-ltr() {
        padding-right: 0px;
      }
    }
    .oj-form-control-text-align-end oj-select-many .oj-select .oj-select-select,
    oj-select-many.oj-form-control-text-align-end .oj-select .oj-select-select {
      @include oj-ltr() {
        padding-right: 0px;
      }
      @include oj-rtl() {
        padding-left: 0px;
      }
    }
  }
}