diff --git a/src/components/Button/index.js b/src/components/Button/index.js
index b19e405211d6..50165ca98774 100644
--- a/src/components/Button/index.js
+++ b/src/components/Button/index.js
@@ -277,9 +277,8 @@ class Button extends Component {
                                 this.props.large ? styles.buttonLarge : undefined,
                                 this.props.success ? styles.buttonSuccess : undefined,
                                 this.props.danger ? styles.buttonDanger : undefined,
-                                (this.props.isDisabled && this.props.success) ? styles.buttonSuccessDisabled : undefined,
-                                (this.props.isDisabled && this.props.danger) ? styles.buttonDangerDisabled : undefined,
-                                (this.props.isDisabled && !this.props.danger && !this.props.success) ? styles.buttonDisable : undefined,
+                                (this.props.isDisabled && (this.props.success || this.props.danger)) ? styles.buttonOpacityDisabled : undefined,
+                                (this.props.isDisabled && !this.props.danger && !this.props.success) ? styles.buttonDisabled : undefined,
                                 (this.props.success && activeAndHovered) ? styles.buttonSuccessHovered : undefined,
                                 (this.props.danger && activeAndHovered) ? styles.buttonDangerHovered : undefined,
                                 this.props.shouldRemoveRightBorderRadius ? styles.noRightBorderRadius : undefined,
diff --git a/src/components/CalendarPicker/ArrowIcon.js b/src/components/CalendarPicker/ArrowIcon.js
index 239e55d2e904..077a4c13924e 100644
--- a/src/components/CalendarPicker/ArrowIcon.js
+++ b/src/components/CalendarPicker/ArrowIcon.js
@@ -24,7 +24,7 @@ const ArrowIcon = props => (
     <View style={[
         styles.p1,
         StyleUtils.getDirectionStyle(props.direction),
-        props.disabled ? styles.calendarButtonDisabled : {},
+        props.disabled ? styles.buttonOpacityDisabled : {},
     ]}
     >
         <Icon src={Expensicons.ArrowRight} />
diff --git a/src/components/CalendarPicker/index.js b/src/components/CalendarPicker/index.js
index a1b36a07bae5..c0a2a566042c 100644
--- a/src/components/CalendarPicker/index.js
+++ b/src/components/CalendarPicker/index.js
@@ -157,7 +157,7 @@ class CalendarPicker extends React.PureComponent {
                                                 StyleUtils.getButtonBackgroundColorStyle(getButtonState(hovered, pressed)),
                                             ]}
                                         >
-                                            <Text style={isDisabled ? styles.calendarButtonDisabled : styles.dayText}>{day}</Text>
+                                            <Text style={isDisabled ? styles.buttonOpacityDisabled : styles.dayText}>{day}</Text>
                                         </View>
                                     )}
                                 </Pressable>
diff --git a/src/styles/styles.js b/src/styles/styles.js
index 88ec229570ee..8557504c4cc1 100644
--- a/src/styles/styles.js
+++ b/src/styles/styles.js
@@ -478,7 +478,7 @@ const styles = {
         borderWidth: 0,
     },
 
-    buttonSuccessDisabled: {
+    buttonOpacityDisabled: {
         opacity: 0.5,
     },
 
@@ -492,16 +492,12 @@ const styles = {
         borderWidth: 0,
     },
 
-    buttonDangerDisabled: {
-        opacity: 0.5,
-    },
-
     buttonDangerHovered: {
         backgroundColor: themeColors.dangerHover,
         borderWidth: 0,
     },
 
-    buttonDisable: {
+    buttonDisabled: {
         backgroundColor: themeColors.buttonDefaultBG,
         borderWidth: 0,
     },
@@ -791,10 +787,6 @@ const styles = {
         backgroundColor: themeColors.buttonDefaultBG,
     },
 
-    calendarButtonDisabled: {
-        opacity: 0.5,
-    },
-
     textInputContainer: {
         flex: 1,
         justifyContent: 'center',