/* Base Margin and Padding Classes with Smaller Spacing */
.m-0 { margin: 0 !important; }
.m-1 { margin: 1px !important; }
.m-2 { margin: 2px !important; }
.m-3 { margin: 3px !important; }
.m-4 { margin: 4px !important; }
.m-5 { margin: 5px !important; }

.p-0 { padding: 0 !important; }
.p-1 { padding: 1px !important; }
.p-2 { padding: 2px !important; }
.p-3 { padding: 3px !important; }
.p-4 { padding: 4px !important; }
.p-5 { padding: 5px !important; }

/* Margin and Padding for Specific Sides */
.mt-0 { margin-top: 0 !important; }
.mt-1 { margin-top: 1px !important; }
.mt-2 { margin-top: 2px !important; }
.mt-3 { margin-top: 3px !important; }
.mt-4 { margin-top: 4px !important; }
.mt-5 { margin-top: 5px !important; }

.mr-0 { margin-right: 0 !important; }
.mr-1 { margin-right: 1px !important; }
.mr-2 { margin-right: 2px !important; }
.mr-3 { margin-right: 3px !important; }
.mr-4 { margin-right: 4px !important; }
.mr-5 { margin-right: 5px !important; }

.mb-0 { margin-bottom: 0 !important; }
.mb-1 { margin-bottom: 1px !important; }
.mb-2 { margin-bottom: 2px !important; }
.mb-3 { margin-bottom: 3px !important; }
.mb-4 { margin-bottom: 4px !important; }
.mb-5 { margin-bottom: 5px !important; }

.ml-0 { margin-left: 0 !important; }
.ml-1 { margin-left: 1px !important; }
.ml-2 { margin-left: 2px !important; }
.ml-3 { margin-left: 3px !important; }
.ml-4 { margin-left: 4px !important; }
.ml-5 { margin-left: 5px !important; }

.pt-0 { padding-top: 0 !important; }
.pt-1 { padding-top: 1px !important; }
.pt-2 { padding-top: 2px !important; }
.pt-3 { padding-top: 3px !important; }
.pt-4 { padding-top: 4px !important; }
.pt-5 { padding-top: 5px !important; }

.pr-0 { padding-right: 0 !important; }
.pr-1 { padding-right: 1px !important; }
.pr-2 { padding-right: 2px !important; }
.pr-3 { padding-right: 3px !important; }
.pr-4 { padding-right: 4px !important; }
.pr-5 { padding-right: 5px !important; }

.pb-0 { padding-bottom: 0 !important; }
.pb-1 { padding-bottom: 1px !important; }
.pb-2 { padding-bottom: 2px !important; }
.pb-3 { padding-bottom: 3px !important; }
.pb-4 { padding-bottom: 4px !important; }
.pb-5 { padding-bottom: 5px !important; }

.pl-0 { padding-left: 0 !important; }
.pl-1 { padding-left: 1px !important; }
.pl-2 { padding-left: 2px !important; }
.pl-3 { padding-left: 3px !important; }
.pl-4 { padding-left: 4px !important; }
.pl-5 { padding-left: 5px !important; }

/* Responsive Variations */
@media (max-width: 767px) {
    .m-xs-0 { margin: 0 !important; }
    .m-xs-1 { margin: 1px !important; }
    .m-xs-2 { margin: 2px !important; }
    .m-xs-3 { margin: 3px !important; }
    .m-xs-4 { margin: 4px !important; }
    .m-xs-5 { margin: 5px !important; }

    .p-xs-0 { padding: 0 !important; }
    .p-xs-1 { padding: 1px !important; }
    .p-xs-2 { padding: 2px !important; }
    .p-xs-3 { padding: 3px !important; }
    .p-xs-4 { padding: 4px !important; }
    .p-xs-5 { padding: 5px !important; }

    .mt-xs-0 { margin-top: 0 !important; }
    .mt-xs-1 { margin-top: 1px !important; }
    .mt-xs-2 { margin-top: 2px !important; }
    .mt-xs-3 { margin-top: 3px !important; }
    .mt-xs-4 { margin-top: 4px !important; }
    .mt-xs-5 { margin-top: 5px !important; }

    .mr-xs-0 { margin-right: 0 !important; }
    .mr-xs-1 { margin-right: 1px !important; }
    .mr-xs-2 { margin-right: 2px !important; }
    .mr-xs-3 { margin-right: 3px !important; }
    .mr-xs-4 { margin-right: 4px !important; }
    .mr-xs-5 { margin-right: 5px !important; }

    .mb-xs-0 { margin-bottom: 0 !important; }
    .mb-xs-1 { margin-bottom: 1px !important; }
    .mb-xs-2 { margin-bottom: 2px !important; }
    .mb-xs-3 { margin-bottom: 3px !important; }
    .mb-xs-4 { margin-bottom: 4px !important; }
    .mb-xs-5 { margin-bottom: 5px !important; }

    .ml-xs-0 { margin-left: 0 !important; }
    .ml-xs-1 { margin-left: 1px !important; }
    .ml-xs-2 { margin-left: 2px !important; }
    .ml-xs-3 { margin-left: 3px !important; }
    .ml-xs-4 { margin-left: 4px !important; }
    .ml-xs-5 { margin-left: 5px !important; }

    .pt-xs-0 { padding-top: 0 !important; }
    .pt-xs-1 { padding-top: 1px !important; }
    .pt-xs-2 { padding-top: 2px !important; }
    .pt-xs-3 { padding-top: 3px !important; }
    .pt-xs-4 { padding-top: 4px !important; }
    .pt-xs-5 { padding-top: 5px !important; }

    .pr-xs-0 { padding-right: 0 !important; }
    .pr-xs-1 { padding-right: 1px !important; }
    .pr-xs-2 { padding-right: 2px !important; }
    .pr-xs-3 { padding-right: 3px !important; }
    .pr-xs-4 { padding-right: 4px !important; }
    .pr-xs-5 { padding-right: 5px !important; }

    .pb-xs-0 { padding-bottom: 0 !important; }
    .pb-xs-1 { padding-bottom: 1px !important; }
    .pb-xs-2 { padding-bottom: 2px !important; }
    .pb-xs-3 { padding-bottom: 3px !important; }
    .pb-xs-4 { padding-bottom: 4px !important; }
    .pb-xs-5 { padding-bottom: 5px !important; }

    .pl-xs-0 { padding-left: 0 !important; }
    .pl-xs-1 { padding-left: 1px !important; }
    .pl-xs-2 { padding-left: 2px !important; }
    .pl-xs-3 { padding-left: 3px !important; }
    .pl-xs-4 { padding-left: 4px !important; }
    .pl-xs-5 { padding-left: 5px !important; }
}

@media (min-width: 768px) {
    .m-sm-0 { margin: 0 !important; }
    .m-sm-1 { margin: 1px !important; }
    .m-sm-2 { margin: 2px !important; }
    .m-sm-3 { margin: 3px !important; }
    .m-sm-4 { margin: 4px !important; }
    .m-sm-5 { margin: 5px !important; }

    .p-sm-0 { padding: 0 !important; }
    .p-sm-1 { padding: 1px !important; }
    .p-sm-2 { padding: 2px !important; }
    .p-sm-3 { padding: 3px !important; }
    .p-sm-4 { padding: 4px !important; }
    .p-sm-5 { padding: 5px !important; }
    
    .mt-sm-0 { margin-top: 0 !important; }
    .mt-sm-1 { margin-top: 1px !important; }
    .mt-sm-2 { margin-top: 2px !important; }
    .mt-sm-3 { margin-top: 3px !important; }
    .mt-sm-4 { margin-top: 4px !important; }
    .mt-sm-5 { margin-top: 5px !important; }
    
    .mr-sm-0 { margin-right: 0 !important; }
    .mr-sm-1 { margin-right: 1px !important; }
    .mr-sm-2 { margin-right: 2px !important; }
    .mr-sm-3 { margin-right: 3px !important; }
    .mr-sm-4 { margin-right: 4px !important; }
    .mr-sm-5 { margin-right: 5px !important; }
    
    .mb-sm-0 { margin-bottom: 0 !important; }
    .mb-sm-1 { margin-bottom: 1px !important; }
    .mb-sm-2 { margin-bottom: 2px !important; }
    .mb-sm-3 { margin-bottom: 3px !important; }
    .mb-sm-4 { margin-bottom: 4px !important; }
    .mb-sm-5 { margin-bottom: 5px !important; }
    
    .ml-sm-0 { margin-left: 0 !important; }
    .ml-sm-1 { margin-left: 1px !important; }
    .ml-sm-2 { margin-left: 2px !important; }
    .ml-sm-3 { margin-left: 3px !important; }
    .ml-sm-4 { margin-left: 4px !important; }
    .ml-sm-5 { margin-left: 5px !important; }
    
    .pt-sm-0 { padding-top: 0 !important; }
    .pt-sm-1 { padding-top: 1px !important; }
    .pt-sm-2 { padding-top: 2px !important; }
    .pt-sm-3 { padding-top: 3px !important; }
    .pt-sm-4 { padding-top: 4px !important; }
    .pt-sm-5 { padding-top: 5px !important; }
    
    .pr-sm-0 { padding-right: 0 !important; }
    .pr-sm-1 { padding-right: 1px !important; }
    .pr-sm-2 { padding-right: 2px !important; }
    .pr-sm-3 { padding-right: 3px !important; }
    .pr-sm-4 { padding-right: 4px !important; }
    .pr-sm-5 { padding-right: 5px !important; }
    
    .pb-sm-0 { padding-bottom: 0 !important; }
    .pb-sm-1 { padding-bottom: 1px !important; }
    .pb-sm-2 { padding-bottom: 2px !important; }
    .pb-sm-3 { padding-bottom: 3px !important; }
    .pb-sm-4 { padding-bottom: 4px !important; }
    .pb-sm-5 { padding-bottom: 5px !important; }
    
    .pl-sm-0 { padding-left: 0 !important; }
    .pl-sm-1 { padding-left: 1px !important; }
    .pl-sm-2 { padding-left: 2px !important; }
    .pl-sm-3 { padding-left: 3px !important; }
    .pl-sm-4 { padding-left: 4px !important; }
    .pl-sm-5 { padding-left: 5px !important; }
}

@media (min-width: 992px) {
    .m-md-0 { margin: 0 !important; }
    .m-md-1 { margin: 1px !important; }
    .m-md-2 { margin: 2px !important; }
    .m-md-3 { margin: 3px !important; }
    .m-md-4 { margin: 4px !important; }
    .m-md-5 { margin: 5px !important; }

    .p-md-0 { padding: 0 !important; }
    .p-md-1 { padding: 1px !important; }
    .p-md-2 { padding: 2px !important; }
    .p-md-3 { padding: 3px !important; }
    .p-md-4 { padding: 4px !important; }
    .p-md-5 { padding: 5px !important; }

    .mt-md-0 { margin-top: 0 !important; }
    .mt-md-1 { margin-top: 1px !important; }
    .mt-md-2 { margin-top: 2px !important; }
    .mt-md-3 { margin-top: 3px !important; }
    .mt-md-4 { margin-top: 4px !important; }
    .mt-md-5 { margin-top: 5px !important; }

    .mr-md-0 { margin-right: 0 !important; }
    .mr-md-1 { margin-right: 1px !important; }
    .mr-md-2 { margin-right: 2px !important; }
    .mr-md-3 { margin-right: 3px !important; }
    .mr-md-4 { margin-right: 4px !important; }
    .mr-md-5 { margin-right: 5px !important; }

    .mb-md-0 { margin-bottom: 0 !important; }
    .mb-md-1 { margin-bottom: 1px !important; }
    .mb-md-2 { margin-bottom: 2px !important; }
    .mb-md-3 { margin-bottom: 3px !important; }
    .mb-md-4 { margin-bottom: 4px !important; }
    .mb-md-5 { margin-bottom: 5px !important; }

    .ml-md-0 { margin-left: 0 !important; }
    .ml-md-1 { margin-left: 1px !important; }
    .ml-md-2 { margin-left: 2px !important; }
    .ml-md-3 { margin-left: 3px !important; }
    .ml-md-4 { margin-left: 4px !important; }
    .ml-md-5 { margin-left: 5px !important; }

    .pt-md-0 { padding-top: 0 !important; }
    .pt-md-1 { padding-top: 1px !important; }
    .pt-md-2 { padding-top: 2px !important; }
    .pt-md-3 { padding-top: 3px !important; }
    .pt-md-4 { padding-top: 4px !important; }
    .pt-md-5 { padding-top: 5px !important; }

    .pr-md-0 { padding-right: 0 !important; }
    .pr-md-1 { padding-right: 1px !important; }
    .pr-md-2 { padding-right: 2px !important; }
    .pr-md-3 { padding-right: 3px !important; }
    .pr-md-4 { padding-right: 4px !important; }
    .pr-md-5 { padding-right: 5px !important; }

    .pb-md-0 { padding-bottom: 0 !important; }
    .pb-md-1 { padding-bottom: 1px !important; }
    .pb-md-2 { padding-bottom: 2px !important; }
    .pb-md-3 { padding-bottom: 3px !important; }
    .pb-md-4 { padding-bottom: 4px !important; }
    .pb-md-5 { padding-bottom: 5px !important; }

    .pl-md-0 { padding-left: 0 !important; }
    .pl-md-1 { padding-left: 1px !important; }
    .pl-md-2 { padding-left: 2px !important; }
    .pl-md-3 { padding-left: 3px !important; }
    .pl-md-4 { padding-left: 4px !important; }
    .pl-md-5 { padding-left: 5px !important; }
}

@media (min-width: 1200px) {
    .m-lg-0 { margin: 0 !important; }
    .m-lg-1 { margin: 1px !important; }
    .m-lg-2 { margin: 2px !important; }
    .m-lg-3 { margin: 3px !important; }
    .m-lg-4 { margin: 4px !important; }
    .m-lg-5 { margin: 5px !important; }

    .p-lg-0 { padding: 0 !important; }
    .p-lg-1 { padding: 1px !important; }
    .p-lg-2 { padding: 2px !important; }
    .p-lg-3 { padding: 3px !important; }
    .p-lg-4 { padding: 4px !important; }
    .p-lg-5 { padding: 5px !important; }

    .mt-lg-0 { margin-top: 0 !important; }
    .mt-lg-1 { margin-top: 1px !important; }
    .mt-lg-2 { margin-top: 2px !important; }
    .mt-lg-3 { margin-top: 3px !important; }
    .mt-lg-4 { margin-top: 4px !important; }
    .mt-lg-5 { margin-top: 5px !important; }

    .mr-lg-0 { margin-right: 0 !important; }
    .mr-lg-1 { margin-right: 1px !important; }
    .mr-lg-2 { margin-right: 2px !important; }
    .mr-lg-3 { margin-right: 3px !important; }
    .mr-lg-4 { margin-right: 4px !important; }
    .mr-lg-5 { margin-right: 5px !important; }

    .mb-lg-0 { margin-bottom: 0 !important; }
    .mb-lg-1 { margin-bottom: 1px !important; }
    .mb-lg-2 { margin-bottom: 2px !important; }
    .mb-lg-3 { margin-bottom: 3px !important; }
    .mb-lg-4 { margin-bottom: 4px !important; }
    .mb-lg-5 { margin-bottom: 5px !important; }

    .ml-lg-0 { margin-left: 0 !important; }
    .ml-lg-1 { margin-left: 1px !important; }
    .ml-lg-2 { margin-left: 2px !important; }
    .ml-lg-3 { margin-left: 3px !important; }
    .ml-lg-4 { margin-left: 4px !important; }
    .ml-lg-5 { margin-left: 5px !important; }

    .pt-lg-0 { padding-top: 0 !important; }
    .pt-lg-1 { padding-top: 1px !important; }
    .pt-lg-2 { padding-top: 2px !important; }
    .pt-lg-3 { padding-top: 3px !important; }
    .pt-lg-4 { padding-top: 4px !important; }
    .pt-lg-5 { padding-top: 5px !important; }

    .pr-lg-0 { padding-right: 0 !important; }
    .pr-lg-1 { padding-right: 1px !important; }
    .pr-lg-2 { padding-right: 2px !important; }
    .pr-lg-3 { padding-right: 3px !important; }
    .pr-lg-4 { padding-right: 4px !important; }
    .pr-lg-5 { padding-right: 5px !important; }

    .pb-lg-0 { padding-bottom: 0 !important; }
    .pb-lg-1 { padding-bottom: 1px !important; }
    .pb-lg-2 { padding-bottom: 2px !important; }
    .pb-lg-3 { padding-bottom: 3px !important; }
    .pb-lg-4 { padding-bottom: 4px !important; }
    .pb-lg-5 { padding-bottom: 5px !important; }

    .pl-lg-0 { padding-left: 0 !important; }
    .pl-lg-1 { padding-left: 1px !important; }
    .pl-lg-2 { padding-left: 2px !important; }
    .pl-lg-3 { padding-left: 3px !important; }
    .pl-lg-4 { padding-left: 4px !important; }
    .pl-lg-5 { padding-left: 5px !important; }
}