/*

  REGULAR HOLO
  Adapted from simeydotme/pokemon-cards-css for HypePull.
  Removed `data-subtypes` (Pokemon card subtype) and clip-path rules — HypePull
  doesn't expose those attributes and `overflow: hidden` on `.card__shine`
  (from holo-base) does the equivalent clipping.

*/

/*

  SHINE LAYERS

*/

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

  --scanlines-space: 1px;
  --scanlines-light: #666;
  --scanlines-dark: black;

  --bars: 3%;
  --bar-color: hsla(0, 0%, 70%, 1);
  --bar-bg: hsla(0, 0%, 0%, 1);

  background-image:
    repeating-linear-gradient( 110deg,
      var(--violet), var(--blue), var(--green), var(--yellow), var(--red),
      var(--violet), var(--blue), var(--green), var(--yellow), var(--red),
      var(--violet), var(--blue), var(--green), var(--yellow), var(--red)
    ),
    repeating-linear-gradient( 90deg,
      var(--scanlines-dark) calc(var(--scanlines-space) * 0), var(--scanlines-dark) calc(var(--scanlines-space) * 2),
      var(--scanlines-light) calc(var(--scanlines-space) * 2), var(--scanlines-light) calc(var(--scanlines-space) * 4)
    );

  background-position:
    calc(((50% - var(--background-x)) * 2.6) + 50%) calc(((50% - var(--background-y)) * 3.5) + 50%),
    center center;

  background-size:
    400% 400%,
    cover;

  background-blend-mode: overlay;
  filter: brightness(1.1) contrast(1.1) saturate(1.2);
  mix-blend-mode: color-dodge;

}

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

  background-image:
    repeating-linear-gradient( 90deg,
      var(--bar-bg) calc(var(--bars)*2),
      var(--bar-color) calc(var(--bars)*3),
      var(--bar-bg) calc(var(--bars)*3.5),
      var(--bar-color) calc(var(--bars)*4),
      var(--bar-bg) calc(var(--bars)*5),
      var(--bar-bg) calc(var(--bars)*14)
    ),
    repeating-linear-gradient( 90deg,
      var(--bar-bg) calc(var(--bars)*2),
      var(--bar-color) calc(var(--bars)*3),
      var(--bar-bg) calc(var(--bars)*3.5),
      var(--bar-color) calc(var(--bars)*4),
      var(--bar-bg) calc(var(--bars)*5),
      var(--bar-bg) calc(var(--bars)*10)
    );

  background-position:
    calc((((50% - var(--background-x)) * 1.65) + 50% ) + (var(--background-y) * 0.5)) var(--background-x),
    calc((((50% - var(--background-x)) * -0.9) + 50%) - (var(--background-y) * 0.75) ) var(--background-y);

  background-size:
    200% 200%,
    200% 200%;

  background-blend-mode: screen;
  filter: brightness( 1.15 ) contrast( 1.1 );
  mix-blend-mode: hard-light;

}

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

  background-image:
    radial-gradient(
      farthest-corner circle
        at var(--glare-x) var(--glare-y),
        hsla(0, 0%, 90%, 0.8) 0%,
        hsla(0, 0%, 78%, 0.1) 25%,
        hsl(0, 0%, 0%) 90%
    );

  background-position:
    center center;

  background-size:
    cover;

  mix-blend-mode: luminosity;
  filter: brightness(0.6) contrast(4);

}

/*

  GLARE LAYERS

*/

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

  opacity: calc( var(--card-opacity) * .7 );
  filter: brightness(0.85) contrast(1.3);
  mix-blend-mode: overlay;

}

.card-body.card[data-rarity="rare holo"] .card__glare:after {

  content: "";
  position: absolute;
  inset: 0;
  border-radius: 5cqi;

  background-image:
    radial-gradient(
      farthest-corner circle at var(--glare-x) var(--glare-y),
      hsla(180, 100%, 95%, 0.5) 5%,
      hsla(0, 0%, 50%, 0.3) 55%,
      hsla(0, 0%, 0%, 0.25) 110%
    );

  mix-blend-mode: overlay;
  filter: brightness(.85) contrast(1.5);

}