// mountains.jsx — Evercap mark: TWO bold mountains + clear lake reflection.
// No infinity, no roundel. Faceted sun/shadow faces, back range, big snowcaps,
// a visible mirrored reflection. Evergreen + brass. Exports to window.

// Palettes -------------------------------------------------------------------
const LAND = {
  back:  '#2E6B4E', shad: '#0E2A20', face: '#143D2E', lit: '#1F5A41',
  snow:  '#F5F2EA', line: '#0E2A20',
};
const WATER_BRASS = {
  back:  '#C9A86A', shad: '#916E38', face: '#B0894C', lit: '#C9A86A',
  snow:  '#E7D6B0', line: '#916E38',
};
const WATER_GREEN = {
  back:  '#6E9C84', shad: '#2E5A47', face: '#3F7E5F', lit: '#5C9079',
  snow:  '#CFE0D5', line: '#2E5A47',
};
const LAND_REV = {
  back:'#7FB295', shad:'#CFE0D5', face:'#F5F2EA', lit:'#DCEAE0', snow:'#0E2A20', line:'#9FC0AC',
};
const WATER_REV = {
  back:'#5C8270', shad:'#9FC0AC', face:'#7FA48F', lit:'#9FC0AC', snow:'#0E2A20', line:'#5C8270',
};

// Scene above the horizon (horizon at y=70). 120 wide. ------------------------
function Scene({ c, outline, outlineW = 3 }) {
  return (
    <g>
      {/* distant back range */}
      <path d="M0,70 L16,53 L28,61 L42,49 L56,59 L70,51 L86,61 L100,53 L114,61 L120,56 L120,70 Z" fill={c.back} />

      {/* LEFT mountain — summit (38,26) */}
      <path d="M2,70 L38,26 L68,70 Z" fill={c.face} />
      <path d="M38,26 L68,70 L50,70 L38,42 Z" fill={c.lit} />          {/* sun face */}
      <path d="M2,70 L38,26 L30,40 L18,56 Z" fill={c.shad} />          {/* shadow flank */}
      <path d="M27,43 L38,26 L50,44 L45,38 L41,45 L38,33 L34,46 L31,40 Z" fill={c.snow} />

      {/* RIGHT mountain (taller, hero) — summit (80,8) */}
      <path d="M44,70 L80,8 L118,70 Z" fill={c.face} />
      <path d="M80,8 L118,70 L94,70 L80,26 Z" fill={c.lit} />          {/* sun face */}
      <path d="M44,70 L80,8 L70,26 L56,50 Z" fill={c.shad} />          {/* shadow flank */}
      <path d="M63,31 L80,8 L98,32 L91,25 L86,33 L80,19 L74,34 L67,25 Z" fill={c.snow} />

      {/* strong silhouette outline — a key piece of the mark */}
      {outline && (
        <g fill="none" stroke={outline} strokeWidth={outlineW} strokeLinejoin="round" strokeLinecap="round">
          <path d="M0,70 L16,53 L28,61 L42,49 L56,59 L70,51 L86,61 L100,53 L114,61 L120,56" opacity="0.55" />
          <path d="M2,70 L38,26 L68,70" />
          <path d="M44,70 L80,8 L118,70" />
        </g>
      )}
    </g>
  );
}

/* Core: scene + clearly visible mirrored reflection (thin waterline gap). */
function MountainMark({ size = 140, land = LAND, water = WATER_BRASS, horizon = '#143D2E',
  reflect = 0.5, outline = null, outlineW = 3, uid = 'm' }) {
  return (
    <svg width={size} height={size * 132 / 120} viewBox="0 0 120 132" fill="none">
      <Scene c={land} outline={outline} outlineW={outlineW} />
      {/* reflection — mirrored about the waterline with a 2px gap */}
      <g transform="translate(0,142) scale(1,-1)" opacity={reflect}>
        <Scene c={water} outline={outline} outlineW={outlineW} />
      </g>
      {/* waterline */}
      <line x1="2" y1="71" x2="118" y2="71" stroke={horizon} strokeWidth="1.4" opacity="0.35" />
    </svg>
  );
}

Object.assign(window, { Scene, MountainMark, LAND, WATER_BRASS, WATER_GREEN, LAND_REV, WATER_REV });