type breakpoint = [ `Sm | `Md | `Lg | `Xl | `Xl2 ]
type container_size = [ `Xs | `Sm | `Md | `Lg | `Xl | `Xl2 | `Xl3 | `Xl4 | `Xl5 | `Xl6 | `Xl7 ]
type media_feature = [ `Dark | `Light | `Motion_safe | `Motion_reduce | `Contrast_more | `Contrast_less | `Portrait | `Landscape | `Print | `Screen ]

type t = [
  | `At_breakpoint of breakpoint * Css.t
  | `Max_breakpoint of breakpoint * Css.t
  | `At_container of container_size * Css.t
  | `Media of media_feature * Css.t
  | `Container of [`Normal | `Size | `Inline_size] option
]

let to_class = function
  | `At_breakpoint (`Sm, classes) -> Css.make ("sm:" ^ Css.to_string classes)
  | `At_breakpoint (`Md, classes) -> Css.make ("md:" ^ Css.to_string classes)
  | `At_breakpoint (`Lg, classes) -> Css.make ("lg:" ^ Css.to_string classes)
  | `At_breakpoint (`Xl, classes) -> Css.make ("xl:" ^ Css.to_string classes)
  | `At_breakpoint (`Xl2, classes) -> Css.make ("2xl:" ^ Css.to_string classes)
  | `Max_breakpoint (`Sm, classes) -> Css.make ("max-sm:" ^ Css.to_string classes)
  | `Max_breakpoint (`Md, classes) -> Css.make ("max-md:" ^ Css.to_string classes)
  | `Max_breakpoint (`Lg, classes) -> Css.make ("max-lg:" ^ Css.to_string classes)
  | `Max_breakpoint (`Xl, classes) -> Css.make ("max-xl:" ^ Css.to_string classes)
  | `Max_breakpoint (`Xl2, classes) -> Css.make ("max-2xl:" ^ Css.to_string classes)
  | `Media (`Dark, classes) -> Css.make ("dark:" ^ Css.to_string classes)
  | `Media (`Light, classes) -> Css.make ("light:" ^ Css.to_string classes)
  | `Media (`Motion_safe, classes) -> Css.make ("motion-safe:" ^ Css.to_string classes)
  | `Media (`Motion_reduce, classes) -> Css.make ("motion-reduce:" ^ Css.to_string classes)
  | `Media (`Contrast_more, classes) -> Css.make ("contrast-more:" ^ Css.to_string classes)
  | `Media (`Contrast_less, classes) -> Css.make ("contrast-less:" ^ Css.to_string classes)
  | `Media (`Portrait, classes) -> Css.make ("portrait:" ^ Css.to_string classes)
  | `Media (`Landscape, classes) -> Css.make ("landscape:" ^ Css.to_string classes)
  | `Media (`Print, classes) -> Css.make ("print:" ^ Css.to_string classes)
  | `Media (`Screen, classes) -> Css.make ("screen:" ^ Css.to_string classes)
  | `Container None -> Css.make "container"
  | `Container (Some `Normal) -> Css.make "container"
  | `Container (Some `Size) -> Css.make "@container"
  | `Container (Some `Inline_size) -> Css.make "@container/inline-size"
  | `At_container (size, classes) ->
    let size_str = match size with
      | `Xs -> "@xs"
      | `Sm -> "@sm" 
      | `Md -> "@md"
      | `Lg -> "@lg"
      | `Xl -> "@xl"
      | `Xl2 -> "@2xl"
      | `Xl3 -> "@3xl"
      | `Xl4 -> "@4xl"
      | `Xl5 -> "@5xl"
      | `Xl6 -> "@6xl"
      | `Xl7 -> "@7xl"
    in
    Css.make (size_str ^ ":" ^ Css.to_string classes)

let at_breakpoint bp classes = `At_breakpoint (bp, classes)
let max_breakpoint bp classes = `Max_breakpoint (bp, classes)
let at_container size classes = `At_container (size, classes)
let media feature classes = `Media (feature, classes)
let container container_type = `Container container_type

let apply responsive_t classes = 
  Css.combine (to_class responsive_t) classes