/* Alert */
.l-alert {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  color: var(--td-text-color-primary);
  font-size: var(--td-font-size-body-medium);
  font-family: var(--td-font-family);
  list-style: none;
  display: flex;
  padding: 14px 24px;
  opacity: 1;
  transition: opacity 0.2s;
  border-radius: var(--td-radius-medium);
}
.l-alert.l-is-hidden {
  /* 隐藏 */
  display: none;
}
.l-alert--closing {
  opacity: 0;
}
.l-alert--info {
  background-color: var(--td-brand-color-focus);
}
.l-alert--info .l-alert__icon {
  color: var(--td-brand-color);
}
.l-alert--info .l-alert__swiper-trigger-wrap {
  color: var(--td-brand-color);
}
.l-alert--info .l-alert__swiper-trigger--active {
  color: var(--td-brand-color);
}
.l-alert--success {
  background-color: var(--td-success-color-2);
}
.l-alert--success .l-alert__icon {
  color: var(--td-success-color);
}
.l-alert--success .l-alert__swiper-trigger-wrap {
  color: var(--td-success-color-2);
}
.l-alert--success .l-alert__swiper-trigger--active {
  color: var(--td-success-color);
}
.l-alert--warning {
  background-color: var(--td-warning-color-2);
}
.l-alert--warning .l-alert__icon {
  color: var(--td-warning-color);
}
.l-alert--warning .l-alert__swiper-trigger-wrap {
  color: var(--td-warning-color-2);
}
.l-alert--warning .l-alert__swiper-trigger--active {
  color: var(--td-warning-color);
}
.l-alert--error {
  background-color: var(--td-error-color-2);
}
.l-alert--error .l-alert__icon {
  color: var(--td-error-color);
}
.l-alert--error .l-alert__swiper-trigger-wrap {
  color: var(--td-error-color-2);
}
.l-alert--error .l-alert__swiper-trigger--active {
  color: var(--td-error-color);
}
.l-alert__icon {
  font-size: 20px;
  display: inherit;
}
.l-alert__icon > .l-icon {
  font-size: 20px;
}
.l-alert__icon,
.l-alert__close {
  flex: 0 0 auto;
  line-height: 20px;
}
.l-alert__content {
  flex: 1 1 0;
  font: var(--td-font-body-medium);
  overflow: hidden;
}
.l-alert__title,
.l-alert__message {
  width: 100%;
  display: flex;
}
.l-alert__title {
  color: var(--td-text-color-primary);
  font-weight: bold;
}
.l-alert__title + .l-alert__message {
  margin-top: 8px;
}
.l-alert__description {
  color: var(--td-text-color-secondary);
  flex: 0 1 auto;
  transition: height 0.2s;
}
.l-alert__operation {
  flex: 0 0 auto;
  padding: 0 8px;
  color: var(--td-brand-color);
  cursor: pointer;
  transition: color 0.2s;
}
.l-alert__operation:hover {
  color: var(--td-brand-color-hover);
}
.l-alert__operation:active {
  color: var(--td-brand-color-active);
}
.l-alert__icon + .l-alert__content {
  margin-left: 10px;
}
.l-alert__collapse {
  margin-top: 12px;
  color: var(--td-brand-color);
  cursor: pointer;
}
.l-alert__close {
  font-size: var(--td-font-size-body-medium);
  color: var(--td-text-color-secondary);
  cursor: pointer;
}
