import { ThemeColorName } from '../../tokens/colors';
/**
 * Extended color type that includes theme colors and the special `'transparent'` value.
 */
export type ExtendedColor = ThemeColorName | 'transparent';
/**
 * Theme appearance mode.
 * Either `'light'` or `'dark'`.
 */
export type Mode = 'light' | 'dark';
/**
 * Background style variant.
 * - `'solid'`: Full-intensity solid background
 * - `'light'`: Light, subtle background
 * - `'soft'`: Medium-intensity background
 * - `'lighter'`: Very subtle background
 */
export type BackgroundVariant = 'solid' | 'light' | 'soft' | 'lighter';
/**
 * Foreground color tone for text and icons.
 * - `'solid'`: High-contrast, vibrant color
 * - `'soft'`: Lower-contrast, muted color
 */
export type ForegroundTone = 'solid' | 'soft';
/**
 * Computes background and text colors for a given color, variant, and theme mode.
 * Applies variant-specific styling (solid, light, soft, lighter) and mode-specific shades.
 *
 * @param color - The theme color name
 * @param variant - The background style variant
 * @param mode - The theme mode ('light' or 'dark')
 * @returns An object containing `backgroundColor` and `textColor` CSS values
 *
 * @example
 * ```ts
 * const { backgroundColor, textColor } = backgroundValue('primary', 'solid', 'light')
 * // Returns: { backgroundColor: 'var(--color-primary-500)', textColor: 'var(--color-white)' }
 * ```
 */
export declare function backgroundValue(color: ExtendedColor, variant: BackgroundVariant, mode: Mode): {
    backgroundColor: string;
    textColor: string;
};
/**
 * Computes hover state background and text colors for interactive elements.
 * Applies darker/lighter shades depending on the variant and mode.
 *
 * @param color - The theme color name
 * @param variant - The background style variant ('solid', 'light', or 'soft')
 * @param mode - The theme mode ('light' or 'dark')
 * @returns An object containing `backgroundColor` and `textColor` CSS values for hover state
 *
 * @example
 * ```ts
 * const hover = hoverBackgroundValue('primary', 'solid', 'dark')
 * // Returns darker shade for hover effect
 * ```
 */
export declare function hoverBackgroundValue(color: ExtendedColor, variant: 'solid' | 'light' | 'soft', mode: Mode): {
    backgroundColor: string;
    textColor: string;
};
/**
 * Computes the border color for a given color and theme mode.
 * Uses medium-intensity shades (500 for light, 600 for dark).
 *
 * @param color - The theme color name
 * @param mode - The theme mode ('light' or 'dark')
 * @returns A CSS color value string
 *
 * @example
 * ```ts
 * const border = borderColorValue('primary', 'light')
 * // Returns 'var(--color-primary-500)'
 * ```
 */
export declare function borderColorValue(color: ExtendedColor, mode: Mode): string;
/**
 * Computes the text color for a given color and theme mode.
 * Uses high-contrast shades (800 for light, 200 for dark) for readability.
 *
 * @param color - The theme color name
 * @param mode - The theme mode ('light' or 'dark')
 * @returns A CSS color value string
 *
 * @example
 * ```ts
 * const text = textColorValue('primary', 'light')
 * // Returns 'var(--color-primary-800)'
 * ```
 */
export declare function textColorValue(color: ExtendedColor, mode: Mode): string;
/**
 * Computes the foreground color (for icons, accents) with a specified tone.
 * Supports both solid (vibrant) and soft (muted) tones.
 *
 * @param color - The theme color name
 * @param tone - The foreground tone ('solid' for vibrant, 'soft' for muted)
 * @param mode - The theme mode ('light' or 'dark')
 * @returns A CSS color value string
 *
 * @example
 * ```ts
 * const icon = foregroundColorValue('success', 'solid', 'light')
 * // Returns 'var(--color-success-500)'
 *
 * const mutedIcon = foregroundColorValue('success', 'soft', 'light')
 * // Returns 'var(--color-success-300)'
 * ```
 */
export declare function foregroundColorValue(color: ThemeColorName, tone: ForegroundTone, mode: Mode): string;