.pghv2-standard-page {
  width: 100%;
  padding: 22px 0 42px;
}

.pghv2-standard-shell .pghv2-shell {
  width: min(var(--pghv2-max-width), calc(100dvw - 24px));
}

.pghv2-page-hero-card,
.pghv2-standard-content-card,
.pghv2-standard-sidebar-card {
  border-radius: var(--pghv2-radius);
  border: 1px solid var(--pghv2-border);
  background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.015));
  box-shadow: 0 18px 52px rgba(0, 0, 0, var(--pghv2-shadow-alpha));
}

.pghv2-page-hero-card {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(320px, 0.7fr);
  gap: 26px;
  padding: 34px;
  align-items: stretch;
}

.pghv2-page-kicker {
  display: inline-flex;
  align-items: center;
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid var(--pghv2-border-strong);
  background: rgba(18, 55, 120, 0.45);
  color: var(--pghv2-accent-2) !important;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.pghv2-page-hero-copy h1 {
  margin: 18px 0 14px;
  font-size: clamp(38px, 4vw, 62px);
  line-height: 0.96;
  letter-spacing: -0.04em;
}

.pghv2-page-lead {
  margin: 0;
  max-width: 760px;
  font-size: 20px;
  line-height: 1.7;
  color: var(--pghv2-muted) !important;
}

.pghv2-page-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 24px;
}

.pghv2-page-sidecard {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 28px;
  border-radius: var(--pghv2-radius);
  border: 1px solid var(--pghv2-border);
  background: linear-gradient(180deg, rgba(10, 26, 52, 0.88), rgba(5, 17, 34, 0.92));
}

.pghv2-page-sidecard h3 {
  margin: 0 0 12px;
  font-size: 28px;
}

.pghv2-page-sidecard p {
  margin: 0 0 18px;
  font-size: 16px;
  line-height: 1.7;
}

.pghv2-page-side-links,
.pghv2-standard-link-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 12px;
}

.pghv2-page-side-links a,
.pghv2-standard-link-list a {
  display: block;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.03);
  color: var(--pghv2-text) !important;
}

.pghv2-standard-content-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 24px;
  align-items: start;
}

.pghv2-standard-content-card {
  padding: 34px;
}

.pghv2-standard-content-card h2,
.pghv2-standard-content-card h3,
.pghv2-standard-content-card h4 {
  margin-top: 0;
}

.pghv2-standard-content-card > *:first-child {
  margin-top: 0;
}

.pghv2-standard-content-card > *:last-child {
  margin-bottom: 0;
}

.pghv2-standard-content-card p,
.pghv2-standard-content-card li,
.pghv2-standard-content-card td,
.pghv2-standard-content-card th,
.pghv2-standard-content-card label {
  font-size: 17px;
  line-height: 1.8;
  color: var(--pghv2-muted) !important;
}

.pghv2-standard-content-card a {
  color: var(--pghv2-accent-2) !important;
}

.pghv2-standard-content-card ul,
.pghv2-standard-content-card ol {
  padding-left: 22px;
}

.pghv2-standard-content-card blockquote {
  margin: 24px 0;
  padding: 18px 20px;
  border-left: 3px solid var(--pghv2-accent);
  background: rgba(255,255,255,0.03);
  border-radius: 0 14px 14px 0;
}

.pghv2-standard-content-card table {
  width: 100%;
  border-collapse: collapse;
}

.pghv2-standard-content-card th,
.pghv2-standard-content-card td {
  padding: 12px 14px;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

.pghv2-standard-content-card .wp-block-button__link,
.pghv2-standard-content-card .button,
.pghv2-standard-content-card button,
.pghv2-standard-content-card input[type="submit"] {
  font-family: var(--pghv2-font) !important;
  font-weight: 600 !important;
}

.pghv2-standard-content-card details {
  border: 1px solid var(--pghv2-border);
  border-radius: 16px;
  background: rgba(255,255,255,0.02);
  margin-bottom: 14px;
  overflow: hidden;
}

.pghv2-standard-content-card summary {
  list-style: none;
  cursor: pointer;
  padding: 18px 22px;
  color: var(--pghv2-text) !important;
  font-weight: 600;
}

.pghv2-standard-content-card details > *:not(summary) {
  padding: 0 22px 18px;
}

.pghv2-standard-sidebar {
  display: grid;
  gap: 18px;
}

.pghv2-standard-sidebar-card {
  padding: 22px;
}

.pghv2-standard-sidebar-card h3 {
  margin: 0 0 12px;
  font-size: 22px;
}

.pghv2-standard-sidebar-card p {
  margin: 0 0 16px;
}

.pghv2-standard-support-card .pghv2-btn {
  width: 100%;
  justify-content: center;
}

@media (max-width: 1080px) {
  .pghv2-page-hero-card,
  .pghv2-standard-content-grid {
    grid-template-columns: 1fr;
  }

  .pghv2-page-sidecard {
    order: 2;
  }
}

.pghv2-standard-content-card,
.pghv2-standard-sidebar-card {
  min-width: 0;
  overflow-wrap: break-word;
  word-wrap: break-word;
}
.pghv2-standard-content-card > *,
.pghv2-standard-sidebar-card > * {
  min-width: 0;
  max-width: 100%;
}

@media (max-width: 782px) {
  .pghv2-standard-page {
    padding: 12px 0 28px;
    overflow-x: hidden;
  }
  .pghv2-standard-content-card,
  .pghv2-standard-sidebar-card {
    max-width: 100%;
    overflow-x: hidden;
  }
  /* Protect against plugin-rendered elements with fixed widths blowing out on mobile */
  .pghv2-standard-content-card img,
  .pghv2-standard-content-card table,
  .pghv2-standard-content-card iframe,
  .pghv2-standard-content-card pre {
    max-width: 100%;
    height: auto;
  }
  .pghv2-standard-content-card .pg-mytrades,
  .pghv2-standard-content-card .pg-section,
  .pghv2-standard-content-card .pg-mode {
    max-width: 100%;
    overflow: hidden;
  }

  .pghv2-page-hero-card,
  .pghv2-standard-content-card,
  .pghv2-standard-sidebar-card {
    padding: 22px;
  }

  .pghv2-page-hero-copy h1 {
    font-size: clamp(32px, 12vw, 48px);
  }

  .pghv2-page-lead,
  .pghv2-standard-content-card p,
  .pghv2-standard-content-card li,
  .pghv2-standard-content-card td,
  .pghv2-standard-content-card th {
    font-size: 16px;
  }

  .pghv2-page-actions {
    flex-direction: column;
  }

  .pghv2-page-actions .pghv2-btn {
    width: 100%;
    justify-content: center;
  }
}

/* ==========================================================================
   Hero card single-column variant (v1.7.62)
   When the hero has no sidecard (e.g. shortcode-driven pages like My Trades),
   collapse to a single column so the copy block doesn't sit in a 2-col grid
   with empty right space.
   ========================================================================== */
.pghv2-page-hero-card:not(:has(.pghv2-page-sidecard)) {
  grid-template-columns: 1fr;
}

/* ==========================================================================
   My Trades — full visual rework (v1.7.63)
   Overrides the PokeGens Sale Automator plugin's inline white-on-white
   styling. Uses theme variables for full dark-navy + brand-blue alignment.
   High specificity (.pghv2-page-body .pg-mytrades) and !important flags
   are required to win against the plugin's inline <style> blocks.
   ========================================================================== */

/* ---- Outer wrapper ---- */
.pghv2-page-body .pg-mytrades {
  max-width: 1100px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  color: var(--pghv2-text) !important;
  font-family: inherit !important;
}

.pghv2-page-body .pg-mytrades-head {
  margin: 0 0 22px 0 !important;
  padding: 0 !important;
  text-align: left !important;
}

.pghv2-page-body .pg-mytrades-title {
  font-size: 26px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  color: var(--pghv2-text) !important;
  margin: 0 0 8px 0 !important;
  letter-spacing: -0.01em !important;
}

.pghv2-page-body .pg-mytrades-sub {
  font-size: 14px !important;
  line-height: 1.6 !important;
  color: var(--pghv2-muted) !important;
  opacity: 1 !important;
  max-width: 640px !important;
}

/* ---- Section/order card (the <details> wrapper) ---- */
.pghv2-page-body .pg-mytrades .pg-section {
  background: var(--pghv2-bg-alt) !important;
  border: 1px solid var(--pghv2-border) !important;
  border-radius: 16px !important;
  margin: 14px 0 !important;
  overflow: hidden !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}

.pghv2-page-body .pg-mytrades .pg-section:hover {
  border-color: var(--pghv2-border-strong) !important;
}

/* Pending orders stand out — brighter border + subtle glow */
.pghv2-page-body .pg-mytrades .pg-section:has(.pg-badge:not(:empty)):has([class*="pending"]),
.pghv2-page-body .pg-mytrades .pg-section.has-pending {
  border-color: rgba(116, 212, 255, 0.4) !important;
}

/* Fade back orders that are entirely completed/invalid (no pending badge) */
.pghv2-page-body .pg-mytrades .pg-section:not(:has(.pg-badge)):not([open]),
.pghv2-page-body .pg-mytrades .pg-section[data-state="completed"] {
  opacity: 0.65 !important;
}

/* Summary row (clickable header) */
.pghv2-page-body .pg-mytrades .pg-section > summary {
  padding: 18px 22px !important;
  cursor: pointer !important;
  list-style: none !important;
  font-weight: 600 !important;
  color: var(--pghv2-text) !important;
  background: transparent !important;
}

.pghv2-page-body .pg-mytrades .pg-section > summary::-webkit-details-marker {
  display: none !important;
}

.pghv2-page-body .pg-mytrades .pg-order-summary {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  flex-wrap: wrap !important;
}

.pghv2-page-body .pg-mytrades .pg-order-left {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  min-width: 0 !important;
  flex: 1 1 auto !important;
}

.pghv2-page-body .pg-mytrades .pg-order-id {
  font-weight: 700 !important;
  font-size: 16px !important;
  color: var(--pghv2-text) !important;
}

.pghv2-page-body .pg-mytrades .pg-order-meta {
  font-size: 13px !important;
  color: var(--pghv2-muted) !important;
  opacity: 1 !important;
}

.pghv2-page-body .pg-mytrades .pg-order-right {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex: 0 0 auto !important;
}

/* Order status badge (e.g. "1 pending") — primary cue, brand cyan */
.pghv2-page-body .pg-mytrades .pg-badge {
  display: inline-flex !important;
  align-items: center !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  padding: 5px 12px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(116, 212, 255, 0.35) !important;
  background: rgba(35, 140, 255, 0.18) !important;
  color: var(--pghv2-accent-2) !important;
  white-space: nowrap !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
}

/* Chevron — circular outline, brand colour */
.pghv2-page-body .pg-mytrades .pg-chevron {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 30px !important;
  height: 30px !important;
  border-radius: 999px !important;
  border: 1px solid var(--pghv2-border-strong) !important;
  background: rgba(116, 212, 255, 0.05) !important;
  color: var(--pghv2-accent-2) !important;
  font-size: 14px !important;
  line-height: 1 !important;
  transition: transform 0.2s ease, background 0.2s ease !important;
}

.pghv2-page-body .pg-mytrades .pg-chevron::before {
  content: '▸' !important;
  color: var(--pghv2-accent-2) !important;
}

.pghv2-page-body .pg-mytrades details[open] > summary .pg-chevron {
  transform: rotate(90deg) !important;
  background: rgba(116, 212, 255, 0.18) !important;
}

/* Game chips inside the summary preview */
.pghv2-page-body .pg-mytrades .pg-order-preview {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin-top: 10px !important;
  flex-wrap: wrap !important;
}

.pghv2-page-body .pg-mytrades .pg-game-chips {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

.pghv2-page-body .pg-mytrades .pg-chip {
  font-size: 11px !important;
  font-weight: 700 !important;
  border: 1px solid var(--pghv2-border) !important;
  border-radius: 999px !important;
  padding: 4px 10px !important;
  background: rgba(7, 19, 37, 0.7) !important;
  color: var(--pghv2-muted) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
}

/* Tiny item thumbs in summary preview */
.pghv2-page-body .pg-mytrades .pg-order-thumbs {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

.pghv2-page-body .pg-mytrades .pg-order-thumbs img {
  width: 28px !important;
  height: 28px !important;
  object-fit: contain !important;
  border-radius: 8px !important;
  background: rgba(7, 19, 37, 0.85) !important;
  padding: 2px !important;
  border: 1px solid var(--pghv2-border) !important;
}

/* ---- Section body (expanded content) ---- */
.pghv2-page-body .pg-mytrades .pg-section-body {
  padding: 18px 22px 22px 22px !important;
  border-top: 1px solid var(--pghv2-border) !important;
  background: rgba(3, 11, 23, 0.35) !important;
}

.pghv2-page-body .pg-mytrades .pg-order-body {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}

/* Mode block (per-game grouping, e.g. "Z-A", "SWSH") */
.pghv2-page-body .pg-mytrades .pg-mode {
  border: 1px solid var(--pghv2-border) !important;
  border-radius: 14px !important;
  padding: 16px !important;
  background: rgba(7, 19, 37, 0.55) !important;
}

.pghv2-page-body .pg-mytrades .pg-mode-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  flex-wrap: wrap !important;
  margin-bottom: 14px !important;
  padding-bottom: 14px !important;
  border-bottom: 1px solid var(--pghv2-border) !important;
}

.pghv2-page-body .pg-mytrades .pg-mode-title {
  font-weight: 700 !important;
  font-size: 15px !important;
  color: var(--pghv2-accent-2) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
}

/* ---- THE Start Trade button — brand gradient, prominent ---- */
.pghv2-page-body .pg-mytrades .pg-startwrap {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}

.pghv2-page-body .pg-mytrades .getpokemonbtn,
.pghv2-page-body .pg-mytrades button.button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 12px 22px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  border-radius: 12px !important;
  border: 1px solid transparent !important;
  background: linear-gradient(135deg, #238cff 0%, #74d4ff 100%) !important;
  color: #ffffff !important;
  text-transform: none !important;
  letter-spacing: 0.01em !important;
  cursor: pointer !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease !important;
  box-shadow: 0 4px 18px rgba(35, 140, 255, 0.35) !important;
  min-height: 44px !important;
  line-height: 1 !important;
}

.pghv2-page-body .pg-mytrades .getpokemonbtn:hover,
.pghv2-page-body .pg-mytrades button.button:hover:not(:disabled) {
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 24px rgba(35, 140, 255, 0.5) !important;
}

.pghv2-page-body .pg-mytrades .getpokemonbtn.pgsa-resume {
  background: rgba(7, 19, 37, 0.9) !important;
  border-color: var(--pghv2-border-strong) !important;
  color: var(--pghv2-accent-2) !important;
  box-shadow: none !important;
}

.pghv2-page-body .pg-mytrades button.button:disabled,
.pghv2-page-body .pg-mytrades button.button[disabled] {
  background: rgba(7, 19, 37, 0.6) !important;
  color: var(--pghv2-muted) !important;
  border-color: var(--pghv2-border) !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
  opacity: 0.6 !important;
}

/* ---- Items inside expanded mode block ---- */
.pghv2-page-body .pg-mytrades .pg-items {
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

.pghv2-page-body .pg-mytrades .pg-item {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  padding: 12px 14px !important;
  border: 1px solid var(--pghv2-border) !important;
  border-radius: 12px !important;
  background: rgba(3, 11, 23, 0.6) !important;
  transition: border-color 0.15s ease !important;
}

.pghv2-page-body .pg-mytrades .pg-item:hover {
  border-color: var(--pghv2-border-strong) !important;
}

.pghv2-page-body .pg-mytrades .pg-item-left {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
  flex: 1 1 auto !important;
}

.pghv2-page-body .pg-mytrades .pg-item-left img {
  width: 44px !important;
  height: 44px !important;
  object-fit: contain !important;
  border-radius: 10px !important;
  background: rgba(7, 19, 37, 0.85) !important;
  padding: 4px !important;
  border: 1px solid var(--pghv2-border) !important;
  flex: 0 0 auto !important;
}

.pghv2-page-body .pg-mytrades .pg-item-name {
  font-weight: 600 !important;
  font-size: 14px !important;
  color: var(--pghv2-text) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.pghv2-page-body .pg-mytrades .pg-item-sub {
  font-size: 12px !important;
  color: var(--pghv2-muted) !important;
  opacity: 1 !important;
  margin-top: 2px !important;
}

.pghv2-page-body .pg-mytrades .pg-item-sub-coupon {
  color: var(--pghv2-accent-2) !important;
  font-weight: 600 !important;
}

/* ---- Status pills on items ---- */
.pghv2-page-body .pg-mytrades .pg-status {
  display: inline-flex !important;
  align-items: center !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  padding: 5px 12px !important;
  border-radius: 999px !important;
  border: 1px solid var(--pghv2-border) !important;
  background: rgba(7, 19, 37, 0.7) !important;
  color: var(--pghv2-muted) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  white-space: nowrap !important;
  flex: 0 0 auto !important;
}

.pghv2-page-body .pg-mytrades .pg-status.pending {
  border-color: rgba(116, 212, 255, 0.4) !important;
  background: rgba(35, 140, 255, 0.18) !important;
  color: var(--pghv2-accent-2) !important;
}

.pghv2-page-body .pg-mytrades .pg-status.delivered {
  border-color: rgba(0, 182, 122, 0.4) !important;
  background: rgba(0, 182, 122, 0.15) !important;
  color: #00b67a !important;
}

.pghv2-page-body .pg-mytrades .pg-status.invalid {
  border-color: rgba(245, 158, 11, 0.4) !important;
  background: rgba(245, 158, 11, 0.12) !important;
  color: #fbbf24 !important;
}

.pghv2-page-body .pg-mytrades .pg-status.manual {
  border-color: rgba(147, 197, 253, 0.4) !important;
  background: rgba(147, 197, 253, 0.12) !important;
  color: #93c5fd !important;
}

/* Manual delivery box */
.pghv2-page-body .pg-mytrades .pg-manual-box {
  border: 1px solid rgba(245, 158, 11, 0.3) !important;
  background: rgba(245, 158, 11, 0.08) !important;
  color: var(--pghv2-text) !important;
  border-radius: 12px !important;
  padding: 12px 14px !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
  margin-bottom: 12px !important;
}

/* ---- My Coupons block ---- */
.pghv2-page-body .pg-mytrades .pg-coupons-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

.pghv2-page-body .pg-mytrades .pg-coupon {
  border: 1px solid var(--pghv2-border) !important;
  border-radius: 12px !important;
  padding: 12px !important;
  background: rgba(3, 11, 23, 0.6) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

.pghv2-page-body .pg-mytrades .pg-coupon-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

.pghv2-page-body .pg-mytrades .pg-code {
  font-family: 'SF Mono', Menlo, Consolas, monospace !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  color: var(--pghv2-accent-2) !important;
  word-break: break-all !important;
  min-width: 0 !important;
}

.pghv2-page-body .pg-mytrades .pg-coupon-actions {
  display: flex !important;
  gap: 6px !important;
}

.pghv2-page-body .pg-mytrades .pgsa-usecoupon,
.pghv2-page-body .pg-mytrades .pgsa-copycode,
.pghv2-page-body .pg-mytrades .pg-copy {
  font-size: 11px !important;
  padding: 6px 12px !important;
  border-radius: 8px !important;
  border: 1px solid var(--pghv2-border-strong) !important;
  background: rgba(7, 19, 37, 0.85) !important;
  color: var(--pghv2-text) !important;
  cursor: pointer !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
}

.pghv2-page-body .pg-mytrades .pgsa-usecoupon:hover,
.pghv2-page-body .pg-mytrades .pgsa-copycode:hover,
.pghv2-page-body .pg-mytrades .pg-copy:hover {
  border-color: var(--pghv2-accent-2) !important;
  color: var(--pghv2-accent-2) !important;
}

.pghv2-page-body .pg-mytrades .pg-amt {
  font-size: 12px !important;
  color: var(--pghv2-muted) !important;
  opacity: 1 !important;
}

/* Coupon notice banner */
.pghv2-page-body .pg-mytrades .pgsa-coupon-notice {
  border: 1px solid rgba(0, 182, 122, 0.4) !important;
  background: rgba(0, 182, 122, 0.12) !important;
  color: #00b67a !important;
  border-radius: 12px !important;
  padding: 12px 16px !important;
  margin-bottom: 14px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

/* ---- Mobile: stack everything cleanly ---- */
@media (max-width: 720px) {
  .pghv2-page-body .pg-mytrades .pg-section > summary {
    padding: 14px 16px !important;
  }
  .pghv2-page-body .pg-mytrades .pg-section-body {
    padding: 14px 16px 16px 16px !important;
  }
  .pghv2-page-body .pg-mytrades .pg-mode {
    padding: 14px !important;
  }
  .pghv2-page-body .pg-mytrades .pg-mode-head {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
  }
  .pghv2-page-body .pg-mytrades .pg-startwrap {
    width: 100% !important;
  }
  .pghv2-page-body .pg-mytrades .getpokemonbtn,
  .pghv2-page-body .pg-mytrades button.button {
    width: 100% !important;
    padding: 14px 22px !important;
  }
  .pghv2-page-body .pg-mytrades .pg-item {
    flex-wrap: wrap !important;
  }
  .pghv2-page-body .pg-mytrades .pg-coupons-grid {
    grid-template-columns: 1fr !important;
  }
  .pghv2-page-body .pg-mytrades .pg-mytrades-title {
    font-size: 22px !important;
  }
}

/* ==========================================================================
   Standard page background — match homepage atmosphere (v1.7.64)
   The base shell gradient is top-anchored and runs out below ~700px, leaving
   long content pages looking flat. Add a persistent background to .pghv2-page-body
   so non-homepage pages get the same alive gradient feel as the homepage.
   ========================================================================== */
body.pghv2-page-body {
  background:
    radial-gradient(circle at 16% 8%, rgba(20,115,255,0.16), transparent 38%),
    radial-gradient(circle at 84% 4%, rgba(0,198,255,0.10), transparent 32%),
    linear-gradient(180deg, #030b17 0%, #071325 50%, #030b17 100%) !important;
  background-attachment: fixed !important;
  min-height: 100vh !important;
}

/* Let the page body gradient show through on standard (non-home) pages.
   The shell on the homepage has its own gradient; on standard pages we want
   the body-level gradient to be the visible layer. */
body.pghv2-page-body .pghv2-site-shell.pghv2-standard-shell {
  background: transparent !important;
}

/* ==========================================================================
   Trade Overlay (#pgTradeOverlay) — full theme rework (v1.7.65)
   The trade modal that opens when customer clicks Start Trade. Plugin ships
   it with white/light grey styling. We override with the dark navy + brand
   colour system. High specificity + !important to beat plugin inline styles.
   ========================================================================== */

/* Backdrop dim + explicit viewport dimensions.
   Explicit height/width defend against any ancestor applying CSS containment
   (content-visibility, contain:*) which would otherwise make this fixed-position
   overlay size relative to the ancestor instead of the viewport. */
#pgTradeOverlay.pgtrade-overlay {
  background: rgba(3, 11, 23, 0.85) !important;
  backdrop-filter: blur(6px) !important;
  -webkit-backdrop-filter: blur(6px) !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  max-width: 100vw !important;
  max-height: 100vh !important;
}

/* Modal card */
#pgTradeOverlay .pgtrade-card {
  background: var(--pghv2-bg-alt, #071325) !important;
  border: 1px solid rgba(115, 189, 255, 0.18) !important;
  border-radius: 18px !important;
  color: #f7fbff !important;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6), 0 0 0 1px rgba(116, 212, 255, 0.05) !important;
}

/* Close button */
#pgTradeOverlay .pgtrade-close {
  background: rgba(7, 19, 37, 0.8) !important;
  border: 1px solid rgba(115, 189, 255, 0.2) !important;
  color: #b8c9e0 !important;
  border-radius: 10px !important;
  width: 36px !important;
  height: 36px !important;
  font-size: 18px !important;
  transition: all 0.15s ease !important;
  /* FIX(close-btn-tap): on mobile (and at narrow widths) the .pgtrade-eyebrow element
     spans the full width of the card header and sits on top of the absolutely-positioned
     close button in the stacking order, making the X untappable. Elevate the close
     button and disable pointer events on the eyebrow text so the X is reachable. */
  z-index: 10 !important;
  pointer-events: auto !important;
}

#pgTradeOverlay .pgtrade-eyebrow {
  pointer-events: none !important;
}

#pgTradeOverlay .pgtrade-close:hover {
  background: rgba(35, 140, 255, 0.2) !important;
  color: #74d4ff !important;
  border-color: #74d4ff !important;
}

/* Header */
#pgTradeOverlay .pgtrade-header {
  background: transparent !important;
  border-bottom: 1px solid rgba(115, 189, 255, 0.12) !important;
  padding: 22px 24px !important;
}

#pgTradeOverlay .pgtrade-eyebrow {
  color: #74d4ff !important;
  font-weight: 700 !important;
  font-size: 11px !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  opacity: 1 !important;
}

#pgTradeOverlay .pgtrade-title {
  color: #f7fbff !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  margin: 6px 0 !important;
  letter-spacing: -0.01em !important;
}

#pgTradeOverlay .pgtrade-sub {
  color: #b8c9e0 !important;
  font-size: 13px !important;
  opacity: 1 !important;
}

/* Bot status pills (Online / Busy / Offline) */
#pgTradeOverlay .pgtrade-botstatus {
  margin-top: 12px !important;
  display: flex !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  align-items: center !important;
}

#pgTradeOverlay .pgtrade-botstatus-label {
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  color: #b8c9e0 !important;
  text-transform: uppercase !important;
  margin-right: 4px !important;
}

#pgTradeOverlay .pgtrade-botpill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  padding: 5px 10px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(115, 189, 255, 0.18) !important;
  background: rgba(7, 19, 37, 0.7) !important;
  color: #b8c9e0 !important;
}

#pgTradeOverlay .pgtrade-botpill--online {
  border-color: rgba(0, 182, 122, 0.35) !important;
  background: rgba(0, 182, 122, 0.12) !important;
  color: #00b67a !important;
}

#pgTradeOverlay .pgtrade-botpill--busy {
  border-color: rgba(245, 158, 11, 0.35) !important;
  background: rgba(245, 158, 11, 0.1) !important;
  color: #fbbf24 !important;
}

#pgTradeOverlay .pgtrade-botpill--offline {
  border-color: rgba(239, 68, 68, 0.35) !important;
  background: rgba(239, 68, 68, 0.1) !important;
  color: #f87171 !important;
}

#pgTradeOverlay .pgtrade-light {
  width: 8px !important;
  height: 8px !important;
  border-radius: 999px !important;
  display: inline-block !important;
}

#pgTradeOverlay .pgtrade-light--green { background: #00b67a !important; box-shadow: 0 0 6px rgba(0, 182, 122, 0.6) !important; }
#pgTradeOverlay .pgtrade-light--amber { background: #fbbf24 !important; box-shadow: 0 0 6px rgba(251, 191, 36, 0.6) !important; }
#pgTradeOverlay .pgtrade-light--red { background: #f87171 !important; box-shadow: 0 0 6px rgba(239, 68, 68, 0.6) !important; }

/* Trade code box */
#pgTradeOverlay .pgtrade-code-wrap {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-end !important;
  gap: 8px !important;
}

#pgTradeOverlay .pgtrade-code-label {
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: #74d4ff !important;
  opacity: 1 !important;
}

#pgTradeOverlay .pgtrade-code {
  font-family: 'SF Mono', Menlo, Consolas, monospace !important;
  font-weight: 700 !important;
  font-size: 22px !important;
  letter-spacing: 0.1em !important;
  color: #f7fbff !important;
  background: linear-gradient(135deg, rgba(35, 140, 255, 0.25), rgba(116, 212, 255, 0.15)) !important;
  border: 1px solid rgba(116, 212, 255, 0.4) !important;
  border-radius: 10px !important;
  padding: 10px 16px !important;
  box-shadow: 0 0 20px rgba(35, 140, 255, 0.2) !important;
}

/* Progress bar */
#pgTradeOverlay .pgtrade-progress {
  padding: 16px 24px !important;
  background: rgba(3, 11, 23, 0.4) !important;
  border-bottom: 1px solid rgba(115, 189, 255, 0.12) !important;
}

#pgTradeOverlay .pgtrade-progressbar {
  background: rgba(7, 19, 37, 0.8) !important;
  border: 1px solid rgba(115, 189, 255, 0.15) !important;
  border-radius: 999px !important;
  height: 6px !important;
  overflow: hidden !important;
}

#pgTradeOverlay .pgtrade-progressfill {
  background: linear-gradient(90deg, #238cff 0%, #74d4ff 100%) !important;
  height: 100% !important;
  border-radius: 999px !important;
  box-shadow: 0 0 12px rgba(35, 140, 255, 0.5) !important;
  transition: width 0.3s ease !important;
}

/* Step pills (Prepare / Queue / Connect / Trading / Done) */
#pgTradeOverlay .pgtrade-steps {
  display: flex !important;
  gap: 8px !important;
  margin-top: 12px !important;
  flex-wrap: wrap !important;
}

#pgTradeOverlay .pgtrade-step {
  font-size: 12px !important;
  font-weight: 600 !important;
  padding: 6px 14px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(115, 189, 255, 0.18) !important;
  background: rgba(7, 19, 37, 0.6) !important;
  color: #b8c9e0 !important;
  transition: all 0.2s ease !important;
}

#pgTradeOverlay .pgtrade-step.is-active {
  background: linear-gradient(135deg, #238cff 0%, #74d4ff 100%) !important;
  border-color: transparent !important;
  color: #ffffff !important;
  box-shadow: 0 0 16px rgba(35, 140, 255, 0.4) !important;
}

#pgTradeOverlay .pgtrade-step.is-done {
  background: rgba(0, 182, 122, 0.15) !important;
  border-color: rgba(0, 182, 122, 0.4) !important;
  color: #00b67a !important;
}

/* Body / scroll area */
#pgTradeOverlay .pgtrade-scroll {
  background: transparent !important;
}

#pgTradeOverlay .pgtrade-body {
  background: transparent !important;
  padding: 22px 24px !important;
}

/* Panel sections */
#pgTradeOverlay .pgtrade-panel,
#pgTradeOverlay .pgtrade-side {
  background: transparent !important;
}

#pgTradeOverlay .pgtrade-section {
  background: rgba(3, 11, 23, 0.5) !important;
  border: 1px solid rgba(115, 189, 255, 0.12) !important;
  border-radius: 14px !important;
  padding: 18px !important;
  margin-bottom: 14px !important;
  color: #f7fbff !important;
}

#pgTradeOverlay .pgtrade-h {
  color: #74d4ff !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  margin: 0 0 12px 0 !important;
  padding-bottom: 10px !important;
  border-bottom: 1px solid rgba(115, 189, 255, 0.1) !important;
}

/* "What to do" instructions */
#pgTradeOverlay .pgtrade-ol {
  color: #f7fbff !important;
  padding-left: 20px !important;
  margin: 0 !important;
  line-height: 1.7 !important;
}

#pgTradeOverlay .pgtrade-ol li {
  color: #f7fbff !important;
  margin-bottom: 6px !important;
  font-size: 14px !important;
}

#pgTradeOverlay .pgtrade-ol li strong {
  color: #74d4ff !important;
  font-weight: 700 !important;
}

/* Live status block */
#pgTradeOverlay .pgtrade-live {
  background: transparent !important;
}

#pgTradeOverlay .pgtrade-live-title {
  color: #74d4ff !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  margin-bottom: 8px !important;
}

#pgTradeOverlay .pgtrade-live-text {
  color: #f7fbff !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
}

#pgTradeOverlay .pgtrade-live-meta {
  color: #b8c9e0 !important;
  font-size: 12px !important;
  margin-top: 6px !important;
}

#pgTradeOverlay .pgtrade-details summary {
  color: #74d4ff !important;
  cursor: pointer !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  padding: 8px 0 !important;
  margin-top: 10px !important;
  border-top: 1px solid rgba(115, 189, 255, 0.1) !important;
}

#pgTradeOverlay .pgtrade-details-body {
  color: #b8c9e0 !important;
  font-size: 12px !important;
  background: rgba(7, 19, 37, 0.6) !important;
  border-radius: 8px !important;
  padding: 10px 12px !important;
  margin-top: 8px !important;
  font-family: 'SF Mono', Menlo, Consolas, monospace !important;
}

/* Action buttons */
#pgTradeOverlay .pgtrade-actions {
  display: flex !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  margin-top: 4px !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  /* FIX(actions-overlap): the plugin's CSS makes .pgtrade-actions position:sticky;
     bottom:0 with a light gradient background. On mobile this pins START TRADE /
     Cancel trade over the instructions list and warning box, making them unreadable.
     Force the actions container into the normal flow so users can scroll past it. */
  position: static !important;
  bottom: auto !important;
  padding-top: 0 !important;
}

#pgTradeOverlay .pgtrade-primary,
#pgTradeOverlay .pgtrade-start-mobile {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 14px 28px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  border-radius: 12px !important;
  border: 1px solid transparent !important;
  background: linear-gradient(135deg, #238cff 0%, #74d4ff 100%) !important;
  color: #ffffff !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
  box-shadow: 0 4px 18px rgba(35, 140, 255, 0.4) !important;
  min-height: 48px !important;
}

#pgTradeOverlay .pgtrade-primary:hover:not(:disabled) {
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 24px rgba(35, 140, 255, 0.55) !important;
}

#pgTradeOverlay .pgtrade-secondary {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 14px 24px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  border-radius: 12px !important;
  border: 1px solid rgba(115, 189, 255, 0.3) !important;
  background: rgba(7, 19, 37, 0.85) !important;
  color: #b8c9e0 !important;
  text-transform: none !important;
  cursor: pointer !important;
  transition: all 0.15s ease !important;
  min-height: 48px !important;
}

#pgTradeOverlay .pgtrade-secondary:hover:not(:disabled) {
  border-color: #74d4ff !important;
  color: #74d4ff !important;
  background: rgba(35, 140, 255, 0.1) !important;
}

#pgTradeOverlay button:disabled,
#pgTradeOverlay button[disabled] {
  opacity: 0.5 !important;
  cursor: not-allowed !important;
  transform: none !important;
}

#pgTradeOverlay .pgtrade-start-blocked {
  color: #fbbf24 !important;
  font-size: 12px !important;
  margin-top: 8px !important;
}

/* Side panel: Your Pokémon list */
#pgTradeOverlay .pgtrade-queue-meta {
  color: #b8c9e0 !important;
  font-size: 12px !important;
  margin-bottom: 10px !important;
}

#pgTradeOverlay .pgtrade-queue-next {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  margin-bottom: 14px !important;
}

#pgTradeOverlay .pgtrade-queue-line {
  background: rgba(7, 19, 37, 0.7) !important;
  border: 1px solid rgba(115, 189, 255, 0.15) !important;
  border-radius: 10px !important;
  padding: 10px 12px !important;
  color: #f7fbff !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}

#pgTradeOverlay .pgtrade-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

#pgTradeOverlay .pgtrade-list li {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 10px 12px !important;
  background: rgba(7, 19, 37, 0.7) !important;
  border: 1px solid rgba(115, 189, 255, 0.12) !important;
  border-radius: 10px !important;
  color: #f7fbff !important;
  font-size: 13px !important;
}

#pgTradeOverlay .pgtrade-list li img {
  width: 36px !important;
  height: 36px !important;
  object-fit: contain !important;
  border-radius: 8px !important;
  background: rgba(3, 11, 23, 0.85) !important;
  padding: 3px !important;
  border: 1px solid rgba(115, 189, 255, 0.1) !important;
  flex: 0 0 auto !important;
}

/* Status text inside list items (Waiting / Trading / Done) */
#pgTradeOverlay .pgtrade-list li .status,
#pgTradeOverlay .pgtrade-list li [class*="state"] {
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  color: #b8c9e0 !important;
  padding: 4px 10px !important;
  background: rgba(3, 11, 23, 0.6) !important;
  border-radius: 999px !important;
  border: 1px solid rgba(115, 189, 255, 0.15) !important;
}

/* Banner (warning / info / error) */
#pgTradeOverlay .pgtrade-banner {
  margin: 16px 24px !important;
  padding: 14px 16px !important;
  border-radius: 12px !important;
  display: flex !important;
  gap: 12px !important;
  align-items: flex-start !important;
}

#pgTradeOverlay .pgtrade-banner--warning {
  background: rgba(245, 158, 11, 0.1) !important;
  border: 1px solid rgba(245, 158, 11, 0.3) !important;
  color: #fbbf24 !important;
}

#pgTradeOverlay .pgtrade-banner-icon {
  font-size: 20px !important;
  line-height: 1 !important;
}

#pgTradeOverlay .pgtrade-banner-headline {
  font-weight: 700 !important;
  font-size: 14px !important;
  margin-bottom: 4px !important;
  color: inherit !important;
}

#pgTradeOverlay .pgtrade-banner-body {
  font-size: 13px !important;
  line-height: 1.5 !important;
  color: inherit !important;
  opacity: 0.9 !important;
}

/* Fix-offer block (when bot offers an auto-correct) */
#pgTradeOverlay .pgtrade-fix {
  margin-top: 14px !important;
  padding: 16px !important;
  background: rgba(245, 158, 11, 0.08) !important;
  border: 1px solid rgba(245, 158, 11, 0.3) !important;
  border-radius: 12px !important;
}

#pgTradeOverlay .pgtrade-fix-body {
  color: #f7fbff !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
  margin-bottom: 12px !important;
}

#pgTradeOverlay .pgtrade-fix-actions {
  display: flex !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}

#pgTradeOverlay .pgtrade-fix-error {
  color: #f87171 !important;
  font-size: 12px !important;
  margin-top: 8px !important;
}

/* Errors panel */
#pgTradeOverlay .pgtrade-errors {
  background: rgba(239, 68, 68, 0.08) !important;
  border-color: rgba(239, 68, 68, 0.25) !important;
}

#pgTradeOverlay .pgtrade-errors .pgtrade-h {
  color: #f87171 !important;
}

#pgTradeOverlay .pgtrade-errors-list {
  color: #f7fbff !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}

/* Mobile */
@media (max-width: 720px) {
  #pgTradeOverlay .pgtrade-card {
    border-radius: 14px !important;
    margin: 12px !important;
  }
  #pgTradeOverlay .pgtrade-header {
    padding: 18px !important;
  }
  #pgTradeOverlay .pgtrade-body {
    padding: 18px !important;
  }
  #pgTradeOverlay .pgtrade-title {
    font-size: 18px !important;
  }
  #pgTradeOverlay .pgtrade-code {
    font-size: 18px !important;
  }
  #pgTradeOverlay .pgtrade-actions {
    flex-direction: column !important;
  }
  #pgTradeOverlay .pgtrade-primary,
  #pgTradeOverlay .pgtrade-secondary {
    width: 100% !important;
  }

  /* FIX(mobile-scroll): on mobile the modal has 4 fixed-height sections (header,
     progress, banner) ahead of .pgtrade-scroll. Combined they consume nearly the
     entire viewport, leaving the inner scroll area too small to use. Make the whole
     card scroll as one unit instead. The overlay handles overflow, the card grows
     naturally to fit its content, and the user can scroll the entire modal top-to-bottom. */
  #pgTradeOverlay.pgtrade-overlay {
    align-items: flex-start !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    padding: 8px !important;
  }
  #pgTradeOverlay .pgtrade-card {
    max-height: none !important;
    height: auto !important;
    overflow: visible !important;
    display: block !important;
    margin: 8px auto !important;
    width: 100% !important;
  }
  #pgTradeOverlay .pgtrade-scroll {
    flex: none !important;
    overflow: visible !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    -webkit-overflow-scrolling: auto !important;
  }
  /* Keep the close button reachable while content scrolls under it. */
  #pgTradeOverlay .pgtrade-close {
    position: fixed !important;
    top: 16px !important;
    right: 16px !important;
    z-index: 100 !important;
  }
}