'use client'

import { useEffect, useState } from 'react'
import { CalendarRange, History, PlusCircle, Save, Sparkles, Trash2 } from 'lucide-react'
import { formatCurrency } from '@rentaldrivego/types'
import { apiFetch } from '@/lib/api'
import { useDashboardI18n } from '@/components/I18nProvider'

export interface PricingConfiguration {
  id: string
  vehicleId: string
  pricingMode: 'MANUAL' | 'AUTOMATIC'
  baseDailyRate: number
  weeklyRate: number | null
  weekendRate: number | null
  holidayRate: number | null
  monthlyRate: number | null
  longTermDailyRate: number | null
  minimumDailyRate: number | null
  maximumDailyRate: number | null
  maxDailyPriceMovementPct: number
  automaticPricingEnabled: boolean
  approvalRequired: boolean
  createdAt: string
  updatedAt: string
}

export interface PricingRule {
  id: string
  name: string
  ruleType: 'DATE_RANGE' | 'SEASONAL' | 'HOLIDAY' | 'WEEKEND' | 'SPECIAL_EVENT' | 'MANUAL_OVERRIDE'
  startDate: string
  endDate: string
  dailyRate: number | null
  weeklyRate: number | null
  weekendRate: number | null
  monthlyRate: number | null
  minDailyRate: number | null
  maxDailyRate: number | null
  automaticAdjustmentPct: number | null
  priceAdjustment: number | null
  isActive: boolean
  sortOrder: number
  createdAt: string
  updatedAt: string
}

export interface PricingHistoryEntry {
  id: string
  source: 'CONFIG_UPDATE' | 'RULE_CREATED' | 'RULE_UPDATED' | 'RULE_DELETED' | 'MANUAL_OVERRIDE'
  changedByEmployeeId: string | null
  previousDailyRate: number | null
  nextDailyRate: number | null
  previousWeeklyRate: number | null
  nextWeeklyRate: number | null
  note: string | null
  effectiveFrom: string | null
  createdAt: string
}

export interface PricingPreviewItem {
  date: string
  dailyRate: number
  pricingType: 'MANUAL_BASE' | 'AUTOMATIC_BASE' | 'WEEKEND_RATE' | 'RULE_RATE' | 'AUTOMATIC_RULE'
  matchedRuleName: string | null
}

export interface PricingResponse {
  configuration: PricingConfiguration
  rules: PricingRule[]
  history: PricingHistoryEntry[]
  preview: {
    today: PricingPreviewItem
    next14Days: PricingPreviewItem[]
  }
}

export interface ConfigForm {
  pricingMode: 'MANUAL' | 'AUTOMATIC'
  baseDailyRate: string
  weeklyRate: string
  weekendRate: string
  holidayRate: string
  monthlyRate: string
  longTermDailyRate: string
  minimumDailyRate: string
  maximumDailyRate: string
  maxDailyPriceMovementPct: string
  automaticPricingEnabled: boolean
  approvalRequired: boolean
}

export interface RuleForm {
  id?: string
  name: string
  ruleType: PricingRule['ruleType']
  startDate: string
  endDate: string
  dailyRate: string
  weeklyRate: string
  weekendRate: string
  monthlyRate: string
  minDailyRate: string
  maxDailyRate: string
  automaticAdjustmentPct: string
  priceAdjustment: string
  isActive: boolean
  sortOrder: string
}

export function centsToInput(value: number | null | undefined) {
  return value == null ? '' : (value / 100).toFixed(2)
}

export function inputToCents(value: string) {
  if (!value.trim()) return null
  const parsed = Number.parseFloat(value)
  if (!Number.isFinite(parsed)) return null
  return Math.round(parsed * 100)
}

export function numericInputToInt(value: string) {
  if (!value.trim()) return null
  const parsed = Number.parseInt(value, 10)
  return Number.isFinite(parsed) ? parsed : null
}

export function toDateInput(value: string) {
  return value.slice(0, 10)
}

export function buildConfigForm(configuration: PricingConfiguration): ConfigForm {
  return {
    pricingMode: configuration.pricingMode,
    baseDailyRate: centsToInput(configuration.baseDailyRate),
    weeklyRate: centsToInput(configuration.weeklyRate),
    weekendRate: centsToInput(configuration.weekendRate),
    holidayRate: centsToInput(configuration.holidayRate),
    monthlyRate: centsToInput(configuration.monthlyRate),
    longTermDailyRate: centsToInput(configuration.longTermDailyRate),
    minimumDailyRate: centsToInput(configuration.minimumDailyRate),
    maximumDailyRate: centsToInput(configuration.maximumDailyRate),
    maxDailyPriceMovementPct: String(configuration.maxDailyPriceMovementPct),
    automaticPricingEnabled: configuration.automaticPricingEnabled,
    approvalRequired: configuration.approvalRequired,
  }
}

export function buildRuleForm(rule?: PricingRule): RuleForm {
  const today = new Date().toISOString().slice(0, 10)
  const nextWeek = new Date(Date.now() + 6 * 24 * 60 * 60 * 1000).toISOString().slice(0, 10)

  return {
    id: rule?.id,
    name: rule?.name ?? '',
    ruleType: rule?.ruleType ?? 'DATE_RANGE',
    startDate: rule ? toDateInput(rule.startDate) : today,
    endDate: rule ? toDateInput(rule.endDate) : nextWeek,
    dailyRate: centsToInput(rule?.dailyRate),
    weeklyRate: centsToInput(rule?.weeklyRate),
    weekendRate: centsToInput(rule?.weekendRate),
    monthlyRate: centsToInput(rule?.monthlyRate),
    minDailyRate: centsToInput(rule?.minDailyRate),
    maxDailyRate: centsToInput(rule?.maxDailyRate),
    automaticAdjustmentPct: rule?.automaticAdjustmentPct != null ? String(rule.automaticAdjustmentPct) : '',
    priceAdjustment: centsToInput(rule?.priceAdjustment),
    isActive: rule?.isActive ?? true,
    sortOrder: rule?.sortOrder != null ? String(rule.sortOrder) : '0',
  }
}

export default function VehiclePricingManager({ vehicleId }: { vehicleId: string }) {
  const { language } = useDashboardI18n()
  const copy = {
    en: {
      title: 'Pricing management',
      subtitle: 'Manage fixed rates, automatic pricing bounds, seasonal rules, and pricing history for this vehicle.',
      savePricing: 'Save pricing',
      saving: 'Saving…',
      loading: 'Loading pricing settings…',
      mode: 'Pricing method',
      manual: 'Manual fixed pricing',
      automatic: 'Automatic dynamic pricing',
      baseDailyRate: 'Base daily rate (MAD)',
      weeklyRate: 'Weekly rate (MAD)',
      weekendRate: 'Weekend rate (MAD)',
      holidayRate: 'Holiday rate (MAD)',
      monthlyRate: 'Monthly rate (MAD)',
      longTermDailyRate: 'Long-term daily rate (MAD)',
      minimumDailyRate: 'Minimum daily rate (MAD)',
      maximumDailyRate: 'Maximum daily rate (MAD)',
      automaticPricingEnabled: 'Automatic pricing enabled',
      approvalRequired: 'Approve automatic price changes before they go live',
      maxDailyMovement: 'Max daily price movement (%)',
      currentPreview: 'Current pricing preview',
      next14Days: 'Next 14 days',
      matchedRule: 'Matched rule',
      noRule: 'No rule',
      rules: 'Seasonal and manual rules',
      addRule: 'Add rule',
      createRule: 'Create rule',
      updateRule: 'Save rule',
      deleting: 'Deleting…',
      deleteRule: 'Delete',
      noRules: 'No vehicle-specific pricing rules yet.',
      history: 'Pricing history',
      noHistory: 'No pricing changes recorded yet.',
      active: 'Active',
      inactive: 'Inactive',
      startDate: 'Start date',
      endDate: 'End date',
      name: 'Rule name',
      ruleType: 'Rule type',
      adjustmentPct: 'Auto adjustment (%)',
      priceAdjustment: 'Flat adjustment (MAD)',
      sortOrder: 'Priority',
      saveErrorBase: 'Base daily rate is required.',
      saveErrorBounds: 'Minimum daily rate cannot be greater than maximum daily rate.',
      saveErrorRule: 'Rules need a name plus at least one rate, bound, or adjustment.',
      configSaved: 'Pricing settings saved.',
      ruleSaved: 'Pricing rule saved.',
      ruleCreated: 'Pricing rule created.',
      ruleDeleted: 'Pricing rule deleted.',
      previewLabels: {
        MANUAL_BASE: 'Base manual price',
        AUTOMATIC_BASE: 'Automatic base price',
        WEEKEND_RATE: 'Weekend price',
        RULE_RATE: 'Manual rule',
        AUTOMATIC_RULE: 'Automatic rule',
      } as Record<PricingPreviewItem['pricingType'], string>,
      ruleTypeLabels: {
        DATE_RANGE: 'Date range',
        SEASONAL: 'Season',
        HOLIDAY: 'Holiday',
        WEEKEND: 'Weekend',
        SPECIAL_EVENT: 'Special event',
        MANUAL_OVERRIDE: 'Manual override',
      } as Record<PricingRule['ruleType'], string>,
      historyLabels: {
        CONFIG_UPDATE: 'Configuration updated',
        RULE_CREATED: 'Rule created',
        RULE_UPDATED: 'Rule updated',
        RULE_DELETED: 'Rule deleted',
        MANUAL_OVERRIDE: 'Manual override',
      } as Record<PricingHistoryEntry['source'], string>,
      ruleHint: 'Use direct rates for fixed pricing or adjustments and bounds to guide automatic pricing.',
    },
    fr: {
      title: 'Gestion des tarifs',
      subtitle: 'Gérez les tarifs fixes, les limites automatiques, les saisons et l’historique des prix de ce véhicule.',
      savePricing: 'Enregistrer les tarifs',
      saving: 'Enregistrement…',
      loading: 'Chargement des paramètres tarifaires…',
      mode: 'Méthode tarifaire',
      manual: 'Tarification fixe manuelle',
      automatic: 'Tarification dynamique automatique',
      baseDailyRate: 'Tarif journalier de base (MAD)',
      weeklyRate: 'Tarif hebdomadaire (MAD)',
      weekendRate: 'Tarif week-end (MAD)',
      holidayRate: 'Tarif jours fériés (MAD)',
      monthlyRate: 'Tarif mensuel (MAD)',
      longTermDailyRate: 'Tarif long séjour / jour (MAD)',
      minimumDailyRate: 'Tarif journalier minimum (MAD)',
      maximumDailyRate: 'Tarif journalier maximum (MAD)',
      automaticPricingEnabled: 'Tarification automatique activée',
      approvalRequired: 'Valider les changements automatiques avant publication',
      maxDailyMovement: 'Variation maximale par jour (%)',
      currentPreview: 'Aperçu des tarifs',
      next14Days: '14 prochains jours',
      matchedRule: 'Règle appliquée',
      noRule: 'Aucune règle',
      rules: 'Règles saisonnières et manuelles',
      addRule: 'Ajouter une règle',
      createRule: 'Créer la règle',
      updateRule: 'Enregistrer la règle',
      deleting: 'Suppression…',
      deleteRule: 'Supprimer',
      noRules: 'Aucune règle spécifique au véhicule pour le moment.',
      history: 'Historique tarifaire',
      noHistory: 'Aucun changement tarifaire enregistré.',
      active: 'Active',
      inactive: 'Inactive',
      startDate: 'Date de début',
      endDate: 'Date de fin',
      name: 'Nom de la règle',
      ruleType: 'Type de règle',
      adjustmentPct: 'Ajustement auto (%)',
      priceAdjustment: 'Ajustement fixe (MAD)',
      sortOrder: 'Priorité',
      saveErrorBase: 'Le tarif journalier de base est requis.',
      saveErrorBounds: 'Le tarif minimum ne peut pas dépasser le maximum.',
      saveErrorRule: 'Les règles nécessitent un nom et au moins un tarif, une limite ou un ajustement.',
      configSaved: 'Paramètres tarifaires enregistrés.',
      ruleSaved: 'Règle tarifaire enregistrée.',
      ruleCreated: 'Règle tarifaire créée.',
      ruleDeleted: 'Règle tarifaire supprimée.',
      previewLabels: {
        MANUAL_BASE: 'Tarif manuel de base',
        AUTOMATIC_BASE: 'Base automatique',
        WEEKEND_RATE: 'Tarif week-end',
        RULE_RATE: 'Règle manuelle',
        AUTOMATIC_RULE: 'Règle automatique',
      } as Record<PricingPreviewItem['pricingType'], string>,
      ruleTypeLabels: {
        DATE_RANGE: 'Plage de dates',
        SEASONAL: 'Saison',
        HOLIDAY: 'Jour férié',
        WEEKEND: 'Week-end',
        SPECIAL_EVENT: 'Événement spécial',
        MANUAL_OVERRIDE: 'Forçage manuel',
      } as Record<PricingRule['ruleType'], string>,
      historyLabels: {
        CONFIG_UPDATE: 'Configuration mise à jour',
        RULE_CREATED: 'Règle créée',
        RULE_UPDATED: 'Règle mise à jour',
        RULE_DELETED: 'Règle supprimée',
        MANUAL_OVERRIDE: 'Forçage manuel',
      } as Record<PricingHistoryEntry['source'], string>,
      ruleHint: 'Utilisez des tarifs directs pour le fixe ou des ajustements et limites pour guider l’automatique.',
    },
    ar: {
      title: 'إدارة التسعير',
      subtitle: 'إدارة الأسعار الثابتة وحدود التسعير التلقائي والقواعد الموسمية وسجل تغييرات السعر لهذه السيارة.',
      savePricing: 'حفظ التسعير',
      saving: 'جارٍ الحفظ…',
      loading: 'جارٍ تحميل إعدادات التسعير…',
      mode: 'طريقة التسعير',
      manual: 'تسعير ثابت يدوي',
      automatic: 'تسعير ديناميكي تلقائي',
      baseDailyRate: 'السعر اليومي الأساسي (درهم)',
      weeklyRate: 'السعر الأسبوعي (درهم)',
      weekendRate: 'سعر عطلة نهاية الأسبوع (درهم)',
      holidayRate: 'سعر العطل (درهم)',
      monthlyRate: 'السعر الشهري (درهم)',
      longTermDailyRate: 'سعر الإيجار الطويل / يوم (درهم)',
      minimumDailyRate: 'الحد الأدنى للسعر اليومي (درهم)',
      maximumDailyRate: 'الحد الأقصى للسعر اليومي (درهم)',
      automaticPricingEnabled: 'تفعيل التسعير التلقائي',
      approvalRequired: 'اعتماد تغييرات السعر التلقائية قبل نشرها',
      maxDailyMovement: 'أقصى تغيير يومي (%)',
      currentPreview: 'معاينة التسعير الحالية',
      next14Days: 'الأيام الـ 14 القادمة',
      matchedRule: 'القاعدة المطبقة',
      noRule: 'لا توجد قاعدة',
      rules: 'القواعد الموسمية واليدوية',
      addRule: 'إضافة قاعدة',
      createRule: 'إنشاء القاعدة',
      updateRule: 'حفظ القاعدة',
      deleting: 'جارٍ الحذف…',
      deleteRule: 'حذف',
      noRules: 'لا توجد قواعد تسعير خاصة بهذه السيارة بعد.',
      history: 'سجل التسعير',
      noHistory: 'لا توجد تغييرات تسعير مسجلة بعد.',
      active: 'نشطة',
      inactive: 'غير نشطة',
      startDate: 'تاريخ البدء',
      endDate: 'تاريخ الانتهاء',
      name: 'اسم القاعدة',
      ruleType: 'نوع القاعدة',
      adjustmentPct: 'تعديل تلقائي (%)',
      priceAdjustment: 'تعديل ثابت (درهم)',
      sortOrder: 'الأولوية',
      saveErrorBase: 'السعر اليومي الأساسي مطلوب.',
      saveErrorBounds: 'لا يمكن أن يكون الحد الأدنى أعلى من الحد الأقصى.',
      saveErrorRule: 'تحتاج القواعد إلى اسم وإلى سعر أو حد أو تعديل واحد على الأقل.',
      configSaved: 'تم حفظ إعدادات التسعير.',
      ruleSaved: 'تم حفظ قاعدة التسعير.',
      ruleCreated: 'تم إنشاء قاعدة التسعير.',
      ruleDeleted: 'تم حذف قاعدة التسعير.',
      previewLabels: {
        MANUAL_BASE: 'السعر اليدوي الأساسي',
        AUTOMATIC_BASE: 'السعر الأساسي التلقائي',
        WEEKEND_RATE: 'سعر عطلة نهاية الأسبوع',
        RULE_RATE: 'قاعدة يدوية',
        AUTOMATIC_RULE: 'قاعدة تلقائية',
      } as Record<PricingPreviewItem['pricingType'], string>,
      ruleTypeLabels: {
        DATE_RANGE: 'نطاق تاريخ',
        SEASONAL: 'موسم',
        HOLIDAY: 'عطلة',
        WEEKEND: 'نهاية أسبوع',
        SPECIAL_EVENT: 'مناسبة خاصة',
        MANUAL_OVERRIDE: 'تجاوز يدوي',
      } as Record<PricingRule['ruleType'], string>,
      historyLabels: {
        CONFIG_UPDATE: 'تم تحديث الإعدادات',
        RULE_CREATED: 'تم إنشاء قاعدة',
        RULE_UPDATED: 'تم تحديث قاعدة',
        RULE_DELETED: 'تم حذف قاعدة',
        MANUAL_OVERRIDE: 'تجاوز يدوي',
      } as Record<PricingHistoryEntry['source'], string>,
      ruleHint: 'استخدم أسعاراً مباشرة للتسعير الثابت أو تعديلات وحدوداً لتوجيه التسعير التلقائي.',
    },
  }[language]

  const [loading, setLoading] = useState(true)
  const [savingConfig, setSavingConfig] = useState(false)
  const [savingRuleId, setSavingRuleId] = useState<string | null>(null)
  const [deletingRuleId, setDeletingRuleId] = useState<string | null>(null)
  const [error, setError] = useState<string | null>(null)
  const [success, setSuccess] = useState<string | null>(null)
  const [configForm, setConfigForm] = useState<ConfigForm | null>(null)
  const [rules, setRules] = useState<RuleForm[]>([])
  const [newRule, setNewRule] = useState<RuleForm>(buildRuleForm())
  const [history, setHistory] = useState<PricingHistoryEntry[]>([])
  const [preview, setPreview] = useState<PricingResponse['preview'] | null>(null)

  function applyResponse(data: PricingResponse) {
    setConfigForm(buildConfigForm(data.configuration))
    setRules(data.rules.map((rule) => buildRuleForm(rule)))
    setHistory(data.history)
    setPreview(data.preview)
  }

  async function load() {
    setLoading(true)
    try {
      const data = await apiFetch<PricingResponse>(`/vehicles/${vehicleId}/pricing`)
      applyResponse(data)
      setError(null)
    } catch (err: any) {
      setError(err.message ?? 'Failed to load vehicle pricing')
    } finally {
      setLoading(false)
    }
  }

  useEffect(() => {
    load()
  }, [vehicleId])

  async function saveConfiguration() {
    if (!configForm) return
    const baseDailyRate = inputToCents(configForm.baseDailyRate)
    const minimumDailyRate = inputToCents(configForm.minimumDailyRate)
    const maximumDailyRate = inputToCents(configForm.maximumDailyRate)

    if (baseDailyRate == null) {
      setError(copy.saveErrorBase)
      return
    }
    if (minimumDailyRate != null && maximumDailyRate != null && minimumDailyRate > maximumDailyRate) {
      setError(copy.saveErrorBounds)
      return
    }

    setSavingConfig(true)
    setError(null)
    setSuccess(null)
    try {
      const data = await apiFetch<PricingResponse>(`/vehicles/${vehicleId}/pricing`, {
        method: 'PUT',
        body: JSON.stringify({
          pricingMode: configForm.pricingMode,
          baseDailyRate,
          weeklyRate: inputToCents(configForm.weeklyRate),
          weekendRate: inputToCents(configForm.weekendRate),
          holidayRate: inputToCents(configForm.holidayRate),
          monthlyRate: inputToCents(configForm.monthlyRate),
          longTermDailyRate: inputToCents(configForm.longTermDailyRate),
          minimumDailyRate,
          maximumDailyRate,
          maxDailyPriceMovementPct: numericInputToInt(configForm.maxDailyPriceMovementPct) ?? 10,
          automaticPricingEnabled: configForm.automaticPricingEnabled,
          approvalRequired: configForm.approvalRequired,
          note: copy.configSaved,
        }),
      })
      applyResponse(data)
      setSuccess(copy.configSaved)
    } catch (err: any) {
      setError(err.message ?? copy.saveErrorBase)
    } finally {
      setSavingConfig(false)
    }
  }

  async function saveRule(rule: RuleForm, create = false) {
    const hasPricingEffect = [
      inputToCents(rule.dailyRate),
      inputToCents(rule.weeklyRate),
      inputToCents(rule.weekendRate),
      inputToCents(rule.monthlyRate),
      inputToCents(rule.minDailyRate),
      inputToCents(rule.maxDailyRate),
      numericInputToInt(rule.automaticAdjustmentPct),
      inputToCents(rule.priceAdjustment),
    ].some((value) => value != null)

    if (!rule.name.trim() || !hasPricingEffect) {
      setError(copy.saveErrorRule)
      return
    }

    const payload = {
      name: rule.name.trim(),
      ruleType: rule.ruleType,
      startDate: rule.startDate,
      endDate: rule.endDate,
      dailyRate: inputToCents(rule.dailyRate),
      weeklyRate: inputToCents(rule.weeklyRate),
      weekendRate: inputToCents(rule.weekendRate),
      monthlyRate: inputToCents(rule.monthlyRate),
      minDailyRate: inputToCents(rule.minDailyRate),
      maxDailyRate: inputToCents(rule.maxDailyRate),
      automaticAdjustmentPct: numericInputToInt(rule.automaticAdjustmentPct),
      priceAdjustment: inputToCents(rule.priceAdjustment),
      isActive: rule.isActive,
      sortOrder: numericInputToInt(rule.sortOrder) ?? 0,
    }

    setSavingRuleId(rule.id ?? 'new')
    setError(null)
    setSuccess(null)
    try {
      const data = create
        ? await apiFetch<PricingResponse>(`/vehicles/${vehicleId}/pricing/rules`, { method: 'POST', body: JSON.stringify(payload) })
        : await apiFetch<PricingResponse>(`/vehicles/${vehicleId}/pricing/rules/${rule.id}`, { method: 'PATCH', body: JSON.stringify(payload) })
      applyResponse(data)
      if (create) {
        setNewRule(buildRuleForm())
        setSuccess(copy.ruleCreated)
      } else {
        setSuccess(copy.ruleSaved)
      }
    } catch (err: any) {
      setError(err.message ?? copy.saveErrorRule)
    } finally {
      setSavingRuleId(null)
    }
  }

  async function deleteRule(ruleId: string) {
    setDeletingRuleId(ruleId)
    setError(null)
    setSuccess(null)
    try {
      const data = await apiFetch<PricingResponse>(`/vehicles/${vehicleId}/pricing/rules/${ruleId}`, { method: 'DELETE' })
      applyResponse(data)
      setSuccess(copy.ruleDeleted)
    } catch (err: any) {
      setError(err.message ?? copy.ruleDeleted)
    } finally {
      setDeletingRuleId(null)
    }
  }

  if (loading || !configForm || !preview) {
    return <div className="card p-6 text-sm text-slate-500">{copy.loading}</div>
  }

  return (
    <div className="space-y-6">
      <div className="card p-6">
        <div className="flex flex-wrap items-start justify-between gap-4">
          <div>
            <h3 className="text-base font-semibold text-slate-900">{copy.title}</h3>
            <p className="mt-1 max-w-3xl text-sm text-slate-500">{copy.subtitle}</p>
          </div>
          <button onClick={saveConfiguration} disabled={savingConfig} className="btn-primary">
            <Save className="h-4 w-4" />
            {savingConfig ? copy.saving : copy.savePricing}
          </button>
        </div>

        {error && <div className="mt-4 rounded-xl border border-red-200 bg-red-50 px-4 py-3 text-sm text-red-700">{error}</div>}
        {success && <div className="mt-4 rounded-xl border border-green-200 bg-green-50 px-4 py-3 text-sm text-green-700">{success}</div>}

        <div className="mt-6 grid gap-6 xl:grid-cols-[1.2fr_0.8fr]">
          <div className="grid gap-4 rounded-2xl border border-slate-200 bg-slate-50 p-4 md:grid-cols-2">
            <div className="md:col-span-2">
              <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.mode}</label>
              <select className="input-field" value={configForm.pricingMode} onChange={(event) => setConfigForm((current) => current ? { ...current, pricingMode: event.target.value as ConfigForm['pricingMode'] } : current)}>
                <option value="MANUAL">{copy.manual}</option>
                <option value="AUTOMATIC">{copy.automatic}</option>
              </select>
            </div>
            <div>
              <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.baseDailyRate}</label>
              <input className="input-field" type="number" min="0" step="0.01" value={configForm.baseDailyRate} onChange={(event) => setConfigForm((current) => current ? { ...current, baseDailyRate: event.target.value } : current)} />
            </div>
            <div>
              <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.weeklyRate}</label>
              <input className="input-field" type="number" min="0" step="0.01" value={configForm.weeklyRate} onChange={(event) => setConfigForm((current) => current ? { ...current, weeklyRate: event.target.value } : current)} />
            </div>
            <div>
              <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.weekendRate}</label>
              <input className="input-field" type="number" min="0" step="0.01" value={configForm.weekendRate} onChange={(event) => setConfigForm((current) => current ? { ...current, weekendRate: event.target.value } : current)} />
            </div>
            <div>
              <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.holidayRate}</label>
              <input className="input-field" type="number" min="0" step="0.01" value={configForm.holidayRate} onChange={(event) => setConfigForm((current) => current ? { ...current, holidayRate: event.target.value } : current)} />
            </div>
            <div>
              <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.monthlyRate}</label>
              <input className="input-field" type="number" min="0" step="0.01" value={configForm.monthlyRate} onChange={(event) => setConfigForm((current) => current ? { ...current, monthlyRate: event.target.value } : current)} />
            </div>
            <div>
              <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.longTermDailyRate}</label>
              <input className="input-field" type="number" min="0" step="0.01" value={configForm.longTermDailyRate} onChange={(event) => setConfigForm((current) => current ? { ...current, longTermDailyRate: event.target.value } : current)} />
            </div>
            <div>
              <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.minimumDailyRate}</label>
              <input className="input-field" type="number" min="0" step="0.01" value={configForm.minimumDailyRate} onChange={(event) => setConfigForm((current) => current ? { ...current, minimumDailyRate: event.target.value } : current)} />
            </div>
            <div>
              <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.maximumDailyRate}</label>
              <input className="input-field" type="number" min="0" step="0.01" value={configForm.maximumDailyRate} onChange={(event) => setConfigForm((current) => current ? { ...current, maximumDailyRate: event.target.value } : current)} />
            </div>
            <div>
              <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.maxDailyMovement}</label>
              <input className="input-field" type="number" min="0" max="100" step="1" value={configForm.maxDailyPriceMovementPct} onChange={(event) => setConfigForm((current) => current ? { ...current, maxDailyPriceMovementPct: event.target.value } : current)} />
            </div>
            <div className="md:col-span-2 flex flex-col gap-3 rounded-2xl border border-slate-200 bg-white p-4">
              <label className="flex items-center gap-3 text-sm font-medium text-slate-700">
                <input type="checkbox" checked={configForm.automaticPricingEnabled} onChange={(event) => setConfigForm((current) => current ? { ...current, automaticPricingEnabled: event.target.checked } : current)} />
                {copy.automaticPricingEnabled}
              </label>
              <label className="flex items-center gap-3 text-sm font-medium text-slate-700">
                <input type="checkbox" checked={configForm.approvalRequired} onChange={(event) => setConfigForm((current) => current ? { ...current, approvalRequired: event.target.checked } : current)} />
                {copy.approvalRequired}
              </label>
            </div>
          </div>

          <div className="rounded-2xl border border-slate-200 bg-white p-5">
            <div className="flex items-center gap-2">
              <Sparkles className="h-4 w-4 text-blue-600" />
              <h4 className="text-sm font-semibold text-slate-900">{copy.currentPreview}</h4>
            </div>
            <div className="mt-4 rounded-2xl bg-slate-50 p-4">
              <p className="text-xs uppercase tracking-wide text-slate-500">{preview.today.date}</p>
              <p className="mt-2 text-2xl font-semibold text-slate-900">{formatCurrency(preview.today.dailyRate, 'MAD')}</p>
              <p className="mt-1 text-sm text-slate-500">{copy.previewLabels[preview.today.pricingType]}</p>
              <p className="mt-2 text-xs text-slate-400">{copy.matchedRule}: {preview.today.matchedRuleName ?? copy.noRule}</p>
            </div>
            <div className="mt-4">
              <div className="mb-3 flex items-center gap-2">
                <CalendarRange className="h-4 w-4 text-slate-400" />
                <p className="text-sm font-semibold text-slate-900">{copy.next14Days}</p>
              </div>
              <div className="space-y-2">
                {preview.next14Days.map((item) => (
                  <div key={item.date} className="flex items-center justify-between rounded-xl border border-slate-100 px-3 py-2 text-sm">
                    <div>
                      <p className="font-medium text-slate-900">{item.date}</p>
                      <p className="text-xs text-slate-500">{copy.previewLabels[item.pricingType]}</p>
                    </div>
                    <div className="text-right">
                      <p className="font-semibold text-slate-900">{formatCurrency(item.dailyRate, 'MAD')}</p>
                      <p className="text-xs text-slate-400">{item.matchedRuleName ?? copy.noRule}</p>
                    </div>
                  </div>
                ))}
              </div>
            </div>
          </div>
        </div>
      </div>

      <div className="card p-6">
        <h3 className="text-base font-semibold text-slate-900">{copy.rules}</h3>
        <p className="mt-1 text-sm text-slate-500">{copy.ruleHint}</p>

        <div className="mt-5 space-y-4">
          {rules.map((rule, index) => (
            <div key={rule.id} className="rounded-2xl border border-slate-200 bg-slate-50 p-4">
              <div className="grid gap-4 lg:grid-cols-2">
                <div>
                  <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.name}</label>
                  <input className="input-field" value={rule.name} onChange={(event) => setRules((current) => current.map((entry, entryIndex) => entryIndex === index ? { ...entry, name: event.target.value } : entry))} />
                </div>
                <div>
                  <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.ruleType}</label>
                  <select className="input-field" value={rule.ruleType} onChange={(event) => setRules((current) => current.map((entry, entryIndex) => entryIndex === index ? { ...entry, ruleType: event.target.value as RuleForm['ruleType'] } : entry))}>
                    {Object.entries(copy.ruleTypeLabels).map(([value, label]) => (
                      <option key={value} value={value}>{label}</option>
                    ))}
                  </select>
                </div>
                <div>
                  <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.startDate}</label>
                  <input className="input-field" type="date" value={rule.startDate} onChange={(event) => setRules((current) => current.map((entry, entryIndex) => entryIndex === index ? { ...entry, startDate: event.target.value } : entry))} />
                </div>
                <div>
                  <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.endDate}</label>
                  <input className="input-field" type="date" value={rule.endDate} onChange={(event) => setRules((current) => current.map((entry, entryIndex) => entryIndex === index ? { ...entry, endDate: event.target.value } : entry))} />
                </div>
                <div>
                  <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.baseDailyRate}</label>
                  <input className="input-field" type="number" min="0" step="0.01" value={rule.dailyRate} onChange={(event) => setRules((current) => current.map((entry, entryIndex) => entryIndex === index ? { ...entry, dailyRate: event.target.value } : entry))} />
                </div>
                <div>
                  <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.weeklyRate}</label>
                  <input className="input-field" type="number" min="0" step="0.01" value={rule.weeklyRate} onChange={(event) => setRules((current) => current.map((entry, entryIndex) => entryIndex === index ? { ...entry, weeklyRate: event.target.value } : entry))} />
                </div>
                <div>
                  <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.weekendRate}</label>
                  <input className="input-field" type="number" min="0" step="0.01" value={rule.weekendRate} onChange={(event) => setRules((current) => current.map((entry, entryIndex) => entryIndex === index ? { ...entry, weekendRate: event.target.value } : entry))} />
                </div>
                <div>
                  <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.monthlyRate}</label>
                  <input className="input-field" type="number" min="0" step="0.01" value={rule.monthlyRate} onChange={(event) => setRules((current) => current.map((entry, entryIndex) => entryIndex === index ? { ...entry, monthlyRate: event.target.value } : entry))} />
                </div>
                <div>
                  <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.minimumDailyRate}</label>
                  <input className="input-field" type="number" min="0" step="0.01" value={rule.minDailyRate} onChange={(event) => setRules((current) => current.map((entry, entryIndex) => entryIndex === index ? { ...entry, minDailyRate: event.target.value } : entry))} />
                </div>
                <div>
                  <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.maximumDailyRate}</label>
                  <input className="input-field" type="number" min="0" step="0.01" value={rule.maxDailyRate} onChange={(event) => setRules((current) => current.map((entry, entryIndex) => entryIndex === index ? { ...entry, maxDailyRate: event.target.value } : entry))} />
                </div>
                <div>
                  <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.adjustmentPct}</label>
                  <input className="input-field" type="number" step="1" value={rule.automaticAdjustmentPct} onChange={(event) => setRules((current) => current.map((entry, entryIndex) => entryIndex === index ? { ...entry, automaticAdjustmentPct: event.target.value } : entry))} />
                </div>
                <div>
                  <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.priceAdjustment}</label>
                  <input className="input-field" type="number" step="0.01" value={rule.priceAdjustment} onChange={(event) => setRules((current) => current.map((entry, entryIndex) => entryIndex === index ? { ...entry, priceAdjustment: event.target.value } : entry))} />
                </div>
                <div>
                  <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.sortOrder}</label>
                  <input className="input-field" type="number" min="0" step="1" value={rule.sortOrder} onChange={(event) => setRules((current) => current.map((entry, entryIndex) => entryIndex === index ? { ...entry, sortOrder: event.target.value } : entry))} />
                </div>
                <div className="flex items-end">
                  <label className="flex items-center gap-3 text-sm font-medium text-slate-700">
                    <input type="checkbox" checked={rule.isActive} onChange={(event) => setRules((current) => current.map((entry, entryIndex) => entryIndex === index ? { ...entry, isActive: event.target.checked } : entry))} />
                    {rule.isActive ? copy.active : copy.inactive}
                  </label>
                </div>
              </div>
              <div className="mt-4 flex flex-wrap items-center justify-end gap-2">
                <button onClick={() => deleteRule(rule.id!)} disabled={deletingRuleId === rule.id} className="btn-secondary text-red-600">
                  <Trash2 className="h-4 w-4" />
                  {deletingRuleId === rule.id ? copy.deleting : copy.deleteRule}
                </button>
                <button onClick={() => saveRule(rule)} disabled={savingRuleId === rule.id} className="btn-primary">
                  <Save className="h-4 w-4" />
                  {savingRuleId === rule.id ? copy.saving : copy.updateRule}
                </button>
              </div>
            </div>
          ))}

          {rules.length === 0 && <div className="rounded-2xl border border-dashed border-slate-200 px-4 py-6 text-sm text-slate-400">{copy.noRules}</div>}
        </div>

        <div className="mt-6 rounded-2xl border border-blue-100 bg-blue-50/60 p-4">
          <div className="mb-4 flex items-center gap-2">
            <PlusCircle className="h-4 w-4 text-blue-600" />
            <h4 className="text-sm font-semibold text-slate-900">{copy.addRule}</h4>
          </div>
          <div className="grid gap-4 lg:grid-cols-2">
            <div>
              <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.name}</label>
              <input className="input-field" value={newRule.name} onChange={(event) => setNewRule((current) => ({ ...current, name: event.target.value }))} />
            </div>
            <div>
              <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.ruleType}</label>
              <select className="input-field" value={newRule.ruleType} onChange={(event) => setNewRule((current) => ({ ...current, ruleType: event.target.value as RuleForm['ruleType'] }))}>
                {Object.entries(copy.ruleTypeLabels).map(([value, label]) => (
                  <option key={value} value={value}>{label}</option>
                ))}
              </select>
            </div>
            <div>
              <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.startDate}</label>
              <input className="input-field" type="date" value={newRule.startDate} onChange={(event) => setNewRule((current) => ({ ...current, startDate: event.target.value }))} />
            </div>
            <div>
              <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.endDate}</label>
              <input className="input-field" type="date" value={newRule.endDate} onChange={(event) => setNewRule((current) => ({ ...current, endDate: event.target.value }))} />
            </div>
            <div>
              <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.baseDailyRate}</label>
              <input className="input-field" type="number" min="0" step="0.01" value={newRule.dailyRate} onChange={(event) => setNewRule((current) => ({ ...current, dailyRate: event.target.value }))} />
            </div>
            <div>
              <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.weeklyRate}</label>
              <input className="input-field" type="number" min="0" step="0.01" value={newRule.weeklyRate} onChange={(event) => setNewRule((current) => ({ ...current, weeklyRate: event.target.value }))} />
            </div>
            <div>
              <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.weekendRate}</label>
              <input className="input-field" type="number" min="0" step="0.01" value={newRule.weekendRate} onChange={(event) => setNewRule((current) => ({ ...current, weekendRate: event.target.value }))} />
            </div>
            <div>
              <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.monthlyRate}</label>
              <input className="input-field" type="number" min="0" step="0.01" value={newRule.monthlyRate} onChange={(event) => setNewRule((current) => ({ ...current, monthlyRate: event.target.value }))} />
            </div>
            <div>
              <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.minimumDailyRate}</label>
              <input className="input-field" type="number" min="0" step="0.01" value={newRule.minDailyRate} onChange={(event) => setNewRule((current) => ({ ...current, minDailyRate: event.target.value }))} />
            </div>
            <div>
              <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.maximumDailyRate}</label>
              <input className="input-field" type="number" min="0" step="0.01" value={newRule.maxDailyRate} onChange={(event) => setNewRule((current) => ({ ...current, maxDailyRate: event.target.value }))} />
            </div>
            <div>
              <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.adjustmentPct}</label>
              <input className="input-field" type="number" step="1" value={newRule.automaticAdjustmentPct} onChange={(event) => setNewRule((current) => ({ ...current, automaticAdjustmentPct: event.target.value }))} />
            </div>
            <div>
              <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.priceAdjustment}</label>
              <input className="input-field" type="number" step="0.01" value={newRule.priceAdjustment} onChange={(event) => setNewRule((current) => ({ ...current, priceAdjustment: event.target.value }))} />
            </div>
            <div>
              <label className="mb-1.5 block text-sm font-medium text-slate-700">{copy.sortOrder}</label>
              <input className="input-field" type="number" min="0" step="1" value={newRule.sortOrder} onChange={(event) => setNewRule((current) => ({ ...current, sortOrder: event.target.value }))} />
            </div>
          </div>
          <div className="mt-4 flex justify-end">
            <button onClick={() => saveRule(newRule, true)} disabled={savingRuleId === 'new'} className="btn-primary">
              <PlusCircle className="h-4 w-4" />
              {savingRuleId === 'new' ? copy.saving : copy.createRule}
            </button>
          </div>
        </div>
      </div>

      <div className="card p-6">
        <div className="flex items-center gap-2">
          <History className="h-4 w-4 text-slate-400" />
          <h3 className="text-base font-semibold text-slate-900">{copy.history}</h3>
        </div>
        <div className="mt-5 space-y-3">
          {history.map((entry) => (
            <div key={entry.id} className="rounded-2xl border border-slate-200 px-4 py-3 text-sm">
              <div className="flex flex-wrap items-center justify-between gap-3">
                <div>
                  <p className="font-medium text-slate-900">{copy.historyLabels[entry.source]}</p>
                  <p className="text-slate-500">{new Date(entry.createdAt).toLocaleString()}</p>
                </div>
                <div className="text-right">
                  {entry.nextDailyRate != null && <p className="font-semibold text-slate-900">{formatCurrency(entry.nextDailyRate, 'MAD')}</p>}
                  {entry.previousDailyRate != null && entry.nextDailyRate != null && (
                    <p className="text-xs text-slate-400">{formatCurrency(entry.previousDailyRate, 'MAD')} → {formatCurrency(entry.nextDailyRate, 'MAD')}</p>
                  )}
                </div>
              </div>
              {entry.note && <p className="mt-2 text-sm text-slate-600">{entry.note}</p>}
            </div>
          ))}
          {history.length === 0 && <div className="rounded-2xl border border-dashed border-slate-200 px-4 py-6 text-sm text-slate-400">{copy.noHistory}</div>}
        </div>
      </div>
    </div>
  )
}
