/* ═══════════════════════════════════════════════════════════════════════════
   Pokemon-Test Foil Effects — Phoenix Network port
   Mirrors the Admin Menu's PokemonTestCard component (src/styles/pokemon-test.css).
   Each test-* foil sets a texture image on .foil-layer with the same blending
   and mouse-driven offset behaviour as the Admin Menu preview.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Generic shine base for any test-* foil ──────────────────────────────── */
[data-foil^="test-"] .foil-layer {
  mix-blend-mode: color-dodge;
  background-image:
    var(--ptc-texture, none),
    repeating-linear-gradient(133deg,
      #f80e35 0%, #eedf10 10%, #21e985 20%, #0dbde9 30%, #c929f1 40%,
      #f80e35 50%, #eedf10 60%, #21e985 70%, #0dbde9 80%, #c929f1 90%, #f80e35 100%);
  background-blend-mode: overlay;
  background-size: cover, 400% 400%;
  background-position:
    center,
    calc(((50% - var(--mx,50%)) * 2.6) + 50%)
    calc(((50% - var(--my,50%)) * 3.5) + 50%);
  filter: brightness(0.85) contrast(2.75) saturate(0.65);
}

/* Glare layer — specular highlight follows mouse (uses .foil-shine slot) */
[data-foil^="test-"].foil-active .foil-shine {
  background: radial-gradient(
    farthest-corner circle at var(--mx,50%) var(--my,50%),
    hsla(0,0%,100%,.80) 10%,
    hsla(0,0%,100%,.65) 20%,
    hsla(0,0%,0%,.50) 90%);
  mix-blend-mode: overlay;
  opacity: calc(var(--foil-intensity,.85) * .75);
}

/* ── Per-foil texture variables (mirrors TEST_FOIL_IMAGES in CardEditor.jsx) ─ */
[data-foil="test-galaxy"]     { --ptc-texture: url('/static/pokemon-test/galaxy.jpg'); }
[data-foil="test-cosmos"]     { --ptc-texture: url('/static/pokemon-test/cosmos.png'); }
[data-foil="test-rainbow"]    { --ptc-texture: url('/static/pokemon-test/rainbow.jpg'); }
[data-foil="test-metal"]      { --ptc-texture: url('/static/pokemon-test/metal.png'); }
[data-foil="test-trainerbg"]  { --ptc-texture: url('/static/pokemon-test/trainerbg.jpg'); }
[data-foil="test-vmaxbg"]     { --ptc-texture: url('/static/pokemon-test/vmaxbg.jpg'); }
[data-foil="test-geometric"]  { --ptc-texture: url('/static/pokemon-test/geometric.png'); }
[data-foil="test-angular"]    { --ptc-texture: url('/static/pokemon-test/angular.png'); }
[data-foil="test-crossover"]  { --ptc-texture: url('/static/pokemon-test/crossover.png'); }
[data-foil="test-illusion"]   { --ptc-texture: url('/static/pokemon-test/illusion.png'); }
[data-foil="test-illusion2"]  { --ptc-texture: url('/static/pokemon-test/illusion2.png'); }
[data-foil="test-ancient"]    { --ptc-texture: url('/static/pokemon-test/ancient.png'); }
[data-foil="test-wave"]       { --ptc-texture: url('/static/pokemon-test/wave.png'); }
[data-foil="test-stylish"]    { --ptc-texture: url('/static/pokemon-test/stylish.png'); }
[data-foil="test-stylish2"]   { --ptc-texture: url('/static/pokemon-test/stylish2.png'); }
[data-foil="test-galaxy-src"] { --ptc-texture: url('/static/pokemon-test/galaxy-source.png'); }

/* ── Glow shadow for active test foils ───────────────────────────────────── */
[data-foil^="test-"].foil-active {
  box-shadow:
    0 0 3px -1px #fff,
    0 0 3px  1px hsl(47,100%,78%),
    0 0 14px 2px var(--ptc-glow, hsl(220,90%,70%)),
    0 10px 22px -5px rgba(0,0,0,.85),
    0 0 45px -28px var(--ptc-glow, hsl(220,90%,70%));
}

/* Per-foil glow color tints (mirrors glow values from TEST_FOIL_IMAGES) */
[data-foil="test-galaxy"]     { --ptc-glow: hsl(220,90%,70%); }
[data-foil="test-cosmos"]     { --ptc-glow: hsl(280,80%,75%); }
[data-foil="test-rainbow"]    { --ptc-glow: hsl(10,90%,70%); }
[data-foil="test-metal"]      { --ptc-glow: hsl(184,20%,70%); }
[data-foil="test-trainerbg"]  { --ptc-glow: hsl(30,90%,70%); }
[data-foil="test-vmaxbg"]     { --ptc-glow: hsl(200,90%,70%); }
[data-foil="test-geometric"]  { --ptc-glow: hsl(240,80%,75%); }
[data-foil="test-angular"]    { --ptc-glow: hsl(200,80%,70%); }
[data-foil="test-crossover"]  { --ptc-glow: hsl(160,80%,70%); }
[data-foil="test-illusion"]   { --ptc-glow: hsl(270,80%,75%); }
[data-foil="test-illusion2"]  { --ptc-glow: hsl(270,80%,75%); }
[data-foil="test-ancient"]    { --ptc-glow: hsl(45,90%,65%); }
[data-foil="test-wave"]       { --ptc-glow: hsl(200,90%,70%); }
[data-foil="test-stylish"]    { --ptc-glow: hsl(320,80%,70%); }
[data-foil="test-stylish2"]   { --ptc-glow: hsl(320,80%,70%); }
[data-foil="test-galaxy-src"] { --ptc-glow: hsl(220,90%,70%); }