import React from "react";
import ReactDOM from "react-dom/client";
import { ConfigProvider, theme } from "antd";
import { BrowserRouter } from "react-router-dom";
import { Toaster } from "@/components/ui/sonner";
import "./index.css";
import App from "./App";

ReactDOM.createRoot(document.getElementById("root")!).render(
  <React.StrictMode>
    <ConfigProvider
      theme={{
        algorithm: theme.defaultAlgorithm,
        token: {
          colorBgBase: "#F7F7F8",
          colorBgContainer: "#FFFFFF",
          colorBorder: "#E9E9EB",
          colorText: "#1F2329",
          colorTextSecondary: "#8A8F99",
          borderRadius: 12,
          borderRadiusLG: 18,
          controlHeight: 36,
          fontSize: 14,
          boxShadowSecondary:
            "0 18px 42px rgba(15, 23, 42, 0.12), 0 2px 8px rgba(15, 23, 42, 0.06)",
        },
        components: {
          Button: {
            borderRadius: 10,
            controlHeight: 36,
          },
          Input: {
            borderRadius: 12,
          },
          Select: {
            borderRadius: 10,
          },
          Dropdown: {
            borderRadius: 12,
          },
          Modal: {
            contentBg: "#FFFFFF",
            headerBg: "transparent",
            footerBg: "transparent",
            titleColor: "#1F2329",
            titleFontSize: 16,
          },
        },
      }}
    >
      <BrowserRouter>
        <App />
      </BrowserRouter>
      <Toaster position="top-center" />
    </ConfigProvider>
  </React.StrictMode>,
);
