 .colspan-null {
     display: table-cell;
     width: auto;
 }

 .colspan-data {
     display: table-cell;
     width: auto;
 }

 @media screen and (max-width: 600px) {
     .responsiveTable.table-responsive {
         display: block;
         width: 100%;
         overflow-x: auto;
         -webkit-overflow-scrolling: touch;
     }

     .responsiveTable .table thead th,
     .responsiveTable .table td,
     .responsiveTable .table th {
         white-space: nowrap;
     }

     .responsiveTable .table tbody tr {
         margin-bottom: 2rem;
         border-radius: .5rem;
         padding: 5px;
     }

     .responsiveTable .table thead,
     .responsiveTable .table tbody,
     .responsiveTable .table th,
     .responsiveTable .table td,
     .responsiveTable .table tr {
         display: block;
     }

     .responsiveTable .table thead tr {
         position: absolute;
         top: -9999px;
         left: -9999px;
     }

     .responsiveTable .table td:last-child {
         border: 0;
     }

     .responsiveTable .table td {
         display: flex;
         align-items: center;
         justify-content: space-between;
         flex-wrap: wrap;
         text-wrap: wrap;
         gap: 10px;
     }

     .responsiveTable .table tr {
         border: 1px solid var(--border-color);
     }

     .responsiveTable .table td {
         border: none;
         border-bottom: 1px solid var(--border-color);
         position: relative;
         padding-left: 50%;
     }

     .responsiveTable .table td:before {
         position: absolute;
         top: 12px;
         left: 6px;
         width: 45%;
         padding-right: 10px;
         white-space: nowrap;
         content: attr(data-label);
         font-weight: bold;
     }

     .responsiveTable .table td div {
         display: flex;
         align-items: center;
         flex-wrap: wrap;
         text-wrap: wrap;
     }

     .responsiveTable .table td a {
         text-wrap: wrap;
     }

     .viewItems {
         font-size: 1.2rem !important;
     }

     td.text-center {
         text-align: inherit !important;
     }

     .colspan-null {
         display: none;
         padding-left: 0 !important;
     }

     .colspan-data {
         display: block;
         width: 100%;
         box-sizing: border-box;
         padding-left: 0 !important;
     }

     .colspan-data .bottomPrice {
         display: flex;
         flex-direction: column;
         width: 100%;
     }

     .colspan-data .bottomPrice p,
     .colspan-data .bottomPrice h4 {
         width: 100%;
     }

     td.actionTd .btn-group {
         gap: 10px;
     }

     .sm-pl-0 {
         padding-left: 0 !important;
     }

     .sm-mt-10 {
         margin-top: 10px !important;
     }

     .responsiveTable .table td.action {
         display: flex;
         align-items: center;
         justify-content: space-around !important;
         flex-wrap: wrap;
         gap: 10px;
     }

     .p-sm-0 {
         padding: 0;
     }

     .sm-column-reverse {
         flex-direction: column-reverse;
     }

     .sm-mb-15 {
         margin-bottom: 15px !important;
     }
 }

 .pt-5 {
     padding-top: 10px !important;
 }

 .table tr td .viewItems {
     display: flex;
     align-items: center;
     justify-content: center;
     flex-wrap: wrap;
 }

 .text-wrap-wrap {
     text-wrap: wrap;
 }

 input:-webkit-autofill {
     -webkit-box-shadow: 0 0 0px 1000px var(--background-color) inset !important;
     box-shadow: 0 0 0px 1000px var(--background-color) inset !important;
     -webkit-text-fill-color: var(--color) !important;
     color: var(--color) !important;
     border: 1px solid var(--border-color) !important;
 }

 input:-webkit-autofill:hover,
 input:-webkit-autofill:focus {
     -webkit-box-shadow: 0 0 0px 1000px var(--background-color) inset !important;
     box-shadow: 0 0 0px 1000px var(--background-color) inset !important;
     -webkit-text-fill-color: var(--color) !important;
     border: 1px solid var(--border-color) !important;
 }