spacing control for dashboard widget

app/Abstracts/Widget.php

@@ -17,7 +17,7 @@ abstract class Widget
     public $default_name = '';
 
     public $default_settings = [
-        'width' => 'w-full lg:w-2/4 px-12 my-8',
+        'width' => 'w-full lg:w-2/4 lg:px-12 my-8',
     ];
 
     public $description = '';

public/css/app.css

@@ -49967,6 +49967,11 @@ body{
     margin-bottom: 3rem;
   }
 
+  .lg\:-mx-12{
+    margin-left: -3rem;
+    margin-right: -3rem;
+  }
+
   .lg\:my-0{
     margin-top: 0px;
     margin-bottom: 0px;
@@ -50235,6 +50240,26 @@ body{
     border-right-width: 1px;
   }
 
+  .lg\:px-3{
+    padding-left: 0.75rem;
+    padding-right: 0.75rem;
+  }
+
+  .lg\:px-4{
+    padding-left: 1rem;
+    padding-right: 1rem;
+  }
+
+  .lg\:px-6{
+    padding-left: 1.5rem;
+    padding-right: 1.5rem;
+  }
+
+  .lg\:px-12{
+    padding-left: 3rem;
+    padding-right: 3rem;
+  }
+
   .lg\:px-24{
     padding-left: 6rem;
     padding-right: 6rem;
@@ -50245,11 +50270,6 @@ body{
     padding-bottom: 0px;
   }
 
-  .lg\:px-12{
-    padding-left: 3rem;
-    padding-right: 3rem;
-  }
-
   .lg\:pl-24{
     padding-left: 6rem;
   }

resources/views/common/dashboards/show.blade.php

@@ -179,7 +179,7 @@
     @endsection
 
     <x-slot name="content">
-        <div class="dashboard flex flex-wrap -mx-12">
+        <div class="dashboard flex flex-wrap lg:-mx-12">
             @foreach($widgets as $widget)
                 @widget($widget)
             @endforeach

resources/views/widgets/bank_feeds.blade.php

@@ -1,7 +1,7 @@
 @if (! empty($module))
     {!! $module !!}
 @else
-    <div class="relative w-full lg:w-1/2 my-8 px-12">
+    <div class="relative w-full lg:w-1/2 my-8 lg:px-12">
         <div class="relative pb-2 my-4 lg:my-0 z-10">
             <div class="flex justify-between font-medium mb-2">
                 <h2 class="text-black">

safelist.txt

@@ -6,6 +6,10 @@ lg:mt-4
 lg:pl-6
 lg:w-9
 lg:mt-11
+lg:-mx-12
+lg:px-3
+lg:px-4
+lg:px-6
 lg:relative
 lg:right-0
 lg:justify-around