{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "service-page",
  "title": "صفحة خدمة",
  "type": "registry:block",
  "description": "صفحة خدمة",
  "author": "Tirazkit contributors",
  "dependencies": [
    "class-variance-authority@0.7.1",
    "clsx@2.1.1",
    "lucide-react@^1.31.0",
    "radix-ui@^1.6.7",
    "tailwind-merge@3.6.0"
  ],
  "registryDependencies": [],
  "files": [
    {
      "path": "registry/tirazkit/service-page.tsx",
      "type": "registry:component",
      "target": "@components/tirazkit/service-page.tsx",
      "content": "\"use client\";\nimport {\n  ArrowLeft,\n  ArrowRight,\n  Clock3,\n  FileCheck2,\n  ShieldCheck,\n} from \"lucide-react\";\nimport { useKit } from \"./theme\";\nimport { Card } from \"./card\";\nimport { Button } from \"./button\";\nimport { Badge } from \"./badge\";\nimport { Breadcrumb } from \"./breadcrumb\";\nimport { Accordion } from \"./accordion\";\nexport function ServicePage({\n  title,\n  description,\n  requirements,\n  duration,\n  onStart,\n  directoryHref = \"/services\",\n}: {\n  title: string;\n  description: string;\n  requirements: string[];\n  duration: string;\n  onStart: () => void;\n  directoryHref?: string;\n}) {\n  const { locale } = useKit();\n  const ar = locale === \"ar\";\n  const Arrow = ar ? ArrowLeft : ArrowRight;\n  return (\n    <section className=\"tk-block\">\n      <Breadcrumb\n        items={[\n          { label: ar ? \"الخدمات\" : \"Services\", href: directoryHref },\n          { label: title },\n        ]}\n      />\n      <div className=\"tk-block-header\">\n        <div>\n          <Badge tone=\"success\">\n            {ar ? \"خدمة إلكترونية\" : \"Digital service\"}\n          </Badge>\n        </div>\n        <h2 className=\"tk-heading\">{title}</h2>\n        <p className=\"tk-muted\">{description}</p>\n      </div>\n      <div className=\"tk-block-split\">\n        <div className=\"tk-stack\">\n          <Card title={ar ? \"متطلبات الخدمة\" : \"Requirements\"}>\n            <ul className=\"tk-stack\" style={{ gap: 12 }}>\n              {requirements.map((item) => (\n                <li key={item} className=\"tk-row\" style={{ fontSize: 13 }}>\n                  <FileCheck2\n                    size={17}\n                    style={{ color: \"var(--tk-primary)\" }}\n                    aria-hidden=\"true\"\n                  />\n                  {item}\n                </li>\n              ))}\n            </ul>\n          </Card>\n          <Accordion\n            items={[\n              {\n                value: \"steps\",\n                title: ar ? \"كيف أقدّم الطلب؟\" : \"How do I apply?\",\n                content: ar\n                  ? \"ابدأ الخدمة، ثم أدخل بياناتك وأرفق المستندات المطلوبة. راجع الطلب قبل إرساله.\"\n                  : \"Start the service, enter your details, and attach required documents. Review before submitting.\",\n              },\n              {\n                value: \"followup\",\n                title: ar ? \"كيف أتابع طلبي؟\" : \"How do I track a request?\",\n                content: ar\n                  ? \"احتفظ برقم الطلب الذي يعرضه نظامك بعد الإرسال، واستخدمه في صفحة متابعة الطلبات.\"\n                  : \"Save the reference provided by your system after submission and use it to track your request.\",\n              },\n            ]}\n          />\n        </div>\n        <Card\n          title={ar ? \"تفاصيل الخدمة\" : \"Service details\"}\n          footer={\n            <Button onClick={onStart} className=\"w-full\">\n              {ar ? \"ابدأ الخدمة\" : \"Start service\"}\n              <Arrow size={16} />\n            </Button>\n          }\n        >\n          <div className=\"tk-stack\">\n            <div className=\"tk-row\">\n              <Clock3 size={18} aria-hidden=\"true\" />\n              <div>\n                <span className=\"tk-muted\">\n                  {ar ? \"وقت تنفيذ الخدمة\" : \"Service time\"}\n                </span>\n                <p style={{ fontSize: 13 }}>{duration}</p>\n              </div>\n            </div>\n            <div className=\"tk-row\">\n              <ShieldCheck size={18} aria-hidden=\"true\" />\n              <span className=\"tk-muted\">\n                {ar\n                  ? \"تتم مراجعة البيانات قبل الاعتماد\"\n                  : \"Details are reviewed before approval\"}\n              </span>\n            </div>\n          </div>\n        </Card>\n      </div>\n    </section>\n  );\n}\n"
    },
    {
      "path": "registry/tirazkit/theme.tsx",
      "type": "registry:component",
      "target": "@components/tirazkit/theme.tsx",
      "content": "\"use client\";\nimport {\n  createContext,\n  useContext,\n  type CSSProperties,\n  type ReactNode,\n} from \"react\";\nimport { DirectionProvider } from \"./primitives/direction\";\nimport {\n  themeVariables,\n  type ThemeId,\n  type KitMode,\n  type KitLocale,\n} from \"./themes\";\nimport \"./tirazkit.css\";\nconst KitContext = createContext({\n  theme: \"dga\" as ThemeId,\n  mode: \"light\" as KitMode,\n  locale: \"ar\" as KitLocale,\n  overrides: {} as CSSProperties,\n});\nexport function useKit() {\n  const kit = useContext(KitContext);\n  return {\n    ...kit,\n    dir: kit.locale === \"ar\" ? (\"rtl\" as const) : (\"ltr\" as const),\n    style: {\n      ...themeVariables(kit.theme, kit.mode),\n      ...kit.overrides,\n    } as CSSProperties,\n  };\n}\nexport function Theme({\n  theme = \"dga\",\n  mode = \"light\",\n  locale = \"ar\",\n  children,\n  className = \"\",\n  overrides = {},\n}: {\n  theme?: ThemeId;\n  mode?: KitMode;\n  locale?: KitLocale;\n  children: ReactNode;\n  className?: string;\n  overrides?: CSSProperties;\n}) {\n  const dir = locale === \"ar\" ? \"rtl\" : \"ltr\";\n  return (\n    <KitContext.Provider value={{ theme, mode, locale, overrides }}>\n      <DirectionProvider dir={dir}>\n        <div\n          className={`tk-scope ${className}`}\n          data-kit-theme={theme}\n          data-kit-mode={mode}\n          lang={locale}\n          dir={dir}\n          style={\n            { ...themeVariables(theme, mode), ...overrides } as CSSProperties\n          }\n        >\n          {children}\n        </div>\n      </DirectionProvider>\n    </KitContext.Provider>\n  );\n}\n"
    },
    {
      "path": "components/ui/direction.tsx",
      "type": "registry:component",
      "target": "@components/tirazkit/primitives/direction.tsx",
      "content": "// MIT License. Copyright (c) 2023 shadcn. See LICENSE.txt.\n\"use client\"\n\nimport * as React from \"react\"\nimport { Direction } from \"radix-ui\"\n\nfunction DirectionProvider({\n  dir,\n  direction,\n  children,\n}: React.ComponentProps<typeof Direction.DirectionProvider> & {\n  direction?: React.ComponentProps<typeof Direction.DirectionProvider>[\"dir\"]\n}) {\n  return (\n    <Direction.DirectionProvider dir={direction ?? dir}>\n      {children}\n    </Direction.DirectionProvider>\n  )\n}\n\nconst useDirection = Direction.useDirection\n\nexport { DirectionProvider, useDirection }\n"
    },
    {
      "path": "registry/tirazkit/themes.ts",
      "type": "registry:component",
      "target": "@components/tirazkit/themes.ts",
      "content": "export const themes = {\n  dga: {\n    id: \"dga\",\n    name: \"كود المنصات\",\n    english: \"Platforms Code\",\n    description: \"أخضر واضح، تباين متوازن وهوية مستندة إلى مرجع كود المنصات.\",\n    primary: \"#1b8354\",\n    hover: \"#166a45\",\n    pressed: \"#104631\",\n    soft: \"#f3fcf6\",\n    radius: \"4px\",\n    palette: [\"#1b8354\", \"#166a45\", \"#dff6e7\", \"#161616\", \"#f3f4f6\"],\n  },\n  tiraz: {\n    id: \"tiraz\",\n    name: \"طراز\",\n    english: \"Tiraz\",\n    description: \"بنفسجي صريح ومساحات مريحة لمنتجاتك الرقمية.\",\n    primary: \"#5945e6\",\n    hover: \"#4935c9\",\n    pressed: \"#38249f\",\n    soft: \"#f1effe\",\n    radius: \"10px\",\n    palette: [\"#5945e6\", \"#9c8ff2\", \"#e5e0fc\", \"#27223d\", \"#f7f6fc\"],\n  },\n  ocean: {\n    id: \"ocean\",\n    name: \"محيط\",\n    english: \"Ocean\",\n    description: \"أزرق عميق وحواف ناعمة لواجهات هادئة وواضحة.\",\n    primary: \"#1262c5\",\n    hover: \"#0c4da0\",\n    pressed: \"#0b3975\",\n    soft: \"#eff6ff\",\n    radius: \"14px\",\n    palette: [\"#1262c5\", \"#38a3d1\", \"#d9effc\", \"#18324b\", \"#f2f8fc\"],\n  },\n  ink: {\n    id: \"ink\",\n    name: \"حبر\",\n    english: \"Ink\",\n    description: \"طابع محايد وحواف دقيقة تجعل المحتوى في المقدمة.\",\n    primary: \"#27272a\",\n    hover: \"#18181b\",\n    pressed: \"#09090b\",\n    soft: \"#f4f4f5\",\n    radius: \"2px\",\n    palette: [\"#27272a\", \"#71717a\", \"#d4d4d8\", \"#18181b\", \"#fafafa\"],\n  },\n} as const;\nexport type ThemeId = keyof typeof themes;\nexport type KitMode = \"light\" | \"dark\";\nexport type KitLocale = \"ar\" | \"en\";\nexport function themeVariables(id: ThemeId = \"dga\", mode: KitMode = \"light\") {\n  const theme = themes[id];\n  const dark = mode === \"dark\";\n  const primary =\n    dark && id === \"ink\"\n      ? \"#e4e4e7\"\n      : dark\n        ? {\n            dga: \"#4ad195\",\n            tiraz: \"#b2a5ff\",\n            ocean: \"#7cc4ff\",\n            ink: \"#e4e4e7\",\n          }[id]\n        : theme.primary;\n  return {\n    \"--tk-primary\": primary,\n    \"--tk-hover\": dark ? primary : theme.hover,\n    \"--tk-pressed\": dark ? primary : theme.pressed,\n    \"--tk-on-primary\": dark ? \"#101820\" : \"#ffffff\",\n    \"--tk-soft\": dark ? \"#252936\" : theme.soft,\n    \"--tk-radius\": theme.radius,\n    \"--tk-bg\": dark ? \"#151923\" : \"#ffffff\",\n    \"--tk-fg\": dark ? \"#f1f3f6\" : \"#161616\",\n    \"--tk-muted\": dark ? \"#b6bdc9\" : \"#596472\",\n    \"--tk-surface\": dark ? \"#1e2430\" : \"#f8f9fb\",\n    \"--tk-border\": dark ? \"#414957\" : \"#d2d6db\",\n    \"--tk-success\": dark ? \"#67d9a2\" : \"#067647\",\n    \"--tk-success-bg\": dark ? \"#142e26\" : \"#ecfdf3\",\n    \"--tk-warning\": dark ? \"#f7c86b\" : \"#935c08\",\n    \"--tk-warning-bg\": dark ? \"#322817\" : \"#fffaeb\",\n    \"--tk-danger\": dark ? \"#ff9b97\" : \"#b42318\",\n    \"--tk-danger-bg\": dark ? \"#3c2026\" : \"#fef3f2\",\n    \"--tk-info\": dark ? \"#8ac8ff\" : \"#175cd3\",\n    \"--tk-info-bg\": dark ? \"#1a2c43\" : \"#eff8ff\",\n  };\n}\n"
    },
    {
      "path": "registry/tirazkit/tirazkit.css",
      "type": "registry:file",
      "target": "@components/tirazkit/tirazkit.css",
      "content": ":root {\n  --tk-primary: #1b8354;\n  --tk-hover: #166a45;\n  --tk-pressed: #104631;\n  --tk-on-primary: #fff;\n  --tk-soft: #f3fcf6;\n  --tk-radius: 4px;\n  --tk-bg: #fff;\n  --tk-fg: #161616;\n  --tk-muted: #596472;\n  --tk-surface: #f8f9fb;\n  --tk-border: #d2d6db;\n  --tk-success: #067647;\n  --tk-success-bg: #ecfdf3;\n  --tk-warning: #935c08;\n  --tk-warning-bg: #fffaeb;\n  --tk-danger: #b42318;\n  --tk-danger-bg: #fef3f2;\n  --tk-info: #175cd3;\n  --tk-info-bg: #eff8ff;\n}\n.tk-scope {\n  --background: var(--tk-bg);\n  --foreground: var(--tk-fg);\n  --card: var(--tk-bg);\n  --card-foreground: var(--tk-fg);\n  --popover: var(--tk-bg);\n  --popover-foreground: var(--tk-fg);\n  --primary: var(--tk-primary);\n  --primary-foreground: var(--tk-on-primary);\n  --secondary: var(--tk-soft);\n  --secondary-foreground: var(--tk-fg);\n  --muted: var(--tk-surface);\n  --muted-foreground: var(--tk-muted);\n  --accent: var(--tk-soft);\n  --accent-foreground: var(--tk-fg);\n  --border: var(--tk-border);\n  --input: var(--tk-border);\n  --ring: var(--tk-primary);\n  --radius: var(--tk-radius);\n  --destructive: var(--tk-danger);\n  color: var(--tk-fg);\n  background: var(--tk-bg);\n  font-family: inherit;\n  line-height: 1.65;\n  text-align: start;\n  color-scheme: light;\n}\n.tk-scope[data-kit-mode=\"dark\"] {\n  color-scheme: dark;\n}\n.tk-scope * {\n  box-sizing: border-box;\n}\n.tk-scope :focus-visible {\n  outline: 2px solid var(--tk-primary);\n  outline-offset: 3px;\n}\n.tk-stack {\n  display: grid;\n  gap: 20px;\n}\n.tk-row {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex-wrap: wrap;\n}\n.tk-between {\n  justify-content: space-between;\n}\n.tk-muted {\n  color: var(--tk-muted);\n  font-size: 13px;\n}\n.tk-heading {\n  font-size: 24px;\n  font-weight: 600;\n  line-height: 1.5;\n}\n.tk-small {\n  font-size: 12px;\n}\n.tk-button {\n  font-family: inherit;\n  border-radius: var(--tk-radius);\n  border: 1px solid transparent;\n  font-weight: 500;\n  gap: 8px;\n  transition:\n    background-color 0.15s,\n    color 0.15s,\n    border-color 0.15s;\n  box-shadow: none;\n  cursor: pointer;\n  line-height: 1.5;\n}\n.tk-button-md {\n  min-height: 40px;\n  padding: 8px 16px;\n}\n.tk-button-sm {\n  min-height: 32px;\n  padding: 5px 12px;\n  font-size: 12px;\n}\n.tk-button-lg {\n  min-height: 48px;\n  padding: 12px 22px;\n}\n.tk-button-primary {\n  background: var(--tk-primary);\n  color: var(--tk-on-primary);\n}\n.tk-button-primary:hover {\n  background: var(--tk-hover);\n}\n.tk-button-primary:active {\n  background: var(--tk-pressed);\n}\n.tk-button-secondary {\n  background: var(--tk-soft);\n  color: var(--tk-primary);\n}\n.tk-button-secondary:hover {\n  background: color-mix(in srgb, var(--tk-soft), var(--tk-primary) 12%);\n}\n.tk-button-outline {\n  background: var(--tk-bg);\n  border-color: var(--tk-border);\n  color: var(--tk-fg);\n}\n.tk-button-outline:hover,\n.tk-button-ghost:hover {\n  background: var(--tk-surface);\n  border-color: var(--tk-border);\n}\n.tk-button-ghost {\n  background: transparent;\n  color: var(--tk-fg);\n}\n.tk-button-danger {\n  background: var(--tk-danger);\n  color: var(--tk-bg);\n}\n.tk-button-danger:hover {\n  filter: brightness(0.9);\n}\n.tk-button:disabled {\n  opacity: 0.45;\n  cursor: not-allowed;\n  pointer-events: auto;\n}\n.tk-field {\n  display: grid;\n  gap: 7px;\n  min-width: 0;\n  font-size: 13px;\n}\n.tk-label {\n  font-weight: 500;\n  display: block;\n}\n.tk-label em {\n  color: var(--tk-danger);\n  font-style: normal;\n}\n.tk-input {\n  width: 100%;\n  background: var(--tk-bg);\n  color: var(--tk-fg);\n  border: 1px solid var(--tk-border);\n  border-radius: var(--tk-radius);\n  min-height: 42px;\n  box-shadow: none;\n  padding: 10px 12px;\n  line-height: 1.5;\n  font-family: inherit;\n  font-size: 14px;\n  transition:\n    border-color 0.15s,\n    box-shadow 0.15s;\n}\n.tk-input::placeholder {\n  color: var(--tk-muted);\n}\n.tk-input:hover:not(:disabled) {\n  border-color: var(--tk-muted);\n}\n.tk-input:focus-visible {\n  border-color: var(--tk-primary);\n  outline: none;\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--tk-primary), transparent 85%);\n}\n.tk-input[aria-invalid=\"true\"] {\n  border-color: var(--tk-danger);\n}\n.tk-field-hint,\n.tk-field-error {\n  font-size: 12px;\n  line-height: 1.6;\n}\n.tk-field-hint {\n  color: var(--tk-muted);\n}\n.tk-field-error {\n  color: var(--tk-danger);\n}\n.tk-textarea {\n  resize: vertical;\n  min-height: 110px;\n}\n.tk-field-counter {\n  text-align: end;\n  color: var(--tk-muted);\n  font-size: 12px;\n}\n.tk-select-menu {\n  border-color: var(--tk-border);\n  border-radius: var(--tk-radius);\n  padding: 4px;\n}\n.tk-select-menu [data-slot=\"select-item\"] {\n  padding-inline-start: 30px;\n  padding-inline-end: 12px;\n  min-height: 38px;\n  border-radius: var(--tk-radius);\n  font-family: inherit;\n}\n.tk-select-menu [data-slot=\"select-item-indicator\"] {\n  inset-inline-start: 8px;\n  inset-inline-end: auto;\n}\n.tk-choice {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  cursor: pointer;\n  font-size: 13px;\n  color: var(--tk-fg);\n}\n.tk-choice > span {\n  display: grid;\n  gap: 2px;\n}\n.tk-choice:has(:disabled) {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n.tk-checkbox {\n  width: 19px;\n  height: 19px;\n  min-width: 19px;\n  border-color: var(--tk-border);\n  border-radius: 4px;\n  box-shadow: none;\n  background: var(--tk-bg);\n}\n.tk-checkbox[data-state=\"checked\"],\n.tk-checkbox[data-state=\"indeterminate\"] {\n  background: var(--tk-primary);\n  color: var(--tk-on-primary);\n  border-color: var(--tk-primary);\n}\n.tk-switch {\n  height: 23px;\n  width: 41px;\n  background: var(--tk-border);\n  border: 2px solid transparent;\n  box-shadow: none;\n}\n.tk-switch[data-state=\"checked\"] {\n  background: var(--tk-primary);\n}\n.tk-switch [data-slot=\"switch-thumb\"] {\n  height: 17px;\n  width: 17px;\n  background: white;\n  transform: translateX(0);\n  transition: transform 0.15s;\n}\n.tk-switch [data-slot=\"switch-thumb\"][data-state=\"checked\"] {\n  transform: translateX(17px);\n}\n.tk-badge {\n  border-radius: 4px;\n  border: 1px solid color-mix(in srgb, currentColor, transparent 82%);\n  padding: 3px 8px;\n  font-family: inherit;\n  font-size: 11px;\n  font-weight: 500;\n  line-height: 1.5;\n  white-space: nowrap;\n}\n.tk-tone-primary {\n  color: var(--tk-primary);\n  background: var(--tk-soft);\n}\n.tk-tone-success {\n  color: var(--tk-success);\n  background: var(--tk-success-bg);\n}\n.tk-tone-warning {\n  color: var(--tk-warning);\n  background: var(--tk-warning-bg);\n}\n.tk-tone-danger {\n  color: var(--tk-danger);\n  background: var(--tk-danger-bg);\n}\n.tk-tone-info {\n  color: var(--tk-info);\n  background: var(--tk-info-bg);\n}\n.tk-tone-neutral {\n  color: var(--tk-muted);\n  background: var(--tk-surface);\n}\n.tk-alert {\n  display: flex;\n  align-items: flex-start;\n  gap: 12px;\n  border: 1px solid color-mix(in srgb, currentColor, transparent 78%);\n  border-radius: var(--tk-radius);\n  padding: 16px;\n  text-align: start;\n}\n.tk-alert > svg {\n  position: static;\n  width: 20px;\n  height: 20px;\n  flex-shrink: 0;\n  margin-top: 2px;\n  transform: none;\n  color: inherit;\n}\n.tk-alert > div {\n  min-width: 0;\n}\n.tk-alert-title {\n  color: inherit;\n  font-size: 14px;\n  font-weight: 600;\n  line-height: 1.6;\n}\n.tk-alert-description {\n  display: block;\n  color: inherit;\n  opacity: 0.9;\n  font-size: 12px;\n  line-height: 1.8;\n  margin-top: 4px;\n}\n.tk-card {\n  background: var(--tk-bg);\n  color: var(--tk-fg);\n  border: 1px solid var(--tk-border);\n  border-radius: var(--tk-radius);\n  box-shadow: none;\n  gap: 18px;\n  padding: 22px;\n}\n.tk-card [data-slot=\"card-header\"],\n.tk-card [data-slot=\"card-content\"],\n.tk-card [data-slot=\"card-footer\"] {\n  padding: 0;\n}\n.tk-card-title {\n  font-size: 17px;\n  font-weight: 600;\n  line-height: 1.6;\n}\n.tk-card [data-slot=\"card-description\"] {\n  color: var(--tk-muted);\n  font-size: 13px;\n  line-height: 1.8;\n}\n.tk-card-footer {\n  padding-top: 16px !important;\n  border-top: 1px solid var(--tk-border);\n}\n.tk-tabs {\n  gap: 20px;\n}\n.tk-tabs-list {\n  background: transparent;\n  border-bottom: 1px solid var(--tk-border);\n  border-radius: 0;\n  width: 100%;\n  height: auto;\n  justify-content: flex-start;\n  padding: 0;\n  gap: 24px;\n}\n.tk-tab {\n  height: auto;\n  min-height: 42px;\n  flex: 0 0 auto;\n  background: transparent;\n  border: 0;\n  border-bottom: 3px solid transparent;\n  border-radius: 0;\n  padding: 8px 0;\n  color: var(--tk-muted);\n  font-family: inherit;\n  box-shadow: none !important;\n  font-size: 13px;\n}\n.tk-tab[data-state=\"active\"] {\n  background: transparent;\n  color: var(--tk-primary);\n  border-color: var(--tk-primary);\n}\n.tk-tab-content {\n  font-size: 14px;\n  line-height: 1.8;\n}\n.tk-accordion [data-slot=\"accordion-item\"] {\n  border-color: var(--tk-border);\n}\n.tk-accordion-trigger {\n  padding: 17px 0;\n  gap: 12px;\n  font-size: 14px;\n  text-align: start;\n  font-weight: 500;\n}\n.tk-accordion-content {\n  color: var(--tk-muted);\n  font-size: 13px;\n  line-height: 1.9;\n}\n.tk-dialog {\n  border: 1px solid var(--tk-border);\n  border-radius: var(--tk-radius);\n  padding: 28px;\n  gap: 14px;\n}\n.tk-dialog-close {\n  position: absolute;\n  inset-inline-end: 16px;\n  top: 14px;\n  padding: 6px;\n  cursor: pointer;\n  border-radius: 4px;\n}\n.tk-progress {\n  height: 7px;\n  background: var(--tk-border);\n  border-radius: 100px;\n}\n.tk-progress [data-slot=\"progress-indicator\"] {\n  background: var(--tk-primary);\n  transition: transform 0.25s;\n}\n.tk-progress-label {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  margin-bottom: 9px;\n  font-size: 13px;\n}\n.tk-breadcrumb {\n  font-size: 12px;\n  color: var(--tk-muted);\n}\n.tk-breadcrumb a:hover {\n  color: var(--tk-primary);\n}\n.tk-breadcrumb [aria-current] {\n  color: var(--tk-fg);\n  font-weight: 500;\n}\n.tk-pagination {\n  margin: 0;\n  width: auto;\n}\n.tk-pagination ul {\n  gap: 4px;\n}\n.tk-pagination .tk-button {\n  padding: 4px 9px;\n  min-width: 32px;\n}\n.tk-page-gap {\n  padding: 0 5px;\n  color: var(--tk-muted);\n}\n.tk-data-table {\n  width: 100%;\n  font-size: 13px;\n}\n.tk-data-table table {\n  width: 100%;\n  font-size: 13px;\n}\n.tk-data-table th,\n.tk-data-table td {\n  text-align: start;\n  padding: 13px 15px;\n  border-color: var(--tk-border);\n  white-space: nowrap;\n}\n.tk-data-table tr {\n  border-color: var(--tk-border);\n}\n.tk-data-table thead {\n  background: var(--tk-surface);\n  color: var(--tk-muted);\n}\n.tk-data-table tbody tr:hover {\n  background: var(--tk-surface);\n}\n.tk-sort-button {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  cursor: pointer;\n  width: 100%;\n  font-weight: 500;\n}\n.tk-table-search {\n  position: relative;\n  margin-bottom: 18px;\n  max-width: 320px;\n}\n.tk-table-search > svg {\n  position: absolute;\n  inset-inline-start: 12px;\n  top: 41px;\n  color: var(--tk-muted);\n}\n.tk-table-search .tk-input {\n  padding-inline-start: 38px;\n}\n.tk-table-footer {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  gap: 12px;\n  margin-top: 18px;\n  flex-wrap: wrap;\n}\n.tk-empty {\n  padding: 40px 16px;\n  text-align: center;\n  color: var(--tk-muted);\n}\n.tk-service-card {\n  height: 100%;\n  gap: 20px;\n}\n.tk-service-icon {\n  display: grid;\n  place-items: center;\n  width: 42px;\n  height: 42px;\n  color: var(--tk-primary);\n  background: var(--tk-soft);\n  border-radius: 50%;\n  margin-bottom: 14px;\n}\n.tk-service-card [data-slot=\"card-content\"] {\n  display: grid;\n  gap: 15px;\n}\n.tk-service-duration {\n  display: flex;\n  align-items: center;\n  gap: 7px;\n  color: var(--tk-muted);\n  font-size: 12px;\n}\n.tk-service-action {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  color: var(--tk-primary);\n  font-size: 13px;\n  font-weight: 600;\n  padding: 8px 0;\n}\n.tk-service-action:hover {\n  text-decoration: underline;\n  text-underline-offset: 4px;\n}\n.tk-upload {\n  border: 1px dashed var(--tk-border);\n  border-radius: var(--tk-radius);\n  background: var(--tk-surface);\n  padding: 22px;\n  text-align: center;\n  display: grid;\n  gap: 10px;\n  justify-items: center;\n}\n.tk-upload.is-dragging {\n  border-color: var(--tk-primary);\n  background: var(--tk-soft);\n}\n.tk-upload > svg {\n  color: var(--tk-primary);\n}\n.tk-upload-button {\n  font-size: 13px;\n  cursor: pointer;\n  color: var(--tk-primary);\n  font-weight: 600;\n  text-decoration: underline;\n  text-underline-offset: 4px;\n}\n.tk-file {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n  border: 1px solid var(--tk-border);\n  padding: 10px;\n  border-radius: var(--tk-radius);\n  font-size: 12px;\n  min-width: 0;\n}\n.tk-file > span {\n  flex: 1;\n  overflow-wrap: anywhere;\n}\n.tk-file button {\n  padding: 5px;\n  color: var(--tk-danger);\n  cursor: pointer;\n}\n.tk-file-list {\n  display: grid;\n  gap: 8px;\n}\n.tk-upload input:focus-visible + label {\n  outline: 2px solid var(--tk-primary);\n}\n.tk-block {\n  padding: 28px;\n  display: grid;\n  gap: 26px;\n}\n.tk-block-header {\n  display: grid;\n  gap: 12px;\n}\n.tk-block-grid {\n  display: grid;\n  grid-template-columns: repeat(3, minmax(0, 1fr));\n  gap: 18px;\n}\n.tk-block-split {\n  display: grid;\n  grid-template-columns: minmax(0, 1.6fr) minmax(230px, 1fr);\n  gap: 24px;\n}\n.tk-block-stats {\n  display: grid;\n  grid-template-columns: repeat(3, minmax(0, 1fr));\n  gap: 14px;\n}\n.tk-stat-value {\n  display: block;\n  font-size: 28px;\n  font-weight: 600;\n  margin-top: 8px;\n}\n.tk-stepper {\n  display: flex;\n  gap: 12px;\n  align-items: center;\n  justify-content: space-between;\n}\n.tk-stepper li {\n  display: flex;\n  gap: 8px;\n  align-items: center;\n  color: var(--tk-muted);\n  font-size: 12px;\n}\n.tk-stepper li[aria-current=\"step\"] {\n  color: var(--tk-primary);\n  font-weight: 600;\n}\n.tk-stepper span {\n  width: 28px;\n  height: 28px;\n  display: grid;\n  place-items: center;\n  border: 1px solid var(--tk-border);\n  border-radius: 50%;\n}\n.tk-stepper li[aria-current=\"step\"] span {\n  background: var(--tk-primary);\n  color: var(--tk-on-primary);\n  border-color: var(--tk-primary);\n}\n.tk-review {\n  display: grid;\n  gap: 12px;\n}\n.tk-review > div {\n  display: flex;\n  justify-content: space-between;\n  border-bottom: 1px solid var(--tk-border);\n  gap: 20px;\n  padding-bottom: 10px;\n}\n.tk-review dt {\n  color: var(--tk-muted);\n  font-size: 13px;\n}\n.tk-review dd {\n  font-size: 13px;\n  overflow-wrap: anywhere;\n  text-align: end;\n}\n.tk-block-note {\n  font-size: 12px;\n  color: var(--tk-muted);\n  line-height: 1.8;\n}\n.tk-services-filter {\n  display: flex;\n  align-items: end;\n  gap: 12px;\n  flex-wrap: wrap;\n}\n.tk-services-filter > .tk-field {\n  flex: 1;\n  min-width: 180px;\n}\n@container kit-preview (max-width:620px) {\n  .tk-block-grid,\n  .tk-block-split {\n    grid-template-columns: 1fr;\n  }\n  .tk-block {\n    padding: 20px;\n  }\n  .tk-block-stats {\n    gap: 8px;\n  }\n  .tk-block-stats .tk-card {\n    padding: 14px;\n  }\n  .tk-stat-value {\n    font-size: 23px;\n  }\n  .tk-stepper li {\n    gap: 5px;\n    font-size: 11px;\n  }\n}\n@media (max-width: 600px) {\n  .tk-block-grid,\n  .tk-block-split {\n    grid-template-columns: 1fr;\n  }\n  .tk-block {\n    padding: 18px;\n  }\n  .tk-card {\n    padding: 18px;\n  }\n  .tk-block-stats {\n    gap: 8px;\n  }\n  .tk-block-stats .tk-card {\n    padding: 12px;\n  }\n  .tk-stat-value {\n    font-size: 23px;\n  }\n  .tk-stepper li {\n    gap: 4px;\n    font-size: 11px;\n  }\n  .tk-stepper {\n    gap: 6px;\n  }\n}\n@media (prefers-reduced-motion: reduce) {\n  .tk-scope *,\n  .tk-scope *::before,\n  .tk-scope *::after {\n    animation-duration: 0.01ms !important;\n    transition-duration: 0.01ms !important;\n    scroll-behavior: auto !important;\n  }\n}\n.tk-between {\n  display: flex;\n  align-items: center;\n  gap: 10px;\n}\n.tk-progress-wrap {\n  gap: 9px;\n}\n.tk-card header .tk-muted {\n  margin-top: 6px;\n}\n.tk-card > .tk-muted {\n  font-size: 13px;\n  line-height: 1.9;\n}\n.tk-choice .tk-field-hint {\n  display: block;\n}\n.tk-card-footer .tk-button {\n  width: 100%;\n}\n"
    },
    {
      "path": "registry/tirazkit/card.tsx",
      "type": "registry:component",
      "target": "@components/tirazkit/card.tsx",
      "content": "import type { ReactNode } from \"react\";\nimport { Card as BaseCard } from \"./primitives/card\";\nimport \"./tirazkit.css\";\nexport function Card({\n  title,\n  description,\n  footer,\n  children,\n  className = \"\",\n}: {\n  title?: string;\n  description?: string;\n  footer?: ReactNode;\n  children?: ReactNode;\n  className?: string;\n}) {\n  return (\n    <BaseCard className={`tk-card ${className}`}>\n      {title || description ? (\n        <header>\n          {title ? <h3 className=\"tk-card-title\">{title}</h3> : null}\n          {description ? <p className=\"tk-muted\">{description}</p> : null}\n        </header>\n      ) : null}\n      {children}\n      {footer ? <footer className=\"tk-card-footer\">{footer}</footer> : null}\n    </BaseCard>\n  );\n}\n"
    },
    {
      "path": "components/ui/card.tsx",
      "type": "registry:component",
      "target": "@components/tirazkit/primitives/card.tsx",
      "content": "// MIT License. Copyright (c) 2023 shadcn. See LICENSE.txt.\nimport * as React from \"react\"\n\nimport { cn } from \"../utils\"\n\nfunction Card({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card\"\n      className={cn(\n        \"flex flex-col gap-6 rounded-xl border bg-card py-6 text-card-foreground shadow-sm\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction CardHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-header\"\n      className={cn(\n        \"@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-2 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction CardTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-title\"\n      className={cn(\"leading-none font-semibold\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction CardDescription({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-description\"\n      className={cn(\"text-sm text-muted-foreground\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction CardAction({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-action\"\n      className={cn(\n        \"col-start-2 row-span-2 row-start-1 self-start justify-self-end\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction CardContent({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-content\"\n      className={cn(\"px-6\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction CardFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"card-footer\"\n      className={cn(\"flex items-center px-6 [.border-t]:pt-6\", className)}\n      {...props}\n    />\n  )\n}\n\nexport {\n  Card,\n  CardHeader,\n  CardFooter,\n  CardTitle,\n  CardAction,\n  CardDescription,\n  CardContent,\n}\n"
    },
    {
      "path": "lib/utils.ts",
      "type": "registry:component",
      "target": "@components/tirazkit/utils.ts",
      "content": "import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]): string {\n  return twMerge(clsx(inputs));\n}\n"
    },
    {
      "path": "registry/tirazkit/button.tsx",
      "type": "registry:component",
      "target": "@components/tirazkit/button.tsx",
      "content": "\"use client\";\nimport type { ComponentProps } from \"react\";\nimport { Button as BaseButton } from \"./primitives/button\";\nimport { LoaderCircle } from \"lucide-react\";\nimport \"./tirazkit.css\";\nexport function Button({\n  variant = \"primary\",\n  size = \"md\",\n  loading = false,\n  className = \"\",\n  children,\n  disabled,\n  type = \"button\",\n  ...props\n}: Omit<ComponentProps<typeof BaseButton>, \"variant\" | \"size\"> & {\n  variant?: \"primary\" | \"secondary\" | \"outline\" | \"ghost\" | \"danger\";\n  size?: \"sm\" | \"md\" | \"lg\";\n  loading?: boolean;\n}) {\n  return (\n    <BaseButton\n      {...props}\n      type={type}\n      disabled={disabled || loading}\n      aria-busy={loading || undefined}\n      className={`tk-button tk-button-${variant} tk-button-${size} ${className}`}\n    >\n      {loading ? <LoaderCircle className=\"tk-spin\" aria-hidden=\"true\" /> : null}\n      {children}\n    </BaseButton>\n  );\n}\n"
    },
    {
      "path": "components/ui/button.tsx",
      "type": "registry:component",
      "target": "@components/tirazkit/primitives/button.tsx",
      "content": "// MIT License. Copyright (c) 2023 shadcn. See LICENSE.txt.\nimport * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { Slot } from \"radix-ui\"\n\nimport { cn } from \"../utils\"\n\nconst buttonVariants = cva(\n  \"inline-flex shrink-0 items-center justify-center gap-2 rounded-md text-sm font-medium whitespace-nowrap transition-all outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-primary text-primary-foreground hover:bg-primary/90\",\n        destructive:\n          \"bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:bg-destructive/60 dark:focus-visible:ring-destructive/40\",\n        outline:\n          \"border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50\",\n        secondary:\n          \"bg-secondary text-secondary-foreground hover:bg-secondary/80\",\n        ghost:\n          \"hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50\",\n        link: \"text-primary underline-offset-4 hover:underline\",\n      },\n      size: {\n        default: \"h-9 px-4 py-2 has-[>svg]:px-3\",\n        xs: \"h-6 gap-1 rounded-md px-2 text-xs has-[>svg]:px-1.5 [&_svg:not([class*='size-'])]:size-3\",\n        sm: \"h-8 gap-1.5 rounded-md px-3 has-[>svg]:px-2.5\",\n        lg: \"h-10 rounded-md px-6 has-[>svg]:px-4\",\n        icon: \"size-9\",\n        \"icon-xs\": \"size-6 rounded-md [&_svg:not([class*='size-'])]:size-3\",\n        \"icon-sm\": \"size-8\",\n        \"icon-lg\": \"size-10\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n    },\n  }\n)\n\nfunction Button({\n  className,\n  variant = \"default\",\n  size = \"default\",\n  asChild = false,\n  ...props\n}: React.ComponentProps<\"button\"> &\n  VariantProps<typeof buttonVariants> & {\n    asChild?: boolean\n  }) {\n  const Comp = asChild ? Slot.Root : \"button\"\n\n  return (\n    <Comp\n      data-slot=\"button\"\n      data-variant={variant}\n      data-size={size}\n      className={cn(buttonVariants({ variant, size, className }))}\n      {...props}\n    />\n  )\n}\n\nexport { Button, buttonVariants }\n"
    },
    {
      "path": "registry/tirazkit/badge.tsx",
      "type": "registry:component",
      "target": "@components/tirazkit/badge.tsx",
      "content": "import type { HTMLAttributes } from \"react\";\nimport { Badge as BaseBadge } from \"./primitives/badge\";\nimport \"./tirazkit.css\";\nexport function Badge({\n  tone = \"primary\",\n  className = \"\",\n  ...props\n}: HTMLAttributes<HTMLSpanElement> & {\n  tone?: \"primary\" | \"success\" | \"warning\" | \"danger\" | \"neutral\";\n}) {\n  return (\n    <BaseBadge {...props} className={`tk-badge tk-tone-${tone} ${className}`} />\n  );\n}\n"
    },
    {
      "path": "components/ui/badge.tsx",
      "type": "registry:component",
      "target": "@components/tirazkit/primitives/badge.tsx",
      "content": "// MIT License. Copyright (c) 2023 shadcn. See LICENSE.txt.\nimport * as React from \"react\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { Slot } from \"radix-ui\"\n\nimport { cn } from \"../utils\"\n\nconst badgeVariants = cva(\n  \"inline-flex w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-full border border-transparent px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none [&>svg]:size-3\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-primary text-primary-foreground [a&]:hover:bg-primary/90\",\n        secondary:\n          \"bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90\",\n        destructive:\n          \"bg-destructive text-white focus-visible:ring-destructive/20 dark:bg-destructive/60 dark:focus-visible:ring-destructive/40 [a&]:hover:bg-destructive/90\",\n        outline:\n          \"border-border text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground\",\n        ghost: \"[a&]:hover:bg-accent [a&]:hover:text-accent-foreground\",\n        link: \"text-primary underline-offset-4 [a&]:hover:underline\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  }\n)\n\nfunction Badge({\n  className,\n  variant = \"default\",\n  asChild = false,\n  ...props\n}: React.ComponentProps<\"span\"> &\n  VariantProps<typeof badgeVariants> & { asChild?: boolean }) {\n  const Comp = asChild ? Slot.Root : \"span\"\n\n  return (\n    <Comp\n      data-slot=\"badge\"\n      data-variant={variant}\n      className={cn(badgeVariants({ variant }), className)}\n      {...props}\n    />\n  )\n}\n\nexport { Badge, badgeVariants }\n"
    },
    {
      "path": "registry/tirazkit/breadcrumb.tsx",
      "type": "registry:component",
      "target": "@components/tirazkit/breadcrumb.tsx",
      "content": "\"use client\";\nimport { Fragment } from \"react\";\nimport { ChevronLeft, ChevronRight } from \"lucide-react\";\nimport {\n  Breadcrumb as BaseBreadcrumb,\n  BreadcrumbList,\n  BreadcrumbItem,\n  BreadcrumbLink,\n  BreadcrumbPage,\n  BreadcrumbSeparator,\n} from \"./primitives/breadcrumb\";\nimport { useKit } from \"./theme\";\nexport function Breadcrumb({\n  items,\n}: {\n  items: { label: string; href?: string }[];\n}) {\n  const { locale } = useKit();\n  const Icon = locale === \"ar\" ? ChevronLeft : ChevronRight;\n  return (\n    <BaseBreadcrumb aria-label={locale === \"ar\" ? \"مسار التنقل\" : \"Breadcrumb\"}>\n      <BreadcrumbList className=\"tk-breadcrumb\">\n        {items.map((item, i) => (\n          <Fragment key={`${item.label}-${i}`}>\n            {i ? (\n              <BreadcrumbSeparator>\n                <Icon size={14} aria-hidden=\"true\" />\n              </BreadcrumbSeparator>\n            ) : null}\n            <BreadcrumbItem>\n              {item.href && i < items.length - 1 ? (\n                <BreadcrumbLink href={item.href}>{item.label}</BreadcrumbLink>\n              ) : (\n                <BreadcrumbPage>{item.label}</BreadcrumbPage>\n              )}\n            </BreadcrumbItem>\n          </Fragment>\n        ))}\n      </BreadcrumbList>\n    </BaseBreadcrumb>\n  );\n}\n"
    },
    {
      "path": "components/ui/breadcrumb.tsx",
      "type": "registry:component",
      "target": "@components/tirazkit/primitives/breadcrumb.tsx",
      "content": "// MIT License. Copyright (c) 2023 shadcn. See LICENSE.txt.\nimport * as React from \"react\"\nimport { ChevronRight, MoreHorizontal } from \"lucide-react\"\nimport { Slot } from \"radix-ui\"\n\nimport { cn } from \"../utils\"\n\nfunction Breadcrumb({ ...props }: React.ComponentProps<\"nav\">) {\n  return <nav aria-label=\"breadcrumb\" data-slot=\"breadcrumb\" {...props} />\n}\n\nfunction BreadcrumbList({ className, ...props }: React.ComponentProps<\"ol\">) {\n  return (\n    <ol\n      data-slot=\"breadcrumb-list\"\n      className={cn(\n        \"flex flex-wrap items-center gap-1.5 text-sm break-words text-muted-foreground sm:gap-2.5\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction BreadcrumbItem({ className, ...props }: React.ComponentProps<\"li\">) {\n  return (\n    <li\n      data-slot=\"breadcrumb-item\"\n      className={cn(\"inline-flex items-center gap-1.5\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction BreadcrumbLink({\n  asChild,\n  className,\n  ...props\n}: React.ComponentProps<\"a\"> & {\n  asChild?: boolean\n}) {\n  const Comp = asChild ? Slot.Root : \"a\"\n\n  return (\n    <Comp\n      data-slot=\"breadcrumb-link\"\n      className={cn(\"transition-colors hover:text-foreground\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction BreadcrumbPage({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      data-slot=\"breadcrumb-page\"\n      role=\"link\"\n      aria-disabled=\"true\"\n      aria-current=\"page\"\n      className={cn(\"font-normal text-foreground\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction BreadcrumbSeparator({\n  children,\n  className,\n  ...props\n}: React.ComponentProps<\"li\">) {\n  return (\n    <li\n      data-slot=\"breadcrumb-separator\"\n      role=\"presentation\"\n      aria-hidden=\"true\"\n      className={cn(\"[&>svg]:size-3.5\", className)}\n      {...props}\n    >\n      {children ?? <ChevronRight />}\n    </li>\n  )\n}\n\nfunction BreadcrumbEllipsis({\n  className,\n  ...props\n}: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      data-slot=\"breadcrumb-ellipsis\"\n      role=\"presentation\"\n      aria-hidden=\"true\"\n      className={cn(\"flex size-9 items-center justify-center\", className)}\n      {...props}\n    >\n      <MoreHorizontal className=\"size-4\" />\n      <span className=\"sr-only\">More</span>\n    </span>\n  )\n}\n\nexport {\n  Breadcrumb,\n  BreadcrumbList,\n  BreadcrumbItem,\n  BreadcrumbLink,\n  BreadcrumbPage,\n  BreadcrumbSeparator,\n  BreadcrumbEllipsis,\n}\n"
    },
    {
      "path": "registry/tirazkit/accordion.tsx",
      "type": "registry:component",
      "target": "@components/tirazkit/accordion.tsx",
      "content": "\"use client\";\nimport type { ReactNode } from \"react\";\nimport {\n  Accordion as BaseAccordion,\n  AccordionContent,\n  AccordionItem,\n  AccordionTrigger,\n} from \"./primitives/accordion\";\nimport \"./tirazkit.css\";\nexport function Accordion({\n  items,\n}: {\n  items: { value: string; title: string; content: ReactNode }[];\n}) {\n  return (\n    <BaseAccordion type=\"single\" collapsible className=\"tk-accordion\">\n      {items.map((item) => (\n        <AccordionItem key={item.value} value={item.value}>\n          <AccordionTrigger className=\"tk-accordion-trigger\">\n            {item.title}\n          </AccordionTrigger>\n          <AccordionContent className=\"tk-accordion-content\">\n            {item.content}\n          </AccordionContent>\n        </AccordionItem>\n      ))}\n    </BaseAccordion>\n  );\n}\n"
    },
    {
      "path": "components/ui/accordion.tsx",
      "type": "registry:component",
      "target": "@components/tirazkit/primitives/accordion.tsx",
      "content": "// MIT License. Copyright (c) 2023 shadcn. See LICENSE.txt.\n\"use client\"\n\nimport * as React from \"react\"\nimport { ChevronDownIcon } from \"lucide-react\"\nimport { Accordion as AccordionPrimitive } from \"radix-ui\"\n\nimport { cn } from \"../utils\"\n\nfunction Accordion({\n  ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Root>) {\n  return <AccordionPrimitive.Root data-slot=\"accordion\" {...props} />\n}\n\nfunction AccordionItem({\n  className,\n  ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Item>) {\n  return (\n    <AccordionPrimitive.Item\n      data-slot=\"accordion-item\"\n      className={cn(\"border-b last:border-b-0\", className)}\n      {...props}\n    />\n  )\n}\n\nfunction AccordionTrigger({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Trigger>) {\n  return (\n    <AccordionPrimitive.Header className=\"flex\">\n      <AccordionPrimitive.Trigger\n        data-slot=\"accordion-trigger\"\n        className={cn(\n          \"flex flex-1 items-start justify-between gap-4 rounded-md py-4 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 [&[data-state=open]>svg]:rotate-180\",\n          className\n        )}\n        {...props}\n      >\n        {children}\n        <ChevronDownIcon className=\"pointer-events-none size-4 shrink-0 translate-y-0.5 text-muted-foreground transition-transform duration-200\" />\n      </AccordionPrimitive.Trigger>\n    </AccordionPrimitive.Header>\n  )\n}\n\nfunction AccordionContent({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof AccordionPrimitive.Content>) {\n  return (\n    <AccordionPrimitive.Content\n      data-slot=\"accordion-content\"\n      className=\"overflow-hidden text-sm data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down\"\n      {...props}\n    >\n      <div className={cn(\"pt-0 pb-4\", className)}>{children}</div>\n    </AccordionPrimitive.Content>\n  )\n}\n\nexport { Accordion, AccordionItem, AccordionTrigger, AccordionContent }\n"
    },
    {
      "path": "registry/tirazkit/LICENSE.txt",
      "type": "registry:file",
      "target": "@components/tirazkit/LICENSE.txt",
      "content": "MIT License\n\nCopyright (c) 2026 Tirazkit contributors\nCopyright (c) 2023 shadcn (included shadcn/ui primitives)\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.\n\nFonts are licensed separately under the SIL Open Font License in\npublic/fonts/OFL.txt. Lucide icons retain their package's ISC license.\nDGA names and marks are not licensed by this software license.\n"
    }
  ],
  "categories": [
    "tirazkit"
  ],
  "docs": "Wrap components with <Theme theme=\"dga\" locale=\"ar\">. Includes four themes. Requires React 19, Tailwind CSS 4, and a shadcn-initialized project. Font inherits from your app. See /docs/installation. DGA-inspired independent implementation; not certified."
}