// src/utils/ui.js

/**
 * Vraća set Tailwind klasa za specifičnu temu
 * @param {string} tema - 'indigo', 'blue', 'emerald', 'amber', 'red'
 */
export function getThemeClasses(tema = "indigo") {
  const themes = {
    indigo: {
      bg: "bg-indigo-50",
      bgDark: "dark:bg-indigo-900/20",
      text: "text-indigo-600",
      textDark: "dark:text-indigo-400",
      border: "border-indigo-100",
      borderDark: "dark:border-indigo-900/30",
      shadow: "shadow-indigo-500/5",
      hover: "hover:bg-indigo-50/30 dark:hover:bg-indigo-900/10",
      icon: "group-hover:bg-indigo-600 group-hover:text-white"
    },
    blue: {
      bg: "bg-blue-50",
      bgDark: "dark:bg-blue-900/20",
      text: "text-blue-600",
      textDark: "dark:text-blue-400",
      border: "border-blue-100",
      borderDark: "dark:border-blue-900/30",
      shadow: "shadow-blue-500/5",
      hover: "hover:bg-blue-50/30 dark:hover:bg-blue-900/10",
      icon: "group-hover:bg-blue-600 group-hover:text-white"
    },
    emerald: {
      bg: "bg-emerald-50",
      bgDark: "dark:bg-emerald-900/20",
      text: "text-emerald-600",
      textDark: "dark:text-emerald-400",
      border: "border-emerald-100",
      borderDark: "dark:border-emerald-900/30",
      shadow: "shadow-emerald-500/5",
      hover: "hover:bg-emerald-50/30 dark:hover:bg-emerald-900/10",
      icon: "group-hover:bg-emerald-600 group-hover:text-white"
    },
    amber: {
      bg: "bg-amber-50",
      bgDark: "dark:bg-amber-900/20",
      text: "text-amber-600",
      textDark: "dark:text-amber-400",
      border: "border-amber-100",
      borderDark: "dark:border-amber-900/30",
      shadow: "shadow-amber-500/5",
      hover: "hover:bg-amber-50/30 dark:hover:bg-amber-900/10",
      icon: "group-hover:bg-amber-600 group-hover:text-white"
    },
    red: {
      bg: "bg-red-50",
      bgDark: "dark:bg-red-900/20",
      text: "text-red-600",
      textDark: "dark:text-red-400",
      border: "border-red-100",
      borderDark: "dark:border-red-900/30",
      shadow: "shadow-red-500/5",
      hover: "hover:bg-red-50/30 dark:hover:bg-red-900/10",
      icon: "group-hover:bg-red-600 group-hover:text-white"
    }
  };

  return themes[tema] || themes.indigo;
}

/**
 * Određuje boju kružića i animaciju na temelju statusa (Vozila + Radni Nalozi)
 */
export function getStatusColorClass(status) {
    // 1. Provjera postoji li status. Ako ne, vrati sivu boju.
    if (!status) return 'bg-gray-400';
    
    // 2. Siguran poziv toLowerCase()
    const s = String(status).toLowerCase();
    
    switch (s) {
        case 'u_radu': return 'bg-yellow-500 animate-pulse';
        case 'planirano': 
        case 'aktivan': return 'bg-blue-500';
        case 'zavrseno': return 'bg-emerald-500';
        case 'naplaceno': return 'bg-gray-500 opacity-50';
        case 'servis':
        case 'hitno': return 'bg-red-500 animate-pulse';
        default: return 'bg-gray-400';
    }
}

/**
 * Pretvara tehnički status u ljudima čitljiv format
 * Dodana provjera da spriječi toLowerCase error
 */
export function formatStatus(status) {
    // Provjera ako je status prazan
    if (!status) return 'Nepoznato';

    const labels = {
        'planirano': 'Planirano',
        'u_radu': 'U radu',
        'zavrseno': 'Završeno',
        'naplaceno': 'Naplaćeno',
        'aktivan': 'Aktivan',
        'servis': 'Na servisu',
        'hitno': 'HITNO'
    };

    const s = String(status).toLowerCase();
    return labels[s] || s;
}