/* ==========================================================
   BOOM POKEDEX DIAMOND LOCK FIX V1
   Fix Diamond card layout and remove Shiny leakage.
   ========================================================== */

/* Small grid/list card for Diamond entries */
.portal-dex .dex-entry.dex-diamond-lockfix-entry {
  position: relative !important;
  overflow: hidden !important;
}

.portal-dex .dex-entry.dex-diamond-lockfix-entry [class*="shiny"],
.portal-dex .dex-entry.dex-diamond-lockfix-entry [data-shiny] {
  display: none !important;
}

.portal-dex .dex-entry.dex-diamond-lockfix-entry .dex-diamond-lockfix-badge {
  position: absolute !important;
  top: 8px !important;
  right: 8px !important;
  z-index: 12 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  min-height: 18px !important;
  padding: 0 8px !important;
  border: 1px solid rgba(153, 247, 255, .96) !important;
  border-radius: 999px !important;
  background: linear-gradient(180deg, rgba(26, 192, 235, .96), rgba(2, 86, 146, .96)) !important;
  color: #f4ffff !important;
  box-shadow:
    0 0 6px rgba(187, 254, 255, .85),
    0 0 15px rgba(70, 224, 255, .55) !important;
  font-size: 7px !important;
  font-weight: 950 !important;
  letter-spacing: .08em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

/* Active detail card: force Diamond to behave like normal layout */
.portal-dex .dex-detail.dex-diamond-lockfix-active .dex-detail__scanner {
  position: relative !important;
  overflow: hidden !important;
}

.portal-dex .dex-detail.dex-diamond-lockfix-active .dex-detail__scanner img {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  inset: auto !important;
  display: block !important;
  margin: 0 auto !important;
  object-fit: contain !important;
}

.portal-dex .dex-detail.dex-diamond-lockfix-active [class*="shiny"],
.portal-dex .dex-detail.dex-diamond-lockfix-active [data-shiny] {
  /* Re-hidden by JS outside the selector. CSS alone is not enough because
     we still want the Shiny form button to remain available if owned. */
}

.portal-dex .dex-detail.dex-diamond-lockfix-active .dex-diamond-lockfix-summary {
  display: inline-grid !important;
  grid-auto-flow: column !important;
  grid-template-columns: auto auto !important;
  grid-template-rows: auto auto !important;
  align-items: center !important;
  column-gap: 8px !important;
  row-gap: 2px !important;
  margin: 0 0 10px 0 !important;
  padding: 8px 12px !important;
  border: 1px solid rgba(117, 235, 255, .40) !important;
  border-radius: 12px !important;
  background:
    radial-gradient(circle at 20% 20%, rgba(151, 248, 255, .16), transparent 44%),
    linear-gradient(180deg, rgba(5, 24, 39, .92), rgba(3, 14, 24, .94)) !important;
  box-shadow:
    inset 0 0 18px rgba(96, 229, 255, .06),
    0 0 10px rgba(48, 202, 255, .14) !important;
}

.portal-dex .dex-detail.dex-diamond-lockfix-active .dex-diamond-lockfix-summary span {
  grid-row: 1 / span 2 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 24px !important;
  height: 24px !important;
  color: #dbffff !important;
  font-size: 18px !important;
  text-shadow: 0 0 10px rgba(86, 236, 255, .75) !important;
}

.portal-dex .dex-detail.dex-diamond-lockfix-active .dex-diamond-lockfix-summary strong {
  color: #f2ffff !important;
  font-size: 11px !important;
  font-weight: 950 !important;
  letter-spacing: .12em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
}

.portal-dex .dex-detail.dex-diamond-lockfix-active .dex-diamond-lockfix-summary small {
  color: #7feaff !important;
  font-size: 8px !important;
  font-weight: 800 !important;
  letter-spacing: .04em !important;
  line-height: 1.2 !important;
}

/* Stronger Diamond look, but keep normal footprint */
.portal-dex .dex-entry[data-dex-variant="diamond"] img,
.portal-dex .dex-detail.dex-diamond-lockfix-active .dex-detail__scanner img {
  filter:
    hue-rotate(72deg)
    saturate(1.45)
    brightness(1.22)
    contrast(1.04)
    drop-shadow(0 0 4px rgba(214, 255, 255, .98))
    drop-shadow(0 0 12px rgba(57, 228, 255, .72)) !important;
}

/* BOOM_DIAMOND_MATCH_NORMAL_STICKY_V2 */
/*
 * Base Pokédex detail cards use position: sticky; top: 24px.
 * pokedex-variants-v1.css changes .dex-detail.is-diamond
 * to position: relative, so Diamond scrolls away unlike Normal.
 */
.portal-dex .dex-detail.is-diamond,
.portal-dex .dex-detail.is-diamond.dex-diamond-lockfix-active {
  position: sticky !important;
  top: 24px !important;
  align-self: start !important;
}

/*
 * Keep the actual Pokemon image in the same scanner flow as Normal.
 */
.portal-dex .dex-detail.is-diamond .dex-detail__scanner img,
.portal-dex .dex-detail.is-diamond.dex-diamond-lockfix-active .dex-detail__scanner img {
  position: relative !important;
  inset: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
}

/*
 * Diamond is the visible highest-tier state.
 * The SHINY button inside Variant Form is intentionally preserved.
 */
.portal-dex .dex-entry[data-dex-variant="diamond"] [class*="shiny"],
.portal-dex .dex-entry[data-dex-variant="diamond"] [data-shiny] {
  display: none !important;
}

/* BOOM_REMOVE_DUPLICATE_DIAMOND_BADGE_V1
   Native pokedex-variants-v1.css already supplies the DIAMOND pill.
   Never display the extra lock-fix badge. */
.portal-dex .dex-entry .dex-diamond-lockfix-badge {
  display: none !important;
}

/* BOOM_DIAMOND_COLOR_LOCK_V1 */
/*
 * When DIAMOND is selected, force the large specimen image to use
 * the same cyan Diamond treatment as the small Diamond Pokedex card.
 *
 * This keys off three states:
 *  1) .is-diamond
 *  2) data-dex-active-variant="diamond"
 *  3) the actual pressed DIAMOND form button
 *
 * That keeps the color stable even if the variant click handler
 * swaps the underlying sprite source.
 */
.portal-dex .dex-detail.is-diamond .dex-detail__scanner img,
.portal-dex .dex-detail[data-dex-active-variant="diamond"] .dex-detail__scanner img,
.portal-dex .dex-detail:has(.dex-variant-form--diamond[aria-pressed="true"]) .dex-detail__scanner img {
  filter:
    hue-rotate(72deg)
    saturate(1.50)
    brightness(1.27)
    contrast(1.04)
    drop-shadow(0 0 4px rgba(212,255,255,.98))
    drop-shadow(0 0 12px rgba(46,221,255,.84)) !important;
}

/*
 * Never let a Shiny-specific image filter win while DIAMOND is pressed.
 * Shiny remains a separate selectable form in Variant Form.
 */
.portal-dex .dex-detail:has(.dex-variant-form--diamond[aria-pressed="true"]).is-shiny .dex-detail__scanner img,
.portal-dex .dex-detail:has(.dex-variant-form--diamond[aria-pressed="true"]) .is-shiny .dex-detail__scanner img {
  filter:
    hue-rotate(72deg)
    saturate(1.50)
    brightness(1.27)
    contrast(1.04)
    drop-shadow(0 0 4px rgba(212,255,255,.98))
    drop-shadow(0 0 12px rgba(46,221,255,.84)) !important;
}


/* ==========================================================
   BOOM POKEDEX VARIANT LOCK FIX V2 · RAINBOW PARITY
   ========================================================== */
.portal-dex .dex-entry.dex-rainbow-lockfix-entry {
  position: relative !important;
  overflow: hidden !important;
}

.portal-dex .dex-entry.dex-rainbow-lockfix-entry [class*="shiny"],
.portal-dex .dex-entry.dex-rainbow-lockfix-entry [data-shiny] {
  display: none !important;
}

.portal-dex .dex-detail.is-rainbow,
.portal-dex .dex-detail.is-rainbow.dex-rainbow-lockfix-active {
  position: sticky !important;
  top: 24px !important;
  align-self: start !important;
}

.portal-dex .dex-detail.is-rainbow .dex-detail__scanner img,
.portal-dex .dex-detail.is-rainbow.dex-rainbow-lockfix-active .dex-detail__scanner img {
  position: relative !important;
  inset: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
}

.portal-dex .dex-detail.dex-rainbow-lockfix-active .dex-diamond-lockfix-summary.is-rainbow {
  border-color: rgba(255,255,255,.48) !important;
  background:
    radial-gradient(circle at 15% 20%, rgba(255,83,201,.20), transparent 38%),
    radial-gradient(circle at 75% 24%, rgba(68,221,255,.18), transparent 42%),
    linear-gradient(110deg, rgba(29,8,43,.96), rgba(3,31,44,.96)) !important;
  box-shadow:
    inset 0 0 22px rgba(255,255,255,.05),
    0 0 14px rgba(95,218,255,.22) !important;
}

.portal-dex .dex-detail.dex-rainbow-lockfix-active .dex-diamond-lockfix-summary.is-rainbow span,
.portal-dex .dex-detail.dex-rainbow-lockfix-active .dex-diamond-lockfix-summary.is-rainbow strong {
  color: #fff !important;
  text-shadow:
    0 0 8px rgba(255,91,205,.65),
    0 0 13px rgba(70,222,255,.58) !important;
}

.portal-dex .dex-detail.dex-rainbow-lockfix-active .dex-diamond-lockfix-summary.is-rainbow small {
  color: #bdf9ff !important;
}

.portal-dex .dex-detail.is-rainbow .dex-detail__scanner img,
.portal-dex .dex-detail[data-dex-active-variant="rainbow"] .dex-detail__scanner img,
.portal-dex .dex-detail:has(.dex-variant-form--rainbow[aria-pressed="true"]) .dex-detail__scanner img {
  filter:
    saturate(1.58)
    brightness(1.22)
    contrast(1.03)
    drop-shadow(0 0 5px rgba(255,255,255,.90))
    drop-shadow(0 0 14px rgba(76,221,255,.62)) !important;
  animation:
    dexRainbowPokemon 5s linear infinite,
    dexDiamondFloat 4.6s ease-in-out infinite !important;
}

.portal-dex .dex-detail:has(.dex-variant-form--rainbow[aria-pressed="true"]).is-shiny .dex-detail__scanner img,
.portal-dex .dex-detail:has(.dex-variant-form--rainbow[aria-pressed="true"]) .is-shiny .dex-detail__scanner img {
  filter:
    saturate(1.58)
    brightness(1.22)
    contrast(1.03)
    drop-shadow(0 0 5px rgba(255,255,255,.90))
    drop-shadow(0 0 14px rgba(76,221,255,.62)) !important;
}