@pine-ds/core 1.2.0 → 1.3.0-dev.0

package/dist/collection/components/pds-box/pds-box.css

@@ -1,1234 +0,0 @@
-pds-box {
-  --border-width-default: var(--pine-border-width-thin);
-  --color-background-box: inherit;
-  --color-border-box: inherit;
-  --sizing-min-height-box: none;
-  --sizing-min-width-box: none;
-  --spacing-gap-xxs: var(--pine-spacing-050);
-  --spacing-gap-xs: var(--pine-spacing-100);
-  --spacing-gap-sm: var(--pine-spacing-200);
-  --spacing-gap-md: var(--pine-spacing-300);
-  --spacing-gap-lg: var(--pine-spacing-450);
-  --spacing-gap-xl: var(--pine-spacing-600);
-  --spacing-gap-xxl: var(--pine-spacing-800);
-  display: block;
-}
-
-[class*=pds-box] {
-  background-color: var(--color-background-box);
-  box-sizing: border-box;
-  display: inline-flex;
-  min-height: var(--sizing-min-height-box);
-  min-width: var(--sizing-min-width-box);
-}
-.pds-row > [class*=pds-box] {
-  position: relative;
-  width: 100%;
-}
-.pds-row > [class*=pds-box].pds-box--auto {
-  width: auto;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-xxs {
-  margin: 4px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-xs {
-  margin: 8px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-sm {
-  margin: 16px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-md {
-  margin: 24px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-lg {
-  margin: 36px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-xl {
-  margin: 48px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-xxl {
-  margin: 64px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-top-xxs {
-  margin-block-start: 4px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-top-xs {
-  margin-block-start: 8px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-top-sm {
-  margin-block-start: 16px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-top-md {
-  margin-block-start: 24px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-top-lg {
-  margin-block-start: 36px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-top-xl {
-  margin-block-start: 48px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-top-xxl {
-  margin-block-start: 64px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-right-xxs {
-  margin-inline-end: 4px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-right-xs {
-  margin-inline-end: 8px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-right-sm {
-  margin-inline-end: 16px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-right-md {
-  margin-inline-end: 24px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-right-lg {
-  margin-inline-end: 36px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-right-xl {
-  margin-inline-end: 48px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-right-xxl {
-  margin-inline-end: 64px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-left-xxs {
-  margin-inline-start: 4px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-left-xs {
-  margin-inline-start: 8px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-left-sm {
-  margin-inline-start: 16px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-left-md {
-  margin-inline-start: 24px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-left-lg {
-  margin-inline-start: 36px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-left-xl {
-  margin-inline-start: 48px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-left-xxl {
-  margin-inline-start: 64px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-bottom-xxs {
-  margin-block-end: 4px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-bottom-xs {
-  margin-block-end: 8px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-bottom-sm {
-  margin-block-end: 16px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-bottom-md {
-  margin-block-end: 24px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-bottom-lg {
-  margin-block-end: 36px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-bottom-xl {
-  margin-block-end: 48px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-spacing-bottom-xxl {
-  margin-block-end: 64px;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-box-offset-0 {
-  margin-inline-start: 0;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-box-offset-1 {
-  margin-inline-start: 8.3333333333%;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-box-offset-2 {
-  margin-inline-start: 16.6666666667%;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-box-offset-3 {
-  margin-inline-start: 25%;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-box-offset-4 {
-  margin-inline-start: 33.3333333333%;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-box-offset-5 {
-  margin-inline-start: 41.6666666667%;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-box-offset-6 {
-  margin-inline-start: 50%;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-box-offset-7 {
-  margin-inline-start: 58.3333333333%;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-box-offset-8 {
-  margin-inline-start: 66.6666666667%;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-box-offset-9 {
-  margin-inline-start: 75%;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-box-offset-10 {
-  margin-inline-start: 83.3333333333%;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-box-offset-11 {
-  margin-inline-start: 91.6666666667%;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-box-offset-12 {
-  margin-inline-start: 100%;
-}
-
-@media (max-width: 575px) {
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-xs-0 {
-    margin-inline-start: 0;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-xs-1 {
-    margin-inline-start: 8.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-xs-2 {
-    margin-inline-start: 16.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-xs-3 {
-    margin-inline-start: 25%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-xs-4 {
-    margin-inline-start: 33.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-xs-5 {
-    margin-inline-start: 41.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-xs-6 {
-    margin-inline-start: 50%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-xs-7 {
-    margin-inline-start: 58.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-xs-8 {
-    margin-inline-start: 66.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-xs-9 {
-    margin-inline-start: 75%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-xs-10 {
-    margin-inline-start: 83.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-xs-11 {
-    margin-inline-start: 91.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-xs-12 {
-    margin-inline-start: 100%;
-  }
-}
-@media (min-width: 576px) {
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-sm-0 {
-    margin-inline-start: 0;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-sm-1 {
-    margin-inline-start: 8.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-sm-2 {
-    margin-inline-start: 16.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-sm-3 {
-    margin-inline-start: 25%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-sm-4 {
-    margin-inline-start: 33.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-sm-5 {
-    margin-inline-start: 41.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-sm-6 {
-    margin-inline-start: 50%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-sm-7 {
-    margin-inline-start: 58.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-sm-8 {
-    margin-inline-start: 66.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-sm-9 {
-    margin-inline-start: 75%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-sm-10 {
-    margin-inline-start: 83.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-sm-11 {
-    margin-inline-start: 91.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-sm-12 {
-    margin-inline-start: 100%;
-  }
-}
-@media (min-width: 768px) {
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-md-0 {
-    margin-inline-start: 0;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-md-1 {
-    margin-inline-start: 8.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-md-2 {
-    margin-inline-start: 16.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-md-3 {
-    margin-inline-start: 25%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-md-4 {
-    margin-inline-start: 33.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-md-5 {
-    margin-inline-start: 41.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-md-6 {
-    margin-inline-start: 50%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-md-7 {
-    margin-inline-start: 58.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-md-8 {
-    margin-inline-start: 66.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-md-9 {
-    margin-inline-start: 75%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-md-10 {
-    margin-inline-start: 83.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-md-11 {
-    margin-inline-start: 91.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-md-12 {
-    margin-inline-start: 100%;
-  }
-}
-@media (min-width: 992px) {
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-lg-0 {
-    margin-inline-start: 0;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-lg-1 {
-    margin-inline-start: 8.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-lg-2 {
-    margin-inline-start: 16.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-lg-3 {
-    margin-inline-start: 25%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-lg-4 {
-    margin-inline-start: 33.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-lg-5 {
-    margin-inline-start: 41.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-lg-6 {
-    margin-inline-start: 50%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-lg-7 {
-    margin-inline-start: 58.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-lg-8 {
-    margin-inline-start: 66.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-lg-9 {
-    margin-inline-start: 75%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-lg-10 {
-    margin-inline-start: 83.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-lg-11 {
-    margin-inline-start: 91.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-lg-12 {
-    margin-inline-start: 100%;
-  }
-}
-@media (min-width: 1200px) {
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-xl-0 {
-    margin-inline-start: 0;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-xl-1 {
-    margin-inline-start: 8.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-xl-2 {
-    margin-inline-start: 16.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-xl-3 {
-    margin-inline-start: 25%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-xl-4 {
-    margin-inline-start: 33.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-xl-5 {
-    margin-inline-start: 41.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-xl-6 {
-    margin-inline-start: 50%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-xl-7 {
-    margin-inline-start: 58.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-xl-8 {
-    margin-inline-start: 66.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-xl-9 {
-    margin-inline-start: 75%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-xl-10 {
-    margin-inline-start: 83.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-xl-11 {
-    margin-inline-start: 91.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-offset-xl-12 {
-    margin-inline-start: 100%;
-  }
-}
-/* stylelint-disable-next-line function-no-unknown */
-.pds-box-0 {
-  display: none;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-box-1 {
-  display: inline-flex;
-  flex: 8.3333333333%;
-  max-width: 8.3333333333%;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-box-2 {
-  display: inline-flex;
-  flex: 16.6666666667%;
-  max-width: 16.6666666667%;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-box-3 {
-  display: inline-flex;
-  flex: 25%;
-  max-width: 25%;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-box-4 {
-  display: inline-flex;
-  flex: 33.3333333333%;
-  max-width: 33.3333333333%;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-box-5 {
-  display: inline-flex;
-  flex: 41.6666666667%;
-  max-width: 41.6666666667%;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-box-6 {
-  display: inline-flex;
-  flex: 50%;
-  max-width: 50%;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-box-7 {
-  display: inline-flex;
-  flex: 58.3333333333%;
-  max-width: 58.3333333333%;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-box-8 {
-  display: inline-flex;
-  flex: 66.6666666667%;
-  max-width: 66.6666666667%;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-box-9 {
-  display: inline-flex;
-  flex: 75%;
-  max-width: 75%;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-box-10 {
-  display: inline-flex;
-  flex: 83.3333333333%;
-  max-width: 83.3333333333%;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-box-11 {
-  display: inline-flex;
-  flex: 91.6666666667%;
-  max-width: 91.6666666667%;
-}
-
-/* stylelint-disable-next-line function-no-unknown */
-.pds-box-12 {
-  display: inline-flex;
-  flex: 100%;
-  max-width: 100%;
-}
-
-@media (max-width: 575px) {
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-xs-0 {
-    display: none;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-xs-1 {
-    display: inline-flex;
-    flex: 8.3333333333%;
-    max-width: 8.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-xs-2 {
-    display: inline-flex;
-    flex: 16.6666666667%;
-    max-width: 16.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-xs-3 {
-    display: inline-flex;
-    flex: 25%;
-    max-width: 25%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-xs-4 {
-    display: inline-flex;
-    flex: 33.3333333333%;
-    max-width: 33.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-xs-5 {
-    display: inline-flex;
-    flex: 41.6666666667%;
-    max-width: 41.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-xs-6 {
-    display: inline-flex;
-    flex: 50%;
-    max-width: 50%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-xs-7 {
-    display: inline-flex;
-    flex: 58.3333333333%;
-    max-width: 58.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-xs-8 {
-    display: inline-flex;
-    flex: 66.6666666667%;
-    max-width: 66.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-xs-9 {
-    display: inline-flex;
-    flex: 75%;
-    max-width: 75%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-xs-10 {
-    display: inline-flex;
-    flex: 83.3333333333%;
-    max-width: 83.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-xs-11 {
-    display: inline-flex;
-    flex: 91.6666666667%;
-    max-width: 91.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-xs-12 {
-    display: inline-flex;
-    flex: 100%;
-    max-width: 100%;
-  }
-}
-@media (min-width: 576px) {
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-sm-0 {
-    display: none;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-sm-1 {
-    display: inline-flex;
-    flex: 8.3333333333%;
-    max-width: 8.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-sm-2 {
-    display: inline-flex;
-    flex: 16.6666666667%;
-    max-width: 16.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-sm-3 {
-    display: inline-flex;
-    flex: 25%;
-    max-width: 25%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-sm-4 {
-    display: inline-flex;
-    flex: 33.3333333333%;
-    max-width: 33.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-sm-5 {
-    display: inline-flex;
-    flex: 41.6666666667%;
-    max-width: 41.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-sm-6 {
-    display: inline-flex;
-    flex: 50%;
-    max-width: 50%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-sm-7 {
-    display: inline-flex;
-    flex: 58.3333333333%;
-    max-width: 58.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-sm-8 {
-    display: inline-flex;
-    flex: 66.6666666667%;
-    max-width: 66.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-sm-9 {
-    display: inline-flex;
-    flex: 75%;
-    max-width: 75%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-sm-10 {
-    display: inline-flex;
-    flex: 83.3333333333%;
-    max-width: 83.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-sm-11 {
-    display: inline-flex;
-    flex: 91.6666666667%;
-    max-width: 91.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-sm-12 {
-    display: inline-flex;
-    flex: 100%;
-    max-width: 100%;
-  }
-}
-@media (min-width: 768px) {
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-md-0 {
-    display: none;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-md-1 {
-    display: inline-flex;
-    flex: 8.3333333333%;
-    max-width: 8.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-md-2 {
-    display: inline-flex;
-    flex: 16.6666666667%;
-    max-width: 16.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-md-3 {
-    display: inline-flex;
-    flex: 25%;
-    max-width: 25%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-md-4 {
-    display: inline-flex;
-    flex: 33.3333333333%;
-    max-width: 33.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-md-5 {
-    display: inline-flex;
-    flex: 41.6666666667%;
-    max-width: 41.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-md-6 {
-    display: inline-flex;
-    flex: 50%;
-    max-width: 50%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-md-7 {
-    display: inline-flex;
-    flex: 58.3333333333%;
-    max-width: 58.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-md-8 {
-    display: inline-flex;
-    flex: 66.6666666667%;
-    max-width: 66.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-md-9 {
-    display: inline-flex;
-    flex: 75%;
-    max-width: 75%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-md-10 {
-    display: inline-flex;
-    flex: 83.3333333333%;
-    max-width: 83.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-md-11 {
-    display: inline-flex;
-    flex: 91.6666666667%;
-    max-width: 91.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-md-12 {
-    display: inline-flex;
-    flex: 100%;
-    max-width: 100%;
-  }
-}
-@media (min-width: 992px) {
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-lg-0 {
-    display: none;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-lg-1 {
-    display: inline-flex;
-    flex: 8.3333333333%;
-    max-width: 8.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-lg-2 {
-    display: inline-flex;
-    flex: 16.6666666667%;
-    max-width: 16.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-lg-3 {
-    display: inline-flex;
-    flex: 25%;
-    max-width: 25%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-lg-4 {
-    display: inline-flex;
-    flex: 33.3333333333%;
-    max-width: 33.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-lg-5 {
-    display: inline-flex;
-    flex: 41.6666666667%;
-    max-width: 41.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-lg-6 {
-    display: inline-flex;
-    flex: 50%;
-    max-width: 50%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-lg-7 {
-    display: inline-flex;
-    flex: 58.3333333333%;
-    max-width: 58.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-lg-8 {
-    display: inline-flex;
-    flex: 66.6666666667%;
-    max-width: 66.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-lg-9 {
-    display: inline-flex;
-    flex: 75%;
-    max-width: 75%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-lg-10 {
-    display: inline-flex;
-    flex: 83.3333333333%;
-    max-width: 83.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-lg-11 {
-    display: inline-flex;
-    flex: 91.6666666667%;
-    max-width: 91.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-lg-12 {
-    display: inline-flex;
-    flex: 100%;
-    max-width: 100%;
-  }
-}
-@media (min-width: 1200px) {
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-xl-0 {
-    display: none;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-xl-1 {
-    display: inline-flex;
-    flex: 8.3333333333%;
-    max-width: 8.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-xl-2 {
-    display: inline-flex;
-    flex: 16.6666666667%;
-    max-width: 16.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-xl-3 {
-    display: inline-flex;
-    flex: 25%;
-    max-width: 25%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-xl-4 {
-    display: inline-flex;
-    flex: 33.3333333333%;
-    max-width: 33.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-xl-5 {
-    display: inline-flex;
-    flex: 41.6666666667%;
-    max-width: 41.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-xl-6 {
-    display: inline-flex;
-    flex: 50%;
-    max-width: 50%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-xl-7 {
-    display: inline-flex;
-    flex: 58.3333333333%;
-    max-width: 58.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-xl-8 {
-    display: inline-flex;
-    flex: 66.6666666667%;
-    max-width: 66.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-xl-9 {
-    display: inline-flex;
-    flex: 75%;
-    max-width: 75%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-xl-10 {
-    display: inline-flex;
-    flex: 83.3333333333%;
-    max-width: 83.3333333333%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-xl-11 {
-    display: inline-flex;
-    flex: 91.6666666667%;
-    max-width: 91.6666666667%;
-  }
-  /* stylelint-disable-next-line function-no-unknown */
-  .pds-box-xl-12 {
-    display: inline-flex;
-    flex: 100%;
-    max-width: 100%;
-  }
-}
-.pds-box {
-  flex-basis: 0;
-  flex-grow: 1;
-}
-
-.pds-box--auto {
-  flex: 0 0 var(--sizing-min-width-box, fit-content);
-  min-width: auto;
-  width: auto;
-}
-
-.pds-box--fit {
-  max-width: 100%;
-  min-width: 100%;
-  width: 100%;
-}
-
-.pds-box--border {
-  border-color: var(--color-border-box, var(--pine-color-grey-300));
-  border-style: solid;
-  border-width: var(--border-width-default);
-}
-
-.pds-box--display-flex {
-  display: flex;
-}
-
-.pds-box--display-inline-flex {
-  display: inline-flex;
-}
-
-.pds-box--display-block {
-  display: block;
-}
-
-.pds-box--display-inline-block {
-  display: inline-block;
-}
-
-.pds-box--flex-none {
-  flex: 0 0 auto;
-}
-
-.pds-box--flex-grow {
-  flex: 1 1 auto;
-}
-
-.pds-box--flex-shrink {
-  flex: 0 0 auto;
-}
-
-.pds-border-radius-none {
-  border-radius: 0;
-}
-
-.pds-border-radius-xs {
-  border-radius: var(--pine-border-radius-xs);
-}
-
-.pds-border-radius-sm {
-  border-radius: var(--pine-border-radius-sm);
-}
-
-.pds-border-radius-md {
-  border-radius: var(--pine-border-radius-md);
-}
-
-.pds-border-radius-lg {
-  border-radius: var(--pine-border-radius-lg);
-}
-
-.pds-border-radius-circle {
-  border-radius: 50%;
-}
-
-.pds-shadow-xs {
-  box-shadow: var(--pine-box-shadow-xs);
-}
-
-.pds-shadow-sm {
-  box-shadow: var(--pine-box-shadow-sm);
-}
-
-.pds-shadow-md {
-  box-shadow: var(--pine-box-shadow-md);
-}
-
-.pds-shadow-lg {
-  box-shadow: var(--pine-box-shadow-lg);
-}
-
-.pds-box-gap-none {
-  gap: 0;
-}
-
-.pds-box-gap-xxs {
-  gap: var(--spacing-gap-xxs);
-}
-
-.pds-box-gap-xs {
-  gap: var(--spacing-gap-xs);
-}
-
-.pds-box-gap-sm {
-  gap: var(--spacing-gap-sm);
-}
-
-.pds-box-gap-md {
-  gap: var(--spacing-gap-md);
-}
-
-.pds-box-gap-lg {
-  gap: var(--spacing-gap-lg);
-}
-
-.pds-box-gap-xl {
-  gap: var(--spacing-gap-xl);
-}
-
-.pds-box-gap-xxl {
-  gap: var(--spacing-gap-xxl);
-}
-
-.pds-padding-none {
-  padding: 0;
-}
-
-.pds-padding-xxs {
-  padding: var(--spacing-gap-xxs);
-}
-
-.pds-padding-xs {
-  padding: var(--spacing-gap-xxs);
-}
-
-.pds-padding-sm {
-  padding: var(--spacing-gap-sm);
-}
-
-.pds-padding-md {
-  padding: var(--spacing-gap-md);
-}
-
-.pds-padding-lg {
-  padding: var(--spacing-gap-lg);
-}
-
-.pds-padding-xl {
-  padding: var(--spacing-gap-xl);
-}
-
-.pds-padding-xxl {
-  padding: var(--spacing-gap-xxl);
-}
-
-.pds-box-display-flex {
-  display: flex;
-}
-
-.pds-box-display-inline-flex {
-  display: inline-flex;
-}
-
-.pds-box-direction-row {
-  flex-direction: row;
-}
-
-.pds-box-direction-column {
-  flex-direction: column;
-}
-
-.pds-justify-content-start {
-  justify-content: start;
-}
-
-.pds-justify-content-center {
-  justify-content: center;
-}
-
-.pds-justify-content-end {
-  justify-content: end;
-}
-
-.pds-justify-content-space-between {
-  justify-content: space-between;
-}
-
-.pds-justify-content-space-around {
-  justify-content: space-around;
-}
-
-.pds-justify-content-space-evenly {
-  justify-content: space-evenly;
-}
-
-.pds-align-items-start {
-  align-items: start;
-}
-
-.pds-align-items-center {
-  align-items: center;
-}
-
-.pds-align-items-end {
-  align-items: end;
-}
-
-.pds-align-items-stretch {
-  align-items: stretch;
-}
-
-.pds-align-items-baseline {
-  align-items: baseline;
-}