/*
Theme Name: Listalyst
Theme URI: https://listalyst.com
Author: AngelTown Digital
Author URI: https://listalyst.com
Description: A property portal theme for markets without an MLS. Built for real estate agents, agencies and developers in Lagos, Dubai, Nairobi and beyond — WhatsApp-first enquiries, photo watermarking, multi-currency and local land units. Pairs with the Listalyst Portal plugin.
Requires at least: 6.5
Tested up to: 7.1
Requires PHP: 8.0
Version: 0.3.3
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: listalyst
Tags: real-estate, block-patterns, full-site-editing, block-styles, wide-blocks, custom-colors, custom-menu, editor-style, featured-images, style-variations, translation-ready, accessibility-ready
*/

/*
 * A block theme's styling lives in theme.json, not here. This file carries the
 * theme header plus the handful of rules that theme.json cannot express, and
 * the portal's own design tokens are mapped from theme.json presets so the
 * plugin templates inherit whichever style variation is active.
 */

/* ------------------------------------------- portal token bridge */

/*
 * The plugin's templates read --lsty-* variables. Pointing them at the
 * theme.json presets means picking a style variation restyles every property
 * page, card, badge and button without the plugin knowing anything about it.
 */
:root {
	--lsty-accent: var(--wp--preset--color--accent, #d97514);
	--lsty-accent-ink: var(--wp--preset--color--base, #fff);
	--lsty-accent-dark: var(--wp--preset--color--accent-dark, #b35f0e);

	--lsty-ink: var(--wp--preset--color--ink, #17181a);
	--lsty-ink-2: var(--wp--preset--color--ink-2, #4a4d52);
	--lsty-ink-3: var(--wp--preset--color--ink-3, #74787e);

	--lsty-bg: var(--wp--preset--color--base, #fff);
	--lsty-bg-2: var(--wp--preset--color--base-2, #f7f7f6);
	--lsty-line: var(--wp--preset--color--line, #e4e4e2);

	--lsty-r-sm: var(--wp--custom--radius--small, 6px);
	--lsty-r: var(--wp--custom--radius--medium, 10px);
	--lsty-r-lg: var(--wp--custom--radius--large, 16px);

	--lsty-shadow: var(--wp--custom--shadow--card, 0 1px 2px rgba(0,0,0,0.04), 0 8px 24px rgba(0,0,0,0.06));
	--lsty-shadow-lift: var(--wp--custom--shadow--lift, 0 2px 4px rgba(0,0,0,0.06), 0 14px 36px rgba(0,0,0,0.1));

	--lsty-max: var(--wp--style--global--wide-size, 1200px);

	/*
	 * Typography is bridged the same way as colour. The portal's own
	 * stylesheet declares no font-family at all, so body copy inherits
	 * whatever the theme sets — but headings, prices and stat figures need
	 * the display face, and only the theme knows what that is. One token
	 * carries it across, which is what lets a style variation change the
	 * entire portal's voice by redefining a single value.
	 */
	--lsty-font-display: var(--wp--custom--font--display, inherit);
	--lsty-font-display-weight: var(--wp--custom--font--display-weight, 800);
	--lsty-font-display-tracking: var(--wp--custom--font--display-tracking, -0.03em);
}

/* ------------------------------------------------- theme basics */

.wp-site-blocks {
	min-height: 100vh;
	display: flex;
	flex-direction: column;
}

.wp-site-blocks > main {
	flex: 1;
}

/* A sticky header that does not fight the WordPress admin bar. */
.lsty-header {
	position: sticky;
	top: 0;
	z-index: 50;
	backdrop-filter: saturate( 180% ) blur( 12px );
	background: color-mix( in srgb, var(--wp--preset--color--base) 88%, transparent );
	border-bottom: 1px solid var(--wp--preset--color--line);
}

.admin-bar .lsty-header {
	top: 32px;
}

@media screen and ( max-width: 782px ) {
	.admin-bar .lsty-header {
		top: 46px;
	}
}

/* Skip link, so keyboard users are not trapped in the navigation. */
.lsty-skip-link {
	position: absolute;
	left: -9999px;
	z-index: 999;
	padding: 12px 20px;
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--base);
	text-decoration: none;
}

.lsty-skip-link:focus {
	left: 12px;
	top: 12px;
}

/* Visible focus everywhere. The default in many themes is too subtle to
   actually follow with a keyboard. */
:where( a, button, input, select, textarea, summary ):focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 2px;
}

/*
 * There was a .lsty-hero rule here that laid a second dark gradient over the
 * element. The home-hero pattern never used that class — it is a core cover
 * block with its own dim layer — but the portal's hero shortcode does, so the
 * rule had quietly become a way to muddy every homepage photo with two
 * stacked scrims. Removed rather than renamed: nothing was using it.
 */

@media ( prefers-reduced-motion: reduce ) {
	html { scroll-behavior: auto; }
}
/* Premium theme shell */
html{scroll-behavior:smooth;scroll-padding-top:110px}body{background:#fcfbf8}.wp-site-blocks{padding-top:0;padding-bottom:0}.wp-site-blocks>header,.wp-site-blocks>footer{margin-block:0}.lsty-header{padding:0!important;background:#fcfbf8f5;backdrop-filter:blur(15px);border-bottom:1px solid #e5e6dc}.lsty-header-inner{min-height:88px;padding-inline:40px!important;gap:30px;max-width:1320px!important}.lsty-wordmark{margin:0!important;font-family:var(--wp--preset--font-family--sans);font-size:26px;font-weight:650;letter-spacing:-1.2px;white-space:nowrap}.lsty-wordmark a{text-decoration:none;color:#244a3d!important;display:inline-flex;align-items:center;gap:10px}.lsty-brand-symbol{display:grid;place-items:center;width:34px;height:38px;border:1px solid #8f977f;font:25px Georgia,serif;letter-spacing:-3px;padding-right:3px}.lsty-brand-dot{color:#9a8356;margin-left:-10px}.lsty-main-nav{font-family:var(--wp--preset--font-family--sans);font-size:11px;font-weight:500}.lsty-main-nav .wp-block-navigation__container{gap:30px}.lsty-main-nav a{color:#465a4a!important}.lsty-header-actions .wp-block-button__link{font-size:11px;border-radius:4px;padding:15px 22px;background:#244a3d;color:white}.lsty-header-actions span{margin-left:22px}.lsty-footer{background:#eeeee5;padding:65px 40px 25px;color:#5b6859}.lsty-footer-grid{display:grid;grid-template-columns:2fr 1fr 1.3fr;gap:60px}.lsty-footer h3{font:600 11px var(--wp--preset--font-family--sans);letter-spacing:.04em;color:#2c4736;margin:5px 0 20px}.lsty-footer p:not(.lsty-wordmark){font-size:11px;line-height:2.3}.lsty-footer a{color:#586953;text-decoration:none}.lsty-footer a:hover{text-decoration:underline}.lsty-footer-bottom{border-top:1px solid #d7ddcd;padding-top:20px;margin-top:45px}.lsty-footer-bottom p{font-size:9px!important;color:#67745f}.lsty-page-blocks .wp-block-post-content>.lsty-experience{max-width:none;width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}.lsty-page-blocks .wp-block-post-content>.lsty-agents-page{max-width:1320px;width:calc(100vw - 40px);margin-left:calc(50% - 50vw + 20px)}.lsty-page-blocks main{margin-block-start:0!important}.lsty-page-blocks .wp-block-post-content{margin-block:0}.lsty-page-blocks .wp-block-post-content>p:empty{display:none}a:focus-visible,button:focus-visible{outline:3px solid #a68650;outline-offset:4px}
@media(max-width:1000px){.lsty-header-inner{padding-inline:22px!important;gap:20px}.lsty-main-nav .wp-block-navigation__container{gap:18px}.lsty-header-actions .wp-block-button__link{padding:13px 15px}.lsty-header-actions span{margin-left:12px}}
@media(max-width:780px){.lsty-header-inner{min-height:76px}.lsty-main-nav .wp-block-navigation__responsive-container-open{display:flex}.lsty-main-nav .wp-block-navigation__responsive-container:not(.is-menu-open){display:none}.lsty-main-nav{margin-left:auto}.lsty-main-nav .is-menu-open{background:#fcfbf8;padding:35px;font-size:18px}.lsty-main-nav .is-menu-open .wp-block-navigation__container{gap:25px}.lsty-header-actions{display:none}.lsty-wordmark{font-size:23px}.lsty-brand-symbol{width:28px;height:33px;font-size:22px}.lsty-footer{padding:45px 22px 20px}.lsty-footer-grid{grid-template-columns:1fr 1fr;gap:30px}.lsty-footer-grid>div:first-child{grid-column:1/-1}.lsty-footer-bottom{gap:4px}.lsty-footer-bottom p{margin:0}.admin-bar .lsty-header{top:46px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.lsty-page-blocks .wp-block-post-content{padding-inline:0!important}.lsty-page-blocks .wp-block-post-content>.lsty-experience{width:100%!important;max-width:none!important;margin-inline:0!important}.lsty-page-blocks .wp-block-post-content>.lsty-agents-page{width:100%;max-width:1320px;margin-inline:auto!important}.wp-site-blocks>header{position:sticky;top:0;z-index:50;background:#fcfbf8}.admin-bar .wp-site-blocks>header{top:32px}.wp-site-blocks>header .lsty-header{position:static}.lsty-page-blocks .lsty-block{width:100%;margin-inline:0}.lsty-page-blocks .lsty-container{box-sizing:border-box}@media(max-width:782px){.admin-bar .wp-site-blocks>header{top:46px}}

/* Fixed navigation must not inherit a containing block from backdrop filtering. */
.lsty-header{backdrop-filter:none!important;background:#fcfbf8}.lsty-main-nav .wp-block-navigation__responsive-container.is-menu-open{position:fixed!important;inset:0!important;max-height:none!important;height:100dvh!important;width:100%!important;z-index:100000;padding:70px 30px 30px!important;background:#fcfbf8!important}.lsty-main-nav .is-menu-open .wp-block-navigation__container{font-size:20px!important;gap:26px!important}.lsty-main-nav .is-menu-open .wp-block-navigation__responsive-container-close{top:20px;right:20px}@media(max-width:780px){.lsty-header .lsty-header-actions{display:none!important}.lsty-header-inner{justify-content:space-between!important}.lsty-main-nav{margin-left:auto!important}.lsty-main-nav .wp-block-navigation__responsive-container-open{min-width:44px;min-height:44px;align-items:center;justify-content:center}}

/* Keep the mobile drawer inside the viewport. */
.lsty-main-nav .wp-block-navigation__responsive-container.is-menu-open{box-sizing:border-box!important;}
.lsty-main-nav .is-menu-open .wp-block-navigation__responsive-container-content{align-items:flex-start!important;}
