import { iconVariants } from "./variants"

import type { IconProps } from "@/types/components/icon"

export default function BalconyIcon({ className, color, ...props }: IconProps) {
  const classNames = iconVariants({ className, color })
  return (
    <svg
      className={classNames}
      fill="none"
      height="20"
      viewBox="0 0 20 20"
      width="20"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        fill="#26201E"
        d="M9 11.938a.903.903 0 0 1-.662-.276.903.903 0 0 1-.275-.662c0-.258.091-.48.274-.662A.903.903 0 0 1 9 10.063c.258 0 .48.091.662.274a.903.903 0 0 1 .275.663c0 .258-.091.48-.274.662a.903.903 0 0 1-.663.275Zm6 0a.903.903 0 0 1-.662-.276.903.903 0 0 1-.275-.662c0-.258.091-.48.274-.662a.903.903 0 0 1 .663-.275c.258 0 .48.091.662.274a.903.903 0 0 1 .275.663c0 .258-.091.48-.274.662a.903.903 0 0 1-.663.275Zm-10.063 10c-.515 0-.957-.184-1.324-.551a1.806 1.806 0 0 1-.55-1.325v-4.125c0-.35.087-.672.262-.968.175-.296.42-.527.737-.694V10c0-1.091.209-2.12.625-3.087a8.055 8.055 0 0 1 1.703-2.53 7.953 7.953 0 0 1 2.526-1.7A7.75 7.75 0 0 1 12 2.063c1.091 0 2.12.206 3.088.62.968.413 1.81.98 2.53 1.699a7.965 7.965 0 0 1 1.7 2.53c.413.967.62 1.997.62 3.088v4.275c.316.167.562.398.737.694.175.296.262.619.262.969v4.124c0 .516-.183.957-.55 1.325-.367.367-.809.55-1.325.55H4.938Zm0-6v4.124h2.125v-4.125H4.938Zm4 4.124h2.126v-4.125H8.937v4.126Zm-3-6h5.125V4c-1.474.242-2.697.925-3.668 2.05C6.423 7.175 5.937 8.492 5.937 10v4.063Zm7 0h5.126V10c0-1.508-.486-2.825-1.457-3.95-.97-1.125-2.194-1.808-3.669-2.05v10.063Zm0 6h2.126v-4.125h-2.126v4.126Zm4 0h2.125v-4.125h-2.125v4.126Z"
      />
    </svg>
  )
}
