// Inline SVG icons — stroke style, 1.5px, 24x24

const Icon = ({ d, size = 20, stroke = 'currentColor', fill = 'none', strokeWidth = 1.6, children, ...rest }) => (
  <svg width={size} height={size} viewBox="0 0 24 24" fill={fill} stroke={stroke}
       strokeWidth={strokeWidth} strokeLinecap="round" strokeLinejoin="round" {...rest}>
    {d ? <path d={d} /> : children}
  </svg>
);

const IconCalendar  = (p) => <Icon {...p}><rect x="3" y="5" width="18" height="16" rx="2"/><path d="M3 9h18M8 3v4M16 3v4"/></Icon>;
const IconUsers     = (p) => <Icon {...p}><path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M22 21v-2a4 4 0 0 0-3-3.87M16 3.13a4 4 0 0 1 0 7.75"/></Icon>;
const IconUser      = (p) => <Icon {...p}><path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/><circle cx="12" cy="7" r="4"/></Icon>;
const IconScissors  = (p) => <Icon {...p}><circle cx="6" cy="6" r="3"/><circle cx="6" cy="18" r="3"/><path d="M20 4 8.12 15.88M14.47 14.48 20 20M8.12 8.12 12 12"/></Icon>;
const IconGrid      = (p) => <Icon {...p}><rect x="3" y="3" width="7" height="7" rx="1"/><rect x="14" y="3" width="7" height="7" rx="1"/><rect x="3" y="14" width="7" height="7" rx="1"/><rect x="14" y="14" width="7" height="7" rx="1"/></Icon>;
const IconChart     = (p) => <Icon {...p}><path d="M3 3v18h18"/><path d="M7 14l4-4 4 4 5-6"/></Icon>;
const IconBell      = (p) => <Icon {...p}><path d="M6 8a6 6 0 1 1 12 0c0 7 3 9 3 9H3s3-2 3-9M10.3 21a1.94 1.94 0 0 0 3.4 0"/></Icon>;
const IconSettings  = (p) => <Icon {...p}><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 1 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 1 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 1 1-2.83-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 1 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 1 1 2.83-2.83l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 1 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 1 1 2.83 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 1 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z"/></Icon>;
const IconChevL     = (p) => <Icon {...p}><path d="M15 18l-6-6 6-6"/></Icon>;
const IconChevR     = (p) => <Icon {...p}><path d="M9 18l6-6-6-6"/></Icon>;
const IconChevD     = (p) => <Icon {...p}><path d="M6 9l6 6 6-6"/></Icon>;
const IconEye       = (p) => <Icon {...p}><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></Icon>;
const IconPlus      = (p) => <Icon {...p}><path d="M12 5v14M5 12h14"/></Icon>;
const IconSearch    = (p) => <Icon {...p}><circle cx="11" cy="11" r="7"/><path d="m21 21-4.3-4.3"/></Icon>;
const IconX         = (p) => <Icon {...p}><path d="M18 6 6 18M6 6l12 12"/></Icon>;
const IconClock     = (p) => <Icon {...p}><circle cx="12" cy="12" r="9"/><path d="M12 7v5l3 2"/></Icon>;
const IconPhone     = (p) => <Icon {...p}><path d="M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z"/></Icon>;
const IconMail      = (p) => <Icon {...p}><rect x="2" y="4" width="20" height="16" rx="2"/><path d="m22 6-10 7L2 6"/></Icon>;
const IconCheck     = (p) => <Icon {...p}><path d="M20 6 9 17l-5-5"/></Icon>;
const IconTrash     = (p) => <Icon {...p}><path d="M3 6h18M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2m3 0v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"/></Icon>;
const IconEdit      = (p) => <Icon {...p}><path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"/></Icon>;
const IconFilter    = (p) => <Icon {...p}><path d="M22 3H2l8 9.46V19l4 2v-8.54L22 3z"/></Icon>;
const IconMessage   = (p) => <Icon {...p}><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/></Icon>;
const IconBuilding  = (p) => <Icon {...p}><path d="M3 21h18M5 21V7l7-4 7 4v14M9 21V13h6v8M9 9h1M14 9h1M9 12h1M14 12h1"/></Icon>;
const IconLogOut    = (p) => <Icon {...p}><path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4M16 17l5-5-5-5M21 12H9"/></Icon>;
const IconLock      = (p) => <Icon {...p}><rect x="3" y="11" width="18" height="11" rx="2" ry="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/></Icon>;
const IconArrowR    = (p) => <Icon {...p}><path d="M5 12h14M13 5l7 7-7 7"/></Icon>;
const IconSparkle   = (p) => <Icon {...p}><path d="M12 3l1.9 5.5 5.6 1-4 4 1 5.5-4.5-2.6-4.5 2.6 1-5.5-4-4 5.5-1z"/></Icon>;
const IconLink      = (p) => <Icon {...p}><path d="M10 13a5 5 0 0 0 7.5.5l3-3a5 5 0 0 0-7-7l-1.5 1.5"/><path d="M14 11a5 5 0 0 0-7.5-.5l-3 3a5 5 0 0 0 7 7l1.5-1.5"/></Icon>;
const IconPalette   = (p) => <Icon {...p}><circle cx="13.5" cy="6.5" r=".5"/><circle cx="17.5" cy="10.5" r=".5"/><circle cx="8.5" cy="7.5" r=".5"/><circle cx="6.5" cy="12.5" r=".5"/><path d="M12 2A10 10 0 1 0 22 12c0-1.1-.9-2-2-2h-2a2 2 0 0 1-2-2 2 2 0 0 0-2-2h0"/></Icon>;
const IconCoffee    = (p) => <Icon {...p}><path d="M17 8h1a4 4 0 1 1 0 8h-1M3 8h14v9a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4V8zM6 1v3M10 1v3M14 1v3"/></Icon>;
const IconBox       = (p) => <Icon {...p}><path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16zM3.27 6.96L12 12.01l8.73-5.05M12 22.08V12"/></Icon>;
const IconAlert     = (p) => <Icon {...p}><path d="M10.29 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0zM12 9v4M12 17h.01"/></Icon>;
const IconHeart     = (p) => <Icon {...p}><path d="M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z"/></Icon>;
const IconInfo      = (p) => <Icon {...p}><circle cx="12" cy="12" r="10"/><path d="M12 16v-4M12 8h.01"/></Icon>;
const IconPrint     = (p) => <Icon {...p}><path d="M6 9V2h12v7M6 18H4a2 2 0 0 1-2-2v-5a2 2 0 0 1 2-2h16a2 2 0 0 1 2 2v5a2 2 0 0 1-2 2h-2"/><rect x="6" y="14" width="12" height="8"/></Icon>;
const IconReceipt   = (p) => <Icon {...p}><path d="M14 2H6a2 2 0 0 0-2 2v16l4-2 4 2 4-2 4 2V8z"/><path d="M14 2v6h6"/><path d="M9 13h6M9 17h4"/></Icon>;
// Used by CancelReasonModal — small, recognisable cause-icons.
const IconThermometer = (p) => <Icon {...p}><path d="M14 4a2 2 0 0 0-4 0v10.54a4 4 0 1 0 4 0V4z"/><path d="M12 14V8"/></Icon>;
const IconCamera    = (p) => <Icon {...p}><path d="M23 19a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h4l2-3h6l2 3h4a2 2 0 0 1 2 2z"/><circle cx="12" cy="13" r="4"/></Icon>;
const IconGhost     = (p) => <Icon {...p}><path d="M12 2a8 8 0 0 0-8 8v11l3-2 2 2 3-2 3 2 2-2 3 2V10a8 8 0 0 0-8-8z"/><path d="M9 11h.01M15 11h.01"/></Icon>;
const IconRefresh   = (p) => <Icon {...p}><path d="M3 12a9 9 0 0 1 15-6.7L21 8"/><path d="M21 3v5h-5"/><path d="M21 12a9 9 0 0 1-15 6.7L3 16"/><path d="M3 21v-5h5"/></Icon>;
const IconMedical   = (p) => <Icon {...p}><rect x="3" y="6" width="18" height="14" rx="2"/><path d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"/><path d="M12 10v6M9 13h6"/></Icon>;

// Industri-ikoner — bruges på Services-fanen pr. salon-type.
// IconScissors (forrige saks) er stadig 'frisor'.
const IconNails     = (p) => <Icon {...p}>
  {/* Hånd med lakeret negl — fingerspids øverst */}
  <path d="M9 21v-4.5a3 3 0 0 1 6 0V21"/>
  <path d="M9 16.5V11a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2v5.5"/>
  <path d="M11 9V5a1 1 0 0 1 2 0v4"/>
  <ellipse cx="12" cy="4.5" rx="1.4" ry="1.8"/>
</Icon>;
const IconMassage   = (p) => <Icon {...p}>
  {/* Hånd der trykker ned — fingre + håndflade */}
  <path d="M12 17a5 5 0 0 0 5-5v-2a1 1 0 0 0-2 0v2"/>
  <path d="M15 10V6a1 1 0 0 0-2 0v5"/>
  <path d="M13 11V4a1 1 0 0 0-2 0v7"/>
  <path d="M11 11V5a1 1 0 0 0-2 0v6"/>
  <path d="M9 11V8a1 1 0 0 0-2 0v4a5 5 0 0 0 5 5"/>
  <path d="M5 20h14"/>
</Icon>;
const IconEyelash   = (p) => <Icon {...p}>
  {/* Øje med lange vipper øverst */}
  <path d="M2 12s4-7 10-7 10 7 10 7-4 7-10 7S2 12 2 12z"/>
  <circle cx="12" cy="12" r="2.5"/>
  <path d="M6 7l-1-2M9 5.5l-.4-2M12 5V3M15 5.5l.4-2M18 7l1-2"/>
</Icon>;
const IconSpa       = (p) => <Icon {...p}>
  {/* Lotus-blomst — wellness/hudpleje */}
  <path d="M12 21c-3.5 0-6.5-2-7.5-5 2.5-.5 4.5 0 6 1.5"/>
  <path d="M12 21c3.5 0 6.5-2 7.5-5-2.5-.5-4.5 0-6 1.5"/>
  <path d="M12 21c0-3 1-5.5 3-7-1-2-2-3.5-3-4-1 .5-2 2-3 4 2 1.5 3 4 3 7z"/>
  <path d="M12 10V3"/>
</Icon>;
const IconBrow      = (p) => <Icon {...p}>
  {/* Bryn over et lille øje */}
  <path d="M4 9c2-3 5-4 8-4s6 1 8 4"/>
  <ellipse cx="12" cy="15" rx="6" ry="3"/>
  <circle cx="12" cy="15" r="1.5"/>
</Icon>;
const IconHair      = (p) => <Icon {...p}>
  {/* Hår med bølger — håndtegnet */}
  <path d="M4 7c2-3 6-5 8-5s6 2 8 5"/>
  <path d="M4 7c0 4 1 8 3 12"/>
  <path d="M20 7c0 4-1 8-3 12"/>
  <path d="M9 19c1-2 1-4 0-6"/>
  <path d="M15 19c-1-2-1-4 0-6"/>
</Icon>;

// Smiley-ikoner — bruges på statistik-sidens omsætningsvurdering.
// Cirkel + to øjne + en mund-kurve der varierer. Samme stroke-stil
// som resten af ikon-biblioteket. Tegnes uden fill så de tager
// 'stroke'/'color' fra parent som de andre ikoner.
const IconSmileyHappy = (p) => <Icon {...p}>
  <circle cx="12" cy="12" r="10"/>
  <path d="M8 14s1.5 2 4 2 4-2 4-2"/>
  <line x1="9" y1="9" x2="9.01" y2="9"/>
  <line x1="15" y1="9" x2="15.01" y2="9"/>
</Icon>;
const IconSmileyOk = (p) => <Icon {...p}>
  <circle cx="12" cy="12" r="10"/>
  <path d="M8 14s1.5 1 4 1 4-1 4-1"/>
  <line x1="9" y1="9" x2="9.01" y2="9"/>
  <line x1="15" y1="9" x2="15.01" y2="9"/>
</Icon>;
const IconSmileyFlat = (p) => <Icon {...p}>
  <circle cx="12" cy="12" r="10"/>
  <line x1="8" y1="15" x2="16" y2="15"/>
  <line x1="9" y1="9" x2="9.01" y2="9"/>
  <line x1="15" y1="9" x2="15.01" y2="9"/>
</Icon>;
const IconSmileySad = (p) => <Icon {...p}>
  <circle cx="12" cy="12" r="10"/>
  <path d="M16 16s-1.5-2-4-2-4 2-4 2"/>
  <line x1="9" y1="9" x2="9.01" y2="9"/>
  <line x1="15" y1="9" x2="15.01" y2="9"/>
</Icon>;

// Brancher → ikon mapping. Bruges af Sidebar's 'Ydelser'-knap.
const INDUSTRY_OPTIONS = [
  { id: 'frisor',    label: 'Frisør',           icon: 'IconScissors' },
  { id: 'negle',     label: 'Neglesalon',       icon: 'IconNails' },
  { id: 'massage',   label: 'Massage',          icon: 'IconMassage' },
  { id: 'eyelashes', label: 'Eyelashes / vipper', icon: 'IconEyelash' },
  { id: 'bryn',      label: 'Bryn',             icon: 'IconBrow' },
  { id: 'hudpleje',  label: 'Hudpleje',         icon: 'IconSpa' },
  { id: 'wellness',  label: 'Wellness / spa',   icon: 'IconSpa' },
  { id: 'haar',      label: 'Hårpleje / forlængelser', icon: 'IconHair' },
  { id: 'andet',     label: 'Andet',            icon: 'IconSparkle' },
];

Object.assign(window, {
  Icon, IconCalendar, IconUsers, IconUser, IconScissors, IconGrid, IconChart,
  IconBell, IconSettings, IconChevL, IconChevR, IconChevD, IconEye, IconPlus,
  IconSearch, IconX, IconClock, IconPhone, IconMail, IconCheck, IconTrash,
  IconEdit, IconFilter, IconMessage, IconBuilding, IconLogOut, IconLock, IconArrowR,
  IconSparkle, IconLink, IconPalette, IconCoffee, IconBox,
  IconAlert, IconHeart, IconInfo, IconPrint, IconReceipt,
  IconThermometer, IconCamera, IconGhost, IconRefresh, IconMedical,
  IconNails, IconMassage, IconEyelash, IconSpa, IconBrow, IconHair,
  IconSmileyHappy, IconSmileyOk, IconSmileyFlat, IconSmileySad,
  INDUSTRY_OPTIONS,
});
