@ncds/ui-admin 0.0.7 → 0.0.8

package/dist/ui-admin/assets/styles/style.css

@@ -1,1438 +0,0 @@
-:root {
-  --primary-red-50: #fffafd;
-  --primary-red-100: #ffeaee;
-  --primary-red-200: #fecbd2;
-  --primary-red-300: #ff9fa5;
-  --primary-red-400: #f86f76;
-  --primary-red-450: #f7444e;
-  --primary-red-500: #ec1d31;
-  --primary-red-600: #dc0a2b;
-  --primary-red-700: #a60013;
-  --base-white: #ffffff;
-  --base-black: #000000;
-  --gray-50: #f6f7f9;
-  --gray-100: #eaecf0;
-  --gray-200: #d3d4d8;
-  --gray-300: #a4a5a8;
-  --gray-400: #757678;
-  --gray-450: #5e5e60;
-  --gray-500: #464748;
-  --gray-600: #2f2f30;
-  --gray-700: #171818;
-  --green-50: #f6fef9;
-  --green-100: #d3f8df;
-  --green-200: #aaf0c4;
-  --green-300: #73e2a3;
-  --green-400: #3ccb7f;
-  --green-500: #099250;
-  --green-600: #087443;
-  --green-700: #095c37;
-  --blue-50: #f5faff;
-  --blue-100: #e0efff;
-  --blue-200: #b2ddff;
-  --blue-300: #84caff;
-  --blue-400: #53b1fd;
-  --blue-500: #1570ef;
-  --blue-600: #1849a9;
-  --blue-700: #194185;
-  --pink-50: #fef6fb;
-  --pink-100: #fce7f6;
-  --pink-200: #fcceee;
-  --pink-300: #faa7e0;
-  --pink-400: #f670c7;
-  --pink-500: #dd2590;
-  --pink-600: #c11574;
-  --pink-700: #851651;
-  --orange-50: #fefaf5;
-  --orange-100: #fdead7;
-  --orange-200: #f9dbaf;
-  --orange-300: #f7b27a;
-  --orange-400: #f38744;
-  --orange-500: #e4501e;
-  --orange-600: #b93815;
-  --orange-700: #772917;
-  --focus-ring-4px-primary-100: 0px 0px 0px 3px #ffeaee;
-  --focus-ring-4px-gray-100: 0px 0px 0px 3px #f2f4f7;
-  --focus-ring-4px-error-100: 0px 0px 0px 3px #fee4e2;
-  --shadow-xs: 0px 1px 2px 0px #1018280d;
-  --shadow-xs-focused-3px-gray-100: 0px 1px 2px 0px rgba(16, 24, 40, 0.05), 0px 0px 0px 3px #f2f4f7;
-  --shadow-xs-focused-4px-primary-color-100: 0px 1px 2px 0px #1018280d, 0px 0px 0px 4px #ffeaee;
-  --shadow-xs-focused-4px-gray-100: 0px 1px 2px 0px #1018280d, 0px 0px 0px 4px #f2f4f7;
-  --shadow-xs-focused-4px-error-100: 0px 1px 2px 0px #1018280d, 0px 0px 0px 4px #fee4e2;
-  --shadow-sm: 0px 1px 3px 0px #1018281a, 0px 1px 2px 0px #1018280f;
-  --shadow-sm-focused-4px-primary-color-100: 0px 1px 2px 0px #1018280d, 0px 0px 0px 4px #ffeaee;
-  --shadow-sm-focused-4px-gray-100: 0px 1px 3px 0px #1018281a, 0px 1px 2px 0px #1018280f, 0px 0px 0px 4px #f2f4f7;
-  --shadow-sm-focused-4px-error-100: 0px 0px 0px 4px #fee4e2, 0px 1px 2px 0px #1018280d;
-  --shadow-md: 0px 4px 8px -2px #1018281a, 0px 2px 4px -2px #1018280f;
-  --shadow-lg: 0px 12px 16px -4px #10182814, 0px 4px 6px -2px #10182808;
-  --shadow-xl: 0px 20px 24px -4px #10182814, 0px 8px 8px -4px #10182808;
-  --shadow-2xl: 0px 24px 48px -12px #1018282e;
-  --shadow-3xl: 0px 32px 64px -12px #10182824;
-  --font-families-commerce-sans: Commerce Sans;
-  --line-heights-display-xl: 76;
-  --line-heights-display-lg: 60;
-  --line-heights-display-md: 46;
-  --line-heights-display-sm: 38;
-  --line-heights-display-xs: 32;
-  --line-heights-xl: 30;
-  --line-heights-lg: 28;
-  --line-heights-md: 24;
-  --line-heights-sm: 22;
-  --line-heights-xs: 18;
-  --line-heights-xxs: 14;
-  --font-weights-commerce-sans-0: regular;
-  --font-weights-commerce-sans-1: medium;
-  --font-weights-commerce-sans-2: bold;
-  --font-size-xxs: 11px;
-  --font-size-xs: 13px;
-  --font-size-sm: 14px;
-  --font-size-md: 16px;
-  --font-size-lg: 18px;
-  --font-size-xl: 20px;
-  --font-size-display-xs: 24px;
-  --font-size-display-sm: 30px;
-  --font-size-display-md: 36px;
-  --font-size-display-lg: 48px;
-  --font-size-display-xl: 60px;
-}
-
-@font-face {
-  font-family: "CommerceSans";
-  font-weight: 400;
-  font-style: normal;
-  src: url("https://rlyiz0wtg.toastcdn.net/CommerceSans-Regular.woff") format("woff"), url("https://rlyiz0wtg.toastcdn.net/CommerceSans-Regular.woff2") format("woff2");
-  font-display: swap;
-}
-@font-face {
-  font-family: "CommerceSans";
-  font-weight: 500;
-  font-style: normal;
-  src: url("https://rlyiz0wtg.toastcdn.net/CommerceSans-Medium.woff") format("woff"), url("https://rlyiz0wtg.toastcdn.net/CommerceSans-Medium.woff2") format("woff2");
-  font-display: swap;
-}
-@font-face {
-  font-family: "CommerceSans";
-  font-weight: 700;
-  font-style: normal;
-  src: url("https://rlyiz0wtg.toastcdn.net/CommerceSans-Bold.woff") format("woff"), url("https://rlyiz0wtg.toastcdn.net/CommerceSans-Bold.woff2") format("woff2");
-  font-display: swap;
-}
-* {
-  margin: 0;
-}
-*, *::before, *::after {
-  box-sizing: border-box;
-}
-
-body {
-  font-family: "CommerceSans", sans-serif;
-  font-size: 16px;
-  line-height: 1.5;
-}
-
-ol,
-ul {
-  list-style: none;
-}
-
-blockquote,
-q {
-  quotes: none;
-}
-
-blockquote:before,
-blockquote:after,
-q:before,
-q:after {
-  content: "";
-  content: none;
-}
-
-table {
-  border-collapse: collapse;
-  border-spacing: 0;
-}
-
-.a11y {
-  position: absolute;
-  overflow: hidden;
-  margin: -1px;
-  width: 1px;
-  height: 1px;
-  clip: rect(0, 0, 0, 0);
-}
-
-.bold {
-  font-weight: bold;
-}
-
-.ncua-link {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  gap: 8px;
-}
-.ncua-link--link-gray {
-  color: var(--gray-500);
-}
-.ncua-link--link-gray:hover, .ncua-link--link-gray:hover:not(.is-disable) {
-  color: var(--gray-700);
-}
-.ncua-link--link-gray.is-disable {
-  color: var(--gray-200);
-  pointer-events: none;
-  cursor: default;
-}
-.ncua-link--link-color {
-  color: var(--blue-500);
-}
-.ncua-link--link-color:hover, .ncua-link--link-color:hover:not(.is-disable) {
-  color: var(--blue-600);
-}
-.ncua-link--link-color.is-disable {
-  color: var(--gray-200);
-  pointer-events: none;
-  cursor: default;
-}
-.ncua-link--sm {
-  font-size: var(--font-size-xs);
-}
-.ncua-link--md {
-  font-size: var(--font-size-sm);
-}
-.ncua-link--lg {
-  font-size: var(--font-size-md);
-}
-.ncua-link__icon {
-  width: 20px;
-  height: 20px;
-}
-:where(.ncua-link--lg) .ncua-link__icon {
-  width: 24px;
-  height: 24px;
-}
-
-:root {
-  --button-height-xxs: 28px;
-  --button-height-xs: 32px;
-  --button-height-sm: 36px;
-  --button-height-md: 40px;
-}
-
-.ncua-btn {
-  border: 0;
-  padding: 0;
-  background-color: transparent;
-  cursor: pointer;
-  display: inline-flex;
-  justify-content: center;
-  align-items: center;
-  text-align: center;
-  gap: 8px;
-  line-height: normal;
-  color: inherit;
-}
-.ncua-btn__label {
-  pointer-events: none;
-}
-.ncua-btn svg {
-  pointer-events: none;
-}
-.ncua-btn--primary {
-  box-shadow: var(--shadow-xs);
-  background-color: var(--primary-red-450);
-  border: 1px solid var(--primary-red-500);
-  color: var(--base-white);
-}
-.ncua-btn--primary:hover:not([disabled], .is-disable) {
-  background-color: var(--primary-red-600);
-  border: 1px solid var(--primary-red-700);
-  color: var(--base-white);
-}
-.ncua-btn--primary:focus:not([disabled], .is-disabled) {
-  background-color: var(--primary-red-450);
-  border: 1px solid var(--primary-red-500);
-  color: var(--base-white);
-  box-shadow: var(--shadow-xs-focused-4px-primary-color-100);
-}
-.ncua-btn--primary:disabled, .ncua-btn--primary.is-disable {
-  background-color: var(--primary-red-100);
-  border: 1px solid var(--primary-red-200);
-  color: var(--base-white);
-  cursor: default;
-}
-.ncua-btn--secondary {
-  box-shadow: var(--shadow-xs);
-  background-color: var(--primary-red-50);
-  border: 1px solid var(--primary-red-200);
-  color: var(--primary-red-600);
-}
-.ncua-btn--secondary:hover:not([disabled], .is-disable) {
-  background-color: var(--primary-red-100);
-  border: 1px solid var(--primary-red-300);
-  color: var(--primary-red-700);
-}
-.ncua-btn--secondary:focus:not([disabled], .is-disabled) {
-  background-color: var(--primary-red-50);
-  border: 1px solid var(--primary-red-200);
-  color: var(--primary-red-600);
-  box-shadow: var(--shadow-xs-focused-4px-primary-color-100);
-}
-.ncua-btn--secondary:disabled, .ncua-btn--secondary.is-disable {
-  background-color: var(--primary-red-50);
-  border: 1px solid var(--primary-red-100);
-  color: var(--primary-red-300);
-  cursor: default;
-}
-.ncua-btn--secondary-gray {
-  box-shadow: var(--shadow-xs);
-  background-color: var(--base-white);
-  border: 1px solid var(--gray-200);
-  color: var(--gray-700);
-}
-.ncua-btn--secondary-gray:hover:not([disabled], .is-disable) {
-  background-color: var(--gray-50);
-  border: 1px solid var(--gray-200);
-  color: var(--gray-700);
-}
-.ncua-btn--secondary-gray:focus:not([disabled], .is-disabled) {
-  background-color: var(--base-white);
-  border: 1px solid var(--gray-200);
-  color: var(--gray-700);
-  box-shadow: var(--shadow-xs-focused-4px-gray-100);
-}
-.ncua-btn--secondary-gray:disabled, .ncua-btn--secondary-gray.is-disable {
-  background-color: var(--base-white);
-  border: 1px solid var(--gray-200);
-  color: var(--gray-200);
-  cursor: default;
-}
-.ncua-btn--tertiary {
-  background-color: var(--base-white);
-  color: var(--blue-500);
-}
-.ncua-btn--tertiary:hover:not([disabled], .is-disable) {
-  background-color: var(--blue-50);
-  color: var(--blue-600);
-}
-.ncua-btn--tertiary:disabled, .ncua-btn--tertiary.is-disable {
-  background-color: var(--base-white);
-  color: var(--gray-200);
-  cursor: default;
-}
-.ncua-btn--tertiary-gray {
-  background-color: var(--base-white);
-  color: var(--gray-700);
-}
-.ncua-btn--tertiary-gray:hover:not([disabled], .is-disable) {
-  background-color: var(--gray-50);
-  color: var(--gray-700);
-}
-.ncua-btn--tertiary-gray:disabled, .ncua-btn--tertiary-gray.is-disable {
-  background-color: var(--base-white);
-  color: var(--base-white);
-  cursor: default;
-}
-.ncua-btn--link {
-  color: var(--blue-500);
-}
-.ncua-btn--link:hover:not([disabled], .is-disable) {
-  color: var(--blue-600);
-}
-.ncua-btn--link:disabled, .ncua-btn--link.is-disable {
-  color: var(--gray-200);
-  cursor: default;
-}
-.ncua-btn--link-gray {
-  color: var(--gray-500);
-}
-.ncua-btn--link-gray:hover:not([disabled], .is-disable) {
-  color: var(--gray-700);
-}
-.ncua-btn--link-gray:disabled, .ncua-btn--link-gray.is-disable {
-  color: var(--gray-200);
-  cursor: default;
-}
-.ncua-btn--destructive {
-  box-shadow: var(--shadow-xs);
-  background-color: var(--primary-red-500);
-  border: 1px solid var(--primary-red-200);
-  color: var(--base-white);
-}
-.ncua-btn--destructive:hover:not([disabled], .is-disable) {
-  background-color: var(--primary-red-700);
-  border: 1px solid var(--primary-red-300);
-  color: var(--base-white);
-}
-.ncua-btn--destructive:focus:not([disabled], .is-disabled) {
-  background-color: var(--primary-red-500);
-  border: 1px solid var(--primary-red-600);
-  color: var(--base-white);
-}
-.ncua-btn--destructive:disabled, .ncua-btn--destructive.is-disable {
-  background-color: var(--primary-red-50);
-  border: 1px solid var(--primary-red-300);
-  color: var(--primary-red-300);
-  cursor: default;
-}
-.ncua-btn--xxs {
-  padding: 5px 8px;
-  height: var(--button-height-xxs);
-  font-size: var(--font-size-xxs);
-  border-radius: 6px;
-  font-weight: var(--font-weights-commerce-sans-1);
-}
-.ncua-btn--xs {
-  padding: 5px 12px;
-  height: var(--button-height-xs);
-  font-size: var(--font-size-xs);
-  border-radius: 6px;
-  font-weight: var(--font-weights-commerce-sans-1);
-}
-.ncua-btn--sm {
-  padding: 8px 14px;
-  height: var(--button-height-sm);
-  font-size: var(--font-size-sm);
-  border-radius: 8px;
-  font-weight: var(--font-weights-commerce-sans-2);
-}
-.ncua-btn--md {
-  padding: 10px 16px;
-  height: var(--button-height-md);
-  font-size: var(--font-size-sm);
-  border-radius: 8px;
-  font-weight: var(--font-weights-commerce-sans-2);
-}
-.ncua-btn.is-full {
-  width: 100%;
-}
-.ncua-btn.is-link {
-  padding: 0;
-  border: 0;
-  box-shadow: none;
-}
-.ncua-btn--link-gray {
-  color: var(--gray-500);
-}
-.ncua-btn--link-gray:hover, .ncua-btn--link-gray:hover:not(.is-disable) {
-  color: var(--gray-700);
-}
-.ncua-btn--link-gray.is-disable {
-  color: var(--gray-200);
-  pointer-events: none;
-  cursor: default;
-}
-.ncua-btn--link-color {
-  color: var(--blue-500);
-}
-.ncua-btn--link-color:hover, .ncua-btn--link-color:hover:not(.is-disable) {
-  color: var(--blue-600);
-}
-.ncua-btn--link-color.is-disable {
-  color: var(--gray-200);
-  pointer-events: none;
-  cursor: default;
-}
-.ncua-btn svg {
-  flex: none;
-}
-.ncua-btn span {
-  z-index: 0;
-}
-
-[class*=btn--link] {
-  padding: 0;
-  height: auto !important;
-  background-color: transparent !important;
-  vertical-align: top;
-  font-weight: var(--font-weights-commerce-sans-1);
-}
-
-.ncua-btn--xxs.only-icon {
-  padding: 0;
-  width: var(--button-height-xxs);
-}
-
-.ncua-btn--xs.only-icon {
-  padding: 0;
-  width: var(--button-height-xs);
-}
-
-.ncua-btn--sm.only-icon {
-  padding: 0;
-  width: var(--button-height-sm);
-}
-
-.ncua-btn--md.only-icon {
-  padding: 0;
-  width: var(--button-height-md);
-}
-
-.has-underline {
-  text-decoration: underline;
-  text-underline-offset: 2px;
-}
-
-.ncua-button-group {
-  display: inline-flex;
-  overflow: hidden;
-  color: var(--gray-400);
-}
-.ncua-button-group__item {
-  color: inherit;
-  border: none;
-  outline: none;
-  display: inline-flex;
-  justify-content: center;
-  align-items: center;
-  box-sizing: border-box;
-  cursor: pointer;
-  gap: 8px;
-  background-color: var(--base-white);
-}
-.ncua-button-group__item[href] {
-  text-decoration: none;
-}
-.ncua-button-group__item[href]:hover {
-  color: inherit;
-  text-decoration: none;
-}
-.ncua-button-group__item:first-child {
-  padding-left: 0;
-}
-.ncua-button-group__item:last-child {
-  padding-right: 0;
-}
-.ncua-button-group__item.is-active {
-  color: var(--gray-600);
-}
-.ncua-button-group.has-border {
-  border: 1px solid var(--gray-200);
-  border-radius: 8px;
-  box-shadow: var(--shadow-xs);
-}
-.ncua-button-group.has-border .ncua-button-group__item:hover {
-  background-color: var(--gray-50);
-}
-.ncua-button-group.has-border .ncua-button-group__item:focus {
-  color: var(--gray-600);
-}
-.ncua-button-group.has-border .ncua-button-group__item.is-disabled {
-  background-color: var(--base-white);
-  color: var(--gray-200);
-}
-.ncua-button-group.has-border .ncua-button-group__item:nth-child(n+2) {
-  border-left: 1px solid var(--gray-200);
-}
-.ncua-button-group.has-border .ncua-button-group__item svg {
-  display: block;
-}
-.ncua-button-group:not(.has-border) .ncua-button-group__item {
-  position: relative;
-}
-.ncua-button-group:not(.has-border) .ncua-button-group__item:not(:last-child):after {
-  content: "";
-  position: absolute;
-  right: 0;
-  top: 50%;
-  transform: translateY(-50%);
-  width: 1px;
-  height: 12px;
-  background-color: var(--gray-200);
-}
-.ncua-button-group--xs .ncua-button-group__item {
-  padding: 5px 12px;
-}
-.ncua-button-group--sm .ncua-button-group__item {
-  padding: 5px 16px;
-}
-.ncua-button-group--md .ncua-button-group__item {
-  padding: 7px 16px;
-}
-.ncua-button-group--lg .ncua-button-group__item {
-  padding: 9px 16px;
-}
-.ncua-button-group--xs .ncua-button-group__item {
-  font-size: var(--font-size-xxs);
-  font-weight: var(--font-weights-commerce-sans-1);
-}
-.ncua-button-group--sm .ncua-button-group__item {
-  font-size: var(--font-size-xs);
-  font-weight: var(--font-weights-commerce-sans-1);
-}
-.ncua-button-group--md .ncua-button-group__item {
-  font-size: var(--font-size-sm);
-  font-weight: var(--font-weights-commerce-sans-1);
-}
-.ncua-button-group--lg .ncua-button-group__item {
-  font-size: var(--font-size-sm);
-  font-weight: var(--font-weights-commerce-sans-2);
-}
-
-.ncua-btn-close {
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  color: var(--gray-400);
-  border-radius: 8px;
-  cursor: pointer;
-}
-.ncua-btn-close:hover {
-  background-color: var(--gray-50);
-  color: var(--gray-500);
-}
-.ncua-btn-close:focus {
-  background-color: var(--gray-50);
-}
-.ncua-btn-close--sm {
-  width: 36px;
-  height: 36px;
-}
-.ncua-btn-close--md {
-  width: 40px;
-  height: 40px;
-}
-.ncua-btn-close--lg {
-  width: 44px;
-  height: 44px;
-}
-.ncua-btn-close--dark {
-  color: var(--gray-100);
-}
-.ncua-btn-close--dark:hover {
-  color: var(--base-white);
-  background-color: rgba(255, 255, 255, 0.2);
-}
-.ncua-btn-close--dark:focus {
-  color: var(--gray-100);
-  background-color: rgba(255, 255, 255, 0.2);
-}
-
-.ncua-checkbox-input {
-  position: relative;
-  flex: none;
-  display: inline-block;
-  width: 16px;
-  height: 16px;
-  line-height: 1;
-  background-color: var(--base-white);
-}
-.ncua-checkbox-input :where(input) {
-  position: absolute;
-  top: 0;
-  left: 0;
-  z-index: 1;
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-  margin: 0;
-  width: 100%;
-  height: 100%;
-  border: 1px solid var(--gray-200);
-  font: inherit;
-  border-radius: 4px;
-}
-.ncua-checkbox-input :where(input):focus {
-  border-color: var(--gray-400);
-  box-shadow: var(--focus-ring-4px-gray-100);
-}
-.ncua-checkbox-input :where(input):checked {
-  border-color: var(--gray-700);
-  outline: none;
-}
-.ncua-checkbox-input :where(input):disabled {
-  border-color: var(--gray-200);
-}
-.ncua-checkbox-input.destructive :where(input) {
-  border-color: var(--primary-red-600);
-}
-.ncua-checkbox-input.destructive :where(input):focus {
-  border-color: var(--primary-red-600);
-  box-shadow: var(--shadow-xs-focused-4px-error-100);
-}
-.ncua-checkbox-input:hover {
-  border-color: var(--gray-600);
-  background-color: var(--gray-100);
-  border-radius: 4px;
-}
-.ncua-checkbox-input__ico {
-  position: absolute;
-  top: 0;
-  left: 0;
-  display: inline-flex;
-  justify-content: center;
-  align-items: center;
-  width: 100%;
-  height: 100%;
-}
-.ncua-checkbox-input :not(input:checked + .ncua-checkbox-input__ico) > svg {
-  display: none;
-}
-.ncua-checkbox-input :disabled + .ncua-checkbox-input__ico {
-  background-color: var(--gray-100);
-  border-radius: 4px;
-}
-
-.ncua-checkbox-field {
-  position: relative;
-  line-height: 18px;
-  font-weight: var(--font-weights-commerce-sans-0);
-  font-size: var(--font-size-xs);
-  cursor: pointer;
-}
-.ncua-checkbox-field__text {
-  display: block;
-  color: var(--gray-500);
-  font-weight: var(--font-weights-commerce-sans-1);
-}
-.ncua-checkbox-field__support-text {
-  color: var(--gray-400);
-}
-.ncua-checkbox-field:hover .ncua-checkbox-field__input {
-  border-color: var(--gray-700);
-  background-color: var(--gray-50);
-  border-radius: 4px;
-}
-.ncua-checkbox-field--md {
-  font-size: var(--font-size-sm);
-  line-height: 22px;
-}
-.ncua-checkbox-field.has-text {
-  display: inline-flex;
-  gap: 6px;
-}
-.ncua-checkbox-field.has-text .ncua-checkbox-field__input {
-  transform: translateY(1px);
-}
-.ncua-checkbox-field.has-text.ncua-checkbox-field--md .ncua-checkbox-field__input {
-  transform: translateY(3px);
-}
-
-.ncua-hint-text {
-  color: var(--gray-400);
-}
-.ncua-hint-text.destructive {
-  color: var(--primary-red-600);
-}
-
-.ncua-input {
-  display: inline-flex;
-  flex-direction: column;
-  line-height: normal;
-  vertical-align: top;
-}
-.ncua-input > *:last-child {
-  margin-bottom: 0;
-}
-.ncua-input__label {
-  margin-bottom: 4px;
-}
-.ncua-input__content {
-  box-shadow: var(--shadow-xs);
-  border-radius: 8px;
-}
-.ncua-input:where(:not([class*=textarea])) .ncua-input__content {
-  display: flex;
-}
-.ncua-input__field {
-  display: flex;
-  align-items: center;
-  background-color: var(--base-white);
-  border: 1px solid var(--gray-200);
-  position: relative;
-  flex: 1;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  line-height: 1;
-}
-.ncua-input:focus-within :where(.ncua-input__field) {
-  border-color: var(--gray-400);
-  box-shadow: var(--shadow-xs-focused-3px-gray-100);
-  z-index: 1;
-}
-.ncua-input input {
-  width: 100%;
-  padding: 0;
-  border: 0;
-  color: var(--gray-700);
-  font-size: var(--font-size-sm);
-  line-height: 1rem;
-  background-color: var(--base-white);
-}
-.ncua-input input::-webkit-input-placeholder {
-  color: var(--gray-300);
-}
-.ncua-input input::-moz-placeholder {
-  color: var(--gray-300);
-}
-.ncua-input input:-ms-input-placeholder {
-  color: var(--gray-300);
-}
-.ncua-input input::-ms-input-placeholder {
-  color: var(--gray-300);
-}
-.ncua-input input::placeholder {
-  transform: translateY(1px);
-  color: var(--gray-300);
-}
-.ncua-input input:focus {
-  outline: none;
-}
-.ncua-input--xs {
-  gap: 4px;
-  padding: 5px 10px;
-  font-size: var(--font-size-xxs);
-  border-radius: 6px;
-}
-.ncua-input--xs input {
-  font-size: var(--font-size-xs);
-}
-.ncua-input--md {
-  gap: 6px;
-  padding: 7px 12px;
-  font-size: var(--font-size-sm);
-  border-radius: 6px;
-}
-.ncua-input--md input {
-  font-size: var(--font-size-sm);
-}
-.ncua-input input:-webkit-autofill, .ncua-input input:-webkit-autofill:hover, .ncua-input input:-webkit-autofill:focus, .ncua-input input:-webkit-autofill:active {
-  -webkit-box-shadow: 0 0 0 30px var(--base-white) inset !important;
-}
-.ncua-input__icon-wrap {
-  padding: 0;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  background: transparent;
-  border: none;
-}
-.ncua-input__clear {
-  border-radius: 10px;
-  background: var(--gray-100);
-}
-.ncua-input__clear-icon {
-  padding: 2px;
-  border-radius: 10px;
-}
-.ncua-input__validation-icon {
-  color: var(--green-500);
-}
-.ncua-input__destructive-icon {
-  color: var(--primary-red-600);
-}
-.ncua-input__password-icon {
-  color: var(--gray-300);
-}
-.ncua-input__left-icon {
-  margin-right: 8px;
-}
-.ncua-input__right-icon {
-  margin-left: 8px;
-}
-.ncua-input.destructive .ncua-input__field {
-  border-color: var(--primary-red-600);
-}
-.ncua-input.destructive:where(:focus-within) .ncua-input__field {
-  box-shadow: var(--shadow-xs-focused-4px-error-100);
-}
-.ncua-input.is-disabled .ncua-input__content > :not(button) {
-  background-color: var(--gray-50);
-  border-color: var(--gray-200);
-}
-.ncua-input.is-disabled .ncua-input__field {
-  overflow: hidden;
-}
-.ncua-input.is-disabled .ncua-input__field::after {
-  position: absolute;
-  top: 0;
-  left: 0;
-  content: "";
-  width: 100%;
-  height: 100%;
-  background: inherit;
-  opacity: 0.5;
-}
-.ncua-input.is-disabled input {
-  color: var(--gray-300);
-  background-color: inherit;
-}
-.ncua-input.is-disabled .ncua-input__destructive-ico {
-  display: none;
-}
-.ncua-input.is-disabled .ncua-input__button {
-  color: var(--gray-200);
-}
-.ncua-input.full-width {
-  width: 100%;
-}
-
-.ncua-input__leading-text {
-  display: flex;
-  align-items: center;
-  background-color: var(--base-white);
-  border: 1px solid var(--gray-200);
-  border-radius: 6px 0 0 6px;
-  color: var(--gray-400);
-  font-size: var(--font-size-sm);
-  border-width: 1px 0 1px 1px;
-}
-.ncua-input__leading-text--xs {
-  padding: 5px 10px;
-}
-.ncua-input__leading-text--md {
-  padding: 7px 12px;
-}
-.ncua-input__leading-text + .ncua-input__field {
-  border-radius: 0 6px 6px 0;
-}
-
-.ncua-input__trailing-button .ncua-input__button {
-  display: flex;
-  align-items: center;
-  background-color: var(--base-white);
-  border: 1px solid var(--gray-200);
-  border-radius: 0 6px 6px 0;
-  border-left-width: 0;
-  color: var(--gray-700);
-  font-weight: var(--font-weight-commerce-sans-2);
-}
-.ncua-input__trailing-button .ncua-input__button--xs {
-  padding: 5px 10px;
-}
-.ncua-input__trailing-button .ncua-input__button--md {
-  padding: 7px 12px;
-}
-.ncua-input__trailing-button .ncua-input__button:not(:disabled) {
-  cursor: pointer;
-}
-.ncua-input__trailing-button .ncua-input__field {
-  border-top-right-radius: 0;
-  border-bottom-right-radius: 0;
-}
-
-.ncua-label {
-  display: flex;
-  gap: 4px;
-  color: var(--gray-600);
-  font-weight: var(--font-weight-commerce-sans-1);
-}
-:where(.ncua-label.is-required)::before {
-  content: "*";
-  color: var(--primary-red-500);
-}
-
-.ncua-radio-input {
-  position: relative;
-  flex: none;
-  display: inline-block;
-  width: 16px;
-  height: 16px;
-  line-height: 1;
-  background-color: var(--base-white);
-}
-.ncua-radio-input :where(input) {
-  position: absolute;
-  top: 0;
-  left: 0;
-  z-index: 1;
-  -webkit-appearance: none;
-  -moz-appearance: none;
-  appearance: none;
-  margin: 0;
-  width: 100%;
-  height: 100%;
-  border: 1px solid var(--gray-200);
-  font: inherit;
-  border-radius: 50%;
-}
-.ncua-radio-input :where(input):focus {
-  border-color: var(--gray-400);
-  box-shadow: var(--focus-ring-4px-gray-100);
-}
-.ncua-radio-input :where(input):checked {
-  border-color: var(--gray-700);
-  outline: none;
-}
-.ncua-radio-input :where(input):disabled {
-  border-color: var(--gray-200);
-}
-.ncua-radio-input :where(input)::before {
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  content: "";
-  transform: translate(-50%, -50%);
-  width: 6px;
-  height: 6px;
-  border-radius: 50%;
-}
-.ncua-radio-input :where(input):disabled::before {
-  background-color: var(--gray-100);
-}
-.ncua-radio-input :where(input):checked::before {
-  background-color: var(--gray-700);
-}
-.ncua-radio-input :where(input):checked:disabled::before {
-  background-color: var(--gray-200);
-}
-.ncua-radio-input.destructive :where(input) {
-  border-color: var(--primary-red-600);
-}
-.ncua-radio-input.destructive :where(input):focus {
-  border-color: var(--primary-red-600);
-  box-shadow: var(--shadow-xs-focused-4px-error-100);
-}
-.ncua-radio-input:hover {
-  border-color: var(--gray-600);
-  background-color: var(--gray-100);
-}
-
-.ncua-radio-field {
-  position: relative;
-  line-height: 18px;
-  font-weight: var(--font-weights-commerce-sans-0);
-  font-size: var(--font-size-1);
-  cursor: pointer;
-}
-.ncua-radio-field__text {
-  display: block;
-  color: var(--gray-500);
-  font-weight: var(--font-weights-commerce-sans-1);
-}
-.ncua-radio-field__support-text {
-  color: var(--gray-400);
-}
-.ncua-radio-field:hover .ncua-radio-field__input {
-  border-color: var(--gray-700);
-  background-color: var(--gray-50);
-  border-radius: 4px;
-}
-.ncua-radio-field--md {
-  font-size: var(--font-size-2);
-  line-height: 22px;
-}
-.ncua-radio-field.has-text {
-  display: inline-flex;
-  gap: 6px;
-}
-.ncua-radio-field.has-text .ncua-radio-field__input {
-  transform: translateY(1px);
-}
-.ncua-radio-field.has-text.ncua-radio-field--md .ncua-radio-field__input {
-  transform: translateY(3px);
-}
-
-.ncua-tooltip {
-  position: relative;
-  font-size: 11px;
-}
-.ncua-tooltip svg {
-  cursor: pointer;
-}
-.ncua-tooltip__bg {
-  position: absolute;
-  padding: 12px;
-  border-radius: 4px;
-  display: flex;
-  flex-direction: column;
-  gap: 4px;
-  box-shadow: var(--shadow-lg);
-}
-.ncua-tooltip__bg::after {
-  position: absolute;
-  border: 6px solid transparent;
-  content: "";
-}
-.ncua-tooltip__content {
-  line-height: 14px;
-  width: max-content;
-}
-.ncua-tooltip__bg--black {
-  background-color: var(--gray-700);
-}
-.ncua-tooltip__bg--black::after {
-  border-color: var(--gray-700);
-}
-.ncua-tooltip__bg--black .ncua-tooltip__title {
-  font-weight: 500;
-  color: var(--base-white);
-}
-.ncua-tooltip__bg--black .ncua-tooltip__content {
-  color: var(--gray-200);
-}
-.ncua-tooltip__bg--white {
-  background-color: var(--base-white);
-}
-.ncua-tooltip__bg--white::after {
-  border-color: var(--base-white);
-}
-.ncua-tooltip__bg--white .ncua-tooltip__title {
-  font-weight: 500;
-  color: var(--gray-500);
-}
-.ncua-tooltip__bg--white .ncua-tooltip__content {
-  color: var(--gray-400);
-}
-.ncua-tooltip__bg--top {
-  top: auto;
-  bottom: calc(100% + 16px);
-  right: 50%;
-  transform: translateX(50%);
-}
-.ncua-tooltip__bg--top::after {
-  top: 100%;
-  border-block-end: 0;
-  border-inline: 6px solid transparent;
-}
-.ncua-tooltip__bg--top::after {
-  left: 50%;
-  transform: translateX(-50%);
-}
-.ncua-tooltip__bg--top-left {
-  top: auto;
-  bottom: calc(100% + 16px);
-  left: -12px;
-}
-.ncua-tooltip__bg--top-left::after {
-  top: 100%;
-  border-block-end: 0;
-  border-inline: 6px solid transparent;
-}
-.ncua-tooltip__bg--top-left::after {
-  left: 12px;
-}
-.ncua-tooltip__bg--top-right {
-  top: auto;
-  bottom: calc(100% + 16px);
-  right: -12px;
-}
-.ncua-tooltip__bg--top-right::after {
-  top: 100%;
-  border-block-end: 0;
-  border-inline: 6px solid transparent;
-}
-.ncua-tooltip__bg--top-right::after {
-  right: 15px;
-}
-.ncua-tooltip__bg--bottom {
-  top: calc(100% + 6px);
-  right: 50%;
-  transform: translateX(50%);
-}
-.ncua-tooltip__bg--bottom::after {
-  bottom: 100%;
-  border-block-start: 0;
-  border-inline: 6px solid transparent;
-}
-.ncua-tooltip__bg--bottom::after {
-  left: 50%;
-  transform: translateX(-50%);
-}
-.ncua-tooltip__bg--bottom-left {
-  top: calc(100% + 6px);
-  left: -12px;
-}
-.ncua-tooltip__bg--bottom-left::after {
-  bottom: 100%;
-  border-block-start: 0;
-  border-inline: 6px solid transparent;
-}
-.ncua-tooltip__bg--bottom-left::after {
-  left: 12px;
-}
-.ncua-tooltip__bg--bottom-right {
-  top: calc(100% + 6px);
-  right: -12px;
-}
-.ncua-tooltip__bg--bottom-right::after {
-  bottom: 100%;
-  border-block-start: 0;
-  border-inline: 6px solid transparent;
-}
-.ncua-tooltip__bg--bottom-right::after {
-  right: 15px;
-}
-.ncua-tooltip--hidden-arrow .ncua-tooltip__bg::after {
-  content: none;
-}
-.ncua-tooltip--stroke svg:hover {
-  color: var(--gray-400);
-}
-.ncua-tooltip:not(:hover) .ncua-tooltip__bg {
-  display: none;
-}
-
-:root {
-  --select-height-xs: 28px;
-  --select-height-sm: 36px;
-  --select-height-md: 40px;
-  --select-simple-height-xs: 18px;
-  --select-simple-height-sm: 22px;
-  --select-simple-height-md: 22px;
-}
-
-.ncua-select__content {
-  position: relative;
-  display: flex;
-  align-items: center;
-  padding-inline-start: 14px;
-  border: 1px solid var(--gray-200);
-  background-color: var(--base-white);
-  overflow: hidden;
-}
-.ncua-select__content::after {
-  position: absolute;
-  top: 50%;
-  right: 10px;
-  width: 14px;
-  height: 14px;
-  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 6L8 10L12 6' stroke='%23171818' stroke-width='1.33333' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
-  content: "";
-  z-index: -1;
-  transform: translateY(-50%);
-}
-.ncua-select__icon {
-  margin-right: 8px;
-}
-.ncua-select__icon svg {
-  display: block;
-}
-.ncua-select select {
-  -webkit-appearance: none;
-  appearance: none;
-  border: 0;
-  height: 100%;
-  flex: 1;
-  padding-right: 42px;
-  background-color: transparent;
-  outline: none;
-  color: var(--gray-700);
-}
-.ncua-select__content:focus-within {
-  border-color: var(--gray-400);
-  box-shadow: var(--shadow-xs-focused-4px-primary-gray-100);
-}
-.ncua-select.destructive .ncua-select__content {
-  border-color: var(--primary-red-600);
-}
-.ncua-select.destructive .ncua-select__content:focus-within {
-  box-shadow: var(--shadow-xs-focused-4px-error-100);
-}
-.ncua-select__destructive-icon {
-  position: absolute;
-  top: 50%;
-  right: 25px;
-  width: 14px;
-  height: 14px;
-  font-size: 0;
-  color: var(--primary-red-600);
-  transform: translateY(-50%);
-}
-.ncua-select--xs {
-  height: var(--select-height-xs);
-  border-radius: 6px;
-}
-.ncua-select--xs > .ncua-select__tag {
-  font-size: var(--font-size-xs);
-  font-weight: var(--font-weights-commerce-sans-0);
-}
-.ncua-select--sm {
-  height: var(--select-height-sm);
-  border-radius: 8px;
-}
-.ncua-select--sm > .ncua-select__tag {
-  font-size: var(--font-size-sm);
-  font-weight: var(--font-weights-commerce-sans-0);
-}
-.ncua-select--md {
-  min-width: 132px;
-  height: var(--select-height-md);
-  border-radius: 8px;
-}
-.ncua-select--md > .ncua-select__tag {
-  font-size: var(--font-size-sm);
-  font-weight: var(--font-weights-commerce-sans-1);
-}
-.ncua-select--simple .ncua-select__content {
-  padding-inline-start: 0;
-  border: 0;
-}
-.ncua-select--simple .ncua-select__content::after {
-  right: 0;
-}
-.ncua-select--simple .ncua-select--xs {
-  min-width: auto;
-  height: var(--select-simple-height-xs);
-  border-radius: 0;
-}
-.ncua-select--simple .ncua-select--sm {
-  min-width: auto;
-  height: var(--select-simple-height-sm);
-  border-radius: 0;
-}
-.ncua-select--simple .ncua-select--md {
-  min-width: auto;
-  height: var(--select-simple-height-md);
-  border-radius: 0;
-}
-.ncua-select--simple select {
-  padding-right: 18px;
-}
-.ncua-select .ncua-hint-text {
-  margin-block-start: 6px;
-  font-size: var(--font-size-xxs);
-}
-
-.ncua-pagination {
-  display: flex;
-  align-items: center;
-}
-.ncua-pagination__list {
-  display: flex;
-  align-items: center;
-  margin: 0;
-  padding: 0;
-}
-.ncua-pagination__before {
-  margin-inline: 4px 8px;
-}
-.ncua-pagination__item + .ncua-pagination__item {
-  margin-inline-start: 4px;
-}
-.ncua-pagination__page-num {
-  font-size: 14px;
-  font-weight: 500;
-  display: inline-flex;
-  justify-content: center;
-  align-items: center;
-  padding-inline: 10px;
-  min-width: 32px;
-  height: 32px;
-  border-radius: 8px;
-  border: 0;
-  cursor: pointer;
-}
-.ncua-pagination__page-num:hover, .ncua-pagination__page-num:focus, .ncua-pagination__page-num.is-current {
-  background-color: var(--gray-50);
-}
-.ncua-pagination__page-num:hover, .ncua-pagination__page-num.is-current {
-  font-weight: 700;
-}
-.ncua-pagination__page-num:focus {
-  outline: none;
-  box-shadow: var(--focus-ring-4px-gray-100);
-}
-.ncua-pagination__page-info {
-  display: none;
-}
-.ncua-pagination__next {
-  margin-inline: 8px 4px;
-}
-@media (max-width: 768px) {
-  .ncua-pagination {
-    justify-content: space-between;
-  }
-  .ncua-pagination__list {
-    display: none;
-  }
-  .ncua-pagination__first, .ncua-pagination__last {
-    display: none;
-  }
-  .ncua-pagination__page-info {
-    display: flex;
-    align-items: center;
-    margin: 0;
-    font-size: 14px;
-    color: var(--gray-400);
-  }
-  .ncua-pagination__current-num {
-    font-style: normal;
-    color: var(--gray-700);
-  }
-}
-
-@keyframes ncua-spinner-rotate {
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
-}
-.ncua-spinner {
-  display: grid;
-  place-items: center;
-}
-.ncua-spinner__content {
-  text-align: center;
-}
-.ncua-spinner__content::before {
-  content: "";
-  display: inline-block;
-  border-radius: 50%;
-  border-style: solid;
-  border-color: var(--gray-100);
-  border-top-color: var(--gray-500);
-  animation: ncua-spinner-rotate 1s linear infinite;
-}
-.ncua-spinner__text {
-  margin: 0;
-  color: var(--gray-500);
-}
-.ncua-spinner--xs {
-  font-size: 11px;
-}
-.ncua-spinner--xs .ncua-spinner__content::before {
-  margin-block-end: 12px;
-  width: 16px;
-  height: 16px;
-  border-width: 2px;
-}
-.ncua-spinner--sm {
-  font-size: 14px;
-}
-.ncua-spinner--sm .ncua-spinner__content::before {
-  margin-block-end: 16px;
-  width: 32px;
-  height: 32px;
-  border-width: 4px;
-}
-.ncua-spinner--md {
-  font-size: 14px;
-}
-.ncua-spinner--md .ncua-spinner__content::before {
-  margin-block-end: 16px;
-  width: 48px;
-  height: 48px;
-  border-width: 6px;
-}
-.ncua-spinner--lg {
-  font-size: 18px;
-}
-.ncua-spinner--lg .ncua-spinner__content::before {
-  margin-block-end: 16px;
-  width: 56px;
-  height: 56px;
-  border-width: 6px;
-}
-.ncua-spinner--xl {
-  font-size: 18px;
-}
-.ncua-spinner--xl .ncua-spinner__content::before {
-  margin-block-end: 20px;
-  width: 64px;
-  height: 64px;
-  border-width: 8px;
-}
-.ncua-spinner--backdrop {
-  content: "";
-  position: fixed;
-  top: 0;
-  left: 0;
-  width: 100vw;
-  height: 100vh;
-  background-color: rgba(0, 0, 0, 0.5);
-  z-index: 200;
-}