@charset "UTF-8";
/*
  @component action-sheet
  @display ActionSheet
  @chinese 动作面板
  @family feedback
*/
:root {
  /**
    @desc padding(l,r)
    @semantic 左右内边距
    @namespace size/bounding
   */
  --action-sheet-padding-lr: var(--s-2);
  /**
    @desc padding(t,b)
    @semantic 上下内边距
    @namespace size/bounding
   */
  --action-sheet-padding-tb: var(--s-4);
  /*
    @desc bg-color
    @semantic 背景色
    @namespace style/common
   */
  --action-sheet-bg-color: var(--color-fill1-1);
  /*
    @desc msg-font-color
    @semantic 标题字体色
    @namespace style/title
   */
  --action-sheet-msg-font-color: var(--color-text1-3);
  /*
    @desc msg-font-size
    @semantic 标题字体大小
    @namespace size/title
   */
  --action-sheet-msg-font-size: var(--p-body-1-font-size);
  /**
    @desc msg-padding
    @semantic 标题内边距
    @namespace size/title
   */
  --action-sheet-msg-padding: var(--s-4);
  /*
    @desc bg-color
    @semantic 选择项背景色
    @namespace style/common
   */
  --action-sheet-option-bg-color: var(--color-white);
  /*
    @desc divider-color
    @semantic 分割线色
    @namespace style/content
   */
  --action-sheet-option-border-color: var(--color-line1-3);
  /*
    @desc item-font-color
    @semantic 字体色
    @namespace style/content
   */
  --action-sheet-option-font-color: var(--box-normal-solid-font-color);
  /*
    @desc active-item-font-color
    @semantic 字体色（激活）
    @namespace style/content
   */
  --action-sheet-option-font-color-hover: var(--box-normal-solid-font-color-hover);
  /*
    @desc disabled-item-font-color
    @semantic 字体色（禁用）
    @namespace style/content
   */
  --action-sheet-option-font-color-disabled: var(--box-normal-solid-font-color-disabled);
  /*
    @desc item-font-size
    @semantic 字体大小
    @namespace size/content
   */
  --action-sheet-option-font-size: var(--p-body-2-font-size);
  /**
    @desc item-padding
    @semantic 内边距
    @namespace size/content
   */
  --action-sheet-option-padding: var(--s-4);
  /*
    @desc cancel-gap-size
    @semantic 取消按钮间隙
    @namespace size/content
   */
  --action-sheet-gap-height: var(--s-2);
  /*
    @desc corner
    @semantic 圆角
    @namespace size/bounding
   */
  --action-sheet-corner: var(--corner-zero);
  /*
    @desc icon-color
    @semantic 图标圆角
    @namespace size/content
   */
  --action-sheet-icon-corner: var(--corner-1); }

.mt-actionsheet {
  margin-left: var(--action-sheet-padding-lr);
  margin-right: var(--action-sheet-padding-lr);
  background-color: var(--color-transparent);
  border-top-left-radius: var(--action-sheet-corner);
  border-top-right-radius: var(--action-sheet-corner);
  overflow: hidden; }
  .mt-actionsheet-drawer {
    background-color: var(--color-transparent); }
  .mt-actionsheet-msg {
    padding: var(--action-sheet-msg-padding);
    color: var(--action-sheet-msg-font-color);
    font-size: var(--action-sheet-msg-font-size);
    background-color: var(--action-sheet-option-bg-color);
    text-align: center;
    line-height: 1.5;
    box-sizing: border-box;
    word-wrap: break-word;
    white-space: break-spaces; }
  .mt-actionsheet-option-list {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    border-top: var(--line-1) solid var(--action-sheet-option-border-color);
    border-bottom-left-radius: var(--action-sheet-corner);
    border-bottom-right-radius: var(--action-sheet-corner);
    max-height: 70vh;
    overflow-x: hidden;
    overflow-y: auto;
    background-color: var(--action-sheet-bg-color);
    -webkit-overflow-scrolling: touch; }
  .mt-actionsheet-option {
    position: relative;
    border-bottom: var(--line-1) solid var(--action-sheet-option-border-color);
    padding: 0 var(--action-sheet-padding-lr);
    background-color: var(--action-sheet-option-bg-color);
    color: var(--action-sheet-option-font-color);
    box-sizing: border-box; }
    .mt-actionsheet-option-content {
      display: flex;
      flex-direction: row;
      justify-content: center;
      align-items: center;
      flex: 1; }
    .mt-actionsheet-option--advanced {
      display: flex;
      flex-direction: row;
      justify-items: flex-start;
      align-items: center;
      padding-left: var(--s-14);
      padding-right: 0;
      border-bottom: none;
      box-sizing: border-box; }
    .mt-actionsheet-option--advanced .mt-actionsheet-option-content {
      justify-content: flex-start;
      border-bottom: var(--line-1) solid var(--action-sheet-option-border-color); }
    .mt-actionsheet-option:active {
      color: var(--action-sheet-option-font-color-hover);
      -webkit-tap-highlight-color: transparent; }
    .mt-actionsheet-option--destructive {
      color: var(--box-warning-text-font-color); }
      .mt-actionsheet-option--destructive:active {
        color: var(--box-warning-text-font-color-hover); }
    .mt-actionsheet-option--disabled {
      color: var(--action-sheet-option-font-color-disabled); }
      .mt-actionsheet-option--disabled:active {
        color: var(--action-sheet-option-font-color-disabled); }
    .mt-actionsheet-option--advanced .mt-actionsheet-option--left, .mt-actionsheet-option--left {
      text-align: left;
      justify-content: flex-start; }
    .mt-actionsheet-option--advanced .mt-actionsheet-option--center, .mt-actionsheet-option--center {
      text-align: center;
      justify-content: center; }
    .mt-actionsheet-option--advanced .mt-actionsheet-option--right, .mt-actionsheet-option--right {
      text-align: right;
      justify-content: flex-end; }
  .mt-actionsheet-option--disabled .mt-actionsheet-icon {
    opacity: 0.2; }
  .mt-actionsheet-cancel {
    margin-top: var(--action-sheet-gap-height);
    border: none;
    border-radius: var(--action-sheet-corner);
    background-color: var(--action-sheet-option-bg-color);
    overflow: hidden;
    text-align: center; }
  .mt-actionsheet-option--last .mt-actionsheet-option-content, .mt-actionsheet-option--last {
    border-bottom: none; }
  .mt-actionsheet-option-text {
    margin-top: var(--action-sheet-padding-tb);
    margin-bottom: var(--action-sheet-padding-tb);
    font-size: var(--action-sheet-option-font-size);
    text-transform: capitalize; }
  .mt-actionsheet-badge {
    margin-left: var(--box-small-spacing); }
  .mt-actionsheet-icon {
    position: absolute;
    left: var(--s-4);
    top: var(--s-4);
    width: var(--s-6);
    height: var(--s-6);
    border-radius: var(--action-sheet-icon-corner); }
  .mt-actionsheet--fullwidth {
    margin: 0;
    background-color: var(--action-sheet-bg-color); }
  .mt-actionsheet--fullwidth .mt-actionsheet-option-list,
  .mt-actionsheet--fullwidth .mt-actionsheet-cancel {
    border-radius: 0; }
  .mt-actionsheet-safe-area {
    min-height: var(--action-sheet-padding-tb); }
    .mt-actionsheet-safe-area--fullwidth {
      min-height: 0;
      background-color: var(--action-sheet-option-bg-color); }
