/* JF4181 — recent-list swipe delete, expandable Favorites, compact music navigation */

/* Keep all library views on one horizontal line. */
.music-view-row{display:block!important;width:100%}
.music-view-tabs{
  display:flex!important;
  flex-wrap:nowrap!important;
  width:max-content;
  max-width:100%;
  margin-right:auto!important;
  margin-left:auto!important;
  justify-content:safe center;
  gap:6px;
  overflow-x:auto;
  overscroll-behavior-inline:contain;
  scrollbar-width:thin;
}
.music-view-tabs a{flex:0 0 auto}

/* Grid density and page selection share one compact results-header line. */
.music-results-head{display:grid!important;grid-template-columns:minmax(0,1fr) auto;align-items:end!important;gap:8px}
.music-results-head h2{min-width:0}
.music-results-tools{display:flex;align-items:flex-end;justify-content:flex-end;gap:8px;min-width:0}
.music-results-tools .music-grid-controls{display:flex;align-self:end;align-items:center;justify-content:center;gap:3px}
.music-results-tools .music-grid-controls button{
  width:29px!important;
  height:29px!important;
  padding:0!important;
  border-radius:8px!important;
  font-size:.72rem;
}
.music-results-tools .music-page-jump{width:auto;min-width:0;margin:0}

/* Keep the complete readiness message beside the output selector. */
.music-output-compact .jriver-page-state{
  flex:0 0 auto;
  color:#64755b;
  font-size:.67rem;
  font-weight:700;
  line-height:1.3;
  text-align:right;
  white-space:nowrap;
}
.music-output-compact .jriver-page-state.is-needed{color:#97553d}

/* A growing Favorite library stays usable without making the page taller. */
.favorite-picker>.favorite-picker-panel{
  display:block!important;
  max-height:min(72vh,570px)!important;
  overflow:hidden!important;
}
.favorite-picker-list{display:flex!important;flex-direction:column;gap:7px;min-height:0}
.favorite-picker-list[hidden]{display:none!important}
.favorite-picker-scroll{
  display:grid;
  grid-template-columns:1fr;
  gap:5px;
  height:296px;
  max-height:min(42dvh,296px);
  padding-right:4px;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  touch-action:pan-y;
  -webkit-overflow-scrolling:touch;
}
.favorite-picker-scroll>a{
  display:flex;
  align-items:center;
  gap:6px;
  min-width:0;
  min-height:38px;
  padding:8px;
  border-radius:10px;
  color:var(--ink);
  font-size:.78rem;
}
.favorite-picker-scroll>a:hover,.favorite-picker-scroll>a:focus-visible{background:#f7f0e8}
.favorite-picker-scroll>a.current{background:#fff0e8;color:var(--rust);font-weight:800}
.favorite-picker-scroll>a>[data-favorite-name]{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.favorite-picker-scroll>a>b{margin-left:auto}
.favorite-picker-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.favorite-picker-actions form{margin:0}
.favorite-picker-actions button{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  width:100%;
  min-height:38px;
  padding:7px 10px;
  border:1px dashed #cdbfb2;
  border-radius:10px;
  background:#fff;
  color:var(--rust);
  font-size:.78rem;
  font-weight:800;
  cursor:pointer;
}
.favorite-picker-actions>[data-favorite-add-status]{
  grid-column:1/-1;
  color:var(--sage);
  font-size:.7rem;
  font-weight:800;
  line-height:1.25;
  text-align:right;
}
.favorite-picker-actions>[data-favorite-add-status][hidden]{display:none!important}
.favorite-picker-scroll>a.is-just-added{
  background:#edf5e7;
  outline:2px solid #8aa37d;
  outline-offset:-2px;
}
.favorite-inline-editor{display:grid!important;min-height:0}
.favorite-inline-editor[hidden]{display:none!important}
.favorite-inline-fields{
  height:132px;
  max-height:min(40dvh,132px);
  padding-right:4px;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  touch-action:pan-y;
  -webkit-overflow-scrolling:touch;
}
.favorite-picker.is-editing .favorite-picker-scroll{
  height:124px;
  max-height:min(27dvh,124px);
}
.favorite-picker.is-editing .favorite-picker-actions{display:none!important}
.favorite-picker.is-editing .favorite-inline-fields{
  height:220px;
  max-height:min(46dvh,220px);
}
.favorite-inline-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:5px;
  padding:3px;
  border-radius:9px;
}
.favorite-inline-row:focus-within{background:#f7f0e8}
.favorite-inline-row>label{
  display:grid;
  grid-template-columns:68px minmax(0,1fr);
  align-items:center;
  gap:6px;
  min-width:0;
}
.favorite-inline-slot{color:var(--muted);font-size:.66rem;font-weight:800;white-space:nowrap}
.favorite-delete-button{
  min-width:45px;
  min-height:36px;
  padding:6px 8px;
  border:1px solid #d8a99a;
  border-radius:8px;
  background:#fff6f1;
  color:#a94f3c;
  font-size:.7rem;
  font-weight:900;
  cursor:pointer;
}
.favorite-delete-button:disabled{cursor:not-allowed;opacity:.38}
.favorite-add-editor{gap:8px;padding:3px}
.favorite-add-field{display:grid;gap:5px;min-width:0}
.favorite-add-field>span{color:var(--ink);font-size:.74rem;font-weight:900}
.favorite-add-field>input{width:100%;min-width:0;min-height:42px;padding:8px 10px;border-radius:9px}
.track-favorite-options{
  max-height:min(45vh,360px);
  padding-right:3px;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
}

/* Recent music: swipe left to reveal delete, then right to close it. */
.recent-swipe-row{
  position:relative;
  min-width:0;
  overflow:hidden;
  border-radius:11px;
  background:#a94f3c;
  isolation:isolate;
}
.recent-delete-button{
  position:absolute;
  z-index:0;
  top:0;
  right:0;
  bottom:0;
  width:82px;
  padding:0;
  border:0;
  border-radius:0;
  background:#a94f3c;
  color:#fff;
  font-size:.78rem;
  font-weight:900;
}
.recent-delete-button:disabled{opacity:.55}
.recent-swipe-content{
  position:relative;
  z-index:1;
  min-width:0;
  background:#fff;
  touch-action:pan-y;
  will-change:transform;
  transition:transform .18s ease;
}
.recent-swipe-row .music-track-row{margin:0}
.recent-swipe-row.is-open .recent-swipe-content{transform:translateX(-82px)}
.recent-swipe-row.is-removing{max-height:0;opacity:0;margin:0;transition:max-height .18s ease,opacity .14s ease}
.recent-music-empty[hidden]{display:none!important}

@media(max-width:760px){
  .music-control-compact{padding-top:8px!important;padding-bottom:8px!important}
  .music-primary-row{
    display:grid!important;
    grid-template-columns:auto minmax(112px,1fr) minmax(78px,auto)!important;
    gap:5px!important;
  }
  .music-primary-row .music-all-button{grid-column:1!important;grid-row:1!important}
  .music-primary-row .music-favorite-album-button{grid-column:2!important;grid-row:1!important}
  .music-primary-row .favorite-picker{grid-column:3!important;grid-row:1!important}
  .music-primary-row .music-priority-filter{
    grid-column:1/-1!important;
    grid-row:2!important;
    justify-self:end;
    justify-content:flex-end;
    padding:0 5px!important;
  }
  .music-primary-row .music-output-compact{
    grid-column:1/-1!important;
    grid-row:3!important;
    display:grid!important;
    grid-template-columns:minmax(150px,1fr) auto!important;
    align-items:center!important;
    gap:8px!important;
    width:100%;
    margin:0!important;
  }
  .music-primary-row .music-output-compact label{min-width:0;width:100%}
  .music-primary-row .music-output-compact label>span{display:none}
  .music-primary-row .music-output-compact select{width:100%!important;min-width:0}
  .music-primary-row .music-output-compact .jriver-page-state{
    grid-column:2!important;
    grid-row:1!important;
    align-self:center;
  }
  .music-primary-row .music-output-compact:has([data-browser-quality]:not([hidden])){
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto!important;
  }
  .music-primary-row .music-output-compact:has([data-browser-quality]:not([hidden])) .jriver-page-state{
    grid-column:1/-1!important;
    grid-row:2!important;
  }
  .music-primary-row .music-priority-filter>span{display:inline}
  .music-primary-row .music-priority-filter a{font-size:1rem}
  .music-view-tabs{gap:3px;padding-bottom:4px!important}
  .music-view-tabs a{height:32px!important;padding:0 8px!important;font-size:.68rem!important}
  .music-results-head{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)!important;gap:5px!important}
  .music-results-head h2{font-size:1.12rem!important;line-height:1.18}
  .music-results-tools{display:contents!important}
  .music-results-tools .music-grid-controls{grid-column:2;justify-self:center;align-self:end!important;height:31px}
  .music-results-tools .music-grid-controls button{box-sizing:border-box;width:25px!important;height:31px!important;min-height:31px!important;max-height:31px!important}
  .music-results-tools .music-page-jump{grid-column:3;justify-self:end;display:grid;grid-template-columns:auto;justify-items:end;gap:2px!important}
  .music-results-tools .music-page-jump>span{width:auto!important;font-size:.6rem!important;line-height:1}
  .music-results-tools .music-page-jump select{box-sizing:border-box;min-width:76px!important;height:31px!important;min-height:31px!important;max-height:31px!important;padding-top:5px;padding-bottom:5px;font-size:.7rem}
  .favorite-picker-scroll{height:324px;max-height:min(43dvh,324px)}
  .favorite-picker-actions button{min-height:42px}
  .favorite-inline-fields{grid-template-columns:1fr!important;height:144px;max-height:min(40dvh,144px)}
  .favorite-picker.is-editing .favorite-picker-scroll{height:136px;max-height:min(27dvh,136px)}
  .favorite-picker.is-editing .favorite-inline-fields{height:240px;max-height:min(47dvh,240px)}
  .track-favorite-options{max-height:48vh}
}

@media(max-width:420px){
  .music-primary-row{grid-template-columns:minmax(0,1fr) minmax(0,1.25fr)!important}
  .music-primary-row .music-all-button{grid-column:1!important;grid-row:1!important}
  .music-primary-row .music-favorite-album-button{grid-column:2!important;grid-row:1!important}
  .music-primary-row .favorite-picker{grid-column:1/-1!important;grid-row:2!important}
  .music-primary-row .music-priority-filter{grid-column:1/-1!important;grid-row:3!important}
  .music-primary-row .music-output-compact{
    grid-column:1/-1!important;
    grid-row:4!important;
    grid-template-columns:minmax(150px,1fr) auto!important;
  }
  .music-primary-row .music-output-compact .jriver-page-state{font-size:.67rem}
  .music-view-tabs a{padding-inline:6px!important;font-size:.63rem!important}
  .music-results-head h2{font-size:1rem!important}
  .music-results-tools .music-grid-controls{gap:2px}
  .music-results-tools .music-grid-controls button{width:24px!important;height:31px!important;min-height:31px!important;max-height:31px!important;font-size:.66rem}
  .music-results-tools .music-page-jump select{min-width:70px!important;font-size:.66rem}
  .recent-delete-button{width:76px}
  .recent-swipe-row.is-open .recent-swipe-content{transform:translateX(-76px)}
}

@media(prefers-reduced-motion:reduce){
  .recent-swipe-content,.recent-swipe-row.is-removing{transition:none!important}
}
