/* =====================================================================
   AI-COS — Generic product brand mark (no client identity)
   A navy compliance "shield + check" tile. `light` renders for dark
   backgrounds (sidebar / login / document headers).
   ===================================================================== */
const BRAND_NAVY = '#16314a';
const BRAND_ACCENT = '#2f6fed';

/* AI-COS mark — amber stylised "A" (matches docs/logo). Amber reads on both
   the navy sidebar and the white login surfaces, so no tile is needed. */
function BrandMark({ size = 40, light = false, style }) {
  const uid = 'am' + size + (light ? 'L' : 'D');
  return (
    <svg width={size} height={size} viewBox="0 0 48 48" style={style} role="img" aria-label="AI-COS">
      <defs>
        <linearGradient id={uid} x1="0.15" y1="0" x2="0.85" y2="1">
          <stop offset="0" stopColor="#f4a93c" />
          <stop offset="0.55" stopColor="#e8821e" />
          <stop offset="1" stopColor="#b5341a" />
        </linearGradient>
      </defs>
      {/* left leg of the A */}
      <path d="M21 5 L7 43 L15.5 43 L25.5 14 Z" fill={`url(#${uid})`} />
      {/* right leg + crossbar with a notch */}
      <path d="M24 5 L41 43 L32 43 L29.4 36 L24.5 36 L27.2 29 L26.6 27 L23 16.5 Z" fill={`url(#${uid})`} />
    </svg>
  );
}

/* Horizontal lockup: mark + "AI-COS" wordmark (for letterheads) */
function BrandLockup({ size = 44, light = false, sub }) {
  const navy = light ? '#ffffff' : BRAND_NAVY;
  return (
    <div style={{ display: 'flex', alignItems: 'center', gap: 12 }}>
      <BrandMark size={size} light={light} />
      <div style={{ lineHeight: 1.05 }}>
        <div style={{ fontSize: size * 0.46, fontWeight: 800, letterSpacing: '-.4px', color: navy }}>
          AI<span style={{ color: BRAND_ACCENT }}>-COS</span>
        </div>
        {sub && <div style={{ fontSize: size * 0.24, color: light ? 'rgba(255,255,255,.7)' : 'var(--text-3)', marginTop: 2 }}>{sub}</div>}
      </div>
    </div>
  );
}

/* Persistent "demo only" chip shown in the app chrome */
function DemoChip({ style }) {
  return (
    <span title="Demonstration build — sample data only, not operational"
      style={{ display: 'inline-flex', alignItems: 'center', gap: 5, flex: 'none', fontSize: 11, fontWeight: 700,
        letterSpacing: '.4px', textTransform: 'uppercase', color: '#b45309', background: '#fef3c7',
        border: '1px solid #fcd9a3', borderRadius: 999, padding: '3px 10px', whiteSpace: 'nowrap', ...style }}>
      <span style={{ width: 6, height: 6, borderRadius: '50%', background: '#f59e0b' }} />
      Demo · sample data
    </span>
  );
}

/* Asset base path, resolved from the data.js script tag so both entries
   (/ on the cal project, /calibration on the monorepo site) work. */
const CAL_ASSET_BASE = (function () {
  const s = [...document.scripts].find((x) => /data\.js(\?|$)/.test(x.src || ''));
  return s ? s.src.replace(/[^/]*$/, '') : '';
})();

window.BrandMark = BrandMark;
window.BrandLockup = BrandLockup;
window.DemoChip = DemoChip;
window.CAL_ASSET_BASE = CAL_ASSET_BASE;
window.BRAND_NAVY = BRAND_NAVY;
window.BRAND_ACCENT = BRAND_ACCENT;