diff --git a/src/components/tabs/__internal__/tab-title/tab-title.spec.js b/src/components/tabs/__internal__/tab-title/tab-title.spec.js index 8b747b40c4..24bb03fb0e 100644 --- a/src/components/tabs/__internal__/tab-title/tab-title.spec.js +++ b/src/components/tabs/__internal__/tab-title/tab-title.spec.js @@ -975,7 +975,7 @@ describe("TabTitle", () => { wrapper = render({ alternateStyling: true, size }, mount); assertStyleMatch( { - backgroundColor: "var(--colorsActionMinor100)", + backgroundColor: "var(--colorsActionMinor200)", }, wrapper.find(StyledTabTitle), { modifier: ":focus" } @@ -983,7 +983,7 @@ describe("TabTitle", () => { assertStyleMatch( { - backgroundColor: "var(--colorsActionMinor150)", + backgroundColor: "var(--colorsActionMinor250)", }, wrapper.find(StyledTabTitle), { modifier: ":hover" } @@ -991,7 +991,7 @@ describe("TabTitle", () => { assertStyleMatch( { - backgroundColor: "var(--colorsActionMinor100)", + backgroundColor: "var(--colorsActionMinor200)", }, render( { alternateStyling: true, isTabSelected: true, size }, diff --git a/src/components/tabs/__internal__/tab-title/tab-title.style.js b/src/components/tabs/__internal__/tab-title/tab-title.style.js index b45d42c9f3..1c838270cd 100644 --- a/src/components/tabs/__internal__/tab-title/tab-title.style.js +++ b/src/components/tabs/__internal__/tab-title/tab-title.style.js @@ -438,21 +438,19 @@ const StyledTabTitle = styled.button` alternateStyling && css` &:focus { - background-color: var(--colorsActionMinor100); + background-color: var(--colorsActionMinor200); } &:hover { background-color: ${isTabSelected - ? "var(--colorsActionMinor100)" - : "var(--colorsActionMinor150)"}; + ? "var(--colorsActionMinor200)" + : "var(--colorsActionMinor250)"}; } ${isTabSelected && css` - background-color: var(--colorsActionMinor100); + background-color: var(--colorsActionMinor200); `} - - ${isInSidebar && `padding-bottom: 1px;`} ` } `}