@import "../../themes/ionic.globals.wp";

// Windows Action Sheet
// --------------------------------------------------

/// @prop - Text align of the action sheet
$action-sheet-wp-text-align:                      start !default;

/// @prop - Background color of the action sheet
$action-sheet-wp-background:                      #fff !default;

/// @prop - Padding top of the action sheet
$action-sheet-wp-padding-top:                     .8rem !default;

/// @prop - Padding bottom of the action sheet
$action-sheet-wp-padding-bottom:                  .8rem !default;

/// @prop - Box shadow color of the action sheet
$action-sheet-wp-box-shadow-color:                rgba(0, 0, 0, .2) !default;

/// @prop - Box shadow of the action sheet
$action-sheet-wp-box-shadow:                      0 -1px 0 $action-sheet-wp-box-shadow-color !default;

// deprecated
$action-sheet-wp-title-padding:                   null !default;

/// @prop - Padding top of the action sheet title
$action-sheet-wp-title-padding-top:               11px !default;

/// @prop - Padding end of the action sheet title
$action-sheet-wp-title-padding-end:               16px !default;

/// @prop - Padding bottom of the action sheet title
$action-sheet-wp-title-padding-bottom:            17px !default;

/// @prop - Padding start of the action sheet title
$action-sheet-wp-title-padding-start:             $action-sheet-wp-title-padding-end !default;

/// @prop - Font size of the action sheet title
$action-sheet-wp-title-font-size:                 2rem !default;

/// @prop - Color of the action sheet title
$action-sheet-wp-title-color:                     #4d4d4d !default;

/// @prop - Text align of the action sheet title
$action-sheet-wp-title-text-align:                $action-sheet-wp-text-align !default;

/// @prop - Height of the action sheet button
$action-sheet-wp-button-height:                   4.8rem !default;

/// @prop - Text color of the action sheet button
$action-sheet-wp-button-text-color:               #4d4d4d !default;

/// @prop - Font size of the action sheet button
$action-sheet-wp-button-font-size:                1.5rem !default;

// deprecated
$action-sheet-wp-button-padding:                  null !default;

/// @prop - Padding top of the action sheet button
$action-sheet-wp-button-padding-top:              0 !default;

/// @prop - Padding end of the action sheet button
$action-sheet-wp-button-padding-end:              16px !default;

/// @prop - Padding bottom of the action sheet button
$action-sheet-wp-button-padding-bottom:           $action-sheet-wp-button-padding-top !default;

/// @prop - Padding start of the action sheet button
$action-sheet-wp-button-padding-start:            $action-sheet-wp-button-padding-end !default;

/// @prop - Text align of the action sheet button
$action-sheet-wp-button-text-align:               $action-sheet-wp-text-align !default;

/// @prop - Background color of the action sheet button
$action-sheet-wp-button-background:               transparent !default;

/// @prop - Background color of the action sheet activated button
$action-sheet-wp-button-background-activated:     $list-wp-activated-background-color !default;

/// @prop - Font size of the icon in the action sheet button
$action-sheet-wp-icon-font-size:                  2.4rem !default;

/// @prop - Width of the icon in the action sheet button
$action-sheet-wp-icon-width:                      2.3rem !default;

/// @prop - Text align of the icon in the action sheet button
$action-sheet-wp-icon-text-align:                 center !default;

/// @prop - Vertical align of the icon in the action sheet button
$action-sheet-wp-icon-vertical-align:             middle !default;

// deprecated
$action-sheet-wp-icon-margin:                     null !default;

/// @prop - Margin top of the icon in the action sheet button
$action-sheet-wp-icon-margin-top:                 0 !default;

/// @prop - Margin end of the icon in the action sheet button
$action-sheet-wp-icon-margin-end:                 20px !default;

/// @prop - Margin bottom of the icon in the action sheet button
$action-sheet-wp-icon-margin-bottom:              0 !default;

/// @prop - Margin start of the icon in the action sheet button
$action-sheet-wp-icon-margin-start:               0 !default;


.action-sheet-wp .action-sheet-title {
  @include text-align($action-sheet-wp-title-text-align);

  font-size: $action-sheet-wp-title-font-size;
  color: $action-sheet-wp-title-color;

  @include deprecated-variable(padding, $action-sheet-wp-title-padding) {
    @include padding($action-sheet-wp-title-padding-top, $action-sheet-wp-title-padding-end, $action-sheet-wp-title-padding-bottom, $action-sheet-wp-title-padding-start);
  }
}

.action-sheet-wp .action-sheet-button {
  @include text-align($action-sheet-wp-button-text-align);

  min-height: $action-sheet-wp-button-height;

  font-size: $action-sheet-wp-button-font-size;
  color: $action-sheet-wp-button-text-color;
  background: $action-sheet-wp-button-background;

  @include deprecated-variable(padding, $action-sheet-wp-button-padding) {
    @include padding($action-sheet-wp-button-padding-top, $action-sheet-wp-button-padding-end, $action-sheet-wp-button-padding-bottom, $action-sheet-wp-button-padding-start);
  }
}

.action-sheet-wp .action-sheet-button.activated {
  background: $action-sheet-wp-button-background-activated;
}

.action-sheet-wp .action-sheet-icon {
  @include padding(0);
  @include text-align($action-sheet-wp-icon-text-align);

  width: $action-sheet-wp-icon-width;

  font-size: $action-sheet-wp-icon-font-size;
  vertical-align: $action-sheet-wp-icon-vertical-align;

  @include deprecated-variable(margin, $action-sheet-wp-icon-margin) {
    @include margin($action-sheet-wp-icon-margin-top, $action-sheet-wp-icon-margin-end, $action-sheet-wp-icon-margin-bottom, $action-sheet-wp-icon-margin-start);
  }
}

.action-sheet-wp .action-sheet-group {
  background: $action-sheet-wp-background;
}

.action-sheet-wp .action-sheet-group:first-child {
  @include padding($action-sheet-wp-padding-top, null, null, null);

  box-shadow: $action-sheet-wp-box-shadow;
}

.action-sheet-wp .action-sheet-group:last-child {
  @include padding(null, null, $action-sheet-wp-padding-bottom, null);
}

.action-sheet-wp .action-sheet-group .button-inner {
  justify-content: flex-start;
}

.action-sheet-wp .action-sheet-selected {
  font-weight: bold;
}

.action-sheet-wp .action-sheet-cancel {
  background: $action-sheet-wp-button-background;
}