/**
 * 星空主題 (Starry)
 * 深藍夜空，星辰閃爍
 * 適合：莊嚴、永恆的紀念氛圍
 */

.theme-starry {
  --theme-primary: #1a365d;
  --theme-secondary: #2d4a6f;
  --theme-accent: #d4a056;
  --theme-bg-start: #0f1729;
  --theme-bg-end: #1a365d;
  --theme-text: #e2e8f0;
  --theme-text-light: #a0aec0;
}

.theme-starry .memorial-view-page {
  background: linear-gradient(
    180deg,
    var(--theme-bg-start) 0%,
    var(--theme-bg-end) 100%
  );
  min-height: 100vh;
}

/* 星星動畫背景 */
.theme-starry .memorial-cover::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image:
    radial-gradient(2px 2px at 20px 30px, white, transparent),
    radial-gradient(
      2px 2px at 40px 70px,
      rgba(255, 255, 255, 0.8),
      transparent
    ),
    radial-gradient(1px 1px at 90px 40px, white, transparent),
    radial-gradient(
      2px 2px at 130px 80px,
      rgba(255, 255, 255, 0.6),
      transparent
    ),
    radial-gradient(1px 1px at 160px 30px, white, transparent);
  background-repeat: repeat;
  background-size: 200px 100px;
  animation: twinkle 4s ease-in-out infinite;
  opacity: 0.5;
}

@keyframes twinkle {
  0%,
  100% {
    opacity: 0.5;
  }
  50% {
    opacity: 0.8;
  }
}

/* Hero 遮罩底部邊框顏色 - 與波浪一致 */
.theme-starry .hero-cover-overlay {
  border-bottom-color: #0d0d1a;
}

.theme-starry .memorial-cover {
  background: linear-gradient(180deg, #0f1729 0%, #1a365d 50%, #2d4a6f 100%);
}

.theme-starry .memorial-profile-card {
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(10px);
  border-top-color: #0d0d1a; /* 頂部邊框使用波浪顏色 */
}

.theme-starry .memorial-section {
  background: rgb(20 20 36);
  backdrop-filter: blur(10px);
}

.theme-starry .memorial-tribute-section {
  background: linear-gradient(
    135deg,
    rgba(26, 54, 93, 0.1) 0%,
    rgba(45, 74, 111, 0.1) 100%
  );
}

/* 蠟燭特效 */
.theme-starry
  .memorial-tribute-btn[data-type="candle"].active
  .memorial-tribute-icon {
  animation: candleGlow 1s ease-in-out;
}

@keyframes candleGlow {
  0%,
  100% {
    filter: brightness(1);
  }
  50% {
    filter: brightness(1.5) drop-shadow(0 0 10px #ffd700);
  }
}
