diff --git a/resources/js/components/ui/crm-input/Input.vue b/resources/js/components/ui/crm-input/Input.vue
index daeda88..83349a8 100644
--- a/resources/js/components/ui/crm-input/Input.vue
+++ b/resources/js/components/ui/crm-input/Input.vue
@@ -21,9 +21,22 @@ const modelValue = useVModel(props, 'modelValue', emits, {
 
 <template>
   <input v-model="modelValue" data-slot="input" :class="cn(
-    'file:text-foreground placeholder:text-muted-foreground border-input flex h-9 w-full min-w-0 rounded-md border bg-input px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',
+    'file:text-foreground placeholder:text-muted-foreground border-input hover:border-input flex h-9 w-full min-w-0 rounded-md border bg-background px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',
     'focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]',
     'aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive',
     props.class,
   )">
 </template>
+
+<style scoped>
+tr input:not(:focus) {
+  background-color: transparent;
+  border-color: transparent;
+  box-shadow: none;
+  text-overflow: ellipsis;
+}
+
+tr input:not(:focus):hover {
+  border-color: var(--border);
+}
+</style>
\ No newline at end of file