/**
 * Elevation styles for use in components. These can be brought in two different ways:
 * 1. Import them directly (`elevation1`, `elevation2`, etc) and use them in your styled component
 * 2. Use the theme directly `${({ theme }) => theme.elevations.elevation4};`
 * @example
 * // If you want to use the function directly
 * import { elevation1 } from '../themes/elevation.js'
 * ...
 * const StyledDiv = styled.div`
 *   ${elevation1};
 * `
 * @example
 * // If you want to use the theme
 * const StyledDiv = styled.div`
 *   ${({ theme }) => theme.elevations.elevation4};
 * `
 */
import { Theme } from './base-theme.js';
export declare const elevations: {
    readonly elevation1: "box-shadow: 0 0 0 1px rgb(0 0 0 / 10%), 0 4px 1px -2px rgb(0 0 0 / 8%);";
    readonly elevation2: "box-shadow: 0 0 0 1px rgb(0 0 0 / 10%), 0 4px 4px -2px rgb(0 0 0 / 5%), 0 8px 8px -4px rgb(0 0 0 / 5%), 0 16px 16px -8px rgb(0 0 0 / 5%);";
    readonly elevation3: "box-shadow: 0 0 0 1px rgb(0 0 0 / 10%), 0 8px 8px -4px rgb(0 0 0 / 5%), 0 16px 16px -8px rgb(0 0 0 / 5%), 0 32px 32px -16px rgb(0 0 0 / 5%);";
    readonly elevation4: "box-shadow: 0 0 0 1px rgb(0 0 0 / 10%), 0 16px 16px -16px rgb(0 0 0 / 5%), 0 32px 32px -16px rgb(0 0 0 / 5%), 0 64px 64px -32px rgb(0 0 0 / 5%);";
};
export declare const elevation1: ({ theme }: {
    theme: Theme;
}) => "box-shadow: 0 0 0 1px rgb(0 0 0 / 10%), 0 4px 1px -2px rgb(0 0 0 / 8%);";
export declare const elevation2: ({ theme }: {
    theme: Theme;
}) => "box-shadow: 0 0 0 1px rgb(0 0 0 / 10%), 0 4px 4px -2px rgb(0 0 0 / 5%), 0 8px 8px -4px rgb(0 0 0 / 5%), 0 16px 16px -8px rgb(0 0 0 / 5%);";
export declare const elevation3: ({ theme }: {
    theme: Theme;
}) => "box-shadow: 0 0 0 1px rgb(0 0 0 / 10%), 0 8px 8px -4px rgb(0 0 0 / 5%), 0 16px 16px -8px rgb(0 0 0 / 5%), 0 32px 32px -16px rgb(0 0 0 / 5%);";
export declare const elevation4: ({ theme }: {
    theme: Theme;
}) => "box-shadow: 0 0 0 1px rgb(0 0 0 / 10%), 0 16px 16px -16px rgb(0 0 0 / 5%), 0 32px 32px -16px rgb(0 0 0 / 5%), 0 64px 64px -32px rgb(0 0 0 / 5%);";
