/**
 * NEO single event styles（イベント詳細 /event/{slug}/ のみ読み込み）
 *
 * - 対象は .neo-event-detail（template-parts/event/single.php）とその本文 .neo-event-detail__content に限定する.
 * - neo-base.css の変数・部品（.neo-status / .neo-button）を前提とする.
 * - 本文（the_content()）の見せ方は固定ページ（neo-page.css）と同じ世界観にそろえる. 列の数・順番など本文の構造は決め打ちしない.
 * - 管理画面で色などを明示した要素（.has-text-color / .has-background / .has-border-color 等）はできるだけ上書きしない.
 * - スマホを基準に書き、768px で余白・文字サイズを調整する.
 * - グラデーション・発光・影・アニメーションは使わない.
 */

.neo-event-detail {
	color: var(--neo-color-text);
}

/* ==========================================================================
   1. 見出し部分（EVENT / イベント詳細・タイトル・開催状況・日時）
   ========================================================================== */

.neo-event-detail__header {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 1rem;
	margin-bottom: 2rem;
}

.neo-event-detail__label {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	margin: 0;
	line-height: 1.3;
}

.neo-event-detail__label-en {
	font-size: 1.125rem;
	font-weight: 700;
	letter-spacing: 0.16em;
	color: var(--neo-color-text);
}

.neo-event-detail__label-ja {
	font-size: 0.8125rem;
	letter-spacing: 0.04em;
	color: var(--neo-color-text-sub);
}

/* Lightning / スキンの見出し装飾を打ち消す */
.neo-event-detail__title {
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	font-size: 1.5rem;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0.02em;
	color: var(--neo-color-text);
	overflow-wrap: anywhere;
}

.neo-event-detail__title::before,
.neo-event-detail__title::after {
	content: none;
}

.neo-event-detail__datetime {
	display: flex;
	flex-wrap: wrap;
	column-gap: 0.75rem;
	row-gap: 0.125rem;
	margin: 0;
	line-height: 1.5;
}

.neo-event-detail__date {
	font-size: 1.125rem;
	font-weight: 700;
}

.neo-event-detail__time {
	font-size: 1.125rem;
}

/* ==========================================================================
   2. アイキャッチ（イベント自身の画像がある場合のみ出力）
   ========================================================================== */

/* チラシなど縦長の画像もあるため、比率は固定せず全体を表示する */
.neo-event-detail__media {
	max-width: 45rem;
	margin: 0 0 2rem;
}

.neo-event-detail__image {
	display: block;
	width: 100%;
	height: auto;
}

/* ==========================================================================
   3. 料金・BBS
   ========================================================================== */

.neo-event-detail__prices {
	max-width: 30rem;
	margin-bottom: 2rem;
	padding-top: 1rem;
	border-top: 1px solid var(--neo-color-line);
}

/* Lightning / スキンの h2 装飾（上線・下線）を打ち消す */
.neo-event-detail__section-title {
	margin: 0 0 0.75rem;
	padding: 0;
	border: 0;
	background: none;
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: 0.08em;
	color: var(--neo-color-text);
}

.neo-event-detail__section-title::before,
.neo-event-detail__section-title::after {
	content: none;
}

/* 区分名は左・金額は右 */
.neo-event-detail__price-list {
	margin: 0;
}

.neo-event-detail__price {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	padding-block: 0.5rem;
	border-bottom: 1px solid var(--neo-color-line);
}

.neo-event-detail__price dt {
	margin: 0;
	font-weight: 400;
	color: var(--neo-color-text-sub);
}

.neo-event-detail__price dd {
	margin: 0;
	font-size: 1.0625rem;
	font-weight: 700;
	color: var(--neo-color-text);
}

.neo-event-detail__price-note {
	margin: 0.75rem 0 0;
	font-size: 0.875rem;
	line-height: 1.7;
	color: var(--neo-color-text-sub);
	overflow-wrap: anywhere;
}

.neo-event-detail__actions {
	margin: 0 0 2.5rem;
}

/* ==========================================================================
   4. イベント本文（管理画面で編集した the_content()）
   ========================================================================== */

.neo-event-detail__content {
	padding-top: 2rem;
	border-top: 1px solid var(--neo-color-line);
	line-height: 1.8;
	color: var(--neo-color-text);
}

.neo-event-detail__content > :first-child {
	margin-top: 0;
}

.neo-event-detail__content > :last-child {
	margin-bottom: 0;
}

/* 見出し h2: Lightning / origin3 スキンの上線・下線をリセットし、下線1本にする */
.neo-event-detail__content h2:where(:not([class*="is-style-"]):not([class*="vk_heading"])) {
	margin: 2.5rem 0 1rem;
	border-top: 0;
	border-bottom: 1px solid var(--neo-color-line-strong);
	font-size: 1.25rem;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0.04em;
}

.neo-event-detail__content h2:where(:not([class*="is-style-"]):not([class*="vk_heading"]):not(.has-background)) {
	padding: 0 0 0.625rem;
}

/* 見出し h3: 下線と ::after の短い線（幅 30%）をリセットし、h2 より控えめにする */
.neo-event-detail__content h3:where(:not([class*="is-style-"]):not([class*="vk_heading"])) {
	margin: 2rem 0 0.75rem;
	border-bottom: 0;
	font-size: 1.0625rem;
	font-weight: 700;
	line-height: 1.5;
}

.neo-event-detail__content h3:where(:not([class*="is-style-"]):not([class*="vk_heading"]):not(.has-background)) {
	padding: 0;
}

.neo-event-detail__content h3:where(:not([class*="is-style-"]):not([class*="vk_heading"]))::after {
	content: none;
}

.neo-event-detail__content p,
.neo-event-detail__content li {
	line-height: 1.8;
}

.neo-event-detail__content :is(ul, ol):where(:not(.has-background)) {
	padding-left: 1.5em;
}

.neo-event-detail__content li + li {
	margin-top: 0.25em;
}

/* 下線は neo-base.css（.entry-body a）で指定済み. ここでは色だけを揃える */
.neo-event-detail__content a:where(:not(.btn):not(.wp-block-button__link):not(.vk_button_link):not(.has-text-color)) {
	color: var(--neo-color-text);
}

.neo-event-detail__content a:where(:not(.btn):not(.wp-block-button__link):not(.vk_button_link):not(.has-text-color)):hover {
	color: var(--neo-color-text-sub);
}

/* 引用（元はキーカラーの左線 + 薄い背景） */
.neo-event-detail__content blockquote {
	margin-block: 2rem;
	padding: 1rem 1.25rem;
	border-left: 2px solid var(--neo-color-line-strong);
}

.neo-event-detail__content blockquote:where(:not(.has-background)) {
	background-color: var(--neo-color-surface);
}

.neo-event-detail__content blockquote > :last-child {
	margin-bottom: 0;
}

.neo-event-detail__content blockquote cite {
	display: block;
	margin-top: 0.5rem;
	font-size: 0.875rem;
	font-style: normal;
	color: var(--neo-color-text-sub);
}

.neo-event-detail__content hr:where(:not(.has-background):not(.has-text-color):not(.is-style-dots)) {
	margin-block: 2.5rem;
	border: 0;
	border-top: 1px solid var(--neo-color-line);
}

.neo-event-detail__content figcaption:where(:not(.has-text-color)) {
	color: var(--neo-color-text-sub);
}

/* --------------------------------------------------------------------------
   テーブル
   WordPress 標準の .wp-block-table（figure）は overflow-x: auto を持つため、
   表が画面幅に収まらないときだけ横スクロールになる. 列の数・順番に依存する指定はしない.
   -------------------------------------------------------------------------- */

.neo-event-detail__content .wp-block-table {
	margin-block: 1.5rem 2rem;
	border-color: var(--neo-color-line);
}

/* Lightning は表の文字を小さくするため、読みやすい大きさに戻す（管理画面で文字サイズを指定した表は除く） */
.neo-event-detail__content .wp-block-table:where(:not([class*="font-size"])),
.neo-event-detail__content :where(:not(.wp-block-table)) > table :is(th, td) {
	font-size: 0.9375rem;
}

.neo-event-detail__content table:where(:not(.has-border-color)) {
	border-color: var(--neo-color-line);
}

.neo-event-detail__content :is(th, td) {
	padding: 0.625rem 0.75rem;
	line-height: 1.6;
}

.neo-event-detail__content th:where(:not(.has-text-align-center):not(.has-text-align-right)) {
	text-align: left;
}

/* 標準の見出し行・集計行の太線（3px）を細くする */
.neo-event-detail__content table:where(:not(.has-border-color)) thead {
	border-bottom: 1px solid var(--neo-color-line-strong);
}

.neo-event-detail__content table:where(:not(.has-border-color)) tfoot {
	border-top: 1px solid var(--neo-color-line-strong);
}

.neo-event-detail__content .wp-block-table figcaption {
	margin-top: 0.5rem;
	font-size: 0.8125rem;
	line-height: 1.6;
}

/* WordPress 標準「ストライプ」・VK Blocks「枠線・ストライプ」: 元は奇数行が #f0f0f0（白文字が読めない）のため暗色にする */
.neo-event-detail__content .wp-block-table.is-style-stripes {
	border-bottom-color: var(--neo-color-line);
}

.neo-event-detail__content .wp-block-table.is-style-stripes table:where(:not(.has-background)) tbody tr:nth-child(odd),
.neo-event-detail__content .wp-block-table.is-style-vk-table-border-stripes table:where(:not(.has-background)) tbody tr:nth-child(odd) {
	background-color: var(--neo-color-surface);
}

/* VK Blocks「横スクロール」: スクロール案内のアイコンを揺らすアニメーションを止め、案内の文字だけ残す */
.neo-event-detail .neo-event-detail__content .vk-scroll-hint {
	color: var(--neo-color-text-sub);
}

.neo-event-detail .neo-event-detail__content .vk-scroll-hint i:is(:first-of-type, :last-of-type) {
	animation: none;
}

/* ==========================================================================
   5. イベント一覧へ戻る
   ========================================================================== */

.neo-event-detail__back {
	margin: 3rem 0 0;
	padding-top: 2rem;
	border-top: 1px solid var(--neo-color-line);
}

/* ==========================================================================
   6. 768px 以上
   ========================================================================== */

@media (min-width: 768px) {
	.neo-event-detail__header {
		margin-bottom: 2.5rem;
	}

	.neo-event-detail__label-en {
		font-size: 1.25rem;
	}

	.neo-event-detail__title {
		font-size: 2rem;
	}

	.neo-event-detail__media {
		margin-bottom: 2.5rem;
	}

	.neo-event-detail__prices {
		margin-bottom: 2.5rem;
	}

	.neo-event-detail__content h2:where(:not([class*="is-style-"]):not([class*="vk_heading"])) {
		margin-top: 3rem;
		font-size: 1.375rem;
	}

	.neo-event-detail__content h3:where(:not([class*="is-style-"]):not([class*="vk_heading"])) {
		font-size: 1.125rem;
	}

	.neo-event-detail__content .wp-block-table:where(:not([class*="font-size"])),
	.neo-event-detail__content :where(:not(.wp-block-table)) > table :is(th, td) {
		font-size: 1rem;
	}

	.neo-event-detail__content :is(th, td) {
		padding: 0.75rem 1rem;
	}
}