/* Bootstrap-like spacing utilities for Divi Child Theme */

/* Base spacing scale */
:root {
  --spacer-0: 0;
  --spacer-1: 0.25rem;
  --spacer-2: 0.5rem;
  --spacer-3: 1rem;
  --spacer-4: 1.5rem;
  --spacer-5: 3rem;
}

/* Margin */
.m-0    { margin: var(--spacer-0) !important; }
.m-1    { margin: var(--spacer-1) !important; }
.m-2    { margin: var(--spacer-2) !important; }
.m-3    { margin: var(--spacer-3) !important; }
.m-4    { margin: var(--spacer-4) !important; }
.m-5    { margin: var(--spacer-5) !important; }
.m-auto { margin: auto !important; }

/* Margin top */
.mt-0    { margin-top: var(--spacer-0) !important; }
.mt-1    { margin-top: var(--spacer-1) !important; }
.mt-2    { margin-top: var(--spacer-2) !important; }
.mt-3    { margin-top: var(--spacer-3) !important; }
.mt-4    { margin-top: var(--spacer-4) !important; }
.mt-5    { margin-top: var(--spacer-5) !important; }
.mt-auto { margin-top: auto !important; }

/* Margin bottom */
.mb-0    { margin-bottom: var(--spacer-0) !important; }
.mb-1    { margin-bottom: var(--spacer-1) !important; }
.mb-2    { margin-bottom: var(--spacer-2) !important; }
.mb-3    { margin-bottom: var(--spacer-3) !important; }
.mb-4    { margin-bottom: var(--spacer-4) !important; }
.mb-5    { margin-bottom: var(--spacer-5) !important; }
.mb-auto { margin-bottom: auto !important; }

/* Margin left */
.ml-0    { margin-left: var(--spacer-0) !important; }
.ml-1    { margin-left: var(--spacer-1) !important; }
.ml-2    { margin-left: var(--spacer-2) !important; }
.ml-3    { margin-left: var(--spacer-3) !important; }
.ml-4    { margin-left: var(--spacer-4) !important; }
.ml-5    { margin-left: var(--spacer-5) !important; }
.ml-auto { margin-left: auto !important; }

/* Margin right */
.mr-0    { margin-right: var(--spacer-0) !important; }
.mr-1    { margin-right: var(--spacer-1) !important; }
.mr-2    { margin-right: var(--spacer-2) !important; }
.mr-3    { margin-right: var(--spacer-3) !important; }
.mr-4    { margin-right: var(--spacer-4) !important; }
.mr-5    { margin-right: var(--spacer-5) !important; }
.mr-auto { margin-right: auto !important; }

/* Margin x */
.mx-0    { margin-left: var(--spacer-0) !important; margin-right: var(--spacer-0) !important; }
.mx-1    { margin-left: var(--spacer-1) !important; margin-right: var(--spacer-1) !important; }
.mx-2    { margin-left: var(--spacer-2) !important; margin-right: var(--spacer-2) !important; }
.mx-3    { margin-left: var(--spacer-3) !important; margin-right: var(--spacer-3) !important; }
.mx-4    { margin-left: var(--spacer-4) !important; margin-right: var(--spacer-4) !important; }
.mx-5    { margin-left: var(--spacer-5) !important; margin-right: var(--spacer-5) !important; }
.mx-auto { margin-left: auto !important; margin-right: auto !important; }

/* Margin y */
.my-0    { margin-top: var(--spacer-0) !important; margin-bottom: var(--spacer-0) !important; }
.my-1    { margin-top: var(--spacer-1) !important; margin-bottom: var(--spacer-1) !important; }
.my-2    { margin-top: var(--spacer-2) !important; margin-bottom: var(--spacer-2) !important; }
.my-3    { margin-top: var(--spacer-3) !important; margin-bottom: var(--spacer-3) !important; }
.my-4    { margin-top: var(--spacer-4) !important; margin-bottom: var(--spacer-4) !important; }
.my-5    { margin-top: var(--spacer-5) !important; margin-bottom: var(--spacer-5) !important; }
.my-auto { margin-top: auto !important; margin-bottom: auto !important; }

/* Padding */
.p-0 { padding: var(--spacer-0) !important; }
.p-1 { padding: var(--spacer-1) !important; }
.p-2 { padding: var(--spacer-2) !important; }
.p-3 { padding: var(--spacer-3) !important; }
.p-4 { padding: var(--spacer-4) !important; }
.p-5 { padding: var(--spacer-5) !important; }

/* Padding top */
.pt-0 { padding-top: var(--spacer-0) !important; }
.pt-1 { padding-top: var(--spacer-1) !important; }
.pt-2 { padding-top: var(--spacer-2) !important; }
.pt-3 { padding-top: var(--spacer-3) !important; }
.pt-4 { padding-top: var(--spacer-4) !important; }
.pt-5 { padding-top: var(--spacer-5) !important; }

/* Padding bottom */
.pb-0 { padding-bottom: var(--spacer-0) !important; }
.pb-1 { padding-bottom: var(--spacer-1) !important; }
.pb-2 { padding-bottom: var(--spacer-2) !important; }
.pb-3 { padding-bottom: var(--spacer-3) !important; }
.pb-4 { padding-bottom: var(--spacer-4) !important; }
.pb-5 { padding-bottom: var(--spacer-5) !important; }

/* Padding left */
.pl-0 { padding-left: var(--spacer-0) !important; }
.pl-1 { padding-left: var(--spacer-1) !important; }
.pl-2 { padding-left: var(--spacer-2) !important; }
.pl-3 { padding-left: var(--spacer-3) !important; }
.pl-4 { padding-left: var(--spacer-4) !important; }
.pl-5 { padding-left: var(--spacer-5) !important; }

/* Padding right */
.pr-0 { padding-right: var(--spacer-0) !important; }
.pr-1 { padding-right: var(--spacer-1) !important; }
.pr-2 { padding-right: var(--spacer-2) !important; }
.pr-3 { padding-right: var(--spacer-3) !important; }
.pr-4 { padding-right: var(--spacer-4) !important; }
.pr-5 { padding-right: var(--spacer-5) !important; }

/* Padding x */
.px-0 { padding-left: var(--spacer-0) !important; padding-right: var(--spacer-0) !important; }
.px-1 { padding-left: var(--spacer-1) !important; padding-right: var(--spacer-1) !important; }
.px-2 { padding-left: var(--spacer-2) !important; padding-right: var(--spacer-2) !important; }
.px-3 { padding-left: var(--spacer-3) !important; padding-right: var(--spacer-3) !important; }
.px-4 { padding-left: var(--spacer-4) !important; padding-right: var(--spacer-4) !important; }
.px-5 { padding-left: var(--spacer-5) !important; padding-right: var(--spacer-5) !important; }

/* Padding y */
.py-0 { padding-top: var(--spacer-0) !important; padding-bottom: var(--spacer-0) !important; }
.py-1 { padding-top: var(--spacer-1) !important; padding-bottom: var(--spacer-1) !important; }
.py-2 { padding-top: var(--spacer-2) !important; padding-bottom: var(--spacer-2) !important; }
.py-3 { padding-top: var(--spacer-3) !important; padding-bottom: var(--spacer-3) !important; }
.py-4 { padding-top: var(--spacer-4) !important; padding-bottom: var(--spacer-4) !important; }
.py-5 { padding-top: var(--spacer-5) !important; padding-bottom: var(--spacer-5) !important; }
