/* PATCH_ID: b2c_home_all_artists_expand_fix_20260709 */

/* Keep current button visual style, only make it a real toggle button. */
.b2c-home-native-cms .b2c-artist-expand-toggle{
  appearance:none;
  -webkit-appearance:none;
  cursor:pointer;
  font:inherit;
  line-height:1;
  white-space:nowrap;
  transition:
    transform .22s cubic-bezier(.2,.8,.2,1),
    box-shadow .22s ease,
    border-color .22s ease,
    background .22s ease;
}

.b2c-home-native-cms .b2c-artist-expand-toggle:hover{
  transform:translateY(-2px);
}

.b2c-home-native-cms .b2c-artist-expand-toggle:active{
  transform:translateY(0) scale(.98);
}

.b2c-home-native-cms .b2c-artist-expand-toggle[data-expanded="1"]{
  background:#1f1f26;
  color:#fff;
  border-color:rgba(31,31,38,.18);
  box-shadow:0 14px 30px rgba(31,31,38,.16);
}

/* Extra artist cards exist in DOM but collapse cleanly before expanding. */
.b2c-home-native-cms .b2c-artist-expand-section[data-artist-expanded="0"] .chip-card.is-extra{
  opacity:0;
  transform:translateY(-12px) scale(.985);
  max-height:0;
  min-height:0 !important;
  padding-top:0 !important;
  padding-bottom:0 !important;
  border-width:0 !important;
  box-shadow:none !important;
  pointer-events:none;
  overflow:hidden;
  margin:0;
}

.b2c-home-native-cms .b2c-artist-expand-section[data-artist-expanded="1"] .chip-card.is-extra{
  opacity:1;
  transform:translateY(0) scale(1);
  max-height:120px;
  min-height:82px !important;
  padding-top:16px !important;
  padding-bottom:16px !important;
  border-width:1px !important;
  pointer-events:auto;
  transition-delay:var(--artist-delay,0ms);
}

/* Row-by-row fade-down expansion. */
.b2c-home-native-cms .b2c-artist-expand-section .chip-card.is-extra{
  transition:
    opacity .42s ease,
    transform .42s cubic-bezier(.2,.8,.2,1),
    max-height .42s ease,
    padding .42s ease,
    border-width .42s ease,
    box-shadow .26s ease,
    background .26s ease,
    border-color .26s ease;
  will-change:opacity,transform,max-height;
}

/* Small counter, subtle and not customer-noisy. */
.b2c-home-native-cms .b2c-artist-count-note{
  margin-top:10px;
  color:#9a8aa6;
  font-size:12px;
  font-weight:800;
  text-align:right;
}

.b2c-home-native-cms .b2c-artist-expand-section[data-artist-expanded="1"] .b2c-artist-count-note{
  color:#6d5f79;
}

/* Preserve hover motion from current artist cards. */
.b2c-home-native-cms .b2c-artist-expand-section .chip-card{
  text-decoration:none !important;
}

@media(max-width:900px){
  .b2c-home-native-cms .b2c-artist-expand-section[data-artist-expanded="1"] .chip-card.is-extra{
    max-height:118px;
  }

  .b2c-home-native-cms .b2c-artist-count-note{
    text-align:left;
  }
}