/* VW_WATCH_TOGETHER_PM_FLUID_STATE_FINAL_V3_15R6R1
   Corrected final additive adapter.

   R6 failure diagnosis:
   1) List Hide Video used the R3 global class `vw-premium-video-hidden`.
      R3 intentionally auto-restores video whenever PM is open but no thread is open,
      so list hide was immediately undone.
      R6R1 uses its own `vw-r6-list-video-hidden` state for the PM list.

   2) Keyboard header relied only on cascade timing.
      A14R1 proved the final 3-column geometry, so R6R1 also applies that geometry
      directly from JS with inline !important while keyboard/tight states are active.

   R4R1 Player sheet and R5R1 GIF geometry remain unchanged.
*/

:root{
  --vw-r6-ease:cubic-bezier(.2,.82,.18,1);
}

@media(max-width:980px){
  /* One continuous player lane for BOTH PM list and thread. */
  body.vw-android-room-shell.vw-r6-fluid-ready.vw-private-messages-open:not(.vw-gif-tray-open):not(.vw-premium-video-hidden):not(.vw-r6-list-video-hidden) .stage{
    height:var(--vw-r6-video-h,168px)!important;
    min-height:var(--vw-r6-video-h,168px)!important;
    max-height:var(--vw-r6-video-h,168px)!important;
    transition:
      height .28s var(--vw-r6-ease),
      max-height .28s var(--vw-r6-ease),
      transform .30s var(--vw-r6-ease),
      opacity .20s ease!important;
  }

  body.vw-android-room-shell.vw-r6-fluid-ready.vw-private-messages-open:not(.vw-gif-tray-open):not(.vw-premium-video-hidden):not(.vw-r6-list-video-hidden) #videoWrap{
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
  }

  body.vw-android-room-shell.vw-r6-fluid-ready.vw-private-messages-open:not(.vw-private-thread-open):not(.vw-gif-tray-open):not(.vw-r6-list-video-hidden) #video{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    height:100%!important;
    max-height:100%!important;
  }

  /* PM list surface fills from player bottom to viewport bottom. */
  body.vw-android-room-shell.vw-r6-fluid-ready.vw-private-messages-open:not(.vw-private-thread-open):not(.vw-gif-tray-open):not(.vw-r6-list-video-hidden) .private-messages-surface{
    top:var(--vw-r6-list-top,172px)!important;
    bottom:auto!important;
    height:var(--vw-r6-list-height,calc(100dvh - 180px))!important;
    max-height:none!important;
    transition:
      top .28s var(--vw-r6-ease),
      height .28s var(--vw-r6-ease),
      opacity .18s ease!important;
  }

  /* ---------- Personal Messages list header ---------- */
  body.vw-android-room-shell .private-surface-head.vw-r6-list-head{
    box-sizing:border-box!important;
    display:grid!important;
    grid-template-columns:42px minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:7px!important;
    min-height:54px!important;
    height:auto!important;
    padding:6px 8px!important;
    border-bottom:1px solid rgba(255,255,255,.055)!important;
    background:linear-gradient(180deg,rgba(9,14,23,.985),rgba(7,11,18,.985))!important;
    box-shadow:0 7px 22px rgba(0,0,0,.16)!important;
  }

  body.vw-android-room-shell .vw-r6-list-copy{
    min-width:0!important;
    overflow:hidden!important;
  }
  body.vw-android-room-shell .vw-r6-list-copy>span{
    display:block!important;
    color:#8173e9!important;
    font-size:7px!important;
    font-weight:900!important;
    letter-spacing:.13em!important;
  }
  body.vw-android-room-shell .vw-r6-list-copy>b{
    display:block!important;
    margin-top:2px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    color:#f2f5fa!important;
    font-size:13px!important;
  }
  body.vw-android-room-shell .vw-r6-list-copy>small{
    display:block!important;
    margin-top:2px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    color:#748297!important;
    font-size:8px!important;
  }

  body.vw-android-room-shell .vw-r6-list-actions{
    display:flex!important;
    align-items:center!important;
    justify-self:end!important;
    gap:5px!important;
    min-width:0!important;
  }

  body.vw-android-room-shell .vw-r6-list-action{
    box-sizing:border-box!important;
    width:36px!important;
    min-width:36px!important;
    height:36px!important;
    display:grid!important;
    place-items:center!important;
    padding:0!important;
    border:1px solid rgba(255,255,255,.08)!important;
    border-radius:11px!important;
    background:rgba(255,255,255,.035)!important;
    color:#eef2ff!important;
    box-shadow:none!important;
    cursor:pointer!important;
    -webkit-tap-highlight-color:transparent;
    transition:transform .15s ease,background .17s ease,border-color .17s ease!important;
  }
  body.vw-android-room-shell .vw-r6-list-action svg{
    width:16px!important;height:16px!important;display:block!important;
  }
  body.vw-android-room-shell .vw-r6-list-action:active{transform:scale(.92)}
  body.vw-android-room-shell .vw-r6-list-action.active,
  body.vw-android-room-shell .vw-r6-list-video.vw-video-hidden{
    background:linear-gradient(135deg,rgba(119,104,255,.94),rgba(76,126,255,.90))!important;
    border-color:rgba(161,152,255,.30)!important;
  }

  /* ---------- LIST-only Hide Video ---------- */
  body.vw-android-room-shell.vw-r6-fluid-ready.vw-private-messages-open:not(.vw-private-thread-open).vw-r6-list-video-hidden .stage{
    transform:translate3d(-108%,0,0)!important;
    opacity:0!important;
    pointer-events:none!important;
    height:0!important;
    min-height:0!important;
    max-height:0!important;
    overflow:hidden!important;
    box-shadow:none!important;
    border-width:0!important;
    transition:
      transform .32s var(--vw-r6-ease),
      opacity .20s ease,
      height .32s var(--vw-r6-ease),
      max-height .32s var(--vw-r6-ease)!important;
  }

  body.vw-android-room-shell.vw-r6-fluid-ready.vw-private-messages-open:not(.vw-private-thread-open).vw-r6-list-video-hidden .private-messages-surface{
    top:var(--vw-r6-hidden-top,0px)!important;
    bottom:auto!important;
    height:var(--vw-r6-hidden-height,100dvh)!important;
    max-height:none!important;
    transition:
      top .30s var(--vw-r6-ease),
      height .30s var(--vw-r6-ease)!important;
  }

  /* CSS fallback for keyboard header. JS R6R1 also applies this geometry inline. */
  body.vw-android-room-shell.vw-private-thread-open.vw-android-keyboard-open .private-thread-head,
  body.vw-android-room-shell.vw-private-thread-open.vw-android-ime-session .private-thread-head{
    box-sizing:border-box!important;
    display:grid!important;
    grid-template-columns:42px minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:6px!important;
    min-height:50px!important;
    height:auto!important;
    padding:5px 6px!important;
  }

  body.vw-android-room-shell.vw-private-thread-open.vw-android-keyboard-open .private-thread-avatar,
  body.vw-android-room-shell.vw-private-thread-open.vw-android-ime-session .private-thread-avatar{
    display:none!important;
  }
}

@media(max-width:380px){
  body.vw-android-room-shell .private-surface-head.vw-r6-list-head{
    grid-template-columns:38px minmax(0,1fr) auto!important;
    gap:5px!important;
    padding-left:6px!important;
    padding-right:6px!important;
  }
  body.vw-android-room-shell .vw-r6-list-action{
    width:34px!important;
    min-width:34px!important;
    height:34px!important;
    border-radius:10px!important;
  }
}

/* Existing PM CSS hides the header in tight keyboard mode.
   R6R1 explicitly keeps the premium three-column header visible. */
@media(max-width:980px){
  body.vw-android-room-shell.vw-private-thread-open.vw-android-keyboard-open.vw-android-keyboard-tight .private-thread-head{
    display:grid!important;
    grid-template-columns:38px minmax(0,1fr) auto!important;
    min-height:48px!important;
    height:auto!important;
    padding:4px 6px!important;
  }
}

@media(prefers-reduced-motion:reduce){
  body.vw-r6-fluid-ready .stage,
  body.vw-r6-fluid-ready .private-messages-surface{
    transition:none!important;
  }
}
