/* ============================================================
   AI4Colegios UI Kit — Icons.jsx
   House icon set: inline SVG, stroke, currentColor (Feather/Lucide style),
   copied verbatim from code/index.html. WhatsApp is the one filled brand glyph.
   Rendered at 1em; inherit color from parent. NEVER emoji.
   ============================================================ */
(function () {
  const S = (props) => ({
    viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor',
    strokeWidth: 1.9, strokeLinecap: 'round', strokeLinejoin: 'round',
    width: '1em', height: '1em', 'aria-hidden': true, ...props,
  });

  // stroke icons --------------------------------------------------
  const Ledger   = (p) => <svg {...S(p)}><path d="M4 5h16M4 10h16M4 15h10M4 20h10" /></svg>;
  const Register = (p) => <svg {...S(p)}><circle cx="12" cy="12" r="9" /><path d="M12 8v8M8 12h8" /></svg>;
  const Grid     = (p) => <svg {...S(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" /></svg>;
  const Settings = (p) => <svg {...S(p)}><circle cx="12" cy="12" r="3" /><path d="M19.4 15a1.6 1.6 0 0 0 .3 1.8l.1.1a2 2 0 1 1-2.8 2.8l-.1-.1a1.6 1.6 0 0 0-1.8-.3 1.6 1.6 0 0 0-1 1.5V21a2 2 0 0 1-4 0v-.1a1.6 1.6 0 0 0-1-1.5 1.6 1.6 0 0 0-1.8.3l-.1.1a2 2 0 1 1-2.8-2.8l.1-.1a1.6 1.6 0 0 0 .3-1.8 1.6 1.6 0 0 0-1.5-1H3a2 2 0 0 1 0-4h.1a1.6 1.6 0 0 0 1.5-1 1.6 1.6 0 0 0-.3-1.8l-.1-.1a2 2 0 1 1 2.8-2.8l.1.1a1.6 1.6 0 0 0 1.8.3H9a1.6 1.6 0 0 0 1-1.5V3a2 2 0 0 1 4 0v.1a1.6 1.6 0 0 0 1 1.5 1.6 1.6 0 0 0 1.8-.3l.1-.1a2 2 0 1 1 2.8 2.8l-.1.1a1.6 1.6 0 0 0-.3 1.8V9a1.6 1.6 0 0 0 1.5 1H21a2 2 0 0 1 0 4h-.1a1.6 1.6 0 0 0-1.5 1z" /></svg>;
  const Recipients = (p) => <svg {...S(p)}><circle cx="9" cy="8" r="3" /><path d="M3 20a6 6 0 0 1 12 0" /><path d="M16 7a3 3 0 0 1 0 6M21 20a6 6 0 0 0-4-5.6" /></svg>;
  const Template = (p) => <svg {...S(p)}><rect x="5" y="3" width="14" height="18" rx="2" /><path d="M9 8h6M9 12h6M9 16h4" /></svg>;
  const Compose  = (p) => <svg {...S(p)}><path d="M12 20h9" /><path d="M16.5 3.5a2.1 2.1 0 0 1 3 3L7 19l-4 1 1-4z" /></svg>;
  const Clock    = (p) => <svg {...S(p)}><circle cx="12" cy="12" r="9" /><path d="M12 7v5l3 2" /></svg>;
  const Send     = (p) => <svg {...S(p)}><path d="M22 2 11 13M22 2l-7 20-4-9-9-4z" /></svg>;
  const Search   = (p) => <svg {...S(p)}><circle cx="11" cy="11" r="7" /><line x1="21" y1="21" x2="16.65" y2="16.65" /></svg>;
  const Check    = (p) => <svg {...S({ strokeWidth: 2.5, ...p })}><polyline points="20 6 9 17 4 12" /></svg>;
  const Import   = (p) => <svg {...S(p)}><path d="M12 3v12" /><path d="M7 8l5-5 5 5" /><path d="M4 17v2a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-2" /></svg>;
  const Export   = (p) => <svg {...S(p)}><path d="M12 15V3" /><path d="M7 10l5 5 5-5" /><path d="M4 17v2a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-2" /></svg>;
  const Sun      = (p) => <svg {...S({ strokeWidth: 2, ...p })}><circle cx="12" cy="12" r="4" /><path d="M12 2v2M12 20v2M4.93 4.93l1.41 1.41M17.66 17.66l1.41 1.41M2 12h2M20 12h2M4.93 19.07l1.41-1.41M17.66 6.34l1.41-1.41" /></svg>;
  const Moon     = (p) => <svg {...S({ strokeWidth: 2, ...p })}><path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z" /></svg>;
  const Cash     = (p) => <svg {...S({ strokeWidth: 2, ...p })}><rect x="2" y="6" width="20" height="12" rx="2" /><circle cx="12" cy="12" r="2.5" /></svg>;
  const CardIcon = (p) => <svg {...S({ strokeWidth: 2, ...p })}><rect x="2" y="5" width="20" height="14" rx="2" /><line x1="2" y1="10" x2="22" y2="10" /></svg>;
  const Transfer = (p) => <svg {...S({ strokeWidth: 2, ...p })}><path d="M3 21h18" /><path d="M3 10l9-6 9 6" /><path d="M6 10v8M18 10v8M10 10v8M14 10v8" /></svg>;

  // filled brand glyph -------------------------------------------
  const WhatsApp = (p) => (
    <svg viewBox="0 0 24 24" fill="currentColor" width="1em" height="1em" aria-hidden="true" {...p}>
      <path d="M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51l-.57-.01c-.198 0-.52.074-.792.372s-1.04 1.016-1.04 2.479 1.065 2.876 1.213 3.074c.149.198 2.096 3.2 5.077 4.487.71.306 1.263.489 1.694.625.712.227 1.36.195 1.872.118.571-.085 1.758-.719 2.006-1.413.247-.694.247-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 0 1-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 0 1-1.51-5.26c.002-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 0 1 2.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0 0 12.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 0 0 5.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893A11.821 11.821 0 0 0 20.464 3.488" />
    </svg>
  );

  // crest (CSS-drawn, no logo file) ------------------------------
  const Crest = ({ size = 34, initials = 'R' }) => (
    <span className="ds-shield" style={{ width: size, height: size }}>
      <span className="ds-shield-inner">{initials}</span>
    </span>
  );

  window.Icons = {
    Ledger, Register, Grid, Settings, Recipients, Template, Compose, Clock, Send,
    Search, Check, Import, Export, Sun, Moon, Cash, CardIcon, Transfer, WhatsApp, Crest,
  };
})();
