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