@using DeepDrftPublic.Client.Services

@* Hero-right panel (owns the navy backdrop + clipping, formerly Home.razor's .hero-right wrapper). *@
<div class="now-playing-panel">
    @* Full-bleed waveform background. The visualizer mounts with Fill="true" (position:absolute; inset:0),
       so .np-visualizer-bg is the positioned, sized ancestor that lets the lava fill the whole hero-right
       panel. Driven by the live cascaded player — keyed on the current track via ReleaseEntryKey/TrackId/
       TrackEntryKey so it scrolls to the real signal and sits at-rest when nothing plays. Read-only: the
       background visualizes, it never seeks. Sits behind the rings + content (z-order via stacking below). *@
    <div class="np-visualizer-bg">
        <WaveformVisualizer Fill="true"
                            ReleaseEntryKey="@(Player?.CurrentTrack?.Release?.EntryKey ?? string.Empty)"
                            TrackId="@Player?.CurrentTrack?.Id"
                            TrackEntryKey="@Player?.CurrentTrack?.EntryKey" />
    </div>

    @* The lava-lamp popover trigger lands in the panel's top-right corner (full parity, §8e). Above the
       canvas and pointer-enabled so the icon is clickable even though the visualizer layer is
       pointer-events:none. *@
    <div class="np-visualizer-controls">
        <WaveformVisualizerControlPopover IconSize="Size.Small"
                                          AnchorOrigin="Origin.BottomRight"
                                          TransformOrigin="Origin.TopLeft" />
    </div>

    @* Pulsing rings *@
    <div class="circle-deco"></div>
    <div class="circle-deco"></div>
    <div class="circle-deco"></div>

    <div class="now-playing-content">
        <NowPlayingCard />

        @* Stat row - hard-coded for now. TODO Phase 2: wire to real track count / identity model. *@
        <NowPlayingStats />
    </div>
</div>


@code {
    [CascadingParameter] public IStreamingPlayerService? Player { get; set; }
}