(** GADT-based Tailwind HTML library with heterogeneous lists *)

(** Color utilities *)
val blue : int -> Tailwind.Color.t
val gray : int -> Tailwind.Color.t  
val red : int -> Tailwind.Color.t
val green : int -> Tailwind.Color.t
val yellow : int -> Tailwind.Color.t
val indigo : int -> Tailwind.Color.t
val purple : int -> Tailwind.Color.t
val pink : int -> Tailwind.Color.t

(** Size utilities *)
val rem : float -> Tailwind.Size.t
val px : Tailwind.Size.t
val zero : Tailwind.Size.t
val auto : Tailwind.Size.t
val full : Tailwind.Size.t
val screen : Tailwind.Size.t

(** Text utility *)
val txt : string -> Htmlit.El.html

(** GADT for Tailwind properties with category types *)
type _ tw_prop = 
  | Text_color : Tailwind.Color.t -> [`Text_color] tw_prop
  | Bg_color : Tailwind.Color.t -> [`Bg_color] tw_prop
  | Font_size : Tailwind.Typography.font_size -> [`Font_size] tw_prop
  | Font_weight : Tailwind.Typography.font_weight -> [`Font_weight] tw_prop
  | Margin : Tailwind.Size.t -> [`Margin] tw_prop
  | Margin_x : Tailwind.Size.t -> [`Margin] tw_prop
  | Margin_y : Tailwind.Size.t -> [`Margin] tw_prop  
  | Margin_top : Tailwind.Size.t -> [`Margin] tw_prop
  | Margin_bottom : Tailwind.Size.t -> [`Margin] tw_prop
  | Margin_left : Tailwind.Size.t -> [`Margin] tw_prop
  | Margin_right : Tailwind.Size.t -> [`Margin] tw_prop
  | Padding : Tailwind.Size.t -> [`Padding] tw_prop
  | Padding_x : Tailwind.Size.t -> [`Padding] tw_prop
  | Padding_y : Tailwind.Size.t -> [`Padding] tw_prop
  | Width : Tailwind.Size.t -> [`Width] tw_prop
  | Height : Tailwind.Size.t -> [`Height] tw_prop
  | Max_width : Tailwind.Size.t -> [`Width] tw_prop
  | Min_height : Tailwind.Size.t -> [`Height] tw_prop
  | Display_flex : [`Layout] tw_prop
  | Display_grid : [`Layout] tw_prop
  | Display_block : [`Layout] tw_prop
  | Display_inline : [`Layout] tw_prop
  | Display_inline_block : [`Layout] tw_prop
  | Grid_cols : int -> [`Grid] tw_prop
  | Grid_rows : int -> [`Grid] tw_prop
  | Gap : Tailwind.Size.t -> [`Grid] tw_prop
  | Gap_x : Tailwind.Size.t -> [`Grid] tw_prop
  | Gap_y : Tailwind.Size.t -> [`Grid] tw_prop
  | Items_center : [`Layout] tw_prop
  | Items_start : [`Layout] tw_prop
  | Items_end : [`Layout] tw_prop
  | Justify_center : [`Layout] tw_prop
  | Justify_between : [`Layout] tw_prop
  | Justify_start : [`Layout] tw_prop
  | Justify_end : [`Layout] tw_prop
  | Flex_col : [`Layout] tw_prop
  | Flex_row : [`Layout] tw_prop
  | Text_center : [`Layout] tw_prop
  | Text_left : [`Layout] tw_prop
  | Text_right : [`Layout] tw_prop
  | Rounded : [< `Sm | `Md | `Lg | `Full ] -> [`Effects] tw_prop
  | Shadow : [< `Sm | `Md | `Lg ] -> [`Effects] tw_prop
  | Border : [`Effects] tw_prop
  | Border_color : Tailwind.Color.t -> [`Effects] tw_prop
  | Transition : [`Effects] tw_prop

(** Heterogeneous list *)
type tw_list = tw_list_item list
and tw_list_item = Any : 'a tw_prop -> tw_list_item

(** Convert heterogeneous list to Tailwind classes *)
val styles : tw_list -> Tailwind.t

(** Helper for HTML class attribute *)
val classes_attr : tw_list -> Htmlit.At.t

(** Helper constructors for convenient usage *)
val text_color : Tailwind.Color.t -> tw_list_item
val bg_color : Tailwind.Color.t -> tw_list_item
val font_size : Tailwind.Typography.font_size -> tw_list_item
val font_weight : Tailwind.Typography.font_weight -> tw_list_item
val margin : Tailwind.Size.t -> tw_list_item
val margin_x : Tailwind.Size.t -> tw_list_item
val margin_y : Tailwind.Size.t -> tw_list_item
val margin_top : Tailwind.Size.t -> tw_list_item
val margin_bottom : Tailwind.Size.t -> tw_list_item
val margin_left : Tailwind.Size.t -> tw_list_item
val margin_right : Tailwind.Size.t -> tw_list_item
val padding : Tailwind.Size.t -> tw_list_item
val padding_x : Tailwind.Size.t -> tw_list_item
val padding_y : Tailwind.Size.t -> tw_list_item
val width : Tailwind.Size.t -> tw_list_item
val height : Tailwind.Size.t -> tw_list_item
val max_width : Tailwind.Size.t -> tw_list_item
val min_height : Tailwind.Size.t -> tw_list_item
val flex : tw_list_item
val grid : tw_list_item
val block : tw_list_item
val inline : tw_list_item
val inline_block : tw_list_item
val grid_cols : int -> tw_list_item
val grid_rows : int -> tw_list_item
val gap : Tailwind.Size.t -> tw_list_item
val gap_x : Tailwind.Size.t -> tw_list_item
val gap_y : Tailwind.Size.t -> tw_list_item
val items_center : tw_list_item
val items_start : tw_list_item
val items_end : tw_list_item
val justify_center : tw_list_item
val justify_between : tw_list_item
val justify_start : tw_list_item
val justify_end : tw_list_item
val flex_col : tw_list_item
val flex_row : tw_list_item
val text_center : tw_list_item
val text_left : tw_list_item
val text_right : tw_list_item
val rounded : [< `Sm | `Md | `Lg | `Full ] -> tw_list_item
val shadow : [< `Sm | `Md | `Lg ] -> tw_list_item
val border : tw_list_item
val border_color : Tailwind.Color.t -> tw_list_item
val transition : tw_list_item

(** HTML element functions with GADT styling *)
val h1 : ?styles:tw_list -> Htmlit.El.html list -> Htmlit.El.html
val h2 : ?styles:tw_list -> Htmlit.El.html list -> Htmlit.El.html
val h3 : ?styles:tw_list -> Htmlit.El.html list -> Htmlit.El.html
val h4 : ?styles:tw_list -> Htmlit.El.html list -> Htmlit.El.html
val h5 : ?styles:tw_list -> Htmlit.El.html list -> Htmlit.El.html
val h6 : ?styles:tw_list -> Htmlit.El.html list -> Htmlit.El.html
val p : ?styles:tw_list -> Htmlit.El.html list -> Htmlit.El.html
val div : ?styles:tw_list -> Htmlit.El.html list -> Htmlit.El.html
val span : ?styles:tw_list -> Htmlit.El.html list -> Htmlit.El.html
val button : ?styles:tw_list -> Htmlit.El.html list -> Htmlit.El.html
val a : ?styles:tw_list -> href:string -> Htmlit.El.html list -> Htmlit.El.html
val img : ?styles:tw_list -> src:string -> alt:string -> unit -> Htmlit.El.html
val ul : ?styles:tw_list -> Htmlit.El.html list -> Htmlit.El.html
val ol : ?styles:tw_list -> Htmlit.El.html list -> Htmlit.El.html
val li : ?styles:tw_list -> Htmlit.El.html list -> Htmlit.El.html
val section : ?styles:tw_list -> Htmlit.El.html list -> Htmlit.El.html
val article : ?styles:tw_list -> Htmlit.El.html list -> Htmlit.El.html
val nav : ?styles:tw_list -> Htmlit.El.html list -> Htmlit.El.html
val header : ?styles:tw_list -> Htmlit.El.html list -> Htmlit.El.html
val footer : ?styles:tw_list -> Htmlit.El.html list -> Htmlit.El.html
val main : ?styles:tw_list -> Htmlit.El.html list -> Htmlit.El.html

(** Pre-built component helpers *)
val container : Htmlit.El.html list -> Htmlit.El.html
val flex_center : Htmlit.El.html list -> Htmlit.El.html
val card : ?elevated:bool -> Htmlit.El.html list -> Htmlit.El.html
val btn_primary : ?size:[`Sm | `Md | `Lg] -> Htmlit.El.html list -> Htmlit.El.html
val btn_secondary : ?size:[`Sm | `Md | `Lg] -> Htmlit.El.html list -> Htmlit.El.html
val btn_outline : ?size:[`Sm | `Md | `Lg] -> Htmlit.El.html list -> Htmlit.El.html