/* 全勤奖（月度抽奖）专用样式 —— 2026-10-10-2 版：去掉中奖卡片的俱乐部行，重排中奖卡片（奖项配色条 + 奖项胶囊 + 更大头像）。
   颜色全部走 design 主题变量，自动适配深浅色。 */

.fp-lottery-hero {
  position: relative;
  overflow: hidden;
  border-radius: var(--fp-radius-lg, 20px);
  border: 1px solid var(--fp-border);
  background: var(--fp-gradient-surface, linear-gradient(180deg, rgba(16, 185, 129, .05), rgba(16, 185, 129, 0)));
  box-shadow: var(--fp-shadow-sm);
  padding: 22px 24px;
  margin-bottom: 18px;
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  align-items: center;
  justify-content: space-between;
}

.fp-lottery-hero::before {
  content: "";
  position: absolute;
  top: -60px;
  right: -40px;
  width: 220px;
  height: 220px;
  border-radius: 50%;
  background: var(--fp-gradient-primary, linear-gradient(135deg, #10b981, #06b6d4));
  opacity: .14;
  pointer-events: none;
}

.fp-lottery-hero-main { position: relative; z-index: 1; }

.fp-lottery-kicker {
  font-size: 11px;
  letter-spacing: .22em;
  font-weight: 700;
  color: var(--fp-primary);
  margin-bottom: 6px;
}

.fp-lottery-title {
  font-size: 26px;
  font-weight: 800;
  margin: 0 0 8px;
  letter-spacing: .01em;
}

.fp-lottery-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 18px;
  font-size: 13px;
  color: var(--fp-muted);
}

.fp-lottery-meta i { color: var(--fp-accent); }

.fp-lottery-prizes {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.fp-lottery-prize-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 9px 14px;
  border-radius: 999px;
  border: 1px solid var(--fp-border);
  background: var(--fp-surface);
  font-size: 13px;
  font-weight: 600;
  box-shadow: var(--fp-shadow-xs);
}

.fp-lottery-prize-chip b { font-weight: 800; }

.fp-lottery-prize-tshirt { color: #fb923c; }
.fp-lottery-prize-cap { color: #38bdf8; }
.fp-lottery-prize-aroma { color: #a78bfa; }

.fp-lottery-prize-chip.fp-lottery-prize-tshirt { border-color: rgba(251, 146, 60, .45); background: rgba(251, 146, 60, .12); }
.fp-lottery-prize-chip.fp-lottery-prize-cap { border-color: rgba(56, 189, 248, .45); background: rgba(56, 189, 248, .12); }
.fp-lottery-prize-chip.fp-lottery-prize-aroma { border-color: rgba(167, 139, 250, .45); background: rgba(167, 139, 250, .12); }

/* ---------------------------------------------------------------- 月份切换 */
.fp-lottery-months {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}

.fp-lottery-month {
  padding: 7px 16px;
  border-radius: 999px;
  border: 1px solid var(--fp-border);
  background: var(--fp-surface);
  color: var(--fp-text) !important;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none !important;
  transition: transform .18s var(--fp-ease), box-shadow .18s var(--fp-ease);
}

.fp-lottery-month:hover { transform: translateY(-1px); box-shadow: var(--fp-shadow-sm); }

.fp-lottery-month.is-active {
  border-color: transparent;
  background: var(--fp-gradient-primary);
  color: #fff !important;
  box-shadow: var(--fp-shadow-md);
}

/* ---------------------------------------------------------------- 中奖名单 */
.fp-lottery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(208px, 1fr));
  gap: 12px;
}

.fp-lottery-winner {
  --fp-lottery-accent: var(--fp-primary);
  position: relative;
  display: flex;
  align-items: center;
  gap: 13px;
  padding: 13px 15px 13px 18px;
  border-radius: var(--fp-radius, 14px);
  border: 1px solid var(--fp-border);
  background: var(--fp-surface);
  box-shadow: var(--fp-shadow-xs);
  overflow: hidden;
  transition: transform .18s var(--fp-ease), box-shadow .18s var(--fp-ease), border-color .18s var(--fp-ease);
}

/* 左侧奖项配色条：一眼看出中的是什么奖 */
.fp-lottery-winner::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 3px;
  background: var(--fp-lottery-accent);
}

.fp-lottery-winner:hover { transform: translateY(-2px); box-shadow: var(--fp-shadow-sm); }

.fp-lottery-winner.is-me {
  border-color: var(--fp-primary);
  box-shadow: var(--fp-ring), var(--fp-shadow-sm);
}

.fp-lottery-winner-tshirt { --fp-lottery-accent: #fb923c; }
.fp-lottery-winner-cap { --fp-lottery-accent: #38bdf8; }
.fp-lottery-winner-aroma { --fp-lottery-accent: #a78bfa; }

.fp-lottery-avatar {
  flex: 0 0 auto;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  overflow: hidden;
  background: var(--fp-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--fp-muted);
  border: 2px solid var(--fp-border);
}

.fp-lottery-winner.is-me .fp-lottery-avatar { border-color: var(--fp-primary); }

.fp-lottery-avatar img { width: 100%; height: 100%; object-fit: cover; }

.fp-lottery-winner-body { min-width: 0; flex: 1 1 auto; }

.fp-lottery-winner-name {
  font-weight: 700;
  font-size: 15px;
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.fp-lottery-winner-prize {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  margin-top: 7px;
  padding: 3px 11px;
  border-radius: 999px;
  border: 1px solid currentColor;
  background: var(--fp-bg);
  font-size: 12px;
  font-weight: 700;
  line-height: 1.7;
  white-space: nowrap;
}

.fp-lottery-winner-prize i { font-size: 11px; }

.fp-lottery-me-tag {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 7px;
  border-radius: 999px;
  background: var(--fp-primary);
  color: #fff;
  font-size: 11px;
  vertical-align: middle;
}

.fp-lottery-size {
  display: inline-block;
  padding: 0 6px;
  border-radius: 999px;
  background: currentColor;
  color: var(--fp-surface);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .03em;
}

.fp-lottery-ship {
  position: absolute;
  top: 9px;
  right: 11px;
  color: var(--fp-primary);
  font-size: 13px;
}
/* ---------------------------------------------------------------- 我的中奖信息 */
.fp-lottery-mine .fp-lottery-mine-prize {
  font-size: 15px;
  margin-bottom: 12px;
}

.fp-lottery-shipped {
  padding: 14px 16px;
  border-radius: var(--fp-radius-sm, 10px);
  border: 1px dashed var(--fp-border);
  background: var(--fp-gradient-surface);
}

.fp-lottery-shipped-line { font-size: 15px; margin-bottom: 8px; }

.fp-lottery-address { font-size: 14px; line-height: 1.9; }

.fp-lottery-address .fp-muted { display: inline-block; min-width: 52px; }

.fp-lottery-form .form-control { border-radius: var(--fp-radius-xs, 6px); }

.fp-lottery-empty { border-style: dashed; }

.fp-lottery-empty-icon { color: var(--fp-primary); opacity: .65; }

/* ---------------------------------------------------------------- 后台 */
.fp-lottery-stat {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 9px 0;
  border-bottom: 1px dashed var(--fp-hairline, rgba(148, 163, 184, .28));
  font-size: 14px;
}

.fp-lottery-stat:last-child { border-bottom: 0; }

.fp-lottery-stat b { font-size: 16px; }

.fp-inline-form { margin: 0; }

/* ---------------------------------------------------------------- 响应式 */
@media (max-width: 767.98px) {
  .fp-lottery-hero { padding: 18px 16px; }
  .fp-lottery-title { font-size: 21px; }
  .fp-lottery-grid { grid-template-columns: 1fr; }
  .fp-lottery-prizes { width: 100%; }
  .fp-lottery-prize-chip { flex: 1 1 auto; justify-content: center; padding: 8px 10px; }
  .fp-lottery-months { gap: 6px; }
  .fp-lottery-winner { padding: 12px 14px 12px 16px; }
  .fp-lottery-avatar { width: 46px; height: 46px; }
  .fp-lottery-month { padding: 6px 12px; font-size: 12px; }
}