/* ========== Arcade category chips ========== */
:root{
  --am-pink:#FF3AAE;
  --am-teal:#2ED2CC;
  --am-ink:#1b1b1b;
  --am-chip-bg:#0d3e9c;           /* deep blue bar like the app */
  --am-chip-pill:#1e90ff;          /* pill background */
}

.am-catbar{
  margin: 10px 0 22px;
  padding: 16px 14px;
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(46,210,204,.14), transparent 60%),
    var(--am-chip-bg);
  box-shadow: 0 10px 24px rgba(13,34,58,.12);
  overflow: hidden;
}

.am-catbar h3{
  margin: 0 0 10px;
  font-family: "RetroSide", system-ui, sans-serif;
  font-weight: 900;
  letter-spacing: .4px;
  color:#fff;
  text-shadow: 0 2px 0 rgba(0,0,0,.18);
  font-size: 20px;
}

.am-swiper{
  display:flex; gap:10px; align-items:center;
}
.am-track{ display:flex; gap:10px; overflow:auto; scroll-behavior:smooth; }
.am-track::-webkit-scrollbar{ height:8px }
.am-track::-webkit-scrollbar-thumb{ background:rgba(255,255,255,.25); border-radius:8px }

.am-chip{
  display:inline-flex; align-items:center; gap:10px;
  white-space:nowrap;
  padding:10px 14px;
  background:#fff;
  border-radius:999px;
  box-shadow: 0 6px 0 rgba(0,0,0,.12);
  color:var(--am-ink);
  text-decoration:none;
  font-weight:800;
  transition: transform .06s ease, box-shadow .2s ease, background .2s ease;
}
.am-chip:hover{ transform: translateY(-1px); box-shadow:0 7px 0 rgba(0,0,0,.14) }
.am-chip:active{ transform: translateY(0); box-shadow:0 4px 0 rgba(0,0,0,.10) }

.am-chip img{
  width:36px; height:36px; object-fit:contain; background:#fff; border-radius:10px;
}

.am-nav{
  display:flex; gap:8px; margin-left:8px;
}
.am-nav button{
  width:34px; height:34px; border-radius:10px; border:0;
  background:#fff; color:#333; font-weight:900; cursor:pointer;
  box-shadow:0 5px 0 rgba(0,0,0,.12);
}
.am-nav button:disabled{ opacity:.4; cursor:default }
@media (max-width: 575px){
  .am-catbar{ padding:12px }
  .am-chip{ padding:9px 12px }
  .am-chip img{ width:30px; height:30px }
}


/* Hide ALL hero/slider arrows on mobile */
@media (max-width: 991.98px), (pointer: coarse) {
  /* Our custom hero */
  #am-hero .am-nav {
    display: none !important;
    pointer-events: none !important; /* kill the hitbox just in case */
  }

  /* Presta ps_imageslider arrows */
  #carousel .left.carousel-control,
  #carousel .right.carousel-control,
  #carousel .carousel-control {
    display: none !important;
    pointer-events: none !important;
  }
}
