{{--
    wiz 右サイドバー「操作マニュアル / サポート」card — Figma node 6075:5582.
    SCR-17/18/19/20/21/22 (cs14-19) 共通. ボタン = <lme-button-flat> (flat/primary = 白+#D1D1D1枠),
    アイコン = <lme-icon> (mono, currentColor 継承). 依存 (bot_add_v5.blade.php @push 済):
    lme-button-flat.js / lme-icon.js / openUrl() (add_bot_v5.js). Params (任意):
      $title  : string  — 既定「操作マニュアル」(SCR-22「サポート」)
      $video  : bool    — 操作マニュアル動画 thumbnail (cs14/15)
      $docUrl : ?string — 「別タブで見る」リンク先. null で非表示 (developers / manager)
      $mobile : bool    — 「スマホで見る」ボタン (cs14/15)
      $draft  : bool    — 「途中保存」ボタン (cs14/15)
--}}
@php
    $title  = $title ?? '操作マニュアル';
    $video  = $video ?? false;
    $docUrl = $docUrl ?? null;
    $mobile = $mobile ?? false;
    $draft  = $draft ?? false;
@endphp
<div class="wiz-sidebar-right">
    <div class="wiz-manual-card">
        <div class="wiz-manual-title"><lme-icon file_name="play-circle-outlined" size="20"></lme-icon> {{ $title }}</div>
        @if($video)
        {{-- クリック → 画面右下の floating player (openVideoPanel — 引数なしで現在ステップのラベルを表示) --}}
        <div class="wiz-video-thumb" @click="openVideoPanel()">
            <lme-icon file_name="play-circle-filled" size="40" color="#ffffff"></lme-icon>
            <span class="wiz-video-label"><lme-icon file_name="play-circle-filled" size="12" color="#ffffff"></lme-icon>操作マニュアル</span>
            <span class="wiz-video-duration">3:24</span>
        </div>
        @endif
        @if($docUrl || $mobile)
        <div class="wiz-manual-row">
{{--            @if($docUrl)--}}
{{--            <lme-button-flat @click="openUrl('{{ $docUrl }}')"><lme-icon file_name="export-outlined" size="16"></lme-icon>別タブで見る</lme-button-flat>--}}
{{--            @endif--}}
            @if($mobile)
            <lme-button-flat @click="showModalQrVideoPanel = true"><lme-icon file_name="mobile-outlined" size="16"></lme-icon>スマホで見る</lme-button-flat>
            @endif
        </div>
        @endif
        <lme-button-flat @click="openUrl(genUrlManual())"><lme-icon file_name="file-text-outlined" size="16"></lme-icon>テキストマニュアルを見る</lme-button-flat>
        <div class="wiz-manual-divider"></div>
        @if($draft)
        <lme-button-flat @click="saveDraft"><lme-icon file_name="save-outlined" size="16"></lme-icon>途中保存</lme-button-flat>
        @endif
        <lme-button-flat @click="openUrl('https://tayori.com/form/fb6d2b608e2c48016ea92cf883cc94cda9ad4cb1')"><lme-icon file_name="question-circle-outlined" size="16"></lme-icon>新規接続に関する問い合わせ</lme-button-flat>
    </div>
</div>