/**
 * 請求書PDF用スタイル（mPDF 互換に限定：table / ブロック / 罫線中心）。
 * テンプレートからインライン読み込みする。差し替え可能。
 *
 * 余白は class-pdf.php（左右18mm / 上下16mm）で設定。
 * ここでの 100% は本文領域いっぱい（210 - 36 = 174mm）を指す。
 * 罫線は細め・上品を基本方針とする（構造線=1pt / 表=0.75pt / 補助=0.5pt）。
 */

* {
	box-sizing: border-box;
}

body {
	font-family: notosansjp, sans-serif;
	font-size: 10.5pt;
	color: #1a1a1a;
	margin: 0;
	/* 落ち着いた帳票らしい行間（広すぎず狭すぎず）。 */
	line-height: 1.55;
}

.wcjbp-doc {
	width: 100%;
}

/* ── 見出し：中央揃え・本文幅いっぱいの細い罫線 ─────────────── */
.wcjbp-title-wrap {
	width: 100%;
	text-align: center;
	border-bottom: 1pt solid #2b2b2b;
	padding-bottom: 7px;
	margin-bottom: 20px;
}

.wcjbp-title {
	margin: 0;
	font-size: 24pt;
	font-weight: bold;
	letter-spacing: 0.5em;
	/* 末尾字間で右へ寄るのを相殺し視覚的に中央へ。 */
	padding-left: 0.5em;
}

/* ── 注文番号・発行日：左上・1行連続文字列（セル分割しない） ── */
.wcjbp-meta-block {
	margin-bottom: 20px;
}

.wcjbp-meta-row {
	font-size: 9.5pt;
	color: #555;
	margin-bottom: 3px;
}

/* ── 当事者：左＝宛名 / 右＝発行元（右寄せ） ───────────────── */
.wcjbp-parties {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 26px;
}

.wcjbp-parties td {
	vertical-align: top;
	padding: 0;
}

.wcjbp-col-billto {
	width: 56%;
	padding-right: 18px;
}

.wcjbp-col-issuer {
	width: 44%;
	text-align: right;
	/* 左カラムは「宛名」ラベルの分だけ会社名が下がるため、
	   発行元も同程度下げて開始高さを揃える（下げすぎない）。 */
	padding-top: 22px;
}

.wcjbp-section-label {
	font-size: 9pt;
	color: #888;
	margin-bottom: 6px;
	letter-spacing: 0.08em;
}

.wcjbp-bill-company {
	font-size: 11pt;
	color: #333;
	margin-bottom: 3px;
}

/* 宛名：氏名は大きめ太字、敬称「様」は少し小さめだが太字は維持。 */
.wcjbp-recipient {
	border-bottom: 1pt solid #999999;
	padding-bottom: 6px;
}

.wcjbp-recipient-name {
	font-size: 16pt;
	font-weight: bold;
	color: #1a1a1a;
}

.wcjbp-recipient-suffix {
	/* サイズはテンプレート側 inline style（12pt）で確実化。
	   太字は維持し、弱く見えない上品な敬称にする。
	   氏名との間隔は mPDF がインライン margin を無視するため、
	   テンプレート側の &nbsp;（半角スペース）で確実に確保する。 */
	font-weight: bold;
	color: #333333;
}

/*
 * 氏名行と住所の間の余白。mPDF は行ボックス高さを font-size 基準で
 * 決めるため、line-height ではなく font-size で確実に高さを作る
 * （&nbsp; を1行置く＝約 font-size×1.2 の空白が必ず出る）。
 */
.wcjbp-bill-gap {
	font-size: 17px;
	line-height: 17px;
	color: #ffffff;
}

.wcjbp-bill-address {
	font-size: 9.5pt;
	color: #444;
	/* 行間はテンプレート側の inline style（line-height:1.8）で確実化。 */
}

.wcjbp-logo {
	max-height: 54px;
	max-width: 200px;
	margin-bottom: 8px;
}

.wcjbp-company-name {
	font-weight: bold;
	font-size: 12pt;
	margin-bottom: 3px;
}

.wcjbp-company-address {
	font-size: 9.5pt;
	color: #444;
	line-height: 1.6;
}

/* ── 明細表：本文幅いっぱい・細めで上品な罫線 ──────────────── */
.wcjbp-items-table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 26px;
}

.wcjbp-items-table th {
	background: #f5f5f5;
	color: #222;
	border: 0.75pt solid #cccccc;
	border-bottom: 1pt solid #999999;
	padding: 9px 12px;
	font-size: 10pt;
	font-weight: bold;
	text-align: left;
}

.wcjbp-items-table td {
	border: 0.75pt solid #d8d8d8;
	padding: 10px 12px;
	font-size: 10.5pt;
}

.wcjbp-items-table th.wcjbp-col-qty,
.wcjbp-items-table td.wcjbp-col-qty {
	text-align: center;
	width: 70px;
}

.wcjbp-items-table th.wcjbp-col-amount,
.wcjbp-items-table td.wcjbp-col-amount {
	text-align: right;
	width: 130px;
	white-space: nowrap;
}

/* ── 合計：外側スペーサ表で右側へ寄せ、幅を十分に取る ─────── */
.wcjbp-totals-outer {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 8px;
}

.wcjbp-totals-outer td {
	vertical-align: top;
	padding: 0;
}

.wcjbp-totals-spacer {
	width: 50%;
}

.wcjbp-totals-cell {
	width: 50%;
}

.wcjbp-totals-table {
	width: 100%;
	border-collapse: collapse;
}

.wcjbp-totals-table td {
	padding: 8px 4px;
	font-size: 10.5pt;
	border-bottom: 0.5pt solid #e5e5e5;
}

.wcjbp-totals-label {
	color: #555;
	text-align: left;
	white-space: nowrap;
	padding-right: 20px;
}

.wcjbp-totals-value {
	text-align: right;
	white-space: nowrap;
}

.wcjbp-grand-total td {
	font-size: 15pt;
	font-weight: bold;
	color: #1a1a1a;
	border-top: 1pt solid #2b2b2b;
	border-bottom: none;
	padding-top: 11px;
	padding-bottom: 4px;
}

.wcjbp-grand-total .wcjbp-totals-label {
	color: #1a1a1a;
	font-size: 12pt;
	white-space: nowrap;
}

/* ── フッター注記：本文幅いっぱいの細い上罫線・中央・薄め ──── */
.wcjbp-foot-note {
	margin-top: 34px;
	padding-top: 10px;
	border-top: 0.75pt solid #dcdcdc;
	font-size: 8pt;
	color: #9a9a9a;
	text-align: center;
	letter-spacing: 0.04em;
}
