/*
Theme Name: The Legacy Subdivision
Theme URI: https://thelegacysubdivision.com
Author: IGNESCO
Author URI: https://www.ignes.co
Description: A simple, classic block theme for The Legacy Subdivision homeowners association. Black and white with ivory as a quiet accent; Cormorant Garamond headings and Inter body text, both self-hosted.
Requires at least: 6.5
Tested up to: 6.8
Requires PHP: 7.4
Version: 1.1.2
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: legacy-subdivision
*/

/* Most styling lives in theme.json. These are the few details theme.json can't express. */

html { -webkit-text-size-adjust: 100%; }
body { text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }

a { text-underline-offset: 0.18em; text-decoration-thickness: 1px; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
	outline: 2px solid currentColor; outline-offset: 3px;
}

/* Small caps eyebrow labels */
.is-style-eyebrow, .ls-eyebrow {
	font-family: var(--wp--preset--font-family--inter);
	font-size: 0.75rem !important; letter-spacing: 0.16em; text-transform: uppercase;
	color: var(--wp--preset--color--warm-gray);
}

/* Wordmark */
.ls-wordmark { line-height: 1.05; }
.ls-wordmark a { text-decoration: none; color: inherit; }
.ls-wordmark-sub { margin-top: 0.25rem !important; }

/* Header navigation: understated, uppercase, tracked */
.ls-header .wp-block-navigation { font-size: 0.8125rem; letter-spacing: 0.08em; text-transform: uppercase; }
.ls-header .wp-block-navigation a { text-decoration: none; }
.ls-header .wp-block-navigation a:hover, .ls-header .current-menu-item > a { text-decoration: underline; }
.wp-block-navigation__responsive-container.is-menu-open { background: var(--wp--preset--color--black) !important; color: #fff !important; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 4rem; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item { font-size: 1.125rem; }

/* Hero */
.ls-hero { min-height: min(72vh, 640px); }
.ls-hero .wp-block-cover__inner-container { max-width: 760px; }

/* Quick links: a row of hairline-divided cells */
.ls-quicklinks > .wp-block-column { border-top: 1px solid var(--wp--preset--color--black); padding-top: 1.25rem; }
.ls-quicklinks h3 a { text-decoration: none; }
.ls-quicklinks h3 a:hover { text-decoration: underline; }

/* Lists with hairline separators (documents, roles) */
.ls-rule-list { list-style: none; padding-left: 0 !important; }
.ls-rule-list li { border-bottom: 1px solid var(--wp--preset--color--hairline); padding: 0.85rem 0; }
.ls-rule-list li:first-child { border-top: 1px solid var(--wp--preset--color--hairline); }

/* Placeholders stand out to editors but stay quiet */
.ls-placeholder { background: #FFF6D6; outline: 1px dashed #B8A15A; padding: 0 0.2em; }

/* Password form (Documents) */
.post-password-form input[type="password"] { max-width: 520px; }
.post-password-form p { margin: 0 0 1rem; }
.post-password-form label { display: block; font-size: 0.875rem; color: var(--wp--preset--color--warm-gray); }
.post-password-form input[type="password"] {
	display: block; width: 100%; margin-top: 0.4rem; padding: 0.75rem 0.85rem; font: inherit;
	background: #fff; border: 1px solid var(--wp--preset--color--hairline); border-radius: 0;
}
.post-password-form input[type="submit"] {
	margin-top: 0.75rem; padding: 0.8rem 1.6rem; font: inherit; font-size: 0.875rem; letter-spacing: 0.08em; text-transform: uppercase;
	background: var(--wp--preset--color--black); color: #fff; border: 1px solid var(--wp--preset--color--black); border-radius: 0; cursor: pointer;
}
.post-password-form input[type="submit"]:hover { background: #fff; color: var(--wp--preset--color--black); }


/* Post list on News */
.ls-postlist .wp-block-post { border-bottom: 1px solid var(--wp--preset--color--hairline); padding-bottom: 1.75rem; }

/* Images: no rounding, no shadows */
img { border-radius: 0; }

@media (max-width: 600px) {
	.ls-hero { min-height: 58vh; }
	.ls-header .wp-block-group.ls-header-inner { gap: 0.5rem; }
}

/* Outline buttons: black hairline, transparent fill */
.wp-block-button.is-style-outline > .wp-block-button__link,
.wp-block-button.is-style-outline > .wp-block-button__link:not(:hover) {
	background: transparent; color: var(--wp--preset--color--black); border: 1px solid var(--wp--preset--color--black);
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover { background: var(--wp--preset--color--black); color: #fff; }

/* The password form isn't a block, so give it the content width explicitly */
.post-password-form, .ls-password-note { max-width: var(--wp--style--global--content-size); margin-left: auto !important; margin-right: auto !important; }

/* Mobile menu overlay: margins and left alignment */
.wp-block-navigation__responsive-container.is-menu-open { padding: 1.5rem clamp(1.25rem, 5vw, 3rem) !important; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .wp-block-navigation__container { align-items: flex-start !important; }

/* Breathing room above section headings in page content */
.wp-block-post-content > h2.wp-block-heading { margin-top: var(--wp--preset--spacing--60); }
.wp-block-post-content > h3.wp-block-heading { margin-top: var(--wp--preset--spacing--50); }
.wp-block-post-content > h2.wp-block-heading:first-child { margin-top: 0; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { align-items: flex-start !important; }

/* ------------------------------------------------------------------
   Black and white (v1.1). Black header, footer, title bands and
   section bands; white content areas; ivory only as a quiet accent.
   ------------------------------------------------------------------ */

/* Header brand: original Legacy logo, inverted to white, plus the text name */
.ls-brand { display: flex; align-items: center; gap: 1.1rem; color: #fff; text-decoration: none !important; }
.ls-brand-logo { display: block; height: 64px; width: auto; }
.ls-brand-text { display: flex; flex-direction: column; border-left: 1px solid #3a3a3a; padding-left: 1.1rem; line-height: 1.1; }
.ls-brand-name { font-family: var(--wp--preset--font-family--cormorant); font-size: 1.4rem; font-weight: 500; color: #fff; }
.ls-brand-sub { font-size: 0.6875rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--wp--preset--color--smoke); margin-top: 0.3rem; }
.ls-header .wp-block-navigation, .ls-header .wp-block-navigation a { color: #fff; }
.ls-header .wp-block-navigation__responsive-container-open svg,
.ls-header .wp-block-navigation__responsive-container-close svg { fill: #fff; }
@media (max-width: 900px) {
	/* keep the name for screen readers; show only the logo */
	.ls-brand-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; padding: 0; }
	.ls-brand-logo { height: 52px; }
}

/* Anything on black: white text, muted secondary text, light rules */
.has-black-background-color { color: #fff; }
.has-black-background-color :where(h1,h2,h3,h4,h5,h6,a) { color: #fff; }
.has-black-background-color .ls-eyebrow,
.has-black-background-color .has-warm-gray-color,
.has-black-background-color .wp-block-post-date { color: var(--wp--preset--color--smoke) !important; }
.has-black-background-color .wp-block-separator { color: #333 !important; background-color: #333 !important; border-color: #333 !important; }
.has-black-background-color .ls-rule-list li { border-color: #333; }
.ls-quicklinks.is-dark > .wp-block-column, .has-black-background-color .ls-quicklinks > .wp-block-column { border-top-color: #fff; }

/* Buttons on black or on photos: white fill, white hairline outline */
.has-black-background-color .wp-block-button:not(.is-style-outline) > .wp-block-button__link,
.wp-block-cover .wp-block-button:not(.is-style-outline) > .wp-block-button__link { background: #fff; color: var(--wp--preset--color--black); border-color: #fff; }
.has-black-background-color .wp-block-button:not(.is-style-outline) > .wp-block-button__link:hover,
.wp-block-cover .wp-block-button:not(.is-style-outline) > .wp-block-button__link:hover { background: transparent; color: #fff; }
.has-black-background-color .wp-block-button.is-style-outline > .wp-block-button__link,
.wp-block-cover .wp-block-button.is-style-outline > .wp-block-button__link { background: transparent; color: #fff; border-color: #fff; }
.has-black-background-color .wp-block-button.is-style-outline > .wp-block-button__link:hover,
.wp-block-cover .wp-block-button.is-style-outline > .wp-block-button__link:hover { background: #fff; color: var(--wp--preset--color--black); }

/* Photo hero: dark overlay, white Cormorant type */
.ls-hero, .ls-hero h1, .ls-hero p { color: #fff; }
.ls-hero h1 { text-shadow: 0 1px 24px rgba(0,0,0,0.35); }
.ls-hero .ls-eyebrow { color: #e6e3dd; }

/* Title band on inner pages */
.ls-title-band h1 { margin: 0; }

/* Footer */
.ls-footer a { color: #fff; }
.ls-footer-logo img, .ls-footer-logo svg { display: block; height: 84px; width: auto; }
.ls-footer .wp-block-separator { color: #333 !important; background-color: #333 !important; }

/* Images and galleries: square corners, quiet captions */
.ls-photo img, .ls-gallery img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.ls-gallery figcaption, .ls-photo figcaption { font-size: 0.8125rem; color: var(--wp--preset--color--warm-gray); text-align: left; }
.has-black-background-color .ls-gallery figcaption, .has-black-background-color .ls-photo figcaption { color: var(--wp--preset--color--smoke); }
.wp-block-gallery.ls-gallery figure.wp-block-image figcaption { background: none; color: var(--wp--preset--color--smoke); position: static; padding: 0.6rem 0 0; text-shadow: none; font-size: 0.8125rem; text-align: left; }

/* Placeholders stay legible on black too */
.ls-placeholder { color: #111; }

/* Ivory as an accent only: the thin rule under eyebrows on white */
.ls-accent-rule { width: 48px; height: 1px; background: var(--wp--preset--color--bone); border: 0; }

/* No gap between header, main and footer */
.wp-site-blocks > * + * { margin-block-start: 0; }
/* Gallery: plain 3-up grid, 4:3 crops */
.wp-block-gallery.ls-gallery.has-nested-images figure.wp-block-image { flex-direction: column; justify-content: flex-start; }
.wp-block-gallery.ls-gallery.has-nested-images figure.wp-block-image img { flex: none; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
@media (max-width: 599px) {
	.wp-block-gallery.ls-gallery.has-nested-images figure.wp-block-image:not(#individual-image) { width: 100%; }
}