"use client";
import SideBarNavBarMobile from "@comp/Navbar/SideBarNavBarMobile/page";
import AppContext from "@ctx/AppContext";
import React, { useContext } from "react";

const SearchSideBar = () => {
  const CTX = useContext(AppContext);

  return (
    <>
      <div className="mt-5 px-3">
        <div className="absolute right-0  mr-[15px] mt-[0px]">
          <div
            className="bg-gray-100 rounded-r-lg h-[47px] w-[40px] border-l-[1px] mt-[2px] "
            onClick={() => {
              CTX.setCloseNavbar(true);
            }}
          >
            <div className="pt-[9px] ">
              <svg
                width="25"
                height="28"
                viewBox="0 0 235 124"
                fill="none"
                xmlns="http://www.w3.org/2000/svg"
                className="mx-auto"
              >
                <path
                  d="M145.5 124L145.5 93.4995L235 93.4995L235 124L145.5 124ZM75.5 26.4998L75.5 0.499997L235 0.499997L235 26.4998L75.5 26.4998ZM0.499998 72.4996L0.499997 47.4996L235 47.4996L235 72.4996L0.499998 72.4996Z"
                  fill="black"
                  fill-opacity="0.73"
                />
              </svg>
            </div>
          </div>
        </div>
        <input
          type="text"
          className="form-control  bg-gray-100 !border-[0px] border-gray-100 rounded-lg text-right focus:!border-[0px] !text-sm !pr-[60px]  "
          placeholder="دستت برای جست و جو بازه"
        />

        <div className="absolute mt-[-46px] ml-[6px]">
          <div className="w-[40px] h-[40px] bg-gray-200  rounded-lg pt-2">
            <svg
              width="17"
              height="17"
              viewBox="0 0 275 275"
              fill="none"
              xmlns="http://www.w3.org/2000/svg"
              className="mx-auto mt-1"
            >
              <path
                d="M215.913 215.913L265 265M250.832 130.822C250.832 197.553 196.915 251.644 130.424 251.644C63.9166 251.644 10 197.552 10 130.838C10 64.0759 63.9166 10 130.408 10C196.915 10 250.832 64.0919 250.832 130.822Z"
                stroke="black"
                stroke-width="18.75"
                stroke-linecap="round"
                stroke-linejoin="round"
              />
            </svg>
          </div>
        </div>
      </div>
      <SideBarNavBarMobile />
    </>
  );
};

export default SearchSideBar;
