/*
 * AUK Blog improvements — v1.0.0
 * Card styling copies the existing Elementor Posts widget on /get-involved/blogs/
 * (mint background, 3px grey border, 61px corners). If the cards are restyled in
 * Elementor, update the values under "Cards" here to match.
 * Every rule is scoped under .auk-blog so the Elementor kit's global heading,
 * link and button styles don't override it.
 */

.auk-blog {
	--auk-teal: #076264;
	--auk-teal-dark: #054c4e;
	--auk-mint: #effffa;
	--auk-card-border: #69727d;
	--auk-tag-bg: #d6eeea;
	font-family: Poppins, sans-serif;
	scroll-margin-top: 140px;
}

/* ---------- Search ---------- */
.auk-blog .auk-blog-search {
	display: flex;
	align-items: center;
	max-width: 900px;
	margin: 10px auto 40px;
	padding: 4px 4px 4px 22px;
	border: 2px solid var(--auk-teal);
	border-radius: 40px;
	background: #fff;
}
.auk-blog .auk-blog-search input[type="search"] {
	flex: 1;
	min-width: 0;
	margin: 0;
	padding: 8px 0;
	border: 0;
	border-radius: 0;
	outline: none;
	box-shadow: none;
	background: transparent;
	font-family: inherit;
	font-size: 15px;
	color: #333;
}
.auk-blog .auk-blog-search button {
	margin: 0;
	padding: 10px 26px;
	border: 0;
	border-radius: 30px;
	background: var(--auk-teal);
	color: #fff;
	font-family: inherit;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.2;
	cursor: pointer;
}
.auk-blog .auk-blog-search button:hover,
.auk-blog .auk-blog-search button:focus {
	background: var(--auk-teal-dark);
	color: #fff;
}
.auk-blog .auk-blog-search:focus-within { box-shadow: 0 0 0 3px rgba(7, 98, 100, .2); }

/* ---------- Layout: categories left, cards right ---------- */
.auk-blog .auk-blog-layout {
	display: grid;
	grid-template-columns: 270px minmax(0, 1fr);
	gap: 40px;
	align-items: start;
}

/* ---------- Categories ---------- */
.auk-blog .auk-blog-cats {
	padding: 22px 24px;
	border: 1px solid #e4e4e4;
	border-radius: 12px;
	background: #fff;
}
.auk-blog .auk-blog-cats__title {
	margin: 0 0 8px;
	padding-bottom: 10px;
	border-bottom: 2px solid var(--auk-teal);
	font-family: Poppins, sans-serif;
	font-size: 17px;
	font-weight: 600;
	line-height: 1.3;
	color: #000;
}
.auk-blog .auk-blog-cats ul { list-style: none; margin: 0; padding: 0; }
.auk-blog .auk-blog-cats li { margin: 0; border-bottom: 1px solid #f0f0f0; }
.auk-blog .auk-blog-cats li:last-child { border-bottom: 0; }
.auk-blog .auk-blog-cats a {
	display: block;
	padding: 9px 0;
	font-family: Poppins, sans-serif;
	font-size: 15px;
	font-weight: 400;
	color: #444;
	text-decoration: none;
}
.auk-blog .auk-blog-cats li.is-child a { padding-left: 16px; font-size: 14px; color: #666; }
.auk-blog .auk-blog-cats a:hover,
.auk-blog .auk-blog-cats a:focus,
.auk-blog .auk-blog-cats li.is-current a { color: var(--auk-teal); font-weight: 600; }

/* ---------- Status line ---------- */
.auk-blog .auk-blog-status { margin: 0 0 18px; font-size: 14px; color: #555; }
.auk-blog .auk-blog-status a { color: var(--auk-teal); text-decoration: underline; }

/* ---------- Cards (same look as the current page) ---------- */
.auk-blog .auk-blog-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 35px 30px;
}
.auk-blog .auk-blog-card {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	background: var(--auk-mint);
	border: 3px solid var(--auk-card-border);
	border-radius: 61px;
	box-shadow: 0 0 10px 0 rgba(0, 0, 0, .15);
}
.auk-blog .auk-blog-card__body {
	flex: 1;
	display: flex;
	flex-direction: column;
	margin-top: 26px;
	padding: 0 30px;
}
.auk-blog .auk-blog-card__title {
	margin: 0 0 10px;
	font-family: "Finger Paint", sans-serif;
	font-size: 21px;
	font-weight: 400;
	line-height: 1.3;
	color: #020202;
}
.auk-blog .auk-blog-card__title a { color: #020202; text-decoration: none; }
.auk-blog .auk-blog-card__excerpt {
	margin: 6px 0 22px;
	font-family: Poppins, sans-serif;
	font-size: 16px;
	line-height: 24px;
	color: #777;
}
.auk-blog .auk-blog-card__more {
	margin-top: auto;
	margin-bottom: 20px;
	font-family: Poppins, sans-serif;
	font-size: 16px;
	font-weight: 500;
	color: var(--auk-teal);
	text-decoration: none;
}
.auk-blog .auk-blog-card__meta {
	padding: 15px 30px;
	border-top: 1px solid #eaeaea;
	font-family: Poppins, sans-serif;
	font-size: 12px;
	color: #adadad;
}

/* ---------- Topic labels (cards + single blog) ---------- */
.auk-blog .auk-blog-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.auk-blog .auk-blog-tag {
	padding: 2px 10px;
	border-radius: 20px;
	background: var(--auk-tag-bg);
	font-family: Poppins, sans-serif;
	font-size: 11.5px;
	font-weight: 500;
	line-height: 1.6;
	color: var(--auk-teal);
	text-decoration: none;
}
.auk-blog .auk-blog-tag:hover,
.auk-blog .auk-blog-tag:focus { background: var(--auk-teal); color: #fff; }

/* ---------- Author on cards ---------- */
.auk-blog .auk-blog-author--card {
	margin-bottom: 8px;
	font-family: Poppins, sans-serif;
	font-size: 14px;
	line-height: 1.4;
}
.auk-blog .auk-blog-author--card .auk-blog-author__name { font-weight: 700; color: #111; }
.auk-blog .auk-blog-author--card .auk-blog-author__aff { font-weight: 500; color: var(--auk-teal); }
.auk-blog .auk-blog-author--card .auk-blog-author__name + .auk-blog-author__aff::before { content: " · "; color: #999; }

/* ---------- Single blog: labels + author under the title ---------- */
.auk-blog.auk-blog-single-head { margin: 0 0 28px; }
.auk-blog.auk-blog-single-head .auk-blog-tags { margin-bottom: 14px; }
.auk-blog .auk-blog-author--single {
	padding: 4px 0 4px 16px;
	border-left: 4px solid var(--auk-teal);
	font-family: Poppins, sans-serif;
}
.auk-blog .auk-blog-author--single span { display: block; }
.auk-blog .auk-blog-author--single .auk-blog-author__name { font-size: 19px; font-weight: 700; line-height: 1.35; color: #111; }
.auk-blog .auk-blog-author--single .auk-blog-author__aff { margin-top: 2px; font-size: 15px; font-weight: 500; color: var(--auk-teal); }

/* ---------- Pagination ---------- */
.auk-blog .auk-blog-pagination { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 34px; }
.auk-blog .auk-blog-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 38px;
	height: 38px;
	padding: 0 8px;
	border: 1px solid #ddd;
	border-radius: 19px;
	font-family: Poppins, sans-serif;
	font-size: 14px;
	color: #333;
	text-decoration: none;
}
.auk-blog .auk-blog-pagination .page-numbers.current { background: var(--auk-teal); border-color: var(--auk-teal); color: #fff; }
.auk-blog .auk-blog-pagination .page-numbers.dots { border: 0; }

.auk-blog .auk-blog-empty { font-size: 16px; color: #555; }
.auk-blog .auk-blog-empty a { color: var(--auk-teal); }

/* ---------- Tablet: categories above, 2 columns ---------- */
@media (max-width: 1024px) {
	.auk-blog .auk-blog-layout { grid-template-columns: 1fr; gap: 28px; }
	.auk-blog .auk-blog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---------- Mobile: 1 column ---------- */
@media (max-width: 767px) {
	.auk-blog .auk-blog-grid { grid-template-columns: 1fr; }
	.auk-blog .auk-blog-card { border-radius: 40px; }
	.auk-blog .auk-blog-search { margin-bottom: 28px; }
	.auk-blog .auk-blog-search button { padding: 10px 18px; }
}
