.x-uppercase {
  text-transform: uppercase;
}

.x-lowercase {
  text-transform: lowercase;
}

.x-capitalize {
  text-transform: capitalize;
}

.x-normal-case {
  text-transform: none;
}

.x-static {
  position: static !important;
}

.x-fixed {
  position: fixed !important;
}

.x-absolute {
  position: absolute !important;
}

.x-relative {
  position: relative !important;
}

.x-sticky {
  position: sticky !important;
}
.x-underline {
  -webkit-text-decoration-line: underline;
          text-decoration-line: underline;
}

.x-overline {
  -webkit-text-decoration-line: overline;
          text-decoration-line: overline;
}

.x-line-through {
  -webkit-text-decoration-line: line-through;
          text-decoration-line: line-through;
}

.x-no-underline {
  -webkit-text-decoration-line: none;
          text-decoration-line: none;
}
.x-padding--00 {
  padding: 0 !important;
}
.x-padding--01 {
  padding: var(--x-size-base-01) !important;
}
.x-padding--02 {
  padding: var(--x-size-base-02) !important;
}
.x-padding--03 {
  padding: var(--x-size-base-03) !important;
}
.x-padding--04 {
  padding: var(--x-size-base-04) !important;
}
.x-padding--05 {
  padding: var(--x-size-base-05) !important;
}
.x-padding--06 {
  padding: var(--x-size-base-06) !important;
}
.x-padding--07 {
  padding: var(--x-size-base-07) !important;
}
.x-padding--08 {
  padding: var(--x-size-base-08) !important;
}
.x-padding--09 {
  padding: var(--x-size-base-09) !important;
}
.x-padding--10 {
  padding: var(--x-size-base-10) !important;
}
.x-padding--11 {
  padding: var(--x-size-base-11) !important;
}
.x-padding--12 {
  padding: var(--x-size-base-12) !important;
}
.x-padding--13 {
  padding: var(--x-size-base-13) !important;
}
.x-padding--14 {
  padding: var(--x-size-base-14) !important;
}
.x-padding--15 {
  padding: var(--x-size-base-15) !important;
}
.x-padding--16 {
  padding: var(--x-size-base-16) !important;
}
.x-padding--17 {
  padding: var(--x-size-base-17) !important;
}
.x-padding--18 {
  padding: var(--x-size-base-18) !important;
}
.x-padding--19 {
  padding: var(--x-size-base-19) !important;
}
.x-padding--20 {
  padding: var(--x-size-base-20) !important;
}
.x-padding--top-00 {
  padding-top: 0 !important;
}
.x-padding--bottom-00 {
  padding-bottom: 0 !important;
}
[dir="ltr"] .x-padding--right-00 {
  padding-right: 0 !important;
}
[dir="rtl"] .x-padding--right-00 {
  padding-left: 0 !important;
}
[dir="ltr"] .x-padding--left-00 {
  padding-left: 0 !important;
}
[dir="rtl"] .x-padding--left-00 {
  padding-right: 0 !important;
}
.x-padding--top-01 {
  padding-top: var(--x-size-base-01) !important;
}
.x-padding--bottom-01 {
  padding-bottom: var(--x-size-base-01) !important;
}
[dir="ltr"] .x-padding--right-01 {
  padding-right: var(--x-size-base-01) !important;
}
[dir="rtl"] .x-padding--right-01 {
  padding-left: var(--x-size-base-01) !important;
}
[dir="ltr"] .x-padding--left-01 {
  padding-left: var(--x-size-base-01) !important;
}
[dir="rtl"] .x-padding--left-01 {
  padding-right: var(--x-size-base-01) !important;
}
.x-padding--top-02 {
  padding-top: var(--x-size-base-02) !important;
}
.x-padding--bottom-02 {
  padding-bottom: var(--x-size-base-02) !important;
}
[dir="ltr"] .x-padding--right-02 {
  padding-right: var(--x-size-base-02) !important;
}
[dir="rtl"] .x-padding--right-02 {
  padding-left: var(--x-size-base-02) !important;
}
[dir="ltr"] .x-padding--left-02 {
  padding-left: var(--x-size-base-02) !important;
}
[dir="rtl"] .x-padding--left-02 {
  padding-right: var(--x-size-base-02) !important;
}
.x-padding--top-03 {
  padding-top: var(--x-size-base-03) !important;
}
.x-padding--bottom-03 {
  padding-bottom: var(--x-size-base-03) !important;
}
[dir="ltr"] .x-padding--right-03 {
  padding-right: var(--x-size-base-03) !important;
}
[dir="rtl"] .x-padding--right-03 {
  padding-left: var(--x-size-base-03) !important;
}
[dir="ltr"] .x-padding--left-03 {
  padding-left: var(--x-size-base-03) !important;
}
[dir="rtl"] .x-padding--left-03 {
  padding-right: var(--x-size-base-03) !important;
}
.x-padding--top-04 {
  padding-top: var(--x-size-base-04) !important;
}
.x-padding--bottom-04 {
  padding-bottom: var(--x-size-base-04) !important;
}
[dir="ltr"] .x-padding--right-04 {
  padding-right: var(--x-size-base-04) !important;
}
[dir="rtl"] .x-padding--right-04 {
  padding-left: var(--x-size-base-04) !important;
}
[dir="ltr"] .x-padding--left-04 {
  padding-left: var(--x-size-base-04) !important;
}
[dir="rtl"] .x-padding--left-04 {
  padding-right: var(--x-size-base-04) !important;
}
.x-padding--top-05 {
  padding-top: var(--x-size-base-05) !important;
}
.x-padding--bottom-05 {
  padding-bottom: var(--x-size-base-05) !important;
}
[dir="ltr"] .x-padding--right-05 {
  padding-right: var(--x-size-base-05) !important;
}
[dir="rtl"] .x-padding--right-05 {
  padding-left: var(--x-size-base-05) !important;
}
[dir="ltr"] .x-padding--left-05 {
  padding-left: var(--x-size-base-05) !important;
}
[dir="rtl"] .x-padding--left-05 {
  padding-right: var(--x-size-base-05) !important;
}
.x-padding--top-06 {
  padding-top: var(--x-size-base-06) !important;
}
.x-padding--bottom-06 {
  padding-bottom: var(--x-size-base-06) !important;
}
[dir="ltr"] .x-padding--right-06 {
  padding-right: var(--x-size-base-06) !important;
}
[dir="rtl"] .x-padding--right-06 {
  padding-left: var(--x-size-base-06) !important;
}
[dir="ltr"] .x-padding--left-06 {
  padding-left: var(--x-size-base-06) !important;
}
[dir="rtl"] .x-padding--left-06 {
  padding-right: var(--x-size-base-06) !important;
}
.x-padding--top-07 {
  padding-top: var(--x-size-base-07) !important;
}
.x-padding--bottom-07 {
  padding-bottom: var(--x-size-base-07) !important;
}
[dir="ltr"] .x-padding--right-07 {
  padding-right: var(--x-size-base-07) !important;
}
[dir="rtl"] .x-padding--right-07 {
  padding-left: var(--x-size-base-07) !important;
}
[dir="ltr"] .x-padding--left-07 {
  padding-left: var(--x-size-base-07) !important;
}
[dir="rtl"] .x-padding--left-07 {
  padding-right: var(--x-size-base-07) !important;
}
.x-padding--top-08 {
  padding-top: var(--x-size-base-08) !important;
}
.x-padding--bottom-08 {
  padding-bottom: var(--x-size-base-08) !important;
}
[dir="ltr"] .x-padding--right-08 {
  padding-right: var(--x-size-base-08) !important;
}
[dir="rtl"] .x-padding--right-08 {
  padding-left: var(--x-size-base-08) !important;
}
[dir="ltr"] .x-padding--left-08 {
  padding-left: var(--x-size-base-08) !important;
}
[dir="rtl"] .x-padding--left-08 {
  padding-right: var(--x-size-base-08) !important;
}
.x-padding--top-09 {
  padding-top: var(--x-size-base-09) !important;
}
.x-padding--bottom-09 {
  padding-bottom: var(--x-size-base-09) !important;
}
[dir="ltr"] .x-padding--right-09 {
  padding-right: var(--x-size-base-09) !important;
}
[dir="rtl"] .x-padding--right-09 {
  padding-left: var(--x-size-base-09) !important;
}
[dir="ltr"] .x-padding--left-09 {
  padding-left: var(--x-size-base-09) !important;
}
[dir="rtl"] .x-padding--left-09 {
  padding-right: var(--x-size-base-09) !important;
}
.x-padding--top-10 {
  padding-top: var(--x-size-base-10) !important;
}
.x-padding--bottom-10 {
  padding-bottom: var(--x-size-base-10) !important;
}
[dir="ltr"] .x-padding--right-10 {
  padding-right: var(--x-size-base-10) !important;
}
[dir="rtl"] .x-padding--right-10 {
  padding-left: var(--x-size-base-10) !important;
}
[dir="ltr"] .x-padding--left-10 {
  padding-left: var(--x-size-base-10) !important;
}
[dir="rtl"] .x-padding--left-10 {
  padding-right: var(--x-size-base-10) !important;
}
.x-padding--top-11 {
  padding-top: var(--x-size-base-11) !important;
}
.x-padding--bottom-11 {
  padding-bottom: var(--x-size-base-11) !important;
}
[dir="ltr"] .x-padding--right-11 {
  padding-right: var(--x-size-base-11) !important;
}
[dir="rtl"] .x-padding--right-11 {
  padding-left: var(--x-size-base-11) !important;
}
[dir="ltr"] .x-padding--left-11 {
  padding-left: var(--x-size-base-11) !important;
}
[dir="rtl"] .x-padding--left-11 {
  padding-right: var(--x-size-base-11) !important;
}
.x-padding--top-12 {
  padding-top: var(--x-size-base-12) !important;
}
.x-padding--bottom-12 {
  padding-bottom: var(--x-size-base-12) !important;
}
[dir="ltr"] .x-padding--right-12 {
  padding-right: var(--x-size-base-12) !important;
}
[dir="rtl"] .x-padding--right-12 {
  padding-left: var(--x-size-base-12) !important;
}
[dir="ltr"] .x-padding--left-12 {
  padding-left: var(--x-size-base-12) !important;
}
[dir="rtl"] .x-padding--left-12 {
  padding-right: var(--x-size-base-12) !important;
}
.x-padding--top-13 {
  padding-top: var(--x-size-base-13) !important;
}
.x-padding--bottom-13 {
  padding-bottom: var(--x-size-base-13) !important;
}
[dir="ltr"] .x-padding--right-13 {
  padding-right: var(--x-size-base-13) !important;
}
[dir="rtl"] .x-padding--right-13 {
  padding-left: var(--x-size-base-13) !important;
}
[dir="ltr"] .x-padding--left-13 {
  padding-left: var(--x-size-base-13) !important;
}
[dir="rtl"] .x-padding--left-13 {
  padding-right: var(--x-size-base-13) !important;
}
.x-padding--top-14 {
  padding-top: var(--x-size-base-14) !important;
}
.x-padding--bottom-14 {
  padding-bottom: var(--x-size-base-14) !important;
}
[dir="ltr"] .x-padding--right-14 {
  padding-right: var(--x-size-base-14) !important;
}
[dir="rtl"] .x-padding--right-14 {
  padding-left: var(--x-size-base-14) !important;
}
[dir="ltr"] .x-padding--left-14 {
  padding-left: var(--x-size-base-14) !important;
}
[dir="rtl"] .x-padding--left-14 {
  padding-right: var(--x-size-base-14) !important;
}
.x-padding--top-15 {
  padding-top: var(--x-size-base-15) !important;
}
.x-padding--bottom-15 {
  padding-bottom: var(--x-size-base-15) !important;
}
[dir="ltr"] .x-padding--right-15 {
  padding-right: var(--x-size-base-15) !important;
}
[dir="rtl"] .x-padding--right-15 {
  padding-left: var(--x-size-base-15) !important;
}
[dir="ltr"] .x-padding--left-15 {
  padding-left: var(--x-size-base-15) !important;
}
[dir="rtl"] .x-padding--left-15 {
  padding-right: var(--x-size-base-15) !important;
}
.x-padding--top-16 {
  padding-top: var(--x-size-base-16) !important;
}
.x-padding--bottom-16 {
  padding-bottom: var(--x-size-base-16) !important;
}
[dir="ltr"] .x-padding--right-16 {
  padding-right: var(--x-size-base-16) !important;
}
[dir="rtl"] .x-padding--right-16 {
  padding-left: var(--x-size-base-16) !important;
}
[dir="ltr"] .x-padding--left-16 {
  padding-left: var(--x-size-base-16) !important;
}
[dir="rtl"] .x-padding--left-16 {
  padding-right: var(--x-size-base-16) !important;
}
.x-padding--top-17 {
  padding-top: var(--x-size-base-17) !important;
}
.x-padding--bottom-17 {
  padding-bottom: var(--x-size-base-17) !important;
}
[dir="ltr"] .x-padding--right-17 {
  padding-right: var(--x-size-base-17) !important;
}
[dir="rtl"] .x-padding--right-17 {
  padding-left: var(--x-size-base-17) !important;
}
[dir="ltr"] .x-padding--left-17 {
  padding-left: var(--x-size-base-17) !important;
}
[dir="rtl"] .x-padding--left-17 {
  padding-right: var(--x-size-base-17) !important;
}
.x-padding--top-18 {
  padding-top: var(--x-size-base-18) !important;
}
.x-padding--bottom-18 {
  padding-bottom: var(--x-size-base-18) !important;
}
[dir="ltr"] .x-padding--right-18 {
  padding-right: var(--x-size-base-18) !important;
}
[dir="rtl"] .x-padding--right-18 {
  padding-left: var(--x-size-base-18) !important;
}
[dir="ltr"] .x-padding--left-18 {
  padding-left: var(--x-size-base-18) !important;
}
[dir="rtl"] .x-padding--left-18 {
  padding-right: var(--x-size-base-18) !important;
}
.x-padding--top-19 {
  padding-top: var(--x-size-base-19) !important;
}
.x-padding--bottom-19 {
  padding-bottom: var(--x-size-base-19) !important;
}
[dir="ltr"] .x-padding--right-19 {
  padding-right: var(--x-size-base-19) !important;
}
[dir="rtl"] .x-padding--right-19 {
  padding-left: var(--x-size-base-19) !important;
}
[dir="ltr"] .x-padding--left-19 {
  padding-left: var(--x-size-base-19) !important;
}
[dir="rtl"] .x-padding--left-19 {
  padding-right: var(--x-size-base-19) !important;
}
.x-padding--top-20 {
  padding-top: var(--x-size-base-20) !important;
}
.x-padding--bottom-20 {
  padding-bottom: var(--x-size-base-20) !important;
}
[dir="ltr"] .x-padding--right-20 {
  padding-right: var(--x-size-base-20) !important;
}
[dir="rtl"] .x-padding--right-20 {
  padding-left: var(--x-size-base-20) !important;
}
[dir="ltr"] .x-padding--left-20 {
  padding-left: var(--x-size-base-20) !important;
}
[dir="rtl"] .x-padding--left-20 {
  padding-right: var(--x-size-base-20) !important;
}
.x-margin--auto {
  margin: auto !important;
}
.x-margin--00 {
  margin: 0 !important;
}
.x-margin--01 {
  margin: var(--x-size-base-01) !important;
}
.x-margin--02 {
  margin: var(--x-size-base-02) !important;
}
.x-margin--03 {
  margin: var(--x-size-base-03) !important;
}
.x-margin--04 {
  margin: var(--x-size-base-04) !important;
}
.x-margin--05 {
  margin: var(--x-size-base-05) !important;
}
.x-margin--06 {
  margin: var(--x-size-base-06) !important;
}
.x-margin--07 {
  margin: var(--x-size-base-07) !important;
}
.x-margin--08 {
  margin: var(--x-size-base-08) !important;
}
.x-margin--09 {
  margin: var(--x-size-base-09) !important;
}
.x-margin--10 {
  margin: var(--x-size-base-10) !important;
}
.x-margin--11 {
  margin: var(--x-size-base-11) !important;
}
.x-margin--12 {
  margin: var(--x-size-base-12) !important;
}
.x-margin--13 {
  margin: var(--x-size-base-13) !important;
}
.x-margin--14 {
  margin: var(--x-size-base-14) !important;
}
.x-margin--15 {
  margin: var(--x-size-base-15) !important;
}
.x-margin--16 {
  margin: var(--x-size-base-16) !important;
}
.x-margin--17 {
  margin: var(--x-size-base-17) !important;
}
.x-margin--18 {
  margin: var(--x-size-base-18) !important;
}
.x-margin--19 {
  margin: var(--x-size-base-19) !important;
}
.x-margin--20 {
  margin: var(--x-size-base-20) !important;
}
.x-margin--top-auto {
  margin-top: auto !important;
}
.x-margin--bottom-auto {
  margin-bottom: auto !important;
}
[dir="ltr"] .x-margin--right-auto {
  margin-right: auto !important;
}
[dir="rtl"] .x-margin--right-auto {
  margin-left: auto !important;
}
[dir="ltr"] .x-margin--left-auto {
  margin-left: auto !important;
}
[dir="rtl"] .x-margin--left-auto {
  margin-right: auto !important;
}
.x-margin--top-00 {
  margin-top: 0 !important;
}
.x-margin--bottom-00 {
  margin-bottom: 0 !important;
}
[dir="ltr"] .x-margin--right-00 {
  margin-right: 0 !important;
}
[dir="rtl"] .x-margin--right-00 {
  margin-left: 0 !important;
}
[dir="ltr"] .x-margin--left-00 {
  margin-left: 0 !important;
}
[dir="rtl"] .x-margin--left-00 {
  margin-right: 0 !important;
}
.x-margin--top-01 {
  margin-top: var(--x-size-base-01) !important;
}
.x-margin--bottom-01 {
  margin-bottom: var(--x-size-base-01) !important;
}
[dir="ltr"] .x-margin--right-01 {
  margin-right: var(--x-size-base-01) !important;
}
[dir="rtl"] .x-margin--right-01 {
  margin-left: var(--x-size-base-01) !important;
}
[dir="ltr"] .x-margin--left-01 {
  margin-left: var(--x-size-base-01) !important;
}
[dir="rtl"] .x-margin--left-01 {
  margin-right: var(--x-size-base-01) !important;
}
.x-margin--top-02 {
  margin-top: var(--x-size-base-02) !important;
}
.x-margin--bottom-02 {
  margin-bottom: var(--x-size-base-02) !important;
}
[dir="ltr"] .x-margin--right-02 {
  margin-right: var(--x-size-base-02) !important;
}
[dir="rtl"] .x-margin--right-02 {
  margin-left: var(--x-size-base-02) !important;
}
[dir="ltr"] .x-margin--left-02 {
  margin-left: var(--x-size-base-02) !important;
}
[dir="rtl"] .x-margin--left-02 {
  margin-right: var(--x-size-base-02) !important;
}
.x-margin--top-03 {
  margin-top: var(--x-size-base-03) !important;
}
.x-margin--bottom-03 {
  margin-bottom: var(--x-size-base-03) !important;
}
[dir="ltr"] .x-margin--right-03 {
  margin-right: var(--x-size-base-03) !important;
}
[dir="rtl"] .x-margin--right-03 {
  margin-left: var(--x-size-base-03) !important;
}
[dir="ltr"] .x-margin--left-03 {
  margin-left: var(--x-size-base-03) !important;
}
[dir="rtl"] .x-margin--left-03 {
  margin-right: var(--x-size-base-03) !important;
}
.x-margin--top-04 {
  margin-top: var(--x-size-base-04) !important;
}
.x-margin--bottom-04 {
  margin-bottom: var(--x-size-base-04) !important;
}
[dir="ltr"] .x-margin--right-04 {
  margin-right: var(--x-size-base-04) !important;
}
[dir="rtl"] .x-margin--right-04 {
  margin-left: var(--x-size-base-04) !important;
}
[dir="ltr"] .x-margin--left-04 {
  margin-left: var(--x-size-base-04) !important;
}
[dir="rtl"] .x-margin--left-04 {
  margin-right: var(--x-size-base-04) !important;
}
.x-margin--top-05 {
  margin-top: var(--x-size-base-05) !important;
}
.x-margin--bottom-05 {
  margin-bottom: var(--x-size-base-05) !important;
}
[dir="ltr"] .x-margin--right-05 {
  margin-right: var(--x-size-base-05) !important;
}
[dir="rtl"] .x-margin--right-05 {
  margin-left: var(--x-size-base-05) !important;
}
[dir="ltr"] .x-margin--left-05 {
  margin-left: var(--x-size-base-05) !important;
}
[dir="rtl"] .x-margin--left-05 {
  margin-right: var(--x-size-base-05) !important;
}
.x-margin--top-06 {
  margin-top: var(--x-size-base-06) !important;
}
.x-margin--bottom-06 {
  margin-bottom: var(--x-size-base-06) !important;
}
[dir="ltr"] .x-margin--right-06 {
  margin-right: var(--x-size-base-06) !important;
}
[dir="rtl"] .x-margin--right-06 {
  margin-left: var(--x-size-base-06) !important;
}
[dir="ltr"] .x-margin--left-06 {
  margin-left: var(--x-size-base-06) !important;
}
[dir="rtl"] .x-margin--left-06 {
  margin-right: var(--x-size-base-06) !important;
}
.x-margin--top-07 {
  margin-top: var(--x-size-base-07) !important;
}
.x-margin--bottom-07 {
  margin-bottom: var(--x-size-base-07) !important;
}
[dir="ltr"] .x-margin--right-07 {
  margin-right: var(--x-size-base-07) !important;
}
[dir="rtl"] .x-margin--right-07 {
  margin-left: var(--x-size-base-07) !important;
}
[dir="ltr"] .x-margin--left-07 {
  margin-left: var(--x-size-base-07) !important;
}
[dir="rtl"] .x-margin--left-07 {
  margin-right: var(--x-size-base-07) !important;
}
.x-margin--top-08 {
  margin-top: var(--x-size-base-08) !important;
}
.x-margin--bottom-08 {
  margin-bottom: var(--x-size-base-08) !important;
}
[dir="ltr"] .x-margin--right-08 {
  margin-right: var(--x-size-base-08) !important;
}
[dir="rtl"] .x-margin--right-08 {
  margin-left: var(--x-size-base-08) !important;
}
[dir="ltr"] .x-margin--left-08 {
  margin-left: var(--x-size-base-08) !important;
}
[dir="rtl"] .x-margin--left-08 {
  margin-right: var(--x-size-base-08) !important;
}
.x-margin--top-09 {
  margin-top: var(--x-size-base-09) !important;
}
.x-margin--bottom-09 {
  margin-bottom: var(--x-size-base-09) !important;
}
[dir="ltr"] .x-margin--right-09 {
  margin-right: var(--x-size-base-09) !important;
}
[dir="rtl"] .x-margin--right-09 {
  margin-left: var(--x-size-base-09) !important;
}
[dir="ltr"] .x-margin--left-09 {
  margin-left: var(--x-size-base-09) !important;
}
[dir="rtl"] .x-margin--left-09 {
  margin-right: var(--x-size-base-09) !important;
}
.x-margin--top-10 {
  margin-top: var(--x-size-base-10) !important;
}
.x-margin--bottom-10 {
  margin-bottom: var(--x-size-base-10) !important;
}
[dir="ltr"] .x-margin--right-10 {
  margin-right: var(--x-size-base-10) !important;
}
[dir="rtl"] .x-margin--right-10 {
  margin-left: var(--x-size-base-10) !important;
}
[dir="ltr"] .x-margin--left-10 {
  margin-left: var(--x-size-base-10) !important;
}
[dir="rtl"] .x-margin--left-10 {
  margin-right: var(--x-size-base-10) !important;
}
.x-margin--top-11 {
  margin-top: var(--x-size-base-11) !important;
}
.x-margin--bottom-11 {
  margin-bottom: var(--x-size-base-11) !important;
}
[dir="ltr"] .x-margin--right-11 {
  margin-right: var(--x-size-base-11) !important;
}
[dir="rtl"] .x-margin--right-11 {
  margin-left: var(--x-size-base-11) !important;
}
[dir="ltr"] .x-margin--left-11 {
  margin-left: var(--x-size-base-11) !important;
}
[dir="rtl"] .x-margin--left-11 {
  margin-right: var(--x-size-base-11) !important;
}
.x-margin--top-12 {
  margin-top: var(--x-size-base-12) !important;
}
.x-margin--bottom-12 {
  margin-bottom: var(--x-size-base-12) !important;
}
[dir="ltr"] .x-margin--right-12 {
  margin-right: var(--x-size-base-12) !important;
}
[dir="rtl"] .x-margin--right-12 {
  margin-left: var(--x-size-base-12) !important;
}
[dir="ltr"] .x-margin--left-12 {
  margin-left: var(--x-size-base-12) !important;
}
[dir="rtl"] .x-margin--left-12 {
  margin-right: var(--x-size-base-12) !important;
}
.x-margin--top-13 {
  margin-top: var(--x-size-base-13) !important;
}
.x-margin--bottom-13 {
  margin-bottom: var(--x-size-base-13) !important;
}
[dir="ltr"] .x-margin--right-13 {
  margin-right: var(--x-size-base-13) !important;
}
[dir="rtl"] .x-margin--right-13 {
  margin-left: var(--x-size-base-13) !important;
}
[dir="ltr"] .x-margin--left-13 {
  margin-left: var(--x-size-base-13) !important;
}
[dir="rtl"] .x-margin--left-13 {
  margin-right: var(--x-size-base-13) !important;
}
.x-margin--top-14 {
  margin-top: var(--x-size-base-14) !important;
}
.x-margin--bottom-14 {
  margin-bottom: var(--x-size-base-14) !important;
}
[dir="ltr"] .x-margin--right-14 {
  margin-right: var(--x-size-base-14) !important;
}
[dir="rtl"] .x-margin--right-14 {
  margin-left: var(--x-size-base-14) !important;
}
[dir="ltr"] .x-margin--left-14 {
  margin-left: var(--x-size-base-14) !important;
}
[dir="rtl"] .x-margin--left-14 {
  margin-right: var(--x-size-base-14) !important;
}
.x-margin--top-15 {
  margin-top: var(--x-size-base-15) !important;
}
.x-margin--bottom-15 {
  margin-bottom: var(--x-size-base-15) !important;
}
[dir="ltr"] .x-margin--right-15 {
  margin-right: var(--x-size-base-15) !important;
}
[dir="rtl"] .x-margin--right-15 {
  margin-left: var(--x-size-base-15) !important;
}
[dir="ltr"] .x-margin--left-15 {
  margin-left: var(--x-size-base-15) !important;
}
[dir="rtl"] .x-margin--left-15 {
  margin-right: var(--x-size-base-15) !important;
}
.x-margin--top-16 {
  margin-top: var(--x-size-base-16) !important;
}
.x-margin--bottom-16 {
  margin-bottom: var(--x-size-base-16) !important;
}
[dir="ltr"] .x-margin--right-16 {
  margin-right: var(--x-size-base-16) !important;
}
[dir="rtl"] .x-margin--right-16 {
  margin-left: var(--x-size-base-16) !important;
}
[dir="ltr"] .x-margin--left-16 {
  margin-left: var(--x-size-base-16) !important;
}
[dir="rtl"] .x-margin--left-16 {
  margin-right: var(--x-size-base-16) !important;
}
.x-margin--top-17 {
  margin-top: var(--x-size-base-17) !important;
}
.x-margin--bottom-17 {
  margin-bottom: var(--x-size-base-17) !important;
}
[dir="ltr"] .x-margin--right-17 {
  margin-right: var(--x-size-base-17) !important;
}
[dir="rtl"] .x-margin--right-17 {
  margin-left: var(--x-size-base-17) !important;
}
[dir="ltr"] .x-margin--left-17 {
  margin-left: var(--x-size-base-17) !important;
}
[dir="rtl"] .x-margin--left-17 {
  margin-right: var(--x-size-base-17) !important;
}
.x-margin--top-18 {
  margin-top: var(--x-size-base-18) !important;
}
.x-margin--bottom-18 {
  margin-bottom: var(--x-size-base-18) !important;
}
[dir="ltr"] .x-margin--right-18 {
  margin-right: var(--x-size-base-18) !important;
}
[dir="rtl"] .x-margin--right-18 {
  margin-left: var(--x-size-base-18) !important;
}
[dir="ltr"] .x-margin--left-18 {
  margin-left: var(--x-size-base-18) !important;
}
[dir="rtl"] .x-margin--left-18 {
  margin-right: var(--x-size-base-18) !important;
}
.x-margin--top-19 {
  margin-top: var(--x-size-base-19) !important;
}
.x-margin--bottom-19 {
  margin-bottom: var(--x-size-base-19) !important;
}
[dir="ltr"] .x-margin--right-19 {
  margin-right: var(--x-size-base-19) !important;
}
[dir="rtl"] .x-margin--right-19 {
  margin-left: var(--x-size-base-19) !important;
}
[dir="ltr"] .x-margin--left-19 {
  margin-left: var(--x-size-base-19) !important;
}
[dir="rtl"] .x-margin--left-19 {
  margin-right: var(--x-size-base-19) !important;
}
.x-margin--top-20 {
  margin-top: var(--x-size-base-20) !important;
}
.x-margin--bottom-20 {
  margin-bottom: var(--x-size-base-20) !important;
}
[dir="ltr"] .x-margin--right-20 {
  margin-right: var(--x-size-base-20) !important;
}
[dir="rtl"] .x-margin--right-20 {
  margin-left: var(--x-size-base-20) !important;
}
[dir="ltr"] .x-margin--left-20 {
  margin-left: var(--x-size-base-20) !important;
}
[dir="rtl"] .x-margin--left-20 {
  margin-right: var(--x-size-base-20) !important;
}
.x-line-height--none {
  line-height: 1 !important;
}

.x-line-height--tight {
  line-height: 1.25 !important;
}

.x-line-height--snug {
  line-height: 1.375 !important;
}

.x-line-height--normal {
  line-height: 1.5 !important;
}

.x-line-height--relaxed {
  line-height: 1.625 !important;
}

.x-line-height--loose {
  line-height: 2 !important;
}
.x-line-clamp--2 {
  overflow: hidden !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}

.x-line-clamp--3 {
  overflow: hidden !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 3 !important;
}

.x-line-clamp--4 {
  overflow: hidden !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 4 !important;
}

.x-line-clamp--5 {
  overflow: hidden !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 5 !important;
}

.x-line-clamp--6 {
  overflow: hidden !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 6 !important;
}
.x-font-size--01 {
  font-size: var(--x-size-base-01) !important;
  line-height: 1.5;
}
.x-font-size--02 {
  font-size: var(--x-size-base-02) !important;
  line-height: 1.5;
}
.x-font-size--03 {
  font-size: var(--x-size-base-03) !important;
  line-height: 1.5;
}
.x-font-size--04 {
  font-size: var(--x-size-base-04) !important;
  line-height: 1.5;
}
.x-font-size--05 {
  font-size: var(--x-size-base-05) !important;
  line-height: 1.5;
}
.x-font-size--06 {
  font-size: var(--x-size-base-06) !important;
  line-height: 1.5;
}
.x-font-size--07 {
  font-size: var(--x-size-base-07) !important;
  line-height: 1.5;
}
.x-font-size--08 {
  font-size: var(--x-size-base-08) !important;
  line-height: 1.5;
}
.x-font-size--09 {
  font-size: var(--x-size-base-09) !important;
  line-height: 1.5;
}
.x-font-size--10 {
  font-size: var(--x-size-base-10) !important;
  line-height: 1.5;
}
.x-font-size--11 {
  font-size: var(--x-size-base-11) !important;
  line-height: 1.5;
}
.x-font-size--12 {
  font-size: var(--x-size-base-12) !important;
  line-height: 1.5;
}
.x-font-size--13 {
  font-size: var(--x-size-base-13) !important;
  line-height: 1.5;
}
.x-font-size--14 {
  font-size: var(--x-size-base-14) !important;
  line-height: 1.5;
}
.x-font-size--15 {
  font-size: var(--x-size-base-15) !important;
  line-height: 1.5;
}
.x-font-size--16 {
  font-size: var(--x-size-base-16) !important;
  line-height: 1.5;
}
.x-font-size--17 {
  font-size: var(--x-size-base-17) !important;
  line-height: 1.5;
}
.x-font-size--18 {
  font-size: var(--x-size-base-18) !important;
  line-height: 1.5;
}
.x-font-size--19 {
  font-size: var(--x-size-base-19) !important;
  line-height: 1.5;
}
.x-font-size--20 {
  font-size: var(--x-size-base-20) !important;
  line-height: 1.5;
}
.x-font-weight--light {
  font-weight: var(--x-number-font-weight-base-light) !important;
}
.x-font-weight--regular {
  font-weight: var(--x-number-font-weight-base-regular) !important;
}
.x-font-weight--bold {
  font-weight: var(--x-number-font-weight-base-bold) !important;
}
.x-font-color--lead {
  color: var(--x-color-base-lead) !important;
}

.x-font-color--auxiliary {
  color: var(--x-color-base-auxiliary) !important;
}

.x-font-color--neutral-10 {
  color: var(--x-color-base-neutral-10) !important;
}

.x-font-color--neutral-35 {
  color: var(--x-color-base-neutral-35) !important;
}

.x-font-color--neutral-70 {
  color: var(--x-color-base-neutral-70) !important;
}

.x-font-color--neutral-95 {
  color: var(--x-color-base-neutral-95) !important;
}

.x-font-color--neutral-100 {
  color: var(--x-color-base-neutral-100) !important;
}

.x-font-color--accent {
  color: var(--x-color-base-accent) !important;
}

.x-font-color--enable {
  color: var(--x-color-base-enable) !important;
}

.x-font-color--disable {
  color: var(--x-color-base-disable) !important;
}

.x-font-color--transparent {
  color: var(--x-color-base-transparent) !important;
}
.x-flex-1 {
  flex: 1 1 0% !important;
}

.x-flex-auto {
  flex: 1 1 auto !important;
}

.x-flex-initial {
  flex: 0 1 auto !important;
}

.x-flex-no-shrink {
  flex: 1 0 auto !important;
}

.x-flex-none {
  flex: none !important;
}

.x-self-auto {
  align-self: auto !important;
}

.x-self-start {
  align-self: flex-start !important;
}

.x-self-end {
  align-self: flex-end !important;
}

.x-self-center {
  align-self: center !important;
}

.x-self-stretch {
  align-self: stretch !important;
}

.x-self-baseline {
  align-self: baseline !important;
}
.x-fill--lead {
  fill: var(--x-color-base-lead) !important;
}

.x-fill--auxiliary {
  fill: var(--x-color-base-auxiliary) !important;
}

.x-fill--neutral-10 {
  fill: var(--x-color-base-neutral-10) !important;
}

.x-fill--neutral-35 {
  fill: var(--x-color-base-neutral-35) !important;
}

.x-fill--neutral-70 {
  fill: var(--x-color-base-neutral-70) !important;
}

.x-fill--neutral-95 {
  fill: var(--x-color-base-neutral-95) !important;
}

.x-fill--neutral-100 {
  fill: var(--x-color-base-neutral-100) !important;
}

.x-fill--accent {
  fill: var(--x-color-base-accent) !important;
}

.x-fill--enable {
  fill: var(--x-color-base-enable) !important;
}

.x-fill--disable {
  fill: var(--x-color-base-disable) !important;
}

.x-fill--transparent {
  fill: var(--x-color-base-transparent) !important;
}
*[class*=x-border-width--] {
  border-width: 0;
}

.x-border-width--00 {
  border-width: 0px !important;
  border-style: solid !important;
}
.x-border-width--top-00 {
  border-top-width: 0px !important;
  border-style: solid !important;
}
.x-border-width--bottom-00 {
  border-bottom-width: 0px !important;
  border-style: solid !important;
}
[dir="ltr"] .x-border-width--right-00 {
  border-right-width: 0px !important;
}
[dir="rtl"] .x-border-width--right-00 {
  border-left-width: 0px !important;
}
.x-border-width--right-00 {
  border-style: solid !important;
}
[dir="ltr"] .x-border-width--left-00 {
  border-left-width: 0px !important;
}
[dir="rtl"] .x-border-width--left-00 {
  border-right-width: 0px !important;
}
.x-border-width--left-00 {
  border-style: solid !important;
}
.x-border-width--01 {
  border-width: 1px !important;
  border-style: solid !important;
}
.x-border-width--top-01 {
  border-top-width: 1px !important;
  border-style: solid !important;
}
.x-border-width--bottom-01 {
  border-bottom-width: 1px !important;
  border-style: solid !important;
}
[dir="ltr"] .x-border-width--right-01 {
  border-right-width: 1px !important;
}
[dir="rtl"] .x-border-width--right-01 {
  border-left-width: 1px !important;
}
.x-border-width--right-01 {
  border-style: solid !important;
}
[dir="ltr"] .x-border-width--left-01 {
  border-left-width: 1px !important;
}
[dir="rtl"] .x-border-width--left-01 {
  border-right-width: 1px !important;
}
.x-border-width--left-01 {
  border-style: solid !important;
}
.x-border-width--02 {
  border-width: 2px !important;
  border-style: solid !important;
}
.x-border-width--top-02 {
  border-top-width: 2px !important;
  border-style: solid !important;
}
.x-border-width--bottom-02 {
  border-bottom-width: 2px !important;
  border-style: solid !important;
}
[dir="ltr"] .x-border-width--right-02 {
  border-right-width: 2px !important;
}
[dir="rtl"] .x-border-width--right-02 {
  border-left-width: 2px !important;
}
.x-border-width--right-02 {
  border-style: solid !important;
}
[dir="ltr"] .x-border-width--left-02 {
  border-left-width: 2px !important;
}
[dir="rtl"] .x-border-width--left-02 {
  border-right-width: 2px !important;
}
.x-border-width--left-02 {
  border-style: solid !important;
}
.x-border-width--03 {
  border-width: 3px !important;
  border-style: solid !important;
}
.x-border-width--top-03 {
  border-top-width: 3px !important;
  border-style: solid !important;
}
.x-border-width--bottom-03 {
  border-bottom-width: 3px !important;
  border-style: solid !important;
}
[dir="ltr"] .x-border-width--right-03 {
  border-right-width: 3px !important;
}
[dir="rtl"] .x-border-width--right-03 {
  border-left-width: 3px !important;
}
.x-border-width--right-03 {
  border-style: solid !important;
}
[dir="ltr"] .x-border-width--left-03 {
  border-left-width: 3px !important;
}
[dir="rtl"] .x-border-width--left-03 {
  border-right-width: 3px !important;
}
.x-border-width--left-03 {
  border-style: solid !important;
}
.x-border-width--04 {
  border-width: 4px !important;
  border-style: solid !important;
}
.x-border-width--top-04 {
  border-top-width: 4px !important;
  border-style: solid !important;
}
.x-border-width--bottom-04 {
  border-bottom-width: 4px !important;
  border-style: solid !important;
}
[dir="ltr"] .x-border-width--right-04 {
  border-right-width: 4px !important;
}
[dir="rtl"] .x-border-width--right-04 {
  border-left-width: 4px !important;
}
.x-border-width--right-04 {
  border-style: solid !important;
}
[dir="ltr"] .x-border-width--left-04 {
  border-left-width: 4px !important;
}
[dir="rtl"] .x-border-width--left-04 {
  border-right-width: 4px !important;
}
.x-border-width--left-04 {
  border-style: solid !important;
}
.x-border-width--05 {
  border-width: 5px !important;
  border-style: solid !important;
}
.x-border-width--top-05 {
  border-top-width: 5px !important;
  border-style: solid !important;
}
.x-border-width--bottom-05 {
  border-bottom-width: 5px !important;
  border-style: solid !important;
}
[dir="ltr"] .x-border-width--right-05 {
  border-right-width: 5px !important;
}
[dir="rtl"] .x-border-width--right-05 {
  border-left-width: 5px !important;
}
.x-border-width--right-05 {
  border-style: solid !important;
}
[dir="ltr"] .x-border-width--left-05 {
  border-left-width: 5px !important;
}
[dir="rtl"] .x-border-width--left-05 {
  border-right-width: 5px !important;
}
.x-border-width--left-05 {
  border-style: solid !important;
}
.x-border-width--06 {
  border-width: 6px !important;
  border-style: solid !important;
}
.x-border-width--top-06 {
  border-top-width: 6px !important;
  border-style: solid !important;
}
.x-border-width--bottom-06 {
  border-bottom-width: 6px !important;
  border-style: solid !important;
}
[dir="ltr"] .x-border-width--right-06 {
  border-right-width: 6px !important;
}
[dir="rtl"] .x-border-width--right-06 {
  border-left-width: 6px !important;
}
.x-border-width--right-06 {
  border-style: solid !important;
}
[dir="ltr"] .x-border-width--left-06 {
  border-left-width: 6px !important;
}
[dir="rtl"] .x-border-width--left-06 {
  border-right-width: 6px !important;
}
.x-border-width--left-06 {
  border-style: solid !important;
}
.x-border-width--07 {
  border-width: 7px !important;
  border-style: solid !important;
}
.x-border-width--top-07 {
  border-top-width: 7px !important;
  border-style: solid !important;
}
.x-border-width--bottom-07 {
  border-bottom-width: 7px !important;
  border-style: solid !important;
}
[dir="ltr"] .x-border-width--right-07 {
  border-right-width: 7px !important;
}
[dir="rtl"] .x-border-width--right-07 {
  border-left-width: 7px !important;
}
.x-border-width--right-07 {
  border-style: solid !important;
}
[dir="ltr"] .x-border-width--left-07 {
  border-left-width: 7px !important;
}
[dir="rtl"] .x-border-width--left-07 {
  border-right-width: 7px !important;
}
.x-border-width--left-07 {
  border-style: solid !important;
}
.x-border-width--08 {
  border-width: 8px !important;
  border-style: solid !important;
}
.x-border-width--top-08 {
  border-top-width: 8px !important;
  border-style: solid !important;
}
.x-border-width--bottom-08 {
  border-bottom-width: 8px !important;
  border-style: solid !important;
}
[dir="ltr"] .x-border-width--right-08 {
  border-right-width: 8px !important;
}
[dir="rtl"] .x-border-width--right-08 {
  border-left-width: 8px !important;
}
.x-border-width--right-08 {
  border-style: solid !important;
}
[dir="ltr"] .x-border-width--left-08 {
  border-left-width: 8px !important;
}
[dir="rtl"] .x-border-width--left-08 {
  border-right-width: 8px !important;
}
.x-border-width--left-08 {
  border-style: solid !important;
}
.x-border-width--09 {
  border-width: 9px !important;
  border-style: solid !important;
}
.x-border-width--top-09 {
  border-top-width: 9px !important;
  border-style: solid !important;
}
.x-border-width--bottom-09 {
  border-bottom-width: 9px !important;
  border-style: solid !important;
}
[dir="ltr"] .x-border-width--right-09 {
  border-right-width: 9px !important;
}
[dir="rtl"] .x-border-width--right-09 {
  border-left-width: 9px !important;
}
.x-border-width--right-09 {
  border-style: solid !important;
}
[dir="ltr"] .x-border-width--left-09 {
  border-left-width: 9px !important;
}
[dir="rtl"] .x-border-width--left-09 {
  border-right-width: 9px !important;
}
.x-border-width--left-09 {
  border-style: solid !important;
}
.x-border-width--10 {
  border-width: 10px !important;
  border-style: solid !important;
}
.x-border-width--top-10 {
  border-top-width: 10px !important;
  border-style: solid !important;
}
.x-border-width--bottom-10 {
  border-bottom-width: 10px !important;
  border-style: solid !important;
}
[dir="ltr"] .x-border-width--right-10 {
  border-right-width: 10px !important;
}
[dir="rtl"] .x-border-width--right-10 {
  border-left-width: 10px !important;
}
.x-border-width--right-10 {
  border-style: solid !important;
}
[dir="ltr"] .x-border-width--left-10 {
  border-left-width: 10px !important;
}
[dir="rtl"] .x-border-width--left-10 {
  border-right-width: 10px !important;
}
.x-border-width--left-10 {
  border-style: solid !important;
}
/* Material Elevations extracted from:
    https://gist.github.com/serglo/f9f0be9a66fd6755a0bda85f9c64e85f
*/
:root {
  /* Shadow none */
  --x-string-box-shadow-00: none;
  /* Shadow 1dp */
  --x-string-box-shadow-01: 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -1px rgba(0, 0, 0, 0.12),
    0 1px 3px 0 rgba(0, 0, 0, 0.2);
  /* Shadow 2dp */
  --x-string-box-shadow-02: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12),
    0 1px 5px 0 rgba(0, 0, 0, 0.2);
  /* Shadow 3dp */
  --x-string-box-shadow-03: 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.12),
    0 1px 8px 0 rgba(0, 0, 0, 0.2);
  /* Shadow 4dp */
  --x-string-box-shadow-04: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12),
    0 2px 4px -1px rgba(0, 0, 0, 0.2);
  /* Shadow 6dp */
  --x-string-box-shadow-05: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12),
    0 3px 5px -1px rgba(0, 0, 0, 0.2);
  /* Shadow 8dp */
  --x-string-box-shadow-06: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12),
    0 5px 5px -3px rgba(0, 0, 0, 0.2);
  /* Shadow 9dp */
  --x-string-box-shadow-07: 0 9px 12px 1px rgba(0, 0, 0, 0.14), 0 3px 16px 2px rgba(0, 0, 0, 0.12),
    0 5px 6px -3px rgba(0, 0, 0, 0.2);
  /* Shadow 12dp */
  --x-string-box-shadow-08: 0 12px 17px 2px rgba(0, 0, 0, 0.14), 0 5px 22px 4px rgba(0, 0, 0, 0.12),
    0 7px 8px -4px rgba(0, 0, 0, 0.2);
  /* Shadow 16dp */
  --x-string-box-shadow-09: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12),
    0 8px 10px -5px rgba(0, 0, 0, 0.2);
  /* Shadow 24dp */
  --x-string-box-shadow-10: 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12),
    0 11px 15px -7px rgba(0, 0, 0, 0.2);
  /* BOTTOM ONLY SHADOW (not overflows on top of the element) */
  /* Shadow 1dp */
  --x-string-box-shadow-bottom-01: 0 2px 1px -1px rgba(0, 0, 0, 0.14),
    0 2px 1px -1px rgba(0, 0, 0, 0.12), 0 4px 3px -3px rgba(0, 0, 0, 0.2);
  /* Shadow 2dp */
  --x-string-box-shadow-bottom-02: 0 4px 2px -2px rgba(0, 0, 0, 0.14),
    0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 6px 5px -5px rgba(0, 0, 0, 0.2);
  /* Shadow 3dp */
  --x-string-box-shadow-bottom-03: 0 7px 4px -4px rgba(0, 0, 0, 0.14),
    0 4px 3px -3px rgba(0, 0, 0, 0.12), 0 9px 8px -8px rgba(0, 0, 0, 0.2);
  /* Shadow 4dp */
  --x-string-box-shadow-bottom-04: 0 9px 5px -5px rgba(0, 0, 0, 0.14),
    0 11px 10px -10px rgba(0, 0, 0, 0.12), 0 5px 4px -4px rgba(0, 0, 0, 0.2);
  /* Shadow 6dp */
  --x-string-box-shadow-bottom-05: 0 16px 10px -10px rgba(0, 0, 0, 0.14),
    0 19px 18px -18px rgba(0, 0, 0, 0.12), 0 8px 5px -6px rgba(0, 0, 0, 0.2);
  /* Shadow 8dp */
  --x-string-box-shadow-bottom-06: 0 19px 10px -10px rgba(0, 0, 0, 0.14),
    0 19px 14px -14px rgba(0, 0, 0, 0.12), 0 7px 5px -5px rgba(0, 0, 0, 0.2);
  /* Shadow 9dp */
  --x-string-box-shadow-bottom-07: 0 22px 12px -12px rgba(0, 0, 0, 0.14),
    0 21px 16px -16px rgba(0, 0, 0, 0.12), 0 8px 6px -6px rgba(0, 0, 0, 0.2);
  /* Shadow 12dp */
  --x-string-box-shadow-bottom-08: 0 31px 17px -17px rgba(0, 0, 0, 0.14),
    0 27px 22px -22px rgba(0, 0, 0, 0.12), 0 11px 8px -8px rgba(0, 0, 0, 0.2);
  /* Shadow 16dp */
  --x-string-box-shadow-bottom-09: 0 22px 24px -4px rgba(0, 0, 0, 0.14),
    0 21px 30px -10px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
  /* Shadow 24dp */
  --x-string-box-shadow-bottom-10: 0 34px 38px -7px rgba(0, 0, 0, 0.14),
    0 29px 46px -12px rgba(0, 0, 0, 0.12), 0 11px 15px -7px rgba(0, 0, 0, 0.2);
}

.x-shadow--none {
  box-shadow: none !important;
}

.x-shadow--01 {
  box-shadow: var(--x-string-box-shadow-01) !important;
}
.x-shadow--bottom-01 {
  box-shadow: var(--x-string-box-shadow-bottom-01) !important;
}
.x-shadow--02 {
  box-shadow: var(--x-string-box-shadow-02) !important;
}
.x-shadow--bottom-02 {
  box-shadow: var(--x-string-box-shadow-bottom-02) !important;
}
.x-shadow--03 {
  box-shadow: var(--x-string-box-shadow-03) !important;
}
.x-shadow--bottom-03 {
  box-shadow: var(--x-string-box-shadow-bottom-03) !important;
}
.x-shadow--04 {
  box-shadow: var(--x-string-box-shadow-04) !important;
}
.x-shadow--bottom-04 {
  box-shadow: var(--x-string-box-shadow-bottom-04) !important;
}
.x-shadow--05 {
  box-shadow: var(--x-string-box-shadow-05) !important;
}
.x-shadow--bottom-05 {
  box-shadow: var(--x-string-box-shadow-bottom-05) !important;
}
.x-shadow--06 {
  box-shadow: var(--x-string-box-shadow-06) !important;
}
.x-shadow--bottom-06 {
  box-shadow: var(--x-string-box-shadow-bottom-06) !important;
}
.x-shadow--07 {
  box-shadow: var(--x-string-box-shadow-07) !important;
}
.x-shadow--bottom-07 {
  box-shadow: var(--x-string-box-shadow-bottom-07) !important;
}
.x-shadow--08 {
  box-shadow: var(--x-string-box-shadow-08) !important;
}
.x-shadow--bottom-08 {
  box-shadow: var(--x-string-box-shadow-bottom-08) !important;
}
.x-shadow--09 {
  box-shadow: var(--x-string-box-shadow-09) !important;
}
.x-shadow--bottom-09 {
  box-shadow: var(--x-string-box-shadow-bottom-09) !important;
}
.x-shadow--10 {
  box-shadow: var(--x-string-box-shadow-10) !important;
}
.x-shadow--bottom-10 {
  box-shadow: var(--x-string-box-shadow-bottom-10) !important;
}
/* Material Elevations extracted from:
    https://gist.github.com/serglo/f9f0be9a66fd6755a0bda85f9c64e85f
*/
:root {
  /* Shadow none */
  --x-string-box-shadow-00: none;
  /* Shadow 1dp */
  --x-string-box-shadow-01: 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -1px rgba(0, 0, 0, 0.12),
    0 1px 3px 0 rgba(0, 0, 0, 0.2);
  /* Shadow 2dp */
  --x-string-box-shadow-02: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12),
    0 1px 5px 0 rgba(0, 0, 0, 0.2);
  /* Shadow 3dp */
  --x-string-box-shadow-03: 0 3px 4px 0 rgba(0, 0, 0, 0.14), 0 3px 3px -2px rgba(0, 0, 0, 0.12),
    0 1px 8px 0 rgba(0, 0, 0, 0.2);
  /* Shadow 4dp */
  --x-string-box-shadow-04: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12),
    0 2px 4px -1px rgba(0, 0, 0, 0.2);
  /* Shadow 6dp */
  --x-string-box-shadow-05: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12),
    0 3px 5px -1px rgba(0, 0, 0, 0.2);
  /* Shadow 8dp */
  --x-string-box-shadow-06: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12),
    0 5px 5px -3px rgba(0, 0, 0, 0.2);
  /* Shadow 9dp */
  --x-string-box-shadow-07: 0 9px 12px 1px rgba(0, 0, 0, 0.14), 0 3px 16px 2px rgba(0, 0, 0, 0.12),
    0 5px 6px -3px rgba(0, 0, 0, 0.2);
  /* Shadow 12dp */
  --x-string-box-shadow-08: 0 12px 17px 2px rgba(0, 0, 0, 0.14), 0 5px 22px 4px rgba(0, 0, 0, 0.12),
    0 7px 8px -4px rgba(0, 0, 0, 0.2);
  /* Shadow 16dp */
  --x-string-box-shadow-09: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12),
    0 8px 10px -5px rgba(0, 0, 0, 0.2);
  /* Shadow 24dp */
  --x-string-box-shadow-10: 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12),
    0 11px 15px -7px rgba(0, 0, 0, 0.2);
  /* BOTTOM ONLY SHADOW (not overflows on top of the element) */
  /* Shadow 1dp */
  --x-string-box-shadow-bottom-01: 0 2px 1px -1px rgba(0, 0, 0, 0.14),
    0 2px 1px -1px rgba(0, 0, 0, 0.12), 0 4px 3px -3px rgba(0, 0, 0, 0.2);
  /* Shadow 2dp */
  --x-string-box-shadow-bottom-02: 0 4px 2px -2px rgba(0, 0, 0, 0.14),
    0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 6px 5px -5px rgba(0, 0, 0, 0.2);
  /* Shadow 3dp */
  --x-string-box-shadow-bottom-03: 0 7px 4px -4px rgba(0, 0, 0, 0.14),
    0 4px 3px -3px rgba(0, 0, 0, 0.12), 0 9px 8px -8px rgba(0, 0, 0, 0.2);
  /* Shadow 4dp */
  --x-string-box-shadow-bottom-04: 0 9px 5px -5px rgba(0, 0, 0, 0.14),
    0 11px 10px -10px rgba(0, 0, 0, 0.12), 0 5px 4px -4px rgba(0, 0, 0, 0.2);
  /* Shadow 6dp */
  --x-string-box-shadow-bottom-05: 0 16px 10px -10px rgba(0, 0, 0, 0.14),
    0 19px 18px -18px rgba(0, 0, 0, 0.12), 0 8px 5px -6px rgba(0, 0, 0, 0.2);
  /* Shadow 8dp */
  --x-string-box-shadow-bottom-06: 0 19px 10px -10px rgba(0, 0, 0, 0.14),
    0 19px 14px -14px rgba(0, 0, 0, 0.12), 0 7px 5px -5px rgba(0, 0, 0, 0.2);
  /* Shadow 9dp */
  --x-string-box-shadow-bottom-07: 0 22px 12px -12px rgba(0, 0, 0, 0.14),
    0 21px 16px -16px rgba(0, 0, 0, 0.12), 0 8px 6px -6px rgba(0, 0, 0, 0.2);
  /* Shadow 12dp */
  --x-string-box-shadow-bottom-08: 0 31px 17px -17px rgba(0, 0, 0, 0.14),
    0 27px 22px -22px rgba(0, 0, 0, 0.12), 0 11px 8px -8px rgba(0, 0, 0, 0.2);
  /* Shadow 16dp */
  --x-string-box-shadow-bottom-09: 0 22px 24px -4px rgba(0, 0, 0, 0.14),
    0 21px 30px -10px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
  /* Shadow 24dp */
  --x-string-box-shadow-bottom-10: 0 34px 38px -7px rgba(0, 0, 0, 0.14),
    0 29px 46px -12px rgba(0, 0, 0, 0.12), 0 11px 15px -7px rgba(0, 0, 0, 0.2);
}
.x-border-color--lead {
  border-color: var(--x-color-base-lead) !important;
}

.x-border-color--auxiliary {
  border-color: var(--x-color-base-auxiliary) !important;
}

.x-border-color--neutral-10 {
  border-color: var(--x-color-base-neutral-10) !important;
}

.x-border-color--neutral-35 {
  border-color: var(--x-color-base-neutral-35) !important;
}

.x-border-color--neutral-70 {
  border-color: var(--x-color-base-neutral-70) !important;
}

.x-border-color--neutral-95 {
  border-color: var(--x-color-base-neutral-95) !important;
}

.x-border-color--neutral-100 {
  border-color: var(--x-color-base-neutral-100) !important;
}

.x-border-color--accent {
  border-color: var(--x-color-base-accent) !important;
}

.x-border-color--enable {
  border-color: var(--x-color-base-enable) !important;
}

.x-border-color--disable {
  border-color: var(--x-color-base-disable) !important;
}

.x-border-color--transparent {
  border-color: var(--x-color-base-transparent) !important;
}
.x-border-radius--00 {
  border-radius: 0 !important;
}

.x-border-radius--pill {
  border-radius: 99999px !important;
}

.x-border-radius--01 {
  border-radius: var(--x-size-base-01) !important;
}
[dir="ltr"] .x-border-radius--top-01 {
  border-top-left-radius: var(--x-size-base-01) !important;
}
[dir="rtl"] .x-border-radius--top-01 {
  border-top-right-radius: var(--x-size-base-01) !important;
}
[dir="ltr"] .x-border-radius--top-01 {
  border-top-right-radius: var(--x-size-base-01) !important;
}
[dir="rtl"] .x-border-radius--top-01 {
  border-top-left-radius: var(--x-size-base-01) !important;
}
[dir="ltr"] .x-border-radius--bottom-01 {
  border-bottom-left-radius: var(--x-size-base-01) !important;
}
[dir="rtl"] .x-border-radius--bottom-01 {
  border-bottom-right-radius: var(--x-size-base-01) !important;
}
[dir="ltr"] .x-border-radius--bottom-01 {
  border-bottom-right-radius: var(--x-size-base-01) !important;
}
[dir="rtl"] .x-border-radius--bottom-01 {
  border-bottom-left-radius: var(--x-size-base-01) !important;
}
[dir="ltr"] .x-border-radius--right-01 {
  border-top-right-radius: var(--x-size-base-01) !important;
}
[dir="rtl"] .x-border-radius--right-01 {
  border-top-left-radius: var(--x-size-base-01) !important;
}
[dir="ltr"] .x-border-radius--right-01 {
  border-bottom-right-radius: var(--x-size-base-01) !important;
}
[dir="rtl"] .x-border-radius--right-01 {
  border-bottom-left-radius: var(--x-size-base-01) !important;
}
[dir="ltr"] .x-border-radius--left-01 {
  border-top-left-radius: var(--x-size-base-01) !important;
}
[dir="rtl"] .x-border-radius--left-01 {
  border-top-right-radius: var(--x-size-base-01) !important;
}
[dir="ltr"] .x-border-radius--left-01 {
  border-bottom-left-radius: var(--x-size-base-01) !important;
}
[dir="rtl"] .x-border-radius--left-01 {
  border-bottom-right-radius: var(--x-size-base-01) !important;
}
[dir="ltr"] .x-border-radius--top-left-01 {
  border-top-left-radius: var(--x-size-base-01) !important;
}
[dir="rtl"] .x-border-radius--top-left-01 {
  border-top-right-radius: var(--x-size-base-01) !important;
}
[dir="ltr"] .x-border-radius--top-right-01 {
  border-top-right-radius: var(--x-size-base-01) !important;
}
[dir="rtl"] .x-border-radius--top-right-01 {
  border-top-left-radius: var(--x-size-base-01) !important;
}
[dir="ltr"] .x-border-radius--bottom-left-01 {
  border-bottom-left-radius: var(--x-size-base-01) !important;
}
[dir="rtl"] .x-border-radius--bottom-left-01 {
  border-bottom-right-radius: var(--x-size-base-01) !important;
}
[dir="ltr"] .x-border-radius--bottom-right-01 {
  border-bottom-right-radius: var(--x-size-base-01) !important;
}
[dir="rtl"] .x-border-radius--bottom-right-01 {
  border-bottom-left-radius: var(--x-size-base-01) !important;
}
.x-border-radius--02 {
  border-radius: var(--x-size-base-02) !important;
}
[dir="ltr"] .x-border-radius--top-02 {
  border-top-left-radius: var(--x-size-base-02) !important;
}
[dir="rtl"] .x-border-radius--top-02 {
  border-top-right-radius: var(--x-size-base-02) !important;
}
[dir="ltr"] .x-border-radius--top-02 {
  border-top-right-radius: var(--x-size-base-02) !important;
}
[dir="rtl"] .x-border-radius--top-02 {
  border-top-left-radius: var(--x-size-base-02) !important;
}
[dir="ltr"] .x-border-radius--bottom-02 {
  border-bottom-left-radius: var(--x-size-base-02) !important;
}
[dir="rtl"] .x-border-radius--bottom-02 {
  border-bottom-right-radius: var(--x-size-base-02) !important;
}
[dir="ltr"] .x-border-radius--bottom-02 {
  border-bottom-right-radius: var(--x-size-base-02) !important;
}
[dir="rtl"] .x-border-radius--bottom-02 {
  border-bottom-left-radius: var(--x-size-base-02) !important;
}
[dir="ltr"] .x-border-radius--right-02 {
  border-top-right-radius: var(--x-size-base-02) !important;
}
[dir="rtl"] .x-border-radius--right-02 {
  border-top-left-radius: var(--x-size-base-02) !important;
}
[dir="ltr"] .x-border-radius--right-02 {
  border-bottom-right-radius: var(--x-size-base-02) !important;
}
[dir="rtl"] .x-border-radius--right-02 {
  border-bottom-left-radius: var(--x-size-base-02) !important;
}
[dir="ltr"] .x-border-radius--left-02 {
  border-top-left-radius: var(--x-size-base-02) !important;
}
[dir="rtl"] .x-border-radius--left-02 {
  border-top-right-radius: var(--x-size-base-02) !important;
}
[dir="ltr"] .x-border-radius--left-02 {
  border-bottom-left-radius: var(--x-size-base-02) !important;
}
[dir="rtl"] .x-border-radius--left-02 {
  border-bottom-right-radius: var(--x-size-base-02) !important;
}
[dir="ltr"] .x-border-radius--top-left-02 {
  border-top-left-radius: var(--x-size-base-02) !important;
}
[dir="rtl"] .x-border-radius--top-left-02 {
  border-top-right-radius: var(--x-size-base-02) !important;
}
[dir="ltr"] .x-border-radius--top-right-02 {
  border-top-right-radius: var(--x-size-base-02) !important;
}
[dir="rtl"] .x-border-radius--top-right-02 {
  border-top-left-radius: var(--x-size-base-02) !important;
}
[dir="ltr"] .x-border-radius--bottom-left-02 {
  border-bottom-left-radius: var(--x-size-base-02) !important;
}
[dir="rtl"] .x-border-radius--bottom-left-02 {
  border-bottom-right-radius: var(--x-size-base-02) !important;
}
[dir="ltr"] .x-border-radius--bottom-right-02 {
  border-bottom-right-radius: var(--x-size-base-02) !important;
}
[dir="rtl"] .x-border-radius--bottom-right-02 {
  border-bottom-left-radius: var(--x-size-base-02) !important;
}
.x-border-radius--03 {
  border-radius: var(--x-size-base-03) !important;
}
[dir="ltr"] .x-border-radius--top-03 {
  border-top-left-radius: var(--x-size-base-03) !important;
}
[dir="rtl"] .x-border-radius--top-03 {
  border-top-right-radius: var(--x-size-base-03) !important;
}
[dir="ltr"] .x-border-radius--top-03 {
  border-top-right-radius: var(--x-size-base-03) !important;
}
[dir="rtl"] .x-border-radius--top-03 {
  border-top-left-radius: var(--x-size-base-03) !important;
}
[dir="ltr"] .x-border-radius--bottom-03 {
  border-bottom-left-radius: var(--x-size-base-03) !important;
}
[dir="rtl"] .x-border-radius--bottom-03 {
  border-bottom-right-radius: var(--x-size-base-03) !important;
}
[dir="ltr"] .x-border-radius--bottom-03 {
  border-bottom-right-radius: var(--x-size-base-03) !important;
}
[dir="rtl"] .x-border-radius--bottom-03 {
  border-bottom-left-radius: var(--x-size-base-03) !important;
}
[dir="ltr"] .x-border-radius--right-03 {
  border-top-right-radius: var(--x-size-base-03) !important;
}
[dir="rtl"] .x-border-radius--right-03 {
  border-top-left-radius: var(--x-size-base-03) !important;
}
[dir="ltr"] .x-border-radius--right-03 {
  border-bottom-right-radius: var(--x-size-base-03) !important;
}
[dir="rtl"] .x-border-radius--right-03 {
  border-bottom-left-radius: var(--x-size-base-03) !important;
}
[dir="ltr"] .x-border-radius--left-03 {
  border-top-left-radius: var(--x-size-base-03) !important;
}
[dir="rtl"] .x-border-radius--left-03 {
  border-top-right-radius: var(--x-size-base-03) !important;
}
[dir="ltr"] .x-border-radius--left-03 {
  border-bottom-left-radius: var(--x-size-base-03) !important;
}
[dir="rtl"] .x-border-radius--left-03 {
  border-bottom-right-radius: var(--x-size-base-03) !important;
}
[dir="ltr"] .x-border-radius--top-left-03 {
  border-top-left-radius: var(--x-size-base-03) !important;
}
[dir="rtl"] .x-border-radius--top-left-03 {
  border-top-right-radius: var(--x-size-base-03) !important;
}
[dir="ltr"] .x-border-radius--top-right-03 {
  border-top-right-radius: var(--x-size-base-03) !important;
}
[dir="rtl"] .x-border-radius--top-right-03 {
  border-top-left-radius: var(--x-size-base-03) !important;
}
[dir="ltr"] .x-border-radius--bottom-left-03 {
  border-bottom-left-radius: var(--x-size-base-03) !important;
}
[dir="rtl"] .x-border-radius--bottom-left-03 {
  border-bottom-right-radius: var(--x-size-base-03) !important;
}
[dir="ltr"] .x-border-radius--bottom-right-03 {
  border-bottom-right-radius: var(--x-size-base-03) !important;
}
[dir="rtl"] .x-border-radius--bottom-right-03 {
  border-bottom-left-radius: var(--x-size-base-03) !important;
}
.x-border-radius--04 {
  border-radius: var(--x-size-base-04) !important;
}
[dir="ltr"] .x-border-radius--top-04 {
  border-top-left-radius: var(--x-size-base-04) !important;
}
[dir="rtl"] .x-border-radius--top-04 {
  border-top-right-radius: var(--x-size-base-04) !important;
}
[dir="ltr"] .x-border-radius--top-04 {
  border-top-right-radius: var(--x-size-base-04) !important;
}
[dir="rtl"] .x-border-radius--top-04 {
  border-top-left-radius: var(--x-size-base-04) !important;
}
[dir="ltr"] .x-border-radius--bottom-04 {
  border-bottom-left-radius: var(--x-size-base-04) !important;
}
[dir="rtl"] .x-border-radius--bottom-04 {
  border-bottom-right-radius: var(--x-size-base-04) !important;
}
[dir="ltr"] .x-border-radius--bottom-04 {
  border-bottom-right-radius: var(--x-size-base-04) !important;
}
[dir="rtl"] .x-border-radius--bottom-04 {
  border-bottom-left-radius: var(--x-size-base-04) !important;
}
[dir="ltr"] .x-border-radius--right-04 {
  border-top-right-radius: var(--x-size-base-04) !important;
}
[dir="rtl"] .x-border-radius--right-04 {
  border-top-left-radius: var(--x-size-base-04) !important;
}
[dir="ltr"] .x-border-radius--right-04 {
  border-bottom-right-radius: var(--x-size-base-04) !important;
}
[dir="rtl"] .x-border-radius--right-04 {
  border-bottom-left-radius: var(--x-size-base-04) !important;
}
[dir="ltr"] .x-border-radius--left-04 {
  border-top-left-radius: var(--x-size-base-04) !important;
}
[dir="rtl"] .x-border-radius--left-04 {
  border-top-right-radius: var(--x-size-base-04) !important;
}
[dir="ltr"] .x-border-radius--left-04 {
  border-bottom-left-radius: var(--x-size-base-04) !important;
}
[dir="rtl"] .x-border-radius--left-04 {
  border-bottom-right-radius: var(--x-size-base-04) !important;
}
[dir="ltr"] .x-border-radius--top-left-04 {
  border-top-left-radius: var(--x-size-base-04) !important;
}
[dir="rtl"] .x-border-radius--top-left-04 {
  border-top-right-radius: var(--x-size-base-04) !important;
}
[dir="ltr"] .x-border-radius--top-right-04 {
  border-top-right-radius: var(--x-size-base-04) !important;
}
[dir="rtl"] .x-border-radius--top-right-04 {
  border-top-left-radius: var(--x-size-base-04) !important;
}
[dir="ltr"] .x-border-radius--bottom-left-04 {
  border-bottom-left-radius: var(--x-size-base-04) !important;
}
[dir="rtl"] .x-border-radius--bottom-left-04 {
  border-bottom-right-radius: var(--x-size-base-04) !important;
}
[dir="ltr"] .x-border-radius--bottom-right-04 {
  border-bottom-right-radius: var(--x-size-base-04) !important;
}
[dir="rtl"] .x-border-radius--bottom-right-04 {
  border-bottom-left-radius: var(--x-size-base-04) !important;
}
.x-border-radius--05 {
  border-radius: var(--x-size-base-05) !important;
}
[dir="ltr"] .x-border-radius--top-05 {
  border-top-left-radius: var(--x-size-base-05) !important;
}
[dir="rtl"] .x-border-radius--top-05 {
  border-top-right-radius: var(--x-size-base-05) !important;
}
[dir="ltr"] .x-border-radius--top-05 {
  border-top-right-radius: var(--x-size-base-05) !important;
}
[dir="rtl"] .x-border-radius--top-05 {
  border-top-left-radius: var(--x-size-base-05) !important;
}
[dir="ltr"] .x-border-radius--bottom-05 {
  border-bottom-left-radius: var(--x-size-base-05) !important;
}
[dir="rtl"] .x-border-radius--bottom-05 {
  border-bottom-right-radius: var(--x-size-base-05) !important;
}
[dir="ltr"] .x-border-radius--bottom-05 {
  border-bottom-right-radius: var(--x-size-base-05) !important;
}
[dir="rtl"] .x-border-radius--bottom-05 {
  border-bottom-left-radius: var(--x-size-base-05) !important;
}
[dir="ltr"] .x-border-radius--right-05 {
  border-top-right-radius: var(--x-size-base-05) !important;
}
[dir="rtl"] .x-border-radius--right-05 {
  border-top-left-radius: var(--x-size-base-05) !important;
}
[dir="ltr"] .x-border-radius--right-05 {
  border-bottom-right-radius: var(--x-size-base-05) !important;
}
[dir="rtl"] .x-border-radius--right-05 {
  border-bottom-left-radius: var(--x-size-base-05) !important;
}
[dir="ltr"] .x-border-radius--left-05 {
  border-top-left-radius: var(--x-size-base-05) !important;
}
[dir="rtl"] .x-border-radius--left-05 {
  border-top-right-radius: var(--x-size-base-05) !important;
}
[dir="ltr"] .x-border-radius--left-05 {
  border-bottom-left-radius: var(--x-size-base-05) !important;
}
[dir="rtl"] .x-border-radius--left-05 {
  border-bottom-right-radius: var(--x-size-base-05) !important;
}
[dir="ltr"] .x-border-radius--top-left-05 {
  border-top-left-radius: var(--x-size-base-05) !important;
}
[dir="rtl"] .x-border-radius--top-left-05 {
  border-top-right-radius: var(--x-size-base-05) !important;
}
[dir="ltr"] .x-border-radius--top-right-05 {
  border-top-right-radius: var(--x-size-base-05) !important;
}
[dir="rtl"] .x-border-radius--top-right-05 {
  border-top-left-radius: var(--x-size-base-05) !important;
}
[dir="ltr"] .x-border-radius--bottom-left-05 {
  border-bottom-left-radius: var(--x-size-base-05) !important;
}
[dir="rtl"] .x-border-radius--bottom-left-05 {
  border-bottom-right-radius: var(--x-size-base-05) !important;
}
[dir="ltr"] .x-border-radius--bottom-right-05 {
  border-bottom-right-radius: var(--x-size-base-05) !important;
}
[dir="rtl"] .x-border-radius--bottom-right-05 {
  border-bottom-left-radius: var(--x-size-base-05) !important;
}
.x-border-radius--06 {
  border-radius: var(--x-size-base-06) !important;
}
[dir="ltr"] .x-border-radius--top-06 {
  border-top-left-radius: var(--x-size-base-06) !important;
}
[dir="rtl"] .x-border-radius--top-06 {
  border-top-right-radius: var(--x-size-base-06) !important;
}
[dir="ltr"] .x-border-radius--top-06 {
  border-top-right-radius: var(--x-size-base-06) !important;
}
[dir="rtl"] .x-border-radius--top-06 {
  border-top-left-radius: var(--x-size-base-06) !important;
}
[dir="ltr"] .x-border-radius--bottom-06 {
  border-bottom-left-radius: var(--x-size-base-06) !important;
}
[dir="rtl"] .x-border-radius--bottom-06 {
  border-bottom-right-radius: var(--x-size-base-06) !important;
}
[dir="ltr"] .x-border-radius--bottom-06 {
  border-bottom-right-radius: var(--x-size-base-06) !important;
}
[dir="rtl"] .x-border-radius--bottom-06 {
  border-bottom-left-radius: var(--x-size-base-06) !important;
}
[dir="ltr"] .x-border-radius--right-06 {
  border-top-right-radius: var(--x-size-base-06) !important;
}
[dir="rtl"] .x-border-radius--right-06 {
  border-top-left-radius: var(--x-size-base-06) !important;
}
[dir="ltr"] .x-border-radius--right-06 {
  border-bottom-right-radius: var(--x-size-base-06) !important;
}
[dir="rtl"] .x-border-radius--right-06 {
  border-bottom-left-radius: var(--x-size-base-06) !important;
}
[dir="ltr"] .x-border-radius--left-06 {
  border-top-left-radius: var(--x-size-base-06) !important;
}
[dir="rtl"] .x-border-radius--left-06 {
  border-top-right-radius: var(--x-size-base-06) !important;
}
[dir="ltr"] .x-border-radius--left-06 {
  border-bottom-left-radius: var(--x-size-base-06) !important;
}
[dir="rtl"] .x-border-radius--left-06 {
  border-bottom-right-radius: var(--x-size-base-06) !important;
}
[dir="ltr"] .x-border-radius--top-left-06 {
  border-top-left-radius: var(--x-size-base-06) !important;
}
[dir="rtl"] .x-border-radius--top-left-06 {
  border-top-right-radius: var(--x-size-base-06) !important;
}
[dir="ltr"] .x-border-radius--top-right-06 {
  border-top-right-radius: var(--x-size-base-06) !important;
}
[dir="rtl"] .x-border-radius--top-right-06 {
  border-top-left-radius: var(--x-size-base-06) !important;
}
[dir="ltr"] .x-border-radius--bottom-left-06 {
  border-bottom-left-radius: var(--x-size-base-06) !important;
}
[dir="rtl"] .x-border-radius--bottom-left-06 {
  border-bottom-right-radius: var(--x-size-base-06) !important;
}
[dir="ltr"] .x-border-radius--bottom-right-06 {
  border-bottom-right-radius: var(--x-size-base-06) !important;
}
[dir="rtl"] .x-border-radius--bottom-right-06 {
  border-bottom-left-radius: var(--x-size-base-06) !important;
}
.x-border-radius--07 {
  border-radius: var(--x-size-base-07) !important;
}
[dir="ltr"] .x-border-radius--top-07 {
  border-top-left-radius: var(--x-size-base-07) !important;
}
[dir="rtl"] .x-border-radius--top-07 {
  border-top-right-radius: var(--x-size-base-07) !important;
}
[dir="ltr"] .x-border-radius--top-07 {
  border-top-right-radius: var(--x-size-base-07) !important;
}
[dir="rtl"] .x-border-radius--top-07 {
  border-top-left-radius: var(--x-size-base-07) !important;
}
[dir="ltr"] .x-border-radius--bottom-07 {
  border-bottom-left-radius: var(--x-size-base-07) !important;
}
[dir="rtl"] .x-border-radius--bottom-07 {
  border-bottom-right-radius: var(--x-size-base-07) !important;
}
[dir="ltr"] .x-border-radius--bottom-07 {
  border-bottom-right-radius: var(--x-size-base-07) !important;
}
[dir="rtl"] .x-border-radius--bottom-07 {
  border-bottom-left-radius: var(--x-size-base-07) !important;
}
[dir="ltr"] .x-border-radius--right-07 {
  border-top-right-radius: var(--x-size-base-07) !important;
}
[dir="rtl"] .x-border-radius--right-07 {
  border-top-left-radius: var(--x-size-base-07) !important;
}
[dir="ltr"] .x-border-radius--right-07 {
  border-bottom-right-radius: var(--x-size-base-07) !important;
}
[dir="rtl"] .x-border-radius--right-07 {
  border-bottom-left-radius: var(--x-size-base-07) !important;
}
[dir="ltr"] .x-border-radius--left-07 {
  border-top-left-radius: var(--x-size-base-07) !important;
}
[dir="rtl"] .x-border-radius--left-07 {
  border-top-right-radius: var(--x-size-base-07) !important;
}
[dir="ltr"] .x-border-radius--left-07 {
  border-bottom-left-radius: var(--x-size-base-07) !important;
}
[dir="rtl"] .x-border-radius--left-07 {
  border-bottom-right-radius: var(--x-size-base-07) !important;
}
[dir="ltr"] .x-border-radius--top-left-07 {
  border-top-left-radius: var(--x-size-base-07) !important;
}
[dir="rtl"] .x-border-radius--top-left-07 {
  border-top-right-radius: var(--x-size-base-07) !important;
}
[dir="ltr"] .x-border-radius--top-right-07 {
  border-top-right-radius: var(--x-size-base-07) !important;
}
[dir="rtl"] .x-border-radius--top-right-07 {
  border-top-left-radius: var(--x-size-base-07) !important;
}
[dir="ltr"] .x-border-radius--bottom-left-07 {
  border-bottom-left-radius: var(--x-size-base-07) !important;
}
[dir="rtl"] .x-border-radius--bottom-left-07 {
  border-bottom-right-radius: var(--x-size-base-07) !important;
}
[dir="ltr"] .x-border-radius--bottom-right-07 {
  border-bottom-right-radius: var(--x-size-base-07) !important;
}
[dir="rtl"] .x-border-radius--bottom-right-07 {
  border-bottom-left-radius: var(--x-size-base-07) !important;
}
.x-border-radius--08 {
  border-radius: var(--x-size-base-08) !important;
}
[dir="ltr"] .x-border-radius--top-08 {
  border-top-left-radius: var(--x-size-base-08) !important;
}
[dir="rtl"] .x-border-radius--top-08 {
  border-top-right-radius: var(--x-size-base-08) !important;
}
[dir="ltr"] .x-border-radius--top-08 {
  border-top-right-radius: var(--x-size-base-08) !important;
}
[dir="rtl"] .x-border-radius--top-08 {
  border-top-left-radius: var(--x-size-base-08) !important;
}
[dir="ltr"] .x-border-radius--bottom-08 {
  border-bottom-left-radius: var(--x-size-base-08) !important;
}
[dir="rtl"] .x-border-radius--bottom-08 {
  border-bottom-right-radius: var(--x-size-base-08) !important;
}
[dir="ltr"] .x-border-radius--bottom-08 {
  border-bottom-right-radius: var(--x-size-base-08) !important;
}
[dir="rtl"] .x-border-radius--bottom-08 {
  border-bottom-left-radius: var(--x-size-base-08) !important;
}
[dir="ltr"] .x-border-radius--right-08 {
  border-top-right-radius: var(--x-size-base-08) !important;
}
[dir="rtl"] .x-border-radius--right-08 {
  border-top-left-radius: var(--x-size-base-08) !important;
}
[dir="ltr"] .x-border-radius--right-08 {
  border-bottom-right-radius: var(--x-size-base-08) !important;
}
[dir="rtl"] .x-border-radius--right-08 {
  border-bottom-left-radius: var(--x-size-base-08) !important;
}
[dir="ltr"] .x-border-radius--left-08 {
  border-top-left-radius: var(--x-size-base-08) !important;
}
[dir="rtl"] .x-border-radius--left-08 {
  border-top-right-radius: var(--x-size-base-08) !important;
}
[dir="ltr"] .x-border-radius--left-08 {
  border-bottom-left-radius: var(--x-size-base-08) !important;
}
[dir="rtl"] .x-border-radius--left-08 {
  border-bottom-right-radius: var(--x-size-base-08) !important;
}
[dir="ltr"] .x-border-radius--top-left-08 {
  border-top-left-radius: var(--x-size-base-08) !important;
}
[dir="rtl"] .x-border-radius--top-left-08 {
  border-top-right-radius: var(--x-size-base-08) !important;
}
[dir="ltr"] .x-border-radius--top-right-08 {
  border-top-right-radius: var(--x-size-base-08) !important;
}
[dir="rtl"] .x-border-radius--top-right-08 {
  border-top-left-radius: var(--x-size-base-08) !important;
}
[dir="ltr"] .x-border-radius--bottom-left-08 {
  border-bottom-left-radius: var(--x-size-base-08) !important;
}
[dir="rtl"] .x-border-radius--bottom-left-08 {
  border-bottom-right-radius: var(--x-size-base-08) !important;
}
[dir="ltr"] .x-border-radius--bottom-right-08 {
  border-bottom-right-radius: var(--x-size-base-08) !important;
}
[dir="rtl"] .x-border-radius--bottom-right-08 {
  border-bottom-left-radius: var(--x-size-base-08) !important;
}
.x-border-radius--09 {
  border-radius: var(--x-size-base-09) !important;
}
[dir="ltr"] .x-border-radius--top-09 {
  border-top-left-radius: var(--x-size-base-09) !important;
}
[dir="rtl"] .x-border-radius--top-09 {
  border-top-right-radius: var(--x-size-base-09) !important;
}
[dir="ltr"] .x-border-radius--top-09 {
  border-top-right-radius: var(--x-size-base-09) !important;
}
[dir="rtl"] .x-border-radius--top-09 {
  border-top-left-radius: var(--x-size-base-09) !important;
}
[dir="ltr"] .x-border-radius--bottom-09 {
  border-bottom-left-radius: var(--x-size-base-09) !important;
}
[dir="rtl"] .x-border-radius--bottom-09 {
  border-bottom-right-radius: var(--x-size-base-09) !important;
}
[dir="ltr"] .x-border-radius--bottom-09 {
  border-bottom-right-radius: var(--x-size-base-09) !important;
}
[dir="rtl"] .x-border-radius--bottom-09 {
  border-bottom-left-radius: var(--x-size-base-09) !important;
}
[dir="ltr"] .x-border-radius--right-09 {
  border-top-right-radius: var(--x-size-base-09) !important;
}
[dir="rtl"] .x-border-radius--right-09 {
  border-top-left-radius: var(--x-size-base-09) !important;
}
[dir="ltr"] .x-border-radius--right-09 {
  border-bottom-right-radius: var(--x-size-base-09) !important;
}
[dir="rtl"] .x-border-radius--right-09 {
  border-bottom-left-radius: var(--x-size-base-09) !important;
}
[dir="ltr"] .x-border-radius--left-09 {
  border-top-left-radius: var(--x-size-base-09) !important;
}
[dir="rtl"] .x-border-radius--left-09 {
  border-top-right-radius: var(--x-size-base-09) !important;
}
[dir="ltr"] .x-border-radius--left-09 {
  border-bottom-left-radius: var(--x-size-base-09) !important;
}
[dir="rtl"] .x-border-radius--left-09 {
  border-bottom-right-radius: var(--x-size-base-09) !important;
}
[dir="ltr"] .x-border-radius--top-left-09 {
  border-top-left-radius: var(--x-size-base-09) !important;
}
[dir="rtl"] .x-border-radius--top-left-09 {
  border-top-right-radius: var(--x-size-base-09) !important;
}
[dir="ltr"] .x-border-radius--top-right-09 {
  border-top-right-radius: var(--x-size-base-09) !important;
}
[dir="rtl"] .x-border-radius--top-right-09 {
  border-top-left-radius: var(--x-size-base-09) !important;
}
[dir="ltr"] .x-border-radius--bottom-left-09 {
  border-bottom-left-radius: var(--x-size-base-09) !important;
}
[dir="rtl"] .x-border-radius--bottom-left-09 {
  border-bottom-right-radius: var(--x-size-base-09) !important;
}
[dir="ltr"] .x-border-radius--bottom-right-09 {
  border-bottom-right-radius: var(--x-size-base-09) !important;
}
[dir="rtl"] .x-border-radius--bottom-right-09 {
  border-bottom-left-radius: var(--x-size-base-09) !important;
}
.x-border-radius--10 {
  border-radius: var(--x-size-base-10) !important;
}
[dir="ltr"] .x-border-radius--top-10 {
  border-top-left-radius: var(--x-size-base-10) !important;
}
[dir="rtl"] .x-border-radius--top-10 {
  border-top-right-radius: var(--x-size-base-10) !important;
}
[dir="ltr"] .x-border-radius--top-10 {
  border-top-right-radius: var(--x-size-base-10) !important;
}
[dir="rtl"] .x-border-radius--top-10 {
  border-top-left-radius: var(--x-size-base-10) !important;
}
[dir="ltr"] .x-border-radius--bottom-10 {
  border-bottom-left-radius: var(--x-size-base-10) !important;
}
[dir="rtl"] .x-border-radius--bottom-10 {
  border-bottom-right-radius: var(--x-size-base-10) !important;
}
[dir="ltr"] .x-border-radius--bottom-10 {
  border-bottom-right-radius: var(--x-size-base-10) !important;
}
[dir="rtl"] .x-border-radius--bottom-10 {
  border-bottom-left-radius: var(--x-size-base-10) !important;
}
[dir="ltr"] .x-border-radius--right-10 {
  border-top-right-radius: var(--x-size-base-10) !important;
}
[dir="rtl"] .x-border-radius--right-10 {
  border-top-left-radius: var(--x-size-base-10) !important;
}
[dir="ltr"] .x-border-radius--right-10 {
  border-bottom-right-radius: var(--x-size-base-10) !important;
}
[dir="rtl"] .x-border-radius--right-10 {
  border-bottom-left-radius: var(--x-size-base-10) !important;
}
[dir="ltr"] .x-border-radius--left-10 {
  border-top-left-radius: var(--x-size-base-10) !important;
}
[dir="rtl"] .x-border-radius--left-10 {
  border-top-right-radius: var(--x-size-base-10) !important;
}
[dir="ltr"] .x-border-radius--left-10 {
  border-bottom-left-radius: var(--x-size-base-10) !important;
}
[dir="rtl"] .x-border-radius--left-10 {
  border-bottom-right-radius: var(--x-size-base-10) !important;
}
[dir="ltr"] .x-border-radius--top-left-10 {
  border-top-left-radius: var(--x-size-base-10) !important;
}
[dir="rtl"] .x-border-radius--top-left-10 {
  border-top-right-radius: var(--x-size-base-10) !important;
}
[dir="ltr"] .x-border-radius--top-right-10 {
  border-top-right-radius: var(--x-size-base-10) !important;
}
[dir="rtl"] .x-border-radius--top-right-10 {
  border-top-left-radius: var(--x-size-base-10) !important;
}
[dir="ltr"] .x-border-radius--bottom-left-10 {
  border-bottom-left-radius: var(--x-size-base-10) !important;
}
[dir="rtl"] .x-border-radius--bottom-left-10 {
  border-bottom-right-radius: var(--x-size-base-10) !important;
}
[dir="ltr"] .x-border-radius--bottom-right-10 {
  border-bottom-right-radius: var(--x-size-base-10) !important;
}
[dir="rtl"] .x-border-radius--bottom-right-10 {
  border-bottom-left-radius: var(--x-size-base-10) !important;
}
.x-border-radius--11 {
  border-radius: var(--x-size-base-11) !important;
}
[dir="ltr"] .x-border-radius--top-11 {
  border-top-left-radius: var(--x-size-base-11) !important;
}
[dir="rtl"] .x-border-radius--top-11 {
  border-top-right-radius: var(--x-size-base-11) !important;
}
[dir="ltr"] .x-border-radius--top-11 {
  border-top-right-radius: var(--x-size-base-11) !important;
}
[dir="rtl"] .x-border-radius--top-11 {
  border-top-left-radius: var(--x-size-base-11) !important;
}
[dir="ltr"] .x-border-radius--bottom-11 {
  border-bottom-left-radius: var(--x-size-base-11) !important;
}
[dir="rtl"] .x-border-radius--bottom-11 {
  border-bottom-right-radius: var(--x-size-base-11) !important;
}
[dir="ltr"] .x-border-radius--bottom-11 {
  border-bottom-right-radius: var(--x-size-base-11) !important;
}
[dir="rtl"] .x-border-radius--bottom-11 {
  border-bottom-left-radius: var(--x-size-base-11) !important;
}
[dir="ltr"] .x-border-radius--right-11 {
  border-top-right-radius: var(--x-size-base-11) !important;
}
[dir="rtl"] .x-border-radius--right-11 {
  border-top-left-radius: var(--x-size-base-11) !important;
}
[dir="ltr"] .x-border-radius--right-11 {
  border-bottom-right-radius: var(--x-size-base-11) !important;
}
[dir="rtl"] .x-border-radius--right-11 {
  border-bottom-left-radius: var(--x-size-base-11) !important;
}
[dir="ltr"] .x-border-radius--left-11 {
  border-top-left-radius: var(--x-size-base-11) !important;
}
[dir="rtl"] .x-border-radius--left-11 {
  border-top-right-radius: var(--x-size-base-11) !important;
}
[dir="ltr"] .x-border-radius--left-11 {
  border-bottom-left-radius: var(--x-size-base-11) !important;
}
[dir="rtl"] .x-border-radius--left-11 {
  border-bottom-right-radius: var(--x-size-base-11) !important;
}
[dir="ltr"] .x-border-radius--top-left-11 {
  border-top-left-radius: var(--x-size-base-11) !important;
}
[dir="rtl"] .x-border-radius--top-left-11 {
  border-top-right-radius: var(--x-size-base-11) !important;
}
[dir="ltr"] .x-border-radius--top-right-11 {
  border-top-right-radius: var(--x-size-base-11) !important;
}
[dir="rtl"] .x-border-radius--top-right-11 {
  border-top-left-radius: var(--x-size-base-11) !important;
}
[dir="ltr"] .x-border-radius--bottom-left-11 {
  border-bottom-left-radius: var(--x-size-base-11) !important;
}
[dir="rtl"] .x-border-radius--bottom-left-11 {
  border-bottom-right-radius: var(--x-size-base-11) !important;
}
[dir="ltr"] .x-border-radius--bottom-right-11 {
  border-bottom-right-radius: var(--x-size-base-11) !important;
}
[dir="rtl"] .x-border-radius--bottom-right-11 {
  border-bottom-left-radius: var(--x-size-base-11) !important;
}
.x-border-radius--12 {
  border-radius: var(--x-size-base-12) !important;
}
[dir="ltr"] .x-border-radius--top-12 {
  border-top-left-radius: var(--x-size-base-12) !important;
}
[dir="rtl"] .x-border-radius--top-12 {
  border-top-right-radius: var(--x-size-base-12) !important;
}
[dir="ltr"] .x-border-radius--top-12 {
  border-top-right-radius: var(--x-size-base-12) !important;
}
[dir="rtl"] .x-border-radius--top-12 {
  border-top-left-radius: var(--x-size-base-12) !important;
}
[dir="ltr"] .x-border-radius--bottom-12 {
  border-bottom-left-radius: var(--x-size-base-12) !important;
}
[dir="rtl"] .x-border-radius--bottom-12 {
  border-bottom-right-radius: var(--x-size-base-12) !important;
}
[dir="ltr"] .x-border-radius--bottom-12 {
  border-bottom-right-radius: var(--x-size-base-12) !important;
}
[dir="rtl"] .x-border-radius--bottom-12 {
  border-bottom-left-radius: var(--x-size-base-12) !important;
}
[dir="ltr"] .x-border-radius--right-12 {
  border-top-right-radius: var(--x-size-base-12) !important;
}
[dir="rtl"] .x-border-radius--right-12 {
  border-top-left-radius: var(--x-size-base-12) !important;
}
[dir="ltr"] .x-border-radius--right-12 {
  border-bottom-right-radius: var(--x-size-base-12) !important;
}
[dir="rtl"] .x-border-radius--right-12 {
  border-bottom-left-radius: var(--x-size-base-12) !important;
}
[dir="ltr"] .x-border-radius--left-12 {
  border-top-left-radius: var(--x-size-base-12) !important;
}
[dir="rtl"] .x-border-radius--left-12 {
  border-top-right-radius: var(--x-size-base-12) !important;
}
[dir="ltr"] .x-border-radius--left-12 {
  border-bottom-left-radius: var(--x-size-base-12) !important;
}
[dir="rtl"] .x-border-radius--left-12 {
  border-bottom-right-radius: var(--x-size-base-12) !important;
}
[dir="ltr"] .x-border-radius--top-left-12 {
  border-top-left-radius: var(--x-size-base-12) !important;
}
[dir="rtl"] .x-border-radius--top-left-12 {
  border-top-right-radius: var(--x-size-base-12) !important;
}
[dir="ltr"] .x-border-radius--top-right-12 {
  border-top-right-radius: var(--x-size-base-12) !important;
}
[dir="rtl"] .x-border-radius--top-right-12 {
  border-top-left-radius: var(--x-size-base-12) !important;
}
[dir="ltr"] .x-border-radius--bottom-left-12 {
  border-bottom-left-radius: var(--x-size-base-12) !important;
}
[dir="rtl"] .x-border-radius--bottom-left-12 {
  border-bottom-right-radius: var(--x-size-base-12) !important;
}
[dir="ltr"] .x-border-radius--bottom-right-12 {
  border-bottom-right-radius: var(--x-size-base-12) !important;
}
[dir="rtl"] .x-border-radius--bottom-right-12 {
  border-bottom-left-radius: var(--x-size-base-12) !important;
}
.x-border-radius--13 {
  border-radius: var(--x-size-base-13) !important;
}
[dir="ltr"] .x-border-radius--top-13 {
  border-top-left-radius: var(--x-size-base-13) !important;
}
[dir="rtl"] .x-border-radius--top-13 {
  border-top-right-radius: var(--x-size-base-13) !important;
}
[dir="ltr"] .x-border-radius--top-13 {
  border-top-right-radius: var(--x-size-base-13) !important;
}
[dir="rtl"] .x-border-radius--top-13 {
  border-top-left-radius: var(--x-size-base-13) !important;
}
[dir="ltr"] .x-border-radius--bottom-13 {
  border-bottom-left-radius: var(--x-size-base-13) !important;
}
[dir="rtl"] .x-border-radius--bottom-13 {
  border-bottom-right-radius: var(--x-size-base-13) !important;
}
[dir="ltr"] .x-border-radius--bottom-13 {
  border-bottom-right-radius: var(--x-size-base-13) !important;
}
[dir="rtl"] .x-border-radius--bottom-13 {
  border-bottom-left-radius: var(--x-size-base-13) !important;
}
[dir="ltr"] .x-border-radius--right-13 {
  border-top-right-radius: var(--x-size-base-13) !important;
}
[dir="rtl"] .x-border-radius--right-13 {
  border-top-left-radius: var(--x-size-base-13) !important;
}
[dir="ltr"] .x-border-radius--right-13 {
  border-bottom-right-radius: var(--x-size-base-13) !important;
}
[dir="rtl"] .x-border-radius--right-13 {
  border-bottom-left-radius: var(--x-size-base-13) !important;
}
[dir="ltr"] .x-border-radius--left-13 {
  border-top-left-radius: var(--x-size-base-13) !important;
}
[dir="rtl"] .x-border-radius--left-13 {
  border-top-right-radius: var(--x-size-base-13) !important;
}
[dir="ltr"] .x-border-radius--left-13 {
  border-bottom-left-radius: var(--x-size-base-13) !important;
}
[dir="rtl"] .x-border-radius--left-13 {
  border-bottom-right-radius: var(--x-size-base-13) !important;
}
[dir="ltr"] .x-border-radius--top-left-13 {
  border-top-left-radius: var(--x-size-base-13) !important;
}
[dir="rtl"] .x-border-radius--top-left-13 {
  border-top-right-radius: var(--x-size-base-13) !important;
}
[dir="ltr"] .x-border-radius--top-right-13 {
  border-top-right-radius: var(--x-size-base-13) !important;
}
[dir="rtl"] .x-border-radius--top-right-13 {
  border-top-left-radius: var(--x-size-base-13) !important;
}
[dir="ltr"] .x-border-radius--bottom-left-13 {
  border-bottom-left-radius: var(--x-size-base-13) !important;
}
[dir="rtl"] .x-border-radius--bottom-left-13 {
  border-bottom-right-radius: var(--x-size-base-13) !important;
}
[dir="ltr"] .x-border-radius--bottom-right-13 {
  border-bottom-right-radius: var(--x-size-base-13) !important;
}
[dir="rtl"] .x-border-radius--bottom-right-13 {
  border-bottom-left-radius: var(--x-size-base-13) !important;
}
.x-border-radius--14 {
  border-radius: var(--x-size-base-14) !important;
}
[dir="ltr"] .x-border-radius--top-14 {
  border-top-left-radius: var(--x-size-base-14) !important;
}
[dir="rtl"] .x-border-radius--top-14 {
  border-top-right-radius: var(--x-size-base-14) !important;
}
[dir="ltr"] .x-border-radius--top-14 {
  border-top-right-radius: var(--x-size-base-14) !important;
}
[dir="rtl"] .x-border-radius--top-14 {
  border-top-left-radius: var(--x-size-base-14) !important;
}
[dir="ltr"] .x-border-radius--bottom-14 {
  border-bottom-left-radius: var(--x-size-base-14) !important;
}
[dir="rtl"] .x-border-radius--bottom-14 {
  border-bottom-right-radius: var(--x-size-base-14) !important;
}
[dir="ltr"] .x-border-radius--bottom-14 {
  border-bottom-right-radius: var(--x-size-base-14) !important;
}
[dir="rtl"] .x-border-radius--bottom-14 {
  border-bottom-left-radius: var(--x-size-base-14) !important;
}
[dir="ltr"] .x-border-radius--right-14 {
  border-top-right-radius: var(--x-size-base-14) !important;
}
[dir="rtl"] .x-border-radius--right-14 {
  border-top-left-radius: var(--x-size-base-14) !important;
}
[dir="ltr"] .x-border-radius--right-14 {
  border-bottom-right-radius: var(--x-size-base-14) !important;
}
[dir="rtl"] .x-border-radius--right-14 {
  border-bottom-left-radius: var(--x-size-base-14) !important;
}
[dir="ltr"] .x-border-radius--left-14 {
  border-top-left-radius: var(--x-size-base-14) !important;
}
[dir="rtl"] .x-border-radius--left-14 {
  border-top-right-radius: var(--x-size-base-14) !important;
}
[dir="ltr"] .x-border-radius--left-14 {
  border-bottom-left-radius: var(--x-size-base-14) !important;
}
[dir="rtl"] .x-border-radius--left-14 {
  border-bottom-right-radius: var(--x-size-base-14) !important;
}
[dir="ltr"] .x-border-radius--top-left-14 {
  border-top-left-radius: var(--x-size-base-14) !important;
}
[dir="rtl"] .x-border-radius--top-left-14 {
  border-top-right-radius: var(--x-size-base-14) !important;
}
[dir="ltr"] .x-border-radius--top-right-14 {
  border-top-right-radius: var(--x-size-base-14) !important;
}
[dir="rtl"] .x-border-radius--top-right-14 {
  border-top-left-radius: var(--x-size-base-14) !important;
}
[dir="ltr"] .x-border-radius--bottom-left-14 {
  border-bottom-left-radius: var(--x-size-base-14) !important;
}
[dir="rtl"] .x-border-radius--bottom-left-14 {
  border-bottom-right-radius: var(--x-size-base-14) !important;
}
[dir="ltr"] .x-border-radius--bottom-right-14 {
  border-bottom-right-radius: var(--x-size-base-14) !important;
}
[dir="rtl"] .x-border-radius--bottom-right-14 {
  border-bottom-left-radius: var(--x-size-base-14) !important;
}
.x-border-radius--15 {
  border-radius: var(--x-size-base-15) !important;
}
[dir="ltr"] .x-border-radius--top-15 {
  border-top-left-radius: var(--x-size-base-15) !important;
}
[dir="rtl"] .x-border-radius--top-15 {
  border-top-right-radius: var(--x-size-base-15) !important;
}
[dir="ltr"] .x-border-radius--top-15 {
  border-top-right-radius: var(--x-size-base-15) !important;
}
[dir="rtl"] .x-border-radius--top-15 {
  border-top-left-radius: var(--x-size-base-15) !important;
}
[dir="ltr"] .x-border-radius--bottom-15 {
  border-bottom-left-radius: var(--x-size-base-15) !important;
}
[dir="rtl"] .x-border-radius--bottom-15 {
  border-bottom-right-radius: var(--x-size-base-15) !important;
}
[dir="ltr"] .x-border-radius--bottom-15 {
  border-bottom-right-radius: var(--x-size-base-15) !important;
}
[dir="rtl"] .x-border-radius--bottom-15 {
  border-bottom-left-radius: var(--x-size-base-15) !important;
}
[dir="ltr"] .x-border-radius--right-15 {
  border-top-right-radius: var(--x-size-base-15) !important;
}
[dir="rtl"] .x-border-radius--right-15 {
  border-top-left-radius: var(--x-size-base-15) !important;
}
[dir="ltr"] .x-border-radius--right-15 {
  border-bottom-right-radius: var(--x-size-base-15) !important;
}
[dir="rtl"] .x-border-radius--right-15 {
  border-bottom-left-radius: var(--x-size-base-15) !important;
}
[dir="ltr"] .x-border-radius--left-15 {
  border-top-left-radius: var(--x-size-base-15) !important;
}
[dir="rtl"] .x-border-radius--left-15 {
  border-top-right-radius: var(--x-size-base-15) !important;
}
[dir="ltr"] .x-border-radius--left-15 {
  border-bottom-left-radius: var(--x-size-base-15) !important;
}
[dir="rtl"] .x-border-radius--left-15 {
  border-bottom-right-radius: var(--x-size-base-15) !important;
}
[dir="ltr"] .x-border-radius--top-left-15 {
  border-top-left-radius: var(--x-size-base-15) !important;
}
[dir="rtl"] .x-border-radius--top-left-15 {
  border-top-right-radius: var(--x-size-base-15) !important;
}
[dir="ltr"] .x-border-radius--top-right-15 {
  border-top-right-radius: var(--x-size-base-15) !important;
}
[dir="rtl"] .x-border-radius--top-right-15 {
  border-top-left-radius: var(--x-size-base-15) !important;
}
[dir="ltr"] .x-border-radius--bottom-left-15 {
  border-bottom-left-radius: var(--x-size-base-15) !important;
}
[dir="rtl"] .x-border-radius--bottom-left-15 {
  border-bottom-right-radius: var(--x-size-base-15) !important;
}
[dir="ltr"] .x-border-radius--bottom-right-15 {
  border-bottom-right-radius: var(--x-size-base-15) !important;
}
[dir="rtl"] .x-border-radius--bottom-right-15 {
  border-bottom-left-radius: var(--x-size-base-15) !important;
}
.x-border-radius--16 {
  border-radius: var(--x-size-base-16) !important;
}
[dir="ltr"] .x-border-radius--top-16 {
  border-top-left-radius: var(--x-size-base-16) !important;
}
[dir="rtl"] .x-border-radius--top-16 {
  border-top-right-radius: var(--x-size-base-16) !important;
}
[dir="ltr"] .x-border-radius--top-16 {
  border-top-right-radius: var(--x-size-base-16) !important;
}
[dir="rtl"] .x-border-radius--top-16 {
  border-top-left-radius: var(--x-size-base-16) !important;
}
[dir="ltr"] .x-border-radius--bottom-16 {
  border-bottom-left-radius: var(--x-size-base-16) !important;
}
[dir="rtl"] .x-border-radius--bottom-16 {
  border-bottom-right-radius: var(--x-size-base-16) !important;
}
[dir="ltr"] .x-border-radius--bottom-16 {
  border-bottom-right-radius: var(--x-size-base-16) !important;
}
[dir="rtl"] .x-border-radius--bottom-16 {
  border-bottom-left-radius: var(--x-size-base-16) !important;
}
[dir="ltr"] .x-border-radius--right-16 {
  border-top-right-radius: var(--x-size-base-16) !important;
}
[dir="rtl"] .x-border-radius--right-16 {
  border-top-left-radius: var(--x-size-base-16) !important;
}
[dir="ltr"] .x-border-radius--right-16 {
  border-bottom-right-radius: var(--x-size-base-16) !important;
}
[dir="rtl"] .x-border-radius--right-16 {
  border-bottom-left-radius: var(--x-size-base-16) !important;
}
[dir="ltr"] .x-border-radius--left-16 {
  border-top-left-radius: var(--x-size-base-16) !important;
}
[dir="rtl"] .x-border-radius--left-16 {
  border-top-right-radius: var(--x-size-base-16) !important;
}
[dir="ltr"] .x-border-radius--left-16 {
  border-bottom-left-radius: var(--x-size-base-16) !important;
}
[dir="rtl"] .x-border-radius--left-16 {
  border-bottom-right-radius: var(--x-size-base-16) !important;
}
[dir="ltr"] .x-border-radius--top-left-16 {
  border-top-left-radius: var(--x-size-base-16) !important;
}
[dir="rtl"] .x-border-radius--top-left-16 {
  border-top-right-radius: var(--x-size-base-16) !important;
}
[dir="ltr"] .x-border-radius--top-right-16 {
  border-top-right-radius: var(--x-size-base-16) !important;
}
[dir="rtl"] .x-border-radius--top-right-16 {
  border-top-left-radius: var(--x-size-base-16) !important;
}
[dir="ltr"] .x-border-radius--bottom-left-16 {
  border-bottom-left-radius: var(--x-size-base-16) !important;
}
[dir="rtl"] .x-border-radius--bottom-left-16 {
  border-bottom-right-radius: var(--x-size-base-16) !important;
}
[dir="ltr"] .x-border-radius--bottom-right-16 {
  border-bottom-right-radius: var(--x-size-base-16) !important;
}
[dir="rtl"] .x-border-radius--bottom-right-16 {
  border-bottom-left-radius: var(--x-size-base-16) !important;
}
.x-border-radius--17 {
  border-radius: var(--x-size-base-17) !important;
}
[dir="ltr"] .x-border-radius--top-17 {
  border-top-left-radius: var(--x-size-base-17) !important;
}
[dir="rtl"] .x-border-radius--top-17 {
  border-top-right-radius: var(--x-size-base-17) !important;
}
[dir="ltr"] .x-border-radius--top-17 {
  border-top-right-radius: var(--x-size-base-17) !important;
}
[dir="rtl"] .x-border-radius--top-17 {
  border-top-left-radius: var(--x-size-base-17) !important;
}
[dir="ltr"] .x-border-radius--bottom-17 {
  border-bottom-left-radius: var(--x-size-base-17) !important;
}
[dir="rtl"] .x-border-radius--bottom-17 {
  border-bottom-right-radius: var(--x-size-base-17) !important;
}
[dir="ltr"] .x-border-radius--bottom-17 {
  border-bottom-right-radius: var(--x-size-base-17) !important;
}
[dir="rtl"] .x-border-radius--bottom-17 {
  border-bottom-left-radius: var(--x-size-base-17) !important;
}
[dir="ltr"] .x-border-radius--right-17 {
  border-top-right-radius: var(--x-size-base-17) !important;
}
[dir="rtl"] .x-border-radius--right-17 {
  border-top-left-radius: var(--x-size-base-17) !important;
}
[dir="ltr"] .x-border-radius--right-17 {
  border-bottom-right-radius: var(--x-size-base-17) !important;
}
[dir="rtl"] .x-border-radius--right-17 {
  border-bottom-left-radius: var(--x-size-base-17) !important;
}
[dir="ltr"] .x-border-radius--left-17 {
  border-top-left-radius: var(--x-size-base-17) !important;
}
[dir="rtl"] .x-border-radius--left-17 {
  border-top-right-radius: var(--x-size-base-17) !important;
}
[dir="ltr"] .x-border-radius--left-17 {
  border-bottom-left-radius: var(--x-size-base-17) !important;
}
[dir="rtl"] .x-border-radius--left-17 {
  border-bottom-right-radius: var(--x-size-base-17) !important;
}
[dir="ltr"] .x-border-radius--top-left-17 {
  border-top-left-radius: var(--x-size-base-17) !important;
}
[dir="rtl"] .x-border-radius--top-left-17 {
  border-top-right-radius: var(--x-size-base-17) !important;
}
[dir="ltr"] .x-border-radius--top-right-17 {
  border-top-right-radius: var(--x-size-base-17) !important;
}
[dir="rtl"] .x-border-radius--top-right-17 {
  border-top-left-radius: var(--x-size-base-17) !important;
}
[dir="ltr"] .x-border-radius--bottom-left-17 {
  border-bottom-left-radius: var(--x-size-base-17) !important;
}
[dir="rtl"] .x-border-radius--bottom-left-17 {
  border-bottom-right-radius: var(--x-size-base-17) !important;
}
[dir="ltr"] .x-border-radius--bottom-right-17 {
  border-bottom-right-radius: var(--x-size-base-17) !important;
}
[dir="rtl"] .x-border-radius--bottom-right-17 {
  border-bottom-left-radius: var(--x-size-base-17) !important;
}
.x-border-radius--18 {
  border-radius: var(--x-size-base-18) !important;
}
[dir="ltr"] .x-border-radius--top-18 {
  border-top-left-radius: var(--x-size-base-18) !important;
}
[dir="rtl"] .x-border-radius--top-18 {
  border-top-right-radius: var(--x-size-base-18) !important;
}
[dir="ltr"] .x-border-radius--top-18 {
  border-top-right-radius: var(--x-size-base-18) !important;
}
[dir="rtl"] .x-border-radius--top-18 {
  border-top-left-radius: var(--x-size-base-18) !important;
}
[dir="ltr"] .x-border-radius--bottom-18 {
  border-bottom-left-radius: var(--x-size-base-18) !important;
}
[dir="rtl"] .x-border-radius--bottom-18 {
  border-bottom-right-radius: var(--x-size-base-18) !important;
}
[dir="ltr"] .x-border-radius--bottom-18 {
  border-bottom-right-radius: var(--x-size-base-18) !important;
}
[dir="rtl"] .x-border-radius--bottom-18 {
  border-bottom-left-radius: var(--x-size-base-18) !important;
}
[dir="ltr"] .x-border-radius--right-18 {
  border-top-right-radius: var(--x-size-base-18) !important;
}
[dir="rtl"] .x-border-radius--right-18 {
  border-top-left-radius: var(--x-size-base-18) !important;
}
[dir="ltr"] .x-border-radius--right-18 {
  border-bottom-right-radius: var(--x-size-base-18) !important;
}
[dir="rtl"] .x-border-radius--right-18 {
  border-bottom-left-radius: var(--x-size-base-18) !important;
}
[dir="ltr"] .x-border-radius--left-18 {
  border-top-left-radius: var(--x-size-base-18) !important;
}
[dir="rtl"] .x-border-radius--left-18 {
  border-top-right-radius: var(--x-size-base-18) !important;
}
[dir="ltr"] .x-border-radius--left-18 {
  border-bottom-left-radius: var(--x-size-base-18) !important;
}
[dir="rtl"] .x-border-radius--left-18 {
  border-bottom-right-radius: var(--x-size-base-18) !important;
}
[dir="ltr"] .x-border-radius--top-left-18 {
  border-top-left-radius: var(--x-size-base-18) !important;
}
[dir="rtl"] .x-border-radius--top-left-18 {
  border-top-right-radius: var(--x-size-base-18) !important;
}
[dir="ltr"] .x-border-radius--top-right-18 {
  border-top-right-radius: var(--x-size-base-18) !important;
}
[dir="rtl"] .x-border-radius--top-right-18 {
  border-top-left-radius: var(--x-size-base-18) !important;
}
[dir="ltr"] .x-border-radius--bottom-left-18 {
  border-bottom-left-radius: var(--x-size-base-18) !important;
}
[dir="rtl"] .x-border-radius--bottom-left-18 {
  border-bottom-right-radius: var(--x-size-base-18) !important;
}
[dir="ltr"] .x-border-radius--bottom-right-18 {
  border-bottom-right-radius: var(--x-size-base-18) !important;
}
[dir="rtl"] .x-border-radius--bottom-right-18 {
  border-bottom-left-radius: var(--x-size-base-18) !important;
}
.x-border-radius--19 {
  border-radius: var(--x-size-base-19) !important;
}
[dir="ltr"] .x-border-radius--top-19 {
  border-top-left-radius: var(--x-size-base-19) !important;
}
[dir="rtl"] .x-border-radius--top-19 {
  border-top-right-radius: var(--x-size-base-19) !important;
}
[dir="ltr"] .x-border-radius--top-19 {
  border-top-right-radius: var(--x-size-base-19) !important;
}
[dir="rtl"] .x-border-radius--top-19 {
  border-top-left-radius: var(--x-size-base-19) !important;
}
[dir="ltr"] .x-border-radius--bottom-19 {
  border-bottom-left-radius: var(--x-size-base-19) !important;
}
[dir="rtl"] .x-border-radius--bottom-19 {
  border-bottom-right-radius: var(--x-size-base-19) !important;
}
[dir="ltr"] .x-border-radius--bottom-19 {
  border-bottom-right-radius: var(--x-size-base-19) !important;
}
[dir="rtl"] .x-border-radius--bottom-19 {
  border-bottom-left-radius: var(--x-size-base-19) !important;
}
[dir="ltr"] .x-border-radius--right-19 {
  border-top-right-radius: var(--x-size-base-19) !important;
}
[dir="rtl"] .x-border-radius--right-19 {
  border-top-left-radius: var(--x-size-base-19) !important;
}
[dir="ltr"] .x-border-radius--right-19 {
  border-bottom-right-radius: var(--x-size-base-19) !important;
}
[dir="rtl"] .x-border-radius--right-19 {
  border-bottom-left-radius: var(--x-size-base-19) !important;
}
[dir="ltr"] .x-border-radius--left-19 {
  border-top-left-radius: var(--x-size-base-19) !important;
}
[dir="rtl"] .x-border-radius--left-19 {
  border-top-right-radius: var(--x-size-base-19) !important;
}
[dir="ltr"] .x-border-radius--left-19 {
  border-bottom-left-radius: var(--x-size-base-19) !important;
}
[dir="rtl"] .x-border-radius--left-19 {
  border-bottom-right-radius: var(--x-size-base-19) !important;
}
[dir="ltr"] .x-border-radius--top-left-19 {
  border-top-left-radius: var(--x-size-base-19) !important;
}
[dir="rtl"] .x-border-radius--top-left-19 {
  border-top-right-radius: var(--x-size-base-19) !important;
}
[dir="ltr"] .x-border-radius--top-right-19 {
  border-top-right-radius: var(--x-size-base-19) !important;
}
[dir="rtl"] .x-border-radius--top-right-19 {
  border-top-left-radius: var(--x-size-base-19) !important;
}
[dir="ltr"] .x-border-radius--bottom-left-19 {
  border-bottom-left-radius: var(--x-size-base-19) !important;
}
[dir="rtl"] .x-border-radius--bottom-left-19 {
  border-bottom-right-radius: var(--x-size-base-19) !important;
}
[dir="ltr"] .x-border-radius--bottom-right-19 {
  border-bottom-right-radius: var(--x-size-base-19) !important;
}
[dir="rtl"] .x-border-radius--bottom-right-19 {
  border-bottom-left-radius: var(--x-size-base-19) !important;
}
.x-border-radius--20 {
  border-radius: var(--x-size-base-20) !important;
}
[dir="ltr"] .x-border-radius--top-20 {
  border-top-left-radius: var(--x-size-base-20) !important;
}
[dir="rtl"] .x-border-radius--top-20 {
  border-top-right-radius: var(--x-size-base-20) !important;
}
[dir="ltr"] .x-border-radius--top-20 {
  border-top-right-radius: var(--x-size-base-20) !important;
}
[dir="rtl"] .x-border-radius--top-20 {
  border-top-left-radius: var(--x-size-base-20) !important;
}
[dir="ltr"] .x-border-radius--bottom-20 {
  border-bottom-left-radius: var(--x-size-base-20) !important;
}
[dir="rtl"] .x-border-radius--bottom-20 {
  border-bottom-right-radius: var(--x-size-base-20) !important;
}
[dir="ltr"] .x-border-radius--bottom-20 {
  border-bottom-right-radius: var(--x-size-base-20) !important;
}
[dir="rtl"] .x-border-radius--bottom-20 {
  border-bottom-left-radius: var(--x-size-base-20) !important;
}
[dir="ltr"] .x-border-radius--right-20 {
  border-top-right-radius: var(--x-size-base-20) !important;
}
[dir="rtl"] .x-border-radius--right-20 {
  border-top-left-radius: var(--x-size-base-20) !important;
}
[dir="ltr"] .x-border-radius--right-20 {
  border-bottom-right-radius: var(--x-size-base-20) !important;
}
[dir="rtl"] .x-border-radius--right-20 {
  border-bottom-left-radius: var(--x-size-base-20) !important;
}
[dir="ltr"] .x-border-radius--left-20 {
  border-top-left-radius: var(--x-size-base-20) !important;
}
[dir="rtl"] .x-border-radius--left-20 {
  border-top-right-radius: var(--x-size-base-20) !important;
}
[dir="ltr"] .x-border-radius--left-20 {
  border-bottom-left-radius: var(--x-size-base-20) !important;
}
[dir="rtl"] .x-border-radius--left-20 {
  border-bottom-right-radius: var(--x-size-base-20) !important;
}
[dir="ltr"] .x-border-radius--top-left-20 {
  border-top-left-radius: var(--x-size-base-20) !important;
}
[dir="rtl"] .x-border-radius--top-left-20 {
  border-top-right-radius: var(--x-size-base-20) !important;
}
[dir="ltr"] .x-border-radius--top-right-20 {
  border-top-right-radius: var(--x-size-base-20) !important;
}
[dir="rtl"] .x-border-radius--top-right-20 {
  border-top-left-radius: var(--x-size-base-20) !important;
}
[dir="ltr"] .x-border-radius--bottom-left-20 {
  border-bottom-left-radius: var(--x-size-base-20) !important;
}
[dir="rtl"] .x-border-radius--bottom-left-20 {
  border-bottom-right-radius: var(--x-size-base-20) !important;
}
[dir="ltr"] .x-border-radius--bottom-right-20 {
  border-bottom-right-radius: var(--x-size-base-20) !important;
}
[dir="rtl"] .x-border-radius--bottom-right-20 {
  border-bottom-left-radius: var(--x-size-base-20) !important;
}
.x-background--lead {
  background-color: var(--x-color-base-lead) !important;
}

.x-background--auxiliary {
  background-color: var(--x-color-base-auxiliary) !important;
}

.x-background--neutral-10 {
  background-color: var(--x-color-base-neutral-10) !important;
}

.x-background--neutral-35 {
  background-color: var(--x-color-base-neutral-35) !important;
}

.x-background--neutral-70 {
  background-color: var(--x-color-base-neutral-70) !important;
}

.x-background--neutral-95 {
  background-color: var(--x-color-base-neutral-95) !important;
}

.x-background--neutral-100 {
  background-color: var(--x-color-base-neutral-100) !important;
}

.x-background--accent {
  background-color: var(--x-color-base-accent) !important;
}

.x-background--enable {
  background-color: var(--x-color-base-enable) !important;
}

.x-background--disable {
  background-color: var(--x-color-base-disable) !important;
}

.x-background--transparent {
  background-color: var(--x-color-base-transparent) !important;
}
:root {
  --x-color-text-secondary: var(--x-color-base-neutral-35);
}
.x-text--stroke.x-text {
  --x-string-text-decoration: line-through;
}
.x-text--stroke.x-title1 {
  --x-string-text-decoration-title1: line-through;
}
.x-text--stroke.x-title2 {
  --x-string-text-decoration-title2: line-through;
}
.x-text--stroke.x-title3 {
  --x-string-text-decoration-title3: line-through;
}
.x-text--stroke.x-small {
  --x-string-text-decoration-small: line-through;
}
.x-text--secondary {
  --x-color-text-default: var(--x-color-text-secondary);
}
.x-text--light.x-text {
  --x-number-font-weight-text: var(--x-number-font-weight-base-light);
}
.x-text--light.x-title1 {
  --x-number-font-weight-title1: var(--x-number-font-weight-base-light);
}
.x-text--light.x-title2 {
  --x-number-font-weight-title2: var(--x-number-font-weight-base-light);
}
.x-text--light.x-title3 {
  --x-number-font-weight-title3: var(--x-number-font-weight-base-light);
}
.x-text--light.x-small {
  --x-number-font-weight-small: var(--x-number-font-weight-base-light);
}
:root {
  --x-font-family-base: "Montserrat", sans-serif;
  --x-size-font-base-xs: 12px;
  --x-size-font-base-s: 14px;
  --x-size-font-base-m: 16px;
  --x-size-font-base-l: 18px;
  --x-size-font-base-xl: 32px;
  --x-number-font-weight-base-light: 300;
  --x-number-font-weight-base-regular: 400;
  --x-number-font-weight-base-bold: 600;
  --x-size-line-height-base-s: 16px;
  --x-size-line-height-base-m: 24px;
  --x-size-line-height-base-l: 32px;
  --x-color-text-default: var(--x-color-base-neutral-10);
  --x-font-family-text: var(--x-font-family-base);
  --x-size-font-text: var(--x-size-font-base-s);
  --x-number-font-weight-text: var(--x-number-font-weight-base-regular);
  --x-size-line-height-text: var(--x-size-line-height-base-s);
  --x-string-text-decoration-text: none;
  --x-font-family-title1: var(--x-font-family-base);
  --x-size-font-title1: var(--x-size-font-base-xl);
  --x-number-font-weight-title1: var(--x-number-font-weight-base-regular);
  --x-size-line-height-title1: var(--x-size-line-height-base-l);
  --x-string-text-decoration-title1: none;
  --x-font-family-title2: var(--x-font-family-base);
  --x-size-font-title2: var(--x-size-font-base-l);
  --x-number-font-weight-title2: var(--x-number-font-weight-base-regular);
  --x-size-line-height-title2: var(--x-size-line-height-base-m);
  --x-string-text-decoration-title2: none;
  --x-font-family-title3: var(--x-font-family-base);
  --x-size-font-title3: var(--x-size-font-base-m);
  --x-number-font-weight-title3: var(--x-number-font-weight-base-regular);
  --x-size-line-height-title3: var(--x-size-line-height-base-m);
  --x-string-text-decoration-title3: none;
  --x-font-family-small: var(--x-font-family-base);
  --x-size-font-small: var(--x-size-font-base-xs);
  --x-number-font-weight-small: var(--x-number-font-weight-base-regular);
  --x-size-line-height-small: var(--x-size-line-height-base-s);
  --x-string-text-decoration-small: none;
}
:root {
  --x-font-family-base: "Montserrat", sans-serif;
  --x-size-font-base-xs: 12px;
  --x-size-font-base-s: 14px;
  --x-size-font-base-m: 16px;
  --x-size-font-base-l: 18px;
  --x-size-font-base-xl: 32px;
  --x-number-font-weight-base-light: 300;
  --x-number-font-weight-base-regular: 400;
  --x-number-font-weight-base-bold: 600;
  --x-size-line-height-base-s: 16px;
  --x-size-line-height-base-m: 24px;
  --x-size-line-height-base-l: 32px;
  --x-color-text-default: var(--x-color-base-neutral-10);
  --x-font-family-text: var(--x-font-family-base);
  --x-size-font-text: var(--x-size-font-base-s);
  --x-number-font-weight-text: var(--x-number-font-weight-base-regular);
  --x-size-line-height-text: var(--x-size-line-height-base-s);
  --x-string-text-decoration-text: none;
  --x-font-family-title1: var(--x-font-family-base);
  --x-size-font-title1: var(--x-size-font-base-xl);
  --x-number-font-weight-title1: var(--x-number-font-weight-base-regular);
  --x-size-line-height-title1: var(--x-size-line-height-base-l);
  --x-string-text-decoration-title1: none;
  --x-font-family-title2: var(--x-font-family-base);
  --x-size-font-title2: var(--x-size-font-base-l);
  --x-number-font-weight-title2: var(--x-number-font-weight-base-regular);
  --x-size-line-height-title2: var(--x-size-line-height-base-m);
  --x-string-text-decoration-title2: none;
  --x-font-family-title3: var(--x-font-family-base);
  --x-size-font-title3: var(--x-size-font-base-m);
  --x-number-font-weight-title3: var(--x-number-font-weight-base-regular);
  --x-size-line-height-title3: var(--x-size-line-height-base-m);
  --x-string-text-decoration-title3: none;
  --x-font-family-small: var(--x-font-family-base);
  --x-size-font-small: var(--x-size-font-base-xs);
  --x-number-font-weight-small: var(--x-number-font-weight-base-regular);
  --x-size-line-height-small: var(--x-size-line-height-base-s);
  --x-string-text-decoration-small: none;
}

.x,
.x-text {
  font-family: var(--x-font-family-text);
  font-size: var(--x-size-font-text);
  font-weight: var(--x-number-font-weight-text);
  line-height: var(--x-size-line-height-text);
  -webkit-text-decoration: var(--x-string-text-decoration);
          text-decoration: var(--x-string-text-decoration);
  color: var(--x-color-text-default);
  margin: 0;
}

.x-title1 {
  font-family: var(--x-font-family-title1);
  font-size: var(--x-size-font-title1);
  font-weight: var(--x-number-font-weight-title1);
  line-height: var(--x-size-line-height-title1);
  -webkit-text-decoration: var(--x-string-text-decoration-title1);
          text-decoration: var(--x-string-text-decoration-title1);
  color: var(--x-color-text-default);
  margin: 0;
}

.x-title2 {
  font-family: var(--x-font-family-title2);
  font-size: var(--x-size-font-title2);
  font-weight: var(--x-number-font-weight-title2);
  line-height: var(--x-size-line-height-title2);
  -webkit-text-decoration: var(--x-string-text-decoration-title2);
          text-decoration: var(--x-string-text-decoration-title2);
  color: var(--x-color-text-default);
  margin: 0;
}

.x-title3 {
  font-family: var(--x-font-family-title3);
  font-size: var(--x-size-font-title3);
  font-weight: var(--x-number-font-weight-title3);
  line-height: var(--x-size-line-height-title3);
  -webkit-text-decoration: var(--x-string-text-decoration-title3);
          text-decoration: var(--x-string-text-decoration-title3);
  color: var(--x-color-text-default);
  margin: 0;
}

.x-small {
  font-family: var(--x-font-family-small);
  font-size: var(--x-size-font-small);
  font-weight: var(--x-number-font-weight-small);
  line-height: var(--x-size-line-height-small);
  -webkit-text-decoration: var(--x-string-text-decoration-small);
          text-decoration: var(--x-string-text-decoration-small);
  color: var(--x-color-text-default);
  margin: 0;
}

.x-ellipsis {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.x-text--bold.x-text {
  --x-number-font-weight-text: var(--x-number-font-weight-base-bold);
}
.x-text--bold.x-title1 {
  --x-number-font-weight-title1: var(--x-number-font-weight-base-bold);
}
.x-text--bold.x-title2 {
  --x-number-font-weight-title2: var(--x-number-font-weight-base-bold);
}
.x-text--bold.x-title3 {
  --x-number-font-weight-title3: var(--x-number-font-weight-base-bold);
}
.x-text--bold.x-small {
  --x-number-font-weight-small: var(--x-number-font-weight-base-bold);
}
:root {
  --x-color-text-accent: var(--x-color-base-accent);
}
.x-text--accent {
  --x-color-text-default: var(--x-color-text-accent);
}
:root {
  --x-size-border-radius-tag-pill: var(--x-size-border-radius-base-pill);
  --x-size-border-radius-top-left-tag-pill: var(--x-size-border-radius-tag-pill);
  --x-size-border-radius-top-right-tag-pill: var(--x-size-border-radius-tag-pill);
  --x-size-border-radius-bottom-right-tag-pill: var(--x-size-border-radius-tag-pill);
  --x-size-border-radius-bottom-left-tag-pill: var(--x-size-border-radius-tag-pill);
}
:root {
  --x-size-border-radius-tag-pill: var(--x-size-border-radius-base-pill);
  --x-size-border-radius-top-left-tag-pill: var(--x-size-border-radius-tag-pill);
  --x-size-border-radius-top-right-tag-pill: var(--x-size-border-radius-tag-pill);
  --x-size-border-radius-bottom-right-tag-pill: var(--x-size-border-radius-tag-pill);
  --x-size-border-radius-bottom-left-tag-pill: var(--x-size-border-radius-tag-pill);
}

.x-tag--pill.x-tag,
.x-tag--pill .x-tag {
  --x-size-border-radius-tag-default: var(--x-size-border-radius-tag-pill);
  --x-size-border-radius-top-left-tag-default: var(--x-size-border-radius-top-left-tag-pill);
  --x-size-border-radius-top-right-tag-default: var(--x-size-border-radius-top-right-tag-pill);
  --x-size-border-radius-bottom-right-tag-default: var(
    --x-size-border-radius-bottom-right-tag-pill
  );
  --x-size-border-radius-bottom-left-tag-default: var(--x-size-border-radius-bottom-left-tag-pill);
}
:root {
  --x-color-background-tag-ghost: transparent;
  --x-color-border-tag-ghost: transparent;
  --x-color-background-tag-selected-ghost: transparent;
  --x-color-border-tag-selected-ghost: transparent;
  --x-color-background-tag-curated-ghost: transparent;
  --x-color-border-tag-curated-ghost: transparent;
  --x-color-background-tag-curated-selected-ghost: transparent;
  --x-color-border-tag-curated-selected-ghost: transparent;
  --x-number-font-weight-tag-selected-ghost: var(--x-number-font-weight-base-bold);
  --x-number-font-weight-tag-curated-selected-ghost: var(--x-number-font-weight-base-bold);
}
:root {
  --x-color-background-tag-ghost: transparent;
  --x-color-border-tag-ghost: transparent;
  --x-color-background-tag-selected-ghost: transparent;
  --x-color-border-tag-selected-ghost: transparent;
  --x-color-background-tag-curated-ghost: transparent;
  --x-color-border-tag-curated-ghost: transparent;
  --x-color-background-tag-curated-selected-ghost: transparent;
  --x-color-border-tag-curated-selected-ghost: transparent;
  --x-number-font-weight-tag-selected-ghost: var(--x-number-font-weight-base-bold);
  --x-number-font-weight-tag-curated-selected-ghost: var(--x-number-font-weight-base-bold);
}

.x-tag--ghost.x-tag,
.x-tag--ghost .x-tag {
  --x-color-background-tag-default: var(--x-color-background-tag-ghost);
  --x-color-border-tag-default: var(--x-color-border-tag-ghost);
  --x-color-background-tag-default-curated: var(--x-color-background-tag-curated-ghost);
  --x-color-border-tag-default-curated: var(--x-color-border-tag-curated-ghost);
  --x-color-background-tag-default-selected: var(--x-color-background-tag-selected-ghost);
  --x-color-border-tag-default-selected: var(--x-color-border-tag-selected-ghost);
  --x-color-background-tag-default-curated-selected: var(
    --x-color-background-tag-curated-selected-ghost
  );
  --x-color-border-tag-default-curated-selected: var(--x-color-border-tag-curated-selected-ghost);
  --x-number-font-weight-tag-default-selected: var(--x-number-font-weight-tag-selected-ghost);
  --x-number-font-weight-tag-default-curated-selected: var(
    --x-number-font-weight-tag-curated-selected-ghost
  );
}
:root {
  --x-color-background-tag-default: var(--x-color-base-neutral-100);
  --x-color-border-tag-default: var(--x-color-text-tag-default);
  --x-color-text-tag-default: var(--x-color-text-default);
  --x-color-background-tag-default-selected: var(--x-color-base-neutral-95);
  --x-color-border-tag-default-selected: var(--x-color-border-tag-default);
  --x-color-text-tag-default-selected: var(--x-color-text-tag-default);
  --x-color-background-tag-default-curated: var(--x-color-background-tag-default);
  --x-color-border-tag-default-curated: var(--x-color-border-tag-default);
  --x-color-text-tag-default-curated: var(--x-color-text-tag-default);
  --x-color-background-tag-default-curated-selected: var(--x-color-background-tag-default-selected);
  --x-color-border-tag-default-curated-selected: var(--x-color-border-tag-default-selected);
  --x-color-text-tag-default-curated-selected: var(--x-color-text-tag-default-selected);
  --x-size-border-width-tag-default: var(--x-size-border-width-base);
  --x-size-border-width-top-tag-default: var(--x-size-border-width-tag-default);
  --x-size-border-width-right-tag-default: var(--x-size-border-width-tag-default);
  --x-size-border-width-bottom-tag-default: var(--x-size-border-width-tag-default);
  --x-size-border-width-left-tag-default: var(--x-size-border-width-tag-default);
  --x-size-border-radius-tag-default: var(--x-size-border-radius-base-none);
  --x-size-border-radius-top-left-tag-default: var(--x-size-border-radius-tag-default);
  --x-size-border-radius-top-right-tag-default: var(--x-size-border-radius-tag-default);
  --x-size-border-radius-bottom-right-tag-default: var(--x-size-border-radius-tag-default);
  --x-size-border-radius-bottom-left-tag-default: var(--x-size-border-radius-tag-default);
  --x-size-height-tag-default: var(--x-size-base-07);
  --x-size-padding-right-tag-default: var(--x-size-base-04);
  --x-size-padding-left-tag-default: var(--x-size-base-04);
  --x-size-gap-tag-default: var(--x-size-base-02);
  --x-font-family-tag-default: var(--x-font-family-text);
  --x-size-font-tag-default: var(--x-size-font-text);
  --x-size-line-height-tag-default: var(--x-size-line-height-text);
  --x-number-font-weight-tag-default: var(--x-number-font-weight-text);
  --x-font-family-tag-default-selected: var(--x-font-family-tag-default);
  --x-size-font-tag-default-selected: var(--x-size-font-tag-default);
  --x-size-line-height-tag-default-selected: var(--x-size-line-height-tag-default);
  --x-number-font-weight-tag-default-selected: var(--x-number-font-weight-tag-default);
  --x-font-family-tag-default-curated: var(--x-font-family-tag-default);
  --x-size-font-tag-default-curated: var(--x-size-font-tag-default);
  --x-size-line-height-tag-default-curated: var(--x-size-line-height-tag-default);
  --x-number-font-weight-tag-default-curated: var(--x-number-font-weight-tag-default);
  --x-font-family-tag-default-curated-selected: var(--x-font-family-tag-default-selected);
  --x-size-font-tag-default-curated-selected: var(--x-size-font-tag-default-selected);
  --x-size-line-height-tag-default-curated-selected: var(--x-size-line-height-tag-default-selected);
  --x-number-font-weight-tag-default-curated-selected: var(
    --x-number-font-weight-tag-default-selected
  );
}
:root {
  --x-size-border-radius-tag-card: var(--x-size-border-radius-base-s);
  --x-size-border-radius-top-left-tag-card: var(--x-size-border-radius-tag-card);
  --x-size-border-radius-top-right-tag-card: var(--x-size-border-radius-tag-card);
  --x-size-border-radius-bottom-right-tag-card: var(--x-size-border-radius-tag-card);
  --x-size-border-radius-bottom-left-tag-card: var(--x-size-border-radius-tag-card);
}
:root {
  --x-color-background-tag-default: var(--x-color-base-neutral-100);
  --x-color-border-tag-default: var(--x-color-text-tag-default);
  --x-color-text-tag-default: var(--x-color-text-default);
  --x-color-background-tag-default-selected: var(--x-color-base-neutral-95);
  --x-color-border-tag-default-selected: var(--x-color-border-tag-default);
  --x-color-text-tag-default-selected: var(--x-color-text-tag-default);
  --x-color-background-tag-default-curated: var(--x-color-background-tag-default);
  --x-color-border-tag-default-curated: var(--x-color-border-tag-default);
  --x-color-text-tag-default-curated: var(--x-color-text-tag-default);
  --x-color-background-tag-default-curated-selected: var(--x-color-background-tag-default-selected);
  --x-color-border-tag-default-curated-selected: var(--x-color-border-tag-default-selected);
  --x-color-text-tag-default-curated-selected: var(--x-color-text-tag-default-selected);
  --x-size-border-width-tag-default: var(--x-size-border-width-base);
  --x-size-border-width-top-tag-default: var(--x-size-border-width-tag-default);
  --x-size-border-width-right-tag-default: var(--x-size-border-width-tag-default);
  --x-size-border-width-bottom-tag-default: var(--x-size-border-width-tag-default);
  --x-size-border-width-left-tag-default: var(--x-size-border-width-tag-default);
  --x-size-border-radius-tag-default: var(--x-size-border-radius-base-none);
  --x-size-border-radius-top-left-tag-default: var(--x-size-border-radius-tag-default);
  --x-size-border-radius-top-right-tag-default: var(--x-size-border-radius-tag-default);
  --x-size-border-radius-bottom-right-tag-default: var(--x-size-border-radius-tag-default);
  --x-size-border-radius-bottom-left-tag-default: var(--x-size-border-radius-tag-default);
  --x-size-height-tag-default: var(--x-size-base-07);
  --x-size-padding-right-tag-default: var(--x-size-base-04);
  --x-size-padding-left-tag-default: var(--x-size-base-04);
  --x-size-gap-tag-default: var(--x-size-base-02);
  --x-font-family-tag-default: var(--x-font-family-text);
  --x-size-font-tag-default: var(--x-size-font-text);
  --x-size-line-height-tag-default: var(--x-size-line-height-text);
  --x-number-font-weight-tag-default: var(--x-number-font-weight-text);
  --x-font-family-tag-default-selected: var(--x-font-family-tag-default);
  --x-size-font-tag-default-selected: var(--x-size-font-tag-default);
  --x-size-line-height-tag-default-selected: var(--x-size-line-height-tag-default);
  --x-number-font-weight-tag-default-selected: var(--x-number-font-weight-tag-default);
  --x-font-family-tag-default-curated: var(--x-font-family-tag-default);
  --x-size-font-tag-default-curated: var(--x-size-font-tag-default);
  --x-size-line-height-tag-default-curated: var(--x-size-line-height-tag-default);
  --x-number-font-weight-tag-default-curated: var(--x-number-font-weight-tag-default);
  --x-font-family-tag-default-curated-selected: var(--x-font-family-tag-default-selected);
  --x-size-font-tag-default-curated-selected: var(--x-size-font-tag-default-selected);
  --x-size-line-height-tag-default-curated-selected: var(--x-size-line-height-tag-default-selected);
  --x-number-font-weight-tag-default-curated-selected: var(
    --x-number-font-weight-tag-default-selected
  );
}

[dir="ltr"] .x-tag {
  border-left-width: var(--x-size-border-width-left-tag-default);
}

[dir="rtl"] .x-tag {
  border-right-width: var(--x-size-border-width-left-tag-default);
}

[dir="ltr"] .x-tag {
  border-right-width: var(--x-size-border-width-right-tag-default);
}

[dir="rtl"] .x-tag {
  border-left-width: var(--x-size-border-width-right-tag-default);
}

[dir="ltr"] .x-tag {
  padding-left: var(--x-size-padding-left-tag-default);
}

[dir="rtl"] .x-tag {
  padding-right: var(--x-size-padding-left-tag-default);
}

[dir="ltr"] .x-tag {
  padding-right: var(--x-size-padding-right-tag-default);
}

[dir="rtl"] .x-tag {
  padding-left: var(--x-size-padding-right-tag-default);
}

.x-tag {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  box-sizing: border-box;
  border-style: solid;
  border-top-width: var(--x-size-border-width-top-tag-default);
  border-bottom-width: var(--x-size-border-width-bottom-tag-default);
  border-radius: var(--x-size-border-radius-top-left-tag-default) var(--x-size-border-radius-top-right-tag-default) var(--x-size-border-radius-bottom-right-tag-default) var(--x-size-border-radius-bottom-left-tag-default);
  background-color: var(--x-color-background-tag-default);
  border-color: var(--x-color-border-tag-default);
  color: var(--x-color-text-tag-default);
  line-height: var(--x-size-line-height-tag-default);
  font-family: var(--x-font-family-tag-default);
  font-size: var(--x-size-font-tag-default);
  font-weight: var(--x-number-font-weight-tag-default);
  gap: var(--x-size-gap-tag-default);
  min-height: var(--x-size-height-tag-default);
  min-width: calc(3 * var(--x-size-line-height-tag-default));
  cursor: pointer;
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-tag {
    gap: 0;
  }
  .x-tag > *:not(:last-child) {
    margin-right: var(--x-size-gap-tag-default);
  }
}
.x-tag.x-suggestion {
  --x-color-background-suggestion-default: var(--x-color-background-tag-default);
  --x-color-text-suggestion-default: var(--x-color-text-tag-default);
  --x-color-border-suggestion-default: var(--x-color-border-tag-default);
  --x-size-padding-top-suggestion-default: 0;
  --x-size-padding-right-suggestion-default: var(--x-size-padding-right-tag-default);
  --x-size-padding-bottom-suggestion-default: 0;
  --x-size-padding-left-suggestion-default: var(--x-size-padding-left-tag-default);
  --x-size-gap-suggestion-default: var(--x-size-gap-tag-default);
  --x-size-border-width-suggestion-default: var(--x-size-border-width-tag-default);
  --x-size-border-width-top-suggestion-default: var(--x-size-border-width-tag-default);
  --x-size-border-width-right-suggestion-default: var(--x-size-border-width-tag-default);
  --x-size-border-width-bottom-suggestion-default: var(--x-size-border-width-tag-default);
  --x-size-border-width-left-suggestion-default: var(--x-size-border-width-tag-default);
  --x-size-border-radius-bottom-right-suggestion-default: var(
    --x-size-border-radius-bottom-right-tag-default
  );
  --x-size-border-radius-bottom-left-suggestion-default: var(
    --x-size-border-radius-bottom-left-tag-default
  );
  --x-size-border-radius-top-right-suggestion-default: var(
    --x-size-border-radius-top-right-tag-default
  );
  --x-size-border-radius-top-left-suggestion-default: var(
    --x-size-border-radius-top-left-tag-default
  );
  --x-font-family-suggestion-default: var(--x-font-family-tag-default);
  --x-size-font-suggestion-default: var(--x-size-font-tag-default);
  --x-size-line-height-suggestion-default: var(--x-size-line-height-tag-default);
  --x-number-font-weight-suggestion-default: var(--x-number-font-weight-tag-default);
}
.x-tag.x-suggestion-group {
  --x-color-background-suggestion-group-default: var(--x-color-background-tag-default);
  --x-color-text-suggestion-group-default: var(--x-color-text-tag-default);
  --x-color-border-suggestion-group-default: var(--x-color-border-tag-default);
  --x-size-padding-top-suggestion-group-default: 0;
  --x-size-padding-right-suggestion-group-default: var(--x-size-padding-right-tag-default);
  --x-size-padding-bottom-suggestion-group-default: 0;
  --x-size-padding-left-suggestion-group-default: var(--x-size-padding-left-tag-default);
  --x-size-gap-suggestion-group-default: var(--x-size-gap-tag-default);
  --x-size-border-width-suggestion-group-default: var(--x-size-border-width-tag-default);
  --x-size-border-width-top-suggestion-group-default: var(--x-size-border-width-tag-default);
  --x-size-border-width-right-suggestion-group-default: var(--x-size-border-width-tag-default);
  --x-size-border-width-bottom-suggestion-group-default: var(--x-size-border-width-tag-default);
  --x-size-border-width-left-suggestion-group-default: var(--x-size-border-width-tag-default);
  --x-size-border-radius-bottom-right-suggestion-group-default: var(
    --x-size-border-radius-bottom-right-tag-default
  );
  --x-size-border-radius-bottom-left-suggestion-group-default: var(
    --x-size-border-radius-bottom-left-tag-default
  );
  --x-size-border-radius-top-right-suggestion-group-default: var(
    --x-size-border-radius-top-right-tag-default
  );
  --x-size-border-radius-top-left-suggestion-group-default: var(
    --x-size-border-radius-top-left-tag-default
  );
  --x-font-family-suggestion-group-default: var(--x-font-family-tag-default);
  --x-size-font-suggestion-group-default: var(--x-size-font-tag-default);
  --x-size-line-height-suggestion-group-default: var(--x-size-line-height-tag-default);
  --x-number-font-weight-suggestion-group-default: var(--x-number-font-weight-tag-default);
}
.x-tag.x-filter {
  --x-color-background-filter-default: transparent;
  --x-size-border-width-filter-default: 0;
  --x-color-text-filter-default: var(--x-color-text-tag-default);
  --x-size-padding-top-filter-default: 0;
  --x-size-padding-right-filter-default: var(--x-size-padding-right-tag-default);
  --x-size-padding-bottom-filter-default: 0;
  --x-size-padding-left-filter-default: var(--x-size-padding-left-tag-default);
  --x-size-gap-filter-default: var(--x-size-gap-tag-default);
  --x-font-family-filter-default: var(--x-font-family-tag-default);
  --x-size-font-filter-default: var(--x-size-font-tag-default);
  --x-number-font-weight-filter-count-default: var(--x-number-font-weight-tag-default);
  --x-size-line-height-filter-default: var(--x-size-line-height-tag-default);
}
.x-tag.x-tag.x-tag--is-curated {
  background-color: var(--x-color-background-tag-default-curated);
  border-color: var(--x-color-border-tag-default-curated);
  color: var(--x-color-text-tag-default-curated);
  line-height: var(--x-size-line-height-tag-default-curated);
  font-family: var(--x-font-family-tag-default-curated);
  font-size: var(--x-size-font-tag-default-curated);
  font-weight: var(--x-number-font-weight-tag-default-curated);
}
.x-tag.x-tag.x-tag--is-selected {
  background-color: var(--x-color-background-tag-default-selected);
  border-color: var(--x-color-border-tag-default-selected);
  color: var(--x-color-text-tag-default-selected);
  line-height: var(--x-size-line-height-tag-default-selected);
  font-family: var(--x-font-family-tag-default-selected);
  font-size: var(--x-size-font-tag-default-selected);
  font-weight: var(--x-number-font-weight-tag-default-selected);
}
.x-tag.x-tag.x-tag--is-selected.x-tag--is-curated {
  background-color: var(--x-color-background-tag-default-curated-selected);
  border-color: var(--x-color-border-tag-default-curated-selected);
  color: var(--x-color-text-tag-default-curated-selected);
  line-height: var(--x-size-line-height-tag-default-curated-selected);
  font-family: var(--x-font-family-tag-default-curated-selected);
  font-size: var(--x-size-font-tag-default-curated-selected);
  font-weight: var(--x-number-font-weight-tag-default-curated-selected);
}
.x-tag.x-tag.x-tag--is-selected.x-filter {
  --x-color-text-filter-default-selected: var(--x-color-text-tag-default-selected);
  --x-font-family-filter-default-selected: var(--x-font-family-tag-default-selected);
  --x-size-font-filter-default-selected: var(--x-size-font-tag-default-selected);
  --x-number-font-weight-filter-count-default-selected: var(
    --x-number-font-weight-tag-default-selected
  );
  --x-size-line-height-filter-default-selected: var(--x-size-line-height-tag-default-selected);
}
:root {
  --x-size-border-radius-tag-card: var(--x-size-border-radius-base-s);
  --x-size-border-radius-top-left-tag-card: var(--x-size-border-radius-tag-card);
  --x-size-border-radius-top-right-tag-card: var(--x-size-border-radius-tag-card);
  --x-size-border-radius-bottom-right-tag-card: var(--x-size-border-radius-tag-card);
  --x-size-border-radius-bottom-left-tag-card: var(--x-size-border-radius-tag-card);
}

.x-tag--card.x-tag,
.x-tag--card .x-tag {
  --x-size-border-radius-tag-default: var(--x-size-border-radius-tag-card);
  --x-size-border-radius-top-left-tag-default: var(--x-size-border-radius-top-left-tag-card);
  --x-size-border-radius-top-right-tag-default: var(--x-size-border-radius-top-right-tag-card);
  --x-size-border-radius-bottom-right-tag-default: var(
    --x-size-border-radius-bottom-right-tag-card
  );
  --x-size-border-radius-bottom-left-tag-default: var(--x-size-border-radius-bottom-left-tag-card);
}
:root {
  --x-color-text-suggestion-group-default: var(--x-color-text-suggestion-default);
  --x-color-text-suggestion-group-matching-part-default: var(
    --x-color-text-suggestion-matching-part-default
  );
  --x-color-background-suggestion-group-default: var(--x-color-background-suggestion-default);
  --x-color-border-suggestion-group-default: var(--x-color-text-suggestion-group-default);
  --x-size-padding-top-suggestion-group-default: var(--x-size-padding-top-suggestion-default);
  --x-size-padding-right-suggestion-group-default: var(--x-size-padding-right-suggestion-default);
  --x-size-padding-bottom-suggestion-group-default: var(--x-size-padding-bottom-suggestion-default);
  --x-size-padding-left-suggestion-group-default: var(--x-size-padding-left-suggestion-default);
  --x-size-gap-suggestion-group-default: var(--x-size-gap-suggestion-default);
  --x-size-border-width-suggestion-group-default: 0;
  --x-size-border-width-top-suggestion-group-default: var(--x-size-border-width-suggestion-default);
  --x-size-border-width-right-suggestion-group-default: var(
    --x-size-border-width-suggestion-default
  );
  --x-size-border-width-bottom-suggestion-group-default: var(
    --x-size-border-width-suggestion-default
  );
  --x-size-border-width-left-suggestion-group-default: var(
    --x-size-border-width-suggestion-default
  );
  --x-size-border-radius-suggestion-group-default: var(--x-size-border-radius-base-none);
  --x-size-border-radius-top-left-suggestion-group-default: var(
    --x-size-border-radius-suggestion-default
  );
  --x-size-border-radius-top-right-suggestion-group-default: var(
    --x-size-border-radius-suggestion-default
  );
  --x-size-border-radius-bottom-right-suggestion-group-default: var(
    --x-size-border-radius-suggestion-default
  );
  --x-size-border-radius-bottom-left-suggestion-group-default: var(
    --x-size-border-radius-suggestion-default
  );
  --x-font-family-suggestion-group-default: var(--x-font-family-suggestion-default);
  --x-size-font-suggestion-group-default: var(--x-size-font-suggestion-default);
  --x-size-line-height-suggestion-group-default: var(--x-size-line-height-suggestion-default);
  --x-number-font-weight-suggestion-group-default: var(--x-number-font-weight-suggestion-default);
}
:root {
  --x-string-align-items-suggestion-default: center;
  --x-color-text-suggestion-default: var(--x-color-text-default);
  --x-color-text-suggestion-matching-part-default: var(--x-color-base-neutral-35);
  --x-color-text-suggestion-default-matching: var(--x-color-text-suggestion-default);
  --x-color-text-suggestion-filter-default: var(--x-color-base-neutral-35);
  --x-color-background-suggestion-default: transparent;
  --x-color-border-suggestion-default: var(--x-color-text-suggestion-default);
  --x-color-text-suggestion-default-curated: var(--x-color-text-suggestion-default);
  --x-color-text-suggestion-matching-part-default-curated: var(
    --x-color-text-suggestion-matching-part-default
  );
  --x-color-text-suggestion-default-matching-curated: var(
    --x-color-text-suggestion-default-matching
  );
  --x-color-background-suggestion-default-curated: var(--x-color-background-suggestion-default);
  --x-color-border-suggestion-default-curated: var(--x-color-border-suggestion-default);
  --x-size-padding-top-suggestion-default: var(--x-size-base-01);
  --x-size-padding-right-suggestion-default: 0;
  --x-size-padding-bottom-suggestion-default: var(--x-size-base-02);
  --x-size-padding-left-suggestion-default: 0;
  --x-size-gap-suggestion-default: var(--x-size-base-03);
  --x-size-border-width-suggestion-default: 0;
  --x-size-border-width-top-suggestion-default: var(--x-size-border-width-suggestion-default);
  --x-size-border-width-right-suggestion-default: var(--x-size-border-width-suggestion-default);
  --x-size-border-width-bottom-suggestion-default: var(--x-size-border-width-suggestion-default);
  --x-size-border-width-left-suggestion-default: var(--x-size-border-width-suggestion-default);
  --x-size-border-radius-suggestion-default: var(--x-size-border-radius-base-none);
  --x-size-border-radius-top-left-suggestion-default: var(
    --x-size-border-radius-suggestion-default
  );
  --x-size-border-radius-top-right-suggestion-default: var(
    --x-size-border-radius-suggestion-default
  );
  --x-size-border-radius-bottom-right-suggestion-default: var(
    --x-size-border-radius-suggestion-default
  );
  --x-size-border-radius-bottom-left-suggestion-default: var(
    --x-size-border-radius-suggestion-default
  );
  --x-font-family-suggestion-default: var(--x-font-family-text);
  --x-size-font-suggestion-default: var(--x-size-font-text);
  --x-size-line-height-suggestion-default: var(--x-size-line-height-text);
  --x-number-font-weight-suggestion-default: var(--x-number-font-weight-text);
  --x-font-family-suggestion-matching-part-default: var(--x-font-family-suggestion-default);
  --x-size-font-suggestion-matching-part-default: var(--x-size-font-suggestion-default);
  --x-size-line-height-suggestion-matching-part-default: var(
    --x-size-line-height-suggestion-default
  );
  --x-number-font-weight-suggestion-matching-part-default: var(
    --x-number-font-weight-suggestion-default
  );
  --x-font-family-suggestion-default-matching: var(--x-font-family-suggestion-default);
  --x-size-font-suggestion-default-matching: var(--x-size-font-suggestion-default);
  --x-size-line-height-suggestion-default-matching: var(--x-size-line-height-suggestion-default);
  --x-number-font-weight-suggestion-default-matching: var(
    --x-number-font-weight-suggestion-default
  );
  --x-font-family-suggestion-filter-default: var(--x-font-family-suggestion-default);
  --x-size-font-suggestion-filter-default: var(--x-size-font-suggestion-default);
  --x-size-line-height-suggestion-filter-default: var(--x-size-line-height-suggestion-default);
  --x-number-font-weight-suggestion-filter-default: var(--x-number-font-weight-suggestion-default);
  --x-text-transform-suggestion-filter-default: none;
  --x-font-family-suggestion-default-curated: var(--x-font-family-suggestion-default);
  --x-size-font-suggestion-default-curated: var(--x-size-font-suggestion-default);
  --x-size-line-height-suggestion-default-curated: var(--x-size-line-height-suggestion-default);
  --x-number-font-weight-suggestion-default-curated: var(--x-number-font-weight-suggestion-default);
  --x-font-family-suggestion-matching-part-default-curated: var(
    --x-font-family-suggestion-matching-part-default
  );
  --x-size-font-suggestion-matching-part-default-curated: var(
    --x-size-font-suggestion-matching-part-default
  );
  --x-size-line-height-suggestion-matching-part-default-curated: var(
    --x-size-line-height-suggestion-matching-part-default
  );
  --x-number-font-weight-suggestion-matching-part-default-curated: var(
    --x-number-font-weight-suggestion-matching-part-default
  );
  --x-font-family-suggestion-default-matching-curated: var(
    --x-font-family-suggestion-default-matching
  );
  --x-size-font-suggestion-default-matching-curated: var(--x-size-font-suggestion-default-matching);
  --x-size-line-height-suggestion-default-matching-curated: var(
    --x-size-line-height-suggestion-default-matching
  );
  --x-number-font-weight-suggestion-default-matching-curated: var(
    --x-number-font-weight-suggestion-default-matching
  );
}

[dir="ltr"] .x-suggestion {
  text-align: left;
}

[dir="rtl"] .x-suggestion {
  text-align: right;
}

[dir="ltr"] .x-suggestion {
  padding-left: var(--x-size-padding-left-suggestion-default);
}

[dir="rtl"] .x-suggestion {
  padding-right: var(--x-size-padding-left-suggestion-default);
}

[dir="ltr"] .x-suggestion {
  padding-right: var(--x-size-padding-right-suggestion-default);
}

[dir="rtl"] .x-suggestion {
  padding-left: var(--x-size-padding-right-suggestion-default);
}

[dir="ltr"] .x-suggestion {
  border-left-width: var(--x-size-border-width-left-suggestion-default);
}

[dir="rtl"] .x-suggestion {
  border-right-width: var(--x-size-border-width-left-suggestion-default);
}

[dir="ltr"] .x-suggestion {
  border-right-width: var(--x-size-border-width-right-suggestion-default);
}

[dir="rtl"] .x-suggestion {
  border-left-width: var(--x-size-border-width-right-suggestion-default);
}

.x-suggestion {
  display: flex;
  flex-flow: row nowrap;
  box-sizing: border-box;
  align-items: var(--x-string-align-items-suggestion-default);
  background-color: var(--x-color-background-suggestion-default);
  color: var(--x-color-text-suggestion-default);
  border-color: var(--x-color-border-suggestion-default);
  font-family: var(--x-font-family-suggestion-default);
  font-size: var(--x-size-font-suggestion-default);
  line-height: var(--x-size-line-height-suggestion-default);
  font-weight: var(--x-number-font-weight-suggestion-default);
  cursor: pointer;
  padding-top: var(--x-size-padding-top-suggestion-default);
  padding-bottom: var(--x-size-padding-bottom-suggestion-default);
  gap: var(--x-size-gap-suggestion-default);
  border-style: solid;
  border-top-width: var(--x-size-border-width-top-suggestion-default);
  border-bottom-width: var(--x-size-border-width-bottom-suggestion-default);
  border-radius: var(--x-size-border-radius-top-left-suggestion-default) var(--x-size-border-radius-top-right-suggestion-default) var(--x-size-border-radius-bottom-right-suggestion-default) var(--x-size-border-radius-bottom-left-suggestion-default);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-suggestion {
    gap: 0;
  }
  .x-suggestion > *:not(:last-child) {
    margin-right: var(--x-size-gap-suggestion-default);
  }
}
.x-suggestion__matching-part,
.x-suggestion .x-identifier-result__matching-part {
  font-family: var(--x-font-family-suggestion-matching-part-default);
  font-size: var(--x-size-font-suggestion-matching-part-default);
  line-height: var(--x-size-line-height-suggestion-matching-part-default);
  font-weight: var(--x-number-font-weight-suggestion-matching-part-default);
  color: var(--x-color-text-suggestion-matching-part-default);
}
.x-suggestion__filter {
  font-family: var(--x-font-family-suggestion-filter-default);
  font-size: var(--x-size-font-suggestion-filter-default);
  line-height: var(--x-size-line-height-suggestion-filter-default);
  font-weight: var(--x-number-font-weight-suggestion-filter-default);
  text-transform: var(--x-text-transform-suggestion-filter-default);
  color: var(--x-color-text-suggestion-filter-default);
}
.x-suggestion--matching {
  --x-font-family-suggestion-default: var(--x-font-family-suggestion-default-matching);
  --x-size-font-suggestion-default: var(--x-size-font-suggestion-default-matching);
  --x-size-line-height-suggestion-default: var(--x-size-line-height-suggestion-default-matching);
  --x-number-font-weight-suggestion-default: var(
    --x-number-font-weight-suggestion-default-matching
  );
  --x-color-text-suggestion-default: var(--x-color-text-suggestion-default-matching);
}
.x-suggestion > .x-identifier-result {
  flex: none;
}
.x-suggestion.x-suggestion.x-suggestion--is-curated {
  background-color: var(--x-color-background-suggestion-default-curated);
  color: var(--x-color-text-suggestion-default-curated);
  border-color: var(--x-color-border-suggestion-default-curated);
  font-family: var(--x-font-family-suggestion-default-curated);
  font-size: var(--x-size-font-suggestion-default-curated);
  line-height: var(--x-size-line-height-suggestion-default-curated);
  font-weight: var(--x-number-font-weight-suggestion-default-curated);
}
.x-suggestion.x-suggestion.x-suggestion--is-curated .x-suggestion__matching-part,
.x-suggestion.x-suggestion.x-suggestion--is-curated .x-identifier-result__matching-part {
  font-family: var(--x-font-family-suggestion-matching-part-default-curated);
  font-size: var(--x-size-font-suggestion-matching-part-default-curated);
  line-height: var(--x-size-line-height-suggestion-matching-part-default-curated);
  font-weight: var(--x-number-font-weight-suggestion-matching-part-default-curated);
  color: var(--x-color-text-suggestion-matching-part-default-curated);
}
.x-suggestion.x-suggestion.x-suggestion--is-curated.x-suggestion--matching {
  --x-font-family-suggestion-default-curated: var(
    --x-font-family-suggestion-default-matching-curated
  );
  --x-size-font-suggestion-default-curated: var(
    --x-size-font-suggestion-default-matching-curated
  );
  --x-size-line-height-suggestion-default-curated: var(
    --x-size-line-height-suggestion-default-matching-curated
  );
  --x-number-font-weight-suggestion-default-curated: var(
    --x-number-font-weight-suggestion-default-matching-curated
  );
  --x-color-text-suggestion-default-curated: var(
    --x-color-text-suggestion-default-matching-curated
  );
}
:root {
  --x-color-background-sliding-panel: var(--x-color-base-neutral-100);
  --x-size-width-sliding-panel-gradient: var(--x-size-base-09);
  --x-size-padding-sliding-panel-button: var(--x-size-base-03);
  --x-size-horizontal-margin-sliding-panel-button-overflow: var(--x-size-base-02);
}
.x-sliding-panel {
  z-index: 0;
  background-color: var(--x-color-background-sliding-panel);
}
.x-sliding-panel__button.x-button {
  --x-size-padding-button: var(--x-size-padding-sliding-panel-button);
  pointer-events: none;
}
.x-sliding-panel.x-sliding-panel--buttons-overflow .x-sliding-panel__button {
  pointer-events: all;
}
.x-sliding-panel.x-sliding-panel--buttons-overflow .x-sliding-panel-button-left {
  transform: translateX(calc(-100% - var(--x-size-horizontal-margin-sliding-panel-button-overflow)));
}
.x-sliding-panel.x-sliding-panel--buttons-overflow .x-sliding-panel-button-right {
  transform: translateX(calc(100% + var(--x-size-horizontal-margin-sliding-panel-button-overflow)));
}
.x-sliding-panel.x-sliding-panel--show-buttons-on-hover .x-sliding-panel__button {
  opacity: 0;
}
.x-sliding-panel.x-sliding-panel--show-buttons-on-hover:not(.x-sliding-panel-at-start):hover .x-sliding-panel-button-left {
  opacity: 1;
  pointer-events: all;
}
.x-sliding-panel.x-sliding-panel--show-buttons-on-hover:not(.x-sliding-panel-at-end):hover .x-sliding-panel-button-right {
  opacity: 1;
  pointer-events: all;
}
.x-sliding-panel:not(.x-sliding-panel--no-gradient) .x-sliding-panel__scroll {
  mask: linear-gradient(to right, transparent calc(0.43 * var(--x-size-width-sliding-panel-gradient)), rgba(0, 0, 0, 0.8) calc(0.67 * var(--x-size-width-sliding-panel-gradient)), black var(--x-size-width-sliding-panel-gradient), rgba(0, 0, 0, 0.8) calc(100% - 0.67 * var(--x-size-width-sliding-panel-gradient)), transparent calc(100% - 0.43 * var(--x-size-width-sliding-panel-gradient)));
}
.x-sliding-panel:not(.x-sliding-panel--no-gradient).x-sliding-panel-at-start .x-sliding-panel__scroll {
  mask: linear-gradient(to left, transparent calc(0.43 * var(--x-size-width-sliding-panel-gradient)), rgba(0, 0, 0, 0.8) calc(0.67 * var(--x-size-width-sliding-panel-gradient)), black var(--x-size-width-sliding-panel-gradient));
}
.x-sliding-panel:not(.x-sliding-panel--no-gradient).x-sliding-panel-at-end .x-sliding-panel__scroll {
  mask: linear-gradient(to right, transparent calc(0.43 * var(--x-size-width-sliding-panel-gradient)), rgba(0, 0, 0, 0.8) calc(0.67 * var(--x-size-width-sliding-panel-gradient)), black var(--x-size-width-sliding-panel-gradient));
}
.x-sliding-panel:not(.x-sliding-panel--no-gradient).x-sliding-panel-at-start.x-sliding-panel-at-end .x-sliding-panel__scroll {
  mask: none;
}
.x-sliding-panel__scroll > * {
  flex: 0 0 auto;
}
.x-sliding-panel__scroll > .x-list {
  --x-string-flow-list: row nowrap;
}
.x-sliding-panel:not(.x-sliding-panel--show-buttons-on-hover):not(.x-sliding-panel-at-start) .x-sliding-panel-button-left {
  opacity: 1;
  pointer-events: all;
}
.x-sliding-panel:not(.x-sliding-panel--show-buttons-on-hover):not(.x-sliding-panel-at-end) .x-sliding-panel-button-right {
  opacity: 1;
  pointer-events: all;
}
:root {
  --x-string-overflow-scroll: auto;
  --x-color-background-scroll-bar: transparent;
  --x-color-thumb-scroll-bar: var(--x-color-base-neutral-95);
  --x-color-background-scroll-bar-hover: transparent;
  --x-color-thumb-scroll-bar-hover: var(--x-color-base-neutral-70);
}
:root {
  --x-string-overflow-scroll: auto;
  --x-color-background-scroll-bar: transparent;
  --x-color-thumb-scroll-bar: var(--x-color-base-neutral-95);
  --x-color-background-scroll-bar-hover: transparent;
  --x-color-thumb-scroll-bar-hover: var(--x-color-base-neutral-70);
}

.x-scroll {
  overflow-y: var(--x-string-overflow-scroll);
}
@media (hover: hover) {
  .x-scroll {
    scrollbar-width: auto;
    scrollbar-color: var(--x-color-thumb-scroll-bar) var(--x-color-background-scroll-bar);
  }
  .x-scroll::-webkit-scrollbar {
    width: 17px;
  }
  .x-scroll::-webkit-scrollbar-track {
    background: var(--x-color-background-scroll-bar);
  }
  .x-scroll::-webkit-scrollbar-thumb {
    width: 5px;
    border-radius: 15px;
    background: var(--x-color-thumb-scroll-bar);
    background-clip: content-box;
    border: solid 4px rgba(0, 0, 0, 0.00001);
  }
  .x-scroll:hover {
    --x-color-background-scroll-bar: var(--x-color-background-scroll-bar-hover);
    --x-color-thumb-scroll-bar: var(--x-color-thumb-scroll-bar-hover);
  }
}

.x-base-scroll {
  overflow-y: var(--x-string-overflow-scroll, auto);
}
/* @deprecated */
:root {
  --x-size-padding-row-02: var(--x-size-base-02);
  --x-size-padding-row-03: var(--x-size-base-03);
  --x-size-padding-row-04: var(--x-size-base-04);
  --x-size-padding-row-05: var(--x-size-base-05);
  --x-size-padding-row-06: var(--x-size-base-06);
}
:root {
  --x-color-text-suggestion-group-default: var(--x-color-text-suggestion-default);
  --x-color-text-suggestion-group-matching-part-default: var(
    --x-color-text-suggestion-matching-part-default
  );
  --x-color-background-suggestion-group-default: var(--x-color-background-suggestion-default);
  --x-color-border-suggestion-group-default: var(--x-color-text-suggestion-group-default);
  --x-size-padding-top-suggestion-group-default: var(--x-size-padding-top-suggestion-default);
  --x-size-padding-right-suggestion-group-default: var(--x-size-padding-right-suggestion-default);
  --x-size-padding-bottom-suggestion-group-default: var(--x-size-padding-bottom-suggestion-default);
  --x-size-padding-left-suggestion-group-default: var(--x-size-padding-left-suggestion-default);
  --x-size-gap-suggestion-group-default: var(--x-size-gap-suggestion-default);
  --x-size-border-width-suggestion-group-default: 0;
  --x-size-border-width-top-suggestion-group-default: var(--x-size-border-width-suggestion-default);
  --x-size-border-width-right-suggestion-group-default: var(
    --x-size-border-width-suggestion-default
  );
  --x-size-border-width-bottom-suggestion-group-default: var(
    --x-size-border-width-suggestion-default
  );
  --x-size-border-width-left-suggestion-group-default: var(
    --x-size-border-width-suggestion-default
  );
  --x-size-border-radius-suggestion-group-default: var(--x-size-border-radius-base-none);
  --x-size-border-radius-top-left-suggestion-group-default: var(
    --x-size-border-radius-suggestion-default
  );
  --x-size-border-radius-top-right-suggestion-group-default: var(
    --x-size-border-radius-suggestion-default
  );
  --x-size-border-radius-bottom-right-suggestion-group-default: var(
    --x-size-border-radius-suggestion-default
  );
  --x-size-border-radius-bottom-left-suggestion-group-default: var(
    --x-size-border-radius-suggestion-default
  );
  --x-font-family-suggestion-group-default: var(--x-font-family-suggestion-default);
  --x-size-font-suggestion-group-default: var(--x-size-font-suggestion-default);
  --x-size-line-height-suggestion-group-default: var(--x-size-line-height-suggestion-default);
  --x-number-font-weight-suggestion-group-default: var(--x-number-font-weight-suggestion-default);
}

[dir="ltr"] .x-suggestion-group {
  padding-left: var(--x-size-padding-left-suggestion-group-default);
}

[dir="rtl"] .x-suggestion-group {
  padding-right: var(--x-size-padding-left-suggestion-group-default);
}

[dir="ltr"] .x-suggestion-group {
  padding-right: var(--x-size-padding-right-suggestion-group-default);
}

[dir="rtl"] .x-suggestion-group {
  padding-left: var(--x-size-padding-right-suggestion-group-default);
}

[dir="ltr"] .x-suggestion-group {
  border-left-width: var(--x-size-border-width-left-suggestion-group-default);
}

[dir="rtl"] .x-suggestion-group {
  border-right-width: var(--x-size-border-width-left-suggestion-group-default);
}

[dir="ltr"] .x-suggestion-group {
  border-right-width: var(--x-size-border-width-right-suggestion-group-default);
}

[dir="rtl"] .x-suggestion-group {
  border-left-width: var(--x-size-border-width-right-suggestion-group-default);
}

.x-suggestion-group {
  display: flex;
  flex-flow: row nowrap;
  box-sizing: border-box;
  background-color: var(--x-color-background-suggestion-group-default);
  color: var(--x-color-text-suggestion-group-default);
  border-color: var(--x-color-border-suggestion-group-default);
  font-family: var(--x-font-family-suggestion-group-default);
  font-size: var(--x-size-font-suggestion-group-default);
  line-height: var(--x-size-line-height-suggestion-group-default);
  font-weight: var(--x-number-font-weight-suggestion-group-default);
  cursor: pointer;
  padding-top: var(--x-size-padding-top-suggestion-group-default);
  padding-bottom: var(--x-size-padding-bottom-suggestion-group-default);
  gap: var(--x-size-gap-suggestion-group-default);
  border-style: solid;
  border-top-width: var(--x-size-border-width-top-suggestion-group-default);
  border-bottom-width: var(--x-size-border-width-bottom-suggestion-group-default);
  border-radius: var(--x-size-border-radius-top-left-suggestion-group-default) var(--x-size-border-radius-top-right-suggestion-group-default) var(--x-size-border-radius-bottom-right-suggestion-group-default) var(--x-size-border-radius-bottom-left-suggestion-group-default);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-suggestion-group {
    gap: 0;
  }
  .x-suggestion-group > *:not(:last-child) {
    margin-right: var(--x-size-gap-suggestion-group-default);
  }
}
.x-suggestion-group .x-suggestion {
  padding: 0;
  flex: 1 1 auto;
  border: none;
}
.x-suggestion-group .x-button {
  --x-color-background-button-default: transparent;
  --x-color-border-button-default: transparent;
  --x-color-text-button-default: var(--x-color-text-suggestion-group-default);
  --x-size-height-button-default: var(--x-size-line-height-suggestion-group-default);
  --x-size-padding-right-button-default: 0;
  --x-size-padding-left-button-default: 0;
  border: none;
}
/* @deprecated */
:root {
  --x-size-padding-row-02: var(--x-size-base-02);
  --x-size-padding-row-03: var(--x-size-base-03);
  --x-size-padding-row-04: var(--x-size-base-04);
  --x-size-padding-row-05: var(--x-size-base-05);
  --x-size-padding-row-06: var(--x-size-base-06);
}

/* @deprecated */
.x-row--padding-02 {
  --x-size-padding-row: var(--x-size-padding-row-02);
}

.x-row--padding-03 {
  --x-size-padding-row: var(--x-size-padding-row-03);
}

.x-row--padding-04 {
  --x-size-padding-row: var(--x-size-padding-row-04);
}

.x-row--padding-05 {
  --x-size-padding-row: var(--x-size-padding-row-05);
}

.x-row--padding-06 {
  --x-size-padding-row: var(--x-size-padding-row-06);
}
:root {
  --x-size-gap-row-01: var(--x-size-base-01);
  --x-size-gap-row-02: var(--x-size-base-02);
  --x-size-gap-row-03: var(--x-size-base-03);
  --x-size-gap-row-04: var(--x-size-base-04);
  --x-size-gap-row-05: var(--x-size-base-05);
  --x-size-gap-row-06: var(--x-size-base-06);
  --x-size-gap-row-07: var(--x-size-base-07);
  --x-size-gap-row-08: var(--x-size-base-08);
  --x-size-gap-row-09: var(--x-size-base-09);
  --x-size-gap-row-10: var(--x-size-base-10);
  --x-size-gap-row-11: var(--x-size-base-11);
  --x-size-gap-row-12: var(--x-size-base-12);
  --x-size-gap-row-13: var(--x-size-base-13);
  --x-size-gap-row-14: var(--x-size-base-14);
  --x-size-gap-row-15: var(--x-size-base-15);
  --x-size-gap-row-16: var(--x-size-base-16);
  --x-size-gap-row-17: var(--x-size-base-17);
  --x-size-gap-row-18: var(--x-size-base-18);
  --x-size-gap-row-19: var(--x-size-base-19);
  --x-size-gap-row-20: var(--x-size-base-20);
}

.x-row--gap-01 {
  --x-size-gap-row: var(--x-size-gap-row-01);
}

.x-row--gap-02 {
  --x-size-gap-row: var(--x-size-gap-row-02);
}

.x-row--gap-03 {
  --x-size-gap-row: var(--x-size-gap-row-03);
}

.x-row--gap-04 {
  --x-size-gap-row: var(--x-size-gap-row-04);
}

.x-row--gap-05 {
  --x-size-gap-row: var(--x-size-gap-row-05);
}

.x-row--gap-06 {
  --x-size-gap-row: var(--x-size-gap-row-06);
}

.x-row--gap-07 {
  --x-size-gap-row: var(--x-size-gap-row-07);
}

.x-row--gap-08 {
  --x-size-gap-row: var(--x-size-gap-row-08);
}

.x-row--gap-09 {
  --x-size-gap-row: var(--x-size-gap-row-09);
}

.x-row--gap-10 {
  --x-size-gap-row: var(--x-size-gap-row-10);
}

.x-row--gap-11 {
  --x-size-gap-row: var(--x-size-gap-row-11);
}

.x-row--gap-12 {
  --x-size-gap-row: var(--x-size-gap-row-12);
}

.x-row--gap-13 {
  --x-size-gap-row: var(--x-size-gap-row-13);
}

.x-row--gap-14 {
  --x-size-gap-row: var(--x-size-gap-row-14);
}

.x-row--gap-15 {
  --x-size-gap-row: var(--x-size-gap-row-15);
}

.x-row--gap-16 {
  --x-size-gap-row: var(--x-size-gap-row-16);
}

.x-row--gap-17 {
  --x-size-gap-row: var(--x-size-gap-row-17);
}

.x-row--gap-18 {
  --x-size-gap-row: var(--x-size-gap-row-18);
}

.x-row--gap-19 {
  --x-size-gap-row: var(--x-size-gap-row-19);
}

.x-row--gap-20 {
  --x-size-gap-row: var(--x-size-gap-row-20);
}
:root {
  --x-size-gap-row-01: var(--x-size-base-01);
  --x-size-gap-row-02: var(--x-size-base-02);
  --x-size-gap-row-03: var(--x-size-base-03);
  --x-size-gap-row-04: var(--x-size-base-04);
  --x-size-gap-row-05: var(--x-size-base-05);
  --x-size-gap-row-06: var(--x-size-base-06);
  --x-size-gap-row-07: var(--x-size-base-07);
  --x-size-gap-row-08: var(--x-size-base-08);
  --x-size-gap-row-09: var(--x-size-base-09);
  --x-size-gap-row-10: var(--x-size-base-10);
  --x-size-gap-row-11: var(--x-size-base-11);
  --x-size-gap-row-12: var(--x-size-base-12);
  --x-size-gap-row-13: var(--x-size-base-13);
  --x-size-gap-row-14: var(--x-size-base-14);
  --x-size-gap-row-15: var(--x-size-base-15);
  --x-size-gap-row-16: var(--x-size-base-16);
  --x-size-gap-row-17: var(--x-size-base-17);
  --x-size-gap-row-18: var(--x-size-base-18);
  --x-size-gap-row-19: var(--x-size-base-19);
  --x-size-gap-row-20: var(--x-size-base-20);
}
:root {
  --x-size-gap-row: 0;
  --x-size-padding-row: 0;
  --x-size-justify-row: stretch;
  --x-size-align-row: center;
  --x-size-span-row-item: 1;
  --x-size-start-row-item: 0;
}
:root {
  --x-size-gap-row: 0;
  --x-size-padding-row: 0;
  --x-size-justify-row: stretch;
  --x-size-align-row: center;
  --x-size-span-row-item: 1;
  --x-size-start-row-item: 0;
}

.x-row {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-template-rows: 1fr;
  justify-items: var(--x-size-justify-row);
  align-items: var(--x-size-align-row);
  padding: var(--x-size-padding-row);
  gap: var(--x-size-gap-row);
  margin: 0;
}
.x-row__item {
  grid-column-start: var(--x-size-start-row-item);
  grid-column-end: span var(--x-size-span-row-item);
  list-style: none;
}
.x-row__item--span-1 {
  --x-size-span-row-item: 1;
}
.x-row__item--span-2 {
  --x-size-span-row-item: 2;
}
.x-row__item--span-3 {
  --x-size-span-row-item: 3;
}
.x-row__item--span-4 {
  --x-size-span-row-item: 4;
}
.x-row__item--span-5 {
  --x-size-span-row-item: 5;
}
.x-row__item--span-6 {
  --x-size-span-row-item: 6;
}
.x-row__item--span-7 {
  --x-size-span-row-item: 7;
}
.x-row__item--span-8 {
  --x-size-span-row-item: 8;
}
.x-row__item--span-9 {
  --x-size-span-row-item: 9;
}
.x-row__item--span-10 {
  --x-size-span-row-item: 10;
}
.x-row__item--span-11 {
  --x-size-span-row-item: 11;
}
.x-row__item--span-12 {
  --x-size-span-row-item: 12;
}
.x-row__item--start-1 {
  --x-size-start-row-item: 1;
}
.x-row__item--start-2 {
  --x-size-start-row-item: 2;
}
.x-row__item--start-3 {
  --x-size-start-row-item: 3;
}
.x-row__item--start-4 {
  --x-size-start-row-item: 4;
}
.x-row__item--start-5 {
  --x-size-start-row-item: 5;
}
.x-row__item--start-6 {
  --x-size-start-row-item: 6;
}
.x-row__item--start-7 {
  --x-size-start-row-item: 7;
}
.x-row__item--start-8 {
  --x-size-start-row-item: 8;
}
.x-row__item--start-9 {
  --x-size-start-row-item: 9;
}
.x-row__item--start-10 {
  --x-size-start-row-item: 10;
}
.x-row__item--start-11 {
  --x-size-start-row-item: 11;
}
.x-row__item--start-12 {
  --x-size-start-row-item: 12;
}

.x-row--justify-start {
  --x-size-justify-row: start;
}

.x-row--align-start {
  --x-size-align-row: start;
}

.x-row--justify-center {
  --x-size-justify-row: center;
}

.x-row--align-center {
  --x-size-align-row: center;
}

.x-row--justify-end {
  --x-size-justify-row: end;
}

.x-row--align-end {
  --x-size-align-row: end;
}

.x-row--justify-stretch {
  --x-size-justify-row: stretch;
}

.x-row--align-stretch {
  --x-size-align-row: stretch;
}
:root {
  --x-color-border-result-default: var(--x-color-base-lead);
  --x-color-border-result-overlay-default: var(--x-color-border-result-default);
  --x-color-border-result-description-default: var(--x-color-border-result-default);
  --x-color-border-result-picture-default: var(--x-color-border-result-default);
  --x-color-background-result-default: transparent;
  --x-size-padding-result-default: 0;
  --x-size-padding-result-overlay-default: 0;
  --x-size-padding-result-description-default: 0;
  --x-size-gap-result-default: var(--x-size-base-03);
  --x-size-padding-result-picture-default: 0;
  --x-size-border-radius-result-default: var(--x-size-border-radius-base-none);
  --x-size-border-width-result-default: 0;
  --x-size-border-width-result-overlay-default: 0;
  --x-size-border-width-result-description-default: 0;
  --x-size-border-width-result-picture-default: 0;
}
:root {
  --x-color-border-result-default: var(--x-color-base-lead);
  --x-color-border-result-overlay-default: var(--x-color-border-result-default);
  --x-color-border-result-description-default: var(--x-color-border-result-default);
  --x-color-border-result-picture-default: var(--x-color-border-result-default);
  --x-color-background-result-default: transparent;
  --x-size-padding-result-default: 0;
  --x-size-padding-result-overlay-default: 0;
  --x-size-padding-result-description-default: 0;
  --x-size-gap-result-default: var(--x-size-base-03);
  --x-size-padding-result-picture-default: 0;
  --x-size-border-radius-result-default: var(--x-size-border-radius-base-none);
  --x-size-border-width-result-default: 0;
  --x-size-border-width-result-overlay-default: 0;
  --x-size-border-width-result-description-default: 0;
  --x-size-border-width-result-picture-default: 0;
}

.x-result {
  display: grid;
  grid-template-columns: [result-start] 1fr [result-end];
  grid-template-rows: [picture-start] auto [overlay-start] auto [picture-end overlay-end description-start] 1fr [description-end];
  box-sizing: border-box;
  background-color: var(--x-color-background-result-default);
  border-color: var(--x-color-border-result-default);
  padding: var(--x-size-padding-result-default);
  gap: var(--x-size-gap-result-default);
  border-style: solid;
  border-width: var(--x-size-border-width-result-default);
  border-radius: var(--x-size-border-radius-result-default);
}
.x-result > * {
  min-width: 0;
}
.x-result__picture {
  grid-column: result;
  grid-row: picture;
}
.x-result__overlay {
  grid-column: result;
  grid-row: overlay;
  z-index: 1;
  border-color: var(--x-color-border-result-overlay-default);
  padding: var(--x-size-padding-result-overlay-default);
  border-style: solid;
  border-width: var(--x-size-border-width-result-overlay-default);
  opacity: 0;
}
.x-result__description {
  grid-column: result;
  grid-row: description;
  border-color: var(--x-color-border-result-description-default);
  padding: var(--x-size-padding-result-description-default);
  border-style: solid;
  border-width: var(--x-size-border-width-result-description-default);
}
.x-result__picture {
  border-color: var(--x-color-border-result-picture-default);
  padding: var(--x-size-padding-result-picture-default);
  border-style: solid;
  border-width: var(--x-size-border-width-result-picture-default);
}
.x-result:hover .x-result__overlay {
  opacity: 1;
}
@media (hover: none) {
  .x-result .x-result__overlay {
    opacity: 1;
  }
}
:root {
  --x-size-border-radius-result-card: var(--x-size-border-radius-base-s);
}
:root {
  --x-size-border-radius-result-card: var(--x-size-border-radius-base-s);
}

.x-result.x-result--card {
  overflow: hidden;
  --x-size-border-radius-result-default: var(--x-size-border-radius-result-card);
}
:root {
  --x-size-height-progress-bar-line-default: var(--x-size-base-02);
  --x-size-width-progress-bar-line-default: var(--x-size-base-20);
  --x-color-background-progress-bar-default: var(--x-color-base-neutral-70);
  --x-color-border-progress-bar-default: var(--x-color-background-progress-bar-default);
  --x-color-background-progress-bar-line-default: var(--x-color-base-neutral-10);
  --x-size-border-radius-progress-bar-default: var(--x-size-border-radius-base-pill);
  --x-size-border-width-progress-bar-default: 0;
}
:root {
  --x-size-height-progress-bar-line-default: var(--x-size-base-02);
  --x-size-width-progress-bar-line-default: var(--x-size-base-20);
  --x-color-background-progress-bar-default: var(--x-color-base-neutral-70);
  --x-color-border-progress-bar-default: var(--x-color-background-progress-bar-default);
  --x-color-background-progress-bar-line-default: var(--x-color-base-neutral-10);
  --x-size-border-radius-progress-bar-default: var(--x-size-border-radius-base-pill);
  --x-size-border-width-progress-bar-default: 0;
}

.x-progress-bar {
  display: inline-block;
  overflow: hidden;
  background-color: var(--x-color-background-progress-bar-default);
  border-color: var(--x-color-border-progress-bar-default);
  border-style: solid;
  border-width: var(--x-size-border-width-progress-bar-default);
  border-radius: var(--x-size-border-radius-progress-bar-default);
}
.x-progress-bar__line, .x-progress-bar-fill {
  height: var(--x-size-height-progress-bar-line-default);
  width: var(--x-size-width-progress-bar-line-default);
  border-radius: var(--x-size-border-radius-progress-bar-default);
  background-color: var(--x-color-background-progress-bar-line-default);
}
:root {
  --x-number-zoom-scale-picture: 1.1;
  --x-number-zoom-duration-picture: 0.3s;
}
:root {
  --x-number-zoom-scale-picture: 1.1;
  --x-number-zoom-duration-picture: 0.3s;
}

.x-picture--zoom .x-picture-image {
  transition: transform var(--x-number-zoom-duration-picture) ease-out;
}
.x-picture--zoom .x-picture-image:hover {
  transform: scale(var(--x-number-zoom-scale-picture));
}
:root {
  --x-number-aspect-ratio-picture: 1;
}
:root {
  --x-number-aspect-ratio-picture: 1;
}

.x-picture--fixed-ratio.x-picture {
  aspect-ratio: var(--x-number-aspect-ratio-picture);
  width: 100%;
}
:root {
  --x-size-border-radius-picture-default: 0;
  --x-size-border-radius-top-picture-default: var(--x-size-border-radius-picture-default);
  --x-size-border-radius-right-picture-default: var(--x-size-border-radius-picture-default);
  --x-size-border-radius-bottom-picture-default: var(--x-size-border-radius-picture-default);
  --x-size-border-radius-left-picture-default: var(--x-size-border-radius-picture-default);
  --x-color-background-picture-default: transparent;
  --x-color-fill-picture-placeholder-path-default: var(--x-color-base-neutral-70);
  --x-color-fill-picture-placeholder-rect-default: var(--x-color-base-neutral-95);
  --x-color-fill-picture-fallback-path-default: var(--x-color-base-neutral-70);
  --x-color-fill-picture-fallback-rect-default: var(--x-color-base-neutral-95);
  --x-object-fit-picture-default: contain;
  --x-object-fit-picture-fallback-default: var(--x-object-fit-picture-default);
  --x-object-fit-picture-placeholder-default: var(--x-object-fit-picture-default);
  --x-mix-blend-mode-picture-default: normal;
  --x-mix-blend-mode-picture-fallback-default: var(--x-mix-blend-mode-picture-default);
  --x-mix-blend-mode-picture-placeholder-default: var(--x-mix-blend-mode-picture-default);
}
:root {
  --x-size-border-radius-picture-default: 0;
  --x-size-border-radius-top-picture-default: var(--x-size-border-radius-picture-default);
  --x-size-border-radius-right-picture-default: var(--x-size-border-radius-picture-default);
  --x-size-border-radius-bottom-picture-default: var(--x-size-border-radius-picture-default);
  --x-size-border-radius-left-picture-default: var(--x-size-border-radius-picture-default);
  --x-color-background-picture-default: transparent;
  --x-color-fill-picture-placeholder-path-default: var(--x-color-base-neutral-70);
  --x-color-fill-picture-placeholder-rect-default: var(--x-color-base-neutral-95);
  --x-color-fill-picture-fallback-path-default: var(--x-color-base-neutral-70);
  --x-color-fill-picture-fallback-rect-default: var(--x-color-base-neutral-95);
  --x-object-fit-picture-default: contain;
  --x-object-fit-picture-fallback-default: var(--x-object-fit-picture-default);
  --x-object-fit-picture-placeholder-default: var(--x-object-fit-picture-default);
  --x-mix-blend-mode-picture-default: normal;
  --x-mix-blend-mode-picture-fallback-default: var(--x-mix-blend-mode-picture-default);
  --x-mix-blend-mode-picture-placeholder-default: var(--x-mix-blend-mode-picture-default);
}

.x-picture {
  display: block;
  overflow: hidden;
  border-radius: var(--x-size-border-radius-top-picture-default) var(--x-size-border-radius-right-picture-default) var(--x-size-border-radius-bottom-picture-default) var(--x-size-border-radius-left-picture-default);
  background: var(--x-color-background-picture-default);
}
.x-picture-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: var(--x-object-fit-picture-default);
  mix-blend-mode: var(--x-mix-blend-mode-picture-default);
}
.x-picture-image--fallback {
  --x-object-fit-picture-default: var(--x-object-fit-picture-fallback-default) !important;
  --x-mix-blend-mode-picture-default: var(
    --x-mix-blend-mode-picture-fallback-default
  ) !important;
}
.x-picture-image--fallback > rect {
  fill: var(--x-color-fill-picture-fallback-rect-default) !important;
}
.x-picture-image--fallback > path {
  fill: var(--x-color-fill-picture-fallback-path-default) !important;
}
.x-picture-image--placeholder {
  --x-object-fit-picture-default: var(--x-object-fit-picture-placeholder-default) !important;
  --x-mix-blend-mode-picture-default: var(
    --x-mix-blend-mode-picture-placeholder-default
  ) !important;
}
.x-picture-image--placeholder > rect {
  fill: var(--x-color-fill-picture-placeholder-rect-default) !important;
}
.x-picture-image--placeholder > path {
  fill: var(--x-color-fill-picture-placeholder-path-default) !important;
}
:root {
  --x-color-background-picture-cover-hover-from: rgba(0, 0, 0, 0);
  --x-color-background-picture-cover-hover-to: rgba(0, 0, 0, 0.5);
}
:root {
  --x-color-background-picture-cover-hover-from: rgba(0, 0, 0, 0);
  --x-color-background-picture-cover-hover-to: rgba(0, 0, 0, 0.5);
}

.x-picture--cover.x-picture {
  position: relative;
}

.x-result:hover .x-picture--cover:after,
.x-picture--cover:hover:after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background: linear-gradient(to bottom, var(--x-color-background-picture-cover-hover-from) 50%, var(--x-color-background-picture-cover-hover-to) 100%);
  width: 100%;
  height: 100%;
}
:root {
  --x-color-background-picture-colored: var(--x-color-base-neutral-95);
  --x-mix-blend-mode-picture-colored: multiply;
  --x-mix-blend-mode-picture-fallback-colored: var(--x-mix-blend-mode-picture-colored);
  --x-mix-blend-mode-picture-placeholder-colored: var(--x-mix-blend-mode-picture-colored);
}
:root {
  --x-color-background-picture-colored: var(--x-color-base-neutral-95);
  --x-mix-blend-mode-picture-colored: multiply;
  --x-mix-blend-mode-picture-fallback-colored: var(--x-mix-blend-mode-picture-colored);
  --x-mix-blend-mode-picture-placeholder-colored: var(--x-mix-blend-mode-picture-colored);
}

.x-picture--colored.x-picture {
  --x-color-background-picture-default: var(--x-color-background-picture-colored);
}
.x-picture--colored.x-picture .x-picture-image {
  --x-mix-blend-mode-picture-default: var(--x-mix-blend-mode-picture-colored);
}
.x-picture--colored.x-picture .x-picture--fallback {
  --x-mix-blend-mode-picture-default: var(--x-mix-blend-mode-picture-fallback-colored);
}
.x-picture--colored.x-picture .x-picture--placeholder {
  --x-mix-blend-mode-picture-default: var(--x-mix-blend-mode-picture-placeholder-colored);
}
:root {
  --x-size-border-radius-picture-card: var(--x-size-border-radius-base-s);
  --x-size-border-radius-top-picture-card: var(--x-size-border-radius-picture-card);
  --x-size-border-radius-right-picture-card: var(--x-size-border-radius-picture-card);
  --x-size-border-radius-bottom-picture-card: var(--x-size-border-radius-picture-card);
  --x-size-border-radius-left-picture-card: var(--x-size-border-radius-picture-card);
}
:root {
  --x-color-background-option-list-button-default: transparent;
  --x-color-border-option-list-button-default: transparent;
  --x-color-text-option-list-button-default: var(--x-color-base-neutral-35);
  --x-color-background-option-list-button-default-hover: var(
    --x-color-background-option-list-button-default
  );
  --x-color-border-option-list-button-default-hover: var(
    --x-color-border-option-list-button-default
  );
  --x-color-text-option-list-button-default-hover: var(--x-color-text-option-list-button-default);
  --x-color-background-option-list-button-default-selected: var(
    --x-color-background-option-list-button-default
  );
  --x-color-border-option-list-button-default-selected: var(
    --x-color-border-option-list-button-default
  );
  --x-color-text-option-list-button-default-selected: var(--x-color-text-default);
  --x-color-background-option-list-button-default-selected-hover: var(
    --x-color-background-option-list-button-default-selected
  );
  --x-color-border-option-list-button-default-selected-hover: var(
    --x-color-border-option-list-button-default-selected
  );
  --x-color-text-option-list-button-default-selected-hover: var(
    --x-color-text-option-list-button-default-selected
  );
  --x-color-border-option-list-item-default: var(--x-color-base-neutral-70);
  --x-color-border-top-option-list-item-default: var(--x-color-border-option-list-item-default);
  --x-color-border-right-option-list-item-default: var(--x-color-border-option-list-item-default);
  --x-color-border-bottom-option-list-item-default: var(--x-color-border-option-list-item-default);
  --x-color-border-left-option-list-item-default: var(--x-color-border-option-list-item-default);
  --x-color-border-option-list-item-default-selected: var(--x-color-base-neutral-70);
  --x-color-border-top-option-list-item-default-selected: var(
    --x-color-border-option-list-item-default-selected
  );
  --x-color-border-right-option-list-item-default-selected: var(
    --x-color-border-option-list-item-default-selected
  );
  --x-color-border-bottom-option-list-item-default-selected: var(
    --x-color-border-option-list-item-default-selected
  );
  --x-color-border-left-option-list-item-default-selected: var(
    --x-color-border-option-list-item-default-selected
  );
  --x-size-border-width-option-list-item-default: var(--x-size-border-width-base);
  --x-size-border-width-top-option-list-item-default: 0;
  --x-size-border-width-right-option-list-item-default: var(
    --x-size-border-width-option-list-item-default
  );
  --x-size-border-width-bottom-option-list-item-default: 0;
  --x-size-border-width-left-option-list-item-default: 0;
  --x-size-border-width-top-option-list-item-default-selected: var(
    --x-size-border-width-top-option-list-item-default
  );
  --x-size-border-width-right-option-list-item-default-selected: var(
    --x-size-border-width-right-option-list-item-default
  );
  --x-size-border-width-bottom-option-list-item-default-selected: var(
    --x-size-border-width-bottom-option-list-item-default
  );
  --x-size-border-width-left-option-list-item-default-selected: var(
    --x-size-border-width-left-option-list-item-default
  );
  --x-size-padding-option-list-button-default: var(--x-size-base-02);
  --x-size-padding-top-option-list-button-default: var(--x-size-padding-option-list-button-default);
  --x-size-padding-right-option-list-button-default: var(
    --x-size-padding-option-list-button-default
  );
  --x-size-padding-bottom-option-list-button-default: var(
    --x-size-padding-option-list-button-default
  );
  --x-size-padding-left-option-list-button-default: var(
    --x-size-padding-option-list-button-default
  );
  --x-font-decoration-option-list-button-default-hover: underline;
  --x-size-font-option-list-button-default: var(--x-size-font-text);
  --x-number-font-weight-option-list-button-default: var(--x-number-font-weight-base-regular);
  --x-number-font-weight-option-list-button-default-selected: var(--x-number-font-weight-base-bold);
}
:root {
  --x-size-border-radius-picture-card: var(--x-size-border-radius-base-s);
  --x-size-border-radius-top-picture-card: var(--x-size-border-radius-picture-card);
  --x-size-border-radius-right-picture-card: var(--x-size-border-radius-picture-card);
  --x-size-border-radius-bottom-picture-card: var(--x-size-border-radius-picture-card);
  --x-size-border-radius-left-picture-card: var(--x-size-border-radius-picture-card);
}

.x-picture--card.x-picture {
  --x-size-border-radius-picture-default: var(--x-size-border-radius-picture-card);
  --x-size-border-radius-top-picture-default: var(--x-size-border-radius-top-picture-card);
  --x-size-border-radius-right-picture-default: var(--x-size-border-radius-right-picture-card);
  --x-size-border-radius-bottom-picture-default: var(--x-size-border-radius-bottom-picture-card);
  --x-size-border-radius-left-picture-default: var(--x-size-border-radius-left-picture-card);
}
:root {
  --x-color-background-option-list-button-default: transparent;
  --x-color-border-option-list-button-default: transparent;
  --x-color-text-option-list-button-default: var(--x-color-base-neutral-35);
  --x-color-background-option-list-button-default-hover: var(
    --x-color-background-option-list-button-default
  );
  --x-color-border-option-list-button-default-hover: var(
    --x-color-border-option-list-button-default
  );
  --x-color-text-option-list-button-default-hover: var(--x-color-text-option-list-button-default);
  --x-color-background-option-list-button-default-selected: var(
    --x-color-background-option-list-button-default
  );
  --x-color-border-option-list-button-default-selected: var(
    --x-color-border-option-list-button-default
  );
  --x-color-text-option-list-button-default-selected: var(--x-color-text-default);
  --x-color-background-option-list-button-default-selected-hover: var(
    --x-color-background-option-list-button-default-selected
  );
  --x-color-border-option-list-button-default-selected-hover: var(
    --x-color-border-option-list-button-default-selected
  );
  --x-color-text-option-list-button-default-selected-hover: var(
    --x-color-text-option-list-button-default-selected
  );
  --x-color-border-option-list-item-default: var(--x-color-base-neutral-70);
  --x-color-border-top-option-list-item-default: var(--x-color-border-option-list-item-default);
  --x-color-border-right-option-list-item-default: var(--x-color-border-option-list-item-default);
  --x-color-border-bottom-option-list-item-default: var(--x-color-border-option-list-item-default);
  --x-color-border-left-option-list-item-default: var(--x-color-border-option-list-item-default);
  --x-color-border-option-list-item-default-selected: var(--x-color-base-neutral-70);
  --x-color-border-top-option-list-item-default-selected: var(
    --x-color-border-option-list-item-default-selected
  );
  --x-color-border-right-option-list-item-default-selected: var(
    --x-color-border-option-list-item-default-selected
  );
  --x-color-border-bottom-option-list-item-default-selected: var(
    --x-color-border-option-list-item-default-selected
  );
  --x-color-border-left-option-list-item-default-selected: var(
    --x-color-border-option-list-item-default-selected
  );
  --x-size-border-width-option-list-item-default: var(--x-size-border-width-base);
  --x-size-border-width-top-option-list-item-default: 0;
  --x-size-border-width-right-option-list-item-default: var(
    --x-size-border-width-option-list-item-default
  );
  --x-size-border-width-bottom-option-list-item-default: 0;
  --x-size-border-width-left-option-list-item-default: 0;
  --x-size-border-width-top-option-list-item-default-selected: var(
    --x-size-border-width-top-option-list-item-default
  );
  --x-size-border-width-right-option-list-item-default-selected: var(
    --x-size-border-width-right-option-list-item-default
  );
  --x-size-border-width-bottom-option-list-item-default-selected: var(
    --x-size-border-width-bottom-option-list-item-default
  );
  --x-size-border-width-left-option-list-item-default-selected: var(
    --x-size-border-width-left-option-list-item-default
  );
  --x-size-padding-option-list-button-default: var(--x-size-base-02);
  --x-size-padding-top-option-list-button-default: var(--x-size-padding-option-list-button-default);
  --x-size-padding-right-option-list-button-default: var(
    --x-size-padding-option-list-button-default
  );
  --x-size-padding-bottom-option-list-button-default: var(
    --x-size-padding-option-list-button-default
  );
  --x-size-padding-left-option-list-button-default: var(
    --x-size-padding-option-list-button-default
  );
  --x-font-decoration-option-list-button-default-hover: underline;
  --x-size-font-option-list-button-default: var(--x-size-font-text);
  --x-number-font-weight-option-list-button-default: var(--x-number-font-weight-base-regular);
  --x-number-font-weight-option-list-button-default-selected: var(--x-number-font-weight-base-bold);
}

.x-option-list {
  display: inline-flex;
  flex-flow: row nowrap;
  align-items: center;
  box-sizing: border-box;
  list-style-type: none;
  margin: 0;
  padding: 0;
}
[dir="ltr"] .x-option-list__item {
  border-right-width: var(--x-size-border-width-right-option-list-item-default);
}
[dir="rtl"] .x-option-list__item {
  border-left-width: var(--x-size-border-width-right-option-list-item-default);
}
[dir="ltr"] .x-option-list__item {
  border-left-width: var(--x-size-border-width-left-option-list-item-default);
}
[dir="rtl"] .x-option-list__item {
  border-right-width: var(--x-size-border-width-left-option-list-item-default);
}
.x-option-list__item {
  border-top-color: var(--x-color-border-top-option-list-item-default);
  border-right-color: var(--x-color-border-right-option-list-item-default);
  border-bottom-color: var(--x-color-border-bottom-option-list-item-default);
  border-left-color: var(--x-color-border-left-option-list-item-default);
  border-style: solid;
  border-top-width: var(--x-size-border-width-top-option-list-item-default);
  border-bottom-width: var(--x-size-border-width-bottom-option-list-item-default);
}
.x-option-list__item.x-option-list__item--is-selected {
  --x-color-border-option-list-item-default: var(
    --x-color-border-option-list-item-default-selected
  );
  --x-color-border-top-option-list-item-default: var(
    --x-color-border-top-option-list-item-default-selected
  );
  --x-color-border-right-option-list-item-default: var(
    --x-color-border-right-option-list-item-default-selected
  );
  --x-color-border-bottom-option-list-item-default: var(
    --x-color-border-bottom-option-list-item-default-selected
  );
  --x-color-border-left-option-list-item-default: var(
    --x-color-border-left-option-list-item-default-selected
  );
  --x-size-border-width-top-option-list-item-default: var(
    --x-size-border-width-top-option-list-item-default-selected
  );
  --x-size-border-width-right-option-list-item-default: var(
    --x-size-border-width-right-option-list-item-default-selected
  );
  --x-size-border-width-bottom-option-list-item-default: var(
    --x-size-border-width-bottom-option-list-item-default-selected
  );
  --x-size-border-width-left-option-list-item-default: var(
    --x-size-border-width-left-option-list-item-default-selected
  );
}
.x-option-list__item.x-option-list__item--is-selected .x-button {
  --x-color-background-button-default: var(
    --x-color-background-option-list-button-default-selected
  );
  --x-color-border-button-default: var(--x-color-border-option-list-button-default-selected);
  --x-color-text-button-default: var(--x-color-text-option-list-button-default-selected);
  --x-number-font-weight-option-list-button-default: var(
    --x-number-font-weight-option-list-button-default-selected
  );
}
.x-option-list__item.x-option-list__item--is-selected .x-button:hover {
  --x-color-background-button-default: var(
    --x-color-background-option-list-button-default-selected-hover
  );
  --x-color-border-button-default: var(
    --x-color-border-option-list-button-default-selected-hover
  );
  --x-color-text-button-default: var(
    --x-color-text-option-list-button-default-selected-hover
  );
}
.x-option-list__item:last-child {
  --x-size-border-width-option-list-item-default: 0;
  --x-size-border-width-top-option-list-item-default: 0;
  --x-size-border-width-right-option-list-item-default: 0;
  --x-size-border-width-bottom-option-list-item-default: 0;
  --x-size-border-width-left-option-list-item-default: 0;
}
.x-option-list__item .x-button {
  --x-color-background-button-default: var(--x-color-background-option-list-button-default);
  --x-color-border-button-default: var(--x-color-border-option-list-button-default);
  --x-color-text-button-default: var(--x-color-text-option-list-button-default);
  min-height: auto;
  --x-size-padding-button-default: var(--x-size-padding-option-list-button-default);
  --x-size-padding-top-button-default: var(--x-size-padding-top-option-list-button-default);
  --x-size-padding-right-button-default: var(--x-size-padding-right-option-list-button-default);
  --x-size-padding-bottom-button-default: var(
    --x-size-padding-bottom-option-list-button-default
  );
  --x-size-padding-left-button-default: var(--x-size-padding-left-option-list-button-default);
  --x-number-font-weight-button-default: var(--x-number-font-weight-option-list-button-default);
  --x-size-font-button-default: var(--x-size-font-option-list-button-default);
}
.x-option-list__item .x-button:hover {
  --x-color-background-button-default: var(
    --x-color-background-option-list-button-default-hover
  );
  --x-color-border-button-default: var(--x-color-border-option-list-button-default-hover);
  --x-color-text-button-default: var(--x-color-text-option-list-button-default-hover);
  -webkit-text-decoration: var(--x-font-decoration-option-list-button-default-hover);
          text-decoration: var(--x-font-decoration-option-list-button-default-hover);
}
:root {
  --x-color-text-option-list-button-bottom-hover: var(--x-color-base-neutral-10);
  --x-color-text-option-list-button-bottom-selected-hover: var(
    --x-color-text-option-list-button-bottom-selected
  );
  --x-color-text-option-list-button-bottom: var(--x-color-base-neutral-35);
  --x-color-text-option-list-button-bottom-selected: var(--x-color-text-default);
  --x-color-border-option-list-item-bottom: transparent;
  --x-color-border-top-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
  --x-color-border-right-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
  --x-color-border-bottom-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
  --x-color-border-left-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
  --x-color-border-option-list-item-bottom-selected: var(--x-color-base-neutral-10);
  --x-color-border-top-option-list-item-bottom-selected: var(
    --x-color-border-option-list-item-bottom
  );
  --x-color-border-right-option-list-item-bottom-selected: var(
    --x-color-border-option-list-item-bottom
  );
  --x-color-border-bottom-option-list-item-bottom-selected: var(
    --x-color-border-option-list-item-bottom-selected
  );
  --x-color-border-left-option-list-item-bottom-selected: var(
    --x-color-border-option-list-item-bottom
  );
  --x-size-border-width-option-list-item-bottom: var(--x-size-border-width-base);
  --x-size-border-width-top-option-list-item-bottom: 0;
  --x-size-border-width-right-option-list-item-bottom: 0;
  --x-size-border-width-bottom-option-list-item-bottom: var(
    --x-size-border-width-option-list-item-bottom
  );
  --x-size-border-width-left-option-list-item-bottom: 0;
  --x-size-border-width-top-option-list-item-bottom-selected: 0;
  --x-size-border-width-right-option-list-item-bottom-selected: 0;
  --x-size-border-width-bottom-option-list-item-bottom-selected: var(
    --x-size-border-width-option-list-item-bottom
  );
  --x-size-border-width-left-option-list-item-bottom-selected: 0;
  --x-size-font-option-list-button-bottom: var(--x-size-font-text);
  --x-font-decoration-option-list-button-bottom-hover: none;
  --x-number-font-weight-option-list-button-bottom: var(--x-number-font-weight-base-regular);
  --x-number-font-weight-option-list-button-bottom-selected: var(
    --x-number-font-weight-base-regular
  );
}

.x-option-list--bottom.x-option-list,
.x-option-list--bottom .x-option-list {
  --x-color-text-option-list-button-default: var(--x-color-text-option-list-button-bottom);
  --x-color-text-option-list-button-default-hover: var(
    --x-color-text-option-list-button-bottom-hover
  );
  --x-color-border-option-list-item-default: var(--x-color-border-option-list-item-bottom);
  --x-color-border-top-option-list-item-default: var(--x-color-border-top-option-list-item-bottom);
  --x-color-border-right-option-list-item-default: var(
    --x-color-border-top-option-list-item-bottom
  );
  --x-color-border-bottom-option-list-item-default: var(
    --x-color-border-top-option-list-item-bottom
  );
  --x-color-border-left-option-list-item-default: var(--x-color-border-top-option-list-item-bottom);
  --x-size-border-width-option-list-item-default: var(
    --x-size-border-width-option-list-item-bottom
  );
  --x-size-border-width-top-option-list-item-default: var(
    --x-size-border-width-top-option-list-item-bottom
  );
  --x-size-border-width-right-option-list-item-default: var(
    --x-size-border-width-right-option-list-item-bottom
  );
  --x-size-border-width-bottom-option-list-item-default: var(
    --x-size-border-width-bottom-option-list-item-bottom
  );
  --x-size-border-width-left-option-list-item-default: var(
    --x-size-border-width-left-option-list-item-bottom
  );
  --x-font-decoration-option-list-button-default-hover: var(
    --x-font-decoration-option-list-button-bottom-hover
  );
  --x-size-font-option-list-button-default: var(--x-size-font-option-list-button-bottom);
  --x-number-font-weight-option-list-button-default: var(
    --x-number-font-weight-option-list-button-bottom
  );
}
.x-option-list--bottom.x-option-list .x-option-list__item.x-option-list__item--is-selected,
.x-option-list--bottom .x-option-list .x-option-list__item.x-option-list__item--is-selected {
  --x-color-text-option-list-button-default-selected: var(
    --x-color-text-option-list-button-bottom-selected
  );
  --x-color-text-option-list-button-default-selected-hover: var(
    --x-color-text-option-list-button-bottom-selected-hover
  );
  --x-color-border-option-list-item-default-selected: var(
    --x-color-border-option-list-item-bottom-selected
  );
  --x-color-border-top-option-list-item-default-selected: var(
    --x-color-border-top-option-list-item-bottom-selected
  );
  --x-color-border-right-option-list-item-default-selected: var(
    --x-color-border-top-option-list-item-bottom-selected
  );
  --x-color-border-bottom-option-list-item-default-selected: var(
    --x-color-border-bottom-option-list-item-bottom-selected
  );
  --x-color-border-left-option-list-item-default-selected: var(
    --x-color-border-top-option-list-item-bottom-selected
  );
  --x-size-border-width-top-option-list-item-default: var(
    --x-size-border-width-top-option-list-item-bottom-selected
  );
  --x-size-border-width-right-option-list-item-default: var(
    --x-size-border-width-right-option-list-item-bottom-selected
  );
  --x-size-border-width-bottom-option-list-item-default: var(
    --x-size-border-width-bottom-option-list-item-bottom-selected
  );
  --x-size-border-width-left-option-list-item-default: var(
    --x-size-border-width-left-option-list-item-bottom-selected
  );
  --x-number-font-weight-option-list-button-default-selected: var(
    --x-number-font-weight-option-list-button-bottom-selected
  );
}
.x-option-list--bottom.x-option-list .x-option-list__item:last-child,
.x-option-list--bottom .x-option-list .x-option-list__item:last-child {
  --x-size-border-width-option-list-item-default: inherit;
  --x-size-border-width-top-option-list-item-default: inherit;
  --x-size-border-width-right-option-list-item-default: inherit;
  --x-size-border-width-bottom-option-list-item-default: inherit;
  --x-size-border-width-left-option-list-item-default: inherit;
}
:root {
  --x-color-text-option-list-button-bottom-hover: var(--x-color-base-neutral-10);
  --x-color-text-option-list-button-bottom-selected-hover: var(
    --x-color-text-option-list-button-bottom-selected
  );
  --x-color-text-option-list-button-bottom: var(--x-color-base-neutral-35);
  --x-color-text-option-list-button-bottom-selected: var(--x-color-text-default);
  --x-color-border-option-list-item-bottom: transparent;
  --x-color-border-top-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
  --x-color-border-right-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
  --x-color-border-bottom-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
  --x-color-border-left-option-list-item-bottom: var(--x-color-border-option-list-item-bottom);
  --x-color-border-option-list-item-bottom-selected: var(--x-color-base-neutral-10);
  --x-color-border-top-option-list-item-bottom-selected: var(
    --x-color-border-option-list-item-bottom
  );
  --x-color-border-right-option-list-item-bottom-selected: var(
    --x-color-border-option-list-item-bottom
  );
  --x-color-border-bottom-option-list-item-bottom-selected: var(
    --x-color-border-option-list-item-bottom-selected
  );
  --x-color-border-left-option-list-item-bottom-selected: var(
    --x-color-border-option-list-item-bottom
  );
  --x-size-border-width-option-list-item-bottom: var(--x-size-border-width-base);
  --x-size-border-width-top-option-list-item-bottom: 0;
  --x-size-border-width-right-option-list-item-bottom: 0;
  --x-size-border-width-bottom-option-list-item-bottom: var(
    --x-size-border-width-option-list-item-bottom
  );
  --x-size-border-width-left-option-list-item-bottom: 0;
  --x-size-border-width-top-option-list-item-bottom-selected: 0;
  --x-size-border-width-right-option-list-item-bottom-selected: 0;
  --x-size-border-width-bottom-option-list-item-bottom-selected: var(
    --x-size-border-width-option-list-item-bottom
  );
  --x-size-border-width-left-option-list-item-bottom-selected: 0;
  --x-size-font-option-list-button-bottom: var(--x-size-font-text);
  --x-font-decoration-option-list-button-bottom-hover: none;
  --x-number-font-weight-option-list-button-bottom: var(--x-number-font-weight-base-regular);
  --x-number-font-weight-option-list-button-bottom-selected: var(
    --x-number-font-weight-base-regular
  );
}
:root {
  --x-modal-overlay-color: rgb(0, 0, 0);
  --x-modal-overlay-opacity: 0.7;
}
:root {
  --x-modal-overlay-color: rgb(0, 0, 0);
  --x-modal-overlay-opacity: 0.7;
}

.x-modal__overlay {
  background-color: var(--x-modal-overlay-color) !important;
  opacity: var(--x-modal-overlay-opacity) !important;
}
:root {
  --x-string-justify-message-default: center;
  --x-size-gap-message-default: var(--x-size-base-03);
  --x-size-padding-message-default: var(--x-size-base-06);
  --x-color-background-message-default: var(--x-color-base-neutral-95);
  --x-color-border-message-default: var(--x-color-background-message-default);
  --x-color-text-message-default: var(--x-color-text-default);
  --x-size-border-radius-message-default: var(--x-size-border-radius-base-m);
  --x-size-border-radius-top-left-message-default: var(--x-size-border-radius-message-default);
  --x-size-border-radius-top-right-message-default: var(--x-size-border-radius-message-default);
  --x-size-border-radius-bottom-right-message-default: var(--x-size-border-radius-message-default);
  --x-size-border-radius-bottom-left-message-default: var(--x-size-border-radius-message-default);
  --x-size-border-width-message-default: var(--x-size-border-width-base);
  --x-size-border-width-top-message-default: var(--x-size-border-width-message-default);
  --x-size-border-width-right-message-default: var(--x-size-border-width-message-default);
  --x-size-border-width-bottom-message-default: var(--x-size-border-width-message-default);
  --x-size-border-width-left-message-default: var(--x-size-border-width-message-default);
  --x-font-family-message-default: var(--x-font-family-title3);
  --x-size-font-message-default: var(--x-size-font-title3);
  --x-number-font-weight-message-default: var(--x-number-font-weight-title3);
}
:root {
  --x-string-justify-message-default: center;
  --x-size-gap-message-default: var(--x-size-base-03);
  --x-size-padding-message-default: var(--x-size-base-06);
  --x-color-background-message-default: var(--x-color-base-neutral-95);
  --x-color-border-message-default: var(--x-color-background-message-default);
  --x-color-text-message-default: var(--x-color-text-default);
  --x-size-border-radius-message-default: var(--x-size-border-radius-base-m);
  --x-size-border-radius-top-left-message-default: var(--x-size-border-radius-message-default);
  --x-size-border-radius-top-right-message-default: var(--x-size-border-radius-message-default);
  --x-size-border-radius-bottom-right-message-default: var(--x-size-border-radius-message-default);
  --x-size-border-radius-bottom-left-message-default: var(--x-size-border-radius-message-default);
  --x-size-border-width-message-default: var(--x-size-border-width-base);
  --x-size-border-width-top-message-default: var(--x-size-border-width-message-default);
  --x-size-border-width-right-message-default: var(--x-size-border-width-message-default);
  --x-size-border-width-bottom-message-default: var(--x-size-border-width-message-default);
  --x-size-border-width-left-message-default: var(--x-size-border-width-message-default);
  --x-font-family-message-default: var(--x-font-family-title3);
  --x-size-font-message-default: var(--x-size-font-title3);
  --x-number-font-weight-message-default: var(--x-number-font-weight-title3);
}

[dir="ltr"] .x-message {
  border-left-width: var(--x-size-border-width-left-message-default);
}

[dir="rtl"] .x-message {
  border-right-width: var(--x-size-border-width-left-message-default);
}

[dir="ltr"] .x-message {
  border-right-width: var(--x-size-border-width-right-message-default);
}

[dir="rtl"] .x-message {
  border-left-width: var(--x-size-border-width-right-message-default);
}

.x-message {
  display: flex;
  flex-flow: column nowrap;
  justify-content: var(--x-string-justify-message-default);
  align-items: center;
  box-sizing: border-box;
  gap: var(--x-size-gap-message-default);
  padding: var(--x-size-padding-message-default);
  background-color: var(--x-color-background-message-default);
  border-color: var(--x-color-border-message-default);
  border-style: solid;
  border-top-width: var(--x-size-border-width-top-message-default);
  border-bottom-width: var(--x-size-border-width-bottom-message-default);
  border-radius: var(--x-size-border-radius-top-left-message-default) var(--x-size-border-radius-top-right-message-default) var(--x-size-border-radius-bottom-right-message-default) var(--x-size-border-radius-bottom-left-message-default);
  font-family: var(--x-font-family-message-default);
  font-size: var(--x-size-font-message-default);
  font-weight: var(--x-number-font-weight-message-default);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-message {
    gap: 0;
  }
  .x-message > *:not(:last-child) {
    margin-right: var(--x-size-gap-message-default);
  }
}
.x-message,
.x-message > a {
  color: var(--x-color-text-message-default);
}
.x-message > p {
  margin: 0;
}
/* @deprecated */
:root {
  --x-size-padding-list-01: var(--x-size-base-01);
  --x-size-padding-list-02: var(--x-size-base-02);
  --x-size-padding-list-03: var(--x-size-base-03);
  --x-size-padding-list-04: var(--x-size-base-04);
  --x-size-padding-list-05: var(--x-size-base-05);
  --x-size-padding-list-06: var(--x-size-base-06);
  --x-size-padding-list-07: var(--x-size-base-07);
  --x-size-padding-list-08: var(--x-size-base-08);
  --x-size-padding-list-09: var(--x-size-base-09);
  --x-size-padding-list-10: var(--x-size-base-10);
  --x-size-padding-list-11: var(--x-size-base-11);
  --x-size-padding-list-12: var(--x-size-base-12);
  --x-size-padding-list-13: var(--x-size-base-13);
}
/* @deprecated */
:root {
  --x-size-padding-list-01: var(--x-size-base-01);
  --x-size-padding-list-02: var(--x-size-base-02);
  --x-size-padding-list-03: var(--x-size-base-03);
  --x-size-padding-list-04: var(--x-size-base-04);
  --x-size-padding-list-05: var(--x-size-base-05);
  --x-size-padding-list-06: var(--x-size-base-06);
  --x-size-padding-list-07: var(--x-size-base-07);
  --x-size-padding-list-08: var(--x-size-base-08);
  --x-size-padding-list-09: var(--x-size-base-09);
  --x-size-padding-list-10: var(--x-size-base-10);
  --x-size-padding-list-11: var(--x-size-base-11);
  --x-size-padding-list-12: var(--x-size-base-12);
  --x-size-padding-list-13: var(--x-size-base-13);
}

/* @deprecated */
[class*=x-list--padding-].x-list.x-list--padding-top:not(.x-list--padding-right) {
  padding-right: 0;
}
[class*=x-list--padding-].x-list.x-list--padding-top:not(.x-list--padding-bottom) {
  padding-bottom: 0;
}
[class*=x-list--padding-].x-list.x-list--padding-top:not(.x-list--padding-left) {
  padding-left: 0;
}
[class*=x-list--padding-].x-list.x-list--padding-right:not(.x-list--padding-top) {
  padding-top: 0;
}
[class*=x-list--padding-].x-list.x-list--padding-right:not(.x-list--padding-bottom) {
  padding-bottom: 0;
}
[class*=x-list--padding-].x-list.x-list--padding-right:not(.x-list--padding-left) {
  padding-left: 0;
}
[class*=x-list--padding-].x-list.x-list--padding-bottom:not(.x-list--padding-top) {
  padding-top: 0;
}
[class*=x-list--padding-].x-list.x-list--padding-bottom:not(.x-list--padding-right) {
  padding-right: 0;
}
[class*=x-list--padding-].x-list.x-list--padding-bottom:not(.x-list--padding-left) {
  padding-left: 0;
}
[class*=x-list--padding-].x-list.x-list--padding-left:not(.x-list--padding-top) {
  padding-top: 0;
}
[class*=x-list--padding-].x-list.x-list--padding-left:not(.x-list--padding-right) {
  padding-right: 0;
}
[class*=x-list--padding-].x-list.x-list--padding-left:not(.x-list--padding-bottom) {
  padding-bottom: 0;
}

.x-list--padding-01.x-list {
  padding: var(--x-size-padding-list-01);
}

.x-list--gap-.x-list {
  gap: var(--x-size-gap-list-01);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-.x-list {
    gap: 0;
  }
  .x-list--gap-.x-list > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-01);
  }
  .x-list--gap-.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-01);
  }
}

.x-list--padding-02.x-list {
  padding: var(--x-size-padding-list-02);
}

.x-list--gap-.x-list {
  gap: var(--x-size-gap-list-02);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-.x-list {
    gap: 0;
  }
  .x-list--gap-.x-list > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-02);
  }
  .x-list--gap-.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-02);
  }
}

.x-list--padding-03.x-list {
  padding: var(--x-size-padding-list-03);
}

.x-list--gap-.x-list {
  gap: var(--x-size-gap-list-03);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-.x-list {
    gap: 0;
  }
  .x-list--gap-.x-list > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-03);
  }
  .x-list--gap-.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-03);
  }
}

.x-list--padding-04.x-list {
  padding: var(--x-size-padding-list-04);
}

.x-list--gap-.x-list {
  gap: var(--x-size-gap-list-04);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-.x-list {
    gap: 0;
  }
  .x-list--gap-.x-list > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-04);
  }
  .x-list--gap-.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-04);
  }
}

.x-list--padding-05.x-list {
  padding: var(--x-size-padding-list-05);
}

.x-list--gap-.x-list {
  gap: var(--x-size-gap-list-05);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-.x-list {
    gap: 0;
  }
  .x-list--gap-.x-list > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-05);
  }
  .x-list--gap-.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-05);
  }
}

.x-list--padding-06.x-list {
  padding: var(--x-size-padding-list-06);
}

.x-list--gap-.x-list {
  gap: var(--x-size-gap-list-06);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-.x-list {
    gap: 0;
  }
  .x-list--gap-.x-list > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-06);
  }
  .x-list--gap-.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-06);
  }
}

.x-list--padding-07.x-list {
  padding: var(--x-size-padding-list-07);
}

.x-list--gap-.x-list {
  gap: var(--x-size-gap-list-07);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-.x-list {
    gap: 0;
  }
  .x-list--gap-.x-list > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-07);
  }
  .x-list--gap-.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-07);
  }
}

.x-list--padding-08.x-list {
  padding: var(--x-size-padding-list-08);
}

.x-list--gap-.x-list {
  gap: var(--x-size-gap-list-08);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-.x-list {
    gap: 0;
  }
  .x-list--gap-.x-list > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-08);
  }
  .x-list--gap-.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-08);
  }
}

.x-list--padding-09.x-list {
  padding: var(--x-size-padding-list-09);
}

.x-list--gap-.x-list {
  gap: var(--x-size-gap-list-09);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-.x-list {
    gap: 0;
  }
  .x-list--gap-.x-list > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-09);
  }
  .x-list--gap-.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-09);
  }
}

.x-list--padding-10.x-list {
  padding: var(--x-size-padding-list-10);
}

.x-list--gap-.x-list {
  gap: var(--x-size-gap-list-10);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-.x-list {
    gap: 0;
  }
  .x-list--gap-.x-list > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-10);
  }
  .x-list--gap-.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-10);
  }
}

.x-list--padding-11.x-list {
  padding: var(--x-size-padding-list-11);
}

.x-list--gap-.x-list {
  gap: var(--x-size-gap-list-11);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-.x-list {
    gap: 0;
  }
  .x-list--gap-.x-list > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-11);
  }
  .x-list--gap-.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-11);
  }
}

.x-list--padding-12.x-list {
  padding: var(--x-size-padding-list-12);
}

.x-list--gap-.x-list {
  gap: var(--x-size-gap-list-12);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-.x-list {
    gap: 0;
  }
  .x-list--gap-.x-list > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-12);
  }
  .x-list--gap-.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-12);
  }
}

.x-list--padding-13.x-list {
  padding: var(--x-size-padding-list-13);
}

.x-list--gap-.x-list {
  gap: var(--x-size-gap-list-13);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-.x-list {
    gap: 0;
  }
  .x-list--gap-.x-list > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-13);
  }
  .x-list--gap-.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-13);
  }
}
:root {
  --x-size-gap-list-01: var(--x-size-base-01);
  --x-size-gap-list-02: var(--x-size-base-02);
  --x-size-gap-list-03: var(--x-size-base-03);
  --x-size-gap-list-04: var(--x-size-base-04);
  --x-size-gap-list-05: var(--x-size-base-05);
  --x-size-gap-list-06: var(--x-size-base-06);
  --x-size-gap-list-07: var(--x-size-base-07);
  --x-size-gap-list-08: var(--x-size-base-08);
  --x-size-gap-list-09: var(--x-size-base-09);
  --x-size-gap-list-10: var(--x-size-base-10);
  --x-size-gap-list-11: var(--x-size-base-11);
  --x-size-gap-list-12: var(--x-size-base-12);
  --x-size-gap-list-13: var(--x-size-base-13);
  --x-size-gap-list-14: var(--x-size-base-14);
  --x-size-gap-list-15: var(--x-size-base-15);
  --x-size-gap-list-16: var(--x-size-base-16);
  --x-size-gap-list-17: var(--x-size-base-17);
  --x-size-gap-list-18: var(--x-size-base-18);
  --x-size-gap-list-19: var(--x-size-base-19);
  --x-size-gap-list-20: var(--x-size-base-20);
}

.x-list--gap-01.x-list {
  gap: var(--x-size-gap-list-01);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-01.x-list:not(.x-list--horizontal), .x-list--gap-01.x-list.x-list--vertical {
    gap: 0;
  }
  .x-list--gap-01.x-list:not(.x-list--horizontal) > *:not(:last-child), .x-list--gap-01.x-list.x-list--vertical > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-01);
  }
  .x-list--gap-01.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-01.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-01);
  }
  .x-list--gap-01.x-list.x-list--wrap {
    gap: 0;
  }
  .x-list--gap-01.x-list.x-list--wrap > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-01);
    margin-bottom: var(--x-size-gap-list-01);
  }
}

.x-list--gap-02.x-list {
  gap: var(--x-size-gap-list-02);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-02.x-list:not(.x-list--horizontal), .x-list--gap-02.x-list.x-list--vertical {
    gap: 0;
  }
  .x-list--gap-02.x-list:not(.x-list--horizontal) > *:not(:last-child), .x-list--gap-02.x-list.x-list--vertical > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-02);
  }
  .x-list--gap-02.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-02.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-02);
  }
  .x-list--gap-02.x-list.x-list--wrap {
    gap: 0;
  }
  .x-list--gap-02.x-list.x-list--wrap > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-02);
    margin-bottom: var(--x-size-gap-list-02);
  }
}

.x-list--gap-03.x-list {
  gap: var(--x-size-gap-list-03);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-03.x-list:not(.x-list--horizontal), .x-list--gap-03.x-list.x-list--vertical {
    gap: 0;
  }
  .x-list--gap-03.x-list:not(.x-list--horizontal) > *:not(:last-child), .x-list--gap-03.x-list.x-list--vertical > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-03);
  }
  .x-list--gap-03.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-03.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-03);
  }
  .x-list--gap-03.x-list.x-list--wrap {
    gap: 0;
  }
  .x-list--gap-03.x-list.x-list--wrap > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-03);
    margin-bottom: var(--x-size-gap-list-03);
  }
}

.x-list--gap-04.x-list {
  gap: var(--x-size-gap-list-04);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-04.x-list:not(.x-list--horizontal), .x-list--gap-04.x-list.x-list--vertical {
    gap: 0;
  }
  .x-list--gap-04.x-list:not(.x-list--horizontal) > *:not(:last-child), .x-list--gap-04.x-list.x-list--vertical > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-04);
  }
  .x-list--gap-04.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-04.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-04);
  }
  .x-list--gap-04.x-list.x-list--wrap {
    gap: 0;
  }
  .x-list--gap-04.x-list.x-list--wrap > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-04);
    margin-bottom: var(--x-size-gap-list-04);
  }
}

.x-list--gap-05.x-list {
  gap: var(--x-size-gap-list-05);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-05.x-list:not(.x-list--horizontal), .x-list--gap-05.x-list.x-list--vertical {
    gap: 0;
  }
  .x-list--gap-05.x-list:not(.x-list--horizontal) > *:not(:last-child), .x-list--gap-05.x-list.x-list--vertical > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-05);
  }
  .x-list--gap-05.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-05.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-05);
  }
  .x-list--gap-05.x-list.x-list--wrap {
    gap: 0;
  }
  .x-list--gap-05.x-list.x-list--wrap > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-05);
    margin-bottom: var(--x-size-gap-list-05);
  }
}

.x-list--gap-06.x-list {
  gap: var(--x-size-gap-list-06);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-06.x-list:not(.x-list--horizontal), .x-list--gap-06.x-list.x-list--vertical {
    gap: 0;
  }
  .x-list--gap-06.x-list:not(.x-list--horizontal) > *:not(:last-child), .x-list--gap-06.x-list.x-list--vertical > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-06);
  }
  .x-list--gap-06.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-06.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-06);
  }
  .x-list--gap-06.x-list.x-list--wrap {
    gap: 0;
  }
  .x-list--gap-06.x-list.x-list--wrap > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-06);
    margin-bottom: var(--x-size-gap-list-06);
  }
}

.x-list--gap-07.x-list {
  gap: var(--x-size-gap-list-07);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-07.x-list:not(.x-list--horizontal), .x-list--gap-07.x-list.x-list--vertical {
    gap: 0;
  }
  .x-list--gap-07.x-list:not(.x-list--horizontal) > *:not(:last-child), .x-list--gap-07.x-list.x-list--vertical > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-07);
  }
  .x-list--gap-07.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-07.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-07);
  }
  .x-list--gap-07.x-list.x-list--wrap {
    gap: 0;
  }
  .x-list--gap-07.x-list.x-list--wrap > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-07);
    margin-bottom: var(--x-size-gap-list-07);
  }
}

.x-list--gap-08.x-list {
  gap: var(--x-size-gap-list-08);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-08.x-list:not(.x-list--horizontal), .x-list--gap-08.x-list.x-list--vertical {
    gap: 0;
  }
  .x-list--gap-08.x-list:not(.x-list--horizontal) > *:not(:last-child), .x-list--gap-08.x-list.x-list--vertical > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-08);
  }
  .x-list--gap-08.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-08.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-08);
  }
  .x-list--gap-08.x-list.x-list--wrap {
    gap: 0;
  }
  .x-list--gap-08.x-list.x-list--wrap > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-08);
    margin-bottom: var(--x-size-gap-list-08);
  }
}

.x-list--gap-09.x-list {
  gap: var(--x-size-gap-list-09);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-09.x-list:not(.x-list--horizontal), .x-list--gap-09.x-list.x-list--vertical {
    gap: 0;
  }
  .x-list--gap-09.x-list:not(.x-list--horizontal) > *:not(:last-child), .x-list--gap-09.x-list.x-list--vertical > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-09);
  }
  .x-list--gap-09.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-09.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-09);
  }
  .x-list--gap-09.x-list.x-list--wrap {
    gap: 0;
  }
  .x-list--gap-09.x-list.x-list--wrap > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-09);
    margin-bottom: var(--x-size-gap-list-09);
  }
}

.x-list--gap-10.x-list {
  gap: var(--x-size-gap-list-10);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-10.x-list:not(.x-list--horizontal), .x-list--gap-10.x-list.x-list--vertical {
    gap: 0;
  }
  .x-list--gap-10.x-list:not(.x-list--horizontal) > *:not(:last-child), .x-list--gap-10.x-list.x-list--vertical > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-10);
  }
  .x-list--gap-10.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-10.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-10);
  }
  .x-list--gap-10.x-list.x-list--wrap {
    gap: 0;
  }
  .x-list--gap-10.x-list.x-list--wrap > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-10);
    margin-bottom: var(--x-size-gap-list-10);
  }
}

.x-list--gap-11.x-list {
  gap: var(--x-size-gap-list-11);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-11.x-list:not(.x-list--horizontal), .x-list--gap-11.x-list.x-list--vertical {
    gap: 0;
  }
  .x-list--gap-11.x-list:not(.x-list--horizontal) > *:not(:last-child), .x-list--gap-11.x-list.x-list--vertical > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-11);
  }
  .x-list--gap-11.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-11.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-11);
  }
  .x-list--gap-11.x-list.x-list--wrap {
    gap: 0;
  }
  .x-list--gap-11.x-list.x-list--wrap > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-11);
    margin-bottom: var(--x-size-gap-list-11);
  }
}

.x-list--gap-12.x-list {
  gap: var(--x-size-gap-list-12);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-12.x-list:not(.x-list--horizontal), .x-list--gap-12.x-list.x-list--vertical {
    gap: 0;
  }
  .x-list--gap-12.x-list:not(.x-list--horizontal) > *:not(:last-child), .x-list--gap-12.x-list.x-list--vertical > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-12);
  }
  .x-list--gap-12.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-12.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-12);
  }
  .x-list--gap-12.x-list.x-list--wrap {
    gap: 0;
  }
  .x-list--gap-12.x-list.x-list--wrap > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-12);
    margin-bottom: var(--x-size-gap-list-12);
  }
}

.x-list--gap-13.x-list {
  gap: var(--x-size-gap-list-13);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-13.x-list:not(.x-list--horizontal), .x-list--gap-13.x-list.x-list--vertical {
    gap: 0;
  }
  .x-list--gap-13.x-list:not(.x-list--horizontal) > *:not(:last-child), .x-list--gap-13.x-list.x-list--vertical > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-13);
  }
  .x-list--gap-13.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-13.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-13);
  }
  .x-list--gap-13.x-list.x-list--wrap {
    gap: 0;
  }
  .x-list--gap-13.x-list.x-list--wrap > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-13);
    margin-bottom: var(--x-size-gap-list-13);
  }
}

.x-list--gap-14.x-list {
  gap: var(--x-size-gap-list-14);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-14.x-list:not(.x-list--horizontal), .x-list--gap-14.x-list.x-list--vertical {
    gap: 0;
  }
  .x-list--gap-14.x-list:not(.x-list--horizontal) > *:not(:last-child), .x-list--gap-14.x-list.x-list--vertical > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-14);
  }
  .x-list--gap-14.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-14.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-14);
  }
  .x-list--gap-14.x-list.x-list--wrap {
    gap: 0;
  }
  .x-list--gap-14.x-list.x-list--wrap > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-14);
    margin-bottom: var(--x-size-gap-list-14);
  }
}

.x-list--gap-15.x-list {
  gap: var(--x-size-gap-list-15);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-15.x-list:not(.x-list--horizontal), .x-list--gap-15.x-list.x-list--vertical {
    gap: 0;
  }
  .x-list--gap-15.x-list:not(.x-list--horizontal) > *:not(:last-child), .x-list--gap-15.x-list.x-list--vertical > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-15);
  }
  .x-list--gap-15.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-15.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-15);
  }
  .x-list--gap-15.x-list.x-list--wrap {
    gap: 0;
  }
  .x-list--gap-15.x-list.x-list--wrap > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-15);
    margin-bottom: var(--x-size-gap-list-15);
  }
}

.x-list--gap-16.x-list {
  gap: var(--x-size-gap-list-16);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-16.x-list:not(.x-list--horizontal), .x-list--gap-16.x-list.x-list--vertical {
    gap: 0;
  }
  .x-list--gap-16.x-list:not(.x-list--horizontal) > *:not(:last-child), .x-list--gap-16.x-list.x-list--vertical > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-16);
  }
  .x-list--gap-16.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-16.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-16);
  }
  .x-list--gap-16.x-list.x-list--wrap {
    gap: 0;
  }
  .x-list--gap-16.x-list.x-list--wrap > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-16);
    margin-bottom: var(--x-size-gap-list-16);
  }
}

.x-list--gap-17.x-list {
  gap: var(--x-size-gap-list-17);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-17.x-list:not(.x-list--horizontal), .x-list--gap-17.x-list.x-list--vertical {
    gap: 0;
  }
  .x-list--gap-17.x-list:not(.x-list--horizontal) > *:not(:last-child), .x-list--gap-17.x-list.x-list--vertical > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-17);
  }
  .x-list--gap-17.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-17.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-17);
  }
  .x-list--gap-17.x-list.x-list--wrap {
    gap: 0;
  }
  .x-list--gap-17.x-list.x-list--wrap > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-17);
    margin-bottom: var(--x-size-gap-list-17);
  }
}

.x-list--gap-18.x-list {
  gap: var(--x-size-gap-list-18);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-18.x-list:not(.x-list--horizontal), .x-list--gap-18.x-list.x-list--vertical {
    gap: 0;
  }
  .x-list--gap-18.x-list:not(.x-list--horizontal) > *:not(:last-child), .x-list--gap-18.x-list.x-list--vertical > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-18);
  }
  .x-list--gap-18.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-18.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-18);
  }
  .x-list--gap-18.x-list.x-list--wrap {
    gap: 0;
  }
  .x-list--gap-18.x-list.x-list--wrap > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-18);
    margin-bottom: var(--x-size-gap-list-18);
  }
}

.x-list--gap-19.x-list {
  gap: var(--x-size-gap-list-19);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-19.x-list:not(.x-list--horizontal), .x-list--gap-19.x-list.x-list--vertical {
    gap: 0;
  }
  .x-list--gap-19.x-list:not(.x-list--horizontal) > *:not(:last-child), .x-list--gap-19.x-list.x-list--vertical > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-19);
  }
  .x-list--gap-19.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-19.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-19);
  }
  .x-list--gap-19.x-list.x-list--wrap {
    gap: 0;
  }
  .x-list--gap-19.x-list.x-list--wrap > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-19);
    margin-bottom: var(--x-size-gap-list-19);
  }
}

.x-list--gap-20.x-list {
  gap: var(--x-size-gap-list-20);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list--gap-20.x-list:not(.x-list--horizontal), .x-list--gap-20.x-list.x-list--vertical {
    gap: 0;
  }
  .x-list--gap-20.x-list:not(.x-list--horizontal) > *:not(:last-child), .x-list--gap-20.x-list.x-list--vertical > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list-20);
  }
  .x-list--gap-20.x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list--gap-20.x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-20);
  }
  .x-list--gap-20.x-list.x-list--wrap {
    gap: 0;
  }
  .x-list--gap-20.x-list.x-list--wrap > *:not(:last-child) {
    margin-right: var(--x-size-gap-list-20);
    margin-bottom: var(--x-size-gap-list-20);
  }
}
:root {
  --x-size-gap-list-01: var(--x-size-base-01);
  --x-size-gap-list-02: var(--x-size-base-02);
  --x-size-gap-list-03: var(--x-size-base-03);
  --x-size-gap-list-04: var(--x-size-base-04);
  --x-size-gap-list-05: var(--x-size-base-05);
  --x-size-gap-list-06: var(--x-size-base-06);
  --x-size-gap-list-07: var(--x-size-base-07);
  --x-size-gap-list-08: var(--x-size-base-08);
  --x-size-gap-list-09: var(--x-size-base-09);
  --x-size-gap-list-10: var(--x-size-base-10);
  --x-size-gap-list-11: var(--x-size-base-11);
  --x-size-gap-list-12: var(--x-size-base-12);
  --x-size-gap-list-13: var(--x-size-base-13);
  --x-size-gap-list-14: var(--x-size-base-14);
  --x-size-gap-list-15: var(--x-size-base-15);
  --x-size-gap-list-16: var(--x-size-base-16);
  --x-size-gap-list-17: var(--x-size-base-17);
  --x-size-gap-list-18: var(--x-size-base-18);
  --x-size-gap-list-19: var(--x-size-base-19);
  --x-size-gap-list-20: var(--x-size-base-20);
}
:root {
  --x-string-flow-list: column nowrap;
  --x-size-padding-list: 0;
  --x-size-gap-list: 0;
  --x-size-justify-list: stretch;
  --x-size-align-list: stretch;
  --x-size-align-list-stretch: stretch;
}
:root {
  --x-string-flow-list: column nowrap;
  --x-size-padding-list: 0;
  --x-size-gap-list: 0;
  --x-size-justify-list: stretch;
  --x-size-align-list: stretch;
  --x-size-align-list-stretch: stretch;
}

.x-list {
  display: flex;
  flex-flow: var(--x-string-flow-list);
  list-style: none;
  gap: var(--x-size-gap-list);
  margin: 0;
  padding: var(--x-size-padding-list);
  justify-content: var(--x-size-justify-list);
  align-items: var(--x-size-align-list);
  min-width: 0;
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-list:not(.x-list--horizontal), .x-list.x-list--vertical {
    gap: 0;
  }
  .x-list:not(.x-list--horizontal) > *:not(:last-child), .x-list.x-list--vertical > *:not(:last-child) {
    margin-bottom: var(--x-size-gap-list);
  }
  .x-list.x-list--horizontal {
    gap: 0;
  }
  .x-list.x-list--horizontal > *:not(:last-child) {
    margin-right: var(--x-size-gap-list);
  }
  .x-list.x-list--wrap, .x-list.x-list--wrap-reverse {
    gap: 0;
  }
  .x-list.x-list--wrap > *:not(:last-child), .x-list.x-list--wrap-reverse > *:not(:last-child) {
    margin-right: var(--x-size-gap-list);
    margin-bottom: var(--x-size-gap-list);
  }
}

.x-list--vertical.x-list {
  flex-flow: column nowrap;
}

.x-list--horizontal.x-list {
  flex-flow: row nowrap;
}

.x-list--wrap.x-list {
  flex-flow: row wrap;
}

.x-list--wrap-reverse.x-list {
  flex-flow: row wrap-reverse;
}

.x-list--justify-stretch.x-list {
  justify-content: stretch;
}

.x-list--justify-center.x-list {
  justify-content: center;
}

.x-list--justify-end.x-list {
  justify-content: flex-end;
}

.x-list--justify-start.x-list {
  justify-content: flex-start;
}

.x-list--align-stretch.x-list {
  align-items: stretch;
}

.x-list--align-center.x-list {
  align-items: center;
}

.x-list--align-baseline.x-list {
  align-items: baseline;
}

.x-list--align-end.x-list {
  align-items: flex-end;
}

.x-list--align-start.x-list {
  align-items: flex-start;
}

.x-list > .x-list__item--expand {
  flex: 1 1 auto;
}
.x-list > .x-list__item--no-expand {
  flex: 0 0 auto;
}
.x-list.x-list--horizontal > .x-list__item--expand {
  min-width: 0;
}
.x-list:not(.x-list--horizontal) > .x-list__item--expand {
  min-height: 0;
}
.x-list > .x-list__item--stretch {
  align-self: stretch;
}
.x-list > .x-list__item--flex-none {
  flex: none;
}
.x-list > .x-list__item--01 {
  flex: 1 12 auto;
}
.x-list > .x-list__item--02 {
  flex: 2 11 auto;
}
.x-list > .x-list__item--03 {
  flex: 3 10 auto;
}
.x-list > .x-list__item--04 {
  flex: 4 9 auto;
}
.x-list > .x-list__item--05 {
  flex: 5 8 auto;
}
.x-list > .x-list__item--06 {
  flex: 6 7 auto;
}
.x-list > .x-list__item--07 {
  flex: 7 6 auto;
}
.x-list > .x-list__item--08 {
  flex: 8 5 auto;
}
.x-list > .x-list__item--09 {
  flex: 9 4 auto;
}
.x-list > .x-list__item--10 {
  flex: 10 3 auto;
}
.x-list > .x-list__item--11 {
  flex: 11 2 auto;
}
.x-list > .x-list__item--12 {
  flex: 12 1 auto;
}
:root {
  --x-size-border-radius-input-group-pill: var(--x-size-border-radius-base-pill);
  --x-size-border-radius-top-left-input-group-pill: var(--x-size-border-radius-input-group-pill);
  --x-size-border-radius-top-right-input-group-pill: var(--x-size-border-radius-input-group-pill);
  --x-size-border-radius-bottom-right-input-group-pill: var(
    --x-size-border-radius-input-group-pill
  );
  --x-size-border-radius-bottom-left-input-group-pill: var(--x-size-border-radius-input-group-pill);
}
:root {
  --x-size-border-radius-input-group-pill: var(--x-size-border-radius-base-pill);
  --x-size-border-radius-top-left-input-group-pill: var(--x-size-border-radius-input-group-pill);
  --x-size-border-radius-top-right-input-group-pill: var(--x-size-border-radius-input-group-pill);
  --x-size-border-radius-bottom-right-input-group-pill: var(
    --x-size-border-radius-input-group-pill
  );
  --x-size-border-radius-bottom-left-input-group-pill: var(--x-size-border-radius-input-group-pill);
}

.x-input-group--pill.x-input-group,
.x-input-group--pill .x-input-group {
  --x-size-border-radius-input-group-default: var(--x-size-border-radius-input-group-pill);
  --x-size-border-radius-top-left-input-group-default: var(
    --x-size-border-radius-top-left-input-group-pill
  );
  --x-size-border-radius-top-right-input-group-default: var(
    --x-size-border-radius-top-right-input-group-pill
  );
  --x-size-border-radius-bottom-right-input-group-default: var(
    --x-size-border-radius-bottom-right-input-group-pill
  );
  --x-size-border-radius-bottom-left-input-group-default: var(
    --x-size-border-radius-bottom-left-input-group-pill
  );
}
:root {
  --x-size-padding-left-input-group-line: 0;
  --x-size-padding-right-input-group-line: 0;
  --x-size-border-width-input-group-line: var(--x-size-border-width-input-group-default);
  --x-size-border-width-top-input-group-line: 0;
  --x-size-border-width-right-input-group-line: 0;
  --x-size-border-width-bottom-input-group-line: var(--x-size-border-width-input-group-line);
  --x-size-border-width-left-input-group-line: 0;
}
:root {
  --x-size-padding-left-input-group-line: 0;
  --x-size-padding-right-input-group-line: 0;
  --x-size-border-width-input-group-line: var(--x-size-border-width-input-group-default);
  --x-size-border-width-top-input-group-line: 0;
  --x-size-border-width-right-input-group-line: 0;
  --x-size-border-width-bottom-input-group-line: var(--x-size-border-width-input-group-line);
  --x-size-border-width-left-input-group-line: 0;
}

.x-input-group--line .x-input-group,
.x-input-group--line.x-input-group {
  --x-size-border-width-top-input-group-default: var(--x-size-border-width-top-input-group-line);
  --x-size-border-width-right-input-group-default: var(
    --x-size-border-width-right-input-group-line
  );
  --x-size-border-width-bottom-input-group-default: var(
    --x-size-border-width-bottom-input-group-line
  );
  --x-size-border-width-left-input-group-default: var(--x-size-border-width-left-input-group-line);
}
.x-input-group--line .x-input-group > *:not(.x-input-group__action),
.x-input-group--line.x-input-group > *:not(.x-input-group__action) {
  --x-size-padding-right-input-group-default: var(--x-size-padding-right-input-group-line);
  --x-size-padding-left-input-group-default: var(--x-size-padding-left-input-group-line);
}
[dir="ltr"] .x-input-group--line .x-input-group > .x-input-group__action,[dir="ltr"] 
.x-input-group--line.x-input-group > .x-input-group__action {
  margin-right: calc(var(--x-size-border-width-right-input-group-line) * -1) !important;
}
[dir="rtl"] .x-input-group--line .x-input-group > .x-input-group__action,[dir="rtl"] 
.x-input-group--line.x-input-group > .x-input-group__action {
  margin-left: calc(var(--x-size-border-width-right-input-group-line) * -1) !important;
}
[dir="ltr"] .x-input-group--line .x-input-group > .x-input-group__action,[dir="ltr"] 
.x-input-group--line.x-input-group > .x-input-group__action {
  margin-left: calc(var(--x-size-border-width-inline-input-group-line) * -1) !important;
}
[dir="rtl"] .x-input-group--line .x-input-group > .x-input-group__action,[dir="rtl"] 
.x-input-group--line.x-input-group > .x-input-group__action {
  margin-right: calc(var(--x-size-border-width-inline-input-group-line) * -1) !important;
}
.x-input-group--line .x-input-group > .x-input-group__action,
.x-input-group--line.x-input-group > .x-input-group__action {
  margin-top: calc(var(--x-size-border-width-top-input-group-line) * -1) !important;
  margin-bottom: calc(var(--x-size-border-width-bottom-input-group-line) * -1) !important;
}
:root {
  --x-color-background-input-group-default: var(--x-color-background-input-default);
  --x-color-border-input-group-default: var(--x-color-border-input-default);
  --x-color-border-input-group-default-focus: var(--x-color-border-input-default-focus);
  --x-color-text-input-group-default: var(--x-color-text-input-default);
  --x-color-text-input-group-placeholder-default: var(--x-color-text-input-placeholder-default);
  --x-size-height-input-group-default: var(--x-size-height-input-default);
  --x-size-gap-input-group-default: var(--x-size-base-03);
  --x-size-padding-left-input-group-default: var(--x-size-base-06);
  --x-size-padding-right-input-group-default: var(--x-size-padding-left-input-group-default);
  --x-size-padding-input-group-default-action: var(--x-size-base-03);
  --x-size-border-width-input-group-default: var(--x-size-border-width-input-default);
  --x-size-border-width-top-input-group-default: var(--x-size-border-width-input-group-default);
  --x-size-border-width-right-input-group-default: var(--x-size-border-width-input-group-default);
  --x-size-border-width-bottom-input-group-default: var(--x-size-border-width-input-group-default);
  --x-size-border-width-left-input-group-default: var(--x-size-border-width-input-group-default);
  --x-size-border-radius-input-group-default: var(--x-size-border-radius-input-default);
  --x-size-border-radius-top-left-input-group-default: var(
    --x-size-border-radius-input-group-default
  );
  --x-size-border-radius-top-right-input-group-default: var(
    --x-size-border-radius-input-group-default
  );
  --x-size-border-radius-bottom-right-input-group-default: var(
    --x-size-border-radius-input-group-default
  );
  --x-size-border-radius-bottom-left-input-group-default: var(
    --x-size-border-radius-input-group-default
  );
  --x-font-family-input-group-default: var(--x-font-family-input-default);
  --x-size-font-input-group-default: var(--x-size-font-input-default);
  --x-size-line-height-input-group-default: var(--x-size-line-height-input-default);
  --x-number-font-weight-input-group-default: var(--x-number-font-weight-input-default);
  --x-font-family-input-group-placeholder-default: var(--x-font-family-input-group-default);
  --x-size-font-input-group-placeholder-default: var(--x-size-font-input-group-default);
  --x-size-line-height-input-group-placeholder-default: var(
    --x-size-line-height-input-group-default
  );
  --x-number-font-weight-input-group-placeholder-default: var(
    --x-number-font-weight-input-group-default
  );
  --x-number-font-weight-input-group-default-button: var(--x-number-font-weight-base-light);
}
:root {
  --x-color-background-input-group-default: var(--x-color-background-input-default);
  --x-color-border-input-group-default: var(--x-color-border-input-default);
  --x-color-border-input-group-default-focus: var(--x-color-border-input-default-focus);
  --x-color-text-input-group-default: var(--x-color-text-input-default);
  --x-color-text-input-group-placeholder-default: var(--x-color-text-input-placeholder-default);
  --x-size-height-input-group-default: var(--x-size-height-input-default);
  --x-size-gap-input-group-default: var(--x-size-base-03);
  --x-size-padding-left-input-group-default: var(--x-size-base-06);
  --x-size-padding-right-input-group-default: var(--x-size-padding-left-input-group-default);
  --x-size-padding-input-group-default-action: var(--x-size-base-03);
  --x-size-border-width-input-group-default: var(--x-size-border-width-input-default);
  --x-size-border-width-top-input-group-default: var(--x-size-border-width-input-group-default);
  --x-size-border-width-right-input-group-default: var(--x-size-border-width-input-group-default);
  --x-size-border-width-bottom-input-group-default: var(--x-size-border-width-input-group-default);
  --x-size-border-width-left-input-group-default: var(--x-size-border-width-input-group-default);
  --x-size-border-radius-input-group-default: var(--x-size-border-radius-input-default);
  --x-size-border-radius-top-left-input-group-default: var(
    --x-size-border-radius-input-group-default
  );
  --x-size-border-radius-top-right-input-group-default: var(
    --x-size-border-radius-input-group-default
  );
  --x-size-border-radius-bottom-right-input-group-default: var(
    --x-size-border-radius-input-group-default
  );
  --x-size-border-radius-bottom-left-input-group-default: var(
    --x-size-border-radius-input-group-default
  );
  --x-font-family-input-group-default: var(--x-font-family-input-default);
  --x-size-font-input-group-default: var(--x-size-font-input-default);
  --x-size-line-height-input-group-default: var(--x-size-line-height-input-default);
  --x-number-font-weight-input-group-default: var(--x-number-font-weight-input-default);
  --x-font-family-input-group-placeholder-default: var(--x-font-family-input-group-default);
  --x-size-font-input-group-placeholder-default: var(--x-size-font-input-group-default);
  --x-size-line-height-input-group-placeholder-default: var(
    --x-size-line-height-input-group-default
  );
  --x-number-font-weight-input-group-placeholder-default: var(
    --x-number-font-weight-input-group-default
  );
  --x-number-font-weight-input-group-default-button: var(--x-number-font-weight-base-light);
}

[dir="ltr"] .x-input-group {
  border-right-width: var(--x-size-border-width-right-input-group-default);
}

[dir="rtl"] .x-input-group {
  border-left-width: var(--x-size-border-width-right-input-group-default);
}

[dir="ltr"] .x-input-group {
  border-left-width: var(--x-size-border-width-left-input-group-default);
}

[dir="rtl"] .x-input-group {
  border-right-width: var(--x-size-border-width-left-input-group-default);
}

.x-input-group {
  display: flex;
  flex-flow: row nowrap;
  align-content: center;
  align-items: center;
  box-sizing: border-box;
  min-width: 0;
  gap: var(--x-size-gap-input-group-default);
  height: var(--x-size-height-input-group-default);
  background-color: var(--x-color-background-input-group-default);
  border-color: var(--x-color-border-input-group-default);
  color: var(--x-color-text-input-group-default);
  border-top-width: var(--x-size-border-width-top-input-group-default);
  border-bottom-width: var(--x-size-border-width-bottom-input-group-default);
  border-radius: var(--x-size-border-radius-top-left-input-group-default) var(--x-size-border-radius-top-right-input-group-default) var(--x-size-border-radius-bottom-right-input-group-default) var(--x-size-border-radius-bottom-left-input-group-default);
  border-style: solid;
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-input-group {
    gap: 0;
  }
  .x-input-group > *:not(:last-child) {
    margin-right: var(--x-size-gap-input-group-default);
  }
}
.x-input-group:focus-within {
  border-color: var(--x-color-border-input-group-default-focus);
}
.x-input-group > *,
.x-input-group > .x-input,
.x-input-group > .x-button {
  flex: 0 0 auto;
  font-family: var(--x-font-family-input-group-default);
  font-size: var(--x-size-font-input-group-default);
  font-weight: var(--x-number-font-weight-input-group-default);
  line-height: var(--x-size-line-height-input-group-default);
}
[dir="ltr"] .x-input-group > *:not(.x-input-group__action) {
  padding-left: 0;
}
[dir="rtl"] .x-input-group > *:not(.x-input-group__action) {
  padding-right: 0;
}
[dir="ltr"] .x-input-group > *:not(.x-input-group__action) {
  padding-right: 0;
}
[dir="rtl"] .x-input-group > *:not(.x-input-group__action) {
  padding-left: 0;
}
.x-input-group > *:not(.x-input-group__action) {
  background-color: transparent;
  color: var(--x-color-text-input-group-default);
  border: none;
}
[dir="ltr"] .x-input-group > *:not(.x-input-group__action):first-child {
  padding-left: var(--x-size-padding-left-input-group-default);
}
[dir="rtl"] .x-input-group > *:not(.x-input-group__action):first-child {
  padding-right: var(--x-size-padding-left-input-group-default);
}
[dir="ltr"] .x-input-group > *:not(.x-input-group__action):last-child {
  padding-right: var(--x-size-padding-right-input-group-default);
}
[dir="rtl"] .x-input-group > *:not(.x-input-group__action):last-child {
  padding-left: var(--x-size-padding-right-input-group-default);
}
.x-input-group > .x-input {
  flex: 1 1 100%;
  min-width: 0;
  border: none;
}
.x-input-group > .x-input > .x-input-placeholder, .x-input-group > .x-input::placeholder {
  color: var(--x-color-text-input-group-placeholder-default);
  font-family: var(--x-font-family-input-group-placeholder-default);
  font-size: var(--x-size-font-input-group-placeholder-default);
  font-weight: var(--x-number-font-weight-input-group-placeholder-default);
  line-height: var(--x-size-line-height-input-group-placeholder-default);
}
.x-input-group > .x-button {
  height: var(--x-size-height-input-group-default);
  min-height: var(--x-size-height-input-group-default);
  margin-top: calc(var(--x-size-border-width-top-input-group-default) * -1);
  margin-bottom: calc(var(--x-size-border-width-bottom-input-group-default) * -1);
}
.x-input-group > .x-button:not(.x-input-group__action) {
  font-weight: var(--x-number-font-weight-input-group-default-button);
}
[dir="ltr"] .x-input-group > .x-button:not(.x-input-group__action):first-child {
  margin-right: 0;
}
[dir="rtl"] .x-input-group > .x-button:not(.x-input-group__action):first-child {
  margin-left: 0;
}
[dir="ltr"] .x-input-group > .x-button:not(.x-input-group__action):last-child {
  margin-left: 0;
}
[dir="rtl"] .x-input-group > .x-button:not(.x-input-group__action):last-child {
  margin-right: 0;
}
.x-input-group > .x-input-group__action {
  box-sizing: border-box;
  padding: 0 calc(var(--x-size-padding-input-group-default-action) - 1px);
  min-width: var(--x-size-height-input-group-default);
  border-radius: var(--x-size-border-radius-top-left-input-group-default) var(--x-size-border-radius-top-right-input-group-default) var(--x-size-border-radius-bottom-right-input-group-default) var(--x-size-border-radius-bottom-left-input-group-default);
}
[dir="ltr"] .x-input-group > .x-input-group__action:first-child {
  margin-left: calc(var(--x-size-border-width-left-input-group-default) * -1);
}
[dir="rtl"] .x-input-group > .x-input-group__action:first-child {
  margin-right: calc(var(--x-size-border-width-left-input-group-default) * -1);
}
[dir="ltr"] .x-input-group > .x-input-group__action:last-child {
  margin-right: calc(var(--x-size-border-width-right-input-group-default) * -1);
}
[dir="rtl"] .x-input-group > .x-input-group__action:last-child {
  margin-left: calc(var(--x-size-border-width-right-input-group-default) * -1);
}
:root {
  --x-size-border-radius-input-group-card: var(--x-size-border-radius-base-s);
  --x-size-border-radius-top-left-input-group-card: var(--x-size-border-radius-input-group-card);
  --x-size-border-radius-top-right-input-group-card: var(--x-size-border-radius-input-group-card);
  --x-size-border-radius-bottom-right-input-group-card: var(
    --x-size-border-radius-input-group-card
  );
  --x-size-border-radius-bottom-left-input-group-card: var(--x-size-border-radius-input-group-card);
}
:root {
  --x-size-border-radius-input-group-card: var(--x-size-border-radius-base-s);
  --x-size-border-radius-top-left-input-group-card: var(--x-size-border-radius-input-group-card);
  --x-size-border-radius-top-right-input-group-card: var(--x-size-border-radius-input-group-card);
  --x-size-border-radius-bottom-right-input-group-card: var(
    --x-size-border-radius-input-group-card
  );
  --x-size-border-radius-bottom-left-input-group-card: var(--x-size-border-radius-input-group-card);
}

.x-input-group--card.x-input-group,
.x-input-group--card .x-input-group {
  --x-size-border-radius-input-group-default: var(--x-size-border-radius-input-group-card);
  --x-size-border-radius-top-left-input-group-default: var(
    --x-size-border-radius-top-left-input-group-card
  );
  --x-size-border-radius-top-right-input-group-default: var(
    --x-size-border-radius-top-right-input-group-card
  );
  --x-size-border-radius-bottom-right-input-group-default: var(
    --x-size-border-radius-bottom-right-input-group-card
  );
  --x-size-border-radius-bottom-left-input-group-default: var(
    --x-size-border-radius-bottom-left-input-group-card
  );
}
.x-input-group--card.x-input-group__action:first-child,
.x-input-group--card .x-input-group__action:first-child {
  --x-size-border-radius-top-right-input-group-default: 0;
  --x-size-border-radius-bottom-right-input-group-default: 0;
}
.x-input-group--card.x-input-group__action:last-child,
.x-input-group--card .x-input-group__action:last-child {
  --x-size-border-radius-top-left-input-group-default: 0;
  --x-size-border-radius-bottom-left-input-group-default: 0;
}
:root {
  --x-size-border-radius-input-pill: var(--x-size-border-radius-base-pill);
  --x-size-border-radius-top-left-input-pill: var(--x-size-border-radius-input-pill);
  --x-size-border-radius-top-right-input-pill: var(--x-size-border-radius-input-pill);
  --x-size-border-radius-bottom-right-input-pill: var(--x-size-border-radius-input-pill);
  --x-size-border-radius-bottom-left-input-pill: var(--x-size-border-radius-input-pill);
}
:root {
  --x-size-border-radius-input-pill: var(--x-size-border-radius-base-pill);
  --x-size-border-radius-top-left-input-pill: var(--x-size-border-radius-input-pill);
  --x-size-border-radius-top-right-input-pill: var(--x-size-border-radius-input-pill);
  --x-size-border-radius-bottom-right-input-pill: var(--x-size-border-radius-input-pill);
  --x-size-border-radius-bottom-left-input-pill: var(--x-size-border-radius-input-pill);
}

.x-input--pill.x-input,
.x-input--pill .x-input {
  --x-size-border-radius-input-default: var(--x-size-border-radius-input-pill);
  --x-size-border-radius-top-left-input-default: var(--x-size-border-radius-input-pill);
  --x-size-border-radius-top-right-input-default: var(--x-size-border-radius-input-pill);
  --x-size-border-radius-bottom-right-input-default: var(--x-size-border-radius-input-pill);
  --x-size-border-radius-bottom-left-input-default: var(--x-size-border-radius-input-pill);
}
:root {
  --x-size-padding-top-input-line: var(--x-size-base-03);
  --x-size-padding-right-input-line: 0;
  --x-size-padding-bottom-input-line: var(--x-size-base-03);
  --x-size-padding-left-input-line: 0;
  --x-size-border-width-top-input-line: 0;
  --x-size-border-width-right-input-line: 0;
  --x-size-border-width-bottom-input-line: var(--x-size-border-width-base);
  --x-size-border-width-left-input-line: 0;
}
:root {
  --x-size-padding-top-input-line: var(--x-size-base-03);
  --x-size-padding-right-input-line: 0;
  --x-size-padding-bottom-input-line: var(--x-size-base-03);
  --x-size-padding-left-input-line: 0;
  --x-size-border-width-top-input-line: 0;
  --x-size-border-width-right-input-line: 0;
  --x-size-border-width-bottom-input-line: var(--x-size-border-width-base);
  --x-size-border-width-left-input-line: 0;
}

.x-input--line .x-input,
.x-input--line.x-input {
  --x-size-padding-top-input-default: var(--x-size-padding-top-input-line);
  --x-size-padding-right-input-default: var(--x-size-padding-right-input-line);
  --x-size-padding-bottom-input-default: var(--x-size-padding-bottom-input-line);
  --x-size-padding-left-input-default: var(--x-size-padding-left-input-line);
  --x-size-border-width-top-input-default: var(--x-size-border-width-top-input-line);
  --x-size-border-width-right-input-default: var(--x-size-border-width-right-input-line);
  --x-size-border-width-bottom-input-default: var(--x-size-border-width-bottom-input-line);
  --x-size-border-width-left-input-default: var(--x-size-border-width-left-input-line);
}
:root {
  --x-color-background-input-default: var(--x-color-base-neutral-100);
  --x-color-border-input-default: var(--x-color-base-neutral-70);
  --x-color-border-input-default-focus: var(--x-color-base-lead);
  --x-color-text-input-default: var(--x-color-text-default);
  --x-color-text-input-placeholder-default: var(--x-color-base-neutral-35);
  --x-size-border-width-input-default: var(--x-size-border-width-base);
  --x-size-border-width-top-input-default: var(--x-size-border-width-input-default);
  --x-size-border-width-right-input-default: var(--x-size-border-width-input-default);
  --x-size-border-width-bottom-input-default: var(--x-size-border-width-input-default);
  --x-size-border-width-left-input-default: var(--x-size-border-width-input-default);
  --x-size-border-radius-input-default: var(--x-size-border-radius-base-none);
  --x-size-border-radius-top-left-input-default: var(--x-size-border-radius-input-default);
  --x-size-border-radius-top-right-input-default: var(--x-size-border-radius-input-default);
  --x-size-border-radius-bottom-right-input-default: var(--x-size-border-radius-input-default);
  --x-size-border-radius-bottom-left-input-default: var(--x-size-border-radius-input-default);
  --x-size-height-input-default: var(--x-size-base-07);
  --x-size-padding-right-input-default: var(--x-size-base-04);
  --x-size-padding-left-input-default: var(--x-size-base-04);
  --x-font-family-input-default: var(--x-font-family-text);
  --x-size-font-input-default: var(--x-size-font-text);
  --x-size-line-height-input-default: var(--x-size-line-height-text);
  --x-number-font-weight-input-default: var(--x-number-font-weight-text);
  --x-font-family-input-placeholder-default: var(--x-font-family-input-default);
  --x-size-font-input-placeholder-default: var(--x-size-font-input-default);
  --x-size-line-height-input-placeholder-default: var(--x-size-line-height-input-default);
  --x-number-font-weight-input-placeholder-default: var(--x-number-font-weight-input-default);
}

[dir="ltr"] .x-input {
  padding-left: var(--x-size-padding-left-input-default);
}

[dir="rtl"] .x-input {
  padding-right: var(--x-size-padding-left-input-default);
}

[dir="ltr"] .x-input {
  padding-right: var(--x-size-padding-right-input-default);
}

[dir="rtl"] .x-input {
  padding-left: var(--x-size-padding-right-input-default);
}

[dir="ltr"] .x-input {
  border-right-width: var(--x-size-border-width-right-input-default);
}

[dir="rtl"] .x-input {
  border-left-width: var(--x-size-border-width-right-input-default);
}

[dir="ltr"] .x-input {
  border-left-width: var(--x-size-border-width-left-input-default);
}

[dir="rtl"] .x-input {
  border-right-width: var(--x-size-border-width-left-input-default);
}

.x-input {
  position: relative;
  display: flex;
  overflow: hidden;
  box-sizing: border-box;
  margin: 0;
  min-width: 0;
  height: var(--x-size-height-input-default);
  padding-top: 0;
  padding-bottom: 0;
  background-color: var(--x-color-background-input-default);
  border-color: var(--x-color-border-input-default);
  color: var(--x-color-text-input-default);
  border-top-width: var(--x-size-border-width-top-input-default);
  border-bottom-width: var(--x-size-border-width-bottom-input-default);
  border-radius: var(--x-size-border-radius-top-left-input-default) var(--x-size-border-radius-top-right-input-default) var(--x-size-border-radius-bottom-right-input-default) var(--x-size-border-radius-bottom-left-input-default);
  border-style: solid;
  font-family: var(--x-font-family-input-default);
  font-size: var(--x-size-font-input-default);
  font-weight: var(--x-number-font-weight-input-default);
  line-height: var(--x-size-line-height-input-default);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-input {
    -webkit-appearance: none;
  }
}
.x-input:focus {
  border-color: var(--x-color-border-input-default-focus);
}
.x-input > .x-input-placeholder {
  position: absolute;
  height: 100%;
}
.x-input > .x-input {
  background: none;
  border: none;
  padding: 0;
  flex: 1 1 auto;
}
.x-input > .x-input-placeholder, .x-input::placeholder {
  color: var(--x-color-text-input-placeholder-default);
  font-family: var(--x-font-family-input-placeholder-default);
  font-size: var(--x-size-font-input-placeholder-default);
  font-weight: var(--x-number-font-weight-input-placeholder-default);
  line-height: var(--x-size-line-height-input-placeholder-default);
}
:root {
  --x-size-border-radius-input-card: var(--x-size-border-radius-base-s);
  --x-size-border-radius-top-left-input-card: var(--x-size-border-radius-input-card);
  --x-size-border-radius-top-right-input-card: var(--x-size-border-radius-input-card);
  --x-size-border-radius-bottom-right-input-card: var(--x-size-border-radius-input-card);
  --x-size-border-radius-bottom-left-input-card: var(--x-size-border-radius-input-card);
}
:root {
  --x-color-background-input-default: var(--x-color-base-neutral-100);
  --x-color-border-input-default: var(--x-color-base-neutral-70);
  --x-color-border-input-default-focus: var(--x-color-base-lead);
  --x-color-text-input-default: var(--x-color-text-default);
  --x-color-text-input-placeholder-default: var(--x-color-base-neutral-35);
  --x-size-border-width-input-default: var(--x-size-border-width-base);
  --x-size-border-width-top-input-default: var(--x-size-border-width-input-default);
  --x-size-border-width-right-input-default: var(--x-size-border-width-input-default);
  --x-size-border-width-bottom-input-default: var(--x-size-border-width-input-default);
  --x-size-border-width-left-input-default: var(--x-size-border-width-input-default);
  --x-size-border-radius-input-default: var(--x-size-border-radius-base-none);
  --x-size-border-radius-top-left-input-default: var(--x-size-border-radius-input-default);
  --x-size-border-radius-top-right-input-default: var(--x-size-border-radius-input-default);
  --x-size-border-radius-bottom-right-input-default: var(--x-size-border-radius-input-default);
  --x-size-border-radius-bottom-left-input-default: var(--x-size-border-radius-input-default);
  --x-size-height-input-default: var(--x-size-base-07);
  --x-size-padding-right-input-default: var(--x-size-base-04);
  --x-size-padding-left-input-default: var(--x-size-base-04);
  --x-font-family-input-default: var(--x-font-family-text);
  --x-size-font-input-default: var(--x-size-font-text);
  --x-size-line-height-input-default: var(--x-size-line-height-text);
  --x-number-font-weight-input-default: var(--x-number-font-weight-text);
  --x-font-family-input-placeholder-default: var(--x-font-family-input-default);
  --x-size-font-input-placeholder-default: var(--x-size-font-input-default);
  --x-size-line-height-input-placeholder-default: var(--x-size-line-height-input-default);
  --x-number-font-weight-input-placeholder-default: var(--x-number-font-weight-input-default);
}
:root {
  --x-size-border-radius-input-card: var(--x-size-border-radius-base-s);
  --x-size-border-radius-top-left-input-card: var(--x-size-border-radius-input-card);
  --x-size-border-radius-top-right-input-card: var(--x-size-border-radius-input-card);
  --x-size-border-radius-bottom-right-input-card: var(--x-size-border-radius-input-card);
  --x-size-border-radius-bottom-left-input-card: var(--x-size-border-radius-input-card);
}

.x-input--card.x-input,
.x-input--card .x-input {
  --x-size-border-radius-input-default: var(--x-size-border-radius-input-card);
  --x-size-border-radius-top-left-input-default: var(--x-size-border-radius-top-left-input-card);
  --x-size-border-radius-top-right-input-default: var(--x-size-border-radius-top-right-input-card);
  --x-size-border-radius-bottom-right-input-default: var(
    --x-size-border-radius-bottom-right-input-card
  );
  --x-size-border-radius-bottom-left-input-default: var(
    --x-size-border-radius-bottom-left-input-card
  );
}
:root {
  --x-size-width-icon-xl: var(--x-size-base-07);
  --x-size-height-icon-xl: var(--x-size-base-07);
}
:root {
  --x-size-width-icon-xl: var(--x-size-base-07);
  --x-size-height-icon-xl: var(--x-size-base-07);
}

.x-icon--xl {
  --x-size-width-icon-default: var(--x-size-width-icon-xl);
  --x-size-height-icon-default: var(--x-size-height-icon-xl);
}
:root {
  --x-size-width-icon-s: var(--x-size-base-03);
  --x-size-height-icon-s: var(--x-size-base-03);
}

.x-icon--s {
  --x-size-width-icon-default: var(--x-size-width-icon-s);
  --x-size-height-icon-default: var(--x-size-height-icon-s);
}
:root {
  --x-size-width-icon-s: var(--x-size-base-03);
  --x-size-height-icon-s: var(--x-size-base-03);
}
:root {
  --x-size-width-icon-m: var(--x-size-base-05);
  --x-size-height-icon-m: var(--x-size-base-05);
}
:root {
  --x-size-width-icon-m: var(--x-size-base-05);
  --x-size-height-icon-m: var(--x-size-base-05);
}

.x-icon--m {
  --x-size-width-icon-default: var(--x-size-width-icon-m);
  --x-size-height-icon-default: var(--x-size-height-icon-m);
}
:root {
  --x-size-width-icon-l: var(--x-size-base-06);
  --x-size-height-icon-l: var(--x-size-base-06);
}
:root {
  --x-size-width-icon-l: var(--x-size-base-06);
  --x-size-height-icon-l: var(--x-size-base-06);
}

.x-icon--l {
  --x-size-width-icon-default: var(--x-size-width-icon-l);
  --x-size-height-icon-default: var(--x-size-height-icon-l);
}
:root {
  --x-color-stroke-icon-default: currentColor;
  --x-color-fill-icon-default: none;
  --x-size-width-icon-default: var(--x-size-width-icon-m);
  --x-size-height-icon-default: var(--x-size-height-icon-m);
  --x-string-stroke-linecap-icon-default: butt;
  --x-string-stroke-linejoin-icon-default: mitter;
  --x-size-stroke-width-icon-default: 1px;
}
.x-filter--justified.x-filter > *:last-child:not(.x-filter__label),
.x-filter--justified.x-facet-filter > *:last-child:not(.x-filter__label),
.x-filter--justified .x-filter > *:last-child:not(.x-filter__label),
.x-filter--justified .x-facet-filter > *:last-child:not(.x-filter__label) {
  margin-left: auto;
}
:root {
  --x-color-stroke-icon-default: currentColor;
  --x-color-fill-icon-default: none;
  --x-size-width-icon-default: var(--x-size-width-icon-m);
  --x-size-height-icon-default: var(--x-size-height-icon-m);
  --x-string-stroke-linecap-icon-default: butt;
  --x-string-stroke-linejoin-icon-default: mitter;
  --x-size-stroke-width-icon-default: 1px;
}

.x-icon {
  stroke: var(--x-color-stroke-icon-default);
  fill: var(--x-color-fill-icon-default);
  display: inline-flex;
  justify-content: center;
  align-items: center;
  flex: 0 0 auto;
  vertical-align: middle;
  line-height: var(--x-size-height-icon-default);
  width: var(--x-size-width-icon-default);
  height: var(--x-size-height-icon-default);
  font-size: var(--x-size-height-icon-default);
  stroke-linecap: var(--x-string-stroke-linecap-icon-default);
  stroke-linejoin: var(--x-string-stroke-linejoin-icon-default);
  stroke-width: var(--x-size-stroke-width-icon-default);
}
.x-icon.x-filled {
  stroke: none;
  fill: var(--x-color-stroke-icon-default);
}
:root {
  --x-size-padding-grid: 0;
  --x-size-gap-grid: var(--x-size-base-03);
  --x-size-min-width-grid-item: 150px;
}

.x-grid-list {
  margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(var(--x-size-min-width-grid-item), auto));
  grid-auto-flow: dense;
  align-items: stretch;
  list-style: none;
  padding: var(--x-size-padding-grid);
  gap: var(--x-size-gap-grid);
}
.x-grid-list__item {
  display: flex;
  flex-flow: column nowrap;
}
.x-grid-list__item > * {
  flex-grow: 1;
}
.x-grid-list--cols-auto .x-grid-list__item {
  min-width: var(--x-size-min-width-grid-item);
}
:root {
  --x-size-margin-filter-children: 0;
  --x-size-padding-top-filter-children: 0;
  --x-size-padding-right-filter-children: 0;
  --x-size-padding-bottom-filter-children: 0;
  --x-size-padding-left-filter-children: var(--x-size-base-05);
}
:root {
  --x-size-padding-grid: 0;
  --x-size-gap-grid: var(--x-size-base-03);
  --x-size-min-width-grid-item: 150px;
}
:root {
  --x-size-margin-filter-children: 0;
  --x-size-padding-top-filter-children: 0;
  --x-size-padding-right-filter-children: 0;
  --x-size-padding-bottom-filter-children: 0;
  --x-size-padding-left-filter-children: var(--x-size-base-05);
}

.x-hierarchical-filter-container {
  list-style: none;
}
[dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="ltr"]  .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
  padding-left: var(--x-size-padding-left-filter-children);
}
[dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="rtl"]  .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
  padding-right: var(--x-size-padding-left-filter-children);
}
[dir="ltr"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="ltr"]  .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
  padding-right: var(--x-size-padding-right-filter-children);
}
[dir="rtl"] .x-hierarchical-filter-container .x-hierarchical-filter__children,[dir="rtl"]  .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
  padding-left: var(--x-size-padding-right-filter-children);
}
.x-hierarchical-filter-container .x-hierarchical-filter__children, .x-hierarchical-filter-container .x-hierarchical-filter__children.x-list {
  margin: var(--x-size-margin-filter-children);
  padding-top: var(--x-size-padding-top-filter-children);
  padding-bottom: var(--x-size-padding-bottom-filter-children);
}
.x-hierarchical-filter-container .x-hierarchical-filter-container,
.x-hierarchical-filter-container .x-filter, .x-hierarchical-filter-container .x-facet-filter {
  width: 100%;
}
:root {
  --x-color-background-filter-default: transparent;
  --x-color-border-filter-default: var(--x-color-background-filter-default);
  --x-color-text-filter-default: var(--x-color-text-default);
  --x-color-background-filter-default-selected: var(--x-color-background-filter-default);
  --x-color-border-filter-default-selected: var(--x-color-border-filter-default);
  --x-color-text-filter-default-selected: var(--x-color-text-filter-default);
  --x-size-border-width-filter-default: var(--x-size-border-width-base);
  --x-size-border-width-top-filter-default: var(--x-size-border-width-filter-default);
  --x-size-border-width-right-filter-default: var(--x-size-border-width-filter-default);
  --x-size-border-width-bottom-filter-default: var(--x-size-border-width-filter-default);
  --x-size-border-width-left-filter-default: var(--x-size-border-width-filter-default);
  --x-size-border-radius-filter-default: var(--x-size-border-radius-base-none);
  --x-size-border-radius-top-left-filter-default: var(--x-size-border-radius-filter-default);
  --x-size-border-radius-top-right-filter-default: var(--x-size-border-radius-filter-default);
  --x-size-border-radius-bottom-right-filter-default: var(--x-size-border-radius-filter-default);
  --x-size-border-radius-bottom-left-filter-default: var(--x-size-border-radius-filter-default);
  --x-size-padding-top-filter-default: var(--x-size-base-03);
  --x-size-padding-right-filter-default: 0;
  --x-size-padding-bottom-filter-default: var(--x-size-base-03);
  --x-size-padding-left-filter-default: 0;
  --x-size-gap-filter-default: var(--x-size-base-03);
  --x-font-family-filter-default: var(--x-font-family-text);
  --x-size-font-filter-default: var(--x-size-font-text);
  --x-number-font-weight-filter-default: var(--x-number-font-weight-base-regular);
  --x-number-font-weight-filter-default-selected: var(--x-number-font-weight-base-bold);
  --x-number-font-weight-filter-count-default: var(--x-number-font-weight-base-light);
  --x-number-font-weight-filter-count-default-selected: var(
    --x-number-font-weight-filter-count-default
  );
  --x-size-line-height-filter-default: var(--x-size-line-height-text);
}
:root {
  --x-color-background-filter-default: transparent;
  --x-color-border-filter-default: var(--x-color-background-filter-default);
  --x-color-text-filter-default: var(--x-color-text-default);
  --x-color-background-filter-default-selected: var(--x-color-background-filter-default);
  --x-color-border-filter-default-selected: var(--x-color-border-filter-default);
  --x-color-text-filter-default-selected: var(--x-color-text-filter-default);
  --x-size-border-width-filter-default: var(--x-size-border-width-base);
  --x-size-border-width-top-filter-default: var(--x-size-border-width-filter-default);
  --x-size-border-width-right-filter-default: var(--x-size-border-width-filter-default);
  --x-size-border-width-bottom-filter-default: var(--x-size-border-width-filter-default);
  --x-size-border-width-left-filter-default: var(--x-size-border-width-filter-default);
  --x-size-border-radius-filter-default: var(--x-size-border-radius-base-none);
  --x-size-border-radius-top-left-filter-default: var(--x-size-border-radius-filter-default);
  --x-size-border-radius-top-right-filter-default: var(--x-size-border-radius-filter-default);
  --x-size-border-radius-bottom-right-filter-default: var(--x-size-border-radius-filter-default);
  --x-size-border-radius-bottom-left-filter-default: var(--x-size-border-radius-filter-default);
  --x-size-padding-top-filter-default: var(--x-size-base-03);
  --x-size-padding-right-filter-default: 0;
  --x-size-padding-bottom-filter-default: var(--x-size-base-03);
  --x-size-padding-left-filter-default: 0;
  --x-size-gap-filter-default: var(--x-size-base-03);
  --x-font-family-filter-default: var(--x-font-family-text);
  --x-size-font-filter-default: var(--x-size-font-text);
  --x-number-font-weight-filter-default: var(--x-number-font-weight-base-regular);
  --x-number-font-weight-filter-default-selected: var(--x-number-font-weight-base-bold);
  --x-number-font-weight-filter-count-default: var(--x-number-font-weight-base-light);
  --x-number-font-weight-filter-count-default-selected: var(
    --x-number-font-weight-filter-count-default
  );
  --x-size-line-height-filter-default: var(--x-size-line-height-text);
}

[dir="ltr"] .x-filter,[dir="ltr"]  .x-facet-filter {
  padding-left: var(--x-size-padding-left-filter-default);
}

[dir="rtl"] .x-filter,[dir="rtl"]  .x-facet-filter {
  padding-right: var(--x-size-padding-left-filter-default);
}

[dir="ltr"] .x-filter,[dir="ltr"]  .x-facet-filter {
  padding-right: var(--x-size-padding-right-filter-default);
}

[dir="rtl"] .x-filter,[dir="rtl"]  .x-facet-filter {
  padding-left: var(--x-size-padding-right-filter-default);
}

[dir="ltr"] .x-filter,[dir="ltr"]  .x-facet-filter {
  border-right-width: var(--x-size-border-width-right-filter-default);
}

[dir="rtl"] .x-filter,[dir="rtl"]  .x-facet-filter {
  border-left-width: var(--x-size-border-width-right-filter-default);
}

[dir="ltr"] .x-filter,[dir="ltr"]  .x-facet-filter {
  border-left-width: var(--x-size-border-width-left-filter-default);
}

[dir="rtl"] .x-filter,[dir="rtl"]  .x-facet-filter {
  border-right-width: var(--x-size-border-width-left-filter-default);
}

.x-filter, .x-facet-filter {
  display: inline-flex;
  justify-content: flex-start;
  align-items: flex-start;
  box-sizing: border-box;
  text-align: left;
  gap: var(--x-size-gap-filter-default);
  padding-top: var(--x-size-padding-top-filter-default);
  padding-bottom: var(--x-size-padding-bottom-filter-default);
  background-color: var(--x-color-background-filter-default);
  border-color: var(--x-color-border-filter-default);
  color: var(--x-color-text-filter-default);
  border-style: solid;
  border-top-width: var(--x-size-border-width-top-filter-default);
  border-bottom-width: var(--x-size-border-width-bottom-filter-default);
  border-radius: var(--x-size-border-radius-top-left-filter-default) var(--x-size-border-radius-top-right-filter-default) var(--x-size-border-radius-bottom-right-filter-default) var(--x-size-border-radius-bottom-left-filter-default);
  font-family: var(--x-font-family-filter-default);
  font-size: var(--x-size-font-filter-default);
  font-weight: var(--x-number-font-weight-filter-default);
  line-height: var(--x-size-line-height-filter-default);
  cursor: pointer;
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-filter, .x-facet-filter {
    gap: 0;
  }
  .x-filter > *:not(:last-child), .x-facet-filter > *:not(:last-child) {
    margin-right: var(--x-size-gap-filter-default);
  }
}
.x-filter > *, .x-facet-filter > * {
  flex: 0 0 auto;
}
.x-filter__label, .x-facet-filter__label {
  flex: 0 1 auto;
}
.x-filter__count, .x-facet-filter__count {
  font-weight: var(--x-number-font-weight-filter-count-default);
}
.x-filter--is-selected, .x-filter.x-selected, .x-facet-filter--is-selected, .x-facet-filter.x-selected {
  --x-color-background-filter-default: var(--x-color-background-filter-default-selected);
  --x-color-border-filter-default: var(--x-color-border-filter-default-selected);
  --x-color-text-filter-default: var(--x-color-text-filter-default-selected);
  --x-number-font-weight-filter-default: var(--x-number-font-weight-filter-default-selected);
  --x-number-font-weight-filter-count-default: var(
    --x-number-font-weight-filter-count-default-selected
  );
}
:root {
  --x-color-border-facet-outlined: var(--x-color-base-neutral-70);
  --x-size-border-width-facet-outlined: var(--x-size-border-width-base);
  --x-size-border-width-top-facet-outlined: var(--x-size-border-width-facet-outlined);
  --x-size-border-width-right-facet-outlined: var(--x-size-border-width-facet-outlined);
  --x-size-border-width-bottom-facet-outlined: var(--x-size-border-width-facet-outlined);
  --x-size-border-width-left-facet-outlined: var(--x-size-border-width-facet-outlined);
  --x-size-padding-facet-header-outlined: var(--x-size-base-03);
  --x-size-padding-top-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
  --x-size-padding-right-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
  --x-size-padding-bottom-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
  --x-size-padding-left-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
}
:root {
  --x-color-border-facet-outlined: var(--x-color-base-neutral-70);
  --x-size-border-width-facet-outlined: var(--x-size-border-width-base);
  --x-size-border-width-top-facet-outlined: var(--x-size-border-width-facet-outlined);
  --x-size-border-width-right-facet-outlined: var(--x-size-border-width-facet-outlined);
  --x-size-border-width-bottom-facet-outlined: var(--x-size-border-width-facet-outlined);
  --x-size-border-width-left-facet-outlined: var(--x-size-border-width-facet-outlined);
  --x-size-padding-facet-header-outlined: var(--x-size-base-03);
  --x-size-padding-top-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
  --x-size-padding-right-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
  --x-size-padding-bottom-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
  --x-size-padding-left-facet-header-outlined: var(--x-size-padding-facet-header-outlined);
}

.x-facet--outlined.x-facet,
.x-facet--outlined .x-facet {
  --x-color-border-facet-default: var(--x-color-border-facet-outlined);
  --x-size-border-width-facet-default: var(--x-size-border-width-facet-outlined);
  --x-size-border-width-top-facet-default: var(--x-size-border-width-top-facet-outlined);
  --x-size-border-width-right-facet-default: var(--x-size-border-width-right-facet-outlined);
  --x-size-border-width-bottom-facet-default: var(--x-size-border-width-bottom-facet-outlined);
  --x-size-border-width-left-facet-default: var(--x-size-border-width-left-facet-outlined);
  --x-size-padding-facet-header-default: var(--x-size-padding-facet-header-outlined);
  --x-size-padding-top-facet-header-default: var(--x-size-padding-top-facet-header-outlined);
  --x-size-padding-right-facet-header-default: var(--x-size-padding-right-facet-header-outlined);
  --x-size-padding-bottom-facet-header-default: var(--x-size-padding-bottom-facet-header-outlined);
  --x-size-padding-left-facet-header-default: var(--x-size-padding-left-facet-header-outlined);
}
:root {
  --x-color-border-facet-header-line: var(--x-color-base-neutral-10);
  --x-size-border-width-facet-header-line: var(--x-size-border-width-base);
  --x-size-border-width-top-facet-header-line: 0;
  --x-size-border-width-right-facet-header-line: 0;
  --x-size-border-width-bottom-facet-header-line: var(--x-size-border-width-facet-header-line);
  --x-size-border-width-left-facet-header-line: 0;
}
:root {
  --x-color-border-facet-header-line: var(--x-color-base-neutral-10);
  --x-size-border-width-facet-header-line: var(--x-size-border-width-base);
  --x-size-border-width-top-facet-header-line: 0;
  --x-size-border-width-right-facet-header-line: 0;
  --x-size-border-width-bottom-facet-header-line: var(--x-size-border-width-facet-header-line);
  --x-size-border-width-left-facet-header-line: 0;
}

.x-facet--line.x-facet,
.x-facet--line .x-facet {
  --x-color-border-facet-header-default: var(--x-color-border-facet-header-line);
  --x-size-border-width-facet-header-default: var(--x-size-border-width-facet-header-line);
  --x-size-border-width-top-facet-header-default: var(--x-size-border-width-top-facet-header-line);
  --x-size-border-width-right-facet-header-default: var(
    --x-size-border-width-right-facet-header-line
  );
  --x-size-border-width-bottom-facet-header-default: var(
    --x-size-border-width-bottom-facet-header-line
  );
  --x-size-border-width-left-facet-header-default: var(
    --x-size-border-width-left-facet-header-line
  );
}
:root {
  --x-color-background-facet-default: transparent;
  --x-color-border-facet-default: var(--x-color-background-facet-default);
  --x-color-text-facet-default: var(--x-color-text-default);
  --x-color-background-facet-header-default: var(--x-color-background-facet-default);
  --x-color-border-facet-header-default: var(--x-color-background-facet-default);
  --x-size-border-width-facet-default: var(--x-size-border-width-base);
  --x-size-border-width-top-facet-default: var(--x-size-border-width-facet-default);
  --x-size-border-width-right-facet-default: var(--x-size-border-width-facet-default);
  --x-size-border-width-bottom-facet-default: var(--x-size-border-width-facet-default);
  --x-size-border-width-left-facet-default: var(--x-size-border-width-facet-default);
  --x-size-border-width-facet-header-default: var(--x-size-border-width-base);
  --x-size-border-width-top-facet-header-default: var(--x-size-border-width-facet-header-default);
  --x-size-border-width-right-facet-header-default: var(--x-size-border-width-facet-header-default);
  --x-size-border-width-bottom-facet-header-default: var(
    --x-size-border-width-facet-header-default
  );
  --x-size-border-width-left-facet-header-default: var(--x-size-border-width-facet-header-default);
  --x-size-border-radius-facet-default: var(--x-size-border-radius-base-none);
  --x-size-border-radius-top-left-facet-default: var(--x-size-border-radius-facet-default);
  --x-size-border-radius-top-right-facet-default: var(--x-size-border-radius-facet-default);
  --x-size-border-radius-bottom-right-facet-default: var(--x-size-border-radius-facet-default);
  --x-size-border-radius-bottom-left-facet-default: var(--x-size-border-radius-facet-default);
  --x-size-padding-top-facet-header-default: var(--x-size-base-03);
  --x-size-padding-right-facet-header-default: 0;
  --x-size-padding-bottom-facet-header-default: var(--x-size-base-03);
  --x-size-padding-left-facet-header-default: 0;
  --x-size-gap-facet-header-default: var(--x-size-base-03);
  --x-font-family-facet-default: var(--x-font-family-title3);
  --x-size-font-facet-default: var(--x-size-font-title3);
  --x-number-font-weight-facet-default: var(--x-number-font-weight-title3);
  --x-size-line-height-facet-default: var(--x-size-line-height-title3);
}
:root {
  --x-color-background-facet-default: transparent;
  --x-color-border-facet-default: var(--x-color-background-facet-default);
  --x-color-text-facet-default: var(--x-color-text-default);
  --x-color-background-facet-header-default: var(--x-color-background-facet-default);
  --x-color-border-facet-header-default: var(--x-color-background-facet-default);
  --x-size-border-width-facet-default: var(--x-size-border-width-base);
  --x-size-border-width-top-facet-default: var(--x-size-border-width-facet-default);
  --x-size-border-width-right-facet-default: var(--x-size-border-width-facet-default);
  --x-size-border-width-bottom-facet-default: var(--x-size-border-width-facet-default);
  --x-size-border-width-left-facet-default: var(--x-size-border-width-facet-default);
  --x-size-border-width-facet-header-default: var(--x-size-border-width-base);
  --x-size-border-width-top-facet-header-default: var(--x-size-border-width-facet-header-default);
  --x-size-border-width-right-facet-header-default: var(--x-size-border-width-facet-header-default);
  --x-size-border-width-bottom-facet-header-default: var(
    --x-size-border-width-facet-header-default
  );
  --x-size-border-width-left-facet-header-default: var(--x-size-border-width-facet-header-default);
  --x-size-border-radius-facet-default: var(--x-size-border-radius-base-none);
  --x-size-border-radius-top-left-facet-default: var(--x-size-border-radius-facet-default);
  --x-size-border-radius-top-right-facet-default: var(--x-size-border-radius-facet-default);
  --x-size-border-radius-bottom-right-facet-default: var(--x-size-border-radius-facet-default);
  --x-size-border-radius-bottom-left-facet-default: var(--x-size-border-radius-facet-default);
  --x-size-padding-top-facet-header-default: var(--x-size-base-03);
  --x-size-padding-right-facet-header-default: 0;
  --x-size-padding-bottom-facet-header-default: var(--x-size-base-03);
  --x-size-padding-left-facet-header-default: 0;
  --x-size-gap-facet-header-default: var(--x-size-base-03);
  --x-font-family-facet-default: var(--x-font-family-title3);
  --x-size-font-facet-default: var(--x-size-font-title3);
  --x-number-font-weight-facet-default: var(--x-number-font-weight-title3);
  --x-size-line-height-facet-default: var(--x-size-line-height-title3);
}

[dir="ltr"] .x-facet {
  border-right-width: var(--x-size-border-width-right-facet-default);
}

[dir="rtl"] .x-facet {
  border-left-width: var(--x-size-border-width-right-facet-default);
}

[dir="ltr"] .x-facet {
  border-left-width: var(--x-size-border-width-left-facet-default);
}

[dir="rtl"] .x-facet {
  border-right-width: var(--x-size-border-width-left-facet-default);
}

.x-facet {
  display: flex;
  flex-flow: column nowrap;
  justify-content: flex-start;
  box-sizing: border-box;
  background-color: var(--x-color-background-facet-default);
  border-color: var(--x-color-border-facet-default);
  border-style: solid;
  border-top-width: var(--x-size-border-width-top-facet-default);
  border-bottom-width: var(--x-size-border-width-bottom-facet-default);
  border-radius: var(--x-size-border-radius-top-left-facet-default) var(--x-size-border-radius-top-right-facet-default) var(--x-size-border-radius-bottom-right-facet-default) var(--x-size-border-radius-bottom-left-facet-default);
}
[dir="ltr"] .x-facet > *:first-child,[dir="ltr"]  .x-facet__header {
  text-align: left;
}
[dir="rtl"] .x-facet > *:first-child,[dir="rtl"]  .x-facet__header {
  text-align: right;
}
[dir="ltr"] .x-facet > *:first-child,[dir="ltr"]  .x-facet__header {
  padding-left: var(--x-size-padding-left-facet-header-default);
}
[dir="rtl"] .x-facet > *:first-child,[dir="rtl"]  .x-facet__header {
  padding-right: var(--x-size-padding-left-facet-header-default);
}
[dir="ltr"] .x-facet > *:first-child,[dir="ltr"]  .x-facet__header {
  padding-right: var(--x-size-padding-right-facet-header-default);
}
[dir="rtl"] .x-facet > *:first-child,[dir="rtl"]  .x-facet__header {
  padding-left: var(--x-size-padding-right-facet-header-default);
}
[dir="ltr"] .x-facet > *:first-child,[dir="ltr"]  .x-facet__header {
  border-right-width: var(--x-size-border-width-right-facet-header-default);
}
[dir="rtl"] .x-facet > *:first-child,[dir="rtl"]  .x-facet__header {
  border-left-width: var(--x-size-border-width-right-facet-header-default);
}
[dir="ltr"] .x-facet > *:first-child,[dir="ltr"]  .x-facet__header {
  border-left-width: var(--x-size-border-width-left-facet-header-default);
}
[dir="rtl"] .x-facet > *:first-child,[dir="rtl"]  .x-facet__header {
  border-right-width: var(--x-size-border-width-left-facet-header-default);
}
.x-facet > *:first-child, .x-facet__header {
  display: flex;
  flex-flow: row nowrap;
  justify-content: stretch;
  align-items: flex-start;
  box-sizing: border-box;
  background-color: var(--x-color-background-facet-header-default);
  border-color: var(--x-color-border-facet-header-default);
  color: var(--x-color-text-facet-default);
  gap: var(--x-size-gap-facet-header-default);
  padding-top: var(--x-size-padding-top-facet-header-default);
  padding-bottom: var(--x-size-padding-bottom-facet-header-default);
  border-style: solid;
  border-top-width: var(--x-size-border-width-top-facet-header-default);
  border-bottom-width: var(--x-size-border-width-bottom-facet-header-default);
  font-family: var(--x-font-family-facet-default);
  font-size: var(--x-size-font-facet-default);
  font-weight: var(--x-number-font-weight-facet-default);
  line-height: var(--x-size-line-height-facet-default);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-facet > *:first-child, .x-facet__header {
    gap: 0;
  }
  .x-facet > *:first-child > *:not(:last-child), .x-facet__header > *:not(:last-child) {
    margin-right: var(--x-size-gap-facet-header-default);
  }
}
.x-facet > *:first-child .x-icon, .x-facet__header .x-icon {
  --x-size-height-icon: var(--x-size-line-height-facet-default);
  --x-size-width-icon: var(--x-size-line-height-facet-default);
}
.x-facet > *:first-child .x-icon:last-child:not(:first-child), .x-facet__header .x-icon:last-child:not(:first-child) {
  margin-left: auto;
}
:root {
  --x-size-border-radius-facet-card: var(--x-size-border-radius-base-s);
  --x-size-border-radius-top-left-facet-card: var(--x-size-border-radius-facet-card);
  --x-size-border-radius-top-right-facet-card: var(--x-size-border-radius-facet-card);
  --x-size-border-radius-bottom-right-facet-card: var(--x-size-border-radius-facet-card);
  --x-size-border-radius-bottom-left-facet-card: var(--x-size-border-radius-facet-card);
  --x-size-padding-facet-header-card: var(--x-size-base-03);
  --x-size-padding-top-facet-header-card: var(--x-size-padding-facet-header-card);
  --x-size-padding-right-facet-header-card: var(--x-size-padding-facet-header-card);
  --x-size-padding-bottom-facet-header-card: var(--x-size-padding-facet-header-card);
  --x-size-padding-left-facet-header-card: var(--x-size-padding-facet-header-card);
}
:root {
  --x-size-border-radius-facet-card: var(--x-size-border-radius-base-s);
  --x-size-border-radius-top-left-facet-card: var(--x-size-border-radius-facet-card);
  --x-size-border-radius-top-right-facet-card: var(--x-size-border-radius-facet-card);
  --x-size-border-radius-bottom-right-facet-card: var(--x-size-border-radius-facet-card);
  --x-size-border-radius-bottom-left-facet-card: var(--x-size-border-radius-facet-card);
  --x-size-padding-facet-header-card: var(--x-size-base-03);
  --x-size-padding-top-facet-header-card: var(--x-size-padding-facet-header-card);
  --x-size-padding-right-facet-header-card: var(--x-size-padding-facet-header-card);
  --x-size-padding-bottom-facet-header-card: var(--x-size-padding-facet-header-card);
  --x-size-padding-left-facet-header-card: var(--x-size-padding-facet-header-card);
}

.x-facet--card.x-facet,
.x-facet--card .x-facet {
  --x-size-border-radius-facet-default: var(--x-size-border-radius-facet-card);
  --x-size-border-radius-top-left-facet-default: var(--x-size-border-radius-facet-card);
  --x-size-border-radius-top-right-facet-default: var(--x-size-border-radius-facet-card);
  --x-size-border-radius-bottom-right-facet-default: var(--x-size-border-radius-facet-card);
  --x-size-border-radius-bottom-left-facet-default: var(--x-size-border-radius-facet-card);
  --x-size-padding-facet-header-default: var(--x-size-padding-facet-header-card);
  --x-size-padding-top-facet-header-default: var(--x-size-padding-top-facet-header-card);
  --x-size-padding-right-facet-header-default: var(--x-size-padding-right-facet-header-card);
  --x-size-padding-bottom-facet-header-default: var(--x-size-padding-bottom-facet-header-card);
  --x-size-padding-left-facet-header-default: var(--x-size-padding-left-facet-header-card);
}
:root {
  --x-size-width-dropdown-xl: 282px;
}
:root {
  --x-size-width-dropdown-xl: 282px;
}

.x-dropdown.x-dropdown--xl {
  --x-size-width-dropdown-toggle-default: var(--x-size-width-dropdown-xl);
}
:root {
  --x-size-width-dropdown-s: 74px;
}
:root {
  --x-size-width-dropdown-s: 74px;
}

.x-dropdown.x-dropdown--s {
  --x-size-width-dropdown-toggle-default: var(--x-size-width-dropdown-s);
}
:root {
  --x-size-gap-dropdown-pill: var(--x-size-base-03);
  --x-size-border-width-dropdown-list-pill: var(--x-size-border-width-base);
  --x-size-border-width-top-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
  --x-size-border-width-right-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
  --x-size-border-width-bottom-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
  --x-size-border-width-left-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
}
:root {
  --x-size-gap-dropdown-pill: var(--x-size-base-03);
  --x-size-border-width-dropdown-list-pill: var(--x-size-border-width-base);
  --x-size-border-width-top-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
  --x-size-border-width-right-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
  --x-size-border-width-bottom-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
  --x-size-border-width-left-dropdown-list-pill: var(--x-size-border-width-dropdown-list-pill);
}

.x-dropdown--pill {
  --x-size-gap-dropdown-default: var(--x-size-gap-dropdown-pill);
  --x-size-border-radius-top-left-dropdown-default: calc(
    var(--x-size-line-height-dropdown-default) / 2 + var(--x-size-padding-top-dropdown-item-default) +
      var(--x-size-border-width-top-dropdown-toggle-default)
  );
  --x-size-border-radius-top-right-dropdown-default: calc(
    var(--x-size-line-height-dropdown-default) / 2 + var(--x-size-padding-top-dropdown-item-default) +
      var(--x-size-border-width-top-dropdown-toggle-default)
  );
  --x-size-border-radius-bottom-right-dropdown-default: calc(
    var(--x-size-line-height-dropdown-default) / 2 +
      var(--x-size-padding-bottom-dropdown-item-default) +
      var(--x-size-border-width-bottom-dropdown-toggle-default)
  );
  --x-size-border-radius-bottom-left-dropdown-default: calc(
    var(--x-size-line-height-dropdown-default) / 2 +
      var(--x-size-padding-bottom-dropdown-item-default) +
      var(--x-size-border-width-bottom-dropdown-toggle-default)
  );
  --x-size-border-width-dropdown-list-default: var(--x-size-border-width-dropdown-list-pill);
  --x-size-border-width-top-dropdown-list-default: var(
    --x-size-border-width-top-dropdown-list-pill
  );
  --x-size-border-width-right-dropdown-list-default: var(
    --x-size-border-width-right-dropdown-list-pill
  );
  --x-size-border-width-bottom-dropdown-list-default: var(
    --x-size-border-width-bottom-dropdown-list-pill
  );
  --x-size-border-width-left-dropdown-list-default: var(
    --x-size-border-width-left-dropdown-list-pill
  );
}
:root {
  --x-size-width-dropdown-m: 130px;
}
:root {
  --x-size-width-dropdown-m: 130px;
}

.x-dropdown.x-dropdown--m {
  --x-size-width-dropdown-toggle-default: var(--x-size-width-dropdown-m);
}
:root {
  --x-size-padding-block-dropdown-item-line: var(--x-size-base-03);
  --x-size-padding-inline-dropdown-item-line: 0 var(--x-size-base-03);
  --x-size-padding-top-dropdown-item-line: var(--x-size-base-03);
  --x-size-padding-right-dropdown-item-line: 0;
  --x-size-padding-bottom-dropdown-item-line: var(--x-size-base-03);
  --x-size-padding-left-dropdown-item-line: 0;
  --x-size-padding-top-dropdown-toggle-line: var(--x-size-base-03);
  --x-size-padding-right-dropdown-toggle-line: 0;
  --x-size-padding-bottom-dropdown-toggle-line: var(--x-size-base-03);
  --x-size-padding-left-dropdown-toggle-line: 0;
  --x-size-border-width-dropdown-toggle-line: var(--x-size-border-width-base);
  --x-size-border-width-top-dropdown-toggle-line: 0;
  --x-size-border-width-right-dropdown-toggle-line: 0;
  --x-size-border-width-bottom-dropdown-toggle-line: var(
    --x-size-border-width-dropdown-toggle-line
  );
  --x-size-border-width-left-dropdown-toggle-line: 0;
  --x-size-border-width-dropdown-list-line: 0;
  --x-size-border-width-top-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
  --x-size-border-width-right-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
  --x-size-border-width-bottom-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
  --x-size-border-width-left-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
}
:root {
  --x-size-padding-block-dropdown-item-line: var(--x-size-base-03);
  --x-size-padding-inline-dropdown-item-line: 0 var(--x-size-base-03);
  --x-size-padding-top-dropdown-item-line: var(--x-size-base-03);
  --x-size-padding-right-dropdown-item-line: 0;
  --x-size-padding-bottom-dropdown-item-line: var(--x-size-base-03);
  --x-size-padding-left-dropdown-item-line: 0;
  --x-size-padding-top-dropdown-toggle-line: var(--x-size-base-03);
  --x-size-padding-right-dropdown-toggle-line: 0;
  --x-size-padding-bottom-dropdown-toggle-line: var(--x-size-base-03);
  --x-size-padding-left-dropdown-toggle-line: 0;
  --x-size-border-width-dropdown-toggle-line: var(--x-size-border-width-base);
  --x-size-border-width-top-dropdown-toggle-line: 0;
  --x-size-border-width-right-dropdown-toggle-line: 0;
  --x-size-border-width-bottom-dropdown-toggle-line: var(
    --x-size-border-width-dropdown-toggle-line
  );
  --x-size-border-width-left-dropdown-toggle-line: 0;
  --x-size-border-width-dropdown-list-line: 0;
  --x-size-border-width-top-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
  --x-size-border-width-right-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
  --x-size-border-width-bottom-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
  --x-size-border-width-left-dropdown-list-line: var(--x-size-border-width-dropdown-list-line);
}

.x-dropdown--line {
  --x-size-padding-top-dropdown-item-default: var(--x-size-padding-top-dropdown-item-line);
  --x-size-padding-right-dropdown-item-default: var(--x-size-padding-right-dropdown-item-line);
  --x-size-padding-bottom-dropdown-item-default: var(--x-size-padding-bottom-dropdown-item-line);
  --x-size-padding-left-dropdown-item-default: var(--x-size-padding-left-dropdown-item-line);
  --x-size-padding-top-dropdown-toggle-default: var(--x-size-padding-top-dropdown-toggle-line);
  --x-size-padding-right-dropdown-toggle-default: var(--x-size-padding-right-dropdown-toggle-line);
  --x-size-padding-bottom-dropdown-toggle-default: var(
    --x-size-padding-bottom-dropdown-toggle-line
  );
  --x-size-padding-left-dropdown-toggle-default: var(--x-size-padding-left-dropdown-toggle-line);
  --x-size-border-width-dropdown-toggle-default: var(--x-size-border-width-dropdown-toggle-line);
  --x-size-border-width-top-dropdown-toggle-default: var(
    --x-size-border-width-top-dropdown-toggle-line
  );
  --x-size-border-width-right-dropdown-toggle-default: var(
    --x-size-border-width-right-dropdown-toggle-line
  );
  --x-size-border-width-bottom-dropdown-toggle-default: var(
    --x-size-border-width-bottom-dropdown-toggle-line
  );
  --x-size-border-width-left-dropdown-toggle-default: var(
    --x-size-border-width-left-dropdown-toggle-line
  );
  --x-size-border-width-dropdown-list-default: var(--x-size-border-width-dropdown-list-line);
  --x-size-border-width-top-dropdown-list-default: var(
    --x-size-border-width-top-dropdown-list-line
  );
  --x-size-border-width-right-dropdown-list-default: var(
    --x-size-border-width-right-dropdown-list-line
  );
  --x-size-border-width-bottom-dropdown-list-default: var(
    --x-size-border-width-bottom-dropdown-list-line
  );
  --x-size-border-width-left-dropdown-list-default: var(
    --x-size-border-width-left-dropdown-list-line
  );
}
:root {
  --x-size-width-dropdown-l: 202px;
}
:root {
  --x-size-width-dropdown-l: 202px;
}

.x-dropdown.x-dropdown--l {
  --x-size-width-dropdown-toggle-default: var(--x-size-width-dropdown-l);
}
:root {
  --x-size-border-radius-dropdown-default: var(--x-size-border-radius-base-none);
  --x-size-border-radius-top-left-dropdown-default: var(--x-size-border-radius-dropdown-default);
  --x-size-border-radius-top-right-dropdown-default: var(--x-size-border-radius-dropdown-default);
  --x-size-border-radius-bottom-right-dropdown-default: var(
    --x-size-border-radius-dropdown-default
  );
  --x-size-border-radius-bottom-left-dropdown-default: var(--x-size-border-radius-dropdown-default);
  --x-size-border-width-dropdown-toggle-default: var(--x-size-border-width-base);
  --x-size-border-width-top-dropdown-toggle-default: var(
    --x-size-border-width-dropdown-toggle-default
  );
  --x-size-border-width-right-dropdown-toggle-default: var(
    --x-size-border-width-dropdown-toggle-default
  );
  --x-size-border-width-bottom-dropdown-toggle-default: var(
    --x-size-border-width-dropdown-toggle-default
  );
  --x-size-border-width-left-dropdown-toggle-default: var(
    --x-size-border-width-dropdown-toggle-default
  );
  --x-size-border-width-dropdown-list-default: var(--x-size-border-width-base);
  --x-size-border-width-top-dropdown-list-default: 0;
  --x-size-border-width-right-dropdown-list-default: var(
    --x-size-border-width-dropdown-list-default
  );
  --x-size-border-width-bottom-dropdown-list-default: var(
    --x-size-border-width-dropdown-list-default
  );
  --x-size-border-width-left-dropdown-list-default: var(
    --x-size-border-width-dropdown-list-default
  );
  --x-color-border-dropdown-toggle-default: var(--x-color-base-neutral-95);
  --x-color-border-dropdown-list-default: var(--x-color-border-dropdown-toggle-default);
  --x-color-background-dropdown-default: var(--x-color-base-neutral-100);
  --x-color-background-dropdown-toggle-default: var(--x-color-base-neutral-100);
  --x-color-background-dropdown-toggle-open-default: var(
    --x-color-background-dropdown-toggle-default
  );
  --x-color-background-dropdown-item-default-selected: var(--x-color-base-neutral-95);
  --x-color-background-dropdown-item-default-hover: var(--x-color-base-neutral-95);
  --x-color-text-dropdown-default: var(--x-color-text-default);
  --x-color-text-dropdown-toggle-default: var(--x-color-text-dropdown-default);
  --x-color-text-dropdown-toggle-default-selected: var(--x-color-base-neutral-35);
  --x-color-text-dropdown-item-default-hover: var(--x-color-base-neutral-35);
  --x-color-text-dropdown-item-default-selected: var(--x-color-text-default);
  --x-font-family-dropdown-default: var(--x-font-family-text);
  --x-size-font-dropdown-default: var(--x-size-font-text);
  --x-size-line-height-dropdown-default: var(--x-size-line-height-text);
  --x-number-font-weight-dropdown-default: var(--x-number-font-weight-base-regular);
  --x-number-font-weight-dropdown-item-default-hover: var(--x-number-font-weight-base-bold);
  --x-number-font-weight-dropdown-item-default-selected: var(--x-number-font-weight-base-regular);
  --x-font-decoration-dropdown-item-default-hover: none;
  --x-font-decoration-dropdown-item-default-selected: none;
  --x-size-width-dropdown-toggle-default: 100%;
  --x-size-min-width-dropdown-list-default: 100%;
  --x-size-gap-dropdown-default: 0;
  --x-size-padding-top-dropdown-toggle-default: var(--x-size-padding-top-dropdown-item-default);
  --x-size-padding-right-dropdown-toggle-default: var(--x-size-padding-right-dropdown-item-default);
  --x-size-padding-bottom-dropdown-toggle-default: var(
    --x-size-padding-bottom-dropdown-item-default
  );
  --x-size-padding-left-dropdown-toggle-default: var(--x-size-padding-left-dropdown-item-default);
  --x-size-padding-vertical-dropdown-list-default: 0;
  --x-size-padding-top-dropdown-item-default: var(--x-size-base-04);
  --x-size-padding-right-dropdown-item-default: var(--x-size-base-05);
  --x-size-padding-bottom-dropdown-item-default: var(--x-size-base-04);
  --x-size-padding-left-dropdown-item-default: var(--x-size-base-05);
  --x-size-gap-dropdown-item-default: var(--x-size-base-03);
  --x-string-box-shadow-dropdown-default: none;
  --x-string-overflow-dropdown-toggle-default: hidden;
  --x-string-overflow-dropdown-list-default: hidden;
}
:root {
  --x-size-gap-dropdown-card: var(--x-size-base-03);
  --x-size-border-radius-dropdown-card: var(--x-size-border-radius-base-s);
  --x-size-border-radius-top-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
  --x-size-border-radius-top-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
  --x-size-border-radius-bottom-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
  --x-size-border-radius-bottom-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
  --x-size-border-width-dropdown-list-card: var(--x-size-border-width-base);
  --x-size-border-width-top-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
  --x-size-border-width-right-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
  --x-size-border-width-bottom-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
  --x-size-border-width-left-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
}
:root {
  --x-size-border-radius-dropdown-default: var(--x-size-border-radius-base-none);
  --x-size-border-radius-top-left-dropdown-default: var(--x-size-border-radius-dropdown-default);
  --x-size-border-radius-top-right-dropdown-default: var(--x-size-border-radius-dropdown-default);
  --x-size-border-radius-bottom-right-dropdown-default: var(
    --x-size-border-radius-dropdown-default
  );
  --x-size-border-radius-bottom-left-dropdown-default: var(--x-size-border-radius-dropdown-default);
  --x-size-border-width-dropdown-toggle-default: var(--x-size-border-width-base);
  --x-size-border-width-top-dropdown-toggle-default: var(
    --x-size-border-width-dropdown-toggle-default
  );
  --x-size-border-width-right-dropdown-toggle-default: var(
    --x-size-border-width-dropdown-toggle-default
  );
  --x-size-border-width-bottom-dropdown-toggle-default: var(
    --x-size-border-width-dropdown-toggle-default
  );
  --x-size-border-width-left-dropdown-toggle-default: var(
    --x-size-border-width-dropdown-toggle-default
  );
  --x-size-border-width-dropdown-list-default: var(--x-size-border-width-base);
  --x-size-border-width-top-dropdown-list-default: 0;
  --x-size-border-width-right-dropdown-list-default: var(
    --x-size-border-width-dropdown-list-default
  );
  --x-size-border-width-bottom-dropdown-list-default: var(
    --x-size-border-width-dropdown-list-default
  );
  --x-size-border-width-left-dropdown-list-default: var(
    --x-size-border-width-dropdown-list-default
  );
  --x-color-border-dropdown-toggle-default: var(--x-color-base-neutral-95);
  --x-color-border-dropdown-list-default: var(--x-color-border-dropdown-toggle-default);
  --x-color-background-dropdown-default: var(--x-color-base-neutral-100);
  --x-color-background-dropdown-toggle-default: var(--x-color-base-neutral-100);
  --x-color-background-dropdown-toggle-open-default: var(
    --x-color-background-dropdown-toggle-default
  );
  --x-color-background-dropdown-item-default-selected: var(--x-color-base-neutral-95);
  --x-color-background-dropdown-item-default-hover: var(--x-color-base-neutral-95);
  --x-color-text-dropdown-default: var(--x-color-text-default);
  --x-color-text-dropdown-toggle-default: var(--x-color-text-dropdown-default);
  --x-color-text-dropdown-toggle-default-selected: var(--x-color-base-neutral-35);
  --x-color-text-dropdown-item-default-hover: var(--x-color-base-neutral-35);
  --x-color-text-dropdown-item-default-selected: var(--x-color-text-default);
  --x-font-family-dropdown-default: var(--x-font-family-text);
  --x-size-font-dropdown-default: var(--x-size-font-text);
  --x-size-line-height-dropdown-default: var(--x-size-line-height-text);
  --x-number-font-weight-dropdown-default: var(--x-number-font-weight-base-regular);
  --x-number-font-weight-dropdown-item-default-hover: var(--x-number-font-weight-base-bold);
  --x-number-font-weight-dropdown-item-default-selected: var(--x-number-font-weight-base-regular);
  --x-font-decoration-dropdown-item-default-hover: none;
  --x-font-decoration-dropdown-item-default-selected: none;
  --x-size-width-dropdown-toggle-default: 100%;
  --x-size-min-width-dropdown-list-default: 100%;
  --x-size-gap-dropdown-default: 0;
  --x-size-padding-top-dropdown-toggle-default: var(--x-size-padding-top-dropdown-item-default);
  --x-size-padding-right-dropdown-toggle-default: var(--x-size-padding-right-dropdown-item-default);
  --x-size-padding-bottom-dropdown-toggle-default: var(
    --x-size-padding-bottom-dropdown-item-default
  );
  --x-size-padding-left-dropdown-toggle-default: var(--x-size-padding-left-dropdown-item-default);
  --x-size-padding-vertical-dropdown-list-default: 0;
  --x-size-padding-top-dropdown-item-default: var(--x-size-base-04);
  --x-size-padding-right-dropdown-item-default: var(--x-size-base-05);
  --x-size-padding-bottom-dropdown-item-default: var(--x-size-base-04);
  --x-size-padding-left-dropdown-item-default: var(--x-size-base-05);
  --x-size-gap-dropdown-item-default: var(--x-size-base-03);
  --x-string-box-shadow-dropdown-default: none;
  --x-string-overflow-dropdown-toggle-default: hidden;
  --x-string-overflow-dropdown-list-default: hidden;
}

.x-dropdown {
  box-sizing: border-box;
  position: relative;
  font-size: var(--x-size-font-dropdown-default);
  font-family: var(--x-font-family-dropdown-default);
  font-weight: var(--x-number-font-weight-dropdown-default);
  line-height: var(--x-size-line-height-dropdown-default);
}
[dir="ltr"] .x-dropdown__toggle {
  border-right-width: var(--x-size-border-width-right-dropdown-toggle-default);
}
[dir="rtl"] .x-dropdown__toggle {
  border-left-width: var(--x-size-border-width-right-dropdown-toggle-default);
}
[dir="ltr"] .x-dropdown__toggle {
  border-left-width: var(--x-size-border-width-left-dropdown-toggle-default);
}
[dir="rtl"] .x-dropdown__toggle {
  border-right-width: var(--x-size-border-width-left-dropdown-toggle-default);
}
[dir="ltr"] .x-dropdown__toggle {
  padding-right: var(--x-size-padding-right-dropdown-toggle-default);
}
[dir="rtl"] .x-dropdown__toggle {
  padding-left: var(--x-size-padding-right-dropdown-toggle-default);
}
[dir="ltr"] .x-dropdown__toggle {
  padding-left: var(--x-size-padding-left-dropdown-toggle-default);
}
[dir="rtl"] .x-dropdown__toggle {
  padding-right: var(--x-size-padding-left-dropdown-toggle-default);
}
.x-dropdown__toggle {
  border-style: solid;
  border-top-width: var(--x-size-border-width-top-dropdown-toggle-default);
  border-bottom-width: var(--x-size-border-width-bottom-dropdown-toggle-default);
  border-radius: var(--x-size-border-radius-top-left-dropdown-default) var(--x-size-border-radius-top-right-dropdown-default) var(--x-size-border-radius-bottom-right-dropdown-default) var(--x-size-border-radius-bottom-left-dropdown-default);
  background: var(--x-color-background-dropdown-toggle-default);
  color: var(--x-color-text-dropdown-toggle-default);
  border-color: var(--x-color-border-dropdown-toggle-default);
  padding-top: var(--x-size-padding-top-dropdown-toggle-default);
  padding-bottom: var(--x-size-padding-bottom-dropdown-toggle-default);
  gap: var(--x-size-gap-dropdown-item-default);
  width: var(--x-size-width-dropdown-toggle-default);
  display: flex;
  flex-flow: row nowrap;
  margin: 0;
  cursor: pointer;
  overflow: var(--x-string-overflow-dropdown-toggle-default);
  box-shadow: var(--x-string-box-shadow-dropdown-default);
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-dropdown__toggle {
    gap: 0;
  }
  .x-dropdown__toggle > *:not(:last-child) {
    margin-right: var(--x-size-gap-dropdown-item-default);
  }
}
[dir="ltr"] .x-dropdown__toggle * + .x-icon:last-child {
  margin-left: auto;
}
[dir="rtl"] .x-dropdown__toggle * + .x-icon:last-child {
  margin-right: auto;
}
.x-dropdown__toggle-selected-value {
  color: var(--x-color-text-dropdown-toggle-default-selected);
}
[dir="ltr"] .x-dropdown__items-list {
  border-right-width: var(--x-size-border-width-right-dropdown-list-default);
}
[dir="rtl"] .x-dropdown__items-list {
  border-left-width: var(--x-size-border-width-right-dropdown-list-default);
}
[dir="ltr"] .x-dropdown__items-list {
  border-left-width: var(--x-size-border-width-left-dropdown-list-default);
}
[dir="rtl"] .x-dropdown__items-list {
  border-right-width: var(--x-size-border-width-left-dropdown-list-default);
}
.x-dropdown__items-list {
  background: var(--x-color-background-dropdown-default);
  box-sizing: border-box;
  min-width: var(--x-size-min-width-dropdown-list-default);
  position: absolute;
  top: calc(100% + var(--x-size-gap-dropdown-default));
  overflow: var(--x-string-overflow-dropdown-list-default);
  border-color: var(--x-color-border-dropdown-list-default);
  border-top-width: var(--x-size-border-width-top-dropdown-list-default);
  border-bottom-width: var(--x-size-border-width-bottom-dropdown-list-default);
  border-radius: var(--x-size-border-radius-top-left-dropdown-default) var(--x-size-border-radius-top-right-dropdown-default) var(--x-size-border-radius-bottom-right-dropdown-default) var(--x-size-border-radius-bottom-left-dropdown-default);
  border-style: solid;
  margin: 0;
  padding: 0;
  box-shadow: var(--x-string-box-shadow-dropdown-default);
  z-index: 1;
}
.x-dropdown__items-list:before, .x-dropdown__items-list:after {
  content: "";
  display: block;
  height: var(--x-size-padding-vertical-dropdown-list-default);
}
[dir="ltr"] .x-dropdown__item {
  padding-left: var(--x-size-padding-left-dropdown-item-default);
}
[dir="rtl"] .x-dropdown__item {
  padding-right: var(--x-size-padding-left-dropdown-item-default);
}
[dir="ltr"] .x-dropdown__item {
  padding-right: var(--x-size-padding-right-dropdown-item-default);
}
[dir="rtl"] .x-dropdown__item {
  padding-left: var(--x-size-padding-right-dropdown-item-default);
}
.x-dropdown__item {
  background: var(--x-color-background-dropdown-default);
  padding-top: var(--x-size-padding-top-dropdown-item-default);
  padding-bottom: var(--x-size-padding-bottom-dropdown-item-default);
  gap: var(--x-size-gap-dropdown-item-default);
  border: none;
  display: flex;
  flex-flow: row nowrap;
  justify-content: flex-start;
  text-align: left;
  width: 100%;
  margin: 0;
  white-space: nowrap;
  cursor: pointer;
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-dropdown__item {
    gap: 0;
  }
  .x-dropdown__item > *:not(:last-child) {
    margin-right: var(--x-size-gap-dropdown-item-default);
  }
}
.x-dropdown__item:hover, .x-dropdown__item--is-highlighted {
  color: var(--x-color-text-dropdown-item-default-hover);
  background-color: var(--x-color-background-dropdown-item-default-hover);
  font-weight: var(--x-number-font-weight-dropdown-item-default-hover);
  -webkit-text-decoration: var(--x-font-decoration-dropdown-item-default-hover);
          text-decoration: var(--x-font-decoration-dropdown-item-default-hover);
}
.x-dropdown__item--is-selected {
  color: var(--x-color-text-dropdown-item-default-selected);
  background-color: var(--x-color-background-dropdown-item-default-selected);
  font-weight: var(--x-number-font-weight-dropdown-item-default-selected);
  -webkit-text-decoration: var(--x-font-decoration-dropdown-item-default-selected);
          text-decoration: var(--x-font-decoration-dropdown-item-default-selected);
}
[dir="ltr"] .x-dropdown__item * + .x-icon:last-child {
  margin-left: auto;
}
[dir="rtl"] .x-dropdown__item * + .x-icon:last-child {
  margin-right: auto;
}
.x-dropdown--is-open {
  --x-color-background-dropdown-toggle-default: var(
    --x-color-background-dropdown-toggle-open-default
  );
}
[dir="ltr"] .x-dropdown--right .x-dropdown__items-list {
  right: 0;
}
[dir="rtl"] .x-dropdown--right .x-dropdown__items-list {
  left: 0;
}
:root {
  --x-size-gap-dropdown-card: var(--x-size-base-03);
  --x-size-border-radius-dropdown-card: var(--x-size-border-radius-base-s);
  --x-size-border-radius-top-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
  --x-size-border-radius-top-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
  --x-size-border-radius-bottom-right-dropdown-card: var(--x-size-border-radius-dropdown-card);
  --x-size-border-radius-bottom-left-dropdown-card: var(--x-size-border-radius-dropdown-card);
  --x-size-border-width-dropdown-list-card: var(--x-size-border-width-base);
  --x-size-border-width-top-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
  --x-size-border-width-right-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
  --x-size-border-width-bottom-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
  --x-size-border-width-left-dropdown-list-card: var(--x-size-border-width-dropdown-list-card);
}

.x-dropdown--card {
  --x-size-gap-dropdown-default: var(--x-size-gap-dropdown-card);
  --x-size-border-radius-dropdown-default: var(--x-size-border-radius-dropdown-card);
  --x-size-border-radius-top-left-dropdown-default: var(
    --x-size-border-radius-top-left-dropdown-card
  );
  --x-size-border-radius-top-right-dropdown-default: var(
    --x-size-border-radius-top-right-dropdown-card
  );
  --x-size-border-radius-bottom-right-dropdown-default: var(
    --x-size-border-radius-bottom-right-dropdown-card
  );
  --x-size-border-radius-bottom-left-dropdown-default: var(
    --x-size-border-radius-bottom-left-dropdown-card
  );
  --x-size-border-width-dropdown-list-default: var(--x-size-border-width-dropdown-list-card);
  --x-size-border-width-top-dropdown-list-default: var(
    --x-size-border-width-top-dropdown-list-card
  );
  --x-size-border-width-right-dropdown-list-default: var(
    --x-size-border-width-right-dropdown-list-card
  );
  --x-size-border-width-bottom-dropdown-list-default: var(
    --x-size-border-width-bottom-dropdown-list-card
  );
  --x-size-border-width-left-dropdown-list-default: var(
    --x-size-border-width-left-dropdown-list-card
  );
}
:root {
  --x-color-background-button-tertiary: var(--x-color-base-neutral-95);
  --x-color-border-button-tertiary: var(--x-color-base-neutral-70);
  --x-color-text-button-tertiary: var(--x-color-text-default);
  --x-size-border-width-button-tertiary: var(--x-size-border-width-base);
  --x-size-border-width-top-button-tertiary: var(--x-size-border-width-button-tertiary);
  --x-size-border-width-right-button-tertiary: var(--x-size-border-width-button-tertiary);
  --x-size-border-width-bottom-button-tertiary: var(--x-size-border-width-button-tertiary);
  --x-size-border-width-left-button-tertiary: var(--x-size-border-width-button-tertiary);
}
:root {
  --x-color-background-button-tertiary: var(--x-color-base-neutral-95);
  --x-color-border-button-tertiary: var(--x-color-base-neutral-70);
  --x-color-text-button-tertiary: var(--x-color-text-default);
  --x-size-border-width-button-tertiary: var(--x-size-border-width-base);
  --x-size-border-width-top-button-tertiary: var(--x-size-border-width-button-tertiary);
  --x-size-border-width-right-button-tertiary: var(--x-size-border-width-button-tertiary);
  --x-size-border-width-bottom-button-tertiary: var(--x-size-border-width-button-tertiary);
  --x-size-border-width-left-button-tertiary: var(--x-size-border-width-button-tertiary);
}

.x-button--tertiary.x-button,
.x-button--tertiary .x-button {
  --x-color-background-button-default: var(--x-color-background-button-tertiary);
  --x-color-border-button-default: var(--x-color-border-button-tertiary);
  --x-color-text-button-default: var(--x-color-text-button-tertiary);
  --x-size-border-width-top-button-default: var(--x-size-border-width-top-button-tertiary);
  --x-size-border-width-right-button-default: var(--x-size-border-width-right-button-tertiary);
  --x-size-border-width-bottom-button-default: var(--x-size-border-width-bottom-button-tertiary);
  --x-size-border-width-left-button-default: var(--x-size-border-width-left-button-tertiary);
}
:root {
  --x-color-background-button-secondary: transparent;
  --x-color-border-button-secondary: var(--x-color-border-button-default);
  --x-color-text-button-secondary: var(--x-color-border-button-default);
  --x-size-border-width-button-secondary: var(--x-size-border-width-base);
  --x-size-border-width-top-button-secondary: var(--x-size-border-width-button-secondary);
  --x-size-border-width-right-button-secondary: var(--x-size-border-width-button-secondary);
  --x-size-border-width-bottom-button-secondary: var(--x-size-border-width-button-secondary);
  --x-size-border-width-left-button-secondary: var(--x-size-border-width-button-secondary);
}
:root {
  --x-color-background-button-secondary: transparent;
  --x-color-border-button-secondary: var(--x-color-border-button-default);
  --x-color-text-button-secondary: var(--x-color-border-button-default);
  --x-size-border-width-button-secondary: var(--x-size-border-width-base);
  --x-size-border-width-top-button-secondary: var(--x-size-border-width-button-secondary);
  --x-size-border-width-right-button-secondary: var(--x-size-border-width-button-secondary);
  --x-size-border-width-bottom-button-secondary: var(--x-size-border-width-button-secondary);
  --x-size-border-width-left-button-secondary: var(--x-size-border-width-button-secondary);
}

.x-button--secondary.x-button,
.x-button--secondary .x-button {
  --x-color-background-button-default: var(--x-color-background-button-secondary);
  --x-color-border-button-default: var(--x-color-border-button-secondary);
  --x-color-text-button-default: var(--x-color-text-button-secondary);
  --x-size-border-width-top-button-default: var(--x-size-border-width-top-button-secondary);
  --x-size-border-width-right-button-default: var(--x-size-border-width-right-button-secondary);
  --x-size-border-width-bottom-button-default: var(--x-size-border-width-bottom-button-secondary);
  --x-size-border-width-left-button-default: var(--x-size-border-width-left-button-secondary);
}
:root {
  --x-size-border-radius-button-round: var(--x-size-border-radius-base-pill);
  --x-size-border-radius-top-left-button-round: var(--x-size-border-radius-button-round);
  --x-size-border-radius-top-right-button-round: var(--x-size-border-radius-button-round);
  --x-size-border-radius-bottom-right-button-round: var(--x-size-border-radius-button-round);
  --x-size-border-radius-bottom-left-button-round: var(--x-size-border-radius-button-round);
}
:root {
  --x-size-border-radius-button-round: var(--x-size-border-radius-base-pill);
  --x-size-border-radius-top-left-button-round: var(--x-size-border-radius-button-round);
  --x-size-border-radius-top-right-button-round: var(--x-size-border-radius-button-round);
  --x-size-border-radius-bottom-right-button-round: var(--x-size-border-radius-button-round);
  --x-size-border-radius-bottom-left-button-round: var(--x-size-border-radius-button-round);
}

.x-button--round.x-button,
.x-button--round .x-button {
  --x-size-border-radius-button-default: var(--x-size-border-radius-button-round);
  --x-size-border-radius-top-left-button-default: var(--x-size-border-radius-top-left-button-round);
  --x-size-border-radius-top-right-button-default: var(
    --x-size-border-radius-top-right-button-round
  );
  --x-size-border-radius-bottom-right-button-default: var(
    --x-size-border-radius-bottom-right-button-round
  );
  --x-size-border-radius-bottom-left-button-default: var(
    --x-size-border-radius-bottom-left-button-round
  );
  min-width: var(--x-size-height-button-default);
  --x-size-padding-left-button-default: 0;
  --x-size-padding-right-button-default: 0;
}
:root {
  --x-color-background-button-primary: var(--x-color-background-button-default);
  --x-color-border-button-primary: var(--x-color-border-button-default);
  --x-color-text-button-primary: var(--x-color-text-button-default);
  --x-size-border-width-button-primary: var(--x-size-border-width-base);
  --x-size-border-width-top-button-primary: var(--x-size-border-width-button-primary);
  --x-size-border-width-right-button-primary: var(--x-size-border-width-button-primary);
  --x-size-border-width-bottom-button-primary: var(--x-size-border-width-button-primary);
  --x-size-border-width-left-button-primary: var(--x-size-border-width-button-primary);
}
:root {
  --x-color-background-button-primary: var(--x-color-background-button-default);
  --x-color-border-button-primary: var(--x-color-border-button-default);
  --x-color-text-button-primary: var(--x-color-text-button-default);
  --x-size-border-width-button-primary: var(--x-size-border-width-base);
  --x-size-border-width-top-button-primary: var(--x-size-border-width-button-primary);
  --x-size-border-width-right-button-primary: var(--x-size-border-width-button-primary);
  --x-size-border-width-bottom-button-primary: var(--x-size-border-width-button-primary);
  --x-size-border-width-left-button-primary: var(--x-size-border-width-button-primary);
}

.x-button--primary.x-button,
.x-button--primary .x-button {
  --x-color-background-button-default: var(--x-color-background-button-primary);
  --x-color-border-button-default: var(--x-color-border-button-primary);
  --x-color-text-button-default: var(--x-color-text-button-primary);
  --x-size-border-width-top-button-default: var(--x-size-border-width-top-button-primary);
  --x-size-border-width-right-button-default: var(--x-size-border-width-right-button-primary);
  --x-size-border-width-bottom-button-default: var(--x-size-border-width-bottom-button-primary);
  --x-size-border-width-left-button-default: var(--x-size-border-width-left-button-primary);
}
:root {
  --x-size-border-radius-button-pill: var(--x-size-border-radius-base-pill);
  --x-size-border-radius-top-left-button-pill: var(--x-size-border-radius-button-pill);
  --x-size-border-radius-top-right-button-pill: var(--x-size-border-radius-button-pill);
  --x-size-border-radius-bottom-right-button-pill: var(--x-size-border-radius-button-pill);
  --x-size-border-radius-bottom-left-button-pill: var(--x-size-border-radius-button-pill);
}
:root {
  --x-size-border-radius-button-pill: var(--x-size-border-radius-base-pill);
  --x-size-border-radius-top-left-button-pill: var(--x-size-border-radius-button-pill);
  --x-size-border-radius-top-right-button-pill: var(--x-size-border-radius-button-pill);
  --x-size-border-radius-bottom-right-button-pill: var(--x-size-border-radius-button-pill);
  --x-size-border-radius-bottom-left-button-pill: var(--x-size-border-radius-button-pill);
}

.x-button--pill.x-button,
.x-button--pill .x-button {
  --x-size-border-radius-button-default: var(--x-size-border-radius-button-pill);
  --x-size-border-radius-top-left-button-default: var(--x-size-border-radius-top-left-button-pill);
  --x-size-border-radius-top-right-button-default: var(
    --x-size-border-radius-top-right-button-pill
  );
  --x-size-border-radius-bottom-right-button-default: var(
    --x-size-border-radius-bottom-right-button-pill
  );
  --x-size-border-radius-bottom-left-button-default: var(
    --x-size-border-radius-bottom-left-button-pill
  );
}
:root {
  --x-color-background-button-ghost: transparent;
  --x-color-border-button-ghost: transparent;
  --x-color-text-button-ghost: var(--x-color-base-lead);
}
:root {
  --x-color-background-button-ghost: transparent;
  --x-color-border-button-ghost: transparent;
  --x-color-text-button-ghost: var(--x-color-base-lead);
}

.x-button--ghost.x-button,
.x-button--ghost .x-button {
  --x-color-background-button-default: var(--x-color-background-button-ghost);
  --x-color-border-button-default: var(--x-color-border-button-ghost);
  --x-color-text-button-default: var(--x-color-text-button-ghost);
}

.x-button--ghost.x-button--ghost-start.x-button,
.x-button--ghost.x-button--ghost-start .x-button {
  --x-size-padding-left-button-default: 0;
}

.x-button--ghost.x-button--ghost-end.x-button,
.x-button--ghost.x-button--ghost-end .x-button {
  --x-size-padding-right-button-default: 0;
}
:root {
  --x-color-background-button-default: var(--x-color-base-lead);
  --x-color-border-button-default: var(--x-color-background-button-default);
  --x-color-text-button-default: var(--x-color-base-neutral-100);
  --x-size-border-radius-button-default: var(--x-size-border-radius-base-none);
  --x-size-border-radius-top-left-button-default: var(--x-size-border-radius-button-default);
  --x-size-border-radius-top-right-button-default: var(--x-size-border-radius-button-default);
  --x-size-border-radius-bottom-right-button-default: var(--x-size-border-radius-button-default);
  --x-size-border-radius-bottom-left-button-default: var(--x-size-border-radius-button-default);
  --x-size-border-width-button-default: var(--x-size-border-width-base);
  --x-size-border-width-top-button-default: var(--x-size-border-width-button-default);
  --x-size-border-width-right-button-default: var(--x-size-border-width-button-default);
  --x-size-border-width-bottom-button-default: var(--x-size-border-width-button-default);
  --x-size-border-width-left-button-default: var(--x-size-border-width-button-default);
  --x-size-height-button-default: var(--x-size-base-08);
  --x-size-padding-right-button-default: var(--x-size-base-05);
  --x-size-padding-left-button-default: var(--x-size-base-05);
  --x-size-gap-button-default: var(--x-size-base-03);
  --x-font-family-button-default: var(--x-font-family-text);
  --x-size-font-button-default: var(--x-size-font-text);
  --x-number-font-weight-button-default: var(--x-number-font-weight-base-bold);
  --x-size-line-height-button-default: var(--x-size-line-height-text);
}
:root {
  --x-color-background-button-default: var(--x-color-base-lead);
  --x-color-border-button-default: var(--x-color-background-button-default);
  --x-color-text-button-default: var(--x-color-base-neutral-100);
  --x-size-border-radius-button-default: var(--x-size-border-radius-base-none);
  --x-size-border-radius-top-left-button-default: var(--x-size-border-radius-button-default);
  --x-size-border-radius-top-right-button-default: var(--x-size-border-radius-button-default);
  --x-size-border-radius-bottom-right-button-default: var(--x-size-border-radius-button-default);
  --x-size-border-radius-bottom-left-button-default: var(--x-size-border-radius-button-default);
  --x-size-border-width-button-default: var(--x-size-border-width-base);
  --x-size-border-width-top-button-default: var(--x-size-border-width-button-default);
  --x-size-border-width-right-button-default: var(--x-size-border-width-button-default);
  --x-size-border-width-bottom-button-default: var(--x-size-border-width-button-default);
  --x-size-border-width-left-button-default: var(--x-size-border-width-button-default);
  --x-size-height-button-default: var(--x-size-base-08);
  --x-size-padding-right-button-default: var(--x-size-base-05);
  --x-size-padding-left-button-default: var(--x-size-base-05);
  --x-size-gap-button-default: var(--x-size-base-03);
  --x-font-family-button-default: var(--x-font-family-text);
  --x-size-font-button-default: var(--x-size-font-text);
  --x-number-font-weight-button-default: var(--x-number-font-weight-base-bold);
  --x-size-line-height-button-default: var(--x-size-line-height-text);
}

[dir="ltr"] .x-button {
  padding-right: var(--x-size-padding-right-button-default);
}

[dir="rtl"] .x-button {
  padding-left: var(--x-size-padding-right-button-default);
}

[dir="ltr"] .x-button {
  padding-left: var(--x-size-padding-left-button-default);
}

[dir="rtl"] .x-button {
  padding-right: var(--x-size-padding-left-button-default);
}

[dir="ltr"] .x-button {
  border-left-width: var(--x-size-border-width-left-button-default);
}

[dir="rtl"] .x-button {
  border-right-width: var(--x-size-border-width-left-button-default);
}

[dir="ltr"] .x-button {
  border-right-width: var(--x-size-border-width-right-button-default);
}

[dir="rtl"] .x-button {
  border-left-width: var(--x-size-border-width-right-button-default);
}

.x-button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  margin: 0;
  gap: var(--x-size-gap-button-default);
  min-height: var(--x-size-height-button-default);
  background-color: var(--x-color-background-button-default);
  border-color: var(--x-color-border-button-default);
  color: var(--x-color-text-button-default);
  border-style: solid;
  border-top-width: var(--x-size-border-width-top-button-default);
  border-bottom-width: var(--x-size-border-width-bottom-button-default);
  border-radius: var(--x-size-border-radius-top-left-button-default) var(--x-size-border-radius-top-right-button-default) var(--x-size-border-radius-bottom-right-button-default) var(--x-size-border-radius-bottom-left-button-default);
  font-family: var(--x-font-family-button-default);
  font-size: var(--x-size-font-button-default);
  font-weight: var(--x-number-font-weight-button-default);
  line-height: var(--x-size-line-height-button-default);
  cursor: pointer;
}
@media not all and (min-resolution: 0.001dpcm) {
  .x-button {
    gap: 0;
  }
  .x-button > *:not(:last-child) {
    margin-right: var(--x-size-gap-button-default);
  }
}
:root {
  --x-size-border-radius-button-card: var(--x-size-border-radius-base-s);
  --x-size-border-radius-top-left-button-card: var(--x-size-border-radius-button-card);
  --x-size-border-radius-top-right-button-card: var(--x-size-border-radius-button-card);
  --x-size-border-radius-bottom-right-button-card: var(--x-size-border-radius-button-card);
  --x-size-border-radius-bottom-left-button-card: var(--x-size-border-radius-button-card);
}
:root {
  --x-size-border-radius-button-card: var(--x-size-border-radius-base-s);
  --x-size-border-radius-top-left-button-card: var(--x-size-border-radius-button-card);
  --x-size-border-radius-top-right-button-card: var(--x-size-border-radius-button-card);
  --x-size-border-radius-bottom-right-button-card: var(--x-size-border-radius-button-card);
  --x-size-border-radius-bottom-left-button-card: var(--x-size-border-radius-button-card);
}

.x-button--card.x-button,
.x-button--card .x-button {
  --x-size-border-radius-button-default: var(--x-size-border-radius-button-card);
  --x-size-border-radius-top-left-button-default: var(--x-size-border-radius-top-left-button-card);
  --x-size-border-radius-top-right-button-default: var(
    --x-size-border-radius-top-right-button-card
  );
  --x-size-border-radius-bottom-right-button-default: var(
    --x-size-border-radius-bottom-right-button-card
  );
  --x-size-border-radius-bottom-left-button-default: var(
    --x-size-border-radius-bottom-left-button-card
  );
}
:root {
  --x-color-background-badge-default: var(--x-color-base-neutral-10);
  --x-color-text-badge-default: var(--x-color-base-neutral-100);
  --x-color-border-badge-default: var(--x-color-base-neutral-10);
  --x-size-border-radius-badge-default: var(--x-size-border-radius-base-pill);
  --x-size-border-width-badge-default: 0;
  --x-size-width-badge-default: 1.5em;
  --x-number-font-weight-badge-default: var(--x-number-font-weight-base-regular);
  --x-size-font-badge-default: var(--x-size-font-base-xs);
}
:root {
  --x-color-background-badge-default: var(--x-color-base-neutral-10);
  --x-color-text-badge-default: var(--x-color-base-neutral-100);
  --x-color-border-badge-default: var(--x-color-base-neutral-10);
  --x-size-border-radius-badge-default: var(--x-size-border-radius-base-pill);
  --x-size-border-width-badge-default: 0;
  --x-size-width-badge-default: 1.5em;
  --x-number-font-weight-badge-default: var(--x-number-font-weight-base-regular);
  --x-size-font-badge-default: var(--x-size-font-base-xs);
}

[dir="ltr"] .x-badge {
  right: calc(var(--x-size-width-badge-default) / 4);
}

[dir="rtl"] .x-badge {
  left: calc(var(--x-size-width-badge-default) / 4);
}

.x-badge {
  border-radius: var(--x-size-border-radius-badge-default);
  border-style: solid;
  border-width: var(--x-size-border-width-badge-default);
  font-size: var(--x-size-font-badge-default);
  font-weight: var(--x-number-font-weight-badge-default);
  box-sizing: border-box;
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: translate(50%, -50%);
  z-index: 1;
  /* We dont' want to have the button fully centered in the top right corner, the top right corner
  of the text is the one that should be aligned with the top right corner of the container. */
  top: calc(var(--x-size-width-badge-default) / 4);
  min-width: var(--x-size-width-badge-default);
  height: var(--x-size-width-badge-default);
  padding: 2px;
  background: var(--x-color-background-badge-default);
  color: var(--x-color-text-badge-default);
  border-color: var(--x-color-border-badge-default);
}
[dir="rtl"] .x-badge {
  transform: translate(-50%, -50%);
}

.x-badge-container {
  position: relative;
}
:root {
  --x-size-base-01: 2px;
  --x-size-base-02: 4px;
  --x-size-base-03: 8px;
  --x-size-base-04: 12px;
  --x-size-base-05: 16px;
  --x-size-base-06: 24px;
  --x-size-base-07: 32px;
  --x-size-base-08: 40px;
  --x-size-base-09: 48px;
  --x-size-base-10: 56px;
  --x-size-base-11: 64px;
  --x-size-base-12: 80px;
  --x-size-base-13: 80px;
  --x-size-base-14: 96px;
  --x-size-base-15: 128px;
  --x-size-base-16: 152px;
  --x-size-base-17: 184px;
  --x-size-base-18: 216px;
  --x-size-base-19: 280px;
  --x-size-base-20: 344px;
}
:root {
  --x-color-base-lead: #243d48;
  --x-color-base-auxiliary: #bfe1ec;
  --x-color-base-neutral-10: #1a1a1a;
  --x-color-base-neutral-35: #595959;
  --x-color-base-neutral-70: #b3b3b3;
  --x-color-base-neutral-95: #f2f2f2;
  --x-color-base-neutral-100: #ffffff;
  --x-color-base-accent: #0086b2;
  --x-color-base-enable: #00705c;
  --x-color-base-disable: #e11f26;
  --x-color-base-transparent: transparent;
}
:root {
  --x-size-border-radius-base-none: 0;
  --x-size-border-radius-base-s: var(--x-size-base-02);
  --x-size-border-radius-base-m: var(--x-size-base-06);
  --x-size-border-radius-base-pill: 99999px;
  --x-size-border-width-base: 1px;
}
:root {
  --x-string-align-items-suggestion-default: center;
  --x-color-text-suggestion-default: var(--x-color-text-default);
  --x-color-text-suggestion-matching-part-default: var(--x-color-base-neutral-35);
  --x-color-text-suggestion-default-matching: var(--x-color-text-suggestion-default);
  --x-color-text-suggestion-filter-default: var(--x-color-base-neutral-35);
  --x-color-background-suggestion-default: transparent;
  --x-color-border-suggestion-default: var(--x-color-text-suggestion-default);
  --x-color-text-suggestion-default-curated: var(--x-color-text-suggestion-default);
  --x-color-text-suggestion-matching-part-default-curated: var(
    --x-color-text-suggestion-matching-part-default
  );
  --x-color-text-suggestion-default-matching-curated: var(
    --x-color-text-suggestion-default-matching
  );
  --x-color-background-suggestion-default-curated: var(--x-color-background-suggestion-default);
  --x-color-border-suggestion-default-curated: var(--x-color-border-suggestion-default);
  --x-size-padding-top-suggestion-default: var(--x-size-base-01);
  --x-size-padding-right-suggestion-default: 0;
  --x-size-padding-bottom-suggestion-default: var(--x-size-base-02);
  --x-size-padding-left-suggestion-default: 0;
  --x-size-gap-suggestion-default: var(--x-size-base-03);
  --x-size-border-width-suggestion-default: 0;
  --x-size-border-width-top-suggestion-default: var(--x-size-border-width-suggestion-default);
  --x-size-border-width-right-suggestion-default: var(--x-size-border-width-suggestion-default);
  --x-size-border-width-bottom-suggestion-default: var(--x-size-border-width-suggestion-default);
  --x-size-border-width-left-suggestion-default: var(--x-size-border-width-suggestion-default);
  --x-size-border-radius-suggestion-default: var(--x-size-border-radius-base-none);
  --x-size-border-radius-top-left-suggestion-default: var(
    --x-size-border-radius-suggestion-default
  );
  --x-size-border-radius-top-right-suggestion-default: var(
    --x-size-border-radius-suggestion-default
  );
  --x-size-border-radius-bottom-right-suggestion-default: var(
    --x-size-border-radius-suggestion-default
  );
  --x-size-border-radius-bottom-left-suggestion-default: var(
    --x-size-border-radius-suggestion-default
  );
  --x-font-family-suggestion-default: var(--x-font-family-text);
  --x-size-font-suggestion-default: var(--x-size-font-text);
  --x-size-line-height-suggestion-default: var(--x-size-line-height-text);
  --x-number-font-weight-suggestion-default: var(--x-number-font-weight-text);
  --x-font-family-suggestion-matching-part-default: var(--x-font-family-suggestion-default);
  --x-size-font-suggestion-matching-part-default: var(--x-size-font-suggestion-default);
  --x-size-line-height-suggestion-matching-part-default: var(
    --x-size-line-height-suggestion-default
  );
  --x-number-font-weight-suggestion-matching-part-default: var(
    --x-number-font-weight-suggestion-default
  );
  --x-font-family-suggestion-default-matching: var(--x-font-family-suggestion-default);
  --x-size-font-suggestion-default-matching: var(--x-size-font-suggestion-default);
  --x-size-line-height-suggestion-default-matching: var(--x-size-line-height-suggestion-default);
  --x-number-font-weight-suggestion-default-matching: var(
    --x-number-font-weight-suggestion-default
  );
  --x-font-family-suggestion-filter-default: var(--x-font-family-suggestion-default);
  --x-size-font-suggestion-filter-default: var(--x-size-font-suggestion-default);
  --x-size-line-height-suggestion-filter-default: var(--x-size-line-height-suggestion-default);
  --x-number-font-weight-suggestion-filter-default: var(--x-number-font-weight-suggestion-default);
  --x-text-transform-suggestion-filter-default: none;
  --x-font-family-suggestion-default-curated: var(--x-font-family-suggestion-default);
  --x-size-font-suggestion-default-curated: var(--x-size-font-suggestion-default);
  --x-size-line-height-suggestion-default-curated: var(--x-size-line-height-suggestion-default);
  --x-number-font-weight-suggestion-default-curated: var(--x-number-font-weight-suggestion-default);
  --x-font-family-suggestion-matching-part-default-curated: var(
    --x-font-family-suggestion-matching-part-default
  );
  --x-size-font-suggestion-matching-part-default-curated: var(
    --x-size-font-suggestion-matching-part-default
  );
  --x-size-line-height-suggestion-matching-part-default-curated: var(
    --x-size-line-height-suggestion-matching-part-default
  );
  --x-number-font-weight-suggestion-matching-part-default-curated: var(
    --x-number-font-weight-suggestion-matching-part-default
  );
  --x-font-family-suggestion-default-matching-curated: var(
    --x-font-family-suggestion-default-matching
  );
  --x-size-font-suggestion-default-matching-curated: var(--x-size-font-suggestion-default-matching);
  --x-size-line-height-suggestion-default-matching-curated: var(
    --x-size-line-height-suggestion-default-matching
  );
  --x-number-font-weight-suggestion-default-matching-curated: var(
    --x-number-font-weight-suggestion-default-matching
  );
}