diff --git a/src/layouts/schedule-page/recal-ack-modal/recal-ack-toggle/recal-ack-toggle.vue b/src/layouts/schedule-page/recal-ack-modal/recal-ack-toggle/recal-ack-toggle.vue
index 238de834..bf8fb06f 100644
--- a/src/layouts/schedule-page/recal-ack-modal/recal-ack-toggle/recal-ack-toggle.vue
+++ b/src/layouts/schedule-page/recal-ack-modal/recal-ack-toggle/recal-ack-toggle.vue
@@ -6,11 +6,13 @@
         linkType="text"
         href="#!"
         :text="textForToggle"
-        @click="handleClickToggle" />
-      <div
+        :preventDefaultOnClick="true"
+        @click-event="handleClickToggle" />
+      <button
+        type="button"
         class="recal-ack-toggle d-inline-block"
         :class="[isDetailVisible ? 'active' : '']"
-        @click="handleClickToggle"></div>
+        @click="handleClickToggle"></button>
       <Transition>
         <div
             v-show="isDetailVisible"
diff --git a/src/layouts/schedule-page/schedule-page.vue b/src/layouts/schedule-page/schedule-page.vue
index 5dc559e6..a2e7ddcf 100644
--- a/src/layouts/schedule-page/schedule-page.vue
+++ b/src/layouts/schedule-page/schedule-page.vue
@@ -466,6 +466,7 @@ export default {
         this.isMobileView = !this.mql.matches;
         this.mql.addEventListener('change', this.handleMqlChange);
         this.mainStore.updateIsRecalAcknowledgedForScheduling(false);
+        this.isRecalAcknowledged = false;
     },
     unmounted() {
         if (this.mql) {