{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "theme",
  "type": "registry:theme",
  "title": "Blinkist Theme",
  "description": "A base theme with Blinkist design system colors and font installed",
  "dependencies": [
    "tailwindcss"
  ],
  "files": [
    {
      "path": "tailwind.config.ts",
      "content": "import type { Config } from \"tailwindcss\"\nimport { fontFamily } from \"tailwindcss/defaultTheme\"\n\nconst config: Config = {\n  darkMode: [\"class\"],\n  content: [\n    \"./pages/**/*.{ts,tsx}\",\n    \"./components/**/*.{ts,tsx}\",\n    \"./app/**/*.{ts,tsx}\",\n    \"./src/**/*.{ts,tsx}\",\n    \"*.{js,ts,jsx,tsx,mdx}\",\n  ],\n  theme: {\n    container: {\n      center: true,\n      padding: \"2rem\",\n      screens: {\n        \"2xl\": \"1400px\",\n      },\n    },\n    extend: {\n      colors: {\n        border: \"hsl(var(--border))\",\n        input: \"hsl(var(--input))\",\n        ring: \"hsl(var(--ring))\",\n        background: \"hsl(var(--background))\",\n        foreground: \"hsl(var(--foreground))\",\n        midnight: \"hsl(var(--midnight))\",\n        primary: {\n          DEFAULT: \"hsl(var(--primary))\",\n          foreground: \"hsl(var(--primary-foreground))\",\n        },\n        secondary: {\n          DEFAULT: \"hsl(var(--secondary))\",\n          foreground: \"hsl(var(--secondary-foreground))\",\n        },\n        destructive: {\n          DEFAULT: \"hsl(var(--destructive))\",\n          foreground: \"hsl(var(--destructive-foreground))\",\n        },\n        muted: {\n          DEFAULT: \"hsl(var(--muted))\",\n          foreground: \"hsl(var(--muted-foreground))\",\n        },\n        accent: {\n          DEFAULT: \"hsl(var(--accent))\",\n          foreground: \"hsl(var(--accent-foreground))\",\n        },\n        popover: {\n          DEFAULT: \"hsl(var(--popover))\",\n          foreground: \"hsl(var(--popover-foreground))\",\n        },\n        card: {\n          DEFAULT: \"hsl(var(--card))\",\n          foreground: \"hsl(var(--card-foreground))\",\n        },\n        blue: {\n          500: \"#0365F2\",\n          600: \"#0552BE\",\n        },\n        green: {\n          500: \"#00E87C\",\n          600: \"#00D472\",\n        },\n        gray: {\n          50: \"#F7F8F9\",\n          100: \"#F1F6F4\",\n          200: \"#E1E7EA\",\n          500: \"#6D787E\",\n          700: \"#3A4649\",\n        },\n        sidebar: {\n          bg: \"#F9F9FB\",\n        },\n      },\n      borderRadius: {\n        lg: \"var(--radius)\",\n        md: \"calc(var(--radius) - 2px)\",\n        sm: \"calc(var(--radius) - 4px)\",\n      },\n      fontFamily: {\n        sans: [\"CeraPRO\", ...fontFamily.sans],\n      },\n    },\n  },\n  plugins: [require(\"tailwindcss-animate\")],\n}\n\nexport default config\n",
      "type": "registry:file",
      "target": "tailwind.config.ts"
    },
    {
      "path": "app/globals.css",
      "content": "@tailwind base;\n@tailwind components;\n@tailwind utilities;\n\n@layer base {\n  :root {\n    --background: 0 0% 100%;\n    --foreground: 222.2 84% 4.9%;\n    --card: 0 0% 100%;\n    --card-foreground: 222.2 84% 4.9%;\n    --popover: 0 0% 100%;\n    --popover-foreground: 222.2 84% 4.9%;\n    --primary: 160 84% 39%;\n    --primary-foreground: 210 40% 98%;\n    --secondary: 210 40% 96.1%;\n    --secondary-foreground: 222.2 47.4% 11.2%;\n    --muted: 210 40% 96.1%;\n    --muted-foreground: 215.4 16.3% 46.9%;\n    --accent: 210 40% 96.1%;\n    --accent-foreground: 222.2 47.4% 11.2%;\n    --destructive: 0 84.2% 60.2%;\n    --destructive-foreground: 210 40% 98%;\n    --border: 214.3 31.8% 91.4%;\n    --input: 214.3 31.8% 91.4%;\n    --ring: 160 84% 39%;\n    --radius: 0.5rem;\n\n    /* Blinkist specific colors */\n    --midnight: 201.37 94.81% 15.10%;\n    --green: 160 84% 39%;\n    --blue: 214.29 100% 50%;\n    --search-bg: 150 20% 96%;\n    --search-text: 197 4% 58%;\n    --sidebar-bg: 240 100% 98%;\n  }\n\n  .dark {\n    --background: 222.2 84% 4.9%;\n    --foreground: 210 40% 98%;\n    --card: 222.2 84% 4.9%;\n    --card-foreground: 210 40% 98%;\n    --popover: 222.2 84% 4.9%;\n    --popover-foreground: 210 40% 98%;\n    --primary: 160 84% 39%;\n    --primary-foreground: 222.2 47.4% 11.2%;\n    --secondary: 217.2 32.6% 17.5%;\n    --secondary-foreground: 210 40% 98%;\n    --muted: 217.2 32.6% 17.5%;\n    --muted-foreground: 215 20.2% 65.1%;\n    --accent: 217.2 32.6% 17.5%;\n    --accent-foreground: 210 40% 98%;\n    --destructive: 0 62.8% 30.6%;\n    --destructive-foreground: 210 40% 98%;\n    --border: 217.2 32.6% 17.5%;\n    --input: 217.2 32.6% 17.5%;\n    --ring: 160 84% 39%;\n  }\n}\n\n@layer base {\n  * {\n    @apply border-border;\n  }\n  body {\n    @apply bg-background text-foreground;\n    font-family: \"CeraPRO\", sans-serif;\n    -webkit-font-smoothing: antialiased;\n  }\n\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6 {\n    @apply text-midnight;\n  }\n\n  /* Custom placeholder color */\n  ::placeholder {\n    color: rgb(142, 150, 154);\n    opacity: 1;\n  }\n}\n\n/* CeraPRO Font */\n@font-face {\n  font-display: swap;\n  font-family: \"CeraPRO\";\n  font-weight: 700;\n  src: url(\"https://static-cdn.blinkist.com/webfonts/323ED8_0_0.woff2\") format(\"woff2\"),\n    url(\"https://static-cdn.blinkist.com/webfonts/323ED8_0_0.woff\") format(\"woff\");\n}\n\n@font-face {\n  font-display: swap;\n  font-family: \"CeraPRO\";\n  font-weight: 500;\n  src: url(\"https://static-cdn.blinkist.com/webfonts/323ED8_1_0.woff2\") format(\"woff2\"),\n    url(\"https://static-cdn.blinkist.com/webfonts/323ED8_1_0.woff\") format(\"woff\");\n}\n\n@font-face {\n  font-display: swap;\n  font-family: \"CeraPRO\";\n  font-style: italic;\n  font-weight: 400;\n  src: url(\"https://static-cdn.blinkist.com/webfonts/323ED8_2_0.woff2\") format(\"woff2\"),\n    url(\"https://static-cdn.blinkist.com/webfonts/323ED8_2_0.woff\") format(\"woff\");\n}\n\n@font-face {\n  font-display: swap;\n  font-family: \"CeraPRO\";\n  font-weight: 400;\n  src: url(\"https://static-cdn.blinkist.com/webfonts/323ED8_3_0.woff2\") format(\"woff2\"),\n    url(\"https://static-cdn.blinkist.com/webfonts/323ED8_3_0.woff\") format(\"woff\");\n}\n\n/* Blinkist specific utility classes */\n.text-midnight {\n  color: hsl(var(--midnight));\n}\n\n.bg-green {\n  background-color: hsl(var(--green));\n}\n\n.bg-sidebar {\n  background-color: hsl(var(--sidebar-bg));\n}\n",
      "type": "registry:file",
      "target": "app/globals.css"
    },
    {
      "path": "app/layout.tsx",
      "content": "import type React from \"react\"\nimport type { Metadata } from \"next\"\nimport { Inter } from \"next/font/google\"\nimport \"./globals.css\"\n\nconst inter = Inter({ subsets: [\"latin\"] })\n\nexport const metadata: Metadata = {\n  title: \"Blinkist\",\n  description: \"Big ideas in small packages\",\n    generator: 'v0.dev'\n}\n\nexport default function RootLayout({\n  children,\n}: Readonly<{\n  children: React.ReactNode\n}>) {\n  return (\n    <html lang=\"en\">\n      <body className={inter.className}>{children}</body>\n    </html>\n  )\n}\n",
      "type": "registry:file",
      "target": "app/layout.tsx"
    },
    {
      "path": "lib/utils.ts",
      "content": "import { clsx, type ClassValue } from \"clsx\"\nimport { twMerge } from \"tailwind-merge\"\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs))\n}\n",
      "type": "registry:file",
      "target": "lib/utils.ts"
    },
    {
      "path": "hooks/use-mobile.tsx",
      "content": "import * as React from \"react\"\n\nconst MOBILE_BREAKPOINT = 768\n\nexport function useIsMobile() {\n  const [isMobile, setIsMobile] = React.useState<boolean | undefined>(undefined)\n\n  React.useEffect(() => {\n    const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`)\n    const onChange = () => {\n      setIsMobile(window.innerWidth < MOBILE_BREAKPOINT)\n    }\n    mql.addEventListener(\"change\", onChange)\n    setIsMobile(window.innerWidth < MOBILE_BREAKPOINT)\n    return () => mql.removeEventListener(\"change\", onChange)\n  }, [])\n\n  return !!isMobile\n}\n",
      "type": "registry:file",
      "target": "hooks/use-mobile.tsx"
    }
  ]
}