// ED719 跌倒检测状态卡：状态色随语义变化（normal 绿 / warning 橙 / danger 红 / success 绿 / offline 灰）
// variables 由构建配置全局注入（config/index.ts sass.resource）

.fallCard {
  margin: 24px;
  padding: 32px;
  border-radius: $radius-lg;
  background: $color-bg-white;
  box-shadow: $shadow-card;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.fallCardDanger { background: linear-gradient(160deg, #fff5f4 0%, #ffffff 60%); }
.fallCardWarning { background: linear-gradient(160deg, #fffaf0 0%, #ffffff 60%); }
.fallCardSuccess { background: linear-gradient(160deg, #f4fff0 0%, #ffffff 60%); }

.fallHead {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.fallTitle {
  font-size: 30px;
  font-weight: 600;
  color: $color-text;
}

.fallBadge {
  display: flex;
  align-items: center;
}

.fallBadgeDot {
  width: 14px;
  height: 14px;
  border-radius: $radius-circle;
  margin-right: 10px;
}

.fallBadgeDotOn { background: $color-success; }
.fallBadgeDotOff { background: $color-text-secondary; }

.fallBadgeTextOn { font-size: 24px; color: $color-success; }
.fallBadgeTextOff { font-size: 24px; color: $color-text-secondary; }

// 图标圆底：色随状态
.fallIconWrap {
  width: 160px;
  height: 160px;
  margin-top: 40px;
  border-radius: $radius-circle;
  display: flex;
  align-items: center;
  justify-content: center;
  background: $color-primary-light-bg;
}

.fallIconWrapNormal { background: $color-primary-light-bg; }
.fallIconWrapOffline { background: $color-bg-disabled; }
.fallIconWrapDanger { background: $color-danger-light-bg; }
.fallIconWrapWarning { background: #fff7e8; }
.fallIconWrapSuccess { background: $color-success-light-bg; }

.fallIcon {
  font-size: 72px;
  line-height: 1;
  color: $color-primary;
}

.fallIconImg {
  width: 110px;
  height: 110px;
}

.fallStatusText {
  margin-top: 32px;
  font-size: 44px;
  font-weight: 700;
  color: $color-text;
}

.fallStatusTextNormal { color: $color-primary-deep; }
.fallStatusTextOffline { color: $color-text-secondary; }
.fallStatusTextDanger { color: $color-danger; }
.fallStatusTextWarning { color: $color-warning; }
.fallStatusTextSuccess { color: $color-success; }

.fallTime {
  margin-top: 16px;
  font-size: 24px;
  color: $color-text-tertiary;
}

.fallVersion {
  margin-top: 8px;
  font-size: 24px;
  color: $color-text-tertiary;
}