@include export-module('datepicker-fusionnew-icons') {

  /*! component icons */

  .e-input-group-icon.e-date-icon,
  #{if(&, '&', '*')}.e-control-wrapper .e-input-group-icon.e-date-icon {
    font-size: $datepicker-icon-font-size;
    margin: $datepicker-icon-normal-margin;
    min-height: $datepicker-icon-container-min-height;
    min-width: $datepicker-icon-container-min-width;
    outline: none;

    #{if(&, '&', '*')}::before {
      content: '\e75e';
      font-family: 'e-icons';
    }

    #{if(&, '&', '*')}:focus {
      background: $datepicker-icon-hover-color;
      border-radius: $datepicker-icon-border-radius;
    }
  }

  .e-bigger .e-input-group-icon.e-date-icon,
  #{if(&, '&', '*')}.e-control-wrapper.e-bigger .e-input-group-icon.e-date-icon,
  #{if(&, '&', '*')}.e-bigger .e-control-wrapper .e-input-group-icon.e-date-icon {
    font-size: $datepicker-bigger-icon-font-size;
    margin: $datepicker-icon-bigger-margin;
    min-height: $datepicker-bigger-icon-container-min-height;
    min-width: $datepicker-bigger-icon-container-min-width;

    #{if(&, '&', '*')}::before {
      content: '\e75e';
      font-family: 'e-icons';
    }

    #{if(&, '&', '*')}:focus {
      background: $datepicker-icon-hover-color;
      border-radius: $datepicker-icon-border-radius;
    }
  }

  // mouse small icon
  .e-small .e-input-group-icon.e-date-icon,
  #{if(&, '&', '*')}.e-control-wrapper.e-small .e-input-group-icon.e-date-icon,
  #{if(&, '&', '*')}.e-small .e-control-wrapper .e-input-group-icon.e-date-icon {
    font-size: $datepicker-small-icon-font-size;
  }

  // Touch small icon
  .e-small.e-bigger .e-input-group-icon.e-date-icon,
  #{if(&, '&', '*')}.e-control-wrapper.e-small.e-bigger .e-input-group-icon.e-date-icon,
  #{if(&, '&', '*')}.e-small.e-bigger .e-control-wrapper .e-input-group-icon.e-date-icon {
    font-size: $datepicker-bigger-small-icon-font-size;
  }
}