/* ASMR タグフィルター: Findページ導線 専用CSS(スコープ: .asmr-find-nav配下のみ。既存SWELL/タグページCSSへ影響させない) */

.asmr-find-nav {
	--asmr-find-nav-border: #e0e4e8;
	--asmr-find-nav-bg: #f7f9fb;
	--asmr-find-nav-accent: #1e73be;
	--asmr-find-nav-text: #333333;
	box-sizing: border-box;
	max-width: 100%;
	margin: 1.5em 0;
	color: var( --asmr-find-nav-text );
}

.asmr-find-nav__inner {
	box-sizing: border-box;
	background: var( --asmr-find-nav-bg );
	border: 1px solid var( --asmr-find-nav-border );
	border-radius: 8px;
	padding: 1em 1.25em;
}

.asmr-find-nav__title {
	margin: 0 0 0.4em;
	font-size: 1.02em;
	font-weight: 700;
	line-height: 1.4;
}

.asmr-find-nav__text {
	margin: 0 0 0.9em;
	font-size: 0.88em;
	line-height: 1.6;
	color: #555555;
}

.asmr-find-nav__button {
	display: inline-block;
	box-sizing: border-box;
	width: auto;
	max-width: 100%;
	padding: 0.7em 1.5em;
	border-radius: 6px;
	background: var( --asmr-find-nav-accent );
	color: #ffffff !important;
	font-size: 0.92em;
	font-weight: 700;
	text-align: center;
	text-decoration: none !important;
	line-height: 1.4;
	transition: opacity 0.2s ease;
}

.asmr-find-nav__button:hover,
.asmr-find-nav__button:focus {
	opacity: 0.85;
	color: #ffffff !important;
}

/* ---------- 個別記事上部 ---------- */

.asmr-find-nav--single .asmr-find-nav__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.25em 1.5em;
}

.asmr-find-nav--single .asmr-find-nav__title,
.asmr-find-nav--single .asmr-find-nav__text {
	flex: 1 1 100%;
}

@media screen and (min-width: 780px) {
	.asmr-find-nav--single .asmr-find-nav__title,
	.asmr-find-nav--single .asmr-find-nav__text {
		flex: 1 1 auto;
		margin-bottom: 0;
	}
	.asmr-find-nav--single .asmr-find-nav__button {
		flex: 0 0 auto;
		margin-left: auto;
	}
}

/* ---------- タグページ上部 ---------- */

.asmr-find-nav--tag .asmr-find-nav__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.25em 1.5em;
}

.asmr-find-nav--tag .asmr-find-nav__title,
.asmr-find-nav--tag .asmr-find-nav__text {
	flex: 1 1 100%;
}

@media screen and (min-width: 780px) {
	.asmr-find-nav--tag .asmr-find-nav__title,
	.asmr-find-nav--tag .asmr-find-nav__text {
		flex: 1 1 auto;
		margin-bottom: 0;
	}
	.asmr-find-nav--tag .asmr-find-nav__button {
		flex: 0 0 auto;
		margin-left: auto;
	}
}

/* ---------- トップページ ---------- */

.asmr-find-nav--home {
	margin: 1.5em auto 2em;
}

.asmr-find-nav--home .asmr-find-nav__inner {
	max-width: 900px;
	margin: 0 auto;
	text-align: center;
	padding: 1.5em 1.25em;
}

.asmr-find-nav--home .asmr-find-nav__title {
	font-size: 1.15em;
}

.asmr-find-nav--home .asmr-find-nav__button {
	padding: 0.8em 2.2em;
}

/* ---------- スマートフォン ---------- */

@media screen and (max-width: 599px) {
	.asmr-find-nav__inner {
		padding: 0.9em 1em;
	}
	.asmr-find-nav__button {
		display: block;
		width: 100%;
	}
}

/* ---------- グローバルメニュー(フォールバック追加時のみ使用) ---------- */

.asmr-find-nav-menu-item > a {
	display: inline-block;
}

/* ---------- タグアーカイブのページネーション配色統一(Find/特集ページと合わせる) ----------
   タグアーカイブはSWELLテーマ標準の .c-pagination を使用しており、Find/特集ページの
   .asmr-filter__pagination(WP標準paginate_links()ベース)とは別のHTML構造・クラス名。
   通常のカテゴリーページ・検索結果・個別記事などへ影響しないよう、WP標準のタグ
   アーカイブ判定用body class(#body_wrap.tag)を親セレクタとして必ず併用する
   (.c-pagination単体はテーマの他のアーカイブでも使われる共通クラスのため)。
   色は既存の --asmr-filter-accent と同じ値を使う(新規色コードは追加していない)。 */

#body_wrap.tag .c-pagination {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4em;
	align-items: center;
}

#body_wrap.tag .c-pagination a.page-numbers,
#body_wrap.tag .c-pagination span.page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.2em;
	min-height: 2.2em;
	padding: 0 0.5em;
	border-radius: 6px;
	text-decoration: none;
	font-size: 0.9em;
	box-sizing: border-box;
}

#body_wrap.tag .c-pagination a.page-numbers {
	background: #fff;
	color: var( --asmr-filter-accent, #d63864 );
	border: 1px solid var( --asmr-filter-accent, #d63864 );
}

#body_wrap.tag .c-pagination a.page-numbers:hover {
	background: color-mix( in srgb, var( --asmr-filter-accent, #d63864 ) 12%, #fff );
	color: var( --asmr-filter-accent, #d63864 );
}

#body_wrap.tag .c-pagination span.page-numbers.current {
	background: var( --asmr-filter-accent, #d63864 );
	border: 1px solid var( --asmr-filter-accent, #d63864 );
	color: #fff;
}

/* 省略記号(…): ボタンに見せない(枠線・背景なしの控えめな表示のまま)。 */
#body_wrap.tag .c-pagination__dot {
	border: none;
	background: none;
	color: #999999;
	padding: 0 0.3em;
}