;; Cart summary / checkout components

(defcomp ~summary/checkout-form (&key (action :as string) (csrf :as string) (label :as string))
  (form :method "post" :action action :class "w-full"
    (input :type "hidden" :name "csrf_token" :value csrf)
    (button :type "submit" :class "w-full inline-flex items-center justify-center px-4 py-2 text-xs sm:text-sm rounded-full border border-emerald-600 bg-emerald-600 text-white hover:bg-emerald-700 transition"
      (i :class "fa-solid fa-credit-card mr-2" :aria-hidden "true") label)))

(defcomp ~summary/checkout-signin (&key (href :as string))
  (div :class "w-full flex"
    (a :href href :class "w-full cursor-pointer flex flex-row items-center justify-center p-3 gap-2 rounded bg-stone-200 text-black hover:bg-stone-300 transition"
      (i :class "fa-solid fa-key") (span "sign in or register to checkout"))))

(defcomp ~summary/panel (&key (item-count :as string) (subtotal :as string) checkout)
  (aside :id "cart-summary" :class "lg:pl-2"
    (div :class "rounded-2xl bg-white shadow-sm border border-stone-200 p-4 sm:p-5"
      (h2 :class "text-sm sm:text-base font-semibold text-stone-900 mb-3 sm:mb-4" "Order summary")
      (dl :class "space-y-2 text-xs sm:text-sm"
        (div :class "flex items-center justify-between"
          (dt :class "text-stone-600" "Items") (dd :class "text-stone-900" item-count))
        (div :class "flex items-center justify-between"
          (dt :class "text-stone-600" "Subtotal") (dd :class "text-stone-900" subtotal)))
      (div :class "flex flex-col items-center w-full"
        (h1 :class "text-5xl mt-2" "This is a test - it will not take actual money")
        (div "use dummy card number: 5555 5555 5555 4444"))
      (div :class "mt-4 sm:mt-5" checkout))))