/* ============================================================
 * Folge Guide Slot - スタイル
 * ============================================================ */

/* （グループ内H2の幅補正は、副作用が大きいため撤去してシンプル化。H2はテーマ既定の幅のまま。） */

/* ============================================================
 * テキストブロック（.folge-note）を Folge 本体（PDF出力）の見た目に合わせて再現
 *   ・淡い背景（Folgeがインラインで付与、尊重）
 *   ・下部に色付きの下線（角は直線）
 *   ・左に円形アイコン（種類ごとにSVG）＋太字タイトル＋グレー小見出し
 *   ※Folgeの Gutenberg 出力は border-left をインライン指定するため、!important で下線へ置換
 * ============================================================ */
.folge-note {
	display: grid !important;
	grid-template-columns: 2.4em 1fr !important;
	gap: 0 .9em !important;
	align-items: start !important;
	border: 0 !important;
	border-radius: 0 !important;
	border-bottom: 3px solid #9ca3af !important; /* 既定（黒/neutral）。種別で上書き */
	padding: .9em 1em !important;
	margin: 1em 0 !important;
}
.folge-note::before {
	grid-column: 1;
	grid-row: 1 / span 2;
	align-self: center;
	content: "";
	width: 2.2em;
	height: 2.2em;
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	/* 既定（黒/neutral）：リング＋中央塗り丸 */
	background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Ccircle%20cx='12'%20cy='12'%20r='10.5'%20fill='none'%20stroke='%23374151'%20stroke-width='1.8'/%3E%3Ccircle%20cx='12'%20cy='12'%20r='5'%20fill='%23374151'/%3E%3C/svg%3E");
}
.folge-note > * {
	grid-column: 2;
	min-width: 0;
}
.folge-note .folge-note-title {
	margin: 0 0 .15em !important;
	font-weight: 700;
	color: #1f2937;
	line-height: 1.4;
}
.folge-note p {
	margin: 0 !important;
	color: #4b5563;
	line-height: 1.5;
}
.folge-note p + p {
	margin-top: .2em !important;
}

/* --- 青（info）：塗り円＋白い i --- */
.folge-note.info { border-bottom-color: #3b82f6 !important; }
.folge-note.info::before {
	background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Ccircle%20cx='12'%20cy='12'%20r='11'%20fill='%232563eb'/%3E%3Ccircle%20cx='12'%20cy='7.6'%20r='1.5'%20fill='white'/%3E%3Crect%20x='10.8'%20y='10.6'%20width='2.4'%20height='7'%20rx='1.2'%20fill='white'/%3E%3C/svg%3E");
}

/* --- 緑（success）：リング＋チェック --- */
.folge-note.success { border-bottom-color: #22c55e !important; }
.folge-note.success::before {
	background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Ccircle%20cx='12'%20cy='12'%20r='10.5'%20fill='none'%20stroke='%2316a34a'%20stroke-width='1.8'/%3E%3Cpath%20d='M7%2012.4%20l3.2%203.2%20L17%209'%20fill='none'%20stroke='%2316a34a'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* --- 黄（warning）：三角＋！ --- */
.folge-note.warning { border-bottom-color: #eab308 !important; }
.folge-note.warning::before {
	background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20d='M12%203%20L22.5%2020.5%20L1.5%2020.5%20Z'%20fill='none'%20stroke='%23b45309'%20stroke-width='1.8'%20stroke-linejoin='round'/%3E%3Crect%20x='11'%20y='9'%20width='2'%20height='6'%20rx='1'%20fill='%23b45309'/%3E%3Ccircle%20cx='12'%20cy='17.6'%20r='1.15'%20fill='%23b45309'/%3E%3C/svg%3E");
}

/* --- 赤（error）：リング＋✕ --- */
.folge-note.error { border-bottom-color: #ef4444 !important; }
.folge-note.error::before {
	background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Ccircle%20cx='12'%20cy='12'%20r='10.5'%20fill='none'%20stroke='%23dc2626'%20stroke-width='1.8'/%3E%3Cpath%20d='M8.5%208.5%20l7%207%20M15.5%208.5%20l-7%207'%20stroke='%23dc2626'%20stroke-width='2'%20stroke-linecap='round'/%3E%3C/svg%3E");
}

/* --- 黒（dark / neutral）：既定と同じ（リング＋中央塗り丸） --- */
.folge-note.dark,
.folge-note.neutral { border-bottom-color: #9ca3af !important; }