{% macro home() %}
  <svg
    xmlns="http://www.w3.org/2000/svg"
    width="24"
    height="24"
    viewBox="0 0 24 24"
    fill="none"
    stroke="currentColor"
    stroke-width="2"
    stroke-linecap="round"
    stroke-linejoin="round"
    class="lucide lucide-home"
  >
    <path d="m3 9 9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" />
    <polyline points="9 22 9 12 15 12 15 22" />
  </svg>
{% endmacro %}

{% macro signin() %}
  <svg
    xmlns="http://www.w3.org/2000/svg"
    width="24"
    height="24"
    viewBox="0 0 24 24"
    fill="none"
    stroke="currentColor"
    stroke-width="2"
    stroke-linecap="round"
    stroke-linejoin="round"
    class="lucide lucide-log-in"
  >
    <path d="M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4" />
    <polyline points="10 17 15 12 10 7" />
    <line x1="15" x2="3" y1="12" y2="12" />
  </svg>
{% endmacro %}

{% macro search(attrs="") %}
  <svg
    {{ attrs | safe }}
    xmlns="http://www.w3.org/2000/svg"
    width="24"
    height="24"
    viewBox="0 0 24 24"
    fill="none"
    stroke="currentColor"
    stroke-width="2"
    stroke-linecap="round"
    stroke-linejoin="round"
    class="lucide lucide-search"
  >
    <circle cx="11" cy="11" r="8" />
    <path d="m21 21-4.3-4.3" />
  </svg>
{% endmacro %}

{% macro rhombus(attrs="") %}
  <svg
    {{ attrs | safe }}
    width="49.635"
    height="58.948"
    version="1.1"
    viewBox="0 0 49.635 58.948"
    xmlns="http://www.w3.org/2000/svg"
  >
    <style>
      #background {
        fill: white;
      }
      .angle {
        stroke: black;
      }
      .border {
        stroke: black;
      }
      .single-tick-background {
        stroke: none;
        fill: #f87171;
      }
      .double-tick-background {
        stroke: none;
        fill: #86efac;
      }
    </style>
    <g transform="matrix(1.3333 0 0 -1.3333 -3.9931 62.943)">
      <path
        id="background"
        d="m21.602 3.3946-18.208 21.699c6.0492 7.2394 12.138 14.48 18.208 21.715 6.0758-7.2103 12.152-14.467 18.221-21.699-6.33-7.5772-12.785-15.254-18.221-21.715z"
      />
      <g
        id="top-angle"
        class="angle"
        transform="matrix(1.4923 0 0 1.4923 21.608 -17.1)"
      >
        <path
          id="top-angle-background"
          class="double-tick-background"
          transform="matrix(.67011 0 0 .67011 1.614 10.768)"
          d="m-2.3908 48.051-5.3912-6.4254c3.1177-2.6161 7.6658-2.6161 10.784 0z"
        />
        <g fill="none" stroke-miterlimit="10" stroke-width=".3985">
          <path
            id="top-angle-arc"
            d="m-3.6437 38.646c2.1071-1.7681 5.181-1.7681 7.2881 0"
          />
          <path d="m-0.47015 39.417-0.17994-4.1286" />
          <path d="m0.47015 39.417 0.17994-4.1286" />
        </g>
      </g>
      <g
        id="bottom-angle"
        class="angle"
        transform="matrix(1.4923 0 0 1.4923 21.608 2.5878)"
      >
        <path
          id="bottom-angle-background"
          class="double-tick-background"
          transform="matrix(.67011 0 0 .67011 -14.48 -1.7341)"
          d="m21.649 3.851 5.0598 6.0304c-2.926 2.4552-7.1946 2.4552-10.121 0z"
        />
        <g fill="none" stroke-miterlimit="10" stroke-width=".3985">
          <path
            id="bottom-angle-arc"
            d="m3.6437 4.7834c-2.1071 1.7681-5.181 1.7681-7.2881 0"
          />
          <path d="m0.47015 4.0126 0.17994 4.1286" />
          <path d="m-0.47015 4.0126-0.17994 4.1286" />
        </g>
      </g>
      <g
        id="right-angle"
        class="angle"
        transform="matrix(1.4923 0 0 1.4923 13.546 -7.3028)"
      >
        <path
          id="right-angle-background"
          class="single-tick-background"
          transform="matrix(.67011 0 0 .67011 -9.077 4.8937)"
          d="m39.671 25.052-5.0595 6.0301c-2.1541-1.8076-3.1808-4.6279-2.6925-7.3972 0.32129-1.8222 1.2751-3.474 2.6925-4.6633z"
        />
        <path
          id="right-angle-arc"
          d="m14.208 26.057c-1.5513-1.3017-2.2907-3.3328-1.939-5.3272 0.23138-1.3123 0.91827-2.5018 1.939-3.3583"
          fill="none"
          stroke-miterlimit="10"
          stroke-width=".3985"
        />
        <path
          id="right-angle-tick"
          d="m14.248 21.715h-4.1329"
          fill="none"
          stroke-miterlimit="10"
          stroke-width=".3985"
        />
      </g>
      <g
        id="left-angle"
        class="angle"
        transform="matrix(1.4923 0 0 1.4923 29.717 -7.3028)"
      >
        <path
          id="left-angle-background"
          class="single-tick-background"
          transform="translate(-5.4342 6.6278)"
          d="m-12.017 15.179 3.3905-4.0409c1.4435 1.2113 2.1315 3.1012 1.8043 4.957-0.2153 1.2211-0.85445 2.328-1.8043 3.125z"
        />
        <path
          id="left-angle-arc"
          d="m-14.208 17.372c1.5513 1.3018 2.2907 3.3328 1.939 5.3272-0.23138 1.3123-0.91827 2.5018-1.939 3.3584"
          fill="none"
          stroke-miterlimit="10"
          stroke-width=".3985"
        />
        <path
          id="left-angle-tick"
          d="m-14.248 21.715h4.1329"
          fill="none"
          stroke-miterlimit="10"
          stroke-width=".3985"
        />
      </g>
      <path
        id="outline"
        class="border"
        d="m21.602 3.3946-18.208 21.699c6.0492 7.2394 12.138 14.48 18.208 21.715 6.0758-7.2103 12.152-14.467 18.221-21.699-6.33-7.5772-12.785-15.254-18.221-21.715z"
        fill="none"
        stroke-linejoin="round"
        stroke-miterlimit="10"
        stroke-width=".79701"
      />
    </g>
  </svg>
{% endmacro %}