import type { WidgetSettingsData } from '../sdk';
export type SemanticTokens = {
    color: {
        background: string;
        foreground: string;
        border: string;
        primary: string;
        primaryForeground: string;
        secondary: string;
        secondaryForeground: string;
    };
    radius: string;
    shadow: string;
    typography: {
        fontSizeBase: string;
    };
    motion: {
        durationAnimation: string;
        durationFade: string;
    };
    size: {
        widgetWidth: string;
        widgetHeight: string;
    };
};
export type WidgetStyleSettingsDefaults = Pick<WidgetSettingsData, 'widget_background_color' | 'widget_text_color' | 'widget_border_color' | 'widget_accent_color' | 'widget_secondary_color' | 'widget_border_radius' | 'widget_font_size' | 'widget_width' | 'widget_height' | 'widget_shadow' | 'widget_animation_duration' | 'widget_fade_duration'>;
export declare const WIDGET_STYLE_SETTINGS_DEFAULTS: WidgetStyleSettingsDefaults;
export declare function mapWidgetSettingsToSemanticTokens(settings: WidgetStyleSettingsDefaults): SemanticTokens;
export declare const DEFAULT_SEMANTIC_TOKENS: SemanticTokens;
/**
 * Convert tokens to CSS custom properties.
 * Applied as inline styles on the widget root to override static CSS defaults
 * set by `:host` in index.css. Must cover every variable that Tailwind utilities
 * or base-component classes reference so the widget renders correctly inside
 * closed Shadow DOM regardless of host page styles.
 */
export declare function semanticTokensToCssCustomProperties(tokens: SemanticTokens): Record<string, string>;
//# sourceMappingURL=semantic-tokens.d.ts.map