/* KFHR Styled Content — shared design system
   Applies to:
   - Block editor styles: is-style-kfhr-box / is-style-kfhr-list / is-style-kfhr-table / is-style-kfhr-note / is-style-kfhr-heading
   - Shortcode output:    [kfhr_box] [kfhr_list] [kfhr_table]
*/

@import url('https://fonts.googleapis.com/css2?family=Work+Sans:wght@400;600;700&display=swap');

/* ---------------------------------------------------------------------
 * Info box  (Group block > Styles > "KFHR Info Box", or [kfhr_box])
 * ------------------------------------------------------------------ */
.wp-block-group.is-style-kfhr-box,
.kfhr-box {
	background: #f0f9f5;
	border: 1px solid #00612C;
	border-radius: 8px;
	padding: 25px 30px;
	margin: 30px 0;
	font-family: 'Work Sans', sans-serif;
	color: #003018;
	font-size: 17px;
	line-height: 1.65;
	box-sizing: border-box;
}
.wp-block-group.is-style-kfhr-box h1,
.wp-block-group.is-style-kfhr-box h2,
.wp-block-group.is-style-kfhr-box h3,
.wp-block-group.is-style-kfhr-box h4,
.kfhr-box h3 {
	color: #00612C;
	font-weight: 700;
	font-size: 22px;
	margin-top: 0;
	margin-bottom: 18px;
	border-bottom: 2px solid #00612C;
	padding-bottom: 6px;
}
.wp-block-group.is-style-kfhr-box p,
.kfhr-box p {
	margin-bottom: 18px;
}
.wp-block-group.is-style-kfhr-box > :last-child,
.kfhr-box > :last-child {
	margin-bottom: 0;
}

/* ---------------------------------------------------------------------
 * Document list  (List block > Styles > "KFHR Document List", or [kfhr_list])
 * ------------------------------------------------------------------ */
.kfhr-list-wrap {
	margin-top: 10px;
	margin-bottom: 25px;
}
.wp-block-list.is-style-kfhr-list,
.kfhr-list {
	list-style: none;
	margin: 10px 0 25px 0;
	padding: 0;
}
.wp-block-list.is-style-kfhr-list li,
.kfhr-list-item {
	background: #d7ecd9;
	border-left: 6px solid #00612C;
	padding: 12px 18px;
	margin-bottom: 12px;
	font-weight: 600;
	color: #00491A;
	border-radius: 6px;
	font-size: 16px;
	line-height: 1.4;
	list-style: none;
	transition: background-color 0.3s ease;
}
.wp-block-list.is-style-kfhr-list li:hover,
.kfhr-list-item:hover {
	background-color: #c4e3c4;
}

/* Optional icons.
   Shortcode: prefix a line with memo:: / doc:: / money::
   Block editor: select a list item, open Advanced > "Additional CSS class(es)"
   and add icon-memo / icon-doc / icon-money */
.wp-block-list.is-style-kfhr-list li.icon-memo,
.kfhr-list-item[data-icon="memo"],
.wp-block-list.is-style-kfhr-list li.icon-doc,
.kfhr-list-item[data-icon="doc"],
.wp-block-list.is-style-kfhr-list li.icon-money,
.kfhr-list-item[data-icon="money"] {
	padding-left: 40px;
	position: relative;
}
.wp-block-list.is-style-kfhr-list li.icon-memo::before,
.kfhr-list-item[data-icon="memo"]::before {
	content: "📝";
}
.wp-block-list.is-style-kfhr-list li.icon-doc::before,
.kfhr-list-item[data-icon="doc"]::before {
	content: "📄";
}
.wp-block-list.is-style-kfhr-list li.icon-money::before,
.kfhr-list-item[data-icon="money"]::before {
	content: "💰";
}
.wp-block-list.is-style-kfhr-list li.icon-memo::before,
.wp-block-list.is-style-kfhr-list li.icon-doc::before,
.wp-block-list.is-style-kfhr-list li.icon-money::before,
.kfhr-list-item[data-icon]::before {
	position: absolute;
	left: 10px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 18px;
}

/* ---------------------------------------------------------------------
 * Table  (Table block > Styles > "KFHR Green Table", or [kfhr_table])
 * ------------------------------------------------------------------ */
.wp-block-table.is-style-kfhr-table table,
table.kfhr-table {
	width: 100%;
	border-collapse: collapse;
	margin: 20px 0 30px 0;
	font-size: 16px;
	color: #003018;
	font-family: 'Work Sans', sans-serif;
}
.wp-block-table.is-style-kfhr-table th,
.wp-block-table.is-style-kfhr-table td,
table.kfhr-table th,
table.kfhr-table td {
	border: 1px solid #cde5d0;
	padding: 12px 16px;
	text-align: left;
}
.wp-block-table.is-style-kfhr-table th,
table.kfhr-table th {
	background: #00612C;
	color: #fff;
	font-weight: 600;
}
.wp-block-table.is-style-kfhr-table tbody tr:nth-child(odd),
table.kfhr-table tbody tr:nth-child(odd) {
	background: #e6f2eb;
}
.wp-block-table.is-style-kfhr-table tbody tr:hover,
table.kfhr-table tbody tr:hover {
	background: #c4e3c4;
}

/* ---------------------------------------------------------------------
 * Note / footnote text  (Paragraph block > Styles > "KFHR Note")
 * ------------------------------------------------------------------ */
.is-style-kfhr-note,
.kfhr-note {
	color: #00491A;
	font-style: italic;
	font-size: 15px;
}

/* ---------------------------------------------------------------------
 * Section heading  (Heading block > Styles > "KFHR Section Heading")
 * ------------------------------------------------------------------ */
.is-style-kfhr-heading {
	color: #00612C;
	font-family: 'Work Sans', sans-serif;
	font-weight: 700;
	border-bottom: 2px solid #00612C;
	padding-bottom: 6px;
}

/* ---------------------------------------------------------------------
 * Responsive
 * ------------------------------------------------------------------ */
@media (max-width: 768px) {
	.wp-block-group.is-style-kfhr-box,
	.kfhr-box {
		padding: 20px;
		font-size: 16px;
	}
	.wp-block-list.is-style-kfhr-list li,
	.kfhr-list-item {
		font-size: 15px;
		padding: 10px 14px;
	}
	.wp-block-table.is-style-kfhr-table th,
	.wp-block-table.is-style-kfhr-table td,
	table.kfhr-table th,
	table.kfhr-table td {
		font-size: 14px;
		padding: 10px 12px;
	}
}