/* Box Astflye — TEMAS (1 bloco [data-theme="x"] por box).
 * Nova box = copiar um bloco, trocar key + cores. Nada de SVG, nada de arquivo novo.
 * Expansível para dezenas de boxes sem tocar na base (box.css) nem na lógica (box.js). */

/* ── Nebula Vault: roxo cósmico + fita ouro ── */
.bx-stage[data-theme="nebula"] .box3d{--c1:#8b5cf6;--c2:#4c1d95;--rib:#fcd34d}

/* ── Obsidian Relic: pedra brutal + fita vermelha, cantos retos ── */
.bx-stage[data-theme="obsidian"] .box3d{--c1:#334155;--c2:#020617;--rib:#ff4d6d}
.bx-stage[data-theme="obsidian"] .box3d-body,.bx-stage[data-theme="obsidian"] .box3d-lid{border-radius:6px}

/* ── Aurora Bloom: rosa-verde aurora + fita branca ── */
.bx-stage[data-theme="aurora"] .box3d{--c1:#ff4d6d;--c2:#059669;--rib:#fff}
.bx-stage[data-theme="aurora"] .box3d-body{background:radial-gradient(circle at 20% 20%,var(--c1),transparent 60%),radial-gradient(circle at 80% 30%,var(--c2),transparent 60%),linear-gradient(135deg,#3b0764,#0c1624)}
.bx-stage[data-theme="aurora"] .box3d-lid{background:linear-gradient(135deg,#ff4d6d,#059669)}

/* ── Genshin Bargains: oração 5★ (noite azul + via dourada + selo 4-pontas) ── */
.bx-stage[data-theme="genshin"] .box3d{--c1:#3b82f6;--c2:#0b1530;--rib:linear-gradient(135deg,#fde68a,#d4a017)}
.bx-stage[data-theme="genshin"] .box3d-body{background:
  radial-gradient(circle at 12% 20%,rgba(255,255,255,.95) 0 1.5px,transparent 2.5px),
  radial-gradient(circle at 30% 65%,rgba(255,255,255,.6) 0 1px,transparent 2px),
  radial-gradient(circle at 72% 15%,rgba(255,255,255,.8) 0 1.5px,transparent 2.5px),
  radial-gradient(circle at 88% 70%,rgba(253,230,138,.9) 0 1.5px,transparent 2.5px),
  radial-gradient(circle at 55% 45%,rgba(255,255,255,.45) 0 1px,transparent 2px),
  linear-gradient(115deg,transparent 42%,rgba(253,230,138,.28) 50%,transparent 58%),
  linear-gradient(135deg,#1d4ed8 0%,#0b1530 70%);
  border-color:rgba(253,230,138,.6);
  box-shadow:inset 0 2px 0 rgba(255,255,255,.3),inset 0 -14px 22px rgba(0,0,0,.4)}
.bx-stage[data-theme="genshin"] .box3d-lid{background:
  radial-gradient(circle at 20% 50%,rgba(255,255,255,.9) 0 1.5px,transparent 2.5px),
  radial-gradient(circle at 80% 40%,rgba(253,230,138,.9) 0 1.5px,transparent 2.5px),
  linear-gradient(115deg,transparent 40%,rgba(253,230,138,.32) 50%,transparent 60%),
  linear-gradient(135deg,#3b82f6,#0b1530);
  border-color:rgba(253,230,138,.65);border-bottom:3px solid #d4a017}
.bx-stage[data-theme="genshin"] .box3d-ribv{background:linear-gradient(90deg,#a16207,#fde68a 45%,#fde68a 55%,#a16207)}
.bx-stage[data-theme="genshin"] .box3d-ribh-bar{background:linear-gradient(180deg,#a16207,#fde68a 45%,#fde68a 55%,#a16207)}
.bx-stage[data-theme="genshin"] .box3d-knot{width:34px;height:34px;border-radius:50%;
  background:radial-gradient(circle,#fff7d6 0 22%,#fde68a 23% 45%,#d4a017 46% 100%);
  border:2px solid #fde68a;transform:none;
  clip-path:polygon(50% 0%,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0% 50%,39% 39%)}
.bx-stage[data-theme="genshin"] .box3d-icon{border-color:rgba(253,230,138,.7);background:rgba(11,21,48,.65)}
.bx-stage[data-theme="genshin"] .box3d-icon i{color:#fde68a}

/* ── Halloween Spooky: abóbora sombria + obsidian abissal + fita roxa espectral ── */
.bx-stage[data-theme="halloween"]{--stage-glow:rgba(249,115,22,.32)}
.bx-stage[data-theme="halloween"] .box3d{--c1:#f97316;--c2:#150926;--rib:linear-gradient(135deg,#9333ea,#6b21a8)}
.bx-stage[data-theme="halloween"] .box3d-body{background:
  radial-gradient(circle at 18% 25%,rgba(249,115,22,.35) 0 2px,transparent 4px),
  radial-gradient(circle at 82% 75%,rgba(168,85,247,.4) 0 2px,transparent 4px),
  radial-gradient(circle at 50% 30%,rgba(249,115,22,.25) 0%,transparent 65%),
  linear-gradient(135deg,#1f0b38 0%,#0c0517 65%,#08030f 100%);
  border-color:rgba(249,115,22,.65);
  box-shadow:inset 0 2px 0 rgba(255,255,255,.2),inset 0 -14px 22px rgba(0,0,0,.7),0 0 18px rgba(249,115,22,.2)}
.bx-stage[data-theme="halloween"] .box3d-lid{background:
  radial-gradient(circle at 50% 30%,rgba(251,146,60,.45) 0%,transparent 60%),
  linear-gradient(135deg,#ea580c 0%,#3b0764 70%,#150926 100%);
  border-color:rgba(249,115,22,.75);border-bottom:3px solid #9333ea;
  box-shadow:0 10px 0 rgba(0,0,0,.5),inset 0 2px 0 rgba(255,255,255,.3),0 0 16px rgba(249,115,22,.3)}
.bx-stage[data-theme="halloween"] .box3d-ribv{background:linear-gradient(90deg,#6b21a8,#c084fc 45%,#c084fc 55%,#6b21a8);
  border-left:1px solid rgba(0,0,0,.35);border-right:1px solid rgba(0,0,0,.35)}
.bx-stage[data-theme="halloween"] .box3d-ribh-bar{background:linear-gradient(180deg,#6b21a8,#c084fc 45%,#c084fc 55%,#6b21a8)}
.bx-stage[data-theme="halloween"] .box3d-knot{width:32px;height:32px;border-radius:6px;
  background:radial-gradient(circle,#fb923c 0 35%,#ea580c 36% 70%,#9333ea 71% 100%);
  border:2px solid #f97316;box-shadow:0 0 12px rgba(249,115,22,.7)}
.bx-stage[data-theme="halloween"] .box3d-icon{border-color:rgba(249,115,22,.8);background:rgba(18,9,32,.85);
  box-shadow:0 0 12px rgba(249,115,22,.4)}
.bx-stage[data-theme="halloween"] .box3d-icon i{color:#fb923c;filter:drop-shadow(0 0 6px #ea580c)}

/* ── COMO CRIAR UMA BOX NOVA (exemplo comentado):
.bx-stage[data-theme="minha-box"] .box3d{--c1:#COR1;--c2:#COR2;--rib:#FITA}
 * 1. copie o bloco, troque "minha-box" pela key do tema (== MysteryBox.Theme)
 * 2. registre a key em services/box_themes.go (BOX_THEMES) — o admin lista de lá
 * 3. pronto: loja, detalhe, abertura e admin passam a renderizar sozinhos
 */