@php
  $fromSetup = $fromSetup ?? false;
  // 「DNSとは？」ツールチップ（HTML表示）。各ドメイン行の展開内でも使う。
  $dnsTipHtml = '<strong>DNSとは？</strong><br>'
    .'DNS（ディーエヌエス）は、かんたんに言うと「ドメイン名（example.com）を、どのサービスに使うか決める電話帳のような設定」です。'
    .'<br><br>'
    .'この画面で出る文字（DKIM/DMARCのレコード）を、ドメインを借りている会社の『DNS』『DNSレコード』の画面に追加します。'
    .'<br><br>'
    .'※入力欄の名前や、レコード名を「全部（_dmarc.example.com）」入れるか「一部（_dmarc）」だけ入れるかは、会社によって違います。';
@endphp
<div class="{{ $fromSetup ? 'setup-toolbar' : 'delivery-toolbar' }}">
  <button type="button" class="btn btn-primary btn-sm" data-bs-toggle="modal" data-bs-target="#addDkimDomainModal">
    <i class="bi bi-plus-lg me-1"></i>追加
  </button>
</div>

<div class="{{ $fromSetup ? 'setup-form-card mb-4' : 'card mb-3' }}">
  <div class="card-header">認証ドメイン一覧</div>
  <div class="card-body p-0">
    @if($domains->isEmpty())
      <div class="text-center py-5 text-muted px-3">
        <i class="bi bi-envelope-check" style="font-size:2.4rem;opacity:.45;"></i>
        <p class="mt-2 mb-1 fw-semibold text-dark">まだドメインがありません</p>
        <p class="small mb-0">上の <strong>「追加」</strong> からドメインを登録すると、ここに<strong>コピー用の文字</strong>が出ます。それをドメイン会社の「DNS」画面に貼り付けるのが次のステップです。</p>
      </div>
    @else
      <table class="table table-hover align-middle mb-0">
        <thead class="table-light">
          <tr>
            <th>ドメイン</th>
            <th>状態</th>
            <th class="text-end">操作</th>
          </tr>
        </thead>
        <tbody id="dkimDomainTableBody">
          @foreach($domains as $domain)
          @php
            $collapseId = 'dnsDomainCollapse'.$domain->id;
            $domainTestAccounts = $accountsByMailDomainId[$domain->id] ?? collect();
            $expandThisDomain = ((string) old('mail_domain_id', '') !== '' && (string) old('mail_domain_id') === (string) $domain->id)
                || ((string) session('opened_domain_id', '') === (string) $domain->id);
          @endphp
          <tr
            class="dkim-domain-row"
            role="button"
            tabindex="0"
            aria-controls="{{ $collapseId }}"
            aria-expanded="{{ $expandThisDomain ? 'true' : 'false' }}"
            data-bs-toggle="collapse"
            data-bs-target="#{{ $collapseId }}"
          >
            <td>
              <code class="me-2">{{ $domain->domain }}</code>
              <span class="small text-muted d-inline-flex align-items-center gap-1">
                クリックで DNS 設定を表示
                <span
                  class="text-muted d-inline-flex align-items-center"
                  data-bs-toggle="tooltip"
                  data-bs-placement="bottom"
                  data-bs-html="true"
                  data-bs-custom-class="mail-delivery-tab-tooltip"
                  tabindex="0"
                  role="button"
                  aria-label="DNSとは何か（説明）"
                  data-bs-title="{!! htmlspecialchars($dnsTipHtml, ENT_QUOTES | ENT_SUBSTITUTE, 'UTF-8') !!}"
                ><i class="bi bi-info-circle" aria-hidden="true"></i></span>
              </span>
            </td>
            <td>
              <span class="badge {{ $domain->status === 'active' ? 'bg-success' : 'bg-warning text-dark' }}">
                {{ $domain->status === 'active' ? '有効' : '設定中' }}
              </span>
            </td>
            <td class="text-end">
              <form method="POST" action="{{ route('account.dkim.destroy', $domain) }}" class="d-inline" onsubmit="return confirm('このドメイン設定を削除しますか？');">
                @csrf
                @method('DELETE')
                @if($fromSetup)<input type="hidden" name="from_setup" value="1">@endif
                <button type="submit" class="btn btn-sm btn-outline-danger" data-no-row-toggle="1" aria-label="削除"><i class="bi bi-trash"></i></button>
              </form>
            </td>
          </tr>
          <tr class="collapse{{ $expandThisDomain ? ' show' : '' }}" id="{{ $collapseId }}" data-bs-parent="#dkimDomainTableBody">
            <td colspan="3" class="bg-light">
              @php
                $sel = $domain->dkim_selector ?? '';
                $signHost = (string) config('putage.dkim_signing_hostname');
                $sendingIp = trim((string) config('putage.sending_ip'));
                $spfIncludeDomain = trim((string) config('putage.spf_include_domain'));
                $cnameValue = $sel !== '' ? ($sel.'.'.$signHost) : '';
                $recordHostFqdn = $sel !== '' ? ($sel.'._domainkey.'.$domain->domain) : '';
                $recordHostRelative = $sel !== '' ? ($sel.'._domainkey') : '';
                $spfHostFqdn = $domain->domain;
                $spfValue = '';
                if ($spfIncludeDomain !== '') {
                  $spfValue = 'v=spf1 include:'.$spfIncludeDomain.' -all';
                } elseif ($sendingIp !== '') {
                  $spfValue = 'v=spf1 ip4:'.$sendingIp.' -all';
                }
                $dnsItemsByKey = [];
                $dnsPersisted = $domain->dns_last_check_result;
                if (is_array($dnsPersisted) && ! empty($dnsPersisted['items'])) {
                  foreach ($dnsPersisted['items'] as $it) {
                    $k = (string) ($it['key'] ?? '');
                    if ($k !== '') {
                      $dnsItemsByKey[$k] = $it;
                    }
                  }
                }
                $dmarcTxtLine = \App\Support\MailDmarcSpec::expectedTxt();
                $dmarcPolicy = \App\Support\MailDmarcSpec::policy();
              @endphp

              <div class="p-3" data-mail-domain="{{ $domain->domain }}">
                <x-next-action>
                  この下の表の <strong>3行（DKIM／DMARC／SPF）</strong> を、あなたのドメインの <strong>DNS設定</strong> にそのまま追加して保存してください。
                </x-next-action>

                <div class="mb-3">
                  <x-help-section title="ここでやること（3ステップ）" variant="info" :open="true">
                    <ol class="ps-3 text-muted lh-base">
                      <li>
                        <strong>（DNSを編集）</strong>
                        あなたのドメイン管理サービス（例: ムームー／お名前.com）の <strong>DNS設定</strong> 画面で、この下の表の 3 行（DKIM / DMARC / SPF）を <strong>そのまま追加</strong>して保存します。
                      </li>
                      <li>
                        <strong>（送信元メールを設定）</strong>
                        管理画面の <strong>送信用アカウント</strong> → 「各種設定」で、送信元メールアドレスを設定します。<strong>このドメインで送る</strong>なら <strong>@ 以降が <code>{{ $domain->domain }}</code></strong> になっていればOKです（<strong>@ より前は自由</strong>）。
                        <br>例: <code>info@__DOMAIN__</code> / <code>mail@__DOMAIN__</code> / <code>noreply@__DOMAIN__</code>
                      </li>
                      <li>
                        <strong>（届くか確認）</strong>
                        この画面に戻って、<strong>いちばん下の「送信テスト」</strong>から自分宛てに 1 通送って確認します（迷惑メールも確認）。
                      </li>
                    </ol>
                  </x-help-section>
                </div>

                <div class="d-flex align-items-center justify-content-between flex-wrap gap-2 mb-2">
                  <div class="fw-semibold mb-0">このドメインの DNS 設定値</div>
                  <div class="d-flex align-items-center gap-2 flex-wrap justify-content-end">
                    <div class="small text-muted" data-no-row-toggle="1">
                      ドメイン登録:
                      <span class="fw-semibold">{{ $domain->created_at ? $domain->created_at->timezone(config('app.timezone'))->format('Y/m/d H:i') : '—' }}</span>
                    </div>
                    <div class="small text-muted" data-no-row-toggle="1">
                      最終確認:
                      <span class="fw-semibold" id="dns-last-checked-at-{{ $domain->id }}">
                        {{ $domain->dns_last_checked_at ? $domain->dns_last_checked_at->timezone(config('app.timezone'))->format('Y/m/d H:i') : '—' }}
                      </span>
                    </div>
                    <button
                      type="button"
                      class="btn btn-primary btn-sm dns-check-btn text-white fw-semibold"
                      data-mail-domain-id="{{ $domain->id }}"
                      data-check-url="{{ route('account.dkim.dns-check') }}"
                      data-no-row-toggle="1"
                      title="このサーバーから公開DNSを照会し、表の各行が正しく見えるか確認します"
                    >
                      <i class="bi bi-check2-circle me-1" aria-hidden="true"></i>設定確認
                    </button>
                  </div>
                </div>
                <div class="mb-2">
                  <x-help-section title="「設定確認」ボタンについて" variant="info">
                    <p class="text-muted mb-0">
                      「設定確認」はメールの ping ではなく、<strong>このサーバーからの DNS 問い合わせ</strong>です。
                      <strong>DMARC だけ OK で DKIM／SPF が未設定</strong>になることもあり得ます（レコードごとに伝わり方が違う／運用側 TXT 未登録／include 先がまだ等）。
                      数分後にもう一度試すか、<strong>「未設定」の行のすぐ下に出る短文</strong>を確認してください。
                    </p>
                  </x-help-section>
                </div>
                <table class="table table-sm dns-table mb-2">
                  <thead>
                    <tr>
                      <th>タイプ</th>
                      <th>レコード名（ホスト名）</th>
                      <th>値</th>
                      <th class="text-nowrap">状態</th>
                    </tr>
                  </thead>
                  <tbody>
                    <tr data-dns-row="dkim">
                      <td><code>CNAME</code></td>
                      <td>
                        <div class="d-flex align-items-center gap-2 flex-wrap">
                          <code>{{ $recordHostFqdn ?? '' }}</code>
                          <button type="button" class="btn btn-outline-secondary btn-sm py-0 px-2 copy-btn" data-copy-text="{{ $recordHostFqdn ?? '' }}" aria-label="レコード名をコピー"><i class="bi bi-clipboard"></i></button>
                        </div>
                      </td>
                      <td>
                        <div class="d-flex align-items-center gap-2 flex-wrap">
                          <code>{{ $cnameValue ?? '' }}</code>
                          <button type="button" class="btn btn-outline-secondary btn-sm py-0 px-2 copy-btn" data-copy-text="{{ $cnameValue ?? '' }}" aria-label="値をコピー"><i class="bi bi-clipboard"></i></button>
                        </div>
                      </td>
                      @include('account.partials.dkim-dns-check-status', ['item' => $dnsItemsByKey['dkim'] ?? null])
                    </tr>
                    <tr data-dns-row="dmarc">
                      <td><code>TXT</code></td>
                      <td>
                        <div class="d-flex align-items-center gap-2 flex-wrap">
                          <code>_dmarc.{{ $domain->domain }}</code>
                          <button type="button" class="btn btn-outline-secondary btn-sm py-0 px-2 copy-btn" data-copy-text="_dmarc.{{ $domain->domain }}" aria-label="レコード名をコピー"><i class="bi bi-clipboard"></i></button>
                        </div>
                      </td>
                      <td>
                        <div class="d-flex align-items-center gap-2 flex-wrap">
                          <code>{{ $dmarcTxtLine }}</code>
                          <button type="button" class="btn btn-outline-secondary btn-sm py-0 px-2 copy-btn" data-copy-text="{{ $dmarcTxtLine }}" aria-label="値をコピー"><i class="bi bi-clipboard"></i></button>
                        </div>
                      </td>
                      @include('account.partials.dkim-dns-check-status', ['item' => $dnsItemsByKey['dmarc'] ?? null])
                    </tr>
                    @if($spfValue !== '')
                    <tr data-dns-row="spf">
                      <td><code>TXT</code></td>
                      <td>
                        <div class="d-flex align-items-center gap-2 flex-wrap">
                          <code>{{ $spfHostFqdn }}</code>
                          <button type="button" class="btn btn-outline-secondary btn-sm py-0 px-2 copy-btn" data-copy-text="{{ $spfHostFqdn }}" aria-label="レコード名をコピー"><i class="bi bi-clipboard"></i></button>
                        </div>
                      </td>
                      <td>
                        <div class="d-flex align-items-center gap-2 flex-wrap">
                          <code>{{ $spfValue }}</code>
                          <button type="button" class="btn btn-outline-secondary btn-sm py-0 px-2 copy-btn" data-copy-text="{{ $spfValue }}" aria-label="値をコピー"><i class="bi bi-clipboard"></i></button>
                        </div>
                      </td>
                      @include('account.partials.dkim-dns-check-status', ['item' => $dnsItemsByKey['spf'] ?? null])
                    </tr>
                    @endif
                  </tbody>
                </table>
                <div class="mt-2 text-muted lh-base">
                  <x-help-section title="DNS に追加したあと" variant="must">
                    <ul class="ps-3">
                      @if($dmarcPolicy !== 'none')
                      <li><strong>DMARC はこの環境では <code>p={{ $dmarcPolicy }}</code></strong> です。認証に失敗したメールは隔離・拒否されやすくなります。別サービスから同じドメインで送っている場合は、すべて SPF／DKIM が通ることを確認してから強いポリシーにしてください。</li>
                      @endif
                      <li><strong>保存したら 10分〜最大24時間</strong>ほど待ちます（DNS反映待ち）。</li>
                      <li>次に、管理画面の <strong>送信用アカウント</strong> →「各種設定」で <strong>送信元メールアドレス</strong> を設定します（<strong>@ 以降が <code>{{ $domain->domain }}</code></strong>）。</li>
                      <li>最後に、この枠のいちばん下の <strong>「送信テスト」</strong>で自分宛てに 1 通送って届くか確認します。</li>
                    </ul>
                  </x-help-section>

                  <x-help-section title="DNS入力でつまずいたとき" variant="optional">
                    <ul class="ps-3">
                      <li>表の「レコード名」が長すぎて入らない場合は、DNS画面の説明に従って <code>{{ $recordHostRelative ?? '' }}</code> のように短く入力してください（自動で <code>.{{ $domain->domain }}</code> が付くことがあります）。DMARC も <code>_dmarc</code> だけでよい場合があります。</li>
                    </ul>
                  </x-help-section>

                  @if($spfValue !== '')
                  <x-help-section title="送れないときに見る" variant="optional">
                    <ul class="ps-3">
                      <li>受信側で「SPFが通らない」と言われる場合は、表の <strong>SPF（TXT）</strong> が DNS に入っているか確認してください。</li>
                      <li><strong>サブドメイン（例: <code>infomail.{{ $domain->domain }}</code>）</strong>を送信元にする場合、DNS上でそのサブドメインが <strong>存在</strong>していないと失敗しやすいです。必要なら DNS 設定画面で <strong>A または AAAA</strong> を追加してください（NXDOMAIN回避）。</li>
                      @if($spfIncludeDomain !== '')
                      <li>この SPF は <strong>include 方式</strong>です。あなたがやるのは <strong>自分のDNSに表のSPF（TXT）を追加するだけ</strong>です（運用側（monaka側）で <code>{{ $spfIncludeDomain }}</code> の TXT は設定済み）。</li>
                      @endif
                    </ul>
                  </x-help-section>
                  @endif
                </div>

                <div class="border-top pt-3 mt-3">
                  <div class="fw-semibold mb-2">この認証ドメインでのテスト送信</div>
                  <p class="small text-muted mb-2 lh-base">
                    DNS を保存しても、反映に時間がかかることがあります。まずは<strong>メールが届くか</strong>をここで確認します。
                  </p>
                  @if($domainTestAccounts->isEmpty())
                    <div class="alert alert-light border small mb-0">
                      まだテストができません。先に <a href="{{ $fromSetup ? route('account.index', ['setup_channel' => 'mail']) : route('account.index') }}">{{ $fromSetup ? 'メール設定' : '送信用アカウント一覧' }}</a> → 「各種設定」で、送信元メールアドレスを <strong>@ 以降が <code>{{ $domain->domain }}</code></strong> になるようにして保存してください。<br>例: <code>info@__DOMAIN__</code> / <code>mail@__DOMAIN__</code> / <code>noreply@__DOMAIN__</code><br>保存後、この行を開き直すとここにテスト欄が出ます。
                    </div>
                  @else
                    <form method="POST" action="{{ route('account.dkim.mail-test') }}" class="row g-2 align-items-end">
                      @csrf
                      @if($fromSetup)<input type="hidden" name="from_setup" value="1">@endif
                      <input type="hidden" name="mail_domain_id" value="{{ $domain->id }}">
                      <div class="col-12 col-md-5">
                        <label class="form-label small mb-1">送信用アカウント（このドメインの送信元）</label>
                        <select name="account_id" class="form-select form-select-sm @error('account_id') is-invalid @enderror" required>
                          <option value="" disabled @selected((string) old('mail_domain_id') === (string) $domain->id && old('account_id') === null)>選択してください</option>
                          @foreach($domainTestAccounts as $a)
                            <option value="{{ $a->id }}" @selected((string) old('mail_domain_id') === (string) $domain->id && (string) old('account_id') === (string) $a->id)>{{ $a->name }}</option>
                          @endforeach
                        </select>
                        @error('account_id')<div class="invalid-feedback d-block">{{ $message }}</div>@enderror
                      </div>
                      <div class="col-12 col-md-5">
                        <label class="form-label small mb-1">送信先メールアドレス（自分宛て）</label>
                        <input type="email" name="test_to" class="form-control form-control-sm @error('test_to') is-invalid @enderror" placeholder="you@example.com" required value="{{ (string) old('mail_domain_id') === (string) $domain->id ? old('test_to') : '' }}">
                        @error('test_to')<div class="invalid-feedback d-block">{{ $message }}</div>@enderror
                      </div>
                      <div class="col-12 col-md-2 d-grid">
                        <button type="submit" class="btn btn-primary btn-sm"><i class="bi bi-send me-1"></i>送信テスト</button>
                      </div>
                    </form>
                    <div class="form-text mt-2 mb-0">
                      「届くかどうか」の確認です。届いたら迷惑メールも確認してください。DKIM／DMARC の反映は時間がかかることがあります。
                    </div>
                  @endif
                </div>
              </div>
            </td>
          </tr>
          @endforeach
        </tbody>
      </table>
    @endif
  </div>
</div>

{{-- DNS 設定・テスト送信は「認証ドメイン一覧」の行クリックで展開表示する（アコーディオン）。 --}}

<div class="modal fade" id="addDkimDomainModal" tabindex="-1" aria-labelledby="addDkimDomainModalTitle">
  <div class="modal-dialog modal-lg modal-dialog-scrollable">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="addDkimDomainModalTitle">認証ドメインを追加</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="閉じる"></button>
      </div>
      <form method="POST" action="{{ route('account.dkim.store') }}">
        @csrf
        @if($fromSetup)<input type="hidden" name="from_setup" value="1">@endif
        <div class="modal-body">
          <div class="small mb-3">
            <div class="border rounded p-2 mb-2 bg-light">
              <p class="mb-1"><strong>① この画面ですること（かんたん・1つだけ）</strong></p>
              <p class="mb-0">下の欄に、メール送信に使うアドレスの「<strong>@の右側</strong>」（例：<code>example.com</code>）を入力して<strong>「保存」を押すだけ</strong>です。ここでの入力はこれで完了です。</p>
            </div>
            <div class="border rounded p-2 mb-0">
              <p class="mb-1"><strong>② 保存したあとにすること（DNSへ登録）</strong></p>
              <ul class="mb-0 ps-3">
                <li>保存すると、追加したドメインの<strong>「ホスト名」と「値」の表（DKIM／DMARC／SPF）が開きます</strong>。</li>
                <li>その表を、お名前.com・レンタルサーバー・Cloudflareなど<strong>ドメインを借りている会社の「DNS」画面に、同じ内容で登録</strong>します。</li>
                <li>反映まで<strong>数分〜1〜2日</strong>かかることがあります。あとからテストメールで確認できます。</li>
              </ul>
            </div>
          </div>
          <div class="alert alert-warning py-2 small mb-3">
            <strong>入力するときの注意</strong>
            <ul class="mb-0 mt-1 ps-3">
              <li><strong>自分でドメインを管理できるものだけ</strong>使えます（GmailやYahooのような<strong>無料メールのドメインは不可</strong>です）。</li>
              <li>入力するのは <code>example.com</code> のような<strong>ドメインだけ</strong>です。<code>info@example.com</code> のようにメール全体は入れないでください。</li>
            </ul>
          </div>
          <div class="mb-0">
            <label class="form-label fw-semibold">ドメイン名</label>
            <input type="text" name="domain" class="form-control @error('domain') is-invalid @enderror" placeholder="example.com" required autocomplete="off" value="{{ old('domain') }}">
            @error('domain')<div class="invalid-feedback d-block">{{ $message }}</div>@enderror
            <div class="form-text">送信に使うメールアドレスの <strong>@の右側</strong>と一致させてください。</div>
          </div>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">キャンセル</button>
          <button type="submit" class="btn btn-primary">保存</button>
        </div>
      </form>
    </div>
  </div>
</div>