/**
 * Theme Name: Kismet Base
 * Theme URI: https://kismet.travel
 * Author: Kismet
 * Author URI: https://kismet.travel
 * Description: Kismet Base is a token-driven block theme for vacation rental demo sites. Every color, font, and spacing value flows from theme.json — swap the palette to reskin the entire site without touching patterns or templates.
 * Version: 0.1.0
 * Requires at least: 6.4
 * Tested up to: 6.7
 * Requires PHP: 7.4
 * License: GNU General Public License v2 or later
 * License URI: https://www.gnu.org/licenses/gpl-2.0.html
 * Text Domain: kismet-base
 * Tags: full-site-editing, block-patterns, custom-colors, custom-logo, translation-ready
 * Template:
 */

/* ── kismet-elements colour tokens → theme palette ────────────────────────────
 *
 * The kismet-elements React bundles (results page, property detail, booking) are
 * styled through `--vr-*` custom properties. kismet-tailwind.css sets a GENERIC
 * default set on `.kismet-scope` — white bg, grey lines, near-black text — and
 * nothing mapped them to this client's palette, so every elements surface (the
 * property-detail page, the results toolbar, …) rendered WHITE on top of the sand
 * page background. Map the tokens to the palette here. Ported from maui-inn.
 *
 * WHY `:root .kismet-scope` (not `:root`, not `!important`): the plugin sets its
 * defaults ON `.kismet-scope`, so `:root { … }` is out-inherited the moment you
 * cross into `.kismet-scope`; `.kismet-scope` alone ties on specificity (0,1,0)
 * and loses on load order. `:root .kismet-scope` (0,2,0) wins. The toolbar/detail
 * backgrounds are INLINE `var(--vr-bg, #fff)` — var() resolves against the
 * inherited cascade AT the element, so supplying the variable feeds it the right
 * value without fighting the inline style. (Supersedes the earlier .rp-toolbar
 * one-off — this block covers the toolbar too.)
 *
 * WHY VARIABLES, NEVER HEXES: the palette lives in the DB per client; hardcoding
 * would desync on a palette change. Reskinning stays a palette swap. */
:root,
:root .kismet-scope {
	/* Surfaces */
	--vr-bg: var(--wp--preset--color--base);
	--vr-surface: var(--wp--preset--color--surface);
	--vr-surface-2: var(--wp--preset--color--surface);
	--vr-surface-alt: var(--wp--preset--color--surface);
	--vr-surface-hover: var(--wp--preset--color--accent-soft);

	/* Text */
	--vr-text: var(--wp--preset--color--contrast);
	--vr-text-primary: var(--wp--preset--color--contrast);
	--vr-text-secondary: var(--wp--preset--color--muted);
	--vr-text-muted: var(--wp--preset--color--muted);

	/* Lines */
	--vr-border: var(--wp--preset--color--outline);
	--vr-border-hover: var(--wp--preset--color--accent);

	/* Brand */
	--vr-brand-accent: var(--wp--preset--color--accent);
	--vr-primary: var(--wp--preset--color--contrast);
	--vr-primary-soft: var(--wp--preset--color--accent-soft);
	--vr-secondary: var(--wp--preset--color--muted);
}