@lightspeed/design-system-css 24.0.0 → 25.0.0

package/dist/index.css

@@ -647,62 +647,50 @@ details,
     flex: 0 0 8.3333333333%;
     max-width: 8.3333333333%;
   }
-
   .vd-g-xs-2 {
     flex: 0 0 16.6666666667%;
     max-width: 16.6666666667%;
   }
-
   .vd-g-xs-3 {
     flex: 0 0 25%;
     max-width: 25%;
   }
-
   .vd-g-xs-4 {
     flex: 0 0 33.3333333333%;
     max-width: 33.3333333333%;
   }
-
   .vd-g-xs-5 {
     flex: 0 0 41.6666666667%;
     max-width: 41.6666666667%;
   }
-
   .vd-g-xs-6 {
     flex: 0 0 50%;
     max-width: 50%;
   }
-
   .vd-g-xs-7 {
     flex: 0 0 58.3333333333%;
     max-width: 58.3333333333%;
   }
-
   .vd-g-xs-8 {
     flex: 0 0 66.6666666667%;
     max-width: 66.6666666667%;
   }
-
   .vd-g-xs-9 {
     flex: 0 0 75%;
     max-width: 75%;
   }
-
   .vd-g-xs-10 {
     flex: 0 0 83.3333333333%;
     max-width: 83.3333333333%;
   }
-
   .vd-g-xs-11 {
     flex: 0 0 91.6666666667%;
     max-width: 91.6666666667%;
   }
-
   .vd-g-xs-12 {
     flex: 0 0 100%;
     max-width: 100%;
   }
-
   .vd-g-xs-up-1 {
     flex-wrap: wrap;
   }
@@ -710,7 +698,6 @@ details,
     flex: 0 0 100%;
     max-width: 100%;
   }
-
   .vd-g-xs-up-2 {
     flex-wrap: wrap;
   }
@@ -718,7 +705,6 @@ details,
     flex: 0 0 50%;
     max-width: 50%;
   }
-
   .vd-g-xs-up-3 {
     flex-wrap: wrap;
   }
@@ -726,7 +712,6 @@ details,
     flex: 0 0 33.3333333333%;
     max-width: 33.3333333333%;
   }
-
   .vd-g-xs-up-4 {
     flex-wrap: wrap;
   }
@@ -734,7 +719,6 @@ details,
     flex: 0 0 25%;
     max-width: 25%;
   }
-
   .vd-g-xs-up-5 {
     flex-wrap: wrap;
   }
@@ -742,7 +726,6 @@ details,
     flex: 0 0 20%;
     max-width: 20%;
   }
-
   .vd-g-xs-up-6 {
     flex-wrap: wrap;
   }
@@ -750,7 +733,6 @@ details,
     flex: 0 0 16.6666666667%;
     max-width: 16.6666666667%;
   }
-
   .vd-g-xs-up-7 {
     flex-wrap: wrap;
   }
@@ -758,7 +740,6 @@ details,
     flex: 0 0 14.2857142857%;
     max-width: 14.2857142857%;
   }
-
   .vd-g-xs-up-8 {
     flex-wrap: wrap;
   }
@@ -772,62 +753,50 @@ details,
     flex: 0 0 8.3333333333%;
     max-width: 8.3333333333%;
   }
-
   .vd-g-m-2 {
     flex: 0 0 16.6666666667%;
     max-width: 16.6666666667%;
   }
-
   .vd-g-m-3 {
     flex: 0 0 25%;
     max-width: 25%;
   }
-
   .vd-g-m-4 {
     flex: 0 0 33.3333333333%;
     max-width: 33.3333333333%;
   }
-
   .vd-g-m-5 {
     flex: 0 0 41.6666666667%;
     max-width: 41.6666666667%;
   }
-
   .vd-g-m-6 {
     flex: 0 0 50%;
     max-width: 50%;
   }
-
   .vd-g-m-7 {
     flex: 0 0 58.3333333333%;
     max-width: 58.3333333333%;
   }
-
   .vd-g-m-8 {
     flex: 0 0 66.6666666667%;
     max-width: 66.6666666667%;
   }
-
   .vd-g-m-9 {
     flex: 0 0 75%;
     max-width: 75%;
   }
-
   .vd-g-m-10 {
     flex: 0 0 83.3333333333%;
     max-width: 83.3333333333%;
   }
-
   .vd-g-m-11 {
     flex: 0 0 91.6666666667%;
     max-width: 91.6666666667%;
   }
-
   .vd-g-m-12 {
     flex: 0 0 100%;
     max-width: 100%;
   }
-
   .vd-g-m-up-1 {
     flex-wrap: wrap;
   }
@@ -835,7 +804,6 @@ details,
     flex: 0 0 100%;
     max-width: 100%;
   }
-
   .vd-g-m-up-2 {
     flex-wrap: wrap;
   }
@@ -843,7 +811,6 @@ details,
     flex: 0 0 50%;
     max-width: 50%;
   }
-
   .vd-g-m-up-3 {
     flex-wrap: wrap;
   }
@@ -851,7 +818,6 @@ details,
     flex: 0 0 33.3333333333%;
     max-width: 33.3333333333%;
   }
-
   .vd-g-m-up-4 {
     flex-wrap: wrap;
   }
@@ -859,7 +825,6 @@ details,
     flex: 0 0 25%;
     max-width: 25%;
   }
-
   .vd-g-m-up-5 {
     flex-wrap: wrap;
   }
@@ -867,7 +832,6 @@ details,
     flex: 0 0 20%;
     max-width: 20%;
   }
-
   .vd-g-m-up-6 {
     flex-wrap: wrap;
   }
@@ -875,7 +839,6 @@ details,
     flex: 0 0 16.6666666667%;
     max-width: 16.6666666667%;
   }
-
   .vd-g-m-up-7 {
     flex-wrap: wrap;
   }
@@ -883,7 +846,6 @@ details,
     flex: 0 0 14.2857142857%;
     max-width: 14.2857142857%;
   }
-
   .vd-g-m-up-8 {
     flex-wrap: wrap;
   }
@@ -897,62 +859,50 @@ details,
     flex: 0 0 8.3333333333%;
     max-width: 8.3333333333%;
   }
-
   .vd-g-l-2 {
     flex: 0 0 16.6666666667%;
     max-width: 16.6666666667%;
   }
-
   .vd-g-l-3 {
     flex: 0 0 25%;
     max-width: 25%;
   }
-
   .vd-g-l-4 {
     flex: 0 0 33.3333333333%;
     max-width: 33.3333333333%;
   }
-
   .vd-g-l-5 {
     flex: 0 0 41.6666666667%;
     max-width: 41.6666666667%;
   }
-
   .vd-g-l-6 {
     flex: 0 0 50%;
     max-width: 50%;
   }
-
   .vd-g-l-7 {
     flex: 0 0 58.3333333333%;
     max-width: 58.3333333333%;
   }
-
   .vd-g-l-8 {
     flex: 0 0 66.6666666667%;
     max-width: 66.6666666667%;
   }
-
   .vd-g-l-9 {
     flex: 0 0 75%;
     max-width: 75%;
   }
-
   .vd-g-l-10 {
     flex: 0 0 83.3333333333%;
     max-width: 83.3333333333%;
   }
-
   .vd-g-l-11 {
     flex: 0 0 91.6666666667%;
     max-width: 91.6666666667%;
   }
-
   .vd-g-l-12 {
     flex: 0 0 100%;
     max-width: 100%;
   }
-
   .vd-g-l-up-1 {
     flex-wrap: wrap;
   }
@@ -960,7 +910,6 @@ details,
     flex: 0 0 100%;
     max-width: 100%;
   }
-
   .vd-g-l-up-2 {
     flex-wrap: wrap;
   }
@@ -968,7 +917,6 @@ details,
     flex: 0 0 50%;
     max-width: 50%;
   }
-
   .vd-g-l-up-3 {
     flex-wrap: wrap;
   }
@@ -976,7 +924,6 @@ details,
     flex: 0 0 33.3333333333%;
     max-width: 33.3333333333%;
   }
-
   .vd-g-l-up-4 {
     flex-wrap: wrap;
   }
@@ -984,7 +931,6 @@ details,
     flex: 0 0 25%;
     max-width: 25%;
   }
-
   .vd-g-l-up-5 {
     flex-wrap: wrap;
   }
@@ -992,7 +938,6 @@ details,
     flex: 0 0 20%;
     max-width: 20%;
   }
-
   .vd-g-l-up-6 {
     flex-wrap: wrap;
   }
@@ -1000,7 +945,6 @@ details,
     flex: 0 0 16.6666666667%;
     max-width: 16.6666666667%;
   }
-
   .vd-g-l-up-7 {
     flex-wrap: wrap;
   }
@@ -1008,7 +952,6 @@ details,
     flex: 0 0 14.2857142857%;
     max-width: 14.2857142857%;
   }
-
   .vd-g-l-up-8 {
     flex-wrap: wrap;
   }
@@ -1022,62 +965,50 @@ details,
     flex: 0 0 8.3333333333%;
     max-width: 8.3333333333%;
   }
-
   .vd-g-xl-2 {
     flex: 0 0 16.6666666667%;
     max-width: 16.6666666667%;
   }
-
   .vd-g-xl-3 {
     flex: 0 0 25%;
     max-width: 25%;
   }
-
   .vd-g-xl-4 {
     flex: 0 0 33.3333333333%;
     max-width: 33.3333333333%;
   }
-
   .vd-g-xl-5 {
     flex: 0 0 41.6666666667%;
     max-width: 41.6666666667%;
   }
-
   .vd-g-xl-6 {
     flex: 0 0 50%;
     max-width: 50%;
   }
-
   .vd-g-xl-7 {
     flex: 0 0 58.3333333333%;
     max-width: 58.3333333333%;
   }
-
   .vd-g-xl-8 {
     flex: 0 0 66.6666666667%;
     max-width: 66.6666666667%;
   }
-
   .vd-g-xl-9 {
     flex: 0 0 75%;
     max-width: 75%;
   }
-
   .vd-g-xl-10 {
     flex: 0 0 83.3333333333%;
     max-width: 83.3333333333%;
   }
-
   .vd-g-xl-11 {
     flex: 0 0 91.6666666667%;
     max-width: 91.6666666667%;
   }
-
   .vd-g-xl-12 {
     flex: 0 0 100%;
     max-width: 100%;
   }
-
   .vd-g-xl-up-1 {
     flex-wrap: wrap;
   }
@@ -1085,7 +1016,6 @@ details,
     flex: 0 0 100%;
     max-width: 100%;
   }
-
   .vd-g-xl-up-2 {
     flex-wrap: wrap;
   }
@@ -1093,7 +1023,6 @@ details,
     flex: 0 0 50%;
     max-width: 50%;
   }
-
   .vd-g-xl-up-3 {
     flex-wrap: wrap;
   }
@@ -1101,7 +1030,6 @@ details,
     flex: 0 0 33.3333333333%;
     max-width: 33.3333333333%;
   }
-
   .vd-g-xl-up-4 {
     flex-wrap: wrap;
   }
@@ -1109,7 +1037,6 @@ details,
     flex: 0 0 25%;
     max-width: 25%;
   }
-
   .vd-g-xl-up-5 {
     flex-wrap: wrap;
   }
@@ -1117,7 +1044,6 @@ details,
     flex: 0 0 20%;
     max-width: 20%;
   }
-
   .vd-g-xl-up-6 {
     flex-wrap: wrap;
   }
@@ -1125,7 +1051,6 @@ details,
     flex: 0 0 16.6666666667%;
     max-width: 16.6666666667%;
   }
-
   .vd-g-xl-up-7 {
     flex-wrap: wrap;
   }
@@ -1133,7 +1058,6 @@ details,
     flex: 0 0 14.2857142857%;
     max-width: 14.2857142857%;
   }
-
   .vd-g-xl-up-8 {
     flex-wrap: wrap;
   }
@@ -1717,7 +1641,6 @@ details,
     grid-column-gap: 4px;
     row-gap: 4px;
   }
-
   .vd-avatar-multi-tile:only-child {
     grid-area: 2 span/2 span;
   }
@@ -1732,7 +1655,6 @@ details,
     width: 76px;
     height: 76px;
   }
-
   .vd-avatar-multi-tile {
     flex: 1 1 50%;
     border: 2px solid var(--vd-colour--box);
@@ -1779,7 +1701,7 @@ details,
 }
 @supports not (--a: 0) {
   .vd-banner-wrapper,
-.vd-banner-feedback {
+  .vd-banner-feedback {
     padding: 24px 48px;
   }
 }
@@ -1860,7 +1782,7 @@ details,
 
 @media only screen and (max-width: 1000px) {
   .vd-banner-wrapper,
-.vd-banner-feedback {
+  .vd-banner-feedback {
     box-sizing: border-box;
     flex: 1 0 100%;
   }
@@ -2856,7 +2778,7 @@ vd-carousel-frame {
 }
 @media only screen and (max-width: 480px) {
   .vd-datepicker .pika-title .pika-select,
-.vd-datepicker-range .pika-title .pika-select {
+  .vd-datepicker-range .pika-title .pika-select {
     font-size: 16px;
   }
 }
@@ -3231,15 +3153,12 @@ vd-carousel-frame {
   .vd-dialog .vd-dialog-banner .vd-banner-wrapper {
     padding: 16px 32px;
   }
-
   .vd-dialog-container {
     padding: 32px;
   }
-
   .vd-dialog-header {
     margin-bottom: 32px;
   }
-
   .vd-dialog-content {
     margin: 0-32px;
     padding: 0 32px;
@@ -3488,7 +3407,6 @@ vd-dott,
   .vd-fieldset .vd-field {
     margin-top: inherit;
   }
-
   .vd-field--short {
     max-width: initial;
     margin-right: 0;
@@ -4874,18 +4792,18 @@ vd-section .vd-section,
 }
 @supports not (--a: 0) {
   vd-section,
-.vd-section {
+  .vd-section {
     padding: 24px 48px;
   }
   vd-section .vd-section-container,
-.vd-section .vd-section-container {
+  .vd-section .vd-section-container {
     margin: -24px -48px;
     padding: 24px 48px;
   }
   vd-section vd-section,
-vd-section .vd-section,
-.vd-section vd-section,
-.vd-section .vd-section {
+  vd-section .vd-section,
+  .vd-section vd-section,
+  .vd-section .vd-section {
     padding: 24px 0;
   }
 }
@@ -5781,17 +5699,14 @@ table {
   .vd-show-mobile {
     display: block !important;
   }
-
   table.vd-show-mobile {
     display: table !important;
   }
-
   tr.vd-show-mobile {
     display: table-row !important;
   }
-
   th.vd-show-mobile,
-td.vd-show-mobile {
+  td.vd-show-mobile {
     display: table-cell !important;
   }
 }
@@ -5799,17 +5714,14 @@ td.vd-show-mobile {
   .vd-show-tablet-portrait {
     display: block !important;
   }
-
   table.vd-show-tablet-portrait {
     display: table !important;
   }
-
   tr.vd-show-tablet-portrait {
     display: table-row !important;
   }
-
   th.vd-show-tablet-portrait,
-td.vd-show-tablet-portrait {
+  td.vd-show-tablet-portrait {
     display: table-cell !important;
   }
 }
@@ -5817,17 +5729,14 @@ td.vd-show-tablet-portrait {
   .vd-show-tablet-landscape {
     display: block !important;
   }
-
   table.vd-show-tablet-landscape {
     display: table !important;
   }
-
   tr.vd-show-tablet-landscape {
     display: table-row !important;
   }
-
   th.vd-show-tablet-landscape,
-td.vd-show-tablet-landscape {
+  td.vd-show-tablet-landscape {
     display: table-cell !important;
   }
 }
@@ -5835,17 +5744,14 @@ td.vd-show-tablet-landscape {
   .vd-show-desktop {
     display: block !important;
   }
-
   table.vd-show-desktop {
     display: table !important;
   }
-
   tr.vd-show-desktop {
     display: table-row !important;
   }
-
   th.vd-show-desktop,
-td.vd-show-desktop {
+  td.vd-show-desktop {
     display: table-cell !important;
   }
 }
@@ -5853,9 +5759,8 @@ td.vd-show-desktop {
   .vd-hide-mobile {
     display: none !important;
   }
-
   th.vd-hide-mobile,
-td.vd-hide-mobile {
+  td.vd-hide-mobile {
     display: table-cell !important;
     white-space: nowrap !important;
     visibility: collapse !important;
@@ -5866,9 +5771,8 @@ td.vd-hide-mobile {
   .vd-hide-tablet-portrait {
     display: none !important;
   }
-
   th.vd-hide-tablet-portrait,
-td.vd-hide-tablet-portrait {
+  td.vd-hide-tablet-portrait {
     display: table-cell !important;
     white-space: nowrap !important;
     visibility: collapse !important;
@@ -5879,9 +5783,8 @@ td.vd-hide-tablet-portrait {
   .vd-hide-tablet-landscape {
     display: none !important;
   }
-
   th.vd-hide-tablet-landscape,
-td.vd-hide-tablet-landscape {
+  td.vd-hide-tablet-landscape {
     display: table-cell !important;
     white-space: nowrap !important;
     visibility: collapse !important;
@@ -5892,9 +5795,8 @@ td.vd-hide-tablet-landscape {
   .vd-hide-desktop {
     display: none !important;
   }
-
   th.vd-hide-desktop,
-td.vd-hide-desktop {
+  td.vd-hide-desktop {
     display: table-cell !important;
     white-space: nowrap !important;
     visibility: collapse !important;
@@ -5917,26 +5819,21 @@ td.vd-show-print {
   .vd-show-print {
     display: block !important;
   }
-
   table.vd-show-print {
     display: table !important;
   }
-
   tr.vd-show-print {
     display: table-row !important;
   }
-
   th.vd-show-print,
-td.vd-show-print {
+  td.vd-show-print {
     display: table-cell !important;
   }
-
   .vd-hide-print {
     display: none !important;
   }
-
   th.vd-hide-print,
-td.vd-hide-print {
+  td.vd-hide-print {
     display: table-cell !important;
     white-space: nowrap !important;
     visibility: collapse !important;
@@ -5995,11 +5892,9 @@ td.vd-hide-print {
   .vd-next-stepper-summary {
     flex-direction: column;
   }
-
   .vd-next-stepper-header {
     padding: 0 0 8px 0;
   }
-
   .vd-next-stepper-why {
     align-self: flex-end;
   }
@@ -6677,15 +6572,13 @@ td.vd-hide-print {
   .vd-flex--responsive-column:last-child {
     margin-bottom: 0;
   }
-
   .vd-flex--settings-explanation {
     flex: initial;
     display: block;
     padding-right: 0;
   }
-
   .vd-flex--settings,
-.vd-flex--row {
+  .vd-flex--row {
     flex-direction: column;
   }
 }
@@ -7060,7 +6953,7 @@ td.vd-hide-print {
 }
 @media only screen and (max-width: 480px) {
   .react-datepicker__month-select,
-.react-datepicker__year-select {
+  .react-datepicker__year-select {
     font-size: 16px;
   }
 }
@@ -7845,7 +7738,6 @@ td.vd-hide-print {
     font-size: 15px;
     max-width: 42px;
   }
-
   .code-input--separated {
     margin-right: 12px;
   }