fix #1261: broken offcanvas bg

src/pages/offcanvas.html

@@ -27,7 +27,7 @@ page-header: Offcanvas
 			Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab assumenda ea est, eum exercitationem fugiat illum itaque laboriosam magni necessitatibus, nemo nisi numquam quae reiciendis repellat sit soluta unde. Aut!
 		</div>
 		<div class="mt-3">
-			<button class="btn" type="button" data-bs-dismiss="offcanvas">
+			<button class="btn btn-primary" type="button" data-bs-dismiss="offcanvas">
 				Close offcanvas
 			</button>
 		</div>

src/scss/_variables.scss

@@ -767,6 +767,7 @@ $flag-sizes: $avatar-sizes !default;
 $payment-sizes: $avatar-sizes !default;
 
 // Offcanvas
+$offcanvas-bg-color: var(--#{$prefix}bg-surface) !default;
 $offcanvas-border-color: var(--#{$prefix}border-color-translucent) !default;
 
 // Placeholder

src/scss/ui/_offcanvas.scss

-.offcanvas {
-  background: var(--#{$prefix}card-bg);
-}
-
 .offcanvas-header {
   border-bottom: var(--#{$prefix}border-width) solid $border-color-translucent;
 }