import { LitElement, PropertyValues } from "lit";
export type SkyCardElevation = "none" | "sm" | "md" | "lg";
export type SkyCardSectionLayout = "inline" | "stack";
export type SkyCardSectionTarget = "both" | "header" | "footer" | "none";
/**
 * @element sky-card
 *
 * @summary Customizable card with configurable header/footer sections, blur/background styles, elevation, insets, overlays, and separators.
 *
 * @status stable
 * @since 1.0.0
 *
 * @documentation https://sky-ui.com/components/card
 *
 * @slot - Default slot for the card body content (replaces `bodyPadding` property if used).
 * @slot title - Slot for the card title.
 * @slot subtitle - Slot for the card subtitle.
 * @slot actions - Slot for the card actions (usually buttons).
 * @slot footer-title - Slot for the footer title.
 * @slot footer-subtitle - Slot for the footer subtitle.
 * @slot footer-actions - Slot for the footer actions (usually buttons).
 *
 * @csspart card - The main card container element.
 * @csspart header - The card header section.
 * @csspart footer - The card footer section.
 * @csspart ripple - The ripple animation element injected when the card is clicked.
 *
 * @property {string} bg - Background color of the card. Accepts color tokens or custom CSS colors. Default: `"primary"`.
 * @property {string} blurLevel - Level of blur applied to the background. Default: `"none"`.
 * @property {string} radius - Border radius of the card. Default: `"md"`.
 * @property {string} bodyPadding - Padding for the card body. Default: `"none"`.
 * @property {SkyCardElevation} elevation - Shadow depth of the card. Default: `"md"`.
 * @property {boolean} outlined - Whether the card has an outline. Default: `false`.
 * @property {boolean} clickable - Whether the card is clickable. Default: `false`.
 * @property {string} headerBg - Background color of the header. Default: `"transparent"`.
 * @property {string} headerBlur - Blur level for the header background. Default: `"none"`.
 * @property {string} headerPadding - Padding for the header. Default: `"md"`.
 * @property {SkyCardSectionLayout} headerLayout - Layout of the header content. Default: `"inline"`.
 * @property {string} headerInsetGap - Inset gap for the header section. Default: `"sm"`.
 * @property {string} headerRadius - Border radius for the header. Default: `"md"`.
 * @property {string} headerSeparatorColor - Color for the header separator. Default: `"border-light"`.
 * @property {string} footerBg - Background color of the footer. Default: `"transparent"`.
 * @property {string} footerBlur - Blur level for the footer background. Default: `"none"`.
 * @property {string} footerPadding - Padding for the footer. Default: `"md"`.
 * @property {SkyCardSectionLayout} footerLayout - Layout of the footer content. Default: `"inline"`.
 * @property {string} footerInsetGap - Inset gap for the footer section. Default: `"sm"`.
 * @property {string} footerRadius - Border radius for the footer. Default: `"md"`.
 * @property {string} footerSeparatorColor - Color for the footer separator. Default: `"border-light"`.
 * @property {number} padRatio - Ratio to adjust padding. Default: `1`.
 * @property {SkyCardSectionTarget} separators - Determines where separators should appear. Default: `"none"`.
 * @property {SkyCardSectionTarget} overlays - Determines where overlays should appear. Default: `"none"`.
 * @property {SkyCardSectionTarget} insets - Determines where insets should appear. Default: `"none"`.
 * @property {string} preset - Named prop preset from nearest `sky-config-provider`. Default: `""`.
 * @method refreshLayout Recomputes card variables and section synchronization.
 *
 * @example
 * ```html
 * <sky-card bg="primary" elevation="lg" headerpadding="md">
 *   <span slot="title">Monthly Report</span>
 *   <span slot="subtitle">April 2026</span>
 *   <div>Total revenue increased by 18%.</div>
 *   <button slot="actions">View Details</button>
 * </sky-card>
 * ```
 * ```vue
 * <template>
 *   <sky-card bg="primary" elevation="lg" headerpadding="md">
 *     <span slot="title">Monthly Report</span>
 *     <span slot="subtitle">April 2026</span>
 *     <div>Total revenue increased by 18%.</div>
 *     <button slot="actions">View Details</button>
 *   </sky-card>
 * </template>
 * ```
 * ```jsx
 * export default function Demo() {
 *   return (
 *     <sky-card bg="primary" elevation="lg" headerpadding="md">
 *       <span slot="title">Monthly Report</span>
 *       <span slot="subtitle">April 2026</span>
 *       <div>Total revenue increased by 18%.</div>
 *       <button slot="actions">View Details</button>
 *     </sky-card>
 *   );
 * }
 * ```
 */
export declare class SkyCard extends LitElement {
    bg: string;
    blurLevel: string;
    radius: string;
    bodyPadding: string;
    elevation: SkyCardElevation;
    outlined: boolean;
    clickable: boolean;
    headerBg: string;
    headerBlur: string;
    headerPadding: string;
    headerLayout: SkyCardSectionLayout;
    headerInsetGap: string;
    headerRadius: string;
    headerSeparatorColor: string;
    footerBg: string;
    footerBlur: string;
    footerPadding: string;
    footerLayout: SkyCardSectionLayout;
    footerInsetGap: string;
    footerRadius: string;
    footerSeparatorColor: string;
    padRatio: number;
    separators: SkyCardSectionTarget;
    overlays: SkyCardSectionTarget;
    insets: SkyCardSectionTarget;
    private _effHeaderSeparator;
    private _effFooterSeparator;
    private _effHeaderOverlay;
    private _effFooterOverlay;
    private _effHeaderInset;
    private _effFooterInset;
    private _varsCache;
    private static readonly BG_MAP;
    private static readonly BLUR_MAP;
    private static readonly SIZE_MAP;
    private static readonly GLASS_BG_TIERS;
    /** Non-overlay inset bars use hover tints — overlay sections own their own blur. */
    private static readonly SECTION_INSET_BG_MAP;
    private static _composeBackdrop;
    private static _composeElevation;
    /** Named prop preset from nearest `sky-config-provider`. */
    preset: string;
    private _presets;
    static styles: import("lit").CSSResult;
    firstUpdated(): void;
    /**
     * After PresetController hostUpdate — card chrome may come from presets.
     * Keep flag recompute + CSS var apply here (not willUpdate).
     */
    protected update(changed: PropertyValues): void;
    private _wireSlotChangeHandlers;
    private _syncHeader;
    private _syncFooter;
    private _expandPair;
    private _computeEffectiveFlags;
    private _setVar;
    private _resolveSectionBg;
    private _resolveSectionGlassSurface;
    private _applyCardVars;
    private _applyPaddingVars;
    private _applySectionChrome;
    /**
     * Recomputes card variables and section synchronization.
     *
     * @returns {void}
     */
    refreshLayout(): void;
    render(): import("lit-html").TemplateResult<1>;
}