// shared.jsx — line icons + mock data, shared across all directions.
// Icons are stroke-based, inherit currentColor, sized by `s` prop.

function Icon({ name, s = 18, sw = 1.5, style }) {
  const p = {
    people: <><circle cx="7" cy="8" r="3"/><path d="M1.5 19c0-3 2.5-5 5.5-5s5.5 2 5.5 5"/><path d="M15 6.5a3 3 0 0 1 0 5.6M17 19c0-2.4-1.3-3.8-3-4.6"/></>,
    bag: <><path d="M4.5 7h13l-1 12.5H5.5L4.5 7Z"/><path d="M8 7V5.5a3 3 0 0 1 6 0V7"/></>,
    pulse: <><path d="M2 12h4l2.5-7 4 14 2.5-7H20"/></>,
    shield: <><path d="M11 2.5 4 5.2v5.3c0 4.2 2.8 7.4 7 8.9 4.2-1.5 7-4.7 7-8.9V5.2L11 2.5Z"/><path d="M8 11l2.2 2.2L14.5 9"/></>,
    tag: <><path d="M11.5 2.5H6A3.5 3.5 0 0 0 2.5 6v5.5L12 21l7-7-7.5-11.5Z"/><circle cx="7" cy="7" r="1.3"/></>,
    search: <><circle cx="9.5" cy="9.5" r="6"/><path d="m14 14 5 5"/></>,
    calendar: <><rect x="3" y="4.5" width="16" height="15" rx="2.5"/><path d="M3 9h16M7.5 2.5v4M14.5 2.5v4"/></>,
    ticket: <><path d="M3 7.5A1.5 1.5 0 0 1 4.5 6h13A1.5 1.5 0 0 1 19 7.5V9a2 2 0 0 0 0 4v1.5a1.5 1.5 0 0 1-1.5 1.5h-13A1.5 1.5 0 0 1 3 14.5V13a2 2 0 0 0 0-4V7.5Z"/><path d="M11 6v10" strokeDasharray="1.5 2.5"/></>,
    copy: <><rect x="7" y="7" width="11" height="11" rx="2.5"/><path d="M4 13.5V5a2 2 0 0 1 2-2h7.5"/></>,
    check: <><path d="M4 11l4.5 4.5L18 5.5"/></>,
    plus: <><path d="M11 4.5v13M4.5 11h13"/></>,
    arrow: <><path d="M4.5 11h13M12 5.5l6 5.5-6 5.5"/></>,
    chevR: <><path d="M8 4.5l6 6.5-6 6.5"/></>,
    chevD: <><path d="M4.5 8l6.5 6 6.5-6"/></>,
    star: <><path d="M11 2.5l2.6 5.7 6.2.7-4.6 4.2 1.3 6.1L11 16.3 5.5 19.2l1.3-6.1L2.2 8.9l6.2-.7L11 2.5Z"/></>,
    reply: <><path d="M9 5.5 3.5 11 9 16.5M3.5 11h9a5 5 0 0 1 5 5v1.5"/></>,
    archive: <><rect x="3" y="4" width="16" height="4" rx="1.5"/><path d="M4.5 8v9.5A1.5 1.5 0 0 0 6 19h10a1.5 1.5 0 0 0 1.5-1.5V8M8.5 12h5"/></>,
    clock: <><circle cx="11" cy="11" r="8"/><path d="M11 6.5V11l3 2"/></>,
    pin: <><path d="M11 19.5S4.5 13.8 4.5 9a6.5 6.5 0 0 1 13 0c0 4.8-6.5 10.5-6.5 10.5Z"/><circle cx="11" cy="9" r="2.3"/></>,
    moon: <><path d="M17.5 12.5A7 7 0 1 1 9 4a5.5 5.5 0 0 0 8.5 8.5Z"/></>,
    map: <><path d="M11 19.5S4.5 13.8 4.5 9a6.5 6.5 0 0 1 13 0c0 4.8-6.5 10.5-6.5 10.5Z"/><circle cx="11" cy="9" r="2.3"/></>,
    sparkle: <><path d="M11 3v6M11 13v6M3 11h6M13 11h6" opacity=".5"/><path d="M11 6.5 12.4 10 16 11l-3.6 1L11 15.5 9.6 12 6 11l3.6-1L11 6.5Z"/></>,
    inbox: <><path d="M3 13.5 5 5h12l2 8.5M3 13.5V18a1.5 1.5 0 0 0 1.5 1.5h13A1.5 1.5 0 0 0 19 18v-4.5M3 13.5h5l1.2 2.2h3.6L14 13.5h5"/></>,
    filter: <><path d="M3.5 5.5h15M6 11h10M9 16.5h4"/></>,
    dollar: <><path d="M11 3v16M14.5 6.2C13.7 5.4 12.4 5 11 5c-2.2 0-3.5 1.1-3.5 2.6 0 3.8 7 2 7 5.8 0 1.6-1.5 2.6-3.5 2.6-1.6 0-3-.5-3.8-1.4"/></>,
    trash: <><path d="M4 6.5h14M8.5 6.5V4.8A1.8 1.8 0 0 1 10.3 3h1.4A1.8 1.8 0 0 1 13.5 4.8v1.7M6 6.5l.9 12a1.6 1.6 0 0 0 1.6 1.5h5a1.6 1.6 0 0 0 1.6-1.5l.9-12M9.5 10v6M12.5 10v6"/></>,
    sort: <><path d="M4 6h8M4 11h5M4 16h3"/><path d="M15.5 6.5v9M15.5 15.5 13 13M15.5 15.5 18 13"/></>,
    mute: <><path d="M6 9a5 5 0 0 1 8.2-3.9M16 11v3l1.8 2H4.2L6 14V9.2"/><path d="M9 19a2 2 0 0 0 4 0"/><path d="M3 3.2 19 19"/></>,
  }[name];
  return (
    <svg width={s} height={s} viewBox="0 0 22 22" fill="none" stroke="currentColor"
      strokeWidth={sw} strokeLinecap="round" strokeLinejoin="round" style={style}>{p}</svg>
  );
}

// ── Mock data ───────────────────────────────────────────────
const CATS = [
  { key: 'people',  label: 'Fra mennesker',      icon: 'people',   n: 4 },
  { key: 'buy',     label: 'Kjøp',                icon: 'bag',      n: 11 },
  { key: 'updates', label: 'Viktige oppdateringer', icon: 'pulse',  n: 2 },
  { key: 'verify',  label: 'Verifikasjon',        icon: 'shield',   n: 1 },
  { key: 'promo',   label: 'Reklame',             icon: 'tag',      n: 138 },
];

const PEOPLE = [
  { from: 'Nora Dahl', mono: 'IS', col: '#e8a87c', subj: 'Re: Hytta i påsken', prev: 'Høres helt perfekt ut — jeg booker fredag til mandag. Skal jeg ta med …', time: '09:24', unread: true, pin: true },
  { from: 'Mamma', mono: 'M', col: '#c8b6e2', subj: 'Bilder fra søndag', prev: 'Her er de fine bildene av barna fra middagen. Klem fra oss begge!', time: 'i går', unread: true },
  { from: 'Per Strand', mono: 'JB', col: '#9ec7e8', subj: 'Lunsj torsdag?', prev: 'Har du tid en tur på Tim Wendelboe? Lenge siden sist nå.', time: 'i går', unread: false },
  { from: 'Sara Lind', mono: 'SL', col: '#a8d8b9', subj: 'Takk for sist!', prev: 'Det var en utrolig hyggelig kveld. Vi må gjenta det snart 🙌', time: 'tir', unread: false },
];

const BUY = [
  { merch: 'Vinmonopolet', mono: 'V', col: '#7a9e7e', what: 'Kvittering · Ordre #40219', amt: '648,00', time: '14:02', kind: 'receipt' },
  { merch: 'SAS', mono: 'SAS', col: '#163a6b', what: 'Boardingkort · OSL → CPH', amt: '1 240,00', time: '11:30', kind: 'ticket', when: 'fre 6. jun · 07:45' },
  { merch: 'Oda', mono: 'O', col: '#d14d4d', what: 'Levering bekreftet', amt: '893,50', time: 'i går', kind: 'receipt' },
  { merch: 'Thon Hotel', mono: 'TH', col: '#b89a4e', what: 'Reservasjon · 2 netter', amt: '2 980,00', time: 'i går', kind: 'booking', when: 'lør 7. jun · innsjekk 15:00' },
  { merch: 'Apple', mono: '', col: '#444', what: 'Kvittering · App Store', amt: '149,00', time: 'man', kind: 'receipt' },
  { merch: 'Ruter', mono: 'R', col: '#c2185b', what: '30-dagersbillett', amt: '852,00', time: 'man', kind: 'ticket', when: 'gyldig t.o.m. 30. jun' },
];

const VERIFY = { service: 'Github', code: '084 219', expires: 38 };

Object.assign(window, { Icon, CATS, PEOPLE, BUY, VERIFY });