export function ProjectIcon() {
  return (
    <svg
      width="20"
      height="20"
      viewBox="0 0 20 20"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
    >
      <path
        d="M11 5.29844V4.51127C11 3.70744 10.2251 3.1309 9.45518 3.36188L5.85518 4.44188C5.3476 4.59416 5 5.06134 5 5.59127V13.4056C5 13.9355 5.3476 14.4027 5.85518 14.555L9.45518 15.635C10.2251 15.866 11 15.2894 11 14.4856V13.6984M11 5.29844H13.4C13.7314 5.29844 14 5.56707 14 5.89844V13.0984C14 13.4298 13.7314 13.6984 13.4 13.6984H11M11 5.29844V13.6984"
        stroke="var(--accent-color)"
        strokeWidth="1.2"
      />
    </svg>
  );
}

export function ToggleSidebarIcon() {
  return (
    <svg
      width="24"
      height="24"
      viewBox="0 0 24 24"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
    >
      <rect
        x="3.5"
        y="5.13672"
        width="17"
        height="13.7273"
        rx="3.59091"
        stroke="var(--accent-color)"
      />
      <rect
        x="8.72729"
        y="5.45312"
        width="0.818182"
        height="13.0909"
        fill="var(--accent-color)"
      />
      <circle
        cx="6.27271"
        cy="8.72834"
        r="0.818182"
        fill="var(--accent-color)"
      />
      <circle
        cx="6.27271"
        cy="11.1815"
        r="0.818182"
        fill="var(--accent-color)"
      />
    </svg>
  );
}

export function AppDockIcon() {
  return (
    <svg
      width="20"
      height="20"
      viewBox="0 0 20 20"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
    >
      <ellipse cx="3" cy="3" rx="2" ry="2" fill="var(--text-color)" />
      <ellipse cx="10" cy="3" rx="2" ry="2" fill="var(--text-color)" />
      <ellipse cx="17" cy="3" rx="2" ry="2" fill="var(--text-color)" />
      <ellipse cx="3" cy="10" rx="2" ry="2" fill="var(--text-color)" />
      <ellipse cx="10" cy="10" rx="2" ry="2" fill="var(--text-color)" />
      <ellipse cx="17" cy="10" rx="2" ry="2" fill="var(--text-color)" />
      <ellipse cx="3" cy="17" rx="2" ry="2" fill="var(--text-color)" />
      <ellipse cx="10" cy="17" rx="2" ry="2" fill="var(--text-color)" />
      <ellipse cx="17" cy="17" rx="2" ry="2" fill="var(--text-color)" />
    </svg>
  );
}