/* 八戒影院-八戒电影网 淡黑金纯静态样式表 */
:root {
  --bg-primary: #0a0c10;
  --bg-surface: #11141c;
  --bg-elevated: #181d28;
  --gold-primary: #d4af37;
  --gold-light: #fef08a;
  --gold-dark: #b8860b;
  --text-main: #f8fafc;
  --text-muted: #94a3b8;
  --border-gold: rgba(212, 175, 55, 0.22);
}

html {
  scroll-behavior: smooth;
}

body {
  background-color: var(--bg-primary);
  color: var(--text-main);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  overflow-x: hidden;
}

/* 自定义滚动条 */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-track {
  background: #0d0f14;
}
::-webkit-scrollbar-thumb {
  background: #252b3b;
  border-radius: 4px;
  border: 1px solid rgba(212, 175, 55, 0.2);
}
::-webkit-scrollbar-thumb:hover {
  background: #d4af37;
}

/* 淡黑金文本渐变 */
.text-gold-gradient {
  background: linear-gradient(135deg, #fef08a 0%, #d4af37 45%, #ca8a04 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* 金色按钮通用样式 */
.btn-gold {
  background: linear-gradient(135deg, #d4af37 0%, #ca8a04 100%);
  color: #0c0e12;
  font-weight: 700;
  transition: all 0.25s ease;
}
.btn-gold:hover {
  background: linear-gradient(135deg, #fef08a 0%, #d4af37 100%);
  transform: translateY(-2px);
  box-shadow: 0 10px 20px -5px rgba(212, 175, 55, 0.35);
}

.btn-gold-outline {
  border: 1px solid rgba(212, 175, 55, 0.45);
  color: #fef08a;
  background: rgba(212, 175, 55, 0.06);
  transition: all 0.25s ease;
}
.btn-gold-outline:hover {
  border-color: #d4af37;
  background: rgba(212, 175, 55, 0.16);
  color: #fff;
  transform: translateY(-1px);
}

/* 优质黑金卡片边框 */
.card-gold {
  background: var(--bg-surface);
  border: 1px solid var(--border-gold);
  border-radius: 1rem;
  transition: all 0.25s ease;
}
.card-gold:hover {
  border-color: rgba(212, 175, 55, 0.55);
  transform: translateY(-3px);
  box-shadow: 0 12px 28px -8px rgba(0, 0, 0, 0.6), 0 0 18px rgba(212, 175, 55, 0.12);
}

/* 海报卡片缩放与播放按钮 */
.poster-container {
  overflow: hidden;
  position: relative;
  background-color: #161a24;
}
.poster-container img {
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.poster-container:hover img {
  transform: scale(1.06);
}

/* 模态框通用淡入动画 */
@keyframes modalFadeIn {
  from {
    opacity: 0;
    transform: scale(0.96) translateY(12px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}
.modal-animate {
  animation: modalFadeIn 0.25s ease-out forwards;
}

/* 浮动下载APP小部件微动效果 */
@keyframes gentleBounce {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-6px);
  }
}
.floating-bounce {
  animation: gentleBounce 3.5s ease-in-out infinite;
}

/* 选项卡激活样式 */
.tab-active {
  color: #fef08a !important;
  border-color: #d4af37 !important;
  background-color: rgba(212, 175, 55, 0.12) !important;
}

/* 隐藏类辅助 */
.view-hidden {
  display: none !important;
}

/* Toast 提示框 */
#toast-box {
  position: fixed;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%) translateY(100px);
  opacity: 0;
  pointer-events: none;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  z-index: 1000;
}
#toast-box.show {
  transform: translateX(-50%) translateY(0);
  opacity: 1;
}