/** @type {import('tailwindcss').Config} */

const merge = require("lodash/merge");
const defaultTheme = require("tailwindcss/defaultTheme");
const baseConfig = require("./tailwind.base.config.cjs");
const { fontSize, fontFamily, colors, screens } = require("./tokens.cjs").book;

module.exports = merge(baseConfig, {
  theme: {
    colors,
    screens,
    fontFamily: {
      display: [fontFamily.displaySans, ...defaultTheme.fontFamily.sans],
      body: [fontFamily.bodySans, ...defaultTheme.fontFamily.sans],
      branded: [fontFamily.displaySerif, ...defaultTheme.fontFamily.serif],
    },
    extend: {
      fontSize,
    },
  },
});