/*
Theme Name: Milpark Child
Theme URI: https://www.milpark.ac.za/
Description: Child theme of Hello Elementor for the Milpark Education rebuild. Exists so template overrides and theme level hooks have a versioned home. Site wide custom code belongs in the milpark-core plugin, not here.
Author: Centric Media
Author URI: https://centricmedia.com/
Template: hello-elementor
Version: 0.5.0
Requires PHP: 8.0
Text Domain: milpark-child
*/

/* Styling comes from the Elementor kit. Add CSS here only for things the kit
   cannot express, such as template level overrides. Keep it short and comment
   why each rule exists. */

/* archive-programme.php fallback container: matches the kit's 1440px boxed
   content width so the listing lines up with Elementor-built pages. Goes away
   the day an Elementor Theme Builder archive template takes over. */
.mk-archive {
	max-width: 1440px;
	margin: 0 auto;
	padding: 32px 20px 64px;
}

/* Term archive header. The school lockup renders here, at the one place on the
   site where the 127x222 portrait artwork has room to be read. It came off the
   listing cards on 1 Sept 2026, where it was 210px tall above a 20px title.
   Grid rather than flex so the lockup keeps its column and the title and the
   term description share the other, and so the whole header collapses to one
   column on narrow screens without either part shrinking. */
.mk-archive-header {
	margin: 0 0 28px;
}

.mk-archive-header--lockup {
	display: grid;
	grid-template-columns: 96px minmax(0, 1fr);
	gap: 24px;
	align-items: center;
}

/* The lockup is INLINE SVG, so its wordmark is currentColor. Setting a colour
   here is what stops it rendering white on this white page: the artwork in the
   media library is the on-blue version. The square keeps the school's brand
   colour and the M stays white, both baked in by milpark_svg_dark_variant().
   width plus height:auto works because the inliner strips width and height off
   the root and keeps the viewBox. */
.mk-archive-lockup {
	display: block;
	width: 96px;
	height: auto;
	color: #1C3687;
}

.mk-archive-header h1 {
	margin: 0;
}

.mk-archive-intro {
	margin-top: 10px;
	max-width: 68ch;
}

@media (max-width: 600px) {
	.mk-archive-header--lockup {
		grid-template-columns: minmax(0, 1fr);
		gap: 16px;
	}

	.mk-archive-lockup {
		width: 72px;
	}
}

/* The three rules carried over from Customiser Additional CSS on 28 Sept 2026
   moved to milpark-core on 8 Oct 2026: .hero-container-padding became the
   mk-inset-header class in elementor.css, the programme section border went
   to sections.css and the past event note to elementor.css. The study pages'
   .mk-school-tile went to elementor.css the same day. This file styles only
   the templates this theme owns. */

/* SEARCH RESULTS, search.php. One column at reading width, the same type
   scale as the site: a small label, a heading, a count, then one row per
   result with its kind, title and a line of text. */
.mk-search-page {
	max-width: 880px;
	margin: 0 auto;
	padding: 64px 20px 96px;
}
.mk-search-page__eyebrow {
	margin: 0 0 10px;
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #5A6B85;
}
.mk-search-page h1 {
	margin: 0 0 10px;
	font-family: var(--e-global-typography-primary-font-family, Inter), Inter, sans-serif;
	font-size: clamp(30px, 3.4vw, 44px);
	font-weight: 700;
	line-height: 1.12;
	letter-spacing: -.01em;
	color: #1A134A;
	text-wrap: balance;
}
.mk-search-page__count {
	margin: 0 0 28px;
	font-size: 16px;
	color: #394154;
}
.mk-search-page__form {
	display: flex;
	gap: 10px;
	margin: 0 0 40px;
}
.mk-search-page__form input[type="search"] {
	flex: 1 1 auto;
	min-width: 0;
	min-height: 48px;
	padding: 12px 14px;
	border: 1px solid #C7CFE4;
	border-radius: 8px;
	font: inherit;
	font-size: 16px;
	color: #1C3687;
}
.mk-search-page__form input[type="search"]:focus-visible {
	outline: 2px solid #1C3687;
	outline-offset: 2px;
	border-color: #1C3687;
}
.mk-search-page .mk-search-page__submit {
	min-height: 48px;
	padding: 12px 24px;
	border: 0;
	border-radius: 999px;
	background: #F9F106;
	color: #1A134A;
	font: inherit;
	font-size: 16px;
	font-weight: 700;
	cursor: pointer;
}
.mk-search-page .mk-search-page__submit:hover,
.mk-search-page .mk-search-page__submit:focus {
	background: #E8E005;
	color: #1A134A;
}
.mk-search-page__list {
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid #E0E3F4;
}
.mk-search-page__item {
	padding: 22px 0;
	border-bottom: 1px solid #E0E3F4;
}
.mk-search-page__type {
	display: block;
	margin: 0 0 6px;
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: #5A6B85;
}
.mk-search-page__item h2 {
	margin: 0 0 6px;
	font-family: var(--e-global-typography-primary-font-family, Inter), Inter, sans-serif;
	font-size: 20px;
	font-weight: 600;
	line-height: 1.3;
}
.mk-search-page__item h2 a {
	color: #1C3687;
	text-decoration: none;
}
.mk-search-page__item h2 a:hover {
	text-decoration: underline;
	text-underline-offset: 3px;
}
.mk-search-page__excerpt {
	margin: 0;
	max-width: 68ch;
	font-size: 15px;
	line-height: 1.6;
	color: #394154;
}
.mk-search-page__empty {
	padding: 24px 0;
	font-size: 16px;
	line-height: 1.6;
	color: #394154;
}
.mk-search-page__empty a {
	color: #1C3687;
	font-weight: 600;
}
.mk-search-page .elementor-pagination {
	margin-top: 40px;
}