/**
 * Florian FD - Municipal kit tokens
 *
 * theme.json is the source of truth. This file aliases values theme.json
 * cannot express, so block styles stay readable.
 */

:root {
	--fl-gutter: var( --wp--custom--gutter, 1.4rem );
	--fl-content: var( --wp--style--global--content-size, 44rem );
	--fl-wide: var( --wp--style--global--wide-size, 73.75rem );
	--fl-max: 1180px;

	--fl-navy: var( --wp--preset--color--navy, #113148 );
	--fl-navy-2: var( --wp--preset--color--navy-2, #0c2436 );
	--fl-red: var( --wp--preset--color--accent, #c41d1d );
	--fl-red-d: var( --wp--preset--color--accent-2, #9b1717 );
	--fl-ink: var( --wp--preset--color--contrast, #1a1a1a );
	--fl-muted: var( --wp--preset--color--contrast-3, #5c6770 );
	--fl-line: var( --wp--preset--color--outline, #e4e8ec );
	--fl-soft: var( --wp--preset--color--base-2, #f6f7f9 );
	--fl-warn: var( --wp--preset--color--warning-surface, #f6e7a8 );

	--fl-clip-sm: none;
	--fl-clip: none;
	--fl-clip-lg: none;

	--fl-stripe: 0px;
	--fl-ghost: rgba( 17, 49, 72, 0.06 );
	--fl-hairline: var( --wp--preset--color--outline, #e4e8ec );
	--fl-ink-muted: rgba( 234, 240, 245, 0.72 );

	--fl-radius-sm: var( --wp--custom--radius--sm, 8px );
	--fl-radius-md: var( --wp--custom--radius--md, 10px );
	--fl-radius-lg: var( --wp--custom--radius--lg, 12px );
	--fl-radius-xl: var( --wp--custom--radius--xl, 14px );
	--fl-radius-pill: var( --wp--custom--radius--pill, 999px );

	--fl-duration: var( --wp--custom--motion--fast, 200ms );
	--fl-easing: var( --wp--custom--transition--easing, ease );
	--fl-transition: var( --fl-duration ) var( --fl-easing );
	--fl-duration-med: var( --wp--custom--motion--medium, 300ms );
	--fl-duration-slow: var( --wp--custom--motion--slow, 400ms );

	--fl-target: var( --wp--custom--target--min, 2.75rem );

	--fl-focus-width: var( --wp--custom--focus--width, 2px );
	--fl-focus-offset: var( --wp--custom--focus--offset, 3px );
	--fl-focus-color: var( --wp--preset--color--navy, #113148 );

	--fl-shadow-subtle: var( --wp--preset--shadow--subtle, 0 10px 28px rgba( 17, 49, 72, 0.08 ) );
	--fl-shadow-raised: var( --wp--preset--shadow--raised, 0 16px 36px rgba( 17, 49, 72, 0.12 ) );
	--fl-shadow-overlay: var( --wp--preset--shadow--overlay, 0 10px 28px rgba( 17, 49, 72, 0.08 ) );

	--fl-header-height: var( --wp--custom--header-height, 5.75rem );
	--fl-header-offset: var( --fl-header-height );

	--fl-safe-top: env( safe-area-inset-top, 0px );
	--fl-safe-bottom: env( safe-area-inset-bottom, 0px );
	--fl-safe-left: env( safe-area-inset-left, 0px );
	--fl-safe-right: env( safe-area-inset-right, 0px );
}

.florian-invert {
	--wp--preset--color--base: var( --wp--custom--copy--contrast, #113148 );
	--wp--preset--color--base-2: var( --wp--custom--copy--contrast-2, #0c2436 );
	--wp--preset--color--base-3: #0e2433;
	--wp--preset--color--outline: var( --wp--custom--copy--outline, #2a4a62 );
	--wp--preset--color--contrast: var( --wp--custom--copy--base, #ffffff );
	--wp--preset--color--contrast-2: var( --wp--custom--copy--base-2, #f6f7f9 );
	--wp--preset--color--contrast-3: var( --wp--custom--copy--contrast-3, #9bb0c0 );
	--wp--preset--color--accent: var( --wp--custom--copy--accent, #c41d1d );
	--wp--preset--color--accent-2: var( --wp--custom--copy--accent-2, #f08a8a );
	--wp--preset--color--navy: #ffffff;
	color: #eaf0f5;
}