/*

  RAINBOW (ALTERNATE ART) HOLO
  Adapted from simeydotme/pokemon-cards-css for HypePull.
  Inlined `:not(.masked)` overrides (--foil: none, --imgsize: 25% auto) since
  HypePull cards have no per-card mask. Dropped `[data-trainer-gallery="true"]`
  selectors (Pokemon TCG attribute we don't set).

*/

.card-body.card[data-rarity="rare rainbow alt"] .card__shine {

  --mask: none;
  --foil: none;
  --imgsize: 25% auto;
  --glittersize: 40%;

  --r-clr-1: hsl(0, 57%, 37%);
  --r-clr-2: hsl(40, 53%, 39%);
  --r-clr-3: hsl(90, 60%, 35%);
  --r-clr-4: hsl(180, 60%, 35%);
  --r-clr-5: hsl(180, 60%, 35%);
  --r-clr-6: hsl(210, 57%, 39%);
  --r-clr-7: hsl(280, 55%, 31%);

  background-image:
    repeating-linear-gradient(
      var(--angle),
        hsla(283, 49%, 60%, 0.75) calc(var(--space)*1),
        hsla(2, 70%, 58%, 0.75) calc(var(--space)*2),
        hsla(53, 67%, 53%, 0.75) calc(var(--space)*3),
        hsla(93, 56%, 52%, 0.75) calc(var(--space)*4),
        hsla(176, 38%, 50%, 0.75) calc(var(--space)*5),
        hsla(228, 100%, 77%, 0.75) calc(var(--space)*6),
        hsla(283, 49%, 61%, 0.75) calc(var(--space)*7)
      ),
    var(--glitter),
    linear-gradient( -30deg,
      var(--r-clr-1), var(--r-clr-2), var(--r-clr-3), var(--r-clr-4), var(--r-clr-5), var(--r-clr-6), var(--r-clr-7),
      var(--r-clr-1), var(--r-clr-2), var(--r-clr-3), var(--r-clr-4), var(--r-clr-5), var(--r-clr-6), var(--r-clr-7),
      var(--r-clr-1), var(--r-clr-2), var(--r-clr-3), var(--r-clr-4), var(--r-clr-5), var(--r-clr-6), var(--r-clr-7),
      var(--r-clr-1)
    );

  background-size: 200% 400%, var(--glittersize) var(--glittersize), 400% 400%;
  background-position: 0% calc(var(--background-y) * 1), center center, calc( var(--background-x) * 1.5) calc( var(--background-y) * 1.5 );
  background-blend-mode: luminosity, overlay;
  filter: brightness(calc((var(--pointer-from-center)*0.3) + 0.3)) contrast(3) saturate(1.8);

}

.card-body.card[data-rarity="rare rainbow alt"] .card__shine:after {

  -webkit-mask-image: none !important;
  mask-image: none !important;

  background-image:
    var(--glitter),
    linear-gradient( -60deg,
      var(--r-clr-1), var(--r-clr-2), var(--r-clr-3), var(--r-clr-4), var(--r-clr-5), var(--r-clr-6), var(--r-clr-7),
      var(--r-clr-1), var(--r-clr-2), var(--r-clr-3), var(--r-clr-4), var(--r-clr-5), var(--r-clr-6), var(--r-clr-7),
      var(--r-clr-1), var(--r-clr-2), var(--r-clr-3), var(--r-clr-4), var(--r-clr-5), var(--r-clr-6), var(--r-clr-7),
      var(--r-clr-1)
    );
  background-blend-mode: overlay;
  background-size: var(--glittersize) var(--glittersize), 400% 400%;
  background-position: center center, calc( var(--background-x) * -1.5) calc( var(--background-y) * -1.5 );
  filter: brightness(calc((var(--pointer-from-center)*0.5) + 0.6)) contrast(3) saturate(1);
  mix-blend-mode: color-dodge;

  opacity: calc(1.2 + (var(--pointer-from-center)/2) * -1);

}

.card-body.card[data-rarity="rare rainbow alt"] .card__shine:before {

  /* With --foil: none, this only fires if --foil is overridden elsewhere.
     Kept for completeness so customizations can re-enable it. */
  background-image: var(--foil);
  background-size: var(--imgsize);
  background-position: center center;
  filter: brightness(1.5) contrast(1.5);
  opacity: calc((var(--pointer-from-center) + 0.6 ) * 0.4 );
  background-blend-mode: difference;
  mix-blend-mode: color-dodge;

}

/*

  GLARE LAYERS

*/

.card-body.card[data-rarity="rare rainbow alt"] .card__glare {

  background-image:
    radial-gradient(
      farthest-corner circle at
      var(--glare-x) var(--glare-y),
      hsla(50, 20%, 90%, 0.75) 0%,
      hsla(150, 20%, 30%, 0.65) 45%,
      hsla(0, 0%, 0%, 1) 100%
    );

  filter: brightness(.9) contrast(2);
  opacity: calc( var(--card-opacity) * 0.75 );

}
