/*! purgecss start ignore */


%paragraph {
  --paragraph-indent-length: 2em;

  --paragraph-letter-spacing-size-xs: 0.125em;
  --paragraph-letter-spacing-size-small: -0.0625em;
  --paragraph-letter-spacing-size-base: 0em;
  --paragraph-letter-spacing-size-large: 0.0625em;
  --paragraph-letter-spacing-size-xl: 0.125em;

  --paragraph-line-height-size-xs: 1;
  --paragraph-line-height-size-small: 1.25;
  --paragraph-line-height-size-base: 1.5;
  --paragraph-line-height-size-large: 1.75;
  --paragraph-line-height-size-xl: 2;
}

:root.mobius-base,
html.mobius-base,
page.mobius-base,
page,
.mobius-base {
  @extend %paragraph;
}

/*********************************************************
 *                        Text Indent
 *********************************************************/

.mobius-text--indent,
.hover_mobius-text--indent:hover,
.active_mobius-text--indent:active { text-indent: var(--paragraph-indent-length); }

/*********************************************************
 *                        Text Align
 *********************************************************/

.mobius-text--left,
.hover_mobius-text--left:hover,
.active_mobius-text--left:active { text-align: left; }
.mobius-text--center,
.hover_mobius-text--center:hover,
.active_mobius-text--center:active { text-align: center; }
.mobius-text--right,
.hover_mobius-text--right:hover,
.active_mobius-text--right:active { text-align: right; }
.mobius-text--justify,
.hover_mobius-text--justify:hover,
.active_mobius-text--justify:active { text-align: justify; }
.mobius-text--top,
.hover_mobius-text--top:hover,
.active_mobius-text--top:active { vertical-align: top; }
.mobius-text--middle,
.hover_mobius-text--middle:hover,
.active_mobius-text--middle:active { vertical-align: middle; }
.mobius-text--bottom,
.hover_mobius-text--bottom:hover,
.active_mobius-text--bottom:active { vertical-align: bottom; }

/*********************************************************
 *                        Text Direction
 *********************************************************/

 .mobius-text--l2r { direction: ltr; }
 .mobius-text--r2l { direction: rtl; }

/*********************************************************
 *                       Text Wrap
 *********************************************************/

%text-nowrap {
  white-space: nowrap;
}

.mobius-text--wrap { white-space: normal; }
.mobius-text--nowrap { @extend %text-nowrap; } /* 换行和空格全部折叠 */
.mobius-text--pre { white-space: pre; } /* 换行和空格全部不处理 */
.mobius-text--preline { white-space: pre-line; } /* 折叠空格，正常换行 */
.mobius-text--prewrap { white-space: pre-wrap; } /* 正常显示空格，正常换行 */

/*********************************************************
 *                 Letter SPacing: Tracking
 *********************************************************/

.mobius-text-tracking--xs,
.hover_mobius-text-tracking--xs:hover,
.active_mobius-text-tracking--xs:active { letter-spacing: var(--paragraph-letter-spacing-size-xs); }
.mobius-text-tracking--small,
.hover_mobius-text-tracking--small:hover,
.active_mobius-text-tracking--small:active { letter-spacing: var(--paragraph-letter-spacing-size-small); }
.mobius-text-tracking--base,
.hover_mobius-text-tracking--base:hover,
.active_mobius-text-tracking--base:active { letter-spacing: var(--paragraph-letter-spacing-size-base); }
.mobius-text-tracking--large,
.hover_mobius-text-tracking--large:hover,
.active_mobius-text-tracking--large:active { letter-spacing: var(--paragraph-letter-spacing-size-large); }
.mobius-text-tracking--xl,
.hover_mobius-text-tracking--xl:hover,
.active_mobius-text-tracking--xl:active { letter-spacing: var(--paragraph-letter-spacing-size-xl); }

/*********************************************************
 *                 Line Height: Leading
 *********************************************************/

.mobius-text-leading--xs,
.hover_mobius-text-leading--xs:hover,
.active_mobius-text-leading--xs:active { line-height: var(--paragraph-line-height-size-xs); }
.mobius-text-leading--small,
.hover_mobius-text-leading--small:hover,
.active_mobius-text-leading--small:active { line-height: var(--paragraph-line-height-size-small); }
.mobius-text-leading--base,
.hover_mobius-text-leading--base:hover,
.active_mobius-text-leading--base:active { line-height: var(--paragraph-line-height-size-base); }
.mobius-text-leading--large,
.hover_mobius-text-leading--large:hover,
.active_mobius-text-leading--large:active { line-height: var(--paragraph-line-height-size-large); }
.mobius-text-leading--xl,
.hover_mobius-text-leading--xl:hover,
.active_mobius-text-leading--xl:active { line-height: var(--paragraph-line-height-size-xl); }

/*********************************************************
 *                      Word Break
 *********************************************************/

.mobius-text-break--normal,
.hover_mobius-text-break--normal:hover,
.active_mobius-text-break--normal:active { word-break: normal; overflow-wrap: normal; }
.mobius-text-break--words,
.hover_mobius-text-break--words:hover,
.active_mobius-text-break--words:active { overflow-wrap: break-word; }
.mobius-text-break--all,
.hover_mobius-text-break--all:hover,
.active_mobius-text-break--all:active { overflow-wrap: break-all; word-break: break-all; }

%text-truncate {
  overflow: hidden; text-overflow: ellipsis;
}

/* 涉及到文字换行出路，故需要为文字容器指定宽度 */
.mobius-text-break--truncate-simple,
.hover_mobius-text-break--truncate-simple:hover,
.active_mobius-text-break--truncate-simple:active { @extend %text-nowrap, %text-truncate;  }

%line-clamp {
  --line-clamp: 1;
}

.mobius-text-break--truncate,
.hover_mobius-text-break--truncate:hover,
.active_mobius-text-break--truncate:active {
  @extend %text-truncate;
  display: -webkit-box;
  -webkit-line-clamp: var(--line-clamp);
  -webkit-box-orient: vertical;
}

.mobius-text-break--truncate-1,
.hover_mobius-text-break--truncate-1:hover,
.active_mobius-text-break--truncate-1:active {
  @extend %text-truncate;
  display: -webkit-box;
  -webkit-line-clamp: var(--line-clamp, 1);
  -webkit-box-orient: vertical;
}
.mobius-text-break--truncate-2,
.hover_mobius-text-break--truncate-2:hover,
.active_mobius-text-break--truncate-2:active {
  @extend %text-truncate;
  display: -webkit-box;
  -webkit-line-clamp: var(--line-clamp, 2);
  -webkit-box-orient: vertical;
}
.mobius-text-break--truncate-3,
.hover_mobius-text-break--truncate-3:hover,
.active_mobius-text-break--truncate-3:active {
  @extend %text-truncate;
  display: -webkit-box;
  -webkit-line-clamp: var(--line-clamp, 3);
  -webkit-box-orient: vertical;
}
.mobius-text-break--truncate-4,
.hover_mobius-text-break--truncate-4:hover,
.active_mobius-text-break--truncate-4:active {
  @extend %text-truncate;
  display: -webkit-box;
  -webkit-line-clamp: var(--line-clamp, 4);
  -webkit-box-orient: vertical;
}

/*! purgecss end ignore */