/* ═══════════════════════════════════════════════════════════════════════════
   LBS design tokens: an ALIAS LAYER ONLY.

   The values live in theme.json (the single source of truth); WordPress turns them into
   --wp--preset--* and --wp--custom--* custom properties on every page and in the block editor.
   This file gives them short names. No literal value belongs here, and every other stylesheet
   uses only --lbs-* names.

   The --lbs-* namespace is reserved for the theme. Do not create Elementor (V4) variables whose
   label starts with "lbs-": Elementor turns a variable's label into a CSS property on :root.

   CANONICAL BREAKPOINTS: 576px · 768px · 992px · 1200px. Custom properties cannot be used in
   @media conditions, so these four literals (and their max-width forms 575.98 / 767.98 / 991.98 /
   1199.98) are the only widths allowed in media queries anywhere in the theme.
   ═══════════════════════════════════════════════════════════════════════════ */

:root,
.editor-styles-wrapper {
	/* Colour */
	/* The slugs "ink" and "hairline", not "text" and "border": WordPress marks every block with a picked text
	   or border colour with the classes has-text-color / has-border-color, the very classes a slug "text" or
	   "border" generates for its own colour, which then overrode every picked colour (KNOWN_ISSUES 3, fixed
	   2026-10-01). Never name a palette colour text, border or link. */
	--lbs-text: var(--wp--preset--color--ink);
	--lbs-red: var(--wp--preset--color--accent);
	--lbs-red-dark: var(--wp--preset--color--accent-dark);
	--lbs-muted: var(--wp--preset--color--muted);
	--lbs-panel: var(--wp--preset--color--panel);
	--lbs-border: var(--wp--preset--color--hairline);             /* hairlines, dividers */
	--lbs-border-soft: var(--wp--preset--color--border-soft);     /* decorative box borders */
	--lbs-border-strong: var(--wp--preset--color--border-strong); /* form controls: 3:1 on white */
	--lbs-dark: var(--wp--preset--color--dark);
	--lbs-white: var(--wp--preset--color--white);

	/* Type */
	--lbs-font: var(--wp--preset--font-family--dinish);
	--lbs-fs-xs: var(--wp--preset--font-size--xs);
	--lbs-fs-sm: var(--wp--preset--font-size--sm);
	--lbs-fs-md: var(--wp--preset--font-size--md);
	--lbs-fs-lg: var(--wp--preset--font-size--lg);
	--lbs-fs-xl: var(--wp--preset--font-size--xl);
	--lbs-fs-2xl: var(--wp--preset--font-size--2-xl);
	--lbs-fs-3xl: var(--wp--preset--font-size--3-xl);
	--lbs-lh-body: var(--wp--custom--lbs--line-height--body);
	--lbs-lh-heading: var(--wp--custom--lbs--line-height--heading);
	--lbs-lh-tight: var(--wp--custom--lbs--line-height--tight);
	--lbs-lh-lead: var(--wp--custom--lbs--line-height--lead);
	--lbs-lh-ui: var(--wp--custom--lbs--line-height--ui);   /* header, menus: 16px text on 24px lines */

	/* Space */
	--lbs-space-1: var(--wp--preset--spacing--10);
	--lbs-space-2: var(--wp--preset--spacing--20);
	--lbs-space-3: var(--wp--preset--spacing--30);
	--lbs-space-4: var(--wp--preset--spacing--40);
	--lbs-space-5: var(--wp--preset--spacing--50);
	--lbs-space-6: var(--wp--preset--spacing--60);
	--lbs-space-7: var(--wp--preset--spacing--70);
	--lbs-space-8: var(--wp--preset--spacing--80);
	--lbs-space-9: var(--wp--preset--spacing--90);

	/* Layout. The page grows with the window up to the wide width plus its side margins (layout.css);
	   the side margin drops to the compact value below 576px. */
	--lbs-gutter: var(--wp--custom--lbs--gutter);
	--lbs-gutter-compact: var(--wp--custom--lbs--gutter-compact);
	--lbs-content: var(--wp--style--global--content-size);
	--lbs-wide: var(--wp--style--global--wide-size);
	--lbs-search-width: var(--wp--custom--lbs--search-width);

	/* Brand details */
	--lbs-rule-w: var(--wp--custom--lbs--rule--width);
	--lbs-rule-h: var(--wp--custom--lbs--rule--height);
	--lbs-nav-underline: var(--wp--custom--lbs--nav-underline);
	--lbs-footer-bar: var(--wp--custom--lbs--footer-bar);
	--lbs-focus-ring: var(--wp--custom--lbs--focus-ring);
	--lbs-target: var(--wp--custom--lbs--target--min);          /* buttons, fields, menu items: 44 x 44 */
	--lbs-target-small: var(--wp--custom--lbs--target--small);  /* links in dense lists: 24px tall */
	--lbs-icon-size: var(--wp--custom--lbs--icon--size);
	--lbs-logo-height: var(--wp--custom--lbs--logo--height);  /* the "Logo" image style */
	--lbs-transition: var(--wp--custom--lbs--transition);

	/* Corners: square for content, rounded for what you operate (buttons, fields, drop-downs), fully
	   round only for the hero search box (signature picture, picture strip: forms.css; Kristinn, 2026-10-15). */
	--lbs-radius-control: var(--wp--custom--lbs--radius--control);
	--lbs-radius-pill: var(--wp--custom--lbs--radius--pill);

	/* Focus ring and states. Kept out of the editors' colour palette on purpose: they mean something. */
	--lbs-focus: var(--wp--custom--lbs--color--focus);
	--lbs-success: var(--wp--custom--lbs--color--success);
	--lbs-success-surface: var(--wp--custom--lbs--color--success-surface);
	--lbs-warning: var(--wp--custom--lbs--color--warning);
	--lbs-warning-surface: var(--wp--custom--lbs--color--warning-surface);
	--lbs-error: var(--wp--custom--lbs--color--error);
	--lbs-error-surface: var(--wp--custom--lbs--color--error-surface);
	--lbs-disabled-text: var(--wp--custom--lbs--color--disabled-text);
	--lbs-disabled-surface: var(--wp--custom--lbs--color--disabled-surface);
	--lbs-scrim: var(--wp--custom--lbs--color--scrim);              /* dims the page behind the open drawer */
	--lbs-drawer-width: var(--wp--custom--lbs--drawer);
}