/**
 * mana-foil.css — MANA Foil Visual Effects
 * Apply .foil-[type] to card image containers (.c-img, .rk-img, etc.)
 * ::after pseudo-element creates shimmer overlay on top of card art.
 *
 * FIXED:
 *  - overlay blend mode → screen (overlay invisible on dark card art)
 *  - color blend mode → screen (color mode near-invisible)
 *  - Base opacity 0.45 always-on (not just hover) — hover boosts to 0.85
 *  - Explicit class list instead of [class*="foil-"] — no bleed to foil-tag/foil-card
 */

@keyframes foil-shimmer {
  0%   { background-position:  200% center; }
  100% { background-position: -200% center; }
}
@keyframes foil-rotate {
  0%   { transform: rotate(0deg) scale(1.5); }
  100% { transform: rotate(360deg) scale(1.5); }
}
@keyframes foil-pulse {
  0%   { opacity: .40; }
  50%  { opacity: .85; }
  100% { opacity: .40; }
}
@keyframes foil-wave {
  0%   { background-position: 200% 50%; }
  100% { background-position: -200% 50%; }
}

/* Shared base — only image-level foil classes */
.foil-standard::after,.foil-etched::after,.foil-surge::after,.foil-textured::after,
.foil-rainbow::after,.foil-double-rainbow::after,.foil-galaxy::after,.foil-halo::after,
.foil-oil-slick::after,.foil-gilded::after,.foil-confetti::after,.foil-neon::after,
.foil-chocobotrackfoil::after {
  content:'';position:absolute;inset:0;pointer-events:none;
  border-radius:inherit;z-index:2;opacity:.45;transition:opacity .25s ease;
}
.foil-standard:hover::after,.foil-etched:hover::after,.foil-surge:hover::after,
.foil-textured:hover::after,.foil-rainbow:hover::after,.foil-double-rainbow:hover::after,
.foil-galaxy:hover::after,.foil-halo:hover::after,.foil-oil-slick:hover::after,
.foil-gilded:hover::after,.foil-confetti:hover::after,.foil-neon:hover::after,
.foil-chocobotrackfoil:hover::after { opacity:.9; }

/* 1. STANDARD — diagonal rainbow shimmer */
.foil-standard::after {
  background:linear-gradient(115deg,
    transparent 0%,
    transparent 30%,
    rgba(255,100,100,.18) 38%,
    rgba(255,200,50,.28) 44%,
    rgba(100,255,100,.22) 50%,
    rgba(50,150,255,.28) 56%,
    rgba(200,50,255,.22) 62%,
    transparent 70%,
    transparent 100%);
  background-size:400% 100%;mix-blend-mode:screen;animation:foil-shimmer 7s linear infinite;
}
.foil-standard{box-shadow:0 0 12px rgba(245,200,66,.2),inset 0 0 0 1px rgba(245,200,66,.18);}

/* 2. ETCHED — metallic grain */
.foil-etched::after {
  background:linear-gradient(135deg,rgba(255,230,150,.45) 0%,rgba(200,200,255,.5) 25%,rgba(255,255,255,.55) 40%,rgba(180,160,255,.45) 60%,rgba(200,230,255,.45) 80%,rgba(255,220,120,.4) 100%);
  background-size:300% 300%;mix-blend-mode:screen;animation:foil-wave 8s linear infinite;
}
.foil-etched{box-shadow:0 0 10px rgba(200,200,200,.2),inset 0 0 0 1.5px rgba(220,220,220,.28);}

/* 3. SURGE — electric lightning */
.foil-surge::after {
  background:linear-gradient(90deg,transparent 0%,rgba(0,200,255,.2) 10%,rgba(100,50,255,.5) 25%,rgba(255,255,255,.55) 40%,rgba(255,255,255,.55) 60%,rgba(100,50,255,.5) 75%,rgba(0,200,255,.2) 90%,transparent 100%);
  background-size:400% 100%;mix-blend-mode:screen;animation:foil-shimmer 8s linear infinite;
}
.foil-surge{box-shadow:0 0 22px rgba(0,200,255,.35),inset 0 0 0 1px rgba(100,50,255,.4);}

/* 4. TEXTURED — soft warm shimmer, like light catching embossed surface. No harsh lines. */
.foil-textured::after {
  background:linear-gradient(125deg,transparent 15%,rgba(255,220,120,.18) 30%,rgba(255,255,200,.28) 45%,rgba(220,180,80,.2) 55%,rgba(255,220,120,.15) 70%,transparent 85%);
  background-size:250% 100%;mix-blend-mode:screen;animation:foil-shimmer 9s ease-in-out infinite alternate;
}
.foil-textured{box-shadow:0 0 14px rgba(255,200,80,.22),inset 0 0 0 1px rgba(255,200,80,.22);}

/* 5. RAINBOW */
.foil-rainbow::after {
  background:linear-gradient(110deg,transparent 0%,rgba(255,50,50,.4) 8%,rgba(255,165,0,.45) 20%,rgba(255,255,0,.45) 32%,rgba(0,255,100,.45) 44%,rgba(0,100,255,.45) 56%,rgba(138,43,226,.45) 68%,rgba(255,0,200,.4) 80%,rgba(255,50,50,.35) 92%,transparent 100%);
  background-size:400% 100%;mix-blend-mode:screen;animation:foil-shimmer 7s linear infinite;
}
.foil-rainbow{box-shadow:0 0 22px rgba(150,100,255,.38),inset 0 0 0 1px rgba(255,150,50,.32);}

/* 6. DOUBLE RAINBOW */
.foil-double-rainbow::after {
  background:conic-gradient(rgba(255,50,50,.32),rgba(255,165,0,.32),rgba(255,255,0,.32),rgba(0,255,100,.32),rgba(0,100,255,.32),rgba(138,43,226,.32),rgba(255,50,50,.32));
  mix-blend-mode:screen;animation:foil-rotate 8s linear infinite;border-radius:inherit;overflow:hidden;
}
.foil-double-rainbow{box-shadow:0 0 28px rgba(200,50,255,.42),inset 0 0 0 1px rgba(255,200,0,.38);}

/* 7. GALAXY — deep space (screen, not overlay) */
.foil-galaxy::after {
  background:radial-gradient(ellipse at 20% 30%,rgba(255,255,255,.25) 0%,transparent 40%),radial-gradient(ellipse at 70% 60%,rgba(180,100,255,.3) 0%,transparent 40%),radial-gradient(ellipse at 50% 80%,rgba(100,180,255,.25) 0%,transparent 40%),linear-gradient(135deg,rgba(10,0,30,.4) 0%,rgba(80,0,120,.25) 50%,rgba(0,20,80,.35) 100%);
  mix-blend-mode:screen;animation:foil-pulse 4s ease-in-out infinite;
}
.foil-galaxy{box-shadow:0 0 26px rgba(100,0,200,.38),inset 0 0 0 1px rgba(180,100,255,.28);}

/* 8. HALO — radial glow (screen, not overlay) */
.foil-halo::after {
  background:radial-gradient(ellipse at 50% 40%,rgba(255,240,120,.5) 0%,rgba(255,150,50,.28) 30%,rgba(255,255,200,.12) 60%,transparent 80%);
  mix-blend-mode:screen;animation:foil-pulse 4s ease-in-out infinite;
}
.foil-halo{box-shadow:0 0 22px rgba(255,200,50,.28),inset 0 0 0 1px rgba(255,220,100,.22);}

/* 9. OIL SLICK — iridescent (screen, not color) */
.foil-oil-slick::after {
  background:linear-gradient(105deg,transparent 0%,rgba(50,200,100,.45) 12%,rgba(100,50,200,.5) 28%,rgba(200,50,50,.45) 50%,rgba(50,150,200,.5) 72%,rgba(50,200,100,.4) 88%,transparent 100%);
  background-size:300% 100%;mix-blend-mode:screen;animation:foil-shimmer 7s linear infinite;
}
.foil-oil-slick{box-shadow:0 0 18px rgba(0,150,100,.28),inset 0 0 0 1px rgba(100,50,200,.28);}

/* 10. GILDED — warm gold */
.foil-gilded::after {
  background:linear-gradient(120deg,transparent 0%,rgba(255,200,50,.3) 10%,rgba(255,255,180,.55) 30%,rgba(255,230,100,.55) 50%,rgba(255,255,180,.5) 70%,rgba(255,200,50,.25) 90%,transparent 100%);
  background-size:300% 100%;mix-blend-mode:screen;animation:foil-shimmer 6s linear infinite;
}
.foil-gilded{box-shadow:0 0 0 2px rgba(200,150,0,.55),0 0 18px rgba(255,200,0,.28);}

/* 11. CONFETTI / NEON INK */
.foil-confetti::after {
  background:linear-gradient(90deg,transparent 0%,rgba(255,100,100,.45) 10%,rgba(100,255,100,.45) 25%,rgba(100,100,255,.5) 40%,rgba(255,255,100,.5) 55%,rgba(255,100,255,.45) 70%,rgba(255,100,100,.35) 85%,transparent 100%);
  background-size:500% 100%;mix-blend-mode:screen;animation:foil-shimmer 9s linear infinite;
}
.foil-confetti{box-shadow:0 0 18px rgba(200,100,255,.28);}

/* 12. NEON INK — electric cyan/magenta pulse */
.foil-neon::after {
  background:linear-gradient(105deg,transparent 0%,rgba(0,255,255,.5) 15%,rgba(255,0,255,.55) 35%,rgba(255,255,255,.4) 50%,rgba(255,0,255,.55) 65%,rgba(0,255,255,.5) 85%,transparent 100%);
  background-size:400% 100%;mix-blend-mode:screen;animation:foil-shimmer 6s linear infinite;
}
.foil-neon{box-shadow:0 0 22px rgba(0,255,255,.35),inset 0 0 0 1px rgba(255,0,255,.4);}

/* FOIL TAG LABELS */
.foil-tag{font-size:.88rem;font-weight:700;padding:.25rem .55rem;border-radius:4px;display:inline-block;white-space:nowrap;}
.foil-tag-standard{background:linear-gradient(135deg,rgba(245,200,66,.2),rgba(155,93,229,.2));color:#d4b843;}
.foil-tag-etched{background:rgba(210,210,210,.15);color:#c0c0c0;border:1px solid rgba(200,200,200,.3);}
.foil-tag-surge{background:rgba(0,200,255,.12);color:#22d3ee;border:1px solid rgba(0,200,255,.3);}
.foil-tag-textured{background:rgba(255,200,80,.12);color:#f5c842;border:1px solid rgba(255,200,80,.3);}
.foil-tag-rainbow{background:linear-gradient(90deg,rgba(255,80,80,.15),rgba(80,255,80,.15),rgba(80,80,255,.15));color:#e0e0e0;}
.foil-tag-double-rainbow{background:linear-gradient(90deg,rgba(255,80,80,.2),rgba(80,255,80,.2),rgba(80,80,255,.2),rgba(255,80,255,.2));color:#fff;}
.foil-tag-galaxy{background:rgba(100,0,200,.15);color:#a78bfa;border:1px solid rgba(150,50,255,.3);}
.foil-tag-halo{background:rgba(255,200,50,.12);color:#fbbf24;border:1px solid rgba(255,200,50,.3);}
.foil-tag-oil-slick{background:rgba(0,150,100,.12);color:#10b981;border:1px solid rgba(0,150,100,.3);}
.foil-tag-gilded{background:rgba(200,150,0,.15);color:#d97706;border:1px solid rgba(200,150,0,.4);}
.foil-tag-confetti{background:linear-gradient(90deg,rgba(255,100,100,.12),rgba(100,255,100,.12),rgba(100,100,255,.12));color:#e0e0ff;}
.foil-tag-neon{background:linear-gradient(90deg,rgba(0,255,255,.12),rgba(255,0,255,.12));color:#00ffff;border:1px solid rgba(255,0,255,.35);}

/* CARD BORDER GLOW — on .c-card wrapper */
.foil-card-standard{border-color:rgba(245,200,66,.4)!important;}
.foil-card-etched{border-color:rgba(210,210,210,.35)!important;}
.foil-card-surge{border-color:rgba(0,200,255,.45)!important;}
.foil-card-textured{border-color:rgba(255,200,80,.4)!important;}
.foil-card-rainbow{border-color:rgba(150,100,255,.45)!important;}
.foil-card-double-rainbow{border-color:rgba(255,50,255,.45)!important;}
.foil-card-galaxy{border-color:rgba(100,0,200,.45)!important;}
.foil-card-halo{border-color:rgba(255,200,50,.4)!important;}
.foil-card-oil-slick{border-color:rgba(0,150,100,.45)!important;}
.foil-card-gilded{border-color:rgba(200,150,0,.55)!important;}
.foil-card-confetti{border-color:rgba(200,100,255,.4)!important;}
.foil-card-neon{border-color:rgba(0,255,255,.5)!important;}

/* 13. CHOCOBO TRACK FOIL — warm golden-yellow with earthy brown track lines,
   like light catching Chocobo footprints pressed into shimmering foil.
   Source: promo_types = {chocobotrackfoil} on Scryfall */
.foil-chocobotrackfoil::after {
  background:linear-gradient(112deg,
    transparent 0%,
    rgba(255,230,80,.12) 18%,
    rgba(255,200,30,.35) 32%,
    rgba(255,240,140,.5) 44%,
    rgba(200,140,20,.38) 54%,
    rgba(255,220,80,.32) 66%,
    rgba(255,240,140,.2) 78%,
    transparent 100%);
  background-size:350% 100%;
  mix-blend-mode:screen;
  animation:foil-shimmer 8s ease-in-out infinite alternate;
}
.foil-chocobotrackfoil{
  box-shadow:0 0 16px rgba(255,200,30,.3),inset 0 0 0 1px rgba(255,220,80,.3);
}

/* Foil tag */
.foil-tag-chocobotrackfoil{
  background:linear-gradient(90deg,rgba(255,200,30,.18),rgba(200,140,20,.18));
  color:#f5c842;
  border:1px solid rgba(255,200,30,.35);
}

/* Card border glow */
.foil-card-chocobotrackfoil{border-color:rgba(255,200,30,.45)!important;}

/* ── Disable foil animation globally ── */
html.no-foil .foil-standard::after,html.no-foil .foil-etched::after,
html.no-foil .foil-surge::after,html.no-foil .foil-textured::after,
html.no-foil .foil-rainbow::after,html.no-foil .foil-double-rainbow::after,
html.no-foil .foil-galaxy::after,html.no-foil .foil-halo::after,
html.no-foil .foil-oil-slick::after,html.no-foil .foil-gilded::after,
html.no-foil .foil-confetti::after,html.no-foil .foil-neon::after,
html.no-foil .foil-chocobotrackfoil::after {
  animation:none!important;opacity:0!important;
}
html.no-foil .foil-standard,html.no-foil .foil-etched,
html.no-foil .foil-surge,html.no-foil .foil-textured,
html.no-foil .foil-rainbow,html.no-foil .foil-double-rainbow,
html.no-foil .foil-galaxy,html.no-foil .foil-halo,
html.no-foil .foil-oil-slick,html.no-foil .foil-gilded,
html.no-foil .foil-confetti,html.no-foil .foil-neon,
html.no-foil .foil-chocobotrackfoil {
  box-shadow:none!important;
}