/* JVGBD Games - frontend styles */
/* Theme-aware variables */
:root{
  --jvgbd-surface:#fff;
  --jvgbd-surface-alt:#f7f9fb;
  --jvgbd-border:#e5e5e5;
  --jvgbd-text:#111;
  --jvgbd-muted:#777;
}
@media (prefers-color-scheme: dark){
  :root{
    --jvgbd-surface:#121417;
    --jvgbd-surface-alt:#171a1f;
    --jvgbd-border:#2a2f36;
    --jvgbd-text:#e6e6e6;
    --jvgbd-muted:#a0a7b3;
  }
}
/* Sync with theme dark-mode: override OS preference and follow theme classes */
body{
  --jvgbd-surface:#fff;
  --jvgbd-surface-alt:#f7f9fb;
  --jvgbd-border:#e5e5e5;
  --jvgbd-text:#111;
  --jvgbd-muted:#777;
}
body.is-dark-theme,
body.dark-mode,
body.dark,
body[data-theme="dark"]{
  --jvgbd-surface:#121417;
  --jvgbd-surface-alt:#171a1f;
  --jvgbd-border:#2a2f36;
  --jvgbd-text:#e6e6e6;
  --jvgbd-muted:#a0a7b3;
}
.jvgbd-single-game{--jvgbd-maxw:1100px;width:min(100%, var(--jvgbd-maxw));margin-left:auto;margin-right:auto;padding:0 16px;box-sizing:border-box;color:var(--jvgbd-text)}
.jvgbd-game-card{display:grid;grid-template-columns:90px 1fr;gap:1rem;align-items:start;margin:1.5rem 0;padding:1rem;border:1px solid var(--jvgbd-border);border-radius:8px;background:var(--jvgbd-surface);color:var(--jvgbd-text);position:relative;overflow:visible}
.jvgbd-game-card.has-bg .jvgbd-card-bg{position:absolute;inset:0;background:var(--jvgbd-card-bg, none) center/cover no-repeat;filter:brightness(.35);z-index:0}
.jvgbd-game-card.has-bg .jvgbd-card-bg{border-radius:inherit}
.jvgbd-game-card.has-bg > *:not(.jvgbd-card-bg):not(.jvgbd-card-platforms){position:relative;z-index:1}
.jvgbd-card-platforms{z-index:2}
.jvgbd-game-card .jvgbd-game-thumb img{display:block;width:90px;height:90px;object-fit:cover;border-radius:6px}
.jvgbd-game-card .jvgbd-game-thumb{display:flex;flex-direction:column;align-items:center}
.jvgbd-game-card .jvgbd-card-user-rating{display:inline-flex;flex-direction:column;align-items:center;gap:.1rem;margin-top:.35rem;font-weight:700;padding:.25rem .5rem;border-radius:10px;background:var(--jvgbd-surface-alt);color:var(--jvgbd-text);border:1px solid var(--jvgbd-border);line-height:1;align-self:center;text-align:center}
.jvgbd-user-rating-label{font-size:.72rem;font-weight:700;letter-spacing:.05em;opacity:.85}
.jvgbd-user-rating-row{display:inline-flex;align-items:center;gap:.25rem}
.jvgbd-game-card .jvgbd-card-user-rating .fas,
.jvgbd-game-card .jvgbd-card-user-rating .fa-solid{color:#ffd76a}
.jvgbd-game-card .jvgbd-thumb-badge{display:none}
.jvgbd-game-card .jvgbd-pegi-logo{display:none}
.jvgbd-game-card .jvgbd-game-title{margin:.2rem 0 .5rem;font-size:1.1rem;display:grid;grid-template-columns:minmax(0, calc(100% - 1.05em)) 1.05em;align-items:baseline;column-gap:0}

/* Series games grid */
.jvgbd-series-games-grid{margin:1.25rem 0;padding:0}
.jvgbd-series-games-grid .jvgbd-series-title{font-size:1.05rem;margin:.25rem 0 .75rem}
.jvgbd-series-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem}
.jvgbd-series-grid-item .jvgbd-game-card{padding:.6rem}
.jvgbd-series-grid-item .jvgbd-game-thumb img{width:64px;height:64px}
.jvgbd-series-grid-item .jvgbd-game-title{font-size:1rem}
.jvgbd-series-grid-item .jvgbd-game-details{font-size:.85rem}
/* Compact family grid -> reuse series styles but tighter */
.jvgbd-family-games-grid{margin:1rem 0;padding:0}
.jvgbd-family-header{display:flex;align-items:center;gap:.75rem;margin:0 0 .6rem;padding:.6rem;border-radius:10px;background:linear-gradient(90deg, rgba(13,110,253,0.06), rgba(90,177,255,0.03));border:1px solid var(--jvgbd-border)}
.jvgbd-family-icon{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:8px;background:linear-gradient(180deg,#0d6efd,#5ab1ff);color:#fff;font-size:18px}
.jvgbd-family-title{font-size:1rem;margin:0;font-weight:700;color:var(--jvgbd-text);display:flex;align-items:center;gap:.5rem}
.jvgbd-family-count{font-size:.9rem;color:var(--jvgbd-muted);font-weight:600}
.jvgbd-family-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.8rem;grid-auto-rows:240px}
.jvgbd-family-grid .jvgbd-family-grid-item{padding:0;box-sizing:border-box}
.jvgbd-family-grid .jvgbd-family-grid-item .jvgbd-game-card{display:flex;flex-direction:column;justify-content:space-between;padding:0;margin:0;border-radius:8px;background:transparent;border:0;color:#fff;position:relative;overflow:visible;height:100%}
.jvgbd-family-grid .jvgbd-family-grid-item{aspect-ratio:1/1}
.jvgbd-family-grid .jvgbd-game-thumb{width:100%;height:100%;border-radius:8px;overflow:visible;display:block}
.jvgbd-family-grid .jvgbd-game-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .28s ease}
.jvgbd-family-card{display:block;width:100%;height:100%;position:relative;overflow:visible;border-radius:8px;background:transparent}
.jvgbd-family-card .jvgbd-game-thumb{display:block;width:100%;height:100%;position:relative}
.jvgbd-family-card .jvgbd-game-thumb img{display:block;width:100%;height:100%;object-fit:cover}
.jvgbd-family-card .jvgbd-game-meta{position:absolute;left:8px;right:8px;top:8px;bottom:8px;z-index:3;pointer-events:none;display:flex;align-items:center;justify-content:center}
.jvgbd-family-card .jvgbd-game-title{color:#fff;margin:0;padding:.25rem .4rem;background:transparent;pointer-events:auto;text-align:center;width:100%;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;line-height:1.1}
.jvgbd-family-card .jvgbd-game-title a{display:inline-block;width:100%;text-align:center;color:inherit}
/* Center all textual content inside family cards for a unified look */
.jvgbd-family-grid .jvgbd-family-grid-item,
.jvgbd-family-card{
  text-align:center;
}
.jvgbd-family-card .jvgbd-game-meta,
.jvgbd-family-card .jvgbd-game-meta *{
  text-align:center;
}
/* Ensure small badges (rating) are horizontally centered */
.jvgbd-family-card .jvgbd-card-user-rating{margin-left:auto;margin-right:auto;max-height:36px;overflow:hidden}


.jvgbd-family-grid .jvgbd-game-meta{position:absolute;left:8px;right:8px;top:8px;bottom:8px;padding:0;background:transparent;z-index:3;pointer-events:none;display:flex;align-items:center;justify-content:center}
.jvgbd-family-grid .jvgbd-game-title{
  font-size:1.02rem;
  font-weight:700;
  color:#fff;
  margin:0;
  padding:0; /* remove inner padding so title spans full width */
  display:block;
  background:transparent;
  pointer-events:auto;
  text-align:center;
  width:100%;
  /* improve contrast on busy covers */
  text-shadow: 0 1px 2px rgba(0,0,0,0.7);
}
/* Ensure the title link fills available width and is centered */
.jvgbd-family-grid .jvgbd-game-title a{display:block;text-align:center;color:inherit;width:100%;padding:0}
.jvgbd-family-grid .jvgbd-game-details{display:none}
/* Clamp the title to 2 lines and ensure it doesn't expand the card */
.jvgbd-family-grid .jvgbd-game-title,
.jvgbd-family-grid .jvgbd-game-title a{display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-clamp:2; overflow:hidden; text-overflow:ellipsis}
/* Prevent meta/content from increasing card height */
.jvgbd-family-grid .jvgbd-game-meta *{max-height:48px;overflow:hidden}
/* Hide website icon specifically inside family cards */
.jvgbd-family-grid .jvgbd-title-website{display:none}
/* Ensure card content aligns bottom for consistent layout */
.jvgbd-family-grid .jvgbd-game-card > .jvgbd-game-thumb{flex:0 0 auto}
.jvgbd-family-grid .jvgbd-game-card > .jvgbd-game-meta{flex:1 1 auto;display:flex;flex-direction:column;justify-content:space-between}
.jvgbd-family-grid .jvgbd-game-meta .jvgbd-game-title{margin-top:0}

/* Overlay gradient on the bottom of the thumbnail and position the title over it */
.jvgbd-family-grid .jvgbd-game-thumb{position:relative}
.jvgbd-family-grid .jvgbd-game-thumb::after{content:'';position:absolute;left:0;right:0;bottom:0;height:48px;border-bottom-left-radius:8px;border-bottom-right-radius:8px;background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.65) 100%);pointer-events:none}
/* overlay backdrop to ensure consistent contrast for titles */
.jvgbd-family-grid .jvgbd-game-thumb .jvgbd-overlay-backdrop{position:absolute;left:0;right:0;bottom:0;height:48px;border-bottom-left-radius:8px;border-bottom-right-radius:8px;background:rgba(0,0,0,0.35);pointer-events:none;z-index:2}
/* Position the title inside the thumbnail overlay */
.jvgbd-family-grid .jvgbd-game-meta{margin:0;padding:0}
.jvgbd-family-grid .jvgbd-game-title{position:relative;z-index:3;display:block;padding:0;background:transparent;line-height:1.1;display:-webkit-box;overflow:hidden;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical}
/* center title vertically inside the overlay */
.jvgbd-family-grid .jvgbd-game-meta{display:flex;align-items:flex-end;justify-content:center}
.jvgbd-family-grid .jvgbd-game-meta .jvgbd-game-title{align-self:flex-end;padding:.2rem .45rem}
.jvgbd-family-grid .jvgbd-game-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .18s ease, filter .18s ease}
.jvgbd-family-grid .jvgbd-game-thumb:hover img{filter:brightness(.98);transform:scale(1.02)}

@media (max-width:1200px){
  .jvgbd-family-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.7rem}
}
@media (max-width:900px){
  .jvgbd-family-grid{grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:.6rem}
}
@media (max-width:700px){
  /* Mobile: stacked cards - image full-width, title below */
  .jvgbd-family-grid{grid-template-columns:1fr;gap:1rem}
  .jvgbd-family-grid .jvgbd-family-grid-item{padding:.5rem;box-sizing:border-box;aspect-ratio:auto;height:auto}
  .jvgbd-family-grid .jvgbd-family-grid-item .jvgbd-game-card{display:block;padding:0;border-radius:8px;background:transparent;color:var(--jvgbd-text)}
  .jvgbd-family-grid .jvgbd-game-thumb{width:100%;height:auto;border-radius:8px;overflow:hidden;display:block}
  .jvgbd-family-grid .jvgbd-game-thumb img{width:100%;height:auto;object-fit:cover;display:block}
  /* hide overlay/backdrop on mobile and let title sit below the image */
  .jvgbd-family-grid .jvgbd-game-thumb::after,
  .jvgbd-family-grid .jvgbd-game-thumb .jvgbd-overlay-backdrop{display:none}
  .jvgbd-family-card .jvgbd-game-meta{position:static;padding:.5rem 0 0;display:block;pointer-events:auto;text-align:center}
  .jvgbd-family-card .jvgbd-game-title{display:block;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;white-space:normal;text-overflow:ellipsis;font-size:1rem;color:var(--jvgbd-text);font-weight:700;margin:0;padding:0 .25rem}
  .jvgbd-family-card .jvgbd-game-title a{color:inherit}
}
@media (max-width:480px){
  .jvgbd-family-grid{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.45rem}
  .jvgbd-family-grid .jvgbd-game-title,
  .jvgbd-family-grid .jvgbd-game-title a{font-size:.9rem}
}

/* Enable hover effects only on devices that support hover (avoid touch devices) */
@media (hover: hover) and (pointer: fine){
  /* keep hover lift but remove shadow inside family grid */
  .jvgbd-family-grid .jvgbd-game-card:hover{transform:translateY(-6px);box-shadow:none}
  .jvgbd-family-grid .jvgbd-game-card:hover .jvgbd-game-thumb img{transform:scale(1.05);transition:transform .28s ease}
}
/* Ensure images still have transition but no forced transform on touch devices */
.jvgbd-family-grid .jvgbd-game-thumb img{transition:transform .28s ease}

/* Hover: subtle lift and image zoom */
.jvgbd-family-grid .jvgbd-game-card:hover{transform:translateY(-6px);box-shadow:none}
.jvgbd-family-grid .jvgbd-game-card:hover .jvgbd-game-thumb img{transform:scale(1.05);transition:transform .28s ease}
.jvgbd-family-grid .jvgbd-game-thumb img{transition:transform .28s ease}
.jvgbd-family-grid .jvgbd-card-user-rating{position:relative;margin-top:.5rem}
.jvgbd-family-grid .jvgbd-card-platforms{display:none}
@media (max-width:700px){
  /* Tighter mobile breakpoint adjustments */
  .jvgbd-family-grid{grid-template-columns:1fr;gap:.8rem}
  .jvgbd-family-grid .jvgbd-family-grid-item{padding:.4rem;aspect-ratio:auto;height:auto}
  .jvgbd-family-grid .jvgbd-game-card{border-radius:8px;background:transparent;box-shadow:none}
}
.jvgbd-game-card .jvgbd-game-details{list-style:none;margin:0;padding:0;color:var(--jvgbd-text)}
.jvgbd-game-card .jvgbd-game-details li{word-break:break-word;overflow-wrap:anywhere;hyphens:auto;min-width:0}
.jvgbd-game-card .jvgbd-game-details li{margin:.2rem 0}
.jvgbd-game-card .jvgbd-game-meta{min-width:0}
.jvgbd-game-card .jvgbd-game-title,.jvgbd-game-card .jvgbd-game-title a{word-break:break-word;overflow-wrap:anywhere}
.jvgbd-game-card .jvgbd-game-details{word-break:break-word;overflow-wrap:anywhere}
.jvgbd-card-platforms{position:absolute;right:8px;bottom:8px;display:flex;gap:.35rem;flex-wrap:wrap;align-items:flex-start;max-width:calc(100% - 16px)}
@media (max-width:1024px){
  .jvgbd-game-card{padding-right:64px}
}
.jvgbd-card-platforms .jvgbd-platform-badge{display:inline-flex;align-items:center;gap:.3rem;min-width:0;max-width:100%}
.jvgbd-card-platforms .jvgbd-platform-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.jvgbd-card-platforms .jvgbd-platform-badge i[class*='bi']::before{font-family:'Bootstrap Icons'!important}
.jvgbd-after-post .jvgbd-card-platforms{right:8px;justify-content:flex-end}
/* Strong mobile overrides for the family grid to avoid theme/Elementor conflicts
   Ensures stacked images (full-width) with title below, proper gap and no overlap */
@media (max-width:700px){
  /* Use high-specificity selectors instead of !important where possible */
  html body .jvgbd-family-games-grid .jvgbd-family-grid,
  html body .jvgbd-family-grid{
    grid-template-columns:1fr;
    gap:1rem;
  }
  html body .jvgbd-family-grid .jvgbd-family-grid-item,
  html body .jvgbd-family-games-grid .jvgbd-family-grid-item{
    display:block;
    width:100%;
    padding:.5rem;
    box-sizing:border-box;
    aspect-ratio:auto;
    height:auto;
  }
  html body .jvgbd-family-grid .jvgbd-game-card,
  html body .jvgbd-family-grid .jvgbd-game-thumb{display:block;background:transparent}
  html body .jvgbd-family-grid .jvgbd-game-thumb img{width:100%;height:auto;display:block;object-fit:cover}
  html body .jvgbd-family-grid .jvgbd-game-thumb::after,
  html body .jvgbd-family-grid .jvgbd-game-thumb .jvgbd-overlay-backdrop{display:none}
  html body .jvgbd-family-grid .jvgbd-game-meta{position:static;padding:.5rem 0 0;display:block;text-align:center}
  html body .jvgbd-family-grid .jvgbd-game-title{font-size:1rem;line-height:1.2;-webkit-line-clamp:2;line-clamp:2;white-space:normal;text-align:center}
}
/* Archive grid layout */
.jvgbd-archive .jvgbd-archive-grid{display:grid;grid-template-columns:repeat(var(--jvgbd-cols,3), minmax(0,1fr));gap:.5rem 1rem}
@media (max-width:900px){
  /* Extra compact spacing for very small screens and visible separation */
  .jvgbd-family-grid{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.4rem}
  .jvgbd-family-grid .jvgbd-family-grid-item{padding:.2rem}
  .jvgbd-family-grid .jvgbd-game-card{border-radius:8px;background:var(--jvgbd-surface-alt);box-shadow:0 2px 6px rgba(0,0,0,0.06)}
  .jvgbd-family-grid .jvgbd-game-title,
  .jvgbd-family-grid .jvgbd-game-title a{font-size:.88rem;padding:0;width:100%}
}
.jvgbd-after-post .jvgbd-game-card .jvgbd-game-title,
.jvgbd-after-post .jvgbd-game-card .jvgbd-game-title a{color:#fff}
.jvgbd-after-post .jvgbd-game-card .jvgbd-game-details{color:#fff}
.jvgbd-after-post .jvgbd-game-card .jvgbd-game-details .jvgbd-rating{display:none}
.jvgbd-after-post .jvgbd-card-user-rating{background:var(--jvgbd-surface-alt);color:#fff;border-color:var(--jvgbd-border)}
.jvgbd-game-card .jvgbd-game-details .jvgbd-platforms{display:none !important}
.jvgbd-game-card .jvgbd-game-title .jvgbd-title-website{display:inline-flex;align-items:center;gap:0;margin-left:0;color:#0d6efd;line-height:1;grid-column:2;justify-self:start}
.jvgbd-game-card .jvgbd-game-title .jvgbd-title-website i{width:1.1em;display:inline-block}
.jvgbd-game-card .jvgbd-game-title .jvgbd-title-website .fas,
.jvgbd-game-card .jvgbd-game-title .jvgbd-title-website .fa-solid{color:#0d6efd}

/* Search (centered form + preview) */
.jvgbd-games-search .jvgbd-filters{display:flex;align-items:center;justify-content:center;gap:.5rem;flex-wrap:wrap;margin-bottom:.5rem}
.jvgbd-games-search .jvgbd-filters input[type=search]{padding:.45rem .6rem;border:1px solid var(--jvgbd-border);border-radius:8px;min-width:240px}

/* Ensure search input is always readable on light backgrounds and inside Elementor widgets */
.jvgbd-games-search .jvgbd-filters input[type=search]{
  background: var(--jvgbd-surface);
  color: var(--jvgbd-text);
  border-color: var(--jvgbd-border);
}
.elementor .jvgbd-games-search .jvgbd-filters input[type=search]{
  background: var(--jvgbd-surface);
  color: var(--jvgbd-text);
  border-color: var(--jvgbd-border);
}

/* Pagination contrast: ensure page links are visible on light backgrounds */
.jvgbd-latest-pagination{display:flex;gap:.35rem;align-items:center;flex-wrap:wrap}
.jvgbd-latest-pagination a.jvgbd-latest-page{
  display:inline-flex;padding:.35rem .55rem;border-radius:6px;border:1px solid transparent;background:transparent;color:var(--jvgbd-text);text-decoration:none
}
.jvgbd-latest-pagination a.jvgbd-latest-page.is-current{
  background:var(--jvgbd-surface-alt);border-color:var(--jvgbd-border);color:var(--jvgbd-text);font-weight:700
}
.elementor .jvgbd-latest-pagination a.jvgbd-latest-page{color:var(--jvgbd-text)}

/* Alphabet filter bar: ensure items are visible on light backgrounds and in Elementor */
.jvgbd-alpha{display:flex;gap:.35rem;flex-wrap:wrap;align-items:center;justify-content:center;margin:.6rem 0}
.jvgbd-alpha .jvgbd-alpha-item{display:inline-flex;padding:.28rem .45rem;border-radius:6px;border:1px solid transparent;background:transparent;color:var(--jvgbd-text);text-decoration:none}
.jvgbd-alpha .jvgbd-alpha-item.is-active{background:var(--jvgbd-surface-alt);border-color:var(--jvgbd-border);font-weight:700}
.elementor .jvgbd-alpha .jvgbd-alpha-item{color:var(--jvgbd-text)}

/* Force white titles on cards with background to ensure contrast */
.jvgbd-game-card.has-bg .jvgbd-game-title,
.jvgbd-family-card .jvgbd-game-title,
.jvgbd-game-card.has-bg .jvgbd-game-title a,
.jvgbd-family-card .jvgbd-game-title a{
  color: #fff !important;
}
.elementor .jvgbd-game-card.has-bg .jvgbd-game-title,
.elementor .jvgbd-family-card .jvgbd-game-title{
  color: #fff !important;
}
.elementor-editor-active .elementor .elementor-widget[class*="jvgbd"] .jvgbd-game-card.has-bg .jvgbd-game-title,
.elementor-editor-active .elementor .elementor-widget[class*="jvgbd"] .jvgbd-game-card.has-bg .jvgbd-game-title a,
html.elementor-editor-active .elementor .elementor-widget[class*="jvgbd"] .jvgbd-game-card.has-bg .jvgbd-game-title,
html.elementor-editor-active .elementor .elementor-widget[class*="jvgbd"] .jvgbd-game-card.has-bg .jvgbd-game-title a{
  color: #fff !important;
}

/* Pagination generated via paginate_links() uses .jvgbd-pagination -> ensure links inherit readable colors */
.jvgbd-pagination{display:flex;gap:.35rem;align-items:center;justify-content:center;margin:1rem 0}
.jvgbd-pagination a, .jvgbd-pagination span{display:inline-flex;padding:.35rem .55rem;border-radius:6px;color:var(--jvgbd-text);background:transparent;border:1px solid transparent;text-decoration:none}
.jvgbd-pagination .current{background:var(--jvgbd-surface-alt);border-color:var(--jvgbd-border);color:var(--jvgbd-text);font-weight:700}
.elementor .jvgbd-pagination a, .elementor .jvgbd-pagination span{color:var(--jvgbd-text)}

/* ==================================================
   JVGBD - Refreshed responsive design for Family Grid
   - Desktop: square tiles, 48px bottom overlay with centered white title
   - Mobile: stacked cards (image full-width, title below)
   - Robust selectors to reduce theme/page-builder conflicts
   ================================================== */
.jvgbd-family-games-grid{margin:1rem 0;padding:0}
.jvgbd-family-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:1rem;grid-auto-rows:240px}
.jvgbd-family-grid .jvgbd-family-grid-item{padding:0;box-sizing:border-box}
.jvgbd-family-card{display:block;width:100%;height:100%;position:relative;border-radius:8px;overflow:visible;background:transparent}
.jvgbd-family-card .jvgbd-game-thumb{display:block;width:100%;height:100%;position:relative;border-radius:8px;overflow:hidden}
.jvgbd-family-card .jvgbd-game-thumb img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .18s ease,filter .18s ease}
.jvgbd-overlay-backdrop{position:absolute;left:0;right:0;bottom:0;height:48px;border-bottom-left-radius:8px;border-bottom-right-radius:8px;background:linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.55) 100%);pointer-events:none;z-index:2}
.jvgbd-family-card .jvgbd-game-meta{position:absolute;left:8px;right:8px;bottom:8px;z-index:3;pointer-events:none;display:flex;align-items:flex-end;justify-content:center;height:48px}
.jvgbd-family-card .jvgbd-game-title{margin:0;padding:.2rem .45rem;color:#fff;font-weight:700;text-align:center;width:100%;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;text-overflow:ellipsis;pointer-events:auto;text-shadow:0 1px 2px rgba(0,0,0,0.65)}
.jvgbd-family-card .jvgbd-game-title a{color:inherit;display:block;width:100%;text-align:center}
.jvgbd-family-card:hover .jvgbd-game-thumb img{transform:scale(1.02);filter:brightness(.98)}

/* Utility to force white text where template logic requires it (avoids inline !important)
  We keep this as a class so server-side templates can mark elements and JS/CSS can
  still override only when necessary. A more specific editor scope keeps it readable
  inside Elementor without using !important broadly. */
.jvgbd-force-white{ color: #fff; }
.jvgbd-force-white a{ color: inherit; }
/* Editor-specific high-specificity rules for force-white to avoid broad !important usage */
html body.elementor-editor-active .jvgbd-el .jvgbd-force-white,
html body .elementor-editor-active .jvgbd-el .jvgbd-force-white{
  color: #fff;
}

/* Desktop finer control */
@media (min-width:901px){
  .jvgbd-family-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));grid-auto-rows:240px;gap:1rem}
}

/* Force title to bottom overlay on desktop */
@media (min-width:901px){
  .jvgbd-family-grid .jvgbd-family-grid-item{display:block}
  .jvgbd-family-card{display:block;position:relative}
  .jvgbd-family-card .jvgbd-game-thumb{height:100%;}
  .jvgbd-family-card .jvgbd-game-meta{position:absolute;left:8px;right:8px;bottom:8px;z-index:3;pointer-events:none;display:flex;align-items:flex-end;justify-content:center;height:48px}
  .jvgbd-family-card .jvgbd-game-title{margin:0;padding:.2rem .45rem;color:#fff;font-weight:700;text-align:center;width:100%;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;text-overflow:ellipsis}
}

/* High specificity override: ensure bottom title placement on single game pages and archives */
@media (min-width:901px){
  body.single-jvgbd_game .jvgbd-family-games-grid .jvgbd-family-grid .jvgbd-family-grid-item .jvgbd-family-card .jvgbd-game-meta,
  body .jvgbd-family-games-grid .jvgbd-family-grid .jvgbd-family-grid-item .jvgbd-family-card .jvgbd-game-meta{
    position:absolute !important;
    left:8px !important;
    right:8px !important;
    bottom:8px !important;
    height:48px !important;
    display:flex !important;
    align-items:flex-end !important;
    justify-content:center !important;
    pointer-events:none !important;
    z-index:3 !important;
  }
  body.single-jvgbd_game .jvgbd-family-games-grid .jvgbd-family-grid .jvgbd-family-grid-item .jvgbd-family-card .jvgbd-game-title,
  body .jvgbd-family-games-grid .jvgbd-family-grid .jvgbd-family-grid-item .jvgbd-family-card .jvgbd-game-title{
    color:#fff !important;
    text-align:center !important;
    display:-webkit-box !important;
    -webkit-line-clamp:2 !important;
    line-clamp:2 !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    margin:0 !important;
    padding:.2rem .45rem !important;
    font-weight:700 !important;
  }
}

/* Tablet adjustments */
@media (max-width:900px){
  .jvgbd-family-grid{grid-template-columns:repeat(auto-fit,minmax(160px,1fr));grid-auto-rows:220px;gap:.9rem}
}

/* Mobile: stack cards, image full width, title below */
@media (max-width:700px){
  .jvgbd-family-grid{grid-template-columns:1fr;gap:1rem;grid-auto-rows:auto}
  .jvgbd-family-grid .jvgbd-family-grid-item{padding:.45rem}
  .jvgbd-family-card{height:auto}
  .jvgbd-family-card .jvgbd-game-thumb{height:auto;border-radius:8px}
  .jvgbd-family-card .jvgbd-game-thumb img{height:auto;width:100%;object-fit:cover}
  /* remove overlay on mobile to keep title legible below image */
  .jvgbd-family-card .jvgbd-game-thumb::after,
  .jvgbd-family-card .jvgbd-game-thumb .jvgbd-overlay-backdrop{display:none}
  .jvgbd-family-card .jvgbd-game-meta{position:static;padding:.5rem 0 0;display:block;pointer-events:auto;text-align:center;height:auto}
  .jvgbd-family-card .jvgbd-game-title{color:var(--jvgbd-text);-webkit-line-clamp:2;line-clamp:2;white-space:normal;font-size:1rem;padding:0 .25rem}
}

/* Strong specificity fallback for small screens (in case theme/Elementor overrides) */
@media (max-width:700px){
  body .jvgbd-family-grid{grid-template-columns:1fr !important;gap:1rem !important}
  body .jvgbd-family-grid .jvgbd-family-grid-item{padding:.5rem !important;aspect-ratio:auto !important;height:auto !important}
  body .jvgbd-family-grid .jvgbd-game-thumb img{width:100% !important;height:auto !important}
}

/* Accessibility: ensure title link focus is visible */
.jvgbd-family-card .jvgbd-game-title a:focus{outline:2px solid rgba(13,110,253,0.9);outline-offset:2px}

/* End of refreshed family grid styles */

.jvgbd-games-search .jvgbd-filters select{padding:.45rem .6rem;border:1px solid var(--jvgbd-border);border-radius:8px}
.jvgbd-games-search .jvgbd-filters button{padding:.45rem .8rem;border-radius:6px}
.jvgbd-games-search .jvgbd-searchbar{position:relative}
.jvgbd-games-search .jvgbd-search-pop{position:absolute;left:0;right:0;top:calc(100% + 4px);background:var(--jvgbd-surface);border:1px solid var(--jvgbd-border);border-radius:8px;display:none;z-index:1000;box-shadow:0 6px 22px rgba(0,0,0,.12)}
.jvgbd-games-search .jvgbd-search-pop.is-open{display:block}
.jvgbd-search-results{list-style:none;margin:0;padding:.25rem}
.jvgbd-search-item .jvgbd-search-link{display:grid;grid-template-columns:40px 1fr;gap:.5rem;align-items:center;padding:.35rem;border-radius:6px;color:inherit;text-decoration:none}
.jvgbd-search-item .jvgbd-search-link:hover{background:var(--jvgbd-surface-alt)}
.jvgbd-search-thumb{width:40px;height:40px;object-fit:cover;border-radius:4px;display:block}
.jvgbd-search-no-thumb{width:40px;height:40px;border-radius:4px;background:var(--jvgbd-surface-alt);display:block}

/* Ensure uniform card height in grids */
.jvgbd-grid .jvgbd-grid-item{display:flex;align-items:flex-start}
.jvgbd-grid .jvgbd-grid-item > .jvgbd-game-card{height:var(--jvgbd-card-h, 220px);width:100%}

/* Prevent long release strings from breaking the fixed-height cards in grid views
   Keep the release date on a single line and truncate with an ellipsis. This
   is a minimal, non-invasive fix that preserves card height while keeping the
   new partial-date display readable. */
.jvgbd-game-card .jvgbd-game-details .jvgbd-release{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  display:block;
  max-width:100%;
}
.jvgbd-platforms-icons{display:inline-flex;gap:.35rem;flex-wrap:wrap;align-items:center}
.jvgbd-platform-badge{display:inline-flex;align-items:center;justify-content:center;position:relative}
.jvgbd-platform-badge img{width:20px;height:20px;object-fit:contain;display:inline-block;vertical-align:middle}
.jvgbd-platform-badge .jvgbd-cui{width:20px;height:20px;display:inline-block;vertical-align:middle;fill:currentColor}
.jvgbd-platform-badge .fa, .jvgbd-platform-badge .fas, .jvgbd-platform-badge .fab, .jvgbd-platform-badge .far, .jvgbd-platform-badge .bi{font-size:20px;line-height:1;color:var(--jvgbd-platform-color, currentColor)}
.jvgbd-platform-badge .jvgbd-platform-text{margin-left:.25rem}
.jvgbd-platform-badge.has-icon .jvgbd-platform-text{display:none !important}
.jvgbd-platform-badge.has-icon:hover .jvgbd-platform-text{display:none !important}
.jvgbd-platform-badge.no-img .jvgbd-platform-text{display:inline !important}

/* Fallback: if the icon is pending or appears broken (JS marks data-bi-pending),
   show the platform text so the badge is not empty on small screens or when
   icon fonts/icons are not yet loaded (e.g., inside Elementor). */
.jvgbd-platform-badge[data-bi-pending] .jvgbd-platform-text{display:inline !important}
.jvgbd-platform-badge[data-bi-pending] i,
.jvgbd-platform-badge[data-bi-pending] .bi,
.jvgbd-platform-badge[data-bi-pending] img{visibility:hidden}

/* Hide the visible platform text when an icon element is present before it
   (covers svg <use>, <i> icons and <img>), unless the badge is marked pending.
   Uses general sibling (~) so intervening tooltip element does not prevent match. */
.jvgbd-platform-badge:not([data-bi-pending]) > svg ~ .jvgbd-platform-text,
.jvgbd-platform-badge:not([data-bi-pending]) > i ~ .jvgbd-platform-text,
.jvgbd-platform-badge:not([data-bi-pending]) > img ~ .jvgbd-platform-text{
  display:none !important;
}

/* Rounded tooltip for platform badges */
.jvgbd-platform-badge .jvgbd-tooltip{
  position:absolute;
  left:50%;
  bottom:calc(100% + 8px);
  transform:translateX(-50%) translateY(4px);
  background:var(--jvgbd-tooltip-bg, rgba(0,0,0,.85));

/* JVGBD tooltip styles (global) */
.jvgbd-tooltip{position:absolute;z-index:99999;display:none;pointer-events:none;opacity:0;transition:opacity .12s ease,transform .12s ease;transform-origin:center top}
.jvgbd-tooltip.is-visible{display:block;opacity:1;pointer-events:auto}
.jvgbd-tooltip .jvgbd-tooltip-inner{background:var(--jvgbd-tooltip-bg, rgba(0,0,0,.88));color:var(--jvgbd-tooltip-color, #fff);padding:.45rem .6rem;border-radius:6px;font-size:.85rem;max-width:320px;box-shadow:0 6px 20px rgba(0,0,0,.18);line-height:1.2}
.jvgbd-tooltip .jvgbd-tooltip-arrow{position:absolute;width:12px;height:6px;left:50%;transform:translateX(-50%);bottom:-6px;clip-path:polygon(50% 100%, 0 0, 100% 0);background:var(--jvgbd-tooltip-bg, rgba(0,0,0,.88))}
.jvgbd-tooltip[data-placement="bottom"] .jvgbd-tooltip-arrow{top:-6px;bottom:auto;transform:translateX(-50%) rotate(180deg)}
.jvgbd-tooltip *{box-sizing:border-box}

/* High-specificity fallback to ensure visibility inside page builders/themes */
html body .jvgbd-tooltip, html body .jvgbd-tooltip *{color:var(--jvgbd-tooltip-color, #fff) !important; background:var(--jvgbd-tooltip-bg, rgba(0,0,0,.88)) !important}

/* Platform-badge specific tweak to align with existing markup */
.jvgbd-platform-badge .jvgbd-tooltip{position:absolute;left:50%;bottom:calc(100% + 8px);transform:translateX(-50%);}

/* Small-screen adjustments */
@media (max-width:480px){
  .jvgbd-tooltip .jvgbd-tooltip-inner{font-size:.82rem;max-width:220px;padding:.4rem .5rem}
}
  color:var(--jvgbd-tooltip-fg, #fff);
  padding:.25rem .5rem;
  border-radius:8px;
  font-size:.82rem;
  line-height:1.2;
  white-space:nowrap;
  box-shadow:0 4px 14px rgba(0,0,0,.25);
  z-index:20;
  opacity:0;
  pointer-events:none;
  transition:opacity .15s ease, transform .15s ease;
}

/* Lightweight plugin tooltip (used for data-jvgbd-tooltip) */
.jvgbd-tooltip{position:absolute;z-index:99999;pointer-events:none;opacity:0;transform:translateY(4px);transition:opacity .14s ease, transform .14s ease;max-width:320px}
.jvgbd-tooltip.is-visible{opacity:1;pointer-events:auto;transform:translateY(0)}
.jvgbd-tooltip .jvgbd-tooltip-inner{background:var(--jvgbd-tooltip-bg, rgba(0,0,0,.85));color:var(--jvgbd-tooltip-fg, #fff);padding:.35rem .6rem;border-radius:8px;font-size:.86rem;line-height:1.2;box-shadow:0 6px 22px rgba(0,0,0,.18);white-space:normal}
.jvgbd-tooltip .jvgbd-tooltip-arrow{width:10px;height:8px;position:absolute}
.jvgbd-tooltip .jvgbd-tooltip-arrow::before{content:'';position:absolute;width:10px;height:10px;background:var(--jvgbd-tooltip-bg, rgba(0,0,0,.85));transform:rotate(45deg);left:50%;margin-left:-5px;bottom:-5px}

/* Dark/light variants via data-jvgbd-theme on nearest .jvgbd-el or html
   If a widget sets --jvgbd-accent-dark or other variables, they will be used by the tooltip too. */
.jvgbd-el[data-jvgbd-theme='dark'] .jvgbd-tooltip .jvgbd-tooltip-inner,
html[data-jvgbd-theme='dark'] .jvgbd-tooltip .jvgbd-tooltip-inner{background:var(--jvgbd-tooltip-bg, rgba(0,0,0,.85));color:var(--jvgbd-tooltip-fg, #fff)}
.jvgbd-el[data-jvgbd-theme='light'] .jvgbd-tooltip .jvgbd-tooltip-inner,
html[data-jvgbd-theme='light'] .jvgbd-tooltip .jvgbd-tooltip-inner{background:var(--jvgbd-tooltip-bg, rgba(255,255,255,0.96));color:var(--jvgbd-tooltip-fg, #111);box-shadow:0 6px 22px rgba(6,24,54,0.06)}

/* Final high-specificity overrides for family grid title (last resort)
   Ensures the 'Jeux de la même famille' block uses the requested styles
   - Desktop: white title inside 48px bottom overlay, bold, clamped
   - Mobile: stacked image + title below with site text color
   Placed at the end of the file so it wins even if other files are enqueued after.
*/
@media (min-width:901px){
  body.single-jvgbd_game .jvgbd-family-games-grid .jvgbd-family-grid .jvgbd-family-grid-item .jvgbd-family-card .jvgbd-game-meta {
    position:absolute !important;
    left:8px !important;
    right:8px !important;
    bottom:8px !important;
    height:48px !important;
    display:flex !important;
    align-items:flex-end !important;
    justify-content:center !important;
    pointer-events:none !important;
    z-index:9999 !important;
  }
  /* Force white, bold title and clamp to 2 lines in overlay */
  body.single-jvgbd_game .jvgbd-family-games-grid .jvgbd-family-grid .jvgbd-family-grid-item .jvgbd-family-card .jvgbd-game-title,
  body .jvgbd-family-games-grid .jvgbd-family-grid .jvgbd-family-grid-item .jvgbd-family-card .jvgbd-game-title{
    color:#fff !important;
    font-weight:700 !important;
    text-align:center !important;
    display:-webkit-box !important;
    -webkit-line-clamp:2 !important;
    line-clamp:2 !important;
    -webkit-box-orient:vertical !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    margin:0 !important;
    padding:.2rem .45rem !important;
    pointer-events:auto !important;
  }
}

/* Mobile: ensure stacked layout and readable title below image */
@media (max-width:700px){
  body .jvgbd-family-games-grid .jvgbd-family-grid{grid-template-columns:1fr !important;gap:1rem !important}
  body .jvgbd-family-games-grid .jvgbd-family-grid .jvgbd-family-grid-item{padding:.5rem !important;aspect-ratio:auto !important;height:auto !important}
  body .jvgbd-family-games-grid .jvgbd-family-grid .jvgbd-family-card .jvgbd-game-thumb::after,
  body .jvgbd-family-games-grid .jvgbd-family-grid .jvgbd-family-card .jvgbd-overlay-backdrop{display:none !important}
  body .jvgbd-family-games-grid .jvgbd-family-grid .jvgbd-family-card .jvgbd-game-meta{position:static !important;display:block !important;padding:.5rem 0 0 !important;pointer-events:auto !important;text-align:center !important}
  body .jvgbd-family-games-grid .jvgbd-family-grid .jvgbd-family-card .jvgbd-game-title{
    color:var(--jvgbd-text) !important;
    font-weight:700 !important;
    font-size:1rem !important;
    line-height:1.2 !important;
    -webkit-line-clamp:2 !important;
    line-clamp:2 !important;
    overflow:hidden !important;
    white-space:normal !important;
    text-overflow:ellipsis !important;
    margin:0 !important;
    padding:0 .25rem !important;
    text-align:center !important;
  }
}
.jvgbd-platform-badge .jvgbd-tooltip::after{
  content:"";
  position:absolute;
  top:100%;
  left:50%;
  transform:translateX(-50%);
  border-width:6px;
  border-style:solid;
  border-color:var(--jvgbd-tooltip-bg, rgba(0,0,0,.85)) transparent transparent transparent;
}
.jvgbd-platform-badge.has-icon:hover .jvgbd-tooltip,
.jvgbd-platform-badge.has-icon:focus-within .jvgbd-tooltip,
/* Also show tooltip even if JS removed .has-icon (fallback cases) */
.jvgbd-platform-badge:hover .jvgbd-tooltip,
.jvgbd-platform-badge:focus-within .jvgbd-tooltip{
  opacity:1;
  transform:translateX(-50%) translateY(0);
}
.jvgbd-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.jvgbd-game-card .jvgbd-website .fa-solid,
.jvgbd-game-card .jvgbd-website .fas{font-size:1rem;color:#0a7}
.jvgbd-game-card .jvgbd-website .jvgbd-icon-link{display:inline-flex;align-items:center;gap:.25rem}
@media (max-width:600px){.jvgbd-game-card{grid-template-columns:minmax(0,1fr);padding-bottom:1.25rem}.jvgbd-game-card .jvgbd-game-thumb{flex-direction:column;align-items:center;gap:.75rem}.jvgbd-card-platforms{position:absolute;right:8px;bottom:8px;margin-top:0;justify-content:flex-end;max-width:calc(100% - 16px)}.jvgbd-card-platforms .jvgbd-platform-text{white-space:normal}}
/* Related posts list on single game */
.jvgbd-related-posts{margin:2rem 0}
.jvgbd-related-posts .jvgbd-related-title{margin:.5rem 0 1rem;font-size:1.1rem}
.jvgbd-related-posts .jvgbd-related-list{list-style:none;margin:0;padding:0}
.jvgbd-related-posts .jvgbd-related-item{display:grid;grid-template-columns:96px 1fr;gap:.75rem;padding:.5rem 0;border-bottom:1px solid var(--jvgbd-border)}
.jvgbd-related-posts .jvgbd-related-item:last-child{border-bottom:0}
.jvgbd-related-posts .jvgbd-related-thumb img{display:block;width:96px;height:auto;border-radius:6px}
.jvgbd-related-posts .jvgbd-no-thumb{display:block;width:96px;height:64px;background:var(--jvgbd-surface-alt);border:1px solid var(--jvgbd-border);border-radius:6px}
.jvgbd-related-posts .jvgbd-related-link{font-weight:600;text-decoration:none;color:var(--jvgbd-text)}
.jvgbd-related-posts .jvgbd-related-meta{display:flex;gap:.5rem;align-items:center;color:var(--jvgbd-muted);font-size:.9em;margin:.1rem 0}
.jvgbd-related-posts .jvgbd-related-meta .jvgbd-related-author{font-weight:500;color:var(--jvgbd-muted)}
.jvgbd-related-posts .jvgbd-related-date{color:var(--jvgbd-muted)}
.jvgbd-related-posts .jvgbd-related-excerpt{color:var(--jvgbd-text);margin-top:.25rem}
.jvgbd-related-posts .jvgbd-related-excerpt .jvgbd-read-more{margin-left:.35rem;color:#0d6efd;text-decoration:none}
.jvgbd-related-posts .jvgbd-related-excerpt .jvgbd-read-more:hover{text-decoration:underline}

/* After-post game card: show PEGI logo at right */
.jvgbd-after-post .jvgbd-game-card{grid-template-columns:90px 1fr 56px}
.jvgbd-after-post .jvgbd-pegi-logo{display:block;align-self:start;justify-self:end}
.jvgbd-after-post .jvgbd-pegi-logo img{width:48px;height:auto;display:block}
.jvgbd-after-post .jvgbd-game-details .jvgbd-pegi{display:none}

/* Game hero on single game */
.jvgbd-game-hero{position:relative;border-radius:10px;overflow:visible;margin:1.5rem 0;background:#000;color:#fff}
/* Ensure plugin hero backgrounds do not get forced to black by themes: prefer plugin variables or transparent */
.jvgbd-game-hero, .jvgbd-hero{background:var(--jvgbd-hero-bg, transparent) !important}
.jvgbd-game-hero .jvgbd-hero-bg{position:absolute;inset:0;background:var(--jvgbd-hero-bg, none) center/cover no-repeat;filter:brightness(.35);border-radius:inherit}
.jvgbd-game-hero .jvgbd-hero-inner{position:relative;display:grid;grid-template-columns:140px 1fr auto;grid-template-areas:'cover meta aside';gap:1rem;align-items:center;padding:1.25rem}
.jvgbd-game-hero .jvgbd-hero-cover img{display:block;width:140px;height:auto;border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.5)}
.jvgbd-game-hero .jvgbd-hero-cover{display:flex;flex-direction:column;align-items:center;grid-area:cover}
.jvgbd-game-hero .jvgbd-hero-user-rating{text-align:center}
.jvgbd-game-hero .jvgbd-hero-meta{grid-area:meta}
.jvgbd-game-hero .jvgbd-hero-user-rating .jvgbd-user-rating-label{display:block;text-align:center}
.jvgbd-game-hero .jvgbd-hero-cover .jvgbd-hero-user-rating{margin-top:.5rem}
.jvgbd-game-hero .jvgbd-hero-title{margin:0 0 .4rem;font-size:1.4rem;color:#fff}
.jvgbd-game-hero .jvgbd-hero-title .jvgbd-title-website{margin-left:.5rem;display:inline-flex;align-items:center;gap:.25rem;color:#0d6efd}
.jvgbd-game-hero .jvgbd-hero-title .jvgbd-title-website .fas,
.jvgbd-game-hero .jvgbd-hero-title .jvgbd-title-website .fa-solid{color:#0d6efd}
.jvgbd-game-hero .jvgbd-hero-title a,
.jvgbd-game-hero .jvgbd-hero-title .jvgbd-game-title a{
  color: var(--jvgbd-hero-link, var(--jvgbd-text, #fff)) !important;
}
/* Strong override: ensure hero title links remain white on image backgrounds
   This targets common hero variants and uses high specificity to resist theme overrides. */
html .jvgbd-game-hero.has-bg .jvgbd-hero-title a,
html .jvgbd-game-hero.has-bg .jvgbd-game-title a,
html .jvgbd-game-hero .jvgbd-hero-bg ~ .jvgbd-hero-inner .jvgbd-hero-title a,
html .jvgbd-hero .jvgbd-hero-title a { color: #fff !important; }
/* Link hover and dark-mode accent handling using per-widget variables */
.jvgbd-el a,
.jvgbd-el .jvgbd-read-more,
.jvgbd-el .jvgbd-share-link,
.jvgbd-el .jvgbd-buy-button{
  color: var(--jvgbd-accent, #0d6efd) !important;
}
.jvgbd-el a:hover,
.jvgbd-el .jvgbd-read-more:hover,
.jvgbd-el .jvgbd-share-link:hover,
.jvgbd-el .jvgbd-buy-button:hover{
  color: var(--jvgbd-accent-hover, var(--jvgbd-accent, #0b5ed7)) !important;
}
/* Dark-mode accent fallback: when widget defines an accent-dark, prefer it in dark contexts */
.jvgbd-el[data-jvgbd-theme="dark"] a,
.jvgbd-el[data-jvgbd-theme="dark"] .jvgbd-read-more,
.jvgbd-el[data-jvgbd-theme="dark"] .jvgbd-share-link,
.jvgbd-el[data-jvgbd-theme="dark"] .jvgbd-buy-button{
  color: var(--jvgbd-accent-dark, var(--jvgbd-accent, #0d6efd)) !important;
}
.jvgbd-game-hero .jvgbd-hero-details{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem 1rem;color:#eee}
.jvgbd-game-hero .jvgbd-hero-details li{margin:0}
/* Hide any legacy platforms row in hero details; platforms are shown in aside */
.jvgbd-game-hero .jvgbd-hero-details .jvgbd-platforms{display:none !important}
/* Slightly larger icons can be used in hero */
.jvgbd-game-hero .jvgbd-platform-badge img{width:22px;height:22px}
.jvgbd-game-hero .jvgbd-platform-badge .fa, .jvgbd-game-hero .jvgbd-platform-badge .fas, .jvgbd-game-hero .jvgbd-platform-badge .fab, .jvgbd-game-hero .jvgbd-platform-badge .far, .jvgbd-game-hero .jvgbd-platform-badge .bi{font-size:22px}
.jvgbd-game-hero .jvgbd-hero-aside .jvgbd-hero-platforms{display:flex;gap:.35rem;margin-top:.5rem;align-self:flex-end}
.jvgbd-game-hero .jvgbd-hero-website .fas,
.jvgbd-game-hero .jvgbd-hero-website .fa-solid{color:#fff}
.jvgbd-game-hero .jvgbd-hero-aside{display:flex;flex-direction:column;align-items:flex-end;gap:.5rem;grid-area:aside}
.jvgbd-game-hero .jvgbd-hero-release{display:inline-flex;align-items:center;gap:.4rem;color:#fff;background:rgba(255,255,255,.12);padding:.3rem .5rem;border-radius:6px;font-weight:600;white-space:nowrap}
.jvgbd-game-hero .jvgbd-hero-release .fas,
.jvgbd-game-hero .jvgbd-hero-release .fa-solid{color:#fff}
.jvgbd-game-hero .jvgbd-hero-pegi img{width:56px;height:auto;display:block}
.jvgbd-game-hero .jvgbd-hero-user-rating{display:inline-flex;flex-direction:column;align-items:center;gap:.15rem;color:#fff;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);padding:.4rem .6rem;border-radius:10px;font-weight:700}
.jvgbd-game-hero .jvgbd-hero-user-rating .jvgbd-user-rating-label{color:#fff;opacity:.95}
.jvgbd-game-hero .jvgbd-hero-user-rating .jvgbd-user-rating-row{display:inline-flex;align-items:center;gap:.35rem}
.jvgbd-game-hero .jvgbd-hero-user-rating .fas,.jvgbd-game-hero .jvgbd-hero-user-rating .fa-solid{color:#ffd76a}
.jvgbd-game-hero .jvgbd-hero-share{margin-top:.5rem;display:flex;gap:.35rem;flex-wrap:wrap;align-items:center}
.jvgbd-game-hero .jvgbd-hero-share .jvgbd-share-label{color:#fff;opacity:.95}
.jvgbd-game-hero .jvgbd-hero-share .jvgbd-share-link{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border:1px solid rgba(255,255,255,.25);border-radius:50%;color:#fff;background:rgba(255,255,255,.12)}
.jvgbd-game-hero .jvgbd-hero-share .jvgbd-share-link i{font-size:14px;line-height:1}
.jvgbd-game-hero .jvgbd-hero-share .jvgbd-share-link:hover{background:#0d6efd;border-color:#0d6efd;color:#fff}
.jvgbd-game-hero .jvgbd-hero-votes{display:flex;gap:.4rem;margin-top:.25rem}
@media (max-width:820px){.jvgbd-game-hero .jvgbd-hero-inner{grid-template-columns:minmax(0,1fr);grid-template-areas:'cover' 'meta' 'aside';align-items:flex-start}.jvgbd-game-hero .jvgbd-hero-cover{align-items:center;margin-bottom:.75rem}.jvgbd-game-hero .jvgbd-hero-meta{width:100%}.jvgbd-game-hero .jvgbd-hero-aside{align-items:flex-start;width:100%}.jvgbd-game-hero .jvgbd-hero-votes{flex-wrap:wrap}}

.jvgbd-game-hero .jvgbd-hero-votes .jvgbd-vote{background:#ffffff12;color:#fff;border:1px solid transparent;border-radius:14px;padding:.2rem .45rem;cursor:pointer;display:inline-flex;align-items:center;gap:.3rem;font-size:.9rem;line-height:1}
.jvgbd-game-hero .jvgbd-hero-votes .jvgbd-vote i{font-size:.95em}
.jvgbd-game-hero .jvgbd-hero-votes .jvgbd-vote:hover{background:#ffffff24}
/* Active states */
.jvgbd-game-hero .jvgbd-hero-votes .jvgbd-vote-up.is-active-up{background:#0d6efd !important;border-color:#0d6efd !important;color:#fff}
.jvgbd-game-hero .jvgbd-hero-votes .jvgbd-vote-up.is-active-up i.fa-heart{color:#e31b23}
.jvgbd-game-hero .jvgbd-hero-votes .jvgbd-vote-down.is-active-down{background:#fff !important;border-color:#e31b23 !important;color:#e31b23}
.jvgbd-game-hero .jvgbd-hero-votes .jvgbd-vote-down.is-active-down i{color:#e31b23}
/* Hype (flame) button */
.jvgbd-game-hero .jvgbd-hero-votes .jvgbd-vote-hype i{color:#ffb84d}
.jvgbd-game-hero .jvgbd-hero-votes .jvgbd-vote-hype.is-active-hype{background:#ffb84d !important;border-color:#ffb84d !important;color:#fff}
.jvgbd-game-hero .jvgbd-hero-votes .jvgbd-vote-hype.is-active-hype i{color:#fff}

/* Ensure the flame icon is white in calendar/gamecard contexts after activation */
.jvgbd-vote-hype.is-active-hype i.fa-fire,
.jvgbd-game-card-hype .jvgbd-vote-hype.is-active-hype i.fa-fire,
.elementor-widget .jvgbd-vote-hype.is-active-hype i.fa-fire{color:#fff !important}
@media (max-width:700px){
  .jvgbd-game-hero .jvgbd-hero-cover img{width:100px}
  .jvgbd-game-hero .jvgbd-hero-pegi img{width:48px}
}

/* Sticky footer just on game pages (covers common theme wrappers) */
body.single-jvgbd_game{min-height:100vh;display:flex;flex-direction:column}
body.single-jvgbd_game #page,
body.single_jvgbd_game .site,
body.single_jvgbd_game .site-container,
body.single_jvgbd_game #wrapper{
  min-height:100vh;display:flex;flex-direction:column
}
body.single-jvgbd_game .site-main.jvgbd-single-game{flex:1 0 auto}
body.single_jvgbd_game #colophon,
body.single_jvgbd_game .site-footer,
body.single_jvgbd_game footer{margin-top:auto}

/* Tabs under hero */
.jvgbd-tabs{margin:1rem 0 1.5rem}
.jvgbd-tabs .jvgbd-tabs-header{display:grid;grid-template-columns:1fr auto;align-items:center;gap:.5rem;margin-bottom:.5rem}
.jvgbd-tabs .jvgbd-tablist{flex:1 1 auto;min-width:0;display:flex;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch}
.jvgbd-tabs .jvgbd-tabs-share{position:relative;flex:0 0 auto}
.jvgbd-tabs .jvgbd-share-toggle{appearance:none;border:1px solid var(--jvgbd-border);background:var(--jvgbd-surface);color:var(--jvgbd-text);width:28px;height:28px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.jvgbd-tabs .jvgbd-share-toggle:hover,
.jvgbd-tabs .jvgbd-share-toggle:focus,
.jvgbd-tabs .jvgbd-share-toggle:active,
.jvgbd-tabs .jvgbd-tabs-share.is-open .jvgbd-share-toggle{background:#0d6efd !important;color:#fff !important;border-color:#0d6efd !important}
.jvgbd-tabs .jvgbd-share-menu{position:absolute;top:calc(100% + 8px);right:0;display:none;background:var(--jvgbd-surface);border:1px solid var(--jvgbd-border);border-radius:8px;padding:.4rem;box-shadow:0 6px 22px rgba(0,0,0,.12);white-space:nowrap;z-index:50}
.jvgbd-tabs .jvgbd-tabs-share:hover .jvgbd-share-menu,
.jvgbd-tabs .jvgbd-tabs-share:focus-within .jvgbd-share-menu,
.jvgbd-tabs .jvgbd-tabs-share.is-open .jvgbd-share-menu{display:block}
.jvgbd-tabs .jvgbd-share-menu .jvgbd-share-link{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border:1px solid var(--jvgbd-border);border-radius:50%;color:#0d6efd;background:var(--jvgbd-surface);margin:0 .2rem}
.jvgbd-tabs .jvgbd-share-menu .jvgbd-share-link i{font-size:14px;line-height:1}
.jvgbd-tabs .jvgbd-share-menu .jvgbd-share-link:hover{background:#0d6efd;color:#fff;border-color:#0d6efd}
.jvgbd-tabs .jvgbd-share-menu .jvgbd-share-copy.is-copied{background:#28a745 !important;border-color:#28a745 !important;color:#fff !important}
.jvgbd-tabs .jvgbd-tabs-share .jvgbd-share-link{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border:1px solid var(--jvgbd-border);border-radius:50%;color:#0d6efd;background:var(--jvgbd-surface)}
.jvgbd-tabs .jvgbd-tabs-share .jvgbd-share-link i{font-size:14px;line-height:1}
.jvgbd-tabs .jvgbd-tabs-share .jvgbd-share-link:hover{background:#0d6efd;color:#fff;border-color:#0d6efd}
.jvgbd-tabs .jvgbd-tabs-share .jvgbd-share-copy.is-copied{background:#28a745 !important;border-color:#28a745 !important;color:#fff !important}
.jvgbd-tablist{display:flex;gap:.5rem;flex-wrap:nowrap;border-bottom:0}
.jvgbd-tab{appearance:none;border:none;background:var(--jvgbd-surface-alt);color:var(--jvgbd-text);padding:.5rem .8rem;border-radius:6px;cursor:pointer;display:inline-flex;align-items:center;gap:.4rem;box-shadow:none;white-space:nowrap}
.jvgbd-tabs .jvgbd-tab:hover,
.jvgbd-tabs .jvgbd-tab:focus,
.jvgbd-tabs .jvgbd-tab:active{background:#0d6efd !important;color:#fff !important;border:none !important}
.jvgbd-tabs .jvgbd-tab.is-active:hover{background:#0b5ed7 !important;border:none !important}
.jvgbd-tab.is-active{background:#0d6efd;color:#fff;border:none}
.jvgbd-tab .fa-solid,
.jvgbd-tab .fas,
.jvgbd-tab .far,
.jvgbd-tab .fa-regular{font-size:.95em}
.jvgbd-tabs-panels{border:none;border-radius:8px;background:var(--jvgbd-surface);padding:1rem}
.jvgbd-tab-panel{display:none}
.jvgbd-tab-panel.is-active{display:block}

/* Gallery grid */
.jvgbd-game-gallery .jvgbd-gallery-grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(180px, 1fr));gap:.75rem}
.jvgbd-game-gallery .jvgbd-gallery-item{position:relative;display:block;overflow:hidden;border-radius:6px;background:var(--jvgbd-surface-alt);aspect-ratio:16/9}
.jvgbd-game-gallery .jvgbd-gallery-item img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}
@media (max-width:900px){.jvgbd-game-gallery .jvgbd-gallery-grid{grid-template-columns:repeat(auto-fill, minmax(160px, 1fr))}}
@media (max-width:600px){.jvgbd-game-gallery .jvgbd-gallery-grid{grid-template-columns:repeat(auto-fill, minmax(140px, 1fr))}}

/* Videos grid */
.jvgbd-game-videos .jvgbd-videos-grid{display:grid;grid-template-columns:repeat(2, minmax(0,1fr));gap:1rem}
.jvgbd-game-videos .jvgbd-video-item iframe{width:100%;aspect-ratio:16/9;height:auto;border:0;border-radius:6px}
@media (max-width:700px){.jvgbd-game-videos .jvgbd-videos-grid{grid-template-columns:1fr}}

/* Trailer (single) - larger hero style */
.jvgbd-game-trailer{margin:1rem 0;padding:0;border-radius:10px;overflow:hidden;background:var(--jvgbd-surface);box-shadow:0 8px 30px rgba(6,24,54,0.08);border:1px solid var(--jvgbd-border)}
.jvgbd-game-trailer .jvgbd-trailer-header{display:flex;align-items:center;gap:.8rem;padding:1rem 1rem;border-bottom:1px solid var(--jvgbd-border);background:linear-gradient(90deg, rgba(13,110,253,0.04), rgba(13,110,253,0.01));}
.jvgbd-game-trailer .jvgbd-trailer-header .jvgbd-trailer-icon{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:8px;background:linear-gradient(180deg,#0d6efd,#5ab1ff);color:#fff;font-size:18px}
.jvgbd-game-trailer .jvgbd-trailer-header .jvgbd-trailer-title{font-weight:700;font-size:1.05rem;color:var(--jvgbd-text)}
.jvgbd-game-trailer .jvgbd-trailer-header .jvgbd-trailer-sub{margin-left:auto;color:var(--jvgbd-muted);font-size:.95rem}
.jvgbd-game-trailer .jvgbd-trailer-frame{position:relative;padding-top:56.25%;background:#000}
.jvgbd-game-trailer .jvgbd-trailer-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
@media (min-width:900px){
  .jvgbd-game-trailer{max-width:980px;margin-left:auto;margin-right:auto}
  .jvgbd-game-trailer .jvgbd-trailer-frame{padding-top:calc((480 / 980) * 100%)}
}


/* Lightbox */
.jvgbd-lightbox{position:fixed;inset:0;background:rgba(0,0,0,.9);display:flex;align-items:center;justify-content:center;z-index:9999;opacity:0;visibility:hidden;transition:opacity .2s ease}
.jvgbd-lightbox.is-open{opacity:1;visibility:visible}
.jvgbd-lightbox img{max-width:90vw;max-height:90vh;display:block;border-radius:8px}
.jvgbd-lightbox .jvgbd-lightbox-close{position:absolute;top:12px;right:12px;background:transparent;border:none;color:#fff;font-size:28px;cursor:pointer;line-height:1}

/* Buy list */
.jvgbd-game-buy .jvgbd-buy-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr;gap:.5rem}
.jvgbd-game-buy .jvgbd-buy-item{display:grid;grid-template-columns:56px 1fr auto;gap:.75rem;align-items:center;border:1px solid var(--jvgbd-border);border-radius:8px;padding:.5rem .75rem;background:var(--jvgbd-surface)}
.jvgbd-game-buy .jvgbd-buy-logo img{width:56px;height:auto;display:block}
.jvgbd-game-buy .jvgbd-buy-logo i{width:56px;height:32px;display:inline-flex;align-items:center;justify-content:center;font-size:28px;color:#222}
.jvgbd-game-buy .jvgbd-buy-logo-text{display:none;min-width:56px;min-height:32px;padding:.25rem .5rem;border-radius:6px;background:#f1f3f5;color:#111;align-items:center;justify-content:center;font-weight:700}
.jvgbd-game-buy .jvgbd-buy-logo.no-img .jvgbd-buy-logo-text{display:inline-flex}
.jvgbd-game-buy .jvgbd-buy-item.has-logo .jvgbd-buy-store{display:block}
.jvgbd-game-buy .jvgbd-buy-store{font-weight:700}

.jvgbd-game-buy .jvgbd-buy-price{color:#0a7;margin-top:.15rem}
.jvgbd-game-buy .jvgbd-buy-button{display:inline-block;background:#0d6efd;color:#fff;text-decoration:none;padding:.45rem .8rem;border-radius:6px}
.jvgbd-game-buy .jvgbd-buy-button:hover{background:#0b5ed7}

/* Reviews */
.jvgbd-game-reviews .jvgbd-reviews-avg{background:var(--jvgbd-surface-alt);border:1px solid var(--jvgbd-border);border-radius:8px;padding:.75rem;margin:.5rem 0;color:var(--jvgbd-text)}
.jvgbd-game-reviews .jvgbd-reviews-avg ul{list-style:none;margin:.25rem 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.4rem 1rem}
.jvgbd-game-reviews .jvgbd-crit-row{display:grid;grid-template-columns:140px 1fr 48px;gap:.5rem;align-items:center}
.jvgbd-game-reviews .jvgbd-crit-row .jvgbd-crit{font-weight:600}
.jvgbd-game-reviews .jvgbd-crit-bar{height:8px;background:var(--jvgbd-border);border-radius:999px;overflow:hidden;position:relative}
.jvgbd-game-reviews .jvgbd-crit-fill{display:block;height:100%;width:0;background:linear-gradient(90deg,#0d6efd,#5ab1ff,#0d6efd);background-size:200% 100%;animation:jvgbd-shimmer 1.6s linear infinite;transition:width 1s cubic-bezier(.22,1,.36,1)}
.jvgbd-game-reviews .jvgbd-crit-row.is-animated .jvgbd-crit-fill{width:var(--w,0%)}
.jvgbd-game-reviews .jvgbd-crit-overall .jvgbd-crit-fill{background:linear-gradient(90deg,#0a7,#39d,#0a7);background-size:200% 100%}
@keyframes jvgbd-shimmer{0%{background-position:0 0}100%{background-position:200% 0}}
@media (prefers-reduced-motion: reduce){
  .jvgbd-game-reviews .jvgbd-crit-fill{animation:none;transition:none}
  .jvgbd-game-reviews .jvgbd-crit-row.is-animated .jvgbd-crit-fill{width:var(--w,0%)}
}
.jvgbd-game-reviews .jvgbd-crit-overall .jvgbd-crit-fill{background:linear-gradient(90deg,#0a7,#39d)}
.jvgbd-game-reviews .jvgbd-reviews-list{display:grid;gap:.75rem}
.jvgbd-game-reviews .jvgbd-review{border:1px solid var(--jvgbd-border);border-radius:8px;padding:.9rem;background:var(--jvgbd-surface);color:var(--jvgbd-text);box-shadow:0 2px 10px rgba(0,0,0,.06)}
.jvgbd-game-reviews .jvgbd-review header{display:flex;gap:.5rem;align-items:center}
.jvgbd-game-reviews .jvgbd-overall{display:inline-flex;align-items:center;gap:.35rem}
.jvgbd-game-reviews .jvgbd-overall .fas,
.jvgbd-game-reviews .jvgbd-overall .fa-solid{color:#ffd76a}
.jvgbd-game-reviews .jvgbd-review-avatar{width:32px;height:32px;border-radius:50%;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;background:var(--jvgbd-surface-alt);color:var(--jvgbd-muted);font-weight:700;flex:0 0 32px}
.jvgbd-game-reviews .jvgbd-avatar-fallback{font-size:.8rem}
.jvgbd-game-reviews .jvgbd-review .jvgbd-overall-badge{margin-left:auto;background:#0d6efd;color:#fff;border-radius:999px;padding:.15rem .55rem;font-weight:700;min-width:44px;text-align:center;display:inline-flex;align-items:center;gap:.25rem}
.jvgbd-game-reviews .jvgbd-review .jvgbd-overall-badge .fas,
.jvgbd-game-reviews .jvgbd-review .jvgbd-overall-badge .fa-solid{color:#ffd76a}
.jvgbd-game-reviews .jvgbd-crit-overall .fas,
.jvgbd-game-reviews .jvgbd-crit-overall .fa-solid{color:#ffd76a}
.jvgbd-game-reviews .jvgbd-share{margin-top:1rem;display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.jvgbd-game-reviews .jvgbd-share-label{font-weight:600;color:var(--jvgbd-text)}
.jvgbd-game-reviews .jvgbd-share .jvgbd-share-link{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border:1px solid var(--jvgbd-border);border-radius:50%;color:#0d6efd;background:var(--jvgbd-surface)}
.jvgbd-game-reviews .jvgbd-share .jvgbd-share-link i{font-size:14px;line-height:1}
.jvgbd-game-reviews .jvgbd-share .jvgbd-share-link:hover{background:#0d6efd;color:#fff;border-color:#0d6efd}
.jvgbd-game-reviews .jvgbd-share .jvgbd-share-copy.is-copied{background:#28a745 !important;border-color:#28a745 !important;color:#fff !important}
.jvgbd-game-reviews .jvgbd-review-criteria label{display:block;margin:.35rem 0}
.jvgbd-game-reviews .jvgbd-review-ratings ul{list-style:none;margin:.5rem 0 0;padding:0;display:grid;gap:.4rem}
.jvgbd-game-reviews .jvgbd-review-form input[type=text],
.jvgbd-game-reviews .jvgbd-review-form input[type=email],
.jvgbd-game-reviews .jvgbd-review-form textarea,
.jvgbd-game-reviews .jvgbd-review-form select{width:100%;max-width:480px}
.jvgbd-game-reviews .jvgbd-review-form textarea{max-width:none;width:100%}
.jvgbd-game-reviews .jvgbd-btn-submit{background:#0d6efd;color:#fff;border:none;border-radius:6px;padding:.45rem .8rem;margin-top:.5rem}
.jvgbd-game-reviews .jvgbd-btn-submit:hover{background:#0b5ed7}
.jvgbd-game-reviews .jvgbd-review-form{background:var(--jvgbd-surface-alt);border:1px solid var(--jvgbd-border);border-radius:10px;padding:1rem;margin-top:1rem}
.jvgbd-game-reviews .jvgbd-form-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem 1rem}
.jvgbd-game-reviews .jvgbd-form-group .jvgbd-field{padding:.5rem .6rem;border:1px solid var(--jvgbd-border);border-radius:8px;background:var(--jvgbd-surface);color:var(--jvgbd-text)}
.jvgbd-game-reviews .jvgbd-form-group .jvgbd-field:focus{outline:none;box-shadow:0 0 0 3px rgba(13,110,253,.2);border-color:#0d6efd}

/* Single page two-column layout: main + right aside (series) */
.jvgbd-single-layout{display:grid;grid-template-columns:1fr 320px;gap:1.25rem;align-items:start;margin:0}
.jvgbd-single-main{min-width:0}
.jvgbd-single-aside{width:100%;max-width:320px}
.jvgbd-series-games{display:block;padding:0;margin:0}
.jvgbd-series-games .jvgbd-series-title{font-weight:700;margin:0 0 .5rem}
.jvgbd-series-games .jvgbd-series-list{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.jvgbd-series-games .jvgbd-series-item{display:flex;gap:.6rem;align-items:center;padding:.45rem;border:1px solid var(--jvgbd-border);border-radius:8px;background:var(--jvgbd-surface)}
.jvgbd-series-games .jvgbd-series-thumb img{width:56px;height:32px;object-fit:cover;border-radius:4px}
.jvgbd-series-games .jvgbd-series-meta{font-size:.92rem;color:var(--jvgbd-muted)}

@media (max-width:900px){
  .jvgbd-single-layout{grid-template-columns:1fr;gap:1rem}
  .jvgbd-single-aside{order:2}
  .jvgbd-single-main{order:1}
}
.jvgbd-game-reviews .jvgbd-review-criteria{margin-top:.5rem}
.jvgbd-game-reviews .jvgbd-review-criteria-title{font-weight:700;margin-bottom:.25rem}
.jvgbd-game-reviews .jvgbd-review-criteria label{display:grid;grid-template-columns:1fr auto;align-items:center;gap:.5rem}
.jvgbd-game-reviews .jvgbd-review-criteria select{width:auto;min-width:72px}
.jvgbd-series-games{margin:1rem 0;padding:.6rem;border:1px solid var(--jvgbd-border);border-radius:8px;background:var(--jvgbd-surface-alt)}
.jvgbd-series-title{margin:0 0 .5rem;font-weight:700}
.jvgbd-series-list{list-style:none;margin:0;padding:0;display:flex;gap:.75rem;flex-wrap:wrap}
.jvgbd-series-item{display:flex;align-items:center;gap:.5rem;background:transparent;padding:.25rem;border-radius:6px}
.jvgbd-series-item a{display:inline-flex;align-items:center;gap:.5rem;color:var(--jvgbd-text);text-decoration:none}
.jvgbd-series-item a:hover{background:var(--jvgbd-surface);box-shadow:0 6px 18px rgba(6,24,54,0.04)}
.jvgbd-game-reviews .jvgbd-review-help{color:var(--jvgbd-muted);margin:.25rem 0 .5rem}
.jvgbd-game-reviews .jvgbd-review-feedback{margin-top:.5rem;min-height:1.25rem;color:var(--jvgbd-text)}
.jvgbd-game-reviews .jvgbd-editor{margin-top:.5rem;position:relative;z-index:1}
.jvgbd-game-reviews .jvgbd-editor-toolbar{display:flex;gap:.35rem;margin-bottom:.35rem}
.jvgbd-game-reviews .jvgbd-editor-toolbar .jvgbd-btn{background:var(--jvgbd-surface);border:1px solid var(--jvgbd-border);border-radius:6px;padding:.25rem .45rem;cursor:pointer;color:var(--jvgbd-text)}
.jvgbd-game-reviews .jvgbd-editor-toolbar .jvgbd-btn:hover{background:var(--jvgbd-surface-alt)}
.jvgbd-game-reviews .jvgbd-emoji{position:relative}
.jvgbd-game-reviews .jvgbd-emoji .jvgbd-emoji-pop{position:absolute;top:calc(100% + 4px);left:0;background:var(--jvgbd-surface);border:1px solid var(--jvgbd-border);border-radius:8px;padding:.35rem .45rem;display:none;gap:.25rem;z-index:999;box-shadow:0 6px 22px rgba(0,0,0,.18);min-width:220px}
.jvgbd-game-reviews .jvgbd-emoji .jvgbd-emoji-pop button{background:none;border:none;cursor:pointer;font-size:1.25rem;line-height:1;width:2rem;height:2rem;display:inline-flex;align-items:center;justify-content:center;padding:0;border-radius:6px;box-sizing:border-box}
.jvgbd-game-reviews .jvgbd-emoji .jvgbd-emoji-pop button:hover{background:var(--jvgbd-surface-alt)}
.jvgbd-game-reviews .jvgbd-emoji.is-open .jvgbd-emoji-pop{display:grid !important;grid-template-columns:repeat(6, 2rem);gap:.35rem}
.jvgbd-game-reviews .jvgbd-review-form textarea{border:1px solid var(--jvgbd-border);border-radius:6px}
.jvgbd-game-reviews .jvgbd-review-form input[type=text],
.jvgbd-game-reviews .jvgbd-review-form input[type=email],
.jvgbd-game-reviews .jvgbd-review-form select{border:1px solid var(--jvgbd-border);border-radius:6px}
.jvgbd-hp{position:absolute !important; left:-9999px !important; width:1px; height:1px; opacity:0; pointer-events:none}

/* Stronger overlay to improve readability for stacked hero blocks */
.jvgbd-hype-hero .jvgbd-hype-hero-overlay{background:linear-gradient(180deg, rgba(0,0,0,0.5), rgba(0,0,0,0.7));}

/* Option: fixed darker overlay for better contrast (applied to hero variants)
  Use the .jvgbd-hype-hero--dark modifier to enable the stronger fixed overlay.
  This avoids gradient inconsistencies on small/low-contrast covers. */
.jvgbd-hype-hero--dark .jvgbd-hype-hero-overlay,
.jvgbd-game-hero .jvgbd-hero-bg--fixed-overlay + .jvgbd-hero-inner .jvgbd-hero-overlay{background:rgba(0,0,0,0.65);}

/* Smooth fade when overlay changes (hover/focus states can animate nicely) */
.jvgbd-hype-hero .jvgbd-hype-hero-overlay,
.jvgbd-game-hero .jvgbd-hero-inner .jvgbd-hero-overlay{transition:background .22s ease}

/* Hype widget - small hero-like cards for sidebar */
.jvgbd-hype-widget{display:block;margin:0;padding:0}
/* Internal widget title used as fallback when theme hides the widget title */
.jvgbd-hype-widget .jvgbd-hype-widget-title{font-size:1.05rem;font-weight:700;margin:0 0 .5rem;color:var(--jvgbd-text)}

/* Some themes output a title wrapper around widgets; hide it for this widget to avoid duplicate headings.
  We target common patterns .widgettitle and .widget-title when inside our widget container. */
.jvgbd-hype-widget:not(.use-theme-title) .widgettitle,
.jvgbd-hype-widget:not(.use-theme-title) .widget-title{display:none}

/* When the widget explicitly opts to use the theme title, ensure our internal
  title is hidden to avoid duplicates */
.jvgbd-hype-widget.use-theme-title .jvgbd-hype-widget-title{display:none}

/* Gamecard: Hype button (bottom-left overlay) */
.jvgbd-game-card{position:relative}
.jvgbd-game-card-hype{position:absolute;left:8px;bottom:8px;z-index:40}
.jvgbd-game-card-hype .jvgbd-btn{display:inline-flex;align-items:center;gap:.4rem;padding:.35rem .5rem;border-radius:20px;border:1px solid rgba(255,184,77,.2);background:rgba(0,0,0,.45);color:#fff;font-weight:700}
.jvgbd-game-card-hype .jvgbd-btn i{color:#ffb84d}
.jvgbd-game-card-hype .jvgbd-hype-count{font-size:.95rem}
.jvgbd-game-card-hype .jvgbd-btn.is-active-hype{background:#ffb84d;border-color:#ffb84d;color:#111}

/* Ensure editors see the Hype button inside Elementor editor preview */
.elementor-editor-active .jvgbd-game-card-hype,
.elementor-editor .jvgbd-game-card-hype {
  display:block !important;
  opacity:1 !important;
  visibility:visible !important;
}

/* Aggressive fallback: ensure the hype button sits above most theme/elementor wrappers */
.jvgbd-game-card-hype { position: absolute; left: 8px; bottom: 8px; z-index: 40; }
/* In Elementor editor we keep a higher z-index so the editor preview shows controls; keep this scoped to editor only. */
.elementor-editor-active .jvgbd-game-card-hype,
.elementor-editor .jvgbd-game-card-hype {
  position: absolute !important;
  left: 8px !important;
  bottom: 8px !important;
  z-index: 1200 !important; /* high for editor, but much lower than 999999 */
  pointer-events: auto !important;
}
.jvgbd-game-card-hype .jvgbd-btn{
  transform: translateZ(0) !important;
}
.jvgbd-hype-widget .jvgbd-hype-card{display:flex;align-items:center;gap:.5rem;padding:.4rem .35rem;border-radius:8px;text-decoration:none;color:inherit;border:1px solid transparent}
.jvgbd-hype-widget .jvgbd-hype-card:hover{background:var(--jvgbd-surface-alt);border-color:var(--jvgbd-border)}
.jvgbd-hype-thumb{width:30px;height:30px;background-size:cover;background-position:center;border-radius:6px;flex:0 0 30px}
.jvgbd-hype-title{flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600;font-size:.95rem}
.jvgbd-hype-count{flex:0 0 auto;margin-left:8px;font-weight:700;color:var(--jvgbd-muted);min-width:40px;text-align:right}
.jvgbd-hype-empty{color:var(--jvgbd-muted);padding:.5rem}

/* Hero variant for first item in Hype widget */
.jvgbd-hype-hero{display:block;position:relative;border-radius:8px;overflow:hidden;background-size:cover;background-position:center;background-repeat:no-repeat;margin-bottom:.4rem;text-decoration:none;color:inherit;height:64px}
.jvgbd-hype-hero .jvgbd-hype-hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg, rgba(0,0,0,0.35), rgba(0,0,0,0.6));display:flex;align-items:center;justify-content:space-between;padding:.45rem .5rem}

/* Elementor fixes: ensure the widget fills column width and that overlays stack above editor wrappers */
.elementor-widget .jvgbd-hype-widget,
.elementor-column .jvgbd-hype-widget{width:100%;box-sizing:border-box}
.elementor-widget .jvgbd-hype-hero,
.elementor-column .jvgbd-hype-hero{height:64px;border-radius:6px;margin-bottom:.5rem}
.elementor-widget .jvgbd-hype-hero .jvgbd-hype-hero-overlay,
.elementor-column .jvgbd-hype-hero .jvgbd-hype-hero-overlay{position:absolute;inset:0;z-index:5;display:flex;align-items:center;justify-content:space-between;padding:.5rem}
.elementor-widget .jvgbd-hype-hero{background-size:cover !important;background-position:center center !important}

/* Prevent Elementor editor panels from overlapping overlays when rendered in the editor iframe */
.elementor-editor-active .jvgbd-hype-hero .jvgbd-hype-hero-overlay{z-index:1200}

/* Tweak small screens inside Elementor: reduce height to fit sidebars */
@media (max-width:480px){
  .elementor-widget .jvgbd-hype-hero{height:56px}
}

/* More robust fix for overlapping / inline layout issues inside page builders
   Force each hero to be a full-width block and ensure overlay stacking and
   readable title. This prevents anchors from flowing inline and text from
   overlapping multiple items (common when themes or builders apply unexpected
   flex/inline styles). */
.jvgbd-hype-widget .jvgbd-hype-hero,
.elementor-widget .jvgbd-hype-hero,
.elementor-column .jvgbd-hype-hero{
  display:block !important;
  width:100% !important;
  box-sizing:border-box !important;
  clear:both !important;
  overflow:hidden;
  min-height:56px;
}
.jvgbd-hype-widget a.jvgbd-hype-hero{display:block}
.jvgbd-hype-hero .jvgbd-hype-hero-overlay{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.5rem}
.jvgbd-hype-hero .jvgbd-hype-hero-title{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.jvgbd-hype-hero .jvgbd-hype-hero-count{flex:0 0 auto;margin-left:8px}

/* Defensive: if Elementor or theme applies negative margins inside editor, keep widget readable */
.elementor-widget .jvgbd-hype-widget{margin:0;padding:0}

/* Strong overrides to prevent overlapping in page-builders / themes */
.jvgbd-hype-widget, .jvgbd-hype-widget *{box-sizing:border-box}
.jvgbd-hype-widget a.jvgbd-hype-hero{
  display:block !important;
  position:relative !important;
  width:100% !important;
  float:none !important;
  clear:both !important;
  overflow:hidden !important;
  min-height:56px !important;
  margin:0 0 .5rem !important;
  background-size:cover !important;
  background-position:center center !important;
}
.jvgbd-hype-hero{position:relative !important}
.jvgbd-hype-hero .jvgbd-hype-hero-overlay{
  position:absolute !important;
  inset:0 !important;
  z-index:999 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:.5rem !important;
  padding:.5rem !important;
  background:rgba(0,0,0,0.65) !important;
}
.jvgbd-hype-hero .jvgbd-hype-hero-title{
  display:block !important;
  max-width:calc(100% - 56px) !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}
.jvgbd-hype-hero .jvgbd-hype-hero-count{
  flex:0 0 auto !important;
  min-width:44px !important;
  text-align:right !important;
}
.jvgbd-hype-widget a.jvgbd-hype-hero + a.jvgbd-hype-hero{margin-top:.4rem !important}
.jvgbd-hype-hero-title{color:#fff;font-weight:700;font-size:.98rem;line-height:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-shadow:0 1px 2px rgba(0,0,0,0.6)}
.jvgbd-hype-hero-count{background:rgba(255,255,255,0.12);color:#fff;padding:.18rem .4rem;border-radius:999px;font-weight:700;min-width:42px;text-align:center;display:inline-flex;align-items:center;gap:.35rem}
.jvgbd-hype-hero-count .fa-fire{color:#ffb84d;font-size:14px}

/* Compact layout for Elementor: image + title + count on one line */
.jvgbd-hype-item{display:block;margin:0 0 .45rem}
.jvgbd-hype-link{display:flex;align-items:center;gap:.5rem;text-decoration:none;color:inherit}
.jvgbd-hype-thumb img{width:30px;height:30px;object-fit:cover;border-radius:6px;display:block}
.jvgbd-hype-body{flex:1 1 auto;min-width:0}
.jvgbd-hype-title{font-weight:600;font-size:.95rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.jvgbd-hype-count{flex:0 0 auto;margin-left:8px;font-weight:700;color:var(--jvgbd-muted);min-width:40px;text-align:right}

/* Ensure compact layout is stable inside Elementor columns */
.elementor-widget .jvgbd-hype-link{width:100%;box-sizing:border-box}

/* Single-line hero: title left, flame counter right */
.jvgbd-hype-hero{display:flex;align-items:center;justify-content:space-between;padding:.35rem .4rem;border-radius:6px;text-decoration:none;color:inherit;background:transparent;border:1px solid transparent;margin-bottom:.35rem}
.jvgbd-hype-hero:hover{background:var(--jvgbd-surface-alt)}
.jvgbd-hype-hero .jvgbd-hype-hero-title{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.jvgbd-hype-hero .jvgbd-hype-hero-count{flex:0 0 auto;margin-left:8px;font-weight:700;color:var(--jvgbd-muted);display:inline-flex;align-items:center;gap:.35rem}
.jvgbd-hype-hero .fa-fire{color:#ffb84d}

/* Ensure the widget container stacks hero items vertically (avoid inline/flex row from page-builders) */
.jvgbd-hype-widget{
  display:flex !important;
  flex-direction:column !important;
  gap:.45rem !important;
  align-items:stretch !important;
  width:100%;
}

/* Ensure direct child anchors take full width and behave as block rows */
.jvgbd-hype-widget > a.jvgbd-hype-hero,
.jvgbd-hype-widget > .jvgbd-hype-item > a.jvgbd-hype-link{
  display:flex !important;
  width:100% !important;
  box-sizing:border-box !important;
  align-items:center !important;
  justify-content:space-between !important;
}

/* Elementor-specific: make sure columns don't force row layout on our widgets */
.elementor-widget .jvgbd-hype-widget{flex-direction:column !important}

/* Hero background variant: ensure full-width cover and overlay stacking */
.jvgbd-hype-hero.jvgbd-hype-hero--bg{
  display:block !important;
  position:relative !important;
  height:64px !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
  border-radius:8px !important;
  overflow:hidden !important;
}
.jvgbd-hype-hero.jvgbd-hype-hero--bg .jvgbd-hype-hero-overlay{
  position:absolute !important;
  inset:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  padding:.6rem .75rem !important;
  background:rgba(0,0,0,0.55) !important;
}
.jvgbd-hype-hero.jvgbd-hype-hero--bg .jvgbd-hype-hero-title{color:#fff}
.jvgbd-hype-hero.jvgbd-hype-hero--bg .jvgbd-hype-hero-count{background:rgba(255,255,255,0.12);color:#fff;padding:.18rem .4rem;border-radius:999px}
.jvgbd-hype-hero.jvgbd-hype-hero--bg:hover .jvgbd-hype-hero-overlay{background:rgba(0,0,0,0.6)}

/* Elementor editor preview specific (stronger specificity) */
.elementor-editor-active .jvgbd-hype-widget,
.elementor-editor .jvgbd-hype-widget{
  display:flex !important;
  flex-direction:column !important;
  gap:.5rem !important;
  width:100% !important;
}
.elementor-editor-active .jvgbd-hype-hero.jvgbd-hype-hero--bg,
.elementor-editor .jvgbd-hype-hero.jvgbd-hype-hero--bg{
  display:block !important;
}

@media (max-width:480px){
  .jvgbd-hype-hero{height:60px}
  .jvgbd-hype-hero-title{font-size:.95rem}
  .jvgbd-hype-hero-count .fa-fire{font-size:13px}
}

/* Responsive enhancements */
@media (max-width:900px){
  .jvgbd-related-posts .jvgbd-related-item{grid-template-columns:80px 1fr}
}
@media (max-width:700px){
  .jvgbd-game-buy .jvgbd-buy-item{grid-template-columns:56px 1fr;grid-template-areas:"logo info" "logo cta"}
  .jvgbd-game-buy .jvgbd-buy-logo{grid-area:logo}
  .jvgbd-game-buy .jvgbd-buy-info{grid-area:info}
  .jvgbd-game-buy .jvgbd-buy-cta{grid-area:cta;justify-self:start;margin-top:.25rem}
  .jvgbd-game-reviews .jvgbd-reviews-avg ul{grid-template-columns:1fr}
  .jvgbd-game-reviews .jvgbd-crit-row{grid-template-columns:1fr 1fr 48px}
  .jvgbd-game-reviews .jvgbd-form-row{grid-template-columns:1fr}
}
@media (max-width:600px){
  .jvgbd-related-posts .jvgbd-related-item{grid-template-columns:72px 1fr}
  .jvgbd-tabs{margin:.75rem 0 1rem}
}
@media (max-width:480px){
  .jvgbd-game-hero .jvgbd-hero-inner{grid-template-columns:1fr}
  .jvgbd-game-hero .jvgbd-hero-cover{justify-self:center}
  .jvgbd-game-hero .jvgbd-hero-aside{align-items:flex-start}
  .jvgbd-tablist{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;gap:.25rem}
  .jvgbd-tab{white-space:nowrap}
}

/* Touch target sizing */
.jvgbd-game-hero .jvgbd-hero-votes .jvgbd-vote{min-height:34px}

.jvgbd-game-reviews .jvgbd-review-avatar img{width:32px;height:32px;border-radius:50%;display:block}

/* Mobile: stack images full-width with title centered underneath for family block */
@media (max-width:700px){
  /* Force single column */
  .jvgbd-family-games-grid .jvgbd-family-grid{grid-template-columns:1fr !important;gap:.5rem !important}

  /* Slight padding around each item */
  .jvgbd-family-games-grid .jvgbd-family-grid-item{padding:.15rem !important}

  /* Card becomes stacked: image full width, title below */
  .jvgbd-family-games-grid .jvgbd-family-grid-item .jvgbd-family-card,
  .jvgbd-family-games-grid .jvgbd-family-grid-item .jvgbd-game-card{
    display:block !important;
    padding:0 !important;
    border-radius:8px !important;
    background:transparent !important;
    overflow:visible !important;
    color:var(--jvgbd-text) !important;
  }

  /* Thumbnail: full width, natural height */
  .jvgbd-family-games-grid .jvgbd-game-thumb{width:100% !important;height:auto !important;border-radius:8px;overflow:hidden;display:block}
  .jvgbd-family-games-grid .jvgbd-game-thumb img{width:100% !important;height:auto !important;object-fit:cover;display:block}

  /* Meta below the image, centered */
  .jvgbd-family-games-grid .jvgbd-game-meta{position:relative !important;display:block !important;text-align:center !important;padding:.6rem .45rem !important;pointer-events:auto}

  /* Title: centered, up to 2 lines */
  .jvgbd-family-games-grid .jvgbd-game-title{display:block !important;-webkit-line-clamp:2 !important;line-clamp:2 !important;overflow:hidden !important;white-space:normal !important;text-overflow:ellipsis !important;margin:0;font-size:1rem;color:var(--jvgbd-text) !important;text-align:center;padding:0}
  .jvgbd-family-games-grid .jvgbd-game-title a{color:inherit;display:inline-block}

  /* Hide desktop overlay on mobile */
  .jvgbd-family-games-grid .jvgbd-game-thumb::after,
  .jvgbd-family-games-grid .jvgbd-game-thumb .jvgbd-overlay-backdrop{display:none !important}

  /* Keep ratings/platforms tidy */
  .jvgbd-family-games-grid .jvgbd-card-user-rating{display:block;max-height:36px;overflow:hidden}
  .jvgbd-family-games-grid .jvgbd-card-platforms{display:none}
}

/* Remove forced square ratio on mobile so items can stack naturally */
@media (max-width:700px){
  .jvgbd-family-grid .jvgbd-family-grid-item{aspect-ratio:auto !important;height:auto !important}
  .jvgbd-family-grid .jvgbd-family-grid-item .jvgbd-family-card,
  .jvgbd-family-grid .jvgbd-family-grid-item .jvgbd-game-card{height:auto !important}
}

/* --------------------------------------------------
   JVGBD: Prevent Elementor widget stacking issues on frontend
   - When NOT in the Elementor editor, ensure widgets don't use extreme z-index values
   - Keep high z-index only inside editor preview (body.elementor-editor-active)
-------------------------------------------------- */
body:not(.elementor-editor-active) .jvgbd-game-card-hype{ z-index: 40 !important; }
body:not(.elementor-editor-active) .jvgbd-hype-hero .jvgbd-hype-hero-overlay{ z-index: 5 !important; }
body:not(.elementor-editor-active) .jvgbd-game-card .jvgbd-pegi-logo{ z-index: 10 !important; }

/* keep lightbox above everything when shown */
.jvgbd-lightbox{ z-index:9999 }

/* Add gentle spacing between plugin widgets when rendered in Elementor columns on frontend
  This prevents two adjacent plugin widgets from visually touching or overlapping. Kept
  scoped to frontend (not editor) to preserve editor preview compactness. */
body:not(.elementor-editor-active) .elementor-widget .jvgbd-hype-widget{ margin-bottom:16px !important; }
/* Slightly increase internal gap so cards within widgets don't butt against each other */
body:not(.elementor-editor-active) .jvgbd-hype-widget .jvgbd-hype-card{ gap: .65rem; padding: .45rem .5rem; }

/* Extra safety: when widgets are placed directly adjacent in the DOM, ensure a visible separator */
body:not(.elementor-editor-active) .jvgbd-hype-widget + .jvgbd-hype-widget{ margin-top:12px !important; }

/* Force Hype button bottom-left inside Elementor widgets to avoid editor/theme conflicts */
/* This rule is intentionally very specific and uses !important to override external styles */
.elementor-widget .jvgbd-game-card .jvgbd-game-card-hype,
.elementor-column .elementor-widget .jvgbd-game-card .jvgbd-game-card-hype,
.elementor-row .elementor-widget .jvgbd-game-card .jvgbd-game-card-hype {
  position: absolute !important;
  left: 8px !important;
  bottom: 8px !important;
  right: auto !important;
  top: auto !important;
  z-index: 1200 !important; /* keep it above typical widget content */
}

/* ===== JVGBD: defensive text visibility rules ===== */
/* Ensure plugin text/icons stay visible even if theme applies aggressive rules */
.jvgbd-el, .jvgbd-single-game, .jvgbd-game-card, .jvgbd-game-hero, .jvgbd-family-card {
  color: var(--jvgbd-text) !important;
  background-color: transparent !important;
}

.jvgbd-el *, .jvgbd-single-game * {
  color: inherit !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.jvgbd-el .jvgbd-game-title, .jvgbd-el .jvgbd-game-details, .jvgbd-el .jvgbd-platform-text, .jvgbd-el .jvgbd-buy-store, .jvgbd-el .jvgbd-buy-price {
  display: block !important;
}

.jvgbd-el .jvgbd-platform-text { visibility: visible !important; opacity: 1 !important; }

.jvgbd-el i[class*='fa'], .jvgbd-el i[class*='bi'] { color: inherit !important; font-size: inherit !important; }

.jvgbd-el .jvgbd-game-title, .jvgbd-el .jvgbd-related-title { text-transform: none !important; letter-spacing: normal !important; }

/* Elementor-specific defensive scope */
.elementor-widget .jvgbd-el, .elementor-widget .jvgbd-el * { color: var(--jvgbd-text) !important; }

/* End defensive rules */

/* ===== JVGBD: dark mode fixes (force readable white text/icons) ===== */
@media (prefers-color-scheme: dark) {
  .jvgbd-el, .jvgbd-single-game, .jvgbd-game-card, .jvgbd-game-hero, .jvgbd-family-card {
    color: #ffffff !important;
  }

  .jvgbd-el *, .jvgbd-single-game * { color: inherit !important; }

  .jvgbd-el i[class*='fa'], .jvgbd-el i[class*='bi'], .jvgbd-el .jvgbd-platform-badge img {
    color: #ffffff !important; fill: #ffffff !important; filter: none !important;
  }
}

/* Common dark-mode classes used by plugins/themes */
.dark .jvgbd-el, .wp-dark-mode .jvgbd-el, .elementor-dark .jvgbd-el, body.jetpack-dark-theme .jvgbd-el {
  color: #ffffff !important;
}
.dark .jvgbd-el *, .wp-dark-mode .jvgbd-el *, .elementor-dark .jvgbd-el * { color: inherit !important; }

/* Ensure links and buttons remain readable */
.jvgbd-el a, .jvgbd-el .jvgbd-button, .jvgbd-el .jvgbd-buy-store { color: var(--jvgbd-text, #111) !important; }

/* End dark mode fixes */

/* ===== JVGBD: tooltip visibility fixes ===== */
/* Bootstrap tooltip */
.jvgbd-el .tooltip .tooltip-inner,
.jvgbd-el .tooltip-inner,
.tooltip.jvgbd-el .tooltip-inner {
  background-color: rgba(0,0,0,0.85) !important;
  color: #fff !important;
  border-radius: 4px !important;
  box-shadow: 0 2px 6px rgba(0,0,0,0.4) !important;
}

/* Tippy.js */
.jvgbd-el .tippy-tooltip .tippy-content,
.jvgbd-el .tippy-content,
.tippy-tooltip.jvgbd-el .tippy-content {
  background-color: rgba(0,0,0,0.9) !important;
  color: #fff !important;
  border-radius: 4px !important;
}

/* Plugin-specific tooltip class */
.jvgbd-el .jvgbd-tooltip, .jvgbd-tooltip {
  background-color: rgba(0,0,0,0.9) !important;
  color: #fff !important;
  border-radius: 4px !important;
  padding: 6px 8px !important;
  box-shadow: 0 2px 6px rgba(0,0,0,0.35) !important;
}

/* Respect dark-mode and common dark classes */
@media (prefers-color-scheme: dark) {
  .jvgbd-el .tooltip-inner, .jvgbd-el .tippy-content, .jvgbd-el .jvgbd-tooltip {
    background-color: rgba(0,0,0,0.95) !important;
    color: #fff !important;
  }
}
.dark .jvgbd-el .tooltip-inner, .wp-dark-mode .jvgbd-el .tooltip-inner, .elementor-dark .jvgbd-el .tooltip-inner {
  background-color: rgba(0,0,0,0.95) !important; color: #fff !important;
}

/* Ensure arrow/marker inherits correct color for Bootstrap/Tippy */
.jvgbd-el .tooltip.show .arrow::before, .jvgbd-el .tippy-box[data-theme]::before {
  background-color: transparent !important;
}

/* End tooltip fixes */

/* ===== JVGBD: Elementor-specific fixes ===== */
/* Cover both editor preview and frontend widget rendering */
.elementor .elementor-widget .jvgbd-el,
.elementor .elementor-widget .jvgbd-el *,
.elementor-widget .jvgbd-el,
.elementor-widget .jvgbd-el * {
  color: var(--jvgbd-text, #ffffff) !important;
  background-color: transparent !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Tooltips / tooltip libraries inside Elementor widgets */
.elementor .elementor-widget .tooltip-inner,
.elementor .elementor-widget .tippy-content,
.elementor .elementor-widget .jvgbd-tooltip {
  background-color: rgba(0,0,0,0.95) !important;
  color: #fff !important;
  border-radius: 4px !important;
}

/* Editor preview (Elementor editor) sometimes uses different wrappers */
.elementor-editor-active .elementor-widget .jvgbd-el,
.elementor-editor-active .elementor-widget .jvgbd-el * {
  color: var(--jvgbd-text, #ffffff) !important;
}

/* Stronger selector for cases where themes target .elementor-widget with color rules */
.elementor .elementor-widget[class*="jvgbd"],
.elementor .elementor-widget[class*="jvgbd"] * {
  /* Prefer plugin text variable; fallback to a dark color to remain visible on light backgrounds */
  color: var(--jvgbd-text, #111) !important;
}

/* Fallback: force links and buttons inside JVGBD Elementor widgets to use the plugin text color
   This is a high-specificity rule to defeat aggressive theme rules that still win. */
.elementor .elementor-widget[class*="jvgbd"] a,
.elementor .elementor-widget[class*="jvgbd"] a *,
.elementor .elementor-widget[class*="jvgbd"] button,
.elementor .elementor-widget[class*="jvgbd"] button * {
  color: var(--jvgbd-text, #111) !important;
}

/* End Elementor-specific fixes */

/* ===== JVGBD: plugin-scoped theme system ===== */
/* The head script sets data-jvgbd-theme="dark" or "light" on <html>.
   Use that attribute to scope plugin theme colors so the plugin looks consistent
   regardless of the active WordPress theme. */

:root[data-jvgbd-theme='light'] {
  --jvgbd-bg: #ffffff;
  --jvgbd-text: #222222;
  --jvgbd-muted: #666666;
  --jvgbd-accent: #0073aa;
}

:root[data-jvgbd-theme='dark'] {
  --jvgbd-bg: #0f1113;
  --jvgbd-text: #ffffff;
  --jvgbd-muted: #bfc5ca;
  --jvgbd-accent: #2ea3ff;
}

/* Apply the variables to plugin scopes */
.jvgbd-el, .jvgbd-single-game, .jvgbd-game-card, .jvgbd-related-posts {
  background-color: var(--jvgbd-bg) !important;
  color: var(--jvgbd-text) !important;
}

.jvgbd-el a, .jvgbd-el .jvgbd-button { color: var(--jvgbd-accent) !important; }
.jvgbd-el .jvgbd-muted { color: var(--jvgbd-muted) !important; }

/* Tooltips use plugin variables when possible */
.jvgbd-el .tooltip-inner, .jvgbd-el .tippy-content, .jvgbd-el .jvgbd-tooltip {
  background-color: rgba(0,0,0,0.85) !important;
  color: #fff !important;
}

/* End plugin-scoped theme system */

/* ===== JVGBD: override Elementor global color variables inside plugin scope ===== */
/* Some themes/Elementor global settings can change colors via CSS variables (e.g. --e-global-color-primary).
   Force these variables within JVGBD widget/hero scope so Elementor widgets render plugin content correctly. */
.elementor .jvgbd-el,
.elementor-widget .jvgbd-el,
.jvgbd-el {
  --e-global-color-primary: var(--jvgbd-text) !important;
  --e-global-color-secondary: var(--jvgbd-muted) !important;
  --e-global-color-accent: var(--jvgbd-accent) !important;
  --e-global-typography-primary: var(--jvgbd-text) !important;
  --e-global-typography-secondary: var(--jvgbd-muted) !important;
}

/* Also ensure headings inside Elementor widgets that may use the global vars inherit our values */
.elementor .jvgbd-el h1, .elementor .jvgbd-el h2, .elementor .jvgbd-el h3, .elementor .jvgbd-el .elementor-heading-title {
  color: var(--jvgbd-text) !important;
}

/* Force link and button accent color inside Elementor widgets to plugin accent variable */
.elementor .jvgbd-el a, .elementor .jvgbd-el button, .elementor .jvgbd-el .jvgbd-button { color: var(--jvgbd-accent) !important; }

/* End Elementor variable overrides */

/* ===== JVGBD: Game card text and tooltip fallback ===== */
/* Ensure game cards are always readable */
.jvgbd-game-card, .jvgbd-game-card * {
  color: var(--jvgbd-text) !important;
}

/* CSS-only tooltip fallback for elements with title/data-title/abbr inside plugin */
.jvgbd-el [data-title], .jvgbd-el [title], .jvgbd-el abbr[title] {
  position: relative;
  cursor: help;
}
.jvgbd-el [data-title]:hover::after, .jvgbd-el [title]:hover::after, .jvgbd-el abbr[title]:hover::after {
  content: attr(data-title) attr(title);
  white-space: pre-wrap;
  position: absolute;
  left: 50%; transform: translateX(-50%);
  bottom: calc(100% + 8px);
  background: rgba(0,0,0,0.85);
  color: #fff;
  padding: 6px 8px;
  border-radius: 4px;
  font-size: 13px;
  z-index: 1600;
  max-width: 220px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.35);
}
.jvgbd-el [data-title]:hover::before, .jvgbd-el [title]:hover::before, .jvgbd-el abbr[title]:hover::before {
  content: '';
  position: absolute;
  left: 50%; transform: translateX(-50%);
  bottom: calc(100% + 2px);
  width: 8px; height: 8px; background: rgba(0,0,0,0.85);
  transform-origin: center; transform: translateX(-50%) rotate(45deg);
  z-index: 1599;
}

/* Small screens: place tooltip above center with full width */
@media (max-width: 480px) {
  .jvgbd-el [data-title]:hover::after, .jvgbd-el [title]:hover::after { left: 8px; transform: none; right: 8px; bottom: calc(100% + 8px); }
}

/* End gamecard & tooltip fallback */

/* ===== JVGBD: Hero-specific fixes ===== */
/* Strong selectors to override theme rules that make hero text black */
.jvgbd-single-game .jvgbd-game-hero,
.jvgbd-single-game .jvgbd-hero,
.jvgbd-game-hero,
.jvgbd-hero {
  color: var(--jvgbd-text) !important;
  background-color: var(--jvgbd-bg) !important;
}
.jvgbd-single-game .jvgbd-game-hero h1,
.jvgbd-single-game .jvgbd-game-hero h2,
.jvgbd-game-hero .jvgbd-game-title,
.jvgbd-game-hero .jvgbd-hero-meta,
.jvgbd-game-hero .jvgbd-hero-votes,
.jvgbd-game-hero .jvgbd-buy-store,
.jvgbd-game-hero .jvgbd-platform-text,
.jvgbd-game-hero .jvgbd-game-subtitle {
  color: var(--jvgbd-text) !important;
}

/* Ensure buttons/links inside hero are also readable */
.jvgbd-game-hero a, .jvgbd-game-hero .jvgbd-button, .jvgbd-game-hero .jvgbd-buy-store {
  color: var(--jvgbd-accent) !important;
}

/* Tooltip fallback specifically inside the hero (stronger specificity) */
.jvgbd-game-hero [data-title], .jvgbd-game-hero [title], .jvgbd-game-hero abbr[title] {
  position: relative;
  cursor: help;
}
.jvgbd-game-hero [data-title]:hover::after, .jvgbd-game-hero [title]:hover::after, .jvgbd-game-hero abbr[title]:hover::after {
  content: attr(data-title) attr(title);
  white-space: pre-wrap;
  position: absolute;
  left: 50%; transform: translateX(-50%);
  bottom: calc(100% + 8px);
  background: rgba(0,0,0,0.95);
  color: #fff;
  padding: 8px 10px;
  border-radius: 6px;
  font-size: 14px;
  z-index: 99999;
  max-width: 260px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.45);
}
.jvgbd-game-hero [data-title]:hover::before, .jvgbd-game-hero [title]:hover::before, .jvgbd-game-hero abbr[title]:hover::before {
  content: '';
  position: absolute;
  left: 50%; transform: translateX(-50%) rotate(45deg);
  bottom: calc(100% + 2px);
  width: 9px; height: 9px;
  background: rgba(0,0,0,0.95);
  z-index: 99998;
}

/* End hero-specific fixes */