const offlineIndicatorTheme = {
    base: "fixed z-50 flex items-center gap-2 transition-all duration-300 select-none ",
    positions: {
        top: "top-4 left-1/2 -translate-x-1/2",
        bottom: "bottom-4 left-1/2 -translate-x-1/2",
        "top-left": "top-4 left-4",
        "top-right": "top-4 right-4",
        "bottom-left": "bottom-4 left-4",
        "bottom-right": "bottom-4 right-4",
    },
    variants: {
        banner: "w-full left-0 right-0 px-4 py-1 justify-center rounded-none shadow-real-lg",
        toast: "px-3 py-2 rounded-[var(--radius-base)] shadow-real-lg",
    },
    offline: "bg-[var(--color-neutral-900)]/90 backdrop-blur-sm text-white",
    online: "bg-[var(--color-success)]/90 backdrop-blur-sm text-[var(--color-success-contrast)]",
    icon: "size-4 flex-shrink-0",
    message: "text-sm font-medium",
    queueCount: "text-sm opacity-80 ml-1",
};

export { offlineIndicatorTheme };
