import { ReactNode } from 'react';
import { SxProps } from '@mui/material/styles';
interface AccountHeroCardProps {
    /** Central account/institution logo, rendered overhanging the card's top edge. */
    logo: ReactNode;
    /** Primary line, e.g. "Epic Bank Checking, *1234". */
    name: ReactNode;
    /** Optional secondary line beneath the name, e.g. "Checking Account". */
    subtitle?: ReactNode;
    /** Status element beneath the text (e.g. a `<StatusPill>`). */
    status?: ReactNode;
    /** Decorative backdrop behind the card (e.g. a `<Confetti>` burst). */
    backdrop?: ReactNode;
    /** Slot surface color token. Default `primary.lighter` (Figma's tinted slot,
     * theme-aware: light-blue in light mode, navy in dark). */
    bgcolor?: string;
    /**
     * Optional decorative wash layered over `bgcolor` (e.g. a celebration
     * gradient). Figma's gradient is ~20% opacity over a white base, so this is a
     * `backgroundImage` on top of `bgcolor`, not a replacement — pass
     * `bgcolor="background.paper"` with it for the complete state.
     */
    backgroundImage?: string;
    sx?: SxProps;
}
/**
 * A centered account hero: an overhanging institution logo above a white card
 * with a name, optional subtitle, and a status slot, over a tinted (or
 * gradient + confetti) slot.
 *
 * Figma: Set Up Direct Deposit (default + complete) and Switch Direct Deposit
 * (complete) Content. Scope is the Content section only.
 */
declare const AccountHeroCard: ({ backdrop, backgroundImage, bgcolor, logo, name, status, subtitle, sx, }: AccountHeroCardProps) => import("react/jsx-runtime").JSX.Element;
export default AccountHeroCard;