/* timeline-icon：自定义圆点图标 · 标题/描述 + 右侧日期 */
.wa-tl-icon {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.wa-tl-icon .arco-timeline-item {
  min-height: 0;
  padding-bottom: 20px;
}

.wa-tl-icon .arco-timeline-item-last {
  min-height: 0;
  padding-bottom: 0;
}

.wa-tl-icon .arco-timeline-item-dot-wrapper {
  width: 32px;
}

.wa-tl-icon .arco-timeline-item-dot-wrapper .arco-timeline-item-dot-content {
  width: 32px;
  height: 32px;
  line-height: 32px;
}

.wa-tl-icon .arco-timeline-item-dot-line {
  top: 36px;
  bottom: -4px;
}

.wa-tl-icon .arco-timeline-item-last .arco-timeline-item-dot-line {
  display: none;
}

.wa-tl-icon .arco-timeline-item-content-wrapper {
  /* 32px 节点 + 6px 间距 */
  margin-left: 38px;
  margin-top: 0;
  padding-top: 0;
}

.wa-tl-icon .arco-timeline-item-content {
  margin-bottom: 0;
}

.wa-tl-icon .wa-tl-body {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
}

.wa-tl-icon .wa-tl-main {
  min-width: 0;
  flex: 1 1 auto;
}

.wa-tl-icon .wa-tl-title {
  color: var(--color-text-1);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
}

.wa-tl-icon .wa-tl-desc {
  margin-top: 2px;
  color: var(--color-text-3);
  font-size: 12px;
  line-height: 1.5;
}

.wa-tl-icon .wa-tl-date {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
  margin-top: 2px;
  color: var(--color-text-3);
  font-size: 12px;
  line-height: 1.4;
  white-space: nowrap;
}

.wa-tl-icon .wa-tl-date .pro-fa-icon,
.wa-tl-icon .wa-tl-date .arco-icon {
  flex-shrink: 0;
  font-size: 12px;
  color: var(--color-text-3);
}

.wa-tl-dot {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--wa-color-primary-soft, rgba(var(--primary-6), 0.12));
  border: 1px solid var(--wa-color-primary, rgb(var(--primary-6)));
  color: var(--wa-color-primary, rgb(var(--primary-6)));
  box-shadow: 0 0 0 3px var(--color-bg-2);
}

.wa-tl-dot--danger {
  background: rgba(var(--danger-6), 0.12);
  border-color: rgb(var(--danger-6));
  color: rgb(var(--danger-6));
}

.wa-tl-dot .pro-fa-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: inherit;
  font-size: 14px;
  width: 14px;
  height: 14px;
  line-height: 1;
}
