const defaultTheme = require("tailwindcss/defaultTheme");

module.exports = {
  content: [
    "./public/*.html",
    "./app/helpers/**/*.rb",
    "./app/javascript/**/*.js",
    "./app/views/**/*.{erb,haml,html,slim}",
  ],
  theme: {
    extend: {
      fontFamily: {
        sans: ["Inter var", ...defaultTheme.fontFamily.sans],
      },
      colors: {
        "hsrm-red": "#c20008",
        "hsrm-red-dark": "#af0007",
        "hsrm-red-light": "#e20009",
        "hsrm-gray": "#3a3a3a",
        "hsrm-gray-dark": "#212121",
        "hsrm-gray-light": "#4e4e4e",
        "status-open": "#111827", // gray-900
        "status-open-light": "#d1d5db", // gray-300
        "status-printing": "#713f12", // yellow-900
        "status-printing-light": "#fde047", // yellow-300
        "status-ready_for_pickup": "#365314", // lime-900
        "status-ready_for_pickup-light": "#bef264", // lime-300
        "status-paid": "#14532d", // green-900
        "status-paid-light": "#86efac", // green-300
        "status-canceled": "#7f1d1d", // red-900
        "status-canceled-light": "#fca5a5", // red-300
      },
    },
  },
  safelist: [
    "text-status-open",
    "bg-status-open-light",
    "text-status-printing",
    "bg-status-printing-light",
    "text-status-ready_for_pickup",
    "bg-status-ready_for_pickup-light",
    "text-status-paid",
    "bg-status-paid-light",
    "text-status-canceled",
    "bg-status-canceled-light",
  ],
  plugins: [
    require("@tailwindcss/forms"),
    require("@tailwindcss/typography"),
    require("@tailwindcss/container-queries"),
  ],
};