/* =====================================================================
   AI-COS — Al Duqum Al Masiya ENT (ADAM) brand mark
   Circular "ADAM" badge: worker silhouette holding a gas detector with
   concentric signal waves. Navy + orange brand palette. A `light` prop
   renders the mark for dark backgrounds (sidebar / login / cert header).
   ===================================================================== */
const ADAM_NAVY = '#16314a';
const ADAM_ORANGE = '#e2794b';

function BrandMark({ size = 40, light = false, style }) {
  const ring = light ? '#ffffff' : ADAM_NAVY;
  const figure = light ? '#ffffff' : ADAM_NAVY;
  const wave = light ? 'rgba(255,255,255,.55)' : ADAM_ORANGE;
  const txt = light ? '#ffffff' : ADAM_NAVY;
  const uid = 'adamArc' + size + (light ? 'L' : 'D');
  return (
    <svg width={size} height={size} viewBox="0 0 120 120" style={style} role="img" aria-label="Al Duqum Al Masiya ENT">
      <defs>
        {/* top arc for the ADAM lettering */}
        <path id={uid} d="M 24 56 A 36 36 0 0 1 96 56" fill="none" />
      </defs>
      {/* outer + inner rings */}
      <circle cx="60" cy="60" r="56" fill="none" stroke={ring} strokeWidth="3.5" />
      <circle cx="60" cy="60" r="49" fill="none" stroke={ring} strokeWidth="1.4" opacity=".55" />

      {/* ADAM wordmark along the top arc */}
      <text fontFamily="Hanken Grotesk, sans-serif" fontWeight="800" fontSize="17"
            letterSpacing="3" fill={txt}>
        <textPath href={'#' + uid} startOffset="50%" textAnchor="middle">ADAM</textPath>
      </text>
      {/* flanking dots */}
      <circle cx="29" cy="78" r="2.1" fill={wave} />
      <circle cx="91" cy="78" r="2.1" fill={wave} />

      {/* concentric signal waves (right side) */}
      <g fill="none" stroke={wave} strokeWidth="3.2" strokeLinecap="round">
        <path d="M 70 96 A 18 18 0 0 0 70 60" opacity=".9" />
        <path d="M 76 100 A 27 27 0 0 0 76 56" opacity=".6" />
        <path d="M 82 104 A 36 36 0 0 0 82 52" opacity=".35" />
      </g>

      {/* worker silhouette holding a gas detector */}
      <g fill={figure}>
        {/* hard hat + head (facing right) */}
        <path d="M 44 44 q 9 -10 19 -3 l 2 4 q -10 -4 -18 2 z" />
        <circle cx="55" cy="50" r="6.6" />
        {/* torso, crouching forward */}
        <path d="M 49 56 q 8 1 12 7 l 5 10 q 2 5 -2 8 l -3 2 q -3 2 -6 -1 l -8 -10 q -4 -6 -1 -14 q 1 -8 3 -9 z" />
        {/* extended arm + detector */}
        <path d="M 58 62 l 13 5 q 3 1 2 4 l -1 2 q -1 3 -4 2 l -13 -5 z" />
        <rect x="68" y="64" width="9" height="13" rx="2.2" transform="rotate(22 72 70)" />
        {/* forward leg / knee */}
        <path d="M 50 76 l 4 9 q 1 3 -2 4 l -2 1 q -3 1 -4 -2 l -3 -9 q -1 -4 3 -4 z" />
      </g>
    </svg>
  );
}

/* Horizontal lockup: badge + "Al Duqum Al Masiya" wordmark (for letterheads) */
function BrandLockup({ size = 44, light = false, sub }) {
  const navy = light ? '#ffffff' : ADAM_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.42, fontWeight: 800, letterSpacing: '-.3px', color: navy }}>
          Al Duqum <span style={{ color: ADAM_ORANGE }}>Al Masiya</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>
  );
}

window.BrandMark = BrandMark;
window.BrandLockup = BrandLockup;
window.DemoChip = DemoChip;
window.ADAM_NAVY = ADAM_NAVY;
window.ADAM_ORANGE = ADAM_ORANGE;