mada-design-system 0.0.9

package/index.es91.js

@@ -0,0 +1,324 @@
+import U, { useMemo as A, useRef as z, useEffect as E, useContext as le, useState as ue } from "react";
+import { KeyboardCode as O, useDndContext as fe, useDroppable as ge, useDraggable as pe, getClientRect as be } from "./index.es90.js";
+import { useUniqueId as ve, useIsomorphicLayoutEffect as V, useCombinedRefs as me, isKeyboardEvent as Ie, CSS as Y } from "./index.es133.js";
+function $(e, r, t) {
+  const n = e.slice();
+  return n.splice(t < 0 ? n.length + t : t, 0, n.splice(r, 1)[0]), n;
+}
+function xe(e, r) {
+  return e.reduce((t, n, i) => {
+    const c = r.get(n);
+    return c && (t[i] = c), t;
+  }, Array(e.length));
+}
+function N(e) {
+  return e !== null && e >= 0;
+}
+function ye(e, r) {
+  if (e === r)
+    return !0;
+  if (e.length !== r.length)
+    return !1;
+  for (let t = 0; t < e.length; t++)
+    if (e[t] !== r[t])
+      return !1;
+  return !0;
+}
+function he(e) {
+  return typeof e == "boolean" ? {
+    draggable: e,
+    droppable: e
+  } : e;
+}
+const j = (e) => {
+  let {
+    rects: r,
+    activeIndex: t,
+    overIndex: n,
+    index: i
+  } = e;
+  const c = $(r, n, t), o = r[i], a = c[i];
+  return !a || !o ? null : {
+    x: a.left - o.left,
+    y: a.top - o.top,
+    scaleX: a.width / o.width,
+    scaleY: a.height / o.height
+  };
+}, G = "Sortable", k = /* @__PURE__ */ U.createContext({
+  activeIndex: -1,
+  containerId: G,
+  disableTransforms: !1,
+  items: [],
+  overIndex: -1,
+  useDragOverlay: !1,
+  sortedRects: [],
+  strategy: j,
+  disabled: {
+    draggable: !1,
+    droppable: !1
+  }
+});
+function _e(e) {
+  let {
+    children: r,
+    id: t,
+    items: n,
+    strategy: i = j,
+    disabled: c = !1
+  } = e;
+  const {
+    active: o,
+    dragOverlay: a,
+    droppableRects: f,
+    over: l,
+    measureDroppableContainers: s
+  } = fe(), p = ve(G, t), v = a.rect !== null, u = A(() => n.map((m) => typeof m == "object" && "id" in m ? m.id : m), [n]), S = o != null, y = o ? u.indexOf(o.id) : -1, b = l ? u.indexOf(l.id) : -1, T = z(u), h = !ye(u, T.current), D = b !== -1 && y === -1 || h, g = he(c);
+  V(() => {
+    h && S && s(u);
+  }, [h, u, S, s]), E(() => {
+    T.current = u;
+  }, [u]);
+  const R = A(
+    () => ({
+      activeIndex: y,
+      containerId: p,
+      disabled: g,
+      disableTransforms: D,
+      items: u,
+      overIndex: b,
+      useDragOverlay: v,
+      sortedRects: xe(u, f),
+      strategy: i
+    }),
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [y, p, g.draggable, g.droppable, D, u, b, f, v, i]
+  );
+  return U.createElement(k.Provider, {
+    value: R
+  }, r);
+}
+const De = (e) => {
+  let {
+    id: r,
+    items: t,
+    activeIndex: n,
+    overIndex: i
+  } = e;
+  return $(t, n, i).indexOf(r);
+}, Re = (e) => {
+  let {
+    containerId: r,
+    isSorting: t,
+    wasDragging: n,
+    index: i,
+    items: c,
+    newIndex: o,
+    previousItems: a,
+    previousContainerId: f,
+    transition: l
+  } = e;
+  return !l || !n || a !== c && i === o ? !1 : t ? !0 : o !== i && r === f;
+}, Ce = {
+  duration: 200,
+  easing: "ease"
+}, J = "transform", we = /* @__PURE__ */ Y.Transition.toString({
+  property: J,
+  duration: 0,
+  easing: "linear"
+}), Se = {
+  roleDescription: "sortable"
+};
+function Te(e) {
+  let {
+    disabled: r,
+    index: t,
+    node: n,
+    rect: i
+  } = e;
+  const [c, o] = ue(null), a = z(t);
+  return V(() => {
+    if (!r && t !== a.current && n.current) {
+      const f = i.current;
+      if (f) {
+        const l = be(n.current, {
+          ignoreTransform: !0
+        }), s = {
+          x: f.left - l.left,
+          y: f.top - l.top,
+          scaleX: f.width / l.width,
+          scaleY: f.height / l.height
+        };
+        (s.x || s.y) && o(s);
+      }
+    }
+    t !== a.current && (a.current = t);
+  }, [r, t, n, i]), E(() => {
+    c && o(null);
+  }, [c]), c;
+}
+function ze(e) {
+  let {
+    animateLayoutChanges: r = Re,
+    attributes: t,
+    disabled: n,
+    data: i,
+    getNewIndex: c = De,
+    id: o,
+    strategy: a,
+    resizeObserverConfig: f,
+    transition: l = Ce
+  } = e;
+  const {
+    items: s,
+    containerId: p,
+    activeIndex: v,
+    disabled: u,
+    disableTransforms: S,
+    sortedRects: y,
+    overIndex: b,
+    useDragOverlay: T,
+    strategy: h
+  } = le(k), D = Oe(n, u), g = s.indexOf(o), R = A(() => ({
+    sortable: {
+      containerId: p,
+      index: g,
+      items: s
+    },
+    ...i
+  }), [p, i, g, s]), m = A(() => s.slice(s.indexOf(o)), [s, o]), {
+    rect: P,
+    node: M,
+    isOver: Q,
+    setNodeRef: X
+  } = ge({
+    id: o,
+    data: R,
+    disabled: D.droppable,
+    resizeObserverConfig: {
+      updateMeasurementsFor: m,
+      ...f
+    }
+  }), {
+    active: C,
+    activatorEvent: W,
+    activeNodeRect: Z,
+    attributes: ee,
+    setNodeRef: q,
+    listeners: te,
+    isDragging: L,
+    over: re,
+    setActivatorNodeRef: ne,
+    transform: oe
+  } = pe({
+    id: o,
+    data: R,
+    attributes: {
+      ...Se,
+      ...t
+    },
+    disabled: D.draggable
+  }), se = me(X, q), I = !!C, B = I && !S && N(v) && N(b), F = !T && L, H = F && B ? oe : null, ie = B ? H ?? (a ?? h)({
+    rects: y,
+    activeNodeRect: Z,
+    activeIndex: v,
+    overIndex: b,
+    index: g
+  }) : null, w = N(v) && N(b) ? c({
+    id: o,
+    items: s,
+    activeIndex: v,
+    overIndex: b
+  }) : g, x = C == null ? void 0 : C.id, d = z({
+    activeId: x,
+    items: s,
+    newIndex: w,
+    containerId: p
+  }), ae = s !== d.current.items, K = r({
+    active: C,
+    containerId: p,
+    isDragging: L,
+    isSorting: I,
+    id: o,
+    index: g,
+    items: s,
+    newIndex: d.current.newIndex,
+    previousItems: d.current.items,
+    previousContainerId: d.current.containerId,
+    transition: l,
+    wasDragging: d.current.activeId != null
+  }), _ = Te({
+    disabled: !K,
+    index: g,
+    node: M,
+    rect: P
+  });
+  return E(() => {
+    I && d.current.newIndex !== w && (d.current.newIndex = w), p !== d.current.containerId && (d.current.containerId = p), s !== d.current.items && (d.current.items = s);
+  }, [I, w, p, s]), E(() => {
+    if (x === d.current.activeId)
+      return;
+    if (x != null && d.current.activeId == null) {
+      d.current.activeId = x;
+      return;
+    }
+    const ce = setTimeout(() => {
+      d.current.activeId = x;
+    }, 50);
+    return () => clearTimeout(ce);
+  }, [x]), {
+    active: C,
+    activeIndex: v,
+    attributes: ee,
+    data: R,
+    rect: P,
+    index: g,
+    newIndex: w,
+    items: s,
+    isOver: Q,
+    isSorting: I,
+    isDragging: L,
+    listeners: te,
+    node: M,
+    overIndex: b,
+    over: re,
+    setNodeRef: se,
+    setActivatorNodeRef: ne,
+    setDroppableNodeRef: X,
+    setDraggableNodeRef: q,
+    transform: _ ?? ie,
+    transition: de()
+  };
+  function de() {
+    if (
+      // Temporarily disable transitions for a single frame to set up derived transforms
+      _ || // Or to prevent items jumping to back to their "new" position when items change
+      ae && d.current.newIndex === g
+    )
+      return we;
+    if (!(F && !Ie(W) || !l) && (I || K))
+      return Y.Transition.toString({
+        ...l,
+        property: J
+      });
+  }
+}
+function Oe(e, r) {
+  var t, n;
+  return typeof e == "boolean" ? {
+    draggable: e,
+    // Backwards compatibility
+    droppable: !1
+  } : {
+    draggable: (t = e == null ? void 0 : e.draggable) != null ? t : r.draggable,
+    droppable: (n = e == null ? void 0 : e.droppable) != null ? n : r.droppable
+  };
+}
+O.Down, O.Right, O.Up, O.Left;
+export {
+  _e as SortableContext,
+  $ as arrayMove,
+  Re as defaultAnimateLayoutChanges,
+  De as defaultNewIndexGetter,
+  j as rectSortingStrategy,
+  ze as useSortable
+};

package/index.es92.js

@@ -0,0 +1,13 @@
+import L from "./index.es138.js";
+const o = L("Close", [
+  [
+    "path",
+    {
+      d: "M19 6.41L17.59 5L12 10.59L6.41 5L5 6.41L10.59 12L5 17.59L6.41 19L12 13.41L17.59 19L19 17.59L13.41 12L19 6.41Z",
+      key: "14hqpl"
+    }
+  ]
+]);
+export {
+  o as default
+};

package/index.es93.js

@@ -0,0 +1,13 @@
+import e from "./index.es138.js";
+const r = e("Refresh", [
+  [
+    "path",
+    {
+      d: "M17.6449 6.35C16.1949 4.9 14.2049 4 11.9949 4C7.57488 4 4.00488 7.58 4.00488 12C4.00488 16.42 7.57488 20 11.9949 20C15.7249 20 18.8349 17.45 19.7249 14H17.6449C16.8249 16.33 14.6049 18 11.9949 18C8.68488 18 5.99488 15.31 5.99488 12C5.99488 8.69 8.68488 6 11.9949 6C13.6549 6 15.1349 6.69 16.2149 7.78L12.9949 11H19.9949V4L17.6449 6.35Z",
+      key: "1wsech"
+    }
+  ]
+]);
+export {
+  r as default
+};

package/index.es94.js

@@ -0,0 +1,13 @@
+import H from "./index.es138.js";
+const e = H("AddBox", [
+  [
+    "path",
+    {
+      d: "M19 3H5C3.89 3 3 3.9 3 5V19C3 20.1 3.89 21 5 21H19C20.1 21 21 20.1 21 19V5C21 3.9 20.1 3 19 3ZM19 19H5V5H19V19ZM11 17H13V13H17V11H13V7H11V11H7V13H11V17Z",
+      key: "eelf3i"
+    }
+  ]
+]);
+export {
+  e as default
+};

package/index.es95.js

@@ -0,0 +1,10 @@
+import H from "./index.es138.js";
+const t = H("DashboardCustomize", [
+  ["path", { d: "M3 11H11V3H3V11ZM5 5H9V9H5V5Z", key: "1w78ug" }],
+  ["path", { d: "M13 3V11H21V3H13ZM19 9H15V5H19V9Z", key: "tprguu" }],
+  ["path", { d: "M3 21H11V13H3V21ZM5 15H9V19H5V15Z", key: "3xlfiv" }],
+  ["path", { d: "M18 13H16V16H13V18H16V21H18V18H21V16H18V13Z", key: "lwgil4" }]
+]);
+export {
+  t as default
+};

package/index.es96.js

@@ -0,0 +1,40 @@
+import { jsx as n, jsxs as o } from "react/jsx-runtime";
+import * as s from "react";
+import { cn as t } from "./index.es69.js";
+import { strings as l } from "./index.es80.js";
+import c from "./index.es98.js";
+import m from "./index.es99.js";
+const P = ({ className: e, ...a }) => /* @__PURE__ */ n("nav", { role: "navigation", "aria-label": "pagination", className: t("mx-auto flex w-full justify-center", e), ...a }), p = s.forwardRef(({ className: e, ...a }, i) => /* @__PURE__ */ n("ul", { ref: i, className: t("flex flex-row items-center gap-space-01", e), ...a }));
+p.displayName = "PaginationContent";
+const d = s.forwardRef(({ className: e, ...a }, i) => /* @__PURE__ */ n("li", { ref: i, className: t("", e), ...a }));
+d.displayName = "PaginationItem";
+const r = ({ className: e, isActive: a, ...i }) => /* @__PURE__ */ n(
+  "button",
+  {
+    "aria-current": a ? "page" : void 0,
+    className: t(
+      "flex h-16 min-w-16 items-center justify-center gap-space-01 rounded-1 border py-space-01 text-body-01",
+      `${a ? "border-primary text-primary" : "border-transparent hover:bg-card-hover"}`,
+      e
+    ),
+    ...i
+  }
+);
+r.displayName = "PaginationLink";
+const f = ({ className: e, hasText: a, ...i }) => /* @__PURE__ */ o(r, { "aria-label": "Go to previous page", size: "default", className: t("px-space-01", e), ...i, children: [
+  /* @__PURE__ */ n(c, { className: "h-space-05 w-space-05 ltr:rotate-180" }),
+  a && /* @__PURE__ */ n("span", { className: "hidden sm:inline-block", children: l.Shared.previous })
+] });
+f.displayName = "PaginationPrevious";
+const b = ({ className: e, hasText: a, ...i }) => /* @__PURE__ */ o(r, { "aria-label": "Go to next page", size: "default", className: t("px-space-01", e), ...i, children: [
+  a && /* @__PURE__ */ n("span", { className: "hidden sm:inline-block", children: l.Shared.next }),
+  /* @__PURE__ */ n(m, { className: "h-space-05 w-space-05 ltr:rotate-180" })
+] });
+export {
+  P as Pagination,
+  p as PaginationContent,
+  d as PaginationItem,
+  r as PaginationLink,
+  b as PaginationNext,
+  f as PaginationPrevious
+};

package/index.es97.js

@@ -0,0 +1,19 @@
+import e from "./index.es148.js";
+import i from "./index.es149.js";
+import { unsafeStringify as d } from "./index.es150.js";
+function g(n, m, t) {
+  if (e.randomUUID && !m && !n)
+    return e.randomUUID();
+  n = n || {};
+  const r = n.random || (n.rng || i)();
+  if (r[6] = r[6] & 15 | 64, r[8] = r[8] & 63 | 128, m) {
+    t = t || 0;
+    for (let a = 0; a < 16; ++a)
+      m[t + a] = r[a];
+    return m;
+  }
+  return d(r);
+}
+export {
+  g as default
+};

package/index.es98.js

@@ -0,0 +1,13 @@
+import t from "./index.es138.js";
+const o = t("ChevronRight", [
+  [
+    "path",
+    {
+      d: "M9.70492 6L8.29492 7.41L12.8749 12L8.29492 16.59L9.70492 18L15.7049 12L9.70492 6Z",
+      key: "xcu7tv"
+    }
+  ]
+]);
+export {
+  o as default
+};

package/index.es99.js

@@ -0,0 +1,13 @@
+import e from "./index.es138.js";
+const L = e("ChevronLeft", [
+  [
+    "path",
+    {
+      d: "M15.7049 7.41L14.2949 6L8.29492 12L14.2949 18L15.7049 16.59L11.1249 12L15.7049 7.41Z",
+      key: "2nwmtn"
+    }
+  ]
+]);
+export {
+  L as default
+};

package/package.json

@@ -0,0 +1,143 @@
+{
+  "name": "mada-design-system",
+  "version": "0.0.9",
+  "sideEffects": false,
+  "private": false,
+  "main": "index.es.js",
+  "scripts": {
+    "dev": "vite --open",
+    "build:storybook": "tsc && storybook build",
+    "build:lib": "tsc && vite build  && pnpm run build:config",
+    "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
+    "preview": "vite preview",
+    "start": "storybook dev -p 6006",
+    "build:config": "node  build-tailwind",
+    "sonar": "node ./src/Lib/sonar.ts"
+  },
+  "peerDependencies": {
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
+  },
+  "dependencies": {
+    "@date-io/moment": "2.17.0",
+    "@dnd-kit/core": "^6.2.0",
+    "@dnd-kit/sortable": "^9.0.0",
+    "@emotion/react": "11.11.3",
+    "@emotion/styled": "11.11.0",
+    "@hookform/resolvers": "^3.10.0",
+    "@mui/material": "5.15.3",
+    "@mui/x-date-pickers": "6.18.7",
+    "@radix-ui/react-accordion": "^1.2.2",
+    "@radix-ui/react-alert-dialog": "^1.1.5",
+    "@radix-ui/react-avatar": "^1.1.2",
+    "@radix-ui/react-checkbox": "^1.1.3",
+    "@radix-ui/react-collapsible": "^1.1.2",
+    "@radix-ui/react-dialog": "^1.1.5",
+    "@radix-ui/react-dropdown-menu": "^2.1.5",
+    "@radix-ui/react-label": "^2.1.1",
+    "@radix-ui/react-navigation-menu": "^1.2.4",
+    "@radix-ui/react-popover": "^1.1.5",
+    "@radix-ui/react-progress": "^1.1.1",
+    "@radix-ui/react-radio-group": "^1.2.2",
+    "@radix-ui/react-scroll-area": "^1.2.2",
+    "@radix-ui/react-select": "^2.1.5",
+    "@radix-ui/react-separator": "^1.1.1",
+    "@radix-ui/react-slider": "^1.2.2",
+    "@radix-ui/react-slot": "^1.1.1",
+    "@radix-ui/react-switch": "^1.1.2",
+    "@radix-ui/react-tabs": "^1.1.2",
+    "@radix-ui/react-toast": "^1.2.5",
+    "@radix-ui/react-toggle": "^1.1.1",
+    "@radix-ui/react-toggle-group": "^1.1.1",
+    "@radix-ui/react-tooltip": "^1.1.7",
+    "@tailwindcss/typography": "^0.5.10",
+    "@tanstack/react-query": "5.55.4",
+    "@tanstack/react-table": "^8.20.6",
+    "class-variance-authority": "^0.7.0",
+    "classnames": "^2.5.1",
+    "clsx": "^2.1.1",
+    "cmdk": "^0.2.0",
+    "google-material-icons": "^2.0.1",
+    "highcharts": "^11.2.0",
+    "highcharts-react-official": "^3.2.1",
+    "immer": "^10.1.1",
+    "input-otp": "^1.4.2",
+    "moment": "^2.30.1",
+    "moment-hijri": "^2.1.2",
+    "oidc-client-ts": "^3.1.0",
+    "react-hook-form": "7.54.2",
+    "react-localization": "^1.0.19",
+    "react-router-dom": "^6.16.0",
+    "sonarqube-scanner": "^4.2.6",
+    "tailwind-merge": "^1.14.0",
+    "tailwind-scrollbar": "^3.1.0",
+    "tailwindcss-animate": "^1.0.7",
+    "usehooks-ts": "^2.9.1",
+    "uuid": "^9.0.1",
+    "zod": "^3.24.1",
+    "zustand": "^4.5.1"
+  },
+  "devDependencies": {
+    "@originjs/vite-plugin-commonjs": "^1.0.3",
+    "@rollup/plugin-inject": "^5.0.5",
+    "@storybook/addon-a11y": "^8.5.3",
+    "@storybook/addon-essentials": "^8.5.3",
+    "@storybook/addon-interactions": "^8.5.3",
+    "@storybook/addon-links": "^8.5.3",
+    "@storybook/addon-mdx-gfm": "^8.5.3",
+    "@storybook/addon-onboarding": "^8.5.3",
+    "@storybook/blocks": "^8.5.3",
+    "@storybook/manager-api": "^8.5.3",
+    "@storybook/preview-api": "^8.5.3",
+    "@storybook/react": "^8.5.3",
+    "@storybook/react-vite": "^8.5.3",
+    "@storybook/test": "^8.5.3",
+    "@storybook/theming": "^8.5.3",
+    "@types/moment-hijri": "^2.1.4",
+    "@types/node": "^20.8.3",
+    "@types/react": "18.2.18",
+    "@types/react-dom": "^18.2.17",
+    "@types/uuid": "^9.0.8",
+    "@typescript-eslint/eslint-plugin": "^6.2.1",
+    "@typescript-eslint/parser": "^6.2.1",
+    "@vitejs/plugin-basic-ssl": "^1.2.0",
+    "@vitejs/plugin-react": "^4.3.4",
+    "autoprefixer": "^10.4.20",
+    "eslint": "^8.46.0",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-plugin-react": "^7.37.4",
+    "eslint-plugin-react-hooks": "^4.6.0",
+    "eslint-plugin-react-refresh": "^0.4.3",
+    "eslint-plugin-storybook": "^0.8.0",
+    "postcss": "^8.5.1",
+    "postcss-rtlcss": "^4.0.8",
+    "prettier": "^3.4.2",
+    "prettier-plugin-tailwindcss": "^0.5.11",
+    "rtlcss": "^4.3.0",
+    "storybook": "^8.5.3",
+    "tailwindcss": "^3.4.3",
+    "typescript": "^5.7.3",
+    "vite": "^4.4.8",
+    "vite-plugin-dts": "^4.5.0"
+  },
+  "module": "index.es.js",
+  "types": "index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./index.es.js",
+      "require": "./index.cjs.js",
+      "types": "./index.d.ts"
+    },
+    "./tailwind": {
+      "import": "./tailwind.config.js",
+      "require": "./tailwind.config.cjs"
+    },
+    "./eslint": "./.eslintrc.cjs",
+    "./prettier": "./.prettierrc.json",
+    "./tsconfig": "./tsconfig.json",
+    "./style": "./style.css"
+  },
+  "files": [
+    "*"
+  ]
+}

package/style.css

@@ -0,0 +1 @@
+@import"https://fonts.googleapis.com/css2?family=Noto+Kufi+Arabic:wght@100..900&family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap";:root{--background: #F9f9f9;--background-foreground: #0F0F0F;--background-secondary: #EBEBEB;--background-brand: #F8FCFB;--foreground: #0F0F0F;--overlay: #212625BD;--foreground-secondary: #212625BD;--foreground-tertiary: #353B3A99;--card: #fff;--card-foreground: #0F0F0F;--card-hover: #7E7E7E0D;--card-active: #FAFAFA;--popover: #fff;--popover-foreground: #0F0F0F;--primary: #178F72;--primary-foreground: #fff;--primary-light: #7CD9BA;--primary-dark: #116B57;--primary-oncontainer: #0E463B;--primary-container: #D6F5E7;--secondary: #8966C5;--secondary-foreground: #fff;--secondary-light: #CFC6EC;--secondary-dark: #7751B0;--secondary-oncontainer: #533979;--secondary-container: #F0EEF9;--tertiary: #1A72AF;--tertiary-foreground: #fff;--tertiary-light: #8DC7EC;--tertiary-dark: #155685;--tertiary-oncontainer: #184262;--tertiary-container: #E4F0FA;--error: #CE2D2D;--error-foreground: #fff;--error-light: #F7AAAA;--error-dark: #B02525;--error-oncontainer: #7A2222;--error-container: #FCE4E4;--sucess: #398F54;--sucess-foreground: #fff;--sucess-light: #A5CDB2;--sucess-dark: #2B6B3F;--sucess-oncontainer: #1F4D2D;--sucess-container: #D5F5DE;--warning: #B25E09;--warning-foreground: #fff;--warning-light: #FDCF72;--warning-dark: #96530F;--warning-oncontainer: #663B0F;--warning-container: #FFF1D6;--info: #1A72AF;--info-foreground: #fff;--info-light: #8DC7EC;--info-dark: #155685;--info-oncontainer: #184262;--info-container: #E4F0FA;--muted: #F9f9f9;--muted-foreground: #0F0F0F;--accent: 210 40% 96.1%;--accent-foreground: 222.2 47.4% 11.2%;--destructive: #E54E4E;--destructive-foreground: #fff;--inverted: #0F0F0F;--inverted-secondary: #353B3A99;--inverted-foreground: #fff;--border: #EBEBEB;--border-secondary: #EBEBEB;--disabled: #393A404D;--disabled-foreground: #FAFAFA;--input: #353B3A3B;--ring: #0F0F0F;--divider: #353B3A3B;--skeleton: #353B3A33;--radius: 12px}.dark{--background: #313336;--background-foreground: #FFFFFF;--background-secondary: #414549;--background-brand: #313336;--foreground: #fff;--overlay: #CECECE;--foreground-secondary: #CECECE;--foreground-tertiary: #B7BBBC;--card: #242629;--card-foreground: #fff;--card-hover: #414549;--card-active: #313336;--popover: #242629;--popover-foreground: #fff;--primary: #23A684;--primary-foreground: #fff;--primary-light: #46C19C;--primary-dark: #178F72;--primary-oncontainer: #EEFBF6;--primary-container: #0E463B;--secondary: #9A7FD4;--secondary-foreground: #fff;--secondary-light: #B5A4E1;--secondary-dark: #8966C5;--secondary-oncontainer: #F7F6FB;--secondary-container: #533979;--tertiary: #2990CE;--tertiary-foreground: #fff;--tertiary-light: #50ABE0;--tertiary-dark: #1A72AF;--tertiary-oncontainer: #F2F8FD;--tertiary-container: #184262;--error: #E54E4E;--error-foreground: #fff;--error-light: #F07979;--error-dark: #CE2D2D;--error-oncontainer: #FDF3F3;--error-container: #7A2222;--sucess: #489961;--sucess-foreground: #fff;--sucess-light: #8BBF9B;--sucess-dark: #398F54;--sucess-oncontainer: #E5F0E8;--sucess-container: #1F4D2D;--warning: #DB7712;--warning-foreground: #fff;--warning-light: #FBBB3C;--warning-dark: #B25E09;--warning-oncontainer: #FFF8EB;--warning-container: #663B0F;--info: #2990CE;--info-foreground: #fff;--info-light: #50ABE0;--info-dark: #1A72AF;--info-oncontainer: #F2F8FD;--info-container: #184262;--muted: #313336;--muted-foreground: #fff;--accent: 210 40% 96.1%;--accent-foreground: 222.2 47.4% 11.2%;--destructive: #E54E4E;--destructive-foreground: #fff;--inverted: #FFFFFF;--inverted-secondary: #CECECE;--inverted-foreground: #242629;--border: #555E65;--border-secondary: #494F55;--disabled: #636F77;--disabled-foreground: #CECECE;--input: #555E65;--ring: #0F0F0F;--divider: #555E65;--skeleton: #636F77;--radius: 12px}*{border-color:var(--border)}html{scroll-behavior:smooth;font-size:55%}@media (min-width: 640px){html{font-size:62.5%}}body{background-color:var(--card);font-size:1.6rem;color:var(--foreground)}body:where([dir=ltr],[dir=ltr] *){font-family:Noto Sans,ui-sans-serif,system-ui}body:where([dir=rtl],[dir=rtl] *){font-family:Noto Kufi Arabic,ui-sans-serif,system-ui}input:-webkit-autofill,input:-webkit-autofill:focus{-webkit-transition:background-color 0s 600000s,color 0s 600000s!important;transition:background-color 0s 600000s,color 0s 600000s!important}.title-01{font-size:2rem;line-height:2.8rem}@media (min-width: 1024px){.title-01{font-size:2.4rem;line-height:3.2rem}}.title-02{font-size:2.4rem;font-weight:700;line-height:3.2rem}@media (min-width: 1024px){.title-02{font-size:3.2rem;line-height:4rem}}.title-03{font-size:2.8rem;line-height:3.6rem}@media (min-width: 768px){.title-03{font-size:4rem;line-height:5.2rem}}@media (min-width: 1024px){.title-03{font-size:4.8rem;line-height:6rem}}.display-01{font-size:4rem;font-weight:700;line-height:5.2rem}@media (min-width: 1024px){.display-01{font-size:4.8rem;line-height:6.2rem}}@media (min-width: 1280px){.display-01{font-size:6.4rem;line-height:8.8rem}}.display-02{font-size:4.2rem;font-weight:700;line-height:5.4rem}@media (min-width: 768px){.display-02{font-size:5.4rem;line-height:7rem}}@media (min-width: 1024px){.display-02{font-size:8.4rem;line-height:9.8rem}}.dsgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}@media (min-width: 768px){.dsgrid{grid-template-columns:repeat(8,minmax(0,1fr))}}@media (min-width: 1024px){.dsgrid{grid-template-columns:repeat(12,minmax(0,1fr));gap:24px}}.MuiButtonBase-root.MuiPickersDay-root{border-radius:8px;font-size:1.4rem;line-height:2rem}.MuiButtonBase-root.MuiPickersDay-root:hover{background-color:var(--primary-container)}.MuiButtonBase-root.MuiPickersDay-root:disabled{color:var(--disabled)!important}.MuiButtonBase-root.MuiPickersDay-root:is(.dark *){color:var(--foreground)}.MuiButtonBase-root.MuiPickersDay-root:where([dir=ltr],[dir=ltr] *){font-family:Noto Sans,ui-sans-serif,system-ui}.MuiButtonBase-root.MuiPickersDay-root:where([dir=rtl],[dir=rtl] *){font-family:Noto Kufi Arabic,ui-sans-serif,system-ui}.MuiPickersCalendarHeader-label:where([dir=ltr],[dir=ltr] *),.MuiDayCalendar-header .MuiTypography-caption.MuiDayCalendar-weekDayLabel:where([dir=ltr],[dir=ltr] *){font-family:Noto Sans,ui-sans-serif,system-ui}.MuiPickersCalendarHeader-label:where([dir=rtl],[dir=rtl] *),.MuiDayCalendar-header .MuiTypography-caption.MuiDayCalendar-weekDayLabel:where([dir=rtl],[dir=rtl] *){font-family:Noto Kufi Arabic,ui-sans-serif,system-ui}.MuiButtonBase-root.MuiPickersDay-root.Mui-selected,.MuiButtonBase-root.MuiPickersDay-root:focus.Mui-selected{background-color:var(--primary)}.MuiDayCalendar-header .MuiTypography-caption{font-size:1.2rem;line-height:1.6rem;color:var(--foreground-secondary)}.MuiPickersCalendarHeader-root{justify-content:space-between}.MuiPickersCalendarHeader-root>div{margin:0;font-size:1.4rem;line-height:2rem}.MuiButtonBase-root.MuiIconButton-root{font-size:1.4rem;line-height:2rem}.MuiButtonBase-root.MuiIconButton-root:is(.dark *){color:var(--foreground)}.MuiButtonBase-root.MuiIconButton-root:where([dir=ltr],[dir=ltr] *){--tw-rotate: 0deg !important;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.MuiButtonBase-root.MuiIconButton-root:where([dir=rtl],[dir=rtl] *){--tw-rotate: 180deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.MuiPickersYear-root .MuiPickersYear-yearButton{font-size:1.4rem;line-height:2rem}.MuiPickersYear-root .MuiPickersYear-yearButton:hover{background-color:var(--primary-container)}.MuiPickersYear-root .MuiPickersYear-yearButton.Mui-selected{background-color:var(--primary)!important}.Mui-disabled.MuiPickersDay-today{border-color:transparent!important}.MuiButtonBase-root.MuiPickersDay-root.Mui-selected:hover{background-color:var(--primary-dark)!important}html[dir=ltr] .MuiDateCalendar-root{direction:ltr}html[dir=rtl] .MuiDateCalendar-root{direction:rtl}