/* ==========================================================================
 * MILLENOVA GLOBAL PLAYER — MPLAYER PT-3 TRANSPORT CONVERGENCE
 *
 * SCROLLBAR OWNER: Styles/scrollbars.css
 * Scrollbar appearance is centralized there. This file may own overflow,
 * scroll-snap and scrollbar-gutter behavior, but must not style scrollbar chrome.
 *
 * OWNER:
 * This file owns PT-3 playlist-transport presentation only: collection-gated
 * Shuffle/Repeat visibility, tri-state Repeat presentation and PT-3 companion
 * transport styling introduced after the historical floating-player CSS split.
 *
 * MUST NOT OWN:
 * Do not redefine queue semantics, provider playback behavior, native overlay
 * internals, Stage black-cinema geometry, reactions, media authorization,
 * scrollbar chrome or unrelated mobile/desktop layout.
 *
 * CASCADE CONTRACT:
 * Loaded after the accepted historical floating-player split and native Stage
 * overlay. Rules must be narrowly scoped to PT-3 transport selectors and must
 * not replace or bypass earlier layout ownership.
 *
 * DEPENDENCIES:
 * Depends on Scripts/floating-playlist.js PT-1/PT-2 transport state and on the
 * Global Player CSS manifest ordering authority.
 * ========================================================================= */

.floating-playlist [data-floating-playlist-loop],
.floating-playlist [data-floating-playlist-mini-loop] {
  position: relative;
}

.floating-playlist [data-floating-playlist-loop][data-repeat-mode="one"]::after,
.floating-playlist [data-floating-playlist-mini-loop][data-repeat-mode="one"]::after {
  content: "1";
  position: absolute;
  inset-inline-end: 1px;
  inset-block-start: 0;
  min-width: 10px;
  height: 10px;
  padding: 0 2px;
  border-radius: 999px;
  font-size: 7px;
  line-height: 10px;
  font-weight: 800;
  text-align: center;
  background: currentColor;
  color: #09090b;
  pointer-events: none;
}

.floating-playlist [data-floating-playlist-loop][data-repeat-mode="off"],
.floating-playlist [data-floating-playlist-mini-loop][data-repeat-mode="off"] {
  opacity: .78;
}

.floating-playlist [data-floating-playlist-loop][hidden],
.floating-playlist [data-floating-playlist-mini-loop][hidden],
.floating-playlist [data-floating-playlist-shuffle][hidden],
.floating-playlist [data-floating-playlist-mini-shuffle][hidden] {
  display: none !important;
}

/* PT-3B collection companion controls. */
.floating-playlist__collection-companions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
}

.floating-playlist__collection-companions[hidden] {
  display: none !important;
}

.floating-playlist__collection-companions button {
  position: relative;
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: rgba(255,255,255,.78);
  cursor: pointer;
}

.floating-playlist__collection-companions button:hover,
.floating-playlist__collection-companions button:focus-visible {
  background: rgba(255,255,255,.08);
  color: #fff;
}

.floating-playlist__collection-companions button.is-active {
  color: var(--mn-stage-signal-purple);
}

.floating-playlist__collection-companions svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.floating-playlist__collection-companions [data-mplayer-collection-repeat][data-repeat-mode="one"]::after {
  content: "1";
  position: absolute;
  inset-inline-end: 2px;
  inset-block-start: 2px;
  min-width: 10px;
  height: 10px;
  padding: 0 2px;
  border-radius: 999px;
  font-size: 7px;
  line-height: 10px;
  font-weight: 800;
  text-align: center;
  background: currentColor;
  color: #09090b;
  pointer-events: none;
}

@media (max-width: 760px) {
  .floating-playlist__collection-companions {
    gap: 2px;
    margin-inline-start: auto;
  }

  .floating-playlist__collection-companions button {
    width: 32px;
    height: 32px;
  }

  .floating-playlist__collection-companions svg {
    width: 17px;
    height: 17px;
  }
}

/* PT-3B companion/menu grid cluster placement. */
.floating-playlist__collection-menu-cluster {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 2px;
  min-width: 0;
}

@media (min-width: 901px) {
  .floating-playlist:not(.is-minimized)
    .floating-playlist__stage-info-row
    > .floating-playlist__collection-menu-cluster {
    grid-column: 4;
    grid-row: 1;
    align-self: center;
    justify-self: end;
    margin-right: .65rem;
  }
}

@media (max-width: 900px) {
  .floating-playlist:not(.is-minimized)
    .floating-playlist__stage-info-row
    > .floating-playlist__collection-menu-cluster {
    grid-column: 2;
    grid-row: 1;
    align-self: center;
    justify-self: center;
    width: 44px;
    min-width: 44px;
    max-width: 44px;
    max-height: 44px;
    overflow: visible;
    position: relative;
    z-index: 3;
  }

  .floating-playlist.is-stage-info-scrolled:not(.is-minimized)
    .floating-playlist__stage-info-row
    > .floating-playlist__collection-menu-cluster {
    grid-column: 3;
    grid-row: 1;
  }
}