/* Shared styles for Adopt Me Value List category pages */
.vl-toolbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
  margin-bottom:22px;
}
.vl-search-wrap{
  position:relative;
  flex:1;
  min-width:220px;
  max-width:380px;
}
.vl-search-wrap input{
  width:100%;
  padding:11px 44px 11px 18px;
  border-radius:30px;
  border:1.5px solid var(--glass-border, rgba(255,255,255,.65));
  background:rgba(255,255,255,.7);
  font-size:1rem;
  color:var(--text-strong, #241f38);
  outline:none;
  box-sizing:border-box;
  font-family:inherit;
}
.vl-search-wrap input:focus{ border-color:var(--accent, #7c3aed); }
.vl-search-icon{
  position:absolute;
  right:16px;
  top:50%;
  transform:translateY(-50%);
  color:var(--accent, #7c3aed);
  font-size:1.2rem;
  pointer-events:none;
}
.vl-count{
  font-size:.9rem;
  color:var(--muted, #8f89ab);
  font-weight:600;
  white-space:nowrap;
}
.vl-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(160px, 1fr));
  gap:16px;
}
.vl-card{
  background:var(--glass, rgba(255,255,255,.55));
  backdrop-filter:blur(16px) saturate(180%);
  -webkit-backdrop-filter:blur(16px) saturate(180%);
  border:1px solid var(--glass-border, rgba(255,255,255,.65));
  border-radius:20px;
  padding:16px 14px 14px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  transition:transform .15s, box-shadow .15s;
}
.vl-card:hover{
  transform:translateY(-3px);
  box-shadow:var(--glow, 0 20px 50px rgba(124,58,237,.16));
}
.vl-card-img{
  position:relative;
  width:84px;
  height:84px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.vl-card-img img{
  width:100%;
  height:100%;
  object-fit:contain;
}
.vl-card-name{
  font-size:.9rem;
  font-weight:700;
  color:var(--text-strong, #241f38);
  text-align:center;
  line-height:1.3;
  min-height:2.3em;
}
.vl-card-value{
  font-size:1.05rem;
  font-weight:800;
  background:var(--accent-grad, linear-gradient(95deg, #7c3aed, #06b6d4, #f472b6));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.vl-card-value-label{
  font-size:.7rem;
  font-weight:600;
  color:var(--muted, #8f89ab);
  text-transform:uppercase;
  letter-spacing:.05em;
  margin-top:-6px;
}
.vl-variants{
  display:flex;
  gap:6px;
  margin-top:2px;
}
.vl-variant-btn{
  width:26px;
  height:26px;
  border-radius:8px;
  border:1.5px solid var(--glass-border, rgba(255,255,255,.65));
  background:rgba(255,255,255,.6);
  font-size:.72rem;
  font-weight:800;
  cursor:pointer;
  color:var(--text, #5b5773);
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:inherit;
  transition:transform .1s;
}
.vl-variant-btn:hover{ transform:translateY(-1px); }
.vl-variant-btn[data-variant="fly"].active{ background:#06b6d4; color:#fff; border-color:#06b6d4; }
.vl-variant-btn[data-variant="ride"].active{ background:#f472b6; color:#fff; border-color:#f472b6; }
.vl-variant-btn[data-variant="neon"].active{ background:#22c55e; color:#fff; border-color:#22c55e; }
.vl-variant-btn[data-variant="mega"].active{ background:#7c3aed; color:#fff; border-color:#7c3aed; }
.vl-empty{
  grid-column:1/-1;
  text-align:center;
  padding:40px 20px;
  color:var(--muted, #8f89ab);
}
.vl-more-wrap{
  text-align:center;
  margin-top:30px;
}
.vl-more-btn{
  padding:12px 40px;
  border-radius:28px;
  border:none;
  background:var(--accent-grad, linear-gradient(95deg, #7c3aed, #06b6d4, #f472b6));
  color:#fff;
  font-size:.95rem;
  font-weight:700;
  cursor:pointer;
  font-family:inherit;
  box-shadow:0 8px 22px rgba(124,58,237,.32);
  transition:transform .15s, box-shadow .15s;
}
.vl-more-btn:hover{ transform:translateY(-2px); box-shadow:0 12px 28px rgba(124,58,237,.42); }
.vl-crumb{
  font-size:.9rem;
  margin-bottom:16px;
  color:var(--muted, #8f89ab);
}
.vl-crumb a{ color:var(--accent, #7c3aed); font-weight:700; text-decoration:none; }
.vl-crumb a:hover{ text-decoration:underline; }
.vl-other-cats{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(150px, 1fr));
  gap:10px;
  margin-top:14px;
}
.vl-other-cat{
  background:var(--glass, rgba(255,255,255,.55));
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  border:1px solid var(--glass-border, rgba(255,255,255,.65));
  border-radius:14px;
  padding:12px;
  text-align:center;
  text-decoration:none;
  color:var(--text-strong, #241f38);
  font-weight:700;
  font-size:.85rem;
  transition:transform .15s, box-shadow .15s;
}
.vl-other-cat:hover{ transform:translateY(-2px); box-shadow:var(--glow-sm, 0 10px 26px rgba(124,58,237,.14)); }
.vl-other-cat .em{ display:block; font-size:1.4rem; margin-bottom:4px; }
@media (max-width:480px){
  .vl-grid{ grid-template-columns:repeat(auto-fill, minmax(130px, 1fr)); gap:10px; }
  .vl-card-img{ width:64px; height:64px; }
}