// src/components/sidebar/SidebarShell.jsx
import React from "react";
import { TbMenu2, TbX } from "react-icons/tb";

export default function SidebarShell({ isMobileOpen, setIsMobileOpen, children }) {
  return (
    <>
      {/* دکمه‌ی تاگل موبایل */}
      <button
        type="button"
        className="xl:hidden fixed top-17 right-6 z-100 dark:bg-[#001F3F] bg-[#f2f2f2] dark:text-white rounded-full p-2 shadow-lg flex items-center justify-center"
        onClick={() => setIsMobileOpen((prev) => !prev)}
      >
        {isMobileOpen ? <TbX className="w-6 h-6" /> : <TbMenu2 className="w-6 h-6" />}
      </button>

      {/* اوورلی پشت سایدبار روی موبایل */}
      {isMobileOpen && (
        <div
          className="xl:hidden fixed inset-0 bg-black/40 z-40"
          onClick={() => setIsMobileOpen(false)}
        />
      )}

      {children}
    </>
  );
}
