import * as React from "react";

/**
 * @startingPoint section="Layout" subtitle="Card surface with header + actions" viewport="700x260"
 */
export interface CardProps {
  title?: React.ReactNode;
  subtitle?: React.ReactNode;
  /** Right-aligned header actions (buttons, menu). */
  actions?: React.ReactNode;
  children?: React.ReactNode;
  /** Body padding — turn off for flush tables/lists. */
  padded?: boolean;
  /** Sunken well background instead of card surface. */
  inset?: boolean;
  style?: React.CSSProperties;
}

/**
 * Panel surface with optional header row; the base container for dashboard
 * widgets, forms and detail panes.
 */
export function Card(props: CardProps): JSX.Element;