/* ==========================================================================
   老虎机机台造型补充（css/slot-skin.css）
   --------------------------------------------------------------------------
   后台「老虎机管理 → 机台造型」控制：0 = 默认经典；1 = 金色 WIN 华丽机。
   front.js 的 applySlotSkin() 给 .slot-cabinet 与 #slotLever 挂/摘 slot-skin-gold，
   并注入装饰容器 .slot-skin-decor（顶部放射金光 + WIN 招牌 + 底部金币堆）。
   只改机台外观：口数、消耗、概率、库存、风控全部不受影响；
   装饰容器 pointer-events:none，不挡任何按钮与交互。
   ========================================================================== */

/* ---------- 机台外壳：金色华丽金属 ---------- */
.slot-cabinet.slot-skin-gold {
  background:
    radial-gradient(130% 92% at 50% -14%, rgba(255, 238, 180, 0.85), transparent 58%),
    radial-gradient(90% 40% at 50% 108%, rgba(255, 214, 106, 0.5), transparent 70%),
    linear-gradient(158deg, #fff3cf 0%, #f7cd6a 38%, #e8ad3c 62%, #d18f1f 100%);
  border: 4px solid #b8860b;
  border-radius: 24px;
  box-shadow:
    0 20px 48px rgba(150, 112, 34, 0.35),
    0 0 0 2px rgba(255, 240, 200, 0.65),
    inset 0 0 0 2px rgba(184, 134, 11, 0.35),
    inset 0 0 52px rgba(255, 226, 140, 0.55);
}
/* 机顶两侧各一枚金铆钉 */
.slot-cabinet.slot-skin-gold::before,
.slot-cabinet.slot-skin-gold::after {
  content: '';
  position: absolute;
  top: 10px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #fff6cf, #e0a62e 70%);
  border: 2px solid #a06c0a;
  box-shadow: 0 0 10px rgba(255, 215, 106, 0.8);
  z-index: 4;
  pointer-events: none;
}
.slot-cabinet.slot-skin-gold::before { left: 10px; }
.slot-cabinet.slot-skin-gold::after { right: 10px; }

/* ---------- 顶部招牌：深金底金字 ---------- */
.slot-cabinet.slot-skin-gold .slot-marquee {
  background: linear-gradient(180deg, rgba(120, 74, 6, 0.28), rgba(120, 74, 6, 0.12));
  border: 2px solid rgba(184, 134, 11, 0.6);
  border-radius: 999px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5);
}
.slot-cabinet.slot-skin-gold .slot-title {
  color: #7a4a08;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.75);
  font-weight: 900;
  letter-spacing: 3px;
}

/* ---------- 徽标 / 切换器 / 灯带 / 下注区：金色系 ---------- */
.slot-cabinet.slot-skin-gold .slot-head .slot-badge {
  border-color: rgba(184, 134, 11, 0.5);
  color: #8a5a10;
  background: rgba(255, 246, 216, 0.55);
}
.slot-cabinet.slot-skin-gold .slot-reel-switch {
  border-color: rgba(184, 134, 11, 0.45);
  background: rgba(255, 250, 232, 0.5);
}
.slot-cabinet.slot-skin-gold .slot-reel-switch button {
  border-color: rgba(184, 134, 11, 0.4);
  color: #7a4a08;
}
.slot-cabinet.slot-skin-gold .slot-reel-switch button.active {
  background: linear-gradient(180deg, #ffd76a, #e0a62e);
  color: #5a3208;
  border-color: #b8860b;
}
.slot-cabinet.slot-skin-gold .slot-lamps i {
  background: #ffd76a;
  box-shadow: 0 0 10px rgba(255, 215, 106, 0.9);
}
.slot-cabinet.slot-skin-gold .slot-bet {
  border-color: rgba(184, 134, 11, 0.45);
  background: rgba(255, 250, 232, 0.5);
}
.slot-cabinet.slot-skin-gold .slot-bet-cell b { color: #a06c0a; }

/* ---------- 窗口：厚金边（窗口内保持深底，红 7 显示更醒目） ---------- */
.slot-cabinet.slot-skin-gold .slot-window {
  border: 3px solid #b8860b;
  box-shadow:
    0 0 0 2px rgba(255, 240, 200, 0.55),
    inset 0 0 0 1px rgba(0, 0, 0, 0.5),
    inset 0 14px 30px rgba(0, 0, 0, 0.62);
}

/* ---------- 装饰：顶部放射金光 + WIN 招牌 + 底部金币堆 ---------- */
.slot-skin-decor {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 3;
}
.slot-cabinet.slot-skin-gold .skin-rays {
  position: absolute;
  top: -30px;
  left: 50%;
  width: 300px;
  height: 150px;
  margin-left: -150px;
  background: repeating-conic-gradient(
    from 190deg at 50% 0%,
    rgba(255, 226, 130, 0.75) 0deg 8deg,
    transparent 8deg 19deg
  );
  -webkit-mask: linear-gradient(180deg, rgba(0, 0, 0, 0.95) 0%, rgba(0, 0, 0, 0.3) 78%, transparent 100%);
  mask: linear-gradient(180deg, rgba(0, 0, 0, 0.95) 0%, rgba(0, 0, 0, 0.3) 78%, transparent 100%);
}
.slot-cabinet.slot-skin-gold .skin-win {
  position: absolute;
  top: -20px;
  left: 50%;
  margin-left: -44px;
  width: 88px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(180deg, #fff8da, #ffd76a 58%, #e8b83e);
  border: 3px solid #b8860b;
  border-radius: 12px;
  color: #a8431a;
  font-size: 26px;
  font-weight: 900;
  font-style: italic;
  letter-spacing: 2px;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.7);
  box-shadow:
    0 0 22px rgba(255, 215, 106, 0.95),
    0 4px 10px rgba(120, 80, 10, 0.35);
}
.slot-cabinet.slot-skin-gold .skin-coins {
  position: absolute;
  left: 6%;
  right: 6%;
  bottom: 8px;
  height: 22px;
  display: flex;
  justify-content: space-around;
  align-items: center;
}
.slot-cabinet.slot-skin-gold .skin-coins em {
  width: 19px;
  height: 19px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #ffe98a, #d4a017 70%);
  border: 2px solid #a06c0a;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.35);
}
.slot-cabinet.slot-skin-gold .skin-coins em:nth-child(2),
.slot-cabinet.slot-skin-gold .skin-coins em:nth-child(4) {
  transform: translateY(-5px);
}

/* ---------- 拉杆：金色底座 + 杆身，红宝石球更醒目 ---------- */
.slot-lever.slot-skin-gold .lever-base {
  background: linear-gradient(165deg, #ffd76a, #d4a017 52%, #8a5a10);
  border: 1px solid rgba(255, 255, 255, 0.55);
  box-shadow:
    0 12px 22px rgba(120, 80, 10, 0.35),
    inset 0 2px 0 rgba(255, 255, 255, 0.6),
    inset 0 -4px 8px rgba(0, 0, 0, 0.35);
}
.slot-lever.slot-skin-gold .lever-rod {
  background: linear-gradient(90deg, #b8860b, #ffe9a8 44%, #c8962a);
  box-shadow: 0 6px 14px rgba(120, 80, 10, 0.3), inset 0 0 0 1px rgba(255, 255, 255, 0.5);
}
.slot-lever.slot-skin-gold .lever-knob {
  width: 38px;
  height: 38px;
  background: radial-gradient(circle at 34% 28%, #ffd8b0, #ff7040 40%, #e0222b 74%, #8d1017);
  box-shadow:
    0 8px 18px rgba(224, 34, 43, 0.5),
    inset 0 -3px 7px rgba(0, 0, 0, 0.4),
    inset 0 3px 7px rgba(255, 255, 255, 0.55),
    0 0 0 3px rgba(255, 215, 106, 0.35);
}

/* ---------- 后台「机台造型」控件（admin.html 加载本文件） ---------- */
#slotSkinRow .btn.active {
  border-color: #ffd700;
  color: #ffd700;
  background: rgba(255, 215, 0, 0.12);
  box-shadow: 0 0 0 1px rgba(255, 215, 0, 0.35);
}

/* ---------- 窄屏适配 ---------- */
@media (max-width: 560px) {
  .slot-cabinet.slot-skin-gold .skin-win { font-size: 21px; height: 34px; margin-left: -36px; width: 72px; top: -16px; }
  .slot-cabinet.slot-skin-gold .skin-rays { width: 240px; margin-left: -120px; height: 120px; }
  .slot-cabinet.slot-skin-gold .skin-coins em { width: 15px; height: 15px; }
}
