.dubplates-carousel{
  --dc-bg0:#03060f;
  --dc-bg1:#071428;
  --dc-card:#0b1834;
  --dc-fg:#f4f8ff;
  --dc-muted:#9eb6d9;
  --dc-blue-top:#9ae0ff;
  --dc-blue-mid:#2f8cff;
  --dc-blue-deep:#0a4fd6;
  --dc-cyan:#5ee7ff;
  --dc-pink:#ff0066;
  --dc-pink-hover:#cc0052;
  --dc-glow:rgba(94,231,255,.35);
  position:relative;
  isolation:isolate;
  overflow:hidden;
  margin:.35rem .75rem 1.25rem;
  padding:.9rem 0 1.1rem;
  color:var(--dc-fg);
  border:1px solid rgba(94,231,255,.35);
  border-radius:16px;
  /* Electric blue atmosphere — no outer glow, less white */
  background:
    radial-gradient(55% 90% at 18% 110%, rgba(10,79,214,.38), transparent 70%),
    radial-gradient(55% 90% at 82% 110%, rgba(47,140,255,.34), transparent 70%),
    radial-gradient(80% 55% at 50% -5%, rgba(94,231,255,.22), transparent 58%),
    radial-gradient(40% 50% at 50% 40%, rgba(47,140,255,.16), transparent 70%),
    linear-gradient(180deg, #0c1c3a 0%, var(--dc-bg1) 42%, var(--dc-bg0) 100%);
}
/* Soft static beams only — no sweeping shimmer */
.dubplates-carousel::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  opacity:.75;
  background:
    linear-gradient(180deg, rgba(158,224,255,.2) 0%, rgba(47,140,255,.08) 35%, transparent 72%) 18% 0 / 10% 100% no-repeat,
    linear-gradient(180deg, rgba(94,231,255,.26) 0%, rgba(47,140,255,.1) 40%, transparent 75%) 50% 0 / 14% 100% no-repeat,
    linear-gradient(180deg, rgba(158,224,255,.18) 0%, rgba(10,79,214,.08) 38%, transparent 72%) 82% 0 / 10% 100% no-repeat;
  filter:blur(10px);
}
.dubplates-carousel::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:42%;
  z-index:0;
  pointer-events:none;
  background:linear-gradient(180deg, transparent 0%, rgba(3,6,15,.5) 100%);
}
.dubplates-carousel__bar,
.dubplates-carousel__scroller,
.dubplates-carousel #dubplates-carousel-audio{
  position:relative;
  z-index:1;
}
.dubplates-carousel__bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
  max-width:66.5em;
  margin:0 auto .55rem;
  padding:0 1.25rem;
  box-sizing:border-box;
}
.dubplates-carousel__title{
  margin:0;
  font-size:1.05rem;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#e8f4ff;
  text-shadow:0 1px 2px rgba(0,0,0,.55);
}
.dubplates-carousel__next{
  appearance:none;
  -webkit-appearance:none;
  margin:0;
  border:1px solid rgba(94,231,255,.45);
  border-radius:6px;
  padding:.38rem .75rem;
  font-size:.75rem;
  font-weight:800;
  letter-spacing:.03em;
  line-height:1;
  white-space:nowrap;
  cursor:pointer;
  color:#fff;
  background:linear-gradient(180deg, #3aa0ff 0%, var(--dc-blue-mid) 45%, var(--dc-blue-deep) 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25);
  text-shadow:0 1px 1px rgba(0,0,0,.35);
  transition:transform .15s ease, box-shadow .2s ease, background .2s ease;
}
.dubplates-carousel__next:hover{
  background:linear-gradient(180deg, #5eb4ff 0%, #3a96ff 45%, #0a4fd6 100%);
  transform:translateY(-1px);
}
.dubplates-carousel__next:active{
  transform:translateY(0);
}
.dubplates-carousel__card.is-bundle{
  border-color:rgba(255,0,102,.55);
  box-shadow:
    0 0 0 1px rgba(0,0,0,.25),
    0 8px 18px rgba(0,0,0,.3),
    0 0 20px rgba(255,0,102,.22);
}
.dubplates-carousel__play.is-disabled{
  opacity:.35;
  pointer-events:none;
  cursor:default;
}
.dubplates-carousel__scroller{
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  scroll-snap-type:x mandatory;
  scrollbar-width:thin;
  scrollbar-color:rgba(94,231,255,.4) transparent;
}
.dubplates-carousel__scroller:focus{outline:2px solid var(--dc-cyan); outline-offset:-2px;}
.dubplates-carousel__track{
  display:flex;
  gap:.75rem;
  padding:0 1.25rem .15rem;
  width:max-content;
  max-width:none;
}
.dubplates-carousel__card{
  flex:0 0 9.5rem;
  scroll-snap-align:start;
  display:flex;
  flex-direction:column;
  background:
    linear-gradient(180deg, rgba(94,231,255,.1) 0%, transparent 28%),
    linear-gradient(180deg, rgba(20,45,90,.96) 0%, var(--dc-card) 100%);
  border:1px solid rgba(94,231,255,.3);
  border-radius:10px;
  padding:.55rem;
  box-sizing:border-box;
  box-shadow:
    0 0 0 1px rgba(0,0,0,.25),
    0 8px 18px rgba(0,0,0,.3);
}
.dubplates-carousel__art{
  display:block;
  border-radius:7px;
  overflow:hidden;
  aspect-ratio:1;
  background:#000;
  box-shadow:0 0 12px rgba(94,231,255,.18);
}
.dubplates-carousel__art img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:0;
}
.dubplates-carousel__name{
  margin:.45rem 0 .15rem;
  font-size:.78rem;
  line-height:1.25;
  font-weight:700;
  height:calc(1.25em * 2);
  min-height:calc(1.25em * 2);
  max-height:calc(1.25em * 2);
  overflow:hidden;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  line-clamp:2;
}
.dubplates-carousel__name a{
  color:var(--dc-fg);
  text-decoration:none;
}
.dubplates-carousel__name a:hover{color:#fff; text-decoration:underline;}
.dubplates-carousel__price{
  font-size:.72rem;
  color:var(--dc-muted);
  margin-bottom:.45rem;
}
.dubplates-carousel__actions{
  display:flex;
  gap:.35rem;
  margin-top:auto;
  width:100%;
}
.dubplates-carousel__play,
.dubplates-carousel__cart,
.dubplates-carousel a.button.dubplates-carousel__cart{
  flex:1 1 0% !important;
  width:auto !important;
  max-width:none !important;
  min-width:0 !important;
  min-height:2.05rem;
  border:0 !important;
  border-radius:6px !important;
  font-size:.7rem !important;
  font-weight:700 !important;
  cursor:pointer;
  text-align:center;
  text-decoration:none !important;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  line-height:1;
  padding:.4rem .3rem !important;
  box-sizing:border-box !important;
  transition:background .2s ease, box-shadow .2s ease, transform .15s ease;
}
/* Electric blue play — readable, not blown-out white */
.dubplates-carousel__play{
  color:#fff;
  background:linear-gradient(180deg, #7fd0ff 0%, var(--dc-blue-mid) 55%, var(--dc-blue-deep) 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28);
}
.dubplates-carousel__play:hover{
  background:linear-gradient(180deg, #9ae0ff 0%, #3a96ff 55%, #0a4fd6 100%);
}
.dubplates-carousel__play.is-playing{
  background:linear-gradient(180deg, #a8e8ff 0%, #5eb4ff 45%, #1a6fff 100%);
}
/* Match existing Buy Now pink */
.dubplates-carousel__cart{
  background:var(--dc-pink) !important;
  color:#fff !important;
  border-color:var(--dc-pink) !important;
  box-shadow:0 0 10px rgba(255,0,102,.35);
}
.dubplates-carousel__cart:hover{
  background:var(--dc-pink-hover) !important;
}
.dubplates-carousel__cart.added,
.dubplates-carousel__cart.is-in-cart{
  background:#1f7a3f !important;
  box-shadow:0 0 10px rgba(31,122,63,.4);
}
.dubplates-carousel__cart.is-in-cart:hover{
  background:#186334 !important;
}
.dubplates-carousel__cart.loading{
  opacity:.65;
  pointer-events:none;
}
@media (max-width:767px){
  /* Match full-bleed banner width in portrait / narrow phones */
  .dubplates-carousel{
    width:100vw;
    max-width:100vw;
    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);
    margin-top:.2rem;
    margin-bottom:.55rem;
    border-radius:0;
    border-left:0;
    border-right:0;
    box-sizing:border-box;
  }
}
@media (min-width:768px){
  .dubplates-carousel{
    margin-left:1.25rem;
    margin-right:1.25rem;
    border-radius:20px;
  }
  .dubplates-carousel__card{flex-basis:10.5rem;}
  .dubplates-carousel__title{font-size:1.2rem;}
  .dubplates-carousel__bar,
  .dubplates-carousel__track{padding-left:2.2rem; padding-right:2.2rem;}
}

/* Never show WooCommerce "View cart" inside the carousel — page already has cart icons */
.dubplates-carousel .added_to_cart,
.dubplates-carousel a.wc-forward{
  display:none !important;
}
