Improve dark mode styles across multiple pages (#2125)

* fix: improve dark mode readability across the app

* fix: improve dark mode support for asset percentage text

* fix: apply suggested patch for theme-related improvements

* chore: apply PR feedback – remove dark:, align with design tokens, update form builder

* chore: revert background token and restore original style for visual consistency

* chore: remove unnecessary class attributes from form fields using builder

* refactor: move number_field and date_field into metaprogramming block

* refactor: replace bg-divider-adaptive divs with <hr> and border-secondary

* fix: apply requested changes and linting fixes

app/views/categories/_form.html.erb

@@ -30,7 +30,7 @@
             <div class="flex gap-2 items-center hidden flex-col" data-category-target="paletteSection">
               <div class="flex gap-2 items-center w-full">
                 <div class="w-6 h-6 p-4 rounded-full cursor-pointer" style="background-color: <%= category.color %>" data-category-target="colorPreview"></div>
-                <%= f.text_field :color , data: { category_target: "colorInput"}, class: "form-field__input blah", inline: true %>
+                <%= f.text_field :color , data: { category_target: "colorInput"}, inline: true %>
                 <%= lucide_icon "palette", class: "w-8 h-8 cursor-pointer hover:bg-gray-100 p-1", data: { action: "click->category#toggleSections" } %>
               </div>
               <div data-category-target="validationMessage" class="hidden self-start flex gap-1 items-center text-xs text-destructive ">