/*
Theme Name:  SCL Ordsall Hall
Description: Child theme of SCL Master (Sage Roots) for the Ordsall Hall site. Close replication of the Museum site, rebranded to the Ordsall teal/gold palette and without the Exhibitions post type.
Template:    scl-master-sageroots
Version:     1.0.0
Author:      Cornerstone
Author URI:  https://cornerstonedm.co.uk/
Text Domain: scl-ordsallhall
*/

/*
 * The Ordsall brand palette (CSS variable overrides + utility classes) and all
 * component overrides live in resources/css/app.css, which is compiled into the
 * child Vite bundle and enqueued LAST — so its :root overrides reliably win over
 * the parent theme's @theme palette. See functions.php for the enqueue order.
 */

:root {
	--color-ordsall-cream:  #F8F4DE;
	--color-ordsall-gold: #D6AD58;
	--color-ordsall-grey: #6B7280;

	/* Override leisure-black so every text-leisure-black / border-leisure-black
	 * inherits the watersports navy by default — i.e. body copy is navy site-
	 * wide without us having to override individual utilities. Keeping the
	 * variable-driven approach (rather than re-defining `.text-leisure-black`
	 * directly) is important: it lets Tailwind's hover utilities like
	 * `hover:text-white` win on hover via normal specificity within
	 * @layer utilities, instead of being beaten by an unlayered class override.
	 *
	 * The matching `bg-leisure-black` utility is forced back to true black
	 * below so the "Leisure Black" background choice still renders as expected.
	 */
	--color-leisure-black: #393528;
}

/* Ordsall: cream surface utility. Hand-written (like the bg-ordsall-* helpers in
 * resources/css/app.css) so it renders without a master rebuild — used by the
 * single-event page header, which sets bg-ordsall-cream via $is_ordsall in the
 * parent theme's content-single-event.blade.php. */
.bg-ordsall-cream { background-color: var(--color-ordsall-cream); }
.bg-ordsall-gold  { background-color: var(--color-ordsall-gold); }
.bg-ordsall-grey  { background-color: var(--color-ordsall-grey); }

/* Ordsall: no uppercase headings anywhere. Plain/unlayered CSS here beats
 * Tailwind's layered `.uppercase` utility regardless of specificity, so every
 * h1–h6 renders as typed without editing each template. */
h1, h2, h3, h4, h5, h6 {
	text-transform: none;
}

/* Ordsall: footer column headings render bold.
 *
 * resources/css/app.css sets `font-weight: 400 !important` on every h1–h6 for
 * the site-wide light serif heading treatment. That also flattens the
 * `font-bold` already present on the footer's <h3> column headings in
 * sections/footer.blade.php, which is why they were rendering at the same
 * weight as the links beneath them. Re-asserting the weight here, rather than
 * carving an exception into the blanket rule, leaves that treatment untouched
 * everywhere else on the site.
 *
 * `footer h3` (0,0,2) outranks the blanket `h1,…,h6` (0,0,1), so it wins on
 * specificity between two !important declarations and doesn't depend on which
 * stylesheet happens to load last. Hand-written here so it works without a
 * child rebuild. */
footer h3 {
	font-weight: 700 !important;
}

/* Megamenu featured-post title (sections/header.blade.php). A <p> rather than
 * an <h3> so the menu doesn't break each page's heading hierarchy; this mirrors
 * the h3 rules in resources/css/app.css so it looks the same. Hand-written here
 * so it works without a child rebuild. */
.megamenu-featured-title {
	font-family: var(--font-headline);
	font-weight: 400 !important;
}

@media (max-width: 767px) {
	.megamenu-featured-title {
		line-height: 1.2 !important;
	}
}

@media (min-width: 768px) {
	.megamenu-featured-title {
		line-height: 1.5 !important;
	}
}

/* Ordsall: extra bottom padding under the page-header content column (lg+) so the
 * title/intro/CTAs sit higher above the decorative clover — closer to the design.
 * Wins over the parent bundle's 2.5rem (style.css is enqueued after it, same
 * specificity). Tune the value to raise/lower the content. */
@media (min-width: 64rem) {
	.page-header-content {
		padding-bottom: 6rem;
	}
}

/* Ordsall "Small Hero" block (flexible/ordsall-small-hero.blade.php).
 * Hand-written here (rather than as Tailwind utilities in a child view) so it
 * works without a parent rebuild — see the scanner-gap note in resources/css/app.css.
 *   - section padding-bottom: 1rem of extra breathing room under the content.
 *     (Must live on the section, NOT the content element — a margin-bottom there
 *      would override the `my-auto` that vertically centres the content.)
 *   - max-width: cap the content column at 75% (lg+) so the title/copy/buttons
 *     don't run out to the right edge; it stays left-aligned. */
.ordsall-small-hero {
	padding-bottom: 1rem;
}

@media (min-width: 64rem) {
	.ordsall-small-hero-content {
		max-width: 75%;
	}
}