﻿/* XANY UI Contract Core - PavosNow market visual skin. */
.xany-pavosnow-market,
.xany-pav-premium {
  --xany-pav-card-radius: 18px;
  --xany-pav-gap: 12px;
  --xany-pav-transition: 260ms cubic-bezier(.34, 1.4, .64, 1);
  --xany-pav-fast: 180ms ease;
  --xany-pav-text: #ffffff;
  --xany-pav-muted: rgba(255, 255, 255, .68);
  --xany-pav-yellow: #f59e0b;
  --xany-pav-purple: #7c3aed;
  --xany-pav-common: linear-gradient(170deg, #4a5060 0%, #181b22 100%);
  --xany-pav-uncommon: linear-gradient(170deg, #1d6b30 0%, #0c1a12 100%);
  --xany-pav-rare: linear-gradient(170deg, #1a4aaa 0%, #0a1430 100%);
  --xany-pav-epic: linear-gradient(170deg, #6b1aaa 0%, #1e0830 100%);
  --xany-pav-legendary: linear-gradient(170deg, #b07a0a 0%, #3d2000 100%);
  --xany-pav-bundle: linear-gradient(135deg, #8a5a00 0%, #3d2800 60%, #1a1000 100%);
  --xany-pav-glow: rgba(168, 85, 247, .46);
}

.xany-pavosnow-market .xany-pav-section,
.xany-pav-premium .xany-pav-section {
  margin: 0 0 26px;
}

.xany-pavosnow-market .xany-pav-section__title,
.xany-pav-premium .xany-pav-section__title {
  margin: 0 0 14px;
  color: var(--xany-ink);
  font-size: 18px;
  font-weight: 900;
  line-height: 1.1;
  text-transform: uppercase;
}

.xany-pavosnow-market .xany-pav-grid,
.xany-pav-premium .xany-pav-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(228px, 1fr));
  column-gap: var(--xany-pav-gap);
  row-gap: clamp(34px, 3vw, 48px);
  align-items: start;
}

.xany-pavosnow-market .xany-pav-card,
.xany-pav-premium .xany-pav-card {
  position: relative;
  overflow: visible;
}

/* Reglas de DISTRIBUCION del hero bundle (grid-column/order) movidas al Shell.
   Shell mueve (cuanto espacio ocupa la card en el grid), UI pinta (composicion).
   Ver: xany-v2-app-shell.css, bloque .xany-home-pavos-view layout. */

.xany-pavosnow-market .xany-pav-card__btn,
.xany-pav-premium .xany-pav-card__btn {
  position: relative;
  display: block;
  width: 100%;
  overflow: visible;
  padding: 0;
  border: 0;
  border-radius: var(--xany-pav-card-radius);
  background: transparent;
  text-align: left;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.xany-pavosnow-market .xany-pav-card__btn:focus-visible,
.xany-pav-premium .xany-pav-card__btn:focus-visible {
  outline: 3px solid rgba(124, 58, 237, .66);
  outline-offset: 4px;
}

.xany-pavosnow-market .xany-pav-card__view,
.xany-pav-premium .xany-pav-card__view {
  position: absolute;
  top: 10px;
  right: 10px;
  bottom: auto;
  z-index: 12;
  display: grid;
  width: 36px !important;
  min-width: 36px !important;
  max-width: 36px !important;
  height: 36px !important;
  min-height: 36px !important;
  max-height: 36px !important;
  place-items: center;
  padding: 0 !important;
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 999px;
  background: rgba(124, 58, 237, .9);
  box-shadow: 0 12px 24px rgba(15, 23, 42, .32);
  color: #ffffff;
  cursor: pointer;
  font-size: 0;
  transition:
    transform var(--xany-pav-fast),
    background var(--xany-pav-fast),
    box-shadow var(--xany-pav-fast);
}

.xany-pavosnow-market .xany-pav-card__view::before,
.xany-pav-premium .xany-pav-card__view::before {
  content: "";
  width: 17px;
  height: 11px;
  border: 2px solid currentColor;
  border-radius: 999px / 70%;
}

.xany-pavosnow-market .xany-pav-card__view::after,
.xany-pav-premium .xany-pav-card__view::after {
  position: absolute;
  content: "";
  width: 5px;
  height: 5px;
  border-radius: 999px;
  background: currentColor;
}

.xany-pavosnow-market .xany-pav-card__view:hover,
.xany-pavosnow-market .xany-pav-card__view:focus-visible,
.xany-pav-premium .xany-pav-card__view:hover,
.xany-pav-premium .xany-pav-card__view:focus-visible {
  background: #5b21b6;
  box-shadow:
    0 16px 30px rgba(15, 23, 42, .38),
    0 0 0 3px rgba(124, 58, 237, .24);
  outline: 0;
  transform: translateY(-2px);
}

.xany-pavosnow-market .xany-pav-card__face,
.xany-pav-premium .xany-pav-card__face {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  border-radius: var(--xany-pav-card-radius);
  box-shadow: 0 16px 34px rgba(15, 23, 42, .22);
  transition:
    transform var(--xany-pav-fast),
    box-shadow var(--xany-pav-fast);
}

/* Aspect-ratio del HERO bundle (cuanto ocupa en altura cuando spannea 2 columnas)
   movido al Shell. Es geometria de distribucion, no composicion del componente.
   Composicion default (3/4) sigue viviendo aqui arriba en .xany-pav-card__face.
   Ver: xany-v2-app-shell.css, bloque .xany-home-pavos-view layout. */

.xany-pavosnow-market .xany-pav-card__btn:hover .xany-pav-card__face,
.xany-pav-premium .xany-pav-card__btn:hover .xany-pav-card__face {
  transform: translateY(-5px);
  box-shadow:
    0 22px 50px rgba(15, 23, 42, .34),
    0 0 0 2px var(--xany-pav-glow);
}

.xany-pavosnow-market .xany-pav-card__bg,
.xany-pav-premium .xany-pav-card__bg {
  position: absolute;
  inset: 0;
  display: block;
  background: var(--xany-pav-common);
}

.xany-pavosnow-market .rarity-uncommon .xany-pav-card__bg,
.xany-pav-premium .rarity-uncommon .xany-pav-card__bg {
  background: var(--xany-pav-uncommon);
  --xany-pav-glow: rgba(34, 197, 94, .42);
}

.xany-pavosnow-market .rarity-rare .xany-pav-card__bg,
.xany-pav-premium .rarity-rare .xany-pav-card__bg {
  background: var(--xany-pav-rare);
  --xany-pav-glow: rgba(59, 130, 246, .44);
}

.xany-pavosnow-market .rarity-epic .xany-pav-card__bg,
.xany-pav-premium .rarity-epic .xany-pav-card__bg {
  background: var(--xany-pav-epic);
  --xany-pav-glow: rgba(168, 85, 247, .5);
}

.xany-pavosnow-market .rarity-legendary .xany-pav-card__bg,
.xany-pav-premium .rarity-legendary .xany-pav-card__bg {
  background: var(--xany-pav-legendary);
  --xany-pav-glow: rgba(245, 158, 11, .5);
}

.xany-pavosnow-market .xany-pav-card--bundle .xany-pav-card__bg,
.xany-pav-premium .xany-pav-card--bundle .xany-pav-card__bg {
  background: var(--xany-pav-bundle);
  --xany-pav-glow: rgba(251, 191, 36, .5);
}

.xany-pavosnow-market .xany-pav-card__shine,
.xany-pav-premium .xany-pav-card__shine {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: block;
  pointer-events: none;
  background: linear-gradient(135deg, rgba(255, 255, 255, .14), rgba(255, 255, 255, .04) 42%, transparent 62%);
  transition: opacity var(--xany-pav-fast);
}

.xany-pavosnow-market .xany-pav-card__bundle-strip,
.xany-pav-premium .xany-pav-card__bundle-strip {
  position: absolute;
  right: 10px;
  bottom: 35%;
  z-index: 3;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.xany-pavosnow-market .xany-pav-card__bundle-thumb,
.xany-pav-premium .xany-pav-card__bundle-thumb {
  display: block;
  width: 36px;
  height: 36px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .22);
  border-radius: 8px;
  background: rgba(0, 0, 0, .35);
}

.xany-pavosnow-market .xany-pav-card__bundle-thumb img,
.xany-pav-premium .xany-pav-card__bundle-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.xany-pavosnow-market .xany-pav-card__media,
.xany-pav-premium .xany-pav-card__media {
  --xany-pav-media-y: 0%;
  position: absolute;
  left: 50%;
  bottom: 22%;
  z-index: 6;
  display: block;
  width: 85%;
  pointer-events: none;
  transform: translateX(-50%) translateY(var(--xany-pav-media-y));
  transition: transform var(--xany-pav-transition);
}

/* Override LEGACY eliminado: ponia el __media del --bundle/--wide con
   "left: 5%; width: 65%; transform: none" (imagen pegada a la izquierda).
   Era para el aspect 16/9 horizontal donde la card tenia 2 zonas
   (imagen-izq + texto-der). Ahora el aspect es 3/2 con composicion centrada,
   asi que la imagen vuelve a centrarse heredando del default (left: 50%;
   transform: translateX(-50%)). */

.xany-pavosnow-market .xany-pav-card__img,
.xany-pav-premium .xany-pav-card__img {
  display: block;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 10px 22px rgba(0, 0, 0, .72));
  transition: filter var(--xany-pav-transition);
}

.xany-pavosnow-market .xany-pav-card__btn:hover .xany-pav-card__media,
.xany-pav-premium .xany-pav-card__btn:hover .xany-pav-card__media {
  transform: translateX(-50%) translateY(calc(var(--xany-pav-media-y, 0%) - 12px)) scale(1.07);
}

/* Hover legacy eliminado: usaba "transform: translateY(-10px) scale(1.05)"
   sin translateX, lo que dejaba la imagen pegada a la izquierda al hacer
   hover (porque el --bundle/--wide tenia transform: none en base).
   Ahora hereda el hover default centrado: translateX(-50%) translateY(-12px). */

.xany-pavosnow-market .xany-pav-card__footer,
.xany-pav-premium .xany-pav-card__footer {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 7;
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 30px 12px 12px;
  background: linear-gradient(to top, rgba(0, 0, 0, .88), rgba(0, 0, 0, .5) 56%, transparent);
}

.xany-pavosnow-market .xany-pav-card__expires,
.xany-pavosnow-market .xany-pav-card__discount-badge,
.xany-pav-premium .xany-pav-card__expires,
.xany-pav-premium .xany-pav-card__discount-badge {
  display: inline-block;
  align-self: flex-start;
  padding: 3px 6px;
  border-radius: 4px;
  background: var(--xany-pav-yellow);
  color: #000000;
  font-size: 10px;
  font-weight: 900;
  line-height: 1.2;
  text-transform: uppercase;
}

.xany-pavosnow-market .xany-pav-card__name,
.xany-pav-premium .xany-pav-card__name {
  display: -webkit-box;
  overflow: hidden;
  color: var(--xany-pav-text);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.18;
  text-shadow: 0 1px 7px rgba(0, 0, 0, .9);
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.xany-pavosnow-market .xany-pav-card__price-row,
.xany-pav-premium .xany-pav-card__price-row {
  display: flex;
  align-items: center;
  gap: 5px;
  min-height: 19px;
  margin-top: 2px;
}

.xany-pavosnow-market .xany-pav-coin,
.xany-pav-premium .xany-pav-coin {
  display: inline-block;
  flex: 0 0 auto;
  width: 15px;
  height: 15px;
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 999px;
  background: radial-gradient(circle at 38% 36%, #ffd860 0%, #f59e0b 55%, #c97a00 100%);
  box-shadow: 0 0 8px rgba(245, 158, 11, .58);
}

.xany-pavosnow-market .xany-pav-card__price-value,
.xany-pav-premium .xany-pav-card__price-value {
  color: var(--xany-pav-text);
  font-size: 14px;
  font-weight: 900;
  line-height: 1;
  text-shadow: 0 1px 7px rgba(0, 0, 0, .9);
}

.xany-pavosnow-market .xany-pav-card__old-price,
.xany-pav-premium .xany-pav-card__old-price {
  color: rgba(255, 255, 255, .46);
  font-size: 11px;
  font-weight: 700;
  text-decoration: line-through;
}

.xany-pavosnow-market .xany-pav-card__plus,
.xany-pav-premium .xany-pav-card__plus {
  display: none;
}

.xany-pavosnow-market.is-shop-locked .xany-pav-card__btn,
.xany-pav-premium.is-shop-locked .xany-pav-card__btn {
  cursor: not-allowed;
}

.xany-pavosnow-market.is-shop-locked .xany-pav-card__face,
.xany-pav-premium.is-shop-locked .xany-pav-card__face {
  opacity: .58;
  filter: grayscale(.38);
}

.xany-pavosnow-market-shell.is-pavos-detail-mode .xany-pavosnow-market-head,
.xany-pavosnow-market-shell.is-pavos-detail-mode .xany-pavosnow-market,
.xany-pavosnow-market-shell.is-pavos-detail-mode .xany-pavosnow-market-selection {
  display: none;
}

/* === PavosNow Detail Panel (UI - bloque CONSOLIDADO) ========================
   Vista interna del producto cuando se abre desde una card.
   Es 100% UI: composicion + pintura del componente detail.
   El switch del slot a modo detalle (.is-pavos-detail-mode) vive en el Shell.
   Tema LIGHT (sobre fondo claro del shell). Variables de rareza dan el bg del stage. */

.xany-pavosnow-detail[hidden] {
  display: none !important;
}

.xany-pavosnow-detail {
  --xany-pav-detail-bg: var(--xany-pav-common);
  position: relative;
  display: grid;
  grid-template-columns: minmax(320px, 540px) minmax(280px, 420px);
  grid-template-areas: "stage copy";
  gap: clamp(24px, 4vw, 56px);
  justify-content: start;
  align-items: center;
  max-width: none;
  min-height: auto;
  margin: 0;
  padding: clamp(12px, 2vw, 22px) 0;
  background: transparent;
  box-shadow: none;
  color: var(--xany-pav-ink);
}

.xany-pavosnow-detail[data-rarity="uncommon"] {
  --xany-pav-detail-bg: var(--xany-pav-uncommon);
}

.xany-pavosnow-detail[data-rarity="rare"] {
  --xany-pav-detail-bg: var(--xany-pav-rare);
}

.xany-pavosnow-detail[data-rarity="epic"] {
  --xany-pav-detail-bg: var(--xany-pav-epic);
}

.xany-pavosnow-detail[data-rarity="legendary"] {
  --xany-pav-detail-bg: var(--xany-pav-legendary);
}

.xany-pavosnow-detail[data-display-type="lote"],
.xany-pavosnow-detail[data-display-type="bundle"] {
  --xany-pav-detail-bg: var(--xany-pav-bundle);
}

.xany-pavosnow-detail-back {
  position: relative;
  grid-area: stage;
  z-index: 5;
  display: inline-flex;
  align-self: start;
  justify-self: start;
  align-items: center;
  gap: 8px;
  width: max-content !important;
  min-height: 36px;
  max-width: calc(100% - 36px) !important;
  margin: 14px;
  padding: 0 14px;
  border: 1px solid rgba(109, 40, 217, .38);
  border-radius: 999px;
  background: rgba(255, 255, 255, .78);
  box-shadow: 0 12px 24px rgba(109, 40, 217, .16);
  backdrop-filter: blur(10px);
  color: #6d28d9;
  cursor: pointer;
  font-size: 13px;
  font-weight: 800;
}

.xany-pavosnow-detail-back::before {
  content: "<";
  font-size: 16px;
  line-height: 1;
}

.xany-pavosnow-detail-back:hover,
.xany-pavosnow-detail-back:focus-visible {
  border-color: rgba(109, 40, 217, .52);
  background: rgba(255, 255, 255, .9);
  color: #5b21b6;
  outline: 0;
  transform: translateY(-1px);
}

.xany-pavosnow-detail-stage {
  position: relative;
  grid-area: stage;
  display: grid;
  height: clamp(360px, 40vw, 500px);
  min-height: 0;
  place-items: center;
  overflow: hidden;
  padding: clamp(18px, 3.5%, 40px);
  border-radius: 20px;
  background: var(--xany-pav-detail-bg);
  box-shadow:
    0 26px 60px rgba(0, 0, 0, .36),
    inset 0 0 0 1px rgba(255, 255, 255, .14);
}

.xany-pavosnow-detail-bg {
  position: absolute;
  inset: 0;
  display: block;
  background:
    radial-gradient(circle at 18% 18%, rgba(255, 255, 255, .16), transparent 26%),
    radial-gradient(circle at 80% 18%, rgba(255, 255, 255, .12), transparent 30%),
    linear-gradient(to top, rgba(0, 0, 0, .34), transparent 58%);
}

.xany-pavosnow-detail-stage img,
.xany-pavosnow-detail-stage video {
  position: relative;
  z-index: 2;
  display: block;
  width: auto;
  height: clamp(300px, 36vw, 460px);
  max-width: 92%;
  object-fit: contain;
  filter: drop-shadow(0 26px 38px rgba(0, 0, 0, .66));
}

.xany-pavosnow-detail-stage video {
  width: min(100%, 500px);
  height: min(100%, 460px);
  border-radius: 16px;
  background: transparent;
}

.xany-pavosnow-detail-stage img[hidden],
.xany-pavosnow-detail-stage video[hidden] {
  display: none !important;
}

.xany-pavosnow-detail-copy {
  position: relative;
  grid-area: copy;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-self: center;
  gap: 14px;
  min-width: 0;
  padding: 0;
}

.xany-pavosnow-detail-kicker {
  display: inline-block;
  align-self: flex-start;
  padding: 3px 10px;
  border-radius: 5px;
  background: rgba(15, 22, 41, .07);
  color: #475069;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.xany-pavosnow-detail-copy h3 {
  max-width: 540px;
  margin: 0;
  color: var(--xany-pav-ink);
  font-size: clamp(28px, 3.4vw, 48px);
  font-weight: 1000;
  letter-spacing: 0;
  line-height: .96;
  text-transform: uppercase;
  text-shadow: none;
}

.xany-pavosnow-detail-copy p {
  margin: 0;
  color: #475069;
  font-size: 15px;
  font-weight: 700;
}

.xany-pavosnow-detail-copy p[hidden] {
  display: none;
}

.xany-pavosnow-detail-price {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 9px;
  padding-top: 6px;
}

.xany-pavosnow-detail-price strong {
  color: #b45309;
  font-size: clamp(24px, 2.6vw, 34px);
  font-weight: 1000;
  line-height: 1;
}

.xany-pavosnow-detail-price .xany-pav-coin {
  width: 22px !important;
  min-width: 22px;
  height: 22px !important;
}

.xany-pavosnow-detail-included {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(74px, 1fr));
  gap: 10px;
  max-width: 520px;
  padding-top: 4px;
}

/* 4e: included-item corregido a LIGHT theme (antes tenia colores dark sobre
   un detail panel que se rediseno a light, era bug visual heredado). */
.xany-pavosnow-detail-included-item {
  display: grid;
  min-height: 78px;
  padding: 8px;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(15, 22, 41, .12);
  border-radius: 12px;
  background: rgba(15, 22, 41, .04);
  color: #475069;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.15;
  text-align: center;
}

.xany-pavosnow-detail-included-item img {
  display: block;
  width: 48px;
  height: 48px;
  object-fit: contain;
  filter: drop-shadow(0 8px 12px rgba(15, 22, 41, .26));
}

.xany-pavosnow-detail-select {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  max-width: 360px;
  margin-top: 10px;
  padding: 0 28px;
  border: 0;
  border-radius: 14px;
  background: linear-gradient(135deg, #8b5cf6 0%, #6d28d9 100%);
  box-shadow:
    0 18px 38px rgba(109, 40, 217, .36),
    0 10px 20px rgba(124, 58, 237, .24);
  color: #ffffff;
  cursor: pointer;
  font-size: 16px;
  font-weight: 1000;
  text-transform: uppercase;
}

.xany-pavosnow-detail-select:hover,
.xany-pavosnow-detail-select:focus-visible {
  filter: brightness(1.04);
  outline: 0;
  transform: translateY(-1px);
}

@media (max-width: 920px) {
  .xany-pavosnow-detail {
    grid-template-columns: 1fr;
    grid-template-areas: "stage" "copy";
    min-height: auto;
  }

  .xany-pavosnow-detail-copy {
    justify-content: flex-start;
    padding-top: 8px;
  }
}

@media (max-width: 640px) {
  .xany-pavosnow-market .xany-pav-grid,
  .xany-pav-premium .xany-pav-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  .xany-pavosnow-market .xany-pav-section__title,
  .xany-pav-premium .xany-pav-section__title {
    font-size: 15px;
  }

  .xany-pavosnow-detail {
    padding: 14px;
    padding-bottom: 92px;
    border-radius: 22px;
  }

  .xany-pavosnow-detail-stage {
    height: 320px;
    min-height: 190px;
  }

  .xany-pavosnow-detail-stage img,
  .xany-pavosnow-detail-stage video {
    height: 260px;
    max-width: 86%;
  }

  .xany-pavosnow-detail-copy h3 {
    font-size: 24px;
  }

  .xany-pavosnow-detail-copy {
    gap: 10px;
  }

  .xany-pavosnow-detail-select {
    width: 100%;
    max-width: none;
  }
}

/* MV11 correction: UI owns premium PavosNow paint; Shell only moves state/media. */
.xany-pavosnow-market,
.xany-pav-premium {
  --xany-pav-card-radius: 20px;
  --xany-pav-gap: 16px;
  --xany-pav-ink: #0f1629;
  --xany-pav-yellow: #f5a623;
  --xany-pav-fast: 160ms ease;
  --xany-pav-transition: 280ms cubic-bezier(.34, 1.4, .64, 1);
}

.xany-pavosnow-slot .xany-pavosnow-market-head span,
.xany-home-pavos-view .xany-pavosnow-market-head span {
  color: #b45309;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.xany-pavosnow-slot .xany-pavosnow-market-head h2,
.xany-home-pavos-view .xany-pavosnow-market-head h2 {
  color: var(--xany-pav-ink);
  font-size: clamp(28px, 2.5vw, 42px);
  font-style: italic;
  font-weight: 1000;
  letter-spacing: 0;
  line-height: .92;
  text-transform: uppercase;
}

.xany-pavosnow-slot .xany-pavosnow-market-head > strong,
.xany-home-pavos-view .xany-pavosnow-market-head > strong {
  border-color: rgba(15, 22, 41, .14);
  background: rgba(15, 22, 41, .06);
  color: var(--xany-pav-ink);
  box-shadow: none;
}

.xany-pavosnow-market .xany-pav-section,
.xany-pav-premium .xany-pav-section {
  margin: 0 0 30px;
}

.xany-pavosnow-market .xany-pav-section__title,
.xany-pav-premium .xany-pav-section__title {
  margin: 0 0 16px;
  color: rgba(15, 22, 41, .5);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .12em;
  line-height: 1;
}

.xany-pavosnow-market .xany-pav-card:hover,
.xany-pavosnow-market .xany-pav-card:focus-within,
.xany-pav-premium .xany-pav-card:hover,
.xany-pav-premium .xany-pav-card:focus-within {
  z-index: 20;
}

/* Regla muerta eliminada: --bundle/--featured { grid-column: 1 / -1 } estaba
   siendo pisada por el paso 1 (span 2) en el Shell. Quedaba como deuda redundante. */

.xany-pavosnow-market .xany-pav-card__face,
.xany-pav-premium .xany-pav-card__face {
  aspect-ratio: 3 / 4;
  overflow: hidden;
  box-shadow: 0 14px 32px rgba(15, 22, 41, .22), inset 0 0 0 1px rgba(255, 255, 255, .08);
}

/* aspect-ratio: auto y height: clamp(...) eliminados (eran movimiento que pisaba
   los aspect-ratio del Shell del paso 1: --bundle 2/1, --featured 16/9 + min-height).
   Sin la altura forzada, el aspect del Shell toma control y el hero recupera
   proporcion real. overflow: hidden es UI (composicion) y queda. */
.xany-pavosnow-market .xany-pav-card--bundle .xany-pav-card__face,
.xany-pavosnow-market .xany-pav-card--featured .xany-pav-card__face,
.xany-pav-premium .xany-pav-card--bundle .xany-pav-card__face,
.xany-pav-premium .xany-pav-card--featured .xany-pav-card__face {
  overflow: hidden;
}

.xany-pavosnow-market .xany-pav-card--popout .xany-pav-card__face,
.xany-pav-premium .xany-pav-card--popout .xany-pav-card__face {
  overflow: visible;
  clip-path: inset(-58px 0 0 0 round var(--xany-pav-card-radius));
}

.xany-pavosnow-market .xany-pav-card__bg,
.xany-pav-premium .xany-pav-card__bg,
.xany-pavosnow-market .xany-pav-card__shine,
.xany-pav-premium .xany-pav-card__shine {
  border-radius: var(--xany-pav-card-radius);
}

.xany-pavosnow-market .xany-pav-card__face::after,
.xany-pav-premium .xany-pav-card__face::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 2;
  height: 3px;
  background: var(--xany-pav-glow, rgba(168, 85, 247, .46));
  opacity: .85;
}

.xany-pavosnow-market .xany-pav-card__view,
.xany-pav-premium .xany-pav-card__view {
  top: 12px;
  right: 12px;
  width: 38px !important;
  min-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  border-color: rgba(255, 255, 255, .22);
  background: rgba(12, 8, 30, .72);
  backdrop-filter: blur(8px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, .44);
}

.xany-pavosnow-market .xany-pav-card__view:hover,
.xany-pavosnow-market .xany-pav-card__view:focus-visible,
.xany-pav-premium .xany-pav-card__view:hover,
.xany-pav-premium .xany-pav-card__view:focus-visible {
  background: rgba(124, 58, 237, .9);
  transform: translateY(-2px) scale(1.08);
}

.xany-pavosnow-market .xany-pav-card__media,
.xany-pav-premium .xany-pav-card__media {
  --xany-pav-media-y: 10%;
  top: 8%;
  bottom: 18%;
  width: 82%;
}

.xany-pavosnow-market .xany-pav-card--popout .xany-pav-card__media,
.xany-pav-premium .xany-pav-card--popout .xany-pav-card__media {
  --xany-pav-media-y: 10%;
  top: -18%;
  bottom: 8%;
  width: 96%;
}

.xany-pavosnow-market .xany-pav-card--profile-character .xany-pav-card__media,
.xany-pav-premium .xany-pav-card--profile-character .xany-pav-card__media,
.xany-pavosnow-market .xany-pav-card--profile-bundle-single .xany-pav-card__media,
.xany-pav-premium .xany-pav-card--profile-bundle-single .xany-pav-card__media {
  --xany-pav-media-y: 12%;
  top: -30%;
  bottom: -4%;
  width: 114%;
}

.xany-pavosnow-market .xany-pav-card--profile-bundle-group .xany-pav-card__media,
.xany-pav-premium .xany-pav-card--profile-bundle-group .xany-pav-card__media {
  --xany-pav-media-y: 14%;
  top: -20%;
  bottom: 2%;
  width: 106%;
}

.xany-pavosnow-market .xany-pav-card--profile-tool .xany-pav-card__media,
.xany-pav-premium .xany-pav-card--profile-tool .xany-pav-card__media {
  --xany-pav-media-y: 8%;
  top: -14%;
  bottom: 12%;
  width: 92%;
}

.xany-pavosnow-market .xany-pav-card--popout.xany-pav-card--tall .xany-pav-card__media,
.xany-pav-premium .xany-pav-card--popout.xany-pav-card--tall .xany-pav-card__media {
  --xany-pav-media-y: 12%;
  top: -26%;
  bottom: 6%;
  width: 100%;
}

.xany-pavosnow-market .xany-pav-card--profile-character.xany-pav-card--tall .xany-pav-card__media,
.xany-pav-premium .xany-pav-card--profile-character.xany-pav-card--tall .xany-pav-card__media,
.xany-pavosnow-market .xany-pav-card--profile-bundle-single.xany-pav-card--tall .xany-pav-card__media,
.xany-pav-premium .xany-pav-card--profile-bundle-single.xany-pav-card--tall .xany-pav-card__media {
  --xany-pav-media-y: 14%;
  top: -34%;
  bottom: -6%;
  width: 118%;
}

/* Override "imagen a la derecha" eliminado: era para el aspect 2/1 legacy
   horizontal. Con el aspect 3/2 actual, las cards bundle/featured heredan el
   pop-out arriba (top: -10%, bottom: 12%, width: 88%) del default de cards. */

.xany-pavosnow-market .xany-pav-card__img,
.xany-pav-premium .xany-pav-card__img {
  position: relative;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center center;
  filter: drop-shadow(0 14px 26px rgba(0, 0, 0, .78));
}

.xany-pavosnow-market .xany-pav-card__img--variant,
.xany-pav-premium .xany-pav-card__img--variant {
  position: absolute;
  inset: 0;
  opacity: 0;
  animation: xany-pav-variant-cycle-2 var(--xany-pav-variant-duration, 6s) linear infinite;
  animation-delay: var(--xany-pav-variant-delay, 0s);
}

.xany-pavosnow-market .xany-pav-card__media[data-xany-pavos-variants="3"] .xany-pav-card__img--variant,
.xany-pav-premium .xany-pav-card__media[data-xany-pavos-variants="3"] .xany-pav-card__img--variant {
  animation-name: xany-pav-variant-cycle-3;
}

.xany-pavosnow-market .xany-pav-card__media[data-xany-pavos-variants="4"] .xany-pav-card__img--variant,
.xany-pav-premium .xany-pav-card__media[data-xany-pavos-variants="4"] .xany-pav-card__img--variant {
  animation-name: xany-pav-variant-cycle-4;
}

.xany-pavosnow-market .xany-pav-card__media[data-xany-pavos-variants="5"] .xany-pav-card__img--variant,
.xany-pav-premium .xany-pav-card__media[data-xany-pavos-variants="5"] .xany-pav-card__img--variant {
  animation-name: xany-pav-variant-cycle-5;
}

.xany-pavosnow-market .xany-pav-card__media[data-xany-pavos-variants="6"] .xany-pav-card__img--variant,
.xany-pav-premium .xany-pav-card__media[data-xany-pavos-variants="6"] .xany-pav-card__img--variant {
  animation-name: xany-pav-variant-cycle-6;
}

.xany-pavosnow-market .xany-pav-card__media[data-xany-pavos-variants="7"] .xany-pav-card__img--variant,
.xany-pav-premium .xany-pav-card__media[data-xany-pavos-variants="7"] .xany-pav-card__img--variant {
  animation-name: xany-pav-variant-cycle-7;
}

.xany-pavosnow-market .xany-pav-card__media[data-xany-pavos-variants="8"] .xany-pav-card__img--variant,
.xany-pav-premium .xany-pav-card__media[data-xany-pavos-variants="8"] .xany-pav-card__img--variant {
  animation-name: xany-pav-variant-cycle-8;
}

.xany-pavosnow-market .xany-pav-card__img--variant:first-child,
.xany-pav-premium .xany-pav-card__img--variant:first-child {
  opacity: 1;
}

.xany-pavosnow-market .xany-pav-card--variant-cycle .xany-pav-card__media::after,
.xany-pav-premium .xany-pav-card--variant-cycle .xany-pav-card__media::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(115deg, transparent 0%, transparent 34%, rgba(255, 255, 255, .24) 48%, rgba(255, 255, 255, .08) 56%, transparent 70%, transparent 100%);
  mix-blend-mode: screen;
  opacity: 0;
  transform: translateX(-140%);
  animation: xany-pav-variant-reflect 3s ease-in-out infinite;
}

.xany-pavosnow-market .xany-pav-card--popout .xany-pav-card__img,
.xany-pav-premium .xany-pav-card--popout .xany-pav-card__img {
  /* center top: la imagen se alinea al TOP del __media que sobresale. */
  object-position: center top;
}

.xany-pavosnow-market .xany-pav-card__btn:hover .xany-pav-card__face,
.xany-pav-premium .xany-pav-card__btn:hover .xany-pav-card__face {
  transform: translateY(-6px);
  box-shadow: 0 24px 56px rgba(15, 22, 41, .3), 0 0 0 2px var(--xany-pav-glow), inset 0 0 0 1px rgba(255, 255, 255, .14);
}

.xany-pavosnow-market .xany-pav-card__btn:hover .xany-pav-card__media,
.xany-pav-premium .xany-pav-card__btn:hover .xany-pav-card__media {
  transform: translateX(-50%) translateY(calc(var(--xany-pav-media-y, 0%) - 6px)) scale(1.03);
}

.xany-pavosnow-market .xany-pav-card--popout .xany-pav-card__btn:hover .xany-pav-card__media,
.xany-pav-premium .xany-pav-card--popout .xany-pav-card__btn:hover .xany-pav-card__media {
  transform: translateX(-50%) translateY(calc(var(--xany-pav-media-y, 0%) - 14px)) scale(1.08);
}

.xany-pavosnow-market .xany-pav-card--profile-tool .xany-pav-card__btn:hover .xany-pav-card__media,
.xany-pav-premium .xany-pav-card--profile-tool .xany-pav-card__btn:hover .xany-pav-card__media,
.xany-pavosnow-market .xany-pav-card--profile-bundle-group .xany-pav-card__btn:hover .xany-pav-card__media,
.xany-pav-premium .xany-pav-card--profile-bundle-group .xany-pav-card__btn:hover .xany-pav-card__media {
  transform: translateX(-50%) translateY(calc(var(--xany-pav-media-y, 0%) - 10px)) scale(1.045);
}

@keyframes xany-pav-variant-cycle-2 {
  0%,
  46% {
    opacity: 1;
  }
  50%,
  100% {
    opacity: 0;
  }
}

@keyframes xany-pav-variant-cycle-3 {
  0%,
  30% {
    opacity: 1;
  }
  33.333%,
  100% {
    opacity: 0;
  }
}

@keyframes xany-pav-variant-cycle-4 {
  0%,
  22% {
    opacity: 1;
  }
  25%,
  100% {
    opacity: 0;
  }
}

@keyframes xany-pav-variant-cycle-5 {
  0%,
  17% {
    opacity: 1;
  }
  20%,
  100% {
    opacity: 0;
  }
}

@keyframes xany-pav-variant-cycle-6 {
  0%,
  14% {
    opacity: 1;
  }
  16.666%,
  100% {
    opacity: 0;
  }
}

@keyframes xany-pav-variant-cycle-7 {
  0%,
  12% {
    opacity: 1;
  }
  14.286%,
  100% {
    opacity: 0;
  }
}

@keyframes xany-pav-variant-cycle-8 {
  0%,
  10.5% {
    opacity: 1;
  }
  12.5%,
  100% {
    opacity: 0;
  }
}

@keyframes xany-pav-variant-reflect {
  0%,
  70% {
    opacity: 0;
    transform: translateX(-140%);
  }
  84% {
    opacity: .72;
  }
  100% {
    opacity: 0;
    transform: translateX(140%);
  }
}

/* Hover transform "imagen a la derecha" eliminado: heredan el default
   translateX(-50%) translateY(-14px) scale(1.08) que es el pop-out hover. */

.xany-pavosnow-market .xany-pav-card__footer,
.xany-pav-premium .xany-pav-card__footer {
  padding: 42px 14px 16px;
  border-radius: 0 0 var(--xany-pav-card-radius) var(--xany-pav-card-radius);
  background: linear-gradient(to top, rgba(0, 0, 0, .93) 0%, rgba(0, 0, 0, .62) 52%, transparent 100%);
}

/* Footer max-width 58% eliminado: era para que el texto quede a la izquierda
   mientras la imagen se posicionaba a la derecha. Con pop-out arriba, el
   footer ocupa todo el ancho como en las cards normales. */

.xany-pavosnow-market .xany-pav-card__old-price,
.xany-pav-premium .xany-pav-card__old-price,
.xany-pavosnow-detail-price del {
  display: none;
}

/* === Bloque B2 detail panel CONSOLIDADO arriba (linea ~388) =================
   Las override de tema light + grid-template-areas + video + coin + light kicker
   ya fueron fusionados con el bloque B1 base en un unico bloque consolidado.
   Lo unico que se preserva aqui son los OVERRIDE de cards en el responsive
   @media 640px que tambien estaban dentro de este bloque (no son del detail). */

@media (max-width: 640px) {
  .xany-pavosnow-market .xany-pav-grid,
  .xany-pav-premium .xany-pav-grid {
    column-gap: 12px;
    row-gap: 40px;
  }

  .xany-pavosnow-market .xany-pav-card__media,
  .xany-pav-premium .xany-pav-card__media {
    top: 6%;
    bottom: 18%;
    width: 78%;
  }

  .xany-pavosnow-market .xany-pav-card--popout .xany-pav-card__media,
  .xany-pav-premium .xany-pav-card--popout .xany-pav-card__media {
    top: -8%;
    bottom: 12%;
    width: 80%;
  }

  .xany-pavosnow-market .xany-pav-card--profile-character .xany-pav-card__media,
  .xany-pav-premium .xany-pav-card--profile-character .xany-pav-card__media,
  .xany-pavosnow-market .xany-pav-card--profile-bundle-single .xany-pav-card__media,
  .xany-pav-premium .xany-pav-card--profile-bundle-single .xany-pav-card__media {
    top: -18%;
    bottom: 2%;
    width: 104%;
  }

  .xany-pavosnow-market .xany-pav-card--profile-bundle-group .xany-pav-card__media,
  .xany-pav-premium .xany-pav-card--profile-bundle-group .xany-pav-card__media {
    top: -12%;
    bottom: 8%;
    width: 96%;
  }

  .xany-pavosnow-market .xany-pav-card--profile-tool .xany-pav-card__media,
  .xany-pav-premium .xany-pav-card--profile-tool .xany-pav-card__media {
    top: -8%;
    bottom: 14%;
    width: 86%;
  }

  .xany-pavosnow-market .xany-pav-card--bundle .xany-pav-card__face,
  .xany-pav-premium .xany-pav-card--bundle .xany-pav-card__face {
    height: clamp(200px, 56vw, 280px);
  }
}
@media (prefers-reduced-motion: reduce) {
  .xany-pavosnow-market .xany-pav-card__face,
  .xany-pavosnow-market .xany-pav-card__media,
  .xany-pavosnow-market .xany-pav-card__img,
  .xany-pav-premium .xany-pav-card__face,
  .xany-pav-premium .xany-pav-card__media,
  .xany-pav-premium .xany-pav-card__img {
    transition: none;
  }

  .xany-pavosnow-market .xany-pav-card__btn:hover .xany-pav-card__face,
  .xany-pav-premium .xany-pav-card__btn:hover .xany-pav-card__face {
    transform: none;
  }

  .xany-pavosnow-market .xany-pav-card__img--variant,
  .xany-pav-premium .xany-pav-card__img--variant,
  .xany-pavosnow-market .xany-pav-card--variant-cycle .xany-pav-card__media::after,
  .xany-pav-premium .xany-pav-card--variant-cycle .xany-pav-card__media::after {
    animation: none;
  }

  .xany-pavosnow-market .xany-pav-card__img--variant,
  .xany-pav-premium .xany-pav-card__img--variant {
    opacity: 0;
  }

  .xany-pavosnow-market .xany-pav-card__img--variant:first-child,
  .xany-pav-premium .xany-pav-card__img--variant:first-child {
    opacity: 1;
  }
}

/* PavosNow category-controlled market. Shell moves the scene; UI paints filters and cards. */
/* El ensanche del hero en Pavosnow vive en el Shell (xany-v2-app-shell.css): Shell mueve, UI pinta.
   Aqui no se toca .xany-home-hero. */

/* Layout del market (grid del shell, stage, .xany-pav-grid de cards y
   distribucion de columnas para category-panel/stage) movido al Shell.
   Shell mueve; UI pinta. La composicion visual del category-panel sigue abajo. */

/* Category-panel — solo COMPOSICION + PINTURA (UI).
   El movimiento (sticky/top/max-height/min-width/overflow) vive en el Shell. */
.xany-home-pavos-view .xany-pavosnow-category-panel {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 16px;
  border: 1px solid rgba(226, 232, 240, .94);
  border-radius: 26px;
  background: rgba(255, 255, 255, .88);
  box-shadow: 0 18px 44px rgba(15, 23, 42, .07);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
  scrollbar-width: thin;
  scrollbar-color: rgba(124, 58, 237, .42) rgba(226, 232, 240, .65);
}

.xany-home-pavos-view .xany-pavosnow-category-panel::-webkit-scrollbar {
  width: 8px;
}

.xany-home-pavos-view .xany-pavosnow-category-panel::-webkit-scrollbar-track {
  border-radius: 999px;
  background: rgba(226, 232, 240, .55);
}

.xany-home-pavos-view .xany-pavosnow-category-panel::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(124, 58, 237, .42);
}

.xany-home-pavos-view .xany-pavos-category-button {
  width: 100%;
  min-height: 42px;
  padding: 9px 13px;
  border: 1px solid rgba(221, 214, 254, .92);
  border-radius: 14px;
  background: rgba(255, 255, 255, .62);
  color: #111827;
  cursor: pointer;
  font-size: 13px;
  font-weight: 950;
  line-height: 1.15;
  letter-spacing: 0;
  text-align: left;
  overflow-wrap: anywhere;
  transition:
    transform 160ms ease,
    border-color 160ms ease,
    box-shadow 160ms ease;
}

.xany-home-pavos-view .xany-pavos-category-button:hover,
.xany-home-pavos-view .xany-pavos-category-button:focus-visible {
  border-color: rgba(124, 58, 237, .48);
  box-shadow: 0 10px 22px rgba(109, 40, 217, .12);
  outline: 0;
  transform: translateY(-1px);
}

.xany-home-pavos-view .xany-pavos-category-button[aria-pressed="true"] {
  border-color: rgba(109, 40, 217, .45);
  background: linear-gradient(135deg, #8b5cf6 0%, #6d28d9 100%);
  color: #ffffff;
  box-shadow: 0 16px 30px rgba(109, 40, 217, .26);
}

/* is-pavos-detail-mode (geometria del market en modo detalle) y grid-column
   del --featured movidos al Shell. Tambien se eliminaron redundancias:
   - --bundle { grid-column: auto } ya esta cubierto por el paso 1 con ~
   - --bundle face { aspect-ratio: 3/4 } ya esta en el face general (linea 138)
   Solo quedan aqui las propiedades de COMPOSICION del face. */
.xany-home-pavos-view .xany-pavosnow-market .xany-pav-card--bundle .xany-pav-card__face,
.xany-home-pavos-view .xany-pav-premium .xany-pav-card--bundle .xany-pav-card__face,
.xany-home-pavos-view .xany-pavosnow-market .xany-pav-card--featured .xany-pav-card__face,
.xany-home-pavos-view .xany-pav-premium .xany-pav-card--featured .xany-pav-card__face {
  height: auto;
}

.xany-home-pavos-view .xany-pavosnow-market .xany-pav-card--featured .xany-pav-card__face,
.xany-home-pavos-view .xany-pav-premium .xany-pav-card--featured .xany-pav-card__face {
  border: 2px solid rgba(14, 165, 233, .72);
}

.xany-home-pavos-view .xany-pavosnow-market .xany-pav-card--popout .xany-pav-card__face,
.xany-home-pavos-view .xany-pav-premium .xany-pav-card--popout .xany-pav-card__face {
  overflow: visible;
}

@media (max-width: 1100px) {
  /* Composicion mobile del category-panel (UI). El movimiento mobile
     (grid-template-columns, grid-column, position/top/max-height/overflow)
     vive en el Shell. */
  .xany-home-pavos-view .xany-pavosnow-category-panel {
    flex-direction: row;
    padding: 10px;
    border-radius: 20px;
  }

  .xany-home-pavos-view .xany-pavos-category-button {
    flex: 0 0 auto;
    width: auto;
    max-width: 220px;
    white-space: normal;
  }
}

@media (max-width: 760px) {
  /* Composicion mobile de --featured (UI): el overflow del face, el positioning
     del media dentro del face y el styling del footer. El movimiento mobile
     (grid-column: auto, aspect-ratio: 3/4, min-height: 0) vive en el Shell. */

  .xany-home-pavos-view .xany-pavosnow-market .xany-pav-card--popout.xany-pav-card--featured .xany-pav-card__face,
  .xany-home-pavos-view .xany-pav-premium .xany-pav-card--popout.xany-pav-card--featured .xany-pav-card__face {
    overflow: visible;
  }

  .xany-home-pavos-view .xany-pavosnow-market .xany-pav-card--popout.xany-pav-card--featured .xany-pav-card__media,
  .xany-home-pavos-view .xany-pav-premium .xany-pav-card--popout.xany-pav-card--featured .xany-pav-card__media {
    top: -8%;
    right: auto;
    bottom: 12%;
    left: 50%;
    width: 82%;
    transform: translateX(-50%);
  }

  .xany-home-pavos-view .xany-pavosnow-market .xany-pav-card--featured .xany-pav-card__footer,
  .xany-home-pavos-view .xany-pav-premium .xany-pav-card--featured .xany-pav-card__footer {
    max-width: none;
    padding: 42px 14px 16px;
    background: linear-gradient(to top, rgba(0, 0, 0, .93) 0%, rgba(0, 0, 0, .62) 52%, transparent 100%);
  }
}
