/* ==========================================================================
   J-GAMES custom stylesheet (Material theme, OJS 3.4)
   Upload at: Settings > Website > Appearance > Advanced > Journal style sheet
   Adds the J-GAMES icon to the right half of the homepage banner (desktop only).
   ========================================================================== */

/* The banner is the dark box that holds the theme's gradient image. */
@media (min-width: 1024px) {
  .pkp_page_index div.relative.overflow-hidden:has(img[data-nimg]) {
    position: relative;
  }
  .pkp_page_index div.relative.overflow-hidden:has(img[data-nimg])::after {
    content: "";
    position: absolute;
    top: 50%;
    right: max(5vw, calc((100vw - 80rem) / 2 + 3rem));
    width: clamp(220px, 22vw, 320px);
    aspect-ratio: 1 / 1;
    transform: translateY(-50%);
    background:
      url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 200 200%22%3E%3Cpath d=%22M44 74 C18 104 22 150 58 172 C88 190 132 188 160 168 C128 182 92 180 68 164 C40 145 32 108 44 74 Z%22 fill=%22%23F5921E%22/%3E %3Cpath d=%22M50 166 C82 194 136 196 170 160 C160 172 130 196 92 192 C74 190 60 182 50 166 Z%22 fill=%22%231E88E5%22/%3E %3Crect x=%2262%22 y=%2276.2%22 width=%2213%22 height=%2210%22 rx=%221.5%22 fill=%22%23E53935%22/%3E %3Crect x=%2282%22 y=%2258.2%22 width=%2213%22 height=%2222%22 rx=%221.5%22 fill=%22%23F5921E%22/%3E %3Crect x=%22102%22 y=%2235.8%22 width=%2213%22 height=%2236%22 rx=%221.5%22 fill=%22%237CB342%22/%3E %3Crect x=%22122%22 y=%226.7%22 width=%2213%22 height=%2254%22 rx=%221.5%22 fill=%22%231E88E5%22/%3E %3Cpath d=%22M46 92 Q100 88 152 48%22 fill=%22none%22 stroke=%22%231E88E5%22 stroke-width=%227%22 stroke-linecap=%22round%22/%3E %3Cpath d=%22M160.7 40.3 L150.2 62.5 L136.6 45.2 Z%22 fill=%22%231E88E5%22 stroke=%22%231E88E5%22 stroke-width=%222%22 stroke-linejoin=%22round%22/%3E %3Cpath d=%22M66 100 L134 100 C150 100 158 108 161 122 L167 150 C170 166 152 172 141 160 L130 148 L70 148 L59 160 C48 172 30 166 33 150 L39 122 C42 108 50 100 66 100 Z%22 fill=%22%231B2436%22 stroke=%22%23E8ECF4%22 stroke-width=%227%22 stroke-linejoin=%22round%22/%3E %3Cpath d=%22M62 115 h8 v8 h8 v8 h-8 v8 h-8 v-8 h-8 v-8 h8 Z%22 fill=%22%23E8ECF4%22 transform=%22translate%28-3 -2%29%22 /%3E %3Ccircle cx=%22133%22 cy=%22116%22 r=%224.6%22 fill=%22%23F5921E%22/%3E %3Ccircle cx=%22142%22 cy=%22125%22 r=%224.6%22 fill=%22%23F5921E%22/%3E %3Ccircle cx=%22133%22 cy=%22134%22 r=%224.6%22 fill=%22%23F5921E%22/%3E %3Ccircle cx=%22124%22 cy=%22125%22 r=%224.6%22 fill=%22%23F5921E%22/%3E%3C/svg%3E") center / 82% no-repeat,
      radial-gradient(circle, rgba(46, 111, 158, 0.30) 0%, rgba(91, 63, 160, 0.18) 40%, transparent 70%);
    pointer-events: none;
  }
}