const feedTheme = {
    // Structural
    baseStyle: "flow-root",
    listStyle: "-mb-8 [&>li:last-child>div>.feed-connector]:hidden",
    itemInnerStyle: "relative pb-8",
    itemContentStyle: "relative flex items-start space-x-4",
    connectorStyle: "feed-connector absolute top-5 left-5 -translate-x-1/2 h-full w-0.5 bg-[var(--color-border)]",
    // Indicators
    indicatorStyle: "relative flex size-8 ml-1 shrink-0 items-center justify-center bg-[var(--color-background-secondary)] rounded-full ring-2 ring-[var(--color-background)]/50",
    dotIndicatorStyle: "relative flex size-10 items-center justify-center",
    // Content
    contentStyle: "min-w-0 flex-1 pt-1",
    timestampStyle: "mt-1 text-xs text-[var(--color-text-muted)]/80 whitespace-nowrap",
    // Collapse
    collapseStyle: "relative",
    collapseButtonStyle: "flex items-center gap-1.5 text-sm font-medium text-[var(--color-primary)] hover:text-[var(--color-primary-700)] transition-colors cursor-pointer bg-transparent border-none p-0",
    collapseSvgStyle: "absolute top-0",
};

export { feedTheme };
