import React from 'react';

// Reusable SVG component that precisely mimics the overlapping, sweeping arcs of the E-TIB logo.
// The circles are offset along a diagonal to bunch together at the bottom-left and spread apart at the top-right.
export const LogoArcs = ({ className }: { className?: string }) => (
  <svg 
    className={className} 
    viewBox="0 0 200 200" 
    fill="none" 
    xmlns="http://www.w3.org/2000/svg"
    stroke="currentColor"
  >
    {/* Outer ring */}
    <circle cx="100" cy="100" r="90" strokeWidth="1.5" />
    {/* Middle thicker ring */}
    <circle cx="92" cy="108" r="78" strokeWidth="3.5" />
    {/* Inner ring */}
    <circle cx="84" cy="116" r="66" strokeWidth="1.5" />
  </svg>
);