From 5bf404184768b7d9484eb70ce8e267b976c65f57 Mon Sep 17 00:00:00 2001
From: Liam DeBeasi <liamdebeasi@icloud.com>
Date: Fri, 5 Aug 2022 14:02:47 +0000
Subject: [PATCH] fix(item): form validation caret color renders correctly

---
 core/src/components/item/item.md.scss         | 2 +-
 core/src/components/item/item.scss            | 4 ----
 core/src/components/item/test/fill/index.html | 8 ++++----
 3 files changed, 5 insertions(+), 9 deletions(-)

diff --git a/core/src/components/item/item.md.scss b/core/src/components/item/item.md.scss
index d1293746894..8077fb4df7d 100644
--- a/core/src/components/item/item.md.scss
+++ b/core/src/components/item/item.md.scss
@@ -103,7 +103,7 @@
 }
 
 :host(.item-has-focus) .item-native {
-  caret-color: var(--highlight-color-focused);
+  caret-color: var(--highlight-background);
 }
 
 // Material Design Item Lines
diff --git a/core/src/components/item/item.scss b/core/src/components/item/item.scss
index 46d792fa76e..f65719bb3b2 100644
--- a/core/src/components/item/item.scss
+++ b/core/src/components/item/item.scss
@@ -390,10 +390,6 @@ button, a {
   pointer-events: none;
 }
 
-:host(.item-interactive.item-has-focus) .item-native {
-  caret-color: var(--highlight-background);
-}
-
 // Item Input Focused
 // --------------------------------------------------
 
diff --git a/core/src/components/item/test/fill/index.html b/core/src/components/item/test/fill/index.html
index 295a3f505c5..678f577cc76 100644
--- a/core/src/components/item/test/fill/index.html
+++ b/core/src/components/item/test/fill/index.html
@@ -78,7 +78,7 @@
               </ion-item>
             </ion-col>
             <ion-col>
-              <ion-item class="ion-invalid" fill="solid">
+              <ion-item class="ion-valid" fill="solid">
                 <ion-label position="floating">Standard</ion-label>
                 <ion-icon slot="end" name="trash"></ion-icon>
                 <ion-input></ion-input>
@@ -134,7 +134,7 @@
               </ion-item>
             </ion-col>
             <ion-col>
-              <ion-item class="ion-invalid" fill="solid" shape="round">
+              <ion-item class="ion-valid" fill="solid" shape="round">
                 <ion-label position="floating">Standard</ion-label>
                 <ion-icon slot="end" name="trash"></ion-icon>
                 <ion-input></ion-input>
@@ -190,7 +190,7 @@
               </ion-item>
             </ion-col>
             <ion-col>
-              <ion-item class="ion-invalid" fill="outline">
+              <ion-item class="ion-valid" fill="outline">
                 <ion-label position="floating">Standard</ion-label>
                 <ion-icon slot="end" name="trash"></ion-icon>
                 <ion-input></ion-input>
@@ -246,7 +246,7 @@
               </ion-item>
             </ion-col>
             <ion-col>
-              <ion-item class="ion-invalid" fill="outline" shape="round">
+              <ion-item class="ion-valid" fill="outline" shape="round">
                 <ion-label position="floating">Standard</ion-label>
                 <ion-icon slot="end" name="trash"></ion-icon>
                 <ion-input></ion-input>