/* BankMovie V42 — Uiverse-inspired premium controls, adapted safely to existing BankMovie logic. */

/* ===== Sound / mute switch ===== */
.bm-sound-toggle{
  position:relative!important;
  width:44px!important;
  min-width:44px!important;
  height:44px!important;
  padding:0!important;
  border:1px solid rgba(255,255,255,.16)!important;
  border-radius:50%!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  cursor:pointer!important;
  color:#fff!important;
  background:linear-gradient(145deg,#34c96f,#17974d)!important;
  box-shadow:0 9px 22px rgba(24,181,91,.22),inset 0 1px 0 rgba(255,255,255,.24)!important;
  transition:transform .22s ease,box-shadow .28s ease,border-color .28s ease,background .28s ease!important;
}
.bm-sound-toggle:hover{
  transform:translateY(-1px) scale(1.04)!important;
  background:linear-gradient(145deg,#343a46,#232731)!important;
  box-shadow:0 11px 26px rgba(0,0,0,.34),0 0 18px rgba(var(--accent-rgb,47,124,255),.12)!important;
}
.bm-sound-toggle:active{transform:scale(.86)!important}
.bm-sound-toggle .bm-sound-speaker,
.bm-sound-toggle .bm-sound-muted{
  position:absolute!important;
  inset:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  transition:opacity .26s ease,transform .28s cubic-bezier(.2,.8,.2,1)!important;
  pointer-events:none!important;
}
.bm-sound-toggle .bm-sound-speaker{opacity:1!important;transform:scale(1)!important;z-index:2!important}
.bm-sound-toggle .bm-sound-muted{opacity:0!important;transform:scale(.76) rotate(-8deg)!important;z-index:3!important}
.bm-sound-toggle .bm-sound-speaker svg,
.bm-sound-toggle .bm-sound-muted svg{width:19px!important;height:19px!important;overflow:visible!important}
.bm-sound-toggle .bm-sound-speaker path:not(.bm-sound-waves),
.bm-sound-toggle .bm-sound-muted path:not(.bm-sound-x){fill:#fff!important;stroke:#fff!important;stroke-width:4.5!important;stroke-linejoin:round!important}
.bm-sound-toggle .bm-sound-waves,
.bm-sound-toggle .bm-sound-x{fill:none!important;stroke:#fff!important;stroke-width:5!important;stroke-linecap:round!important}
.bm-sound-toggle.is-muted{
  background:linear-gradient(145deg,#ff5b67,#d72f43)!important;
  border-color:rgba(255,127,137,.45)!important;
  box-shadow:0 9px 22px rgba(239,68,68,.24),inset 0 1px 0 rgba(255,255,255,.22)!important;
}
.bm-sound-toggle.is-muted .bm-sound-speaker{opacity:0!important;transform:scale(.72) rotate(8deg)!important}
.bm-sound-toggle.is-muted .bm-sound-muted{opacity:1!important;transform:scale(1) rotate(0)!important}
.volume-control:has(.bm-sound-toggle){padding-inline:4px 9px!important}
@media(max-width:640px){
  .bm-sound-toggle{width:40px!important;min-width:40px!important;height:40px!important}
  .bm-sound-toggle .bm-sound-speaker svg,.bm-sound-toggle .bm-sound-muted svg{width:17px!important;height:17px!important}
}

/* ===== Uiverse-inspired comment rating ===== */
.star-rating-input{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  flex-wrap:wrap!important;
}
.star-rating-input>span{
  font-weight:850!important;
  color:rgba(255,255,255,.78)!important;
}
#starRating.star-rating{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:9px!important;
  direction:ltr!important;
  padding:8px 10px!important;
  min-height:48px!important;
  border-radius:18px!important;
  background:rgba(255,255,255,.035)!important;
  border:1px solid rgba(255,255,255,.08)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035)!important;
}
#starRating .star-input{
  width:30px!important;
  height:30px!important;
  color:#686d78!important;
  stroke:currentColor!important;
  stroke-width:1.45!important;
  cursor:pointer!important;
  overflow:visible!important;
  transform-origin:center!important;
  transition:transform .25s ease,color .25s ease,filter .25s ease!important;
}
#starRating .star-input:hover{
  color:#ff9e0b!important;
  transform:scale(1.20) rotate(-4deg)!important;
  filter:drop-shadow(0 0 13px rgba(255,158,11,.86))!important;
  animation:bmStarShimmer .85s ease infinite alternate!important;
}
#starRating .star-input[fill="currentColor"]{
  color:#ff9e0b!important;
  filter:drop-shadow(0 0 11px rgba(255,158,11,.72))!important;
  animation:bmStarPulse .72s ease infinite alternate!important;
}
@keyframes bmStarPulse{from{transform:scale(1)}to{transform:scale(1.09)}}
@keyframes bmStarShimmer{from{filter:drop-shadow(0 0 8px rgba(255,158,11,.48))}to{filter:drop-shadow(0 0 17px rgba(255,158,11,1))}}
@media(max-width:520px){
  .star-rating-input{gap:8px!important}
  #starRating.star-rating{gap:7px!important;padding:7px 9px!important}
  #starRating .star-input{width:27px!important;height:27px!important}
}

/* ===== Bookmark / watchlist button — same UI for archive 1/2/3/4 ===== */
.bm-bookmark-btn{
  --bm-bookmark-grad-a:color-mix(in srgb,var(--accent,#8b5cf6) 72%,#ff88ff);
  --bm-bookmark-grad-b:color-mix(in srgb,var(--accent,#8b5cf6) 82%,#6f46ff);
  width:124px!important;
  min-width:124px!important;
  height:42px!important;
  padding:0 6px!important;
  border-radius:999px!important;
  border:1px solid rgba(255,255,255,.14)!important;
  background:rgba(10,11,15,.88)!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:4px!important;
  cursor:pointer!important;
  overflow:hidden!important;
  color:#fff!important;
  box-shadow:0 8px 20px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,255,255,.05)!important;
  transition:transform .24s ease,border-color .3s ease,box-shadow .3s ease!important;
}
.bm-bookmark-btn .bm-bookmark-icon{
  width:31px!important;
  height:31px!important;
  flex:0 0 31px!important;
  border-radius:999px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  color:#fff!important;
  background:linear-gradient(180deg,var(--bm-bookmark-grad-a),var(--bm-bookmark-grad-b))!important;
  box-shadow:0 7px 17px rgba(var(--accent-rgb,139,92,246),.24)!important;
  transition:width .32s ease,flex-basis .32s ease,transform .32s ease!important;
  z-index:2!important;
}
.bm-bookmark-btn .bm-bookmark-icon svg{width:14px!important;height:18px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.6!important;transition:transform .28s ease!important}
.bm-bookmark-btn .bm-bookmark-icon path{fill:none!important;stroke:currentColor!important}
.bm-bookmark-btn.active .bm-bookmark-icon svg,
.bm-bookmark-btn.active .bm-bookmark-icon path{fill:currentColor!important}
.bm-bookmark-btn .bm-bookmark-text{
  width:77px!important;
  min-width:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  color:#fff!important;
  font-size:11px!important;
  font-weight:900!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  transition:width .30s ease,opacity .24s ease,transform .30s ease!important;
  z-index:1!important;
}
.bm-bookmark-btn .bm-bookmark-text::before{content:attr(data-add-label)}
.bm-bookmark-btn.active .bm-bookmark-text::before{content:attr(data-active-label)}
.bm-bookmark-btn:hover .bm-bookmark-icon{width:108px!important;flex-basis:108px!important;transform:translateX(2px)!important}
.bm-bookmark-btn:hover .bm-bookmark-icon svg{transform:scale(1.08)!important}
.bm-bookmark-btn:hover .bm-bookmark-text{width:0!important;opacity:0!important;transform:translateX(10px)!important}
.bm-bookmark-btn:active{transform:scale(.95)!important}
.bm-bookmark-btn.active{border-color:rgba(var(--accent-rgb,139,92,246),.34)!important;box-shadow:0 9px 22px rgba(0,0,0,.24),0 0 20px rgba(var(--accent-rgb,139,92,246),.12)!important}
@media(max-width:520px){
  .bm-bookmark-btn{width:116px!important;min-width:116px!important;height:40px!important}
  .bm-bookmark-btn .bm-bookmark-icon{width:29px!important;height:29px!important;flex-basis:29px!important}
  .bm-bookmark-btn .bm-bookmark-text{font-size:10.5px!important;width:72px!important}
  .bm-bookmark-btn:hover .bm-bookmark-icon{width:102px!important;flex-basis:102px!important}
}
