Rake Inquiries Page - Copy this React, Tailwind Component to your project

"Design-a-vibrant,-modern,-and-mobile-optimized-web-page-component-with-the-following-key-features-for-a-Rake-Inquiries-page:-Search-Bar:-Place-a-prominent,-sleek-search-bar-at-the-top-with-a-colorful-magnifying-glass-icon-on-the-left-side-(in-bright,-eye-catching-colors-like-teal-or-orange).-Add-animated-placeholder-text-inside-the-search-bar-that-reacts-when-clicked-(for-example,-text-moving-slightly-or-changing-color).-The-search-bar-should-have-a-bold-color-gradient-(e.g.,-gradient-from-blue-to-purple),-with-smooth,-soft-rounded-edges-for-a-modern-and-inviting-look.-Header:-The-header-should-read-'Rake-Inquiries'-in-a-large,-bold-font,-paired-with-a-bright,-colorful-icon-next-to-the-text-(like-a-colorful-clipboard-or-list-icon).-Use-a-gradient-background-(e.g.,-purple-to-pink-or-teal-to-blue)-for-the-header-to-give-it-a-vibrant,-professional-feel.-Text-should-be-white-for-high-contrast.-Inquiry-Cards:-Below-the-search-bar,-display-a-list-of-rake-inquiries-in-compact,-vibrant-card-style-containers.-Each-card-should-have-a-modern,-colorful-background-with-bold,-contrasting-colors-(e.g.,-bright-teal,-coral,-or-sunny-yellow).-Alternate-the-background-colors-for-each-card-to-create-a-visually-striking-effect.-Each-inquiry-card-should-display-key-details-with-colorful,-flat-icons-next-to-the-text:-Rake-ID:-Use-a-bold-ID-icon-in-orange-or-blue.-Client-Name:-Use-a-user-icon-in-green-or-pink.-Date:-Represent-the-date-with-a-calendar-icon-in-purple-or-red.-Origin-&-Destination:-Use-location-pin-icons-in-contrasting-colors-(e.g.,-green-and-red).-Commodities:-Represent-commodities-with-a-box-or-truck-icon-in-yellow-or-teal.-The-cards-should-have-a-clean,-flat-design-with-rounded-corners-and-subtle-shadows-for-depth.-Keep-the-card-height-compact,-with-each-card-being-just-large-enough-to-display-the-necessary-information-without-feeling-crowded.-Text-should-be-bold-and-legible,-with-headings-like-"Rake-ID",-"Client-Name",-etc.,-standing-out-in-dark-gray-or-black,-while-the-details-are-in-lighter-shades-to-create-hierarchy.-Interactive-Animations:-Hover-Effects:-Each-inquiry-card-should-change-slightly-on-hover-—-for-example,-the-background-could-become-a-bit-darker-or-lighter,-and-the-icons-could-change-color-to-add-interactivity-and-fun.-Smooth-Animations:-When-the-page-loads,-each-inquiry-card-should-slide-in-from-the-side-or-fade-in-smoothly-with-a-subtle-bounce-effect,-giving-the-page-a-dynamic-and-engaging-feel.-Icons-can-pulse-gently-when-hovered-over-to-draw-attention.-Mobile-Compatibility:-The-layout-should-be-responsive,-adjusting-beautifully-on-mobile.-On-smaller-screens,-inquiry-cards-should-stack-vertically,-maintaining-compact-proportions-while-ensuring-that-the-content-remains-readable-and-easy-to-interact-with.-The-search-bar-and-header-should-remain-accessible,-and-clickable-areas-should-be-large-enough-for-easy-tapping-on-mobile-devices.-Make-sure-the-icons-stay-appropriately-sized-and-visually-clear,-without-feeling-too-cluttered.-Color-Palette:-Use-a-bold,-multi-colored-palette-with-bright-accent-colors-(teal,-coral,-bright-yellow,-purple,-blue,-etc.)-for-cards-and-icons.-Make-sure-the-icons-are-flat-and-colorful,-using-bright,-clear-tones-for-each-type-of-information.-The-use-of-color-should-help-differentiate-categories-like-Rake-ID,-client-name,-and-commodities.-Use-white-or-soft-gray-for-text-to-maintain-readability-while-allowing-the-colorful-elements-to-stand-out.-The-overall-look-should-be-vibrant-and-energetic,-but-still-clean-and-professional.-The-colors-should-work-together-harmoniously-without-feeling-overwhelming.-Additional-Design-Notes:-Keep-the-design-clean-and-user-focused-with-smooth-transitions-and-clear-visual-cues.-The-goal-is-to-make-the-user-feel-engaged-and-motivated-to-interact-with-the-page.-Incorporate-subtle,-fun-animations-for-interactivity-—-for-example,-icons-changing-color-on-hover,-or-cards-gently-lifting-when-clicked.-Use-bold-typography-with-clear,-large-headers-to-guide-users-through-the-content.