// HIFA OIL Loyalty — UI kit foundation
// Icon (Lucide), Ring, Logo, primitives, and mock data.
// Exports to window for sibling babel scripts.

// ── Icon (Lucide UMD) ─────────────────────────────────────────
function _pascal(name) {
  return name.replace(/(^|-)([a-z])/g, (_, __, c) => c.toUpperCase());
}
function Icon({ name, size = 24, stroke = 2, fill = 'none', color = 'currentColor', style, className }) {
  const node = window.lucide && window.lucide.icons && window.lucide.icons[_pascal(name)];
  if (!node) return null;
  return (
    <svg className={className} width={size} height={size} viewBox="0 0 24 24" fill={fill}
      stroke={color} strokeWidth={stroke} strokeLinecap="round" strokeLinejoin="round"
      style={{ display: 'block', flexShrink: 0, ...style }}>
      {node.map(([tag, attrs], i) => React.createElement(tag, { key: i, ...attrs }))}
    </svg>
  );
}

// ── Ring (circular progress) ──────────────────────────────────
function Ring({ pct = 0, size = 120, stroke = 9, color = 'var(--hifa-gold)',
  track = 'rgba(255,255,255,0.10)', children, animate = true }) {
  const r = (size - stroke) / 2;
  const circ = 2 * Math.PI * r;
  const [shown, setShown] = React.useState(animate ? 0 : pct);
  React.useEffect(() => { const t = setTimeout(() => setShown(pct), 60); return () => clearTimeout(t); }, [pct]);
  const off = circ * (1 - shown / 100);
  return (
    <div style={{ position: 'relative', width: size, height: size, flexShrink: 0 }}>
      <svg width={size} height={size} style={{ transform: 'rotate(-90deg)' }}>
        <circle cx={size / 2} cy={size / 2} r={r} fill="none" stroke={track} strokeWidth={stroke} />
        <circle cx={size / 2} cy={size / 2} r={r} fill="none" stroke={color} strokeWidth={stroke}
          strokeDasharray={circ} strokeDashoffset={off} strokeLinecap="round"
          style={{ transition: 'stroke-dashoffset 1.1s cubic-bezier(.4,0,.2,1)' }} />
      </svg>
      <div style={{ position: 'absolute', inset: 0, display: 'flex', flexDirection: 'column',
        alignItems: 'center', justifyContent: 'center' }}>{children}</div>
    </div>
  );
}

// ── Brand logos (official HIFA OIL assets) ──
const LOGO = {
  mark: 'assets/logo/hifa-oil-mark.png',   // red roundel
  full: 'assets/logo/hifa-oil-full.png',   // roundel + HIFA-OIL
  isomax: 'assets/logo/hifa-isomax.png',   // gold ISOMAX wordmark
};
// HIFA-OIL red roundel mark
function LogoMark({ size = 40 }) {
  return <img src={LOGO.mark} alt="HIFA-OIL" style={{ width: size, height: size, objectFit: 'contain', display: 'block', flexShrink: 0 }} />;
}
// HIFA-OIL full logo (roundel + wordmark)
function HifaFull({ size = 64 }) {
  return <img src={LOGO.full} alt="HIFA-OIL" style={{ height: size, width: 'auto', objectFit: 'contain', display: 'block' }} />;
}
// ISOMAX gold loyalty wordmark
function IsoMax({ height = 30 }) {
  return <img src={LOGO.isomax} alt="ISOMAX" style={{ height, width: 'auto', objectFit: 'contain', display: 'block' }} />;
}
// Back-compat: Logo renders the ISOMAX wordmark (used in hero contexts)
function Logo({ size = 22 }) { return <IsoMax height={size * 1.15} />; }

// ── Press-scale wrapper ───────────────────────────────────────
function Pressable({ children, onClick, style, className }) {
  const [down, setDown] = React.useState(false);
  return (
    <div className={className} onClick={onClick}
      onPointerDown={() => setDown(true)}
      onPointerUp={() => setDown(false)}
      onPointerLeave={() => setDown(false)}
      style={{ transform: down ? 'scale(0.97)' : 'scale(1)',
        transition: 'transform .12s ease', cursor: 'pointer', ...style }}>
      {children}
    </div>
  );
}

// ── litres / number formatting (BA locale) ────────────────────
function fmtL(n) { return n.toLocaleString('de-DE', { minimumFractionDigits: 3, maximumFractionDigits: 3 }); }
function fmtPct(n) { return n.toLocaleString('de-DE', { minimumFractionDigits: 1, maximumFractionDigits: 1 }) + '%'; }

// ── Mock data ─────────────────────────────────────────────────
const HIFA = {
  user: {
    firstName: 'Amar', lastName: 'Hodžić', initials: 'AH',
    email: 'amar.hodzic@example.com',
    fuel: 50.730, fuelMax: 399.99, pct: 12.7, available: 2.54,
    card: 'HO0000LYR0071996', cardId: 'HO0000LYR0071996',
  },
  tiers: [
    { name: 'ISOMAX', val: 50.730, max: 399.99, reached: true },
    { name: 'ISOMAX LOYAL', val: 0, max: 799.99, reached: false },
    { name: 'ISOMAX ROYAL', val: 0, max: '800.00+', reached: false },
  ],
  news: [
    { img: 'assets/photos/news-helicopter.jpg', title: 'Hifa-Oil ispunila stroge uvjete za snabdijevanje avijacije', date: '12.05.2026.', tag: 'Vijesti' },
    { img: 'assets/photos/news-meeting.jpg', title: 'Održan sastanak sa strateškim partnerima', date: '03.05.2026.', tag: 'Vijesti' },
    { img: 'assets/photos/station-shop.jpg', title: 'Otvorena nova HIFA OIL pumpa sa Coffee kutkom', date: '28.04.2026.', tag: 'Mreža' },
  ],
  transactions: [
    { id: '26541', litres: 0.000, date: '02.06.2026.', station: 'Hifa Oil — Sarajevo 4', type: 'redeem' },
    { id: '19604', litres: 50.730, date: '29.05.2026.', station: 'Hifa Oil — Bijeljina 2', type: 'earn' },
    { id: '18233', litres: 32.110, date: '21.05.2026.', station: 'Hifa Oil — Brčko', type: 'earn' },
    { id: '17890', litres: 12.400, date: '14.05.2026.', station: 'Hifa Oil — Tuzla 1', type: 'earn' },
    { id: '16544', litres: 41.900, date: '06.05.2026.', station: 'Hifa Oil — Sarajevo 4', type: 'earn' },
  ],
  stations: [
    { name: 'Hifa Oil — Bijeljina 2', img: 'assets/photos/station-bijeljina.jpg', hours: '06–24 sata', distance: '1.2 km', time: '4 min', services: ['fuel', 'shopping-cart', 'coffee', 'wifi'] },
    { name: 'Hifa Oil — Brčko', img: 'assets/photos/station-pylon.jpg', hours: '00–24 sata', distance: '3.8 km', time: '9 min', services: ['fuel', 'coffee', 'wifi'] },
    { name: 'Hifa Oil — Sarajevo 4', img: 'assets/photos/station-shop.jpg', hours: '06–24 sata', distance: '5.1 km', time: '12 min', services: ['fuel', 'shopping-cart', 'coffee'] },
  ],
  benefits: [
    { partner: 'Bingo', offer: '−10% na kupovinu preko 50 KM', cat: 'Maloprodaja' },
    { partner: 'Coffee Time', offer: 'Svaka 6. kafa gratis', cat: 'Ugostiteljstvo' },
    { partner: 'AutoCentar M', offer: '−15% na servis vozila', cat: 'Auto' },
    { partner: 'Hotel Hills', offer: '−20% na noćenje', cat: 'Smještaj' },
  ],
  catalog: [
    { name: 'ISOMAX deterdžent 5L', litres: 8.5, img: null },
    { name: 'Tečnost za vjetrobran', litres: 4.0, img: null },
    { name: 'Set mikrofiber krpa', litres: 6.0, img: null },
    { name: 'HIFA termo šolja', litres: 12.0, img: null },
    { name: 'Osvježivač vozila', litres: 2.5, img: null },
    { name: 'ISOMAX poklon vaučer 20 KM', litres: 20.0, img: null },
  ],
  serviceLabel: { fuel: 'Gorivo', 'shopping-cart': 'Shop', coffee: 'Kafa', wifi: 'WiFi' },
};

Object.assign(window, { Icon, Ring, Logo, LogoMark, HifaFull, IsoMax, Pressable, fmtL, fmtPct, HIFA });