diff --git a/projects/ngx/cards/visited-service-card/visited-service-card.component.scss b/projects/ngx/cards/visited-service-card/visited-service-card.component.scss
index d4312e2..5e4e46b 100644
--- a/projects/ngx/cards/visited-service-card/visited-service-card.component.scss
+++ b/projects/ngx/cards/visited-service-card/visited-service-card.component.scss
@@ -4,7 +4,6 @@
 
 .visited-card-wrapper {
   position: relative;
-  padding-top: 0.625rem;
   cursor: pointer;
 }
 
@@ -14,7 +13,7 @@
 
 .visited-card__type-badge {
   position: absolute;
-  top: 0;
+  top: -0.625rem;
   right: 0.75rem;
   display: inline-block;
   padding: 0.125rem 0.625rem;
diff --git a/projects/ngx/declarative-ui/dashboard/card/dashboard-card.component.scss b/projects/ngx/declarative-ui/dashboard/card/dashboard-card.component.scss
index 804e241..9f543a6 100644
--- a/projects/ngx/declarative-ui/dashboard/card/dashboard-card.component.scss
+++ b/projects/ngx/declarative-ui/dashboard/card/dashboard-card.component.scss
@@ -31,7 +31,8 @@
   height: 100%;
   overflow: visible;
   isolation: isolate;
-  padding: 0 0.5rem;
+  padding-inline-start: var(--mfp_cardContainerPadding, 10px);
+  padding-inline-end: var(--mfp_cardContainerPadding, 10px);
 }
 
 .component-host {
diff --git a/projects/ngx/declarative-ui/dashboard/dashboard/dashboard.component.html b/projects/ngx/declarative-ui/dashboard/dashboard/dashboard.component.html
index b1c53c1..7fd7f6d 100644
--- a/projects/ngx/declarative-ui/dashboard/dashboard/dashboard.component.html
+++ b/projects/ngx/declarative-ui/dashboard/dashboard/dashboard.component.html
@@ -105,7 +105,7 @@
       />
     }
   </div>
-  <gridstack #grid [options]="gridOptions()" (removedCB)="onGridChange($event)" (addedCB)="onGridChange($event)" (changeCB)="onGridChange($event)">
+  <gridstack #grid [options]="gridOptions()" (addedCB)="onGridChange($event)" (changeCB)="onGridChange($event)" (removedCB)="onGridChange($event)">
     @for (card of looseCards(); track card.id) {
       <gridstack-item
         [options]="card"
diff --git a/projects/ngx/declarative-ui/dashboard/dashboard/dashboard.component.scss b/projects/ngx/declarative-ui/dashboard/dashboard/dashboard.component.scss
index 5468d69..1abfb12 100644
--- a/projects/ngx/declarative-ui/dashboard/dashboard/dashboard.component.scss
+++ b/projects/ngx/declarative-ui/dashboard/dashboard/dashboard.component.scss
@@ -14,7 +14,7 @@ mfp-wc-dashboard {
 }
 
 .mfp-dashboard {
-  padding: 2rem;
+  padding: calc(var(--sapShell_Space_XL, 3rem) - 10px);
 }
 
 .mfp-sections-container {
@@ -49,6 +49,7 @@ mfp-wc-dashboard {
   align-items: flex-start;
   justify-content: space-between;
   gap: 1rem;
+  padding: 0px 10px;
 }
 
 .mfp-dashboard__header {
@@ -86,3 +87,21 @@ mfp-wc-dashboard {
   box-sizing: border-box;
   overflow: hidden;
 }
+
+@media screen and (min-width: 0px) and (max-width: 599px) {
+  .mfp-dashboard {
+    padding: calc(var(--sapShell_Space_S, 1rem) - 10px);
+  }
+}
+
+@media screen and (min-width: 600px) and (max-width: 1023px) {
+  .mfp-dashboard {
+    padding: calc(var(--sapShell_Space_M, 2rem) - 10px);
+  }
+}
+
+@media screen and (min-width: 1024px) and (max-width: 1439px) {
+  .mfp-dashboard {
+    padding: calc(var(--sapShell_Space_L, 2rem) - 10px);
+  }
+}
diff --git a/projects/ngx/declarative-ui/dashboard/dashboard/dashboard.component.ts b/projects/ngx/declarative-ui/dashboard/dashboard/dashboard.component.ts
index a7506ab..44e5a92 100644
--- a/projects/ngx/declarative-ui/dashboard/dashboard/dashboard.component.ts
+++ b/projects/ngx/declarative-ui/dashboard/dashboard/dashboard.component.ts
@@ -96,6 +96,9 @@ export class Dashboard implements OnInit, OnDestroy {
       cellHeight: CELL_HEIGHT,
       disableResize: !this.editMode(),
       disableDrag: !this.editMode(),
+      marginBottom: 0,
+      marginLeft: 0,
+      marginRight: 0,
       columnOpts: {
         breakpointForWindow: true,
         breakpoints: [
diff --git a/projects/ngx/declarative-ui/dashboard/section/dashboard-section.component.scss b/projects/ngx/declarative-ui/dashboard/section/dashboard-section.component.scss
index afaebdc..55f0658 100644
--- a/projects/ngx/declarative-ui/dashboard/section/dashboard-section.component.scss
+++ b/projects/ngx/declarative-ui/dashboard/section/dashboard-section.component.scss
@@ -10,7 +10,7 @@
   border: 1px solid transparent;
   border-top: none;
   border-radius: 0 0 0.5rem 0.5rem;
-  padding: 1.25rem 0.75rem 0.75rem;
+  padding-top: 1.25rem;
 
   &--edit {
     border-color: var(--sapGroup_ContentBorderColor, #d9d9d9);
@@ -73,7 +73,8 @@
     display: grid;
     grid-template-columns: repeat(var(--cols, 12), 1fr);
     grid-auto-rows: var(--row-height, 10px);
-    gap: var(--row-gap, 0px);
+    column-gap: var(--column-gap, 0px);
+    row-gap: var(--row-gap, 0px);
 
     @media (max-width: 599px) {
       grid-template-columns: 1fr;
diff --git a/projects/ngx/declarative-ui/stories/dashboard.cards.ts b/projects/ngx/declarative-ui/stories/dashboard.cards.ts
index dc0325d..256a85f 100644
--- a/projects/ngx/declarative-ui/stories/dashboard.cards.ts
+++ b/projects/ngx/declarative-ui/stories/dashboard.cards.ts
@@ -75,7 +75,7 @@ export const CARDS: CardConfig[] = [
   {
     id: 'table-pods',
     w: 12,
-    h: 37,
+    h: 35,
     component: 'mfp-wc-declarative-table-card',
     componentInputs: {
       config: TABLE_CARD_CONFIG,
@@ -89,7 +89,7 @@ export const CARDS: CardConfig[] = [
     label: "What's New",
     type: 'angular',
     w: 6,
-    h: 57,
+    h: 55,
     component: 'mfp-whats-new',
   },
   {
@@ -97,7 +97,7 @@ export const CARDS: CardConfig[] = [
     label: 'Favorites',
     type: 'angular',
     w: 6,
-    h: 21,
+    h: 20,
     minW: 3,
     maxW: 6,
     minH: 10,
@@ -109,7 +109,7 @@ export const CARDS: CardConfig[] = [
     label: 'Service Status',
     type: 'angular',
     w: 6,
-    h: 30,
+    h: 28,
     component: 'mfp-service-status-card',
   },
 ];
diff --git a/projects/ngx/declarative-ui/stories/dashboard.stories.ts b/projects/ngx/declarative-ui/stories/dashboard.stories.ts
index 4b5b0b8..8660674 100644
--- a/projects/ngx/declarative-ui/stories/dashboard.stories.ts
+++ b/projects/ngx/declarative-ui/stories/dashboard.stories.ts
@@ -49,7 +49,7 @@ const AVAILABLE_CARDS: CardConfig[] = [
     id: 'table-pods',
     label: 'Pods Table',
     w: 12,
-    h: 37,
+    h: 35,
     component: 'mfp-wc-declarative-table-card',
     componentInputs: {
       config: TABLE_CARD_CONFIG,
@@ -63,7 +63,7 @@ const AVAILABLE_CARDS: CardConfig[] = [
     label: "What's New",
     type: 'angular',
     w: 6,
-    h: 57,
+    h: 55,
     component: 'mfp-whats-new',
   },
   {
@@ -71,7 +71,7 @@ const AVAILABLE_CARDS: CardConfig[] = [
     label: 'Favorites',
     type: 'angular',
     w: 6,
-    h: 21,
+    h: 20,
     component: 'mfp-favorites',
   },
   {
@@ -79,7 +79,7 @@ const AVAILABLE_CARDS: CardConfig[] = [
     label: 'Service Status',
     type: 'angular',
     w: 6,
-    h: 30,
+    h: 28,
     component: 'mfp-service-status-card',
   },
 ];