/*
 * 睡眠の学校 共通部品：デザイントークン（睡眠の学校 設計書 2：紺・ラベンダー系。月の黄 warm は装飾だけで文字に使わない）とクリニックカード（inc/clinics.php）
 * ガイド系固定ページ（inc/guide.php）と記事（inc/article-end.php）の両方で読み込む。
 * トークンは body.slr-guide-page（ガイド）と .slr-end（記事末尾モジュール）の中だけで有効。
 */
.slr-guide-page,
.slr-end {
	--slr-base: #3e4e95;
	--slr-base-dark: #2b376e;
	--slr-accent: #5a6bc0;
	--slr-label: #4a5aa8;
	--slr-warm: #f2c14e;
	--slr-soft: #e6e8f5;
	--slr-mist: #eef0f8;
	--slr-ground: #f6f7fb;
	--slr-paper: #f8f9fc;
	--slr-ink: #232a44;
	--slr-muted: #454b63;
	--slr-muted2: #585e7a;
	--slr-line: #d7daea;
	--slr-alert: #c41e1e;
	--slr-alert-edge: #7a0f0f;
	--slr-shadow: 0 4px 14px rgba(43, 55, 110, .06);
	--slr-step: 0 6px 0 #cdd2ea;
	--slr-display: "Zen Kaku Gothic New", "Noto Sans JP", sans-serif;
	--slr-latin: "Jost", "Noto Sans JP", sans-serif;
}

/* ---------- クリニックカード ---------- */
.post_content ul.slr-clinics,
ul.slr-clinics {
	margin: 0;
	padding: 0;
	list-style: none;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 16px;
}
.post_content ul.slr-clinics > li.slr-clinic,
li.slr-clinic {
	margin: 0;
	padding: 24px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	border-radius: 20px;
	background: #fff;
	box-shadow: var(--slr-step);
}
.post_content ul.slr-clinics > li.slr-clinic::before {
	content: none;
}
.slr-clinic__tag {
	align-self: flex-start;
	padding: 4px 10px;
	border-radius: 999px;
	background: var(--slr-soft);
	color: var(--slr-base);
	font-size: .75rem;
	font-weight: 700;
}
.slr-clinic__name {
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.55;
}
.slr-clinic__area {
	font-size: .75rem;
	font-weight: 700;
	color: var(--slr-label);
}
.slr-clinic__desc {
	font-size: .8125rem;
	line-height: 1.75;
	color: var(--slr-muted);
}
a.slr-clinic__btn {
	margin-top: auto;
	padding: 13px;
	min-height: 44px;
	box-sizing: border-box;
	border-radius: 999px;
	background: var(--slr-base);
	color: #fff !important;
	font-size: .875rem;
	font-weight: 700;
	text-align: center;
	text-decoration: none;
}
a.slr-clinic__btn:hover {
	background: var(--slr-base-dark);
}
.slr-clinics__note {
	margin: 1.2em 0 0 !important;
	font-size: .75rem;
	line-height: 1.8;
	color: var(--slr-muted);
}
.slr-clinics--compact {
	grid-template-columns: 1fr !important;
	gap: 12px !important;
}
.slr-clinics--compact .slr-clinic {
	padding: 16px 18px !important;
	box-shadow: 0 4px 0 #cdd2ea !important;
}

/* ---------- 他のクリニックを探す（ガイド・トップ・受診チェック。記事末尾は *-article-end.css） ---------- */
.slr-find {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 8px 16px;
	margin: 1.4em 0 0;
	padding-top: 1.2em;
	border-top: 1px solid var(--slr-line, #d7daea);
	font-size: .875rem;
	line-height: 1.7;
}
.slr-find__lead {
	color: var(--slr-muted, #454b63);
}
a.slr-find__link {
	display: inline-flex;
	align-items: center;
	gap: .4em;
	min-height: 44px;
	padding: 0 20px;
	border: 1.5px solid var(--slr-base, #3e4e95);
	border-radius: 999px;
	background: #fff;
	color: var(--slr-base, #3e4e95);
	font-weight: 700;
	text-decoration: none;
}
a.slr-find__link::after {
	content: "\2192";
}
a.slr-find__link:hover,
a.slr-find__link:focus-visible {
	background: var(--slr-base, #3e4e95);
	color: #fff;
}