diff --git a/addons/microsoft_calendar/static/src/js/microsoft_calendar.js b/addons/microsoft_calendar/static/src/js/microsoft_calendar.js
index 209ab8681dd..8753814363c 100644
--- a/addons/microsoft_calendar/static/src/js/microsoft_calendar.js
+++ b/addons/microsoft_calendar/static/src/js/microsoft_calendar.js
@@ -189,7 +189,7 @@ const MicrosoftCalendarRenderer = CalendarRenderer.include({
 
     _initMicrosoftPillButton: function() {
         this.$microsoftStopButton.css({"cursor":"pointer", "font-size":"0.9em"});
-        var switchBadgeClass = (elem) => {elem.toggleClass('badge-success'); elem.toggleClass('badge-danger');};
+        var switchBadgeClass = (elem) => {elem.toggleClass('badge-primary'); elem.toggleClass('badge-danger');};
         this.$('.o_stop_microsoft_sync_button').hover(() => {
             switchBadgeClass(this.$microsoftStopButton);
             this.$microsoftStopButton.html("<i class='fa mr-2 fa-times'/>".concat(_t("Stop the Synchronization")));
@@ -210,7 +210,7 @@ const MicrosoftCalendarRenderer = CalendarRenderer.include({
     _getMicrosoftStopButton: function () {
         return  $('<span/>', {
             html: _t("Synched with Outlook"),
-            class: 'w-100 badge badge-pill badge-success border-0 o_stop_microsoft_sync_button'
+            class: 'w-100 badge badge-pill badge-primary border-0 o_stop_microsoft_sync_button'
         })
         .prepend($('<i/>', {class: "fa mr-2 fa-check"}));
     },
diff --git a/addons/microsoft_calendar/static/src/scss/microsoft_calendar.scss b/addons/microsoft_calendar/static/src/scss/microsoft_calendar.scss
new file mode 100644
index 00000000000..49556614c52
--- /dev/null
+++ b/addons/microsoft_calendar/static/src/scss/microsoft_calendar.scss
@@ -0,0 +1,5 @@
+.o_calendar_sidebar {
+    .badge-primary {
+        background-color: $o-enterprise-primary-color;
+    }
+}
diff --git a/addons/microsoft_calendar/views/microsoft_calendar_templates.xml b/addons/microsoft_calendar/views/microsoft_calendar_templates.xml
index bed2c813842..7b338c22dc0 100644
--- a/addons/microsoft_calendar/views/microsoft_calendar_templates.xml
+++ b/addons/microsoft_calendar/views/microsoft_calendar_templates.xml
@@ -5,5 +5,8 @@
             <script type="text/javascript" src="/microsoft_calendar/static/src/js/microsoft_calendar_popover.js"></script>
             <script type="text/javascript" src="/microsoft_calendar/static/src/js/microsoft_calendar.js"></script>
         </xpath>
+        <xpath expr="link[last()]" position="after">
+            <link rel="stylesheet" type="text/scss" href="/microsoft_calendar/static/src/scss/microsoft_calendar.scss"/>
+        </xpath>
     </template>
 </odoo>