@php
  $urlsReady = $account !== null && $account->isTelecom();
  $telecomUrls = $urlsReady
      ? $account->telecomRegistrationUrls()
      : [
          'sending_ip' => trim((string) config('putage.sending_ip', '')),
          'payment_webhook_url' => '',
          'cancel_webhook_url' => '',
      ];
  $sendingIpDisplay = $telecomUrls['sending_ip'] ?: '（未設定: MONAKA_SENDING_IP / PUTAGE_SENDING_IP をサーバ管理者が設定）';
@endphp
<div class="{{ !empty($embedded) ? '' : 'border rounded p-3 bg-white mt-2' }}">
  <div class="fw-semibold mb-2">テレコムクレジットで設定する項目</div>
  <p class="small text-muted mb-3">
    テレコムの管理画面・「クレジット決済システム追加設定依頼書」に、次の3項目を登録してください。
    @unless($urlsReady)
      <strong class="d-block mt-1">通知URLは「追加する」または「保存する」後に確定します。</strong>送信元IPは保存前から確認できます。
    @endunless
  </p>
  <div class="mb-3">
    <label class="form-label fw-semibold mb-1">送信元IP</label>
    <input type="text" class="form-control bg-light" readonly value="{{ $sendingIpDisplay }}" data-telecom-copy-source @if(!filled($telecomUrls['sending_ip'])) data-telecom-copy-skip @endif>
    @if(filled($telecomUrls['sending_ip']))
      <button type="button" class="btn btn-sm btn-outline-secondary mt-1" data-telecom-copy data-no-row-toggle="1">コピー</button>
    @else
      <p class="form-text mb-0">monaka からテレコムへ決済結果を送るサーバのグローバルIPです。未設定のときはサーバ管理者に設定を依頼してください。</p>
    @endif
  </div>
  <div class="mb-3">
    <label class="form-label fw-semibold mb-1">決済データ送信先URL</label>
    @if($urlsReady && filled($telecomUrls['payment_webhook_url']))
      <input type="text" class="form-control bg-light font-monospace small" readonly value="{{ $telecomUrls['payment_webhook_url'] }}" data-telecom-copy-source>
      <button type="button" class="btn btn-sm btn-outline-secondary mt-1" data-telecom-copy data-no-row-toggle="1">コピー</button>
    @else
      <input type="text" class="form-control bg-light font-monospace small text-muted" readonly disabled placeholder="保存後にこの連携専用のURLが表示されます">
      <p class="form-text mb-0">決済完了時にテレコムから monaka へ結果が送られるURLです。保存しないと発行されません。</p>
    @endif
  </div>
  <div class="mb-0">
    <label class="form-label fw-semibold mb-1">退会データ送信先URL</label>
    @if($urlsReady && filled($telecomUrls['cancel_webhook_url']))
      <input type="text" class="form-control bg-light font-monospace small" readonly value="{{ $telecomUrls['cancel_webhook_url'] }}" data-telecom-copy-source>
      <button type="button" class="btn btn-sm btn-outline-secondary mt-1" data-telecom-copy data-no-row-toggle="1">コピー</button>
    @else
      <input type="text" class="form-control bg-light font-monospace small text-muted" readonly disabled placeholder="保存後にこの連携専用のURLが表示されます">
      <p class="form-text mb-0">継続課金の退会・解約通知用URLです。単発決済のみでも、テレコムの依頼書に合わせて登録してください。</p>
    @endif
  </div>
</div>

@once
  @push('scripts')
    <script>
      document.addEventListener('click', function (e) {
        var btn = e.target.closest('[data-telecom-copy]');
        if (!btn) return;
        var wrap = btn.closest('.mb-3, .mb-0');
        var input = wrap ? wrap.querySelector('[data-telecom-copy-source]') : null;
        if (!input || input.hasAttribute('data-telecom-copy-skip') || !input.value) return;
        navigator.clipboard.writeText(input.value).then(function () {
          var prev = btn.textContent;
          btn.textContent = 'コピーしました';
          setTimeout(function () { btn.textContent = prev; }, 2000);
        });
      });
    </script>
  @endpush
@endonce