/* ═══════════════════════════════════════════════════════
   Roopt.jp — print.css
   ハウスマニュアル印刷用スタイル
   ═══════════════════════════════════════════════════════ */

@media print {

  /* ─── 非表示 ─────────────────────────────────────── */
  .site-header,
  .site-footer,
  .lang-switcher,
  .site-nav,
  .prop-breadcrumb,
  .prop-sub-header,
  .prop-subnav,
  .contact-cta,
  .prop-airbnb-cta,
  .area-search-section { display: none !important; }

  /* ─── 1ページ目の上余白を消す ─────────────────────── */
  body { margin-top: 0 !important; padding-top: 0 !important; }
  .content-page { padding-top: 0 !important; margin-top: 0 !important; }
  .content { padding-top: 0 !important; margin-top: 0 !important; }

  /* ─── ページ設定 ─────────────────────────────────── */
  @page {
    size: A4;
    /* top: タイトルと本文の間を詰めるため小さめに。right/bottom: ページ番号用に広め */
    margin: 13mm 25mm 30mm 15mm;

    @bottom-right {
      content: counter(page) " / " counter(pages);
      font-size: 9pt;
      color: #888;
      padding-bottom: 6mm;
      padding-right: 2mm;
    }
  }

  /* ─── フォント・カラー ─────────────────────────────── */
  body {
    font-family: "Hiragino Sans", "Yu Gothic", "Meiryo", sans-serif;
    font-size: 9.5pt;
    line-height: 1.45;
    color: #000;
    background: var(--bg-card);
  }

  /* ─── h2 で改ページ ──────────────────────────────── */
  .content h2 {
    page-break-before: always;
    break-before: page;
    background: var(--text-md) !important;
    color: var(--bg-card) !important;
    font-size: 13pt;
    padding: 5pt 8pt;
    margin-bottom: 10pt;
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
  }

  /* 最初の h2 は改ページしない */
  .content h2:first-of-type {
    page-break-before: avoid;
    break-before: avoid;
  }

  /* ─── h3（サブセクション） ───────────────────────── */
  .content h3 {
    font-size: 11pt;
    font-weight: bold;
    margin-top: 10pt;
    margin-bottom: 4pt;
    display: flex;
    align-items: center;
    gap: 4pt;
  }
  .content h3::before {
    content: "○";
    font-size: 9pt;
  }

  /* ─── h3 と h2 を孤立させない ───────────────────── */
  .content h2, .content h3 {
    page-break-after: avoid;
    break-after: avoid;
  }
  .content p, .content ul, .content ol {
    page-break-inside: avoid;
    break-inside: avoid;
    orphans: 2;
    widows: 2;
    margin-top: 0;
    margin-bottom: 3pt;
  }

  /* ─── テーブル ──────────────────────────────────── */
  .content table {
    width: 100%;
    border-collapse: collapse;
    font-size: 9pt;
    margin-bottom: 8pt;
  }
  .content th {
    background: var(--text-md) !important;
    color: var(--bg-card) !important;
    padding: 3pt 5pt;
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
  }
  .content td {
    padding: 3pt 5pt;
    border: 0.5pt solid var(--border-lt);
  }
  .content tr:nth-child(even) td {
    background: #f5f5f5 !important;
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
  }

  /* ─── リスト ─────────────────────────────────────── */
  .content ul, .content ol { padding-left: 14pt; }
  .content li { margin-bottom: 2pt; }

  /* ─── リンク ─────────────────────────────────────── */
  .content a { color: #000; text-decoration: none; }
  .content a[href]::after { content: ""; } /* URLを表示しない */

  /* ─── コード ─────────────────────────────────────── */
  .content code {
    font-family: monospace;
    font-size: 8pt;
    background: #f0f0f0 !important;
    padding: 1pt 3pt;
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
  }

  /* ─── hr ──────────────────────────────────────────── */
  .content hr { display: none; }

  /* ─── site-main のパディング調整 ─────────────────── */
  .site-main { padding: 0; max-width: 100%; }
  .content h1 {
    font-size: 16pt;
    font-weight: bold;
    text-align: center;
    padding: 8pt 0;
    margin-bottom: 12pt;
    border-bottom: 1.5pt solid var(--text-md);
  }
}
