/**
 * 固定ページ（お問い合わせ / 特定商取引法に基づく表記 / プライバシーポリシー 等）専用スタイル
 *
 * WHY: 親テーマ Kadence の固定ページテンプレート（page.php）は編集せず、
 *      本文（.entry-content.single-content）の読みやすさだけをここで調整する。
 *      is_page() でのみ読み込むため、LP（front-page.php）・ブログ下層・
 *      商品詳細ページには影響しない。色・spacing は tokens.css の --ds-*
 *      を使い、直値のハードコードを避ける。本文内 h1 は作らない運用の
 *      ため、h1 のスタイルはここで定義しない（親テーマのページタイトルが h1）。
 */

/* ==========================================================================
   本文幅・タイポ
   ========================================================================== */

.entry-content.single-content {
	max-width: var(--ds-content);
	margin-left: auto;
	margin-right: auto;
}

.entry-content.single-content h2 {
	margin: var(--ds-space-heading-content) 0 var(--ds-space-heading-sub);
	color: var(--ds-fg);
	font-size: var(--ds-font-xl);
	font-weight: 700;
	line-height: 1.4;
}

.entry-content.single-content h2:first-child {
	margin-top: 0;
}

.entry-content.single-content h3 {
	margin: 32px 0 12px;
	color: var(--ds-fg);
	font-size: var(--ds-font-lg);
	font-weight: 700;
	line-height: 1.5;
}

.entry-content.single-content p {
	margin: 0 0 16px;
	color: var(--ds-fg-soft);
	line-height: 1.9;
}

.entry-content.single-content ul,
.entry-content.single-content ol {
	margin: 0 0 16px;
	padding-left: 1.5em;
	color: var(--ds-fg-soft);
	line-height: 1.9;
}

/* ==========================================================================
   表（特定商取引法の項目表）
   ========================================================================== */

.entry-content.single-content table {
	width: 100%;
	margin: 24px 0;
	border-collapse: collapse;
	font-size: var(--ds-font-base);
}

.entry-content.single-content table th,
.entry-content.single-content table td {
	padding: 16px;
	border: 1px solid var(--ds-line);
	text-align: left;
	vertical-align: top;
	line-height: 1.8;
}

.entry-content.single-content table th,
.entry-content.single-content table td:first-child {
	width: 30%;
	background-color: var(--ds-bg-soft);
	color: var(--ds-fg);
	font-weight: 700;
	white-space: nowrap;
}

@media (max-width: 767px) {
	.entry-content.single-content table,
	.entry-content.single-content table tbody,
	.entry-content.single-content table tr,
	.entry-content.single-content table th,
	.entry-content.single-content table td {
		display: block;
		width: 100%;
	}

	.entry-content.single-content table th,
	.entry-content.single-content table td:first-child {
		white-space: normal;
		border-bottom: none;
	}

	.entry-content.single-content table td:last-child {
		border-top: none;
		margin-bottom: 8px;
	}
}

/* ==========================================================================
   注意書き（blockquote / 補足段落）
   ========================================================================== */

.entry-content.single-content blockquote {
	margin: 24px 0;
	padding: 16px 20px;
	background-color: var(--ds-bg-soft);
	border-left: 4px solid var(--ds-brand);
	color: var(--ds-fg-soft);
	font-size: var(--ds-font-sm);
	line-height: 1.8;
}

.entry-content.single-content blockquote p:last-child {
	margin-bottom: 0;
}

/* ==========================================================================
   フォーム周り（お問い合わせページ）
   ========================================================================== */

/*
 * WHY: フォーム本体（.ds-contact-form 系）とフォールバックのテキスト・レイアウト
 *      （.ds-contact__fallback 系、LP と共通の見た目）は assets/css/contact-form.css
 *      へ一本化した（functions.php で page.css より先に読み込む）。ここには
 *      「Kadence のページタイトル直下に来る」という固定ページ固有の事情による
 *      上余白の調整だけを残す。
 */
.entry-content.single-content .wpcf7,
.entry-content.single-content .ds-contact__fallback {
	margin-top: 24px;
}

/*
 * WHY: フォールバックの電話・メールボタン（.ds-btn 系）は front.css で
 *      定義されているが、front.css は is_front_page() 限定で読み込むため
 *      固定ページには効かない。front.css は変更せず、ここで最小限だけ
 *      同じ配色・コントラスト値（front.css の WHY コメント参照）を複製する。
 */
.entry-content.single-content .ds-btn {
	display: inline-block;
	padding: 14px 32px;
	border: 2px solid var(--ds-cta-surface);
	border-radius: var(--ds-radius-md);
	font-weight: 700;
	text-align: center;
	text-decoration: none;
	transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

.entry-content.single-content .ds-btn:focus-visible {
	outline: 3px solid var(--ds-fg);
	outline-offset: 3px;
}

.entry-content.single-content .ds-btn-primary {
	background-color: var(--ds-cta-surface);
	border-color: var(--ds-cta-surface);
	color: #fff;
	font-size: clamp(19px, 1.31vw, 22px);
}

.entry-content.single-content .ds-btn-primary:hover {
	background-color: var(--ds-cta-surface-hover);
	border-color: var(--ds-cta-surface-hover);
	color: #fff;
}

.entry-content.single-content .ds-btn-secondary {
	background-color: #fff;
	color: var(--ds-cta-ink);
	border-color: var(--ds-cta-ink);
}

.entry-content.single-content .ds-btn-secondary:hover {
	background-color: var(--ds-cta-ink);
	border-color: var(--ds-cta-ink);
	color: #fff;
}

/* ==========================================================================
   カートページ: 空カートメッセージ
   ========================================================================== */

/*
 * WHY (2026-09-27): WooCommerce Cart ブロック標準の空カート表示（黒い泣き顔
 *      アイコン・英語文言「Your cart is currently empty!」・点線区切り・
 *      「New in store」）はサイトのトーン（オレンジ・白・クリーム、角丸
 *      カード、ダス犬マスコット、丸ゴシック見出し）と合っていなかった。
 *      文言・画像・ボタンは post_content 側（固定ページ「カート」の
 *      `wp:woocommerce/empty-cart-block` innerBlocks）を Woo 標準の編集方法
 *      どおり書き換え済み（アイコン用クラス `with-empty-cart-icon` も
 *      post_content 側で外したため、ここでアイコンを打ち消す必要はない）。
 *      ここでは配置・余白のみを調整する。ボタンは既存の `.ds-btn` /
 *      `.ds-btn-primary`（本ファイル上部、front.css の複製）をそのまま使う。
 */
.entry-content.single-content .wp-block-woocommerce-empty-cart-block {
	padding-top: 24px;
	text-align: center;
}

.entry-content.single-content .ds-cart-empty__mascot img {
	display: block;
	width: 150px;
	height: auto;
	margin: 0 auto 16px;
}

.entry-content.single-content .wc-block-cart__empty-cart__title {
	margin-top: 0;
}

.entry-content.single-content .ds-cart-empty__lead {
	max-width: 32em; /* 1 行に収める（420px だと「す。」だけ折り返した 2026-09-27） */
	word-break: auto-phrase; /* SP で「ご自宅ま／で」と語中で割れたため文節単位で折り返す（Chrome 119+。非対応ブラウザは従来どおり） */
	margin: 0 auto 24px;
}

/*
 * WHY: 元の点線区切り（`wp:separator is-style-dots`）は削除した。代わりに
 *      「おすすめ商品」見出しの上へ薄い罫線（既存トークン --ds-line）だけを
 *      足してセクションの切れ目を示す。新しい装飾素材は作らない。
 */
.entry-content.single-content .ds-cart-empty__products-title {
	margin-top: 40px;
	padding-top: 32px;
	border-top: 1px solid var(--ds-line);
}

@media (max-width: 767px) {
	.entry-content.single-content .ds-cart-empty__products-title {
		margin-top: 32px;
		padding-top: 24px;
	}
}

/* ==========================================================================
   カート・注文手続きページ: 配送エリア・数量上限の注記
   ========================================================================== */

/*
 * WHY (2026-09-28): 販売条件（東京都内のみ・1回の合計10セットまで）を
 *      Cart / Checkout ブロックの直前に控えめな注記として出す
 *      （inc/order-rules.php kdc_prepend_order_notes_to_cart_blocks()）。
 *      商品ページの同じ注記（product.css の .ds-order-notes）と見た目を揃える。
 *      「※」は CSS で付け、読み上げには含めない。
 */
.entry-content.single-content .ds-order-notes {
	margin: 0 0 24px;
	padding: 0;
	list-style: none;
	color: var(--ds-fg-soft);
	font-size: var(--ds-font-sm);
	line-height: 1.7;
}

.entry-content.single-content .ds-order-notes__item::before {
	content: "※";
	content: "※" / "";
}