// Tiny inline-SVG icon set — Lucide-style strokes, 1.5px default.
// All 16x16 unless class overrides. Use as <I name="search" />.
const I = ({ name, size = 16, className = 'icon', style }) => {
  const paths = {
    search: <><circle cx="11" cy="11" r="7"/><path d="m21 21-4.3-4.3"/></>,
    send: <><path d="m22 2-7 20-4-9-9-4 20-7z"/></>,
    chevronDown: <><path d="m6 9 6 6 6-6"/></>,
    chevronRight: <><path d="m9 6 6 6-6 6"/></>,
    chevronLeft: <><path d="m15 6-6 6 6 6"/></>,
    chevronUp: <><path d="m6 15 6-6 6 6"/></>,
    plus: <><path d="M12 5v14M5 12h14"/></>,
    close: <><path d="M18 6 6 18M6 6l12 12"/></>,
    check: <><path d="M20 6 9 17l-5-5"/></>,
    menu: <><path d="M4 6h16M4 12h16M4 18h16"/></>,
    file: <><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8Z"/><path d="M14 2v6h6"/></>,
    filePdf: <><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8Z"/><path d="M14 2v6h6"/><path d="M9 13h1.5a1.5 1.5 0 0 1 0 3H9v-3zM9 16v2M14 13h2M14 13v5M14 15.5h1.5"/></>,
    upload: <><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4M17 8l-5-5-5 5M12 3v12"/></>,
    download: <><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4M7 10l5 5 5-5M12 15V3"/></>,
    user: <><path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/><circle cx="12" cy="7" r="4"/></>,
    users: <><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M23 21v-2a4 4 0 0 0-3-3.87M16 3.13a4 4 0 0 1 0 7.75"/></>,
    folder: <><path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"/></>,
    shield: <><path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"/></>,
    lock: <><rect x="3" y="11" width="18" height="11" rx="2"/><path d="M7 11V7a5 5 0 0 1 10 0v4"/></>,
    key: <><circle cx="7.5" cy="15.5" r="4.5"/><path d="m10.5 13.5 10-10M17 7l3 3"/></>,
    mail: <><rect x="2" y="4" width="20" height="16" rx="2"/><path d="m22 6-10 7L2 6"/></>,
    bell: <><path d="M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9"/><path d="M10 21a2 2 0 0 0 4 0"/></>,
    help: <><circle cx="12" cy="12" r="10"/><path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3M12 17h.01"/></>,
    info: <><circle cx="12" cy="12" r="10"/><path d="M12 16v-4M12 8h.01"/></>,
    warn: <><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"/></>,
    sparkle: <><path d="M12 3v3M12 18v3M3 12h3M18 12h3M5.6 5.6l2.1 2.1M16.3 16.3l2.1 2.1M5.6 18.4l2.1-2.1M16.3 7.7l2.1-2.1"/></>,
    chat: <><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/></>,
    settings: <><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.7 1.7 0 0 0 .3 1.8l.1.1a2 2 0 0 1-2.8 2.8l-.1-.1a1.7 1.7 0 0 0-1.8-.3 1.7 1.7 0 0 0-1 1.5V21a2 2 0 0 1-4 0v-.1A1.7 1.7 0 0 0 9 19.4a1.7 1.7 0 0 0-1.8.3l-.1.1a2 2 0 0 1-2.8-2.8l.1-.1a1.7 1.7 0 0 0 .3-1.8 1.7 1.7 0 0 0-1.5-1H3a2 2 0 0 1 0-4h.1A1.7 1.7 0 0 0 4.6 9a1.7 1.7 0 0 0-.3-1.8l-.1-.1a2 2 0 0 1 2.8-2.8l.1.1a1.7 1.7 0 0 0 1.8.3H9a1.7 1.7 0 0 0 1-1.5V3a2 2 0 0 1 4 0v.1a1.7 1.7 0 0 0 1 1.5 1.7 1.7 0 0 0 1.8-.3l.1-.1a2 2 0 0 1 2.8 2.8l-.1.1a1.7 1.7 0 0 0-.3 1.8V9a1.7 1.7 0 0 0 1.5 1H21a2 2 0 0 1 0 4h-.1a1.7 1.7 0 0 0-1.5 1z"/></>,
    chart: <><path d="M3 3v18h18M7 16l4-4 4 4 5-6"/></>,
    grid: <><rect x="3" y="3" width="7" height="7"/><rect x="14" y="3" width="7" height="7"/><rect x="14" y="14" width="7" height="7"/><rect x="3" y="14" width="7" height="7"/></>,
    list: <><path d="M8 6h13M8 12h13M8 18h13M3 6h.01M3 12h.01M3 18h.01"/></>,
    filter: <><path d="M22 3H2l8 9.5V19l4 2v-8.5z"/></>,
    external: <><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6M15 3h6v6M10 14 21 3"/></>,
    copy: <><rect x="9" y="9" width="13" height="13" rx="2"/><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/></>,
    more: <><circle cx="12" cy="12" r="1"/><circle cx="19" cy="12" r="1"/><circle cx="5" cy="12" r="1"/></>,
    dot: <><circle cx="12" cy="12" r="3"/></>,
    refresh: <><path d="M3 12a9 9 0 0 1 15-6.7L21 8M21 3v5h-5M21 12a9 9 0 0 1-15 6.7L3 16M3 21v-5h5"/></>,
    trash: <><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"/></>,
    zap: <><path d="M13 2 3 14h9l-1 8 10-12h-9z"/></>,
    clock: <><circle cx="12" cy="12" r="10"/><path d="M12 6v6l4 2"/></>,
    quote: <><path d="M3 21c3 0 7-1 7-8V5c0-1.25-.76-2.02-2-2H4c-1.24 0-2 .77-2 2v7c0 1.25.76 2 2 2 1 0 1 0 1 1v1c0 1-1 2-2 2s-1 .008-1 1.006V20c0 1 0 1 1 1zM15 21c3 0 7-1 7-8V5c0-1.25-.76-2.02-2-2h-4c-1.24 0-2 .77-2 2v7c0 1.25.76 2 2 2 1 0 1 0 1 1v1c0 1-1 2-2 2s-1 .008-1 1.006V20c0 1 0 1 1 1z"/></>,
    play: <><polygon points="6 3 20 12 6 21 6 3"/></>,
    pause: <><rect x="6" y="4" width="4" height="16"/><rect x="14" y="4" width="4" height="16"/></>,
    building: <><rect x="4" y="2" width="16" height="20" rx="2"/><path d="M9 22v-4h6v4M8 6h.01M16 6h.01M12 6h.01M12 10h.01M12 14h.01M16 10h.01M16 14h.01M8 10h.01M8 14h.01"/></>,
    eye: <><path d="M2 12s3-7 10-7 10 7 10 7-3 7-10 7-10-7-10-7z"/><circle cx="12" cy="12" r="3"/></>,
    eyeOff: <><path d="M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-10-7-10-7a13.16 13.16 0 0 1 1.67-2.68M6.1 6.1A10.07 10.07 0 0 1 12 4c7 0 10 7 10 7a13.16 13.16 0 0 1-2.13 3.19M9.9 4.24A9.12 9.12 0 0 1 12 4c3 0 5.7 1.4 7.5 3M1 1l22 22M9.88 9.88a3 3 0 0 0 4.24 4.24"/></>,
    minus: <><path d="M5 12h14"/></>,
    search2: <><circle cx="11" cy="11" r="7"/><path d="m21 21-4.3-4.3"/></>,
  };
  return (
    <svg xmlns="http://www.w3.org/2000/svg" width={size} height={size} viewBox="0 0 24 24"
         fill="none" stroke="currentColor" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round"
         className={className} style={style} aria-hidden="true">
      {paths[name] || null}
    </svg>
  );
};

// Emergency-shield mark for Horsens placeholder (abstract — not real crest)
const ShieldMark = ({ size = 24, title = 'HB' }) => (
  <span className="shield" style={{ width: size, height: size, fontSize: size * 0.45 }}>
    <svg width={size * 0.6} height={size * 0.6} viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2">
      <path d="M12 2 4 5v6c0 5 3.5 8 8 11 4.5-3 8-6 8-11V5z"/>
      <path d="M12 8v8M8 12h8" strokeLinecap="round"/>
    </svg>
  </span>
);

// ═══════════════════════════════════════════════════════════════════════════
// BRAND MARKS
//   CoreSystemsCube  → parent company (CoreMind Systems) — bare isometric kube
//   CMMark           → product mark (CoreMind Vault) — kube + hex-ring + nodes
//   CoreMindLogotype → parent company full lockup (used intro/outro)
// ═══════════════════════════════════════════════════════════════════════════

// Parent-company mark: plain isometric cube, no ring. Used only in CoreMindLogotype.
const CoreSystemsCube = ({ size = 24, showNodes = false, nodeSize = null }) => {
  // Stroke scales inversely with size so small renders stay legible.
  const strokeTight = size <= 20 ? 5 : size <= 32 ? 4 : size <= 48 ? 3.2 : 2.6;
  return (
    <svg width={size} height={size} viewBox="-60 -64 120 120" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" style={{ display: 'block', flexShrink: 0 }}>
      <defs>
        <linearGradient id={`csTop-${size}`} x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stopColor="#4477dd"/><stop offset="100%" stopColor="#2a55bb"/></linearGradient>
        <linearGradient id={`csLeft-${size}`} x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stopColor="#1a1a55"/><stop offset="100%" stopColor="#181850"/></linearGradient>
        <linearGradient id={`csRight-${size}`} x1="100%" y1="0%" x2="0%" y2="100%"><stop offset="0%" stopColor="#222266"/><stop offset="100%" stopColor="#1c1c58"/></linearGradient>
      </defs>
      <polygon points="0,-56 52,-28 0,0 -52,-28" fill={`url(#csTop-${size})`} opacity="0.95"/>
      <polygon points="-52,-28 0,0 0,56 -52,28" fill={`url(#csLeft-${size})`} opacity="0.95"/>
      <polygon points="52,-28 0,0 0,56 52,28" fill={`url(#csRight-${size})`} opacity="0.95"/>
      <polygon points="0,-56 52,-28 52,28 0,56 -52,28 -52,-28" fill="none" stroke="#00ddee" strokeWidth={strokeTight} strokeLinejoin="round"/>
      <line x1="0" y1="0" x2="0" y2="56" stroke="#00bbcc" strokeWidth="1.2" opacity="0.5"/>
      <line x1="0" y1="0" x2="-52" y2="-28" stroke="#00bbcc" strokeWidth="1.2" opacity="0.4"/>
      <line x1="0" y1="0" x2="52" y2="-28" stroke="#00bbcc" strokeWidth="1.2" opacity="0.4"/>
    </svg>
  );
};

// CoreMind Vault product mark — Variant A: kube indeni en hex-ring med 6 vertex-noder.
const CMMark = ({ size = 24 }) => {
  // Stroke and node scale inversely with render size so small versions stay crisp.
  const ringStroke = size <= 16 ? 8 : size <= 24 ? 5 : size <= 32 ? 4.2 : size <= 48 ? 3.4 : 3;
  const cubeStroke = size <= 16 ? 6 : size <= 24 ? 4 : size <= 32 ? 3.4 : size <= 48 ? 2.8 : 2.4;
  const nodeR     = size <= 16 ? 14 : size <= 24 ? 9 : size <= 32 ? 6.5 : size <= 48 ? 4.2 : 3.2;
  // At <= 16px the ring collapses to a clean hex silhouette and nodes become corner caps.
  return (
    <svg width={size} height={size} viewBox="-100 -104 200 200" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" style={{ display: 'block', flexShrink: 0 }}>
      <defs>
        <linearGradient id={`vmTop-${size}`} x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stopColor="#4477dd"/><stop offset="100%" stopColor="#2a55bb"/></linearGradient>
        <linearGradient id={`vmLeft-${size}`} x1="0%" y1="0%" x2="100%" y2="100%"><stop offset="0%" stopColor="#1a1a55"/><stop offset="100%" stopColor="#181850"/></linearGradient>
        <linearGradient id={`vmRight-${size}`} x1="100%" y1="0%" x2="0%" y2="100%"><stop offset="0%" stopColor="#222266"/><stop offset="100%" stopColor="#1c1c58"/></linearGradient>
      </defs>
      {/* Hex-ring */}
      <polygon points="0,-92 80,-46 80,46 0,92 -80,46 -80,-46" fill="none" stroke="#00ddee" strokeWidth={ringStroke} strokeLinejoin="round"/>
      {/* Vertex nodes */}
      <circle cx="0"   cy="-92" r={nodeR} fill="#00ddee"/>
      <circle cx="80"  cy="-46" r={nodeR} fill="#00ddee"/>
      <circle cx="80"  cy="46"  r={nodeR} fill="#00ddee"/>
      <circle cx="0"   cy="92"  r={nodeR} fill="#00ddee"/>
      <circle cx="-80" cy="46"  r={nodeR} fill="#00ddee"/>
      <circle cx="-80" cy="-46" r={nodeR} fill="#00ddee"/>
      {/* Isometric cube inside */}
      <polygon points="0,-56 52,-28 0,0 -52,-28" fill={`url(#vmTop-${size})`} opacity="0.95"/>
      <polygon points="-52,-28 0,0 0,56 -52,28" fill={`url(#vmLeft-${size})`} opacity="0.95"/>
      <polygon points="52,-28 0,0 0,56 52,28"   fill={`url(#vmRight-${size})`} opacity="0.95"/>
      <polygon points="0,-56 52,-28 52,28 0,56 -52,28 -52,-28" fill="none" stroke="#00ddee" strokeWidth={cubeStroke} strokeLinejoin="round"/>
      <line x1="0" y1="0" x2="0"   y2="56"  stroke="#00bbcc" strokeWidth="1.2" opacity="0.5"/>
      <line x1="0" y1="0" x2="-52" y2="-28" stroke="#00bbcc" strokeWidth="1.2" opacity="0.4"/>
      <line x1="0" y1="0" x2="52"  y2="-28" stroke="#00bbcc" strokeWidth="1.2" opacity="0.4"/>
    </svg>
  );
};

// Full CoreMind Systems logotype (intro/outro): plain cube + "COREMIND / SYSTEMS" wordmark + product badge.
const CoreMindLogotype = ({ size = 160, tagline = true, productLabel = 'VAULT' }) => (
  <div style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', gap: 0, fontFamily: 'IBM Plex Sans, system-ui, sans-serif' }}>
    <div style={{ filter: 'drop-shadow(0 0 24px rgba(0, 221, 238, 0.35))' }}>
      <CoreSystemsCube size={size}/>
    </div>
    <div style={{ fontSize: size * 0.26, fontWeight: 300, letterSpacing: '0.16em', color: '#f6f4ef', marginTop: size * 0.18 }}>COREMIND</div>
    <div style={{ fontSize: size * 0.13, fontWeight: 300, letterSpacing: '0.26em', color: '#8899aa', marginTop: size * 0.04 }}>SYSTEMS</div>
    {productLabel && (
      <div style={{ fontSize: size * 0.1, fontWeight: 500, letterSpacing: '0.32em', color: '#00ddee', marginTop: size * 0.14, padding: `${size * 0.04}px ${size * 0.14}px`, border: '1px solid rgba(0, 221, 238, 0.4)', borderRadius: 2 }}>{productLabel}</div>
    )}
    {tagline && (
      <div style={{ fontSize: size * 0.09, fontWeight: 300, letterSpacing: '0.12em', color: '#667788', marginTop: size * 0.14 }}>Lokal AI · Sikkerhed · Automation</div>
    )}
  </div>
);

Object.assign(window, { I, ShieldMark, CMMark, CoreSystemsCube, CoreMindLogotype });