/**
 * Package page — estilo AstroKey (blocos glass transparentes).
 * Paleta: #05070B, #0B0F17, #111827, #1F2937, #2F80FF, #0070F3, #F9FAFB, #9CA3AF
 */

:root {
  --ps-glass-bg: #05070b;
  --ps-glass-surface: rgba(11, 15, 23, 0.55);
  --ps-glass-surface-strong: rgba(17, 24, 39, 0.45);
  --ps-glass-border: rgba(255, 255, 255, 0.09);
  --ps-glass-border-soft: rgba(255, 255, 255, 0.06);
  --ps-glass-blue: #2f80ff;
  --ps-glass-blue-dark: #0070f3;
  --ps-glass-text: #f9fafb;
  --ps-glass-muted: #9ca3af;
  --ps-glass-radius: 14px;
  --ps-glass-blur: 20px;
  --ps-glass-buy-width: min(380px, 32vw);
}

/* ——— Fundo cinematográfico ——— */
body:has(.package-page-root.ps-glass) {
  background: var(--ps-glass-bg) !important;
}

.package-page-root.ps-glass {
  background: transparent;
}

.package-page-root.ps-glass .package-page-bg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: clamp(28rem, 88vh, 56rem);
  z-index: 0;
  background-color: var(--ps-glass-bg);
  background-size: cover;
  background-position: center 18%;
  background-repeat: no-repeat;
  background-attachment: scroll;
  filter: saturate(1.05);
  transform: none;
  -webkit-mask-image: linear-gradient(
    to bottom,
    #000 0%,
    #000 52%,
    rgba(0, 0, 0, 0.55) 78%,
    transparent 100%
  );
  mask-image: linear-gradient(
    to bottom,
    #000 0%,
    #000 52%,
    rgba(0, 0, 0, 0.55) 78%,
    transparent 100%
  );
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

/* Escurece progressivamente ao rolar (estilo AstroKey) */
.package-page-root.ps-glass .package-page-bg-scroll-shade {
  position: fixed;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: var(--ps-glass-bg);
  opacity: var(--package-scroll-darken, 0);
  will-change: opacity;
}

body:has(.package-page-root.ps-glass) .package-page-bg::before {
  background:
    radial-gradient(ellipse 85% 55% at 50% 18%, rgba(47, 128, 255, 0.07) 0%, transparent 55%),
    linear-gradient(
      to bottom,
      rgba(5, 7, 11, 0.12) 0%,
      rgba(5, 7, 11, 0.32) 45%,
      rgba(5, 7, 11, 0.58) 100%
    );
}

body:has(.package-page-root.ps-glass) .package-page-bg::after {
  background:
    radial-gradient(ellipse 120% 80% at 50% 100%, rgba(0, 0, 0, 0.45) 0%, transparent 52%),
    linear-gradient(90deg, rgba(0, 0, 0, 0.28) 0%, transparent 14%, transparent 86%, rgba(0, 0, 0, 0.28) 100%);
}

/* ——— Painel glass base ——— */
.package-page-root.ps-glass .ps-glass-panel {
  background: var(--ps-glass-surface);
  border: 1px solid var(--ps-glass-border);
  border-radius: var(--ps-glass-radius);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.28);
  -webkit-backdrop-filter: blur(var(--ps-glass-blur));
  backdrop-filter: blur(var(--ps-glass-blur));
  overflow: hidden;
}

.package-page-root.ps-glass .ps-glass-panel.ps-glass-buy {
  background: rgba(11, 15, 23, 0.78) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  overflow: hidden;
}

/* ——— Grid: galeria à esquerda, coluna compra + abas à direita ——— */
@media (min-width: 768px) {
  .package-page-root.ps-glass .package-page-main-grid {
    grid-template-columns: minmax(0, 1.7fr) minmax(260px, 340px);
    grid-template-areas: "gallery sidebar";
    align-items: start;
    gap: 1.25rem 1.5rem;
  }
}

@media (min-width: 1024px) {
  .package-page-root.ps-glass .package-page-main-grid {
    grid-template-columns: minmax(0, 2fr) minmax(300px, 380px);
    gap: 1.5rem 2rem;
  }
}

.package-page-root.ps-glass .package-page-area-sidebar {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  min-width: 0;
  width: 100%;
}

.package-page-root.ps-glass .package-page-area-sidebar .package-page-area-desc {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  width: 100%;
  --package-sidebar-panel-rgb: 15, 18, 26;
  --package-sidebar-panel-alpha: 0.84;
  --package-sidebar-panel-bg: rgba(var(--package-sidebar-panel-rgb), var(--package-sidebar-panel-alpha));
}

.package-page-root.ps-glass .package-page-area-sidebar .package-page-area-purchase {
  width: 100%;
}

.package-page-root.ps-glass .package-page-area-sidebar .package-content-panel,
.package-page-root.ps-glass .package-page-area-sidebar .security-card {
  width: 100%;
}

/* Painel da sidebar — fundo sólido compartilhado com o degradê do "Ver mais" */
.package-page-root.ps-glass .package-page-area-sidebar .package-content-panel {
  background: var(--package-sidebar-panel-bg) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

.package-page-root.ps-glass .package-page-area-sidebar .security-card {
  margin-top: 0;
  padding: 1.25rem 1.25rem 1.35rem;
  background: var(--package-sidebar-panel-bg) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

.package-page-root.ps-glass .package-page-area-sidebar .package-content-tabs {
  padding: 0.25rem 1.125rem 0;
}

.package-page-root.ps-glass .package-page-area-sidebar .package-content-tabs__btn {
  padding: 0.875rem 0.75rem;
  font-size: 0.75rem;
}

.package-page-root.ps-glass .package-page-area-sidebar .package-content-panel__body {
  padding: 1.125rem 1.25rem 1.35rem;
}

/* Degradê "Ver mais" — mesma cor/opacidade do painel (sem faixa escura) */
.package-page-root.ps-glass .package-page-area-sidebar .package-desc-read-more-fade {
  height: 4.75rem;
  background: linear-gradient(
    to bottom,
    rgba(var(--package-sidebar-panel-rgb), 0) 0%,
    rgba(var(--package-sidebar-panel-rgb), 0.28) 42%,
    rgba(var(--package-sidebar-panel-rgb), 0.62) 72%,
    rgba(var(--package-sidebar-panel-rgb), var(--package-sidebar-panel-alpha)) 100%
  ) !important;
}

.package-page-root.ps-glass .package-page-area-sidebar .package-desc-read-more-bar {
  margin-top: -1.25rem;
  padding-top: 0.5rem;
  position: relative;
  z-index: 3;
}

.package-page-root.ps-glass .package-page-area-sidebar #package-desc-read-more.package-desc-read-more {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0.375rem 0.625rem;
}

.package-page-root.ps-glass .package-page-area-sidebar #package-desc-read-more:hover {
  background: rgba(255, 255, 255, 0.05);
  border: none;
}

.package-page-root.ps-glass .package-page-area-sidebar .security-card__inner {
  flex-direction: column;
  align-items: flex-start;
  gap: 0.875rem;
}

.package-page-root.ps-glass .package-page-area-sidebar .security-card__title {
  margin-bottom: 0.5rem;
}

.package-page-root.ps-glass .package-page-area-sidebar .security-card__text {
  line-height: 1.55;
}

@media (min-width: 640px) {
  .package-page-root.ps-glass .package-page-area-sidebar {
    gap: 1.75rem;
  }

  .package-page-root.ps-glass .package-page-area-sidebar .package-page-area-desc {
    gap: 1.375rem;
  }
}

@media (min-width: 768px) {
  .package-page-root.ps-glass .package-page-area-sidebar {
    gap: 2rem;
  }

  .package-page-root.ps-glass .package-page-area-sidebar .package-page-area-desc {
    gap: 1.5rem;
  }
}

/* Card de compra: sem sticky/scroll interno — desce com a página */
.package-page-root.ps-glass .package-page-area-purchase {
  position: static !important;
  top: auto !important;
  max-height: none !important;
  overflow: visible !important;
  z-index: auto;
  align-self: start;
}

/* ——— Mídia / galeria (estilo PS5 — sem faixa preta nos trailers) ——— */
.package-page-root.ps-glass .ps-glass-media {
  padding: 1rem;
  overflow: visible;
}

@media (min-width: 640px) {
  .package-page-root.ps-glass .ps-glass-media {
    padding: 1.125rem 1.25rem 1rem;
  }
}

/* Theater integrado ao painel glass — sem caixa preta interna */
.package-page-root.ps-glass .package-theater {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0;
  overflow: visible;
}

.package-page-root.ps-glass .package-theater__screen {
  border-radius: 12px;
  overflow: hidden;
  background: transparent !important;
}

.package-page-root.ps-glass .package-theater__viewer {
  border-radius: 12px;
  overflow: hidden;
}

.package-page-root.ps-glass .package-theater__player {
  border-radius: 14px;
  background: rgba(0, 0, 0, 0.18) !important;
  min-height: clamp(14rem, 40vw, 30rem);
}

.package-page-root.ps-glass .package-theater__play-overlay {
  border-radius: 14px;
}

.package-page-root.ps-glass .package-theater__play-btn {
  background: rgba(6, 10, 20, 0.38);
  border: 2px solid rgba(47, 128, 255, 0.9);
  box-shadow:
    0 0 0 1px rgba(47, 128, 255, 0.22) inset,
    0 0 32px rgba(47, 128, 255, 0.42),
    0 8px 24px rgba(0, 0, 0, 0.38);
}

.package-page-root.ps-glass .package-theater__video-host,
.package-page-root.ps-glass .package-theater__trailer-root {
  background: transparent !important;
}

.package-page-root.ps-glass #package-gallery-trailer-root iframe.package-trailer-iframe,
.package-page-root.ps-glass #package-gallery-trailer-root video.package-trailer-hls {
  background: #0a0c10 !important;
}

/* Faixa de miniaturas — transparente, integrada ao glass */
.package-page-root.ps-glass .package-theater__dock {
  margin-top: 0.875rem;
  padding: 0 !important;
  background: transparent !important;
  border-top: none !important;
}

.package-page-root.ps-glass .package-theater__dock-row {
  gap: 0;
  align-items: center;
}

/* Setas circulares semi-transparentes */
.package-page-root.ps-glass .package-theater__nav {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.12);
  color: rgba(255, 255, 255, 0.85);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}

.package-page-root.ps-glass .package-theater__nav:hover:not(:disabled) {
  background: rgba(47, 128, 255, 0.22);
  border-color: rgba(47, 128, 255, 0.45);
  color: #fff;
}

.package-page-root.ps-glass .package-theater__thumbs,
.package-page-root.ps-glass #image-gallery.package-theater__thumbs {
  padding: 0.2rem 0.1rem;
  background: transparent;
}

.package-page-root.ps-glass .package-theater__thumbs-track {
  gap: 0.625rem;
}

.package-page-root.ps-glass #image-gallery.image-gallery--carousel-five,
.package-page-root.ps-glass #image-gallery:has(.gallery-thumbs--carousel-five) {
  overflow-x: auto !important;
  padding: 0.4rem 0 0.15rem;
}

.package-page-root.ps-glass .package-theater__dock:has(.gallery-thumbs--carousel-five) {
  margin-top: 1rem;
  padding-bottom: 0.15rem !important;
}

.package-page-root.ps-glass #gallery-thumbnails-container.gallery-thumbs--carousel-five {
  gap: 0.55rem;
}

.package-page-root.ps-glass #gallery-thumbnails-container.gallery-thumbs--carousel-five .gallery-thumb {
  border-radius: 10px !important;
  aspect-ratio: 16 / 10;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.28);
}

.package-page-root.ps-glass #gallery-thumbnails-container.gallery-thumbs--carousel-five .gallery-thumb.active,
.package-page-root.ps-glass #gallery-thumbnails-container.gallery-thumbs--carousel-five .gallery-thumb.is-active {
  border: 2px solid var(--ps-glass-blue) !important;
  box-shadow:
    0 8px 20px rgba(0, 0, 0, 0.32),
    0 0 18px rgba(47, 128, 255, 0.28) !important;
}

.package-page-root.ps-glass .package-theater .gallery-arrow {
  background: rgba(8, 12, 20, 0.48);
  border-color: rgba(255, 255, 255, 0.14);
}

.package-page-root.ps-glass .package-theater .gallery-arrow:hover {
  background: rgba(47, 128, 255, 0.24);
  border-color: rgba(47, 128, 255, 0.5);
}

/* Miniaturas — borda azul + glow no ativo */
.package-page-root.ps-glass .package-theater .gallery-thumb {
  border: 2px solid rgba(255, 255, 255, 0.1) !important;
  background: rgba(255, 255, 255, 0.04) !important;
  border-radius: 8px !important;
}

.package-page-root.ps-glass .package-theater .gallery-thumb--video,
.package-page-root.ps-glass .package-theater .gallery-thumb--video.is-thumb-loading {
  background: rgba(255, 255, 255, 0.04) !important;
}

.package-page-root.ps-glass .package-theater .gallery-thumb--video.is-thumb-loading {
  background: linear-gradient(
    110deg,
    rgba(255, 255, 255, 0.03) 42%,
    rgba(255, 255, 255, 0.09) 50%,
    rgba(255, 255, 255, 0.03) 58%
  ) !important;
  background-size: 220% 100%;
}

.package-page-root.ps-glass .package-theater .gallery-thumb:hover {
  border-color: rgba(255, 255, 255, 0.22) !important;
}

.package-page-root.ps-glass .package-theater .gallery-thumb.active,
.package-page-root.ps-glass .package-theater .gallery-thumb.is-active {
  border: 2px solid var(--ps-glass-blue) !important;
  outline: none !important;
  box-shadow: none !important;
}

.package-page-root.ps-glass .package-theater .gallery-thumb .gallery-thumb-play-overlay {
  background: linear-gradient(to top, rgba(0, 0, 0, 0.28) 0%, transparent 55%);
}

.package-page-root.ps-glass .package-theater .gallery-thumb .gallery-thumb-play-ring {
  width: 1.4rem;
  height: 1.4rem;
  background: rgba(8, 12, 22, 0.42);
  border: 1.5px solid rgba(47, 128, 255, 0.88);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  box-shadow:
    0 0 0 1px rgba(47, 128, 255, 0.2) inset,
    0 0 14px rgba(47, 128, 255, 0.35),
    0 2px 8px rgba(0, 0, 0, 0.35);
}

.package-page-root.ps-glass .package-theater .gallery-thumb.active .gallery-thumb-play-ring {
  background: rgba(10, 16, 30, 0.52);
  border-color: rgba(96, 165, 250, 0.95);
  box-shadow:
    0 0 0 1px rgba(96, 165, 250, 0.3) inset,
    0 0 18px rgba(47, 128, 255, 0.45),
    0 2px 10px rgba(0, 0, 0, 0.4);
}

/* Barra de progresso / scroll abaixo das miniaturas */
.package-page-root.ps-glass .package-theater__scroll-track {
  height: 2px;
  margin: 0.7rem 0.15rem 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
}

.package-page-root.ps-glass .package-theater__scroll-thumb {
  background: var(--ps-glass-blue);
  box-shadow: none;
  border-radius: 999px;
}

.package-page-root.ps-glass .package-theater__viewer > .gallery-progress-wrapper {
  height: 2px;
  background: rgba(255, 255, 255, 0.12);
  border-radius: 0 0 12px 12px;
}

.package-page-root.ps-glass .package-theater__viewer .gallery-progress-bar,
.package-page-root.ps-glass .gallery-progress-bar {
  background: linear-gradient(90deg, var(--ps-glass-blue) 0%, #60a5fa 100%);
  box-shadow: 0 0 10px rgba(47, 128, 255, 0.45);
}

/* ——— Card de compra ——— */
.package-page-root.ps-glass .ps-glass-buy {
  position: relative;
  border-radius: var(--ps-glass-radius);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.22);
}

.package-page-root.ps-glass .ps-glass-buy .package-sidebar {
  display: flex;
  flex-direction: column;
  gap: 0;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0;
  overflow: visible;
}

.package-page-root.ps-glass .ps-glass-panel.ps-glass-buy:has(.package-sidebar--has-logo) {
  overflow: hidden;
}

.package-page-root.ps-glass .package-sidebar--has-logo .package-purchase-logo-slot--banner {
  border-radius: var(--ps-glass-radius) var(--ps-glass-radius) 0 0;
}

.package-page-root.ps-glass .package-sidebar--has-logo .package-purchase-cover--banner,
.package-page-root.ps-glass .package-sidebar--has-logo #package-cover.package-purchase-cover--banner {
  border-radius: var(--ps-glass-radius) var(--ps-glass-radius) 0 0;
}

.package-page-root.ps-glass .ps-glass-buy .package-sidebar__head {
  border-bottom: none !important;
  padding: 0 !important;
  background: transparent !important;
}

.package-page-root.ps-glass .ps-glass-buy .package-sidebar__hero {
  padding: 1.125rem 1.25rem 0.85rem !important;
}

.package-page-root.ps-glass .ps-glass-buy .package-sidebar__cover-wrap {
  border-color: rgb(255 255 255 / 0.12);
  box-shadow: 0 10px 28px rgb(0 0 0 / 0.35);
}

.package-page-root.ps-glass .ps-glass-buy .package-sidebar--has-logo .package-sidebar__badges {
  padding: 0.75rem 1.25rem 0.2rem !important;
}

.package-page-root.ps-glass .ps-glass-buy .package-sidebar--has-logo .package-sidebar__badges-row {
  justify-content: flex-start;
}

.package-page-root.ps-glass .ps-glass-buy .package-sidebar--has-logo .package-sidebar__commerce {
  padding-top: 0.85rem !important;
}

.package-page-root.ps-glass .ps-glass-buy .package-sidebar__commerce {
  padding: 0 1.25rem 1rem !important;
  background: transparent !important;
}

.package-page-root.ps-glass .ps-glass-buy .package-sidebar__trust {
  margin-top: 0;
  padding: 0.875rem 1.25rem 1.25rem !important;
  border-top: 1px solid var(--ps-glass-border-soft);
  background: transparent !important;
}

.package-page-root.ps-glass .package-sidebar__title {
  color: var(--ps-glass-text);
  font-size: clamp(1.05rem, 2vw, 1.25rem);
  font-weight: 700;
  letter-spacing: -0.02em;
}

.package-page-root.ps-glass .package-sidebar__type {
  color: var(--ps-glass-muted);
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.package-page-root.ps-glass .package-sidebar__discount-badge {
  background: var(--ps-glass-blue) !important;
  color: #fff !important;
  font-weight: 700;
  border-radius: 6px;
  padding: 0.2rem 0.5rem;
  font-size: 0.75rem;
}

.package-page-root.ps-glass .package-sidebar__compare {
  color: var(--ps-glass-muted) !important;
  text-decoration: line-through;
  font-size: 0.875rem;
}

.package-page-root.ps-glass .package-sidebar__price {
  color: var(--ps-glass-text) !important;
  font-size: clamp(1.75rem, 4vw, 2.125rem) !important;
  font-weight: 800 !important;
  letter-spacing: -0.03em;
}

.package-page-root.ps-glass .package-sidebar__buy {
  background: var(--ps-glass-blue) !important;
  border: none !important;
  border-radius: 10px !important;
  font-size: 0.9375rem !important;
  font-weight: 600 !important;
  box-shadow: 0 4px 20px rgba(47, 128, 255, 0.35);
  transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
}

.package-page-root.ps-glass .package-sidebar__buy:hover:not(:disabled) {
  background: var(--ps-glass-blue-dark) !important;
  transform: translateY(-1px);
  box-shadow: 0 6px 24px rgba(0, 112, 243, 0.4);
}

.package-page-root.ps-glass .package-sidebar__wishlist {
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid var(--ps-glass-border) !important;
  color: var(--ps-glass-text) !important;
  border-radius: 10px !important;
}

.package-page-root.ps-glass .package-sidebar__wishlist:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
}

.package-page-root.ps-glass .package-sidebar__trust-item {
  color: var(--ps-glass-muted);
  font-size: 0.6875rem;
  font-weight: 500;
}

.package-page-root.ps-glass .package-sidebar__trust-icon {
  color: var(--ps-glass-blue);
}

/* Produtos relacionados: largura total, sem sobreposição do card de compra */
.package-page-root.ps-glass .package-list-section {
  position: relative;
  z-index: 1;
  margin-top: 2rem;
  clear: both;
}

/* ——— Detalhes conta Steam ——— */
.package-page-root.ps-glass .steam-account-spec {
  margin-top: 1.25rem;
  padding: 0;
  background: var(--ps-glass-surface);
  border: 1px solid var(--ps-glass-border);
  border-radius: var(--ps-glass-radius);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.28);
  -webkit-backdrop-filter: blur(var(--ps-glass-blur));
  backdrop-filter: blur(var(--ps-glass-blur));
}

.package-page-root.ps-glass .steam-account-spec .package-section-head {
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--ps-glass-border-soft);
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--ps-glass-text);
}

.package-page-root.ps-glass .package-section-head__icon {
  color: var(--ps-glass-blue);
}

.package-page-root.ps-glass .steam-account-spec__label {
  color: var(--ps-glass-muted);
}

.package-page-root.ps-glass .steam-account-spec__value {
  color: var(--ps-glass-text);
}

.package-page-root.ps-glass .steam-account-spec__layout {
  display: block;
  padding: 0;
}

.package-page-root.ps-glass .steam-account-spec__cover-col,
.package-page-root.ps-glass .steam-account-spec__cover {
  display: none !important;
}

.package-page-root.ps-glass .steam-account-spec__grid {
  width: 100%;
  padding: 1rem 1.25rem;
}

.package-page-root.ps-glass .steam-account-spec__highlight {
  color: var(--ps-glass-blue);
}

/* ——— Informações importantes ——— */
.package-page-root.ps-glass .package-pl2w-desc {
  margin-top: 1.25rem;
}

.package-page-root.ps-glass .package-pl2w-desc__card {
  background: var(--ps-glass-surface);
  border: 1px solid var(--ps-glass-border);
  border-radius: var(--ps-glass-radius);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.28);
  -webkit-backdrop-filter: blur(var(--ps-glass-blur));
  backdrop-filter: blur(var(--ps-glass-blur));
}

.package-page-root.ps-glass .package-pl2w-desc__heading {
  color: var(--ps-glass-text);
}

.package-page-root.ps-glass .package-pl2w-desc__heading-icon {
  color: var(--ps-glass-blue);
}

.package-page-root.ps-glass .package-pl2w-desc__content {
  color: var(--ps-glass-muted);
}

.package-page-root.ps-glass .package-pl2w-desc__fade {
  background: linear-gradient(
    to bottom,
    rgba(11, 15, 23, 0) 0%,
    rgba(11, 15, 23, 0.7) 45%,
    rgba(11, 15, 23, 0.95) 100%
  );
}

.package-page-root.ps-glass .package-pl2w-desc__btn {
  color: var(--ps-glass-blue);
}

/* ——— Cards produto (Boosteroid / Steam / Launcher) ——— */
.package-page-root.ps-glass .product-info-cards-wrapper--epic {
  margin-top: 1.25rem;
  padding: 1.25rem;
  background: var(--ps-glass-surface);
  border: 1px solid var(--ps-glass-border);
  border-radius: var(--ps-glass-radius);
  -webkit-backdrop-filter: blur(var(--ps-glass-blur));
  backdrop-filter: blur(var(--ps-glass-blur));
}

.package-page-root.ps-glass .product-info-cards-wrapper--epic::before {
  content: 'Sobre o jogo';
  display: flex;
  align-items: center;
  gap: 0.45rem;
  margin-bottom: 1rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--ps-glass-text);
}

.package-page-root.ps-glass .package-product-info-card {
  background: var(--ps-glass-surface-strong) !important;
  border: 1px solid var(--ps-glass-border-soft) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

.package-page-root.ps-glass .package-product-info-card__label {
  color: var(--ps-glass-muted) !important;
}

.package-page-root.ps-glass .package-product-info-card__value {
  color: var(--ps-glass-text) !important;
}

/* ——— Abas / conteúdo ——— */
.package-page-root.ps-glass .package-content-panel {
  background: var(--ps-glass-surface);
  border: 1px solid var(--ps-glass-border);
  border-radius: var(--ps-glass-radius);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.28);
  -webkit-backdrop-filter: blur(var(--ps-glass-blur));
  backdrop-filter: blur(var(--ps-glass-blur));
}

.package-page-root.ps-glass .package-content-tabs {
  border-bottom-color: var(--ps-glass-border-soft);
}

.package-page-root.ps-glass .package-content-tabs__btn.is-active {
  color: var(--ps-glass-text);
  border-bottom-color: var(--ps-glass-blue);
}

.package-page-root.ps-glass .package-content-tabs__btn:hover {
  color: rgba(249, 250, 251, 0.85);
}

.package-page-root.ps-glass #package-description {
  color: var(--ps-glass-muted);
}

.package-page-root.ps-glass #package-description strong {
  color: var(--ps-glass-text);
}

/* ——— Segurança ——— */
.package-page-root.ps-glass .security-card {
  background: var(--ps-glass-surface);
  border: 1px solid var(--ps-glass-border);
  border-radius: var(--ps-glass-radius);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.28);
  -webkit-backdrop-filter: blur(var(--ps-glass-blur));
  backdrop-filter: blur(var(--ps-glass-blur));
}

.package-page-root.ps-glass .security-card__icon {
  color: var(--ps-glass-blue);
  background: rgba(47, 128, 255, 0.12);
}

.package-page-root.ps-glass .security-card__title {
  color: var(--ps-glass-text);
}

.package-page-root.ps-glass .security-card__text {
  color: var(--ps-glass-muted);
}

/* ——— Produtos relacionados ——— */

/* ——— Barra mobile fixa ——— */
.ps-glass-mobile-bar {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem 1rem calc(0.75rem + env(safe-area-inset-bottom, 0px));
  background: rgba(5, 7, 11, 0.92);
  border-top: 1px solid var(--ps-glass-border);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
  transform: translateY(100%);
  opacity: 0;
  pointer-events: none;
  transition: transform 0.25s ease, opacity 0.25s ease;
}

.ps-glass-mobile-bar.is-visible {
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
}

.ps-glass-mobile-bar__info {
  flex: 1;
  min-width: 0;
}

.ps-glass-mobile-bar__discount {
  display: inline-block;
  margin-bottom: 0.15rem;
  padding: 0.1rem 0.4rem;
  background: var(--ps-glass-blue);
  color: #fff;
  font-size: 0.6875rem;
  font-weight: 700;
  border-radius: 4px;
}

.ps-glass-mobile-bar__price {
  margin: 0;
  font-size: 1.125rem;
  font-weight: 800;
  color: var(--ps-glass-text);
  line-height: 1.2;
}

.ps-glass-mobile-bar__buy {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  min-width: 8.5rem;
  padding: 0.75rem 1.25rem;
  background: var(--ps-glass-blue);
  color: #fff;
  font-size: 0.875rem;
  font-weight: 600;
  border: none;
  border-radius: 10px;
  cursor: pointer;
  box-shadow: 0 4px 16px rgba(47, 128, 255, 0.35);
}

.ps-glass-mobile-bar__buy:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

@media (min-width: 768px) {
  .ps-glass-mobile-bar {
    display: none !important;
  }

  body:has(.package-page-root.ps-glass) {
    padding-bottom: 0;
  }
}

@media (max-width: 767.98px) {
  body:has(.package-page-root.ps-glass) {
    padding-bottom: calc(4.5rem + env(safe-area-inset-bottom, 0px));
  }

  .package-page-root.ps-glass .package-page-area-purchase {
    display: none;
  }
}

/* ——— Variações dentro do card glass ——— */
.package-page-root.ps-glass .package-sidebar .variations-list,
.package-page-root.ps-glass .package-sidebar [data-component='VariationsList'] {
  border-color: var(--ps-glass-border-soft);
}