* {
  box-sizing: border-box; }

:root {
  --wco-font-family: 'Figtree', sans-serif;
  --wco-color-primary-text: #fcfcfc;
  --wco-color-primary-50: #fff0e4;
  --wco-color-primary-100: #ffb578;
  --wco-color-primary-300: #ff8826;
  --wco-color-primary-500: #fa780c;
  --wco-color-primary-600: #bf5600;
  --wco-color-primary-700: #8f4000;
  --wco-color-primary-900: #301600;
  --wco-color-secondary-text: #fcfcfc;
  --wco-color-secondary-50: #ecdff0;
  --wco-color-secondary-100: #c69ed3;
  --wco-color-secondary-300: #aa6ebc;
  --wco-color-secondary-500: #a05eb5;
  --wco-color-secondary-600: #844597;
  --wco-color-secondary-700: #633471;
  --wco-color-secondary-900: #42234b;
  --wco-color-neutral-50: #FCFCFC;
  --wco-color-neutral-100: #E9EBEC;
  --wco-color-neutral-300: #C3C8CC;
  --wco-color-neutral-500: #8D9399;
  --wco-color-neutral-600: #6D747A;
  --wco-color-neutral-700: #50555A;
  --wco-color-neutral-900: #080809;
  --wco-color-bg: #EEEBEF;
  --wco-color-panel: #FCFCFC;
  --wco-color-success-50: #DAFFE2;
  --wco-color-success-100: #A1E5B0;
  --wco-color-success-300: #43BF5E;
  --wco-color-success-500: #008C1F;
  --wco-color-success-600: #007019;
  --wco-color-success-700: #005413;
  --wco-color-success-900: #00380C;
  --wco-color-warning-50: #FEF7EB;
  --wco-color-warning-100: #FCE6C4;
  --wco-color-warning-300: #F8BD63;
  --wco-color-warning-500: #F6AC3C;
  --wco-color-warning-600: #B06D08;
  --wco-color-warning-700: #754905;
  --wco-color-warning-900: #3B2403;
  --wco-color-danger-50: #FEE4E4;
  --wco-color-danger-100: #FC9393;
  --wco-color-danger-300: #F94242;
  --wco-color-danger-500: #E00707;
  --wco-color-danger-600: #9D0505;
  --wco-color-danger-700: #700404;
  --wco-color-danger-900: #430202;
  --wco-color-info-50: #E8F1FB;
  --wco-color-info-100: #BBD5F4;
  --wco-color-info-300: #5F9EE6;
  --wco-color-info-500: #2072D1;
  --wco-color-info-600: #175296;
  --wco-color-info-700: #103A6B;
  --wco-color-info-900: #0A2340;
  --wco-font-size-xxxs: 12px;
  --wco-font-size-xxs: 14px;
  --wco-font-size-xs: 16px;
  --wco-font-size-sm: 18px;
  --wco-font-size-md: 20px;
  --wco-font-size-lg: 24px;
  --wco-font-size-xl: 32px;
  --wco-font-size-xxl: 36px;
  --wco-font-size-xxxl: 48px;
  --wco-font-size-huge: 64px;
  --wco-spacing-none: 0px;
  --wco-spacing-quark: 4px;
  --wco-spacing-nano: 8px;
  --wco-spacing-xxxs: 12px;
  --wco-spacing-xxs: 16px;
  --wco-spacing-xs: 24px;
  --wco-spacing-sm: 32px;
  --wco-spacing-md: 40px;
  --wco-spacing-lg: 48px;
  --wco-spacing-xl: 56px;
  --wco-spacing-xxl: 64px;
  --wco-spacing-xxxl: 80px;
  --wco-spacing-huge: 120px;
  --wco-font-lineheight-tight: 100%;
  --wco-font-lineheight-500: 150%;
  --wco-font-lineheight-distant: 170%;
  --wco-font-lineheight-super-distant: 180%;
  --wco-font-lineheight-faraway: 200%;
  --wco-font-weight-300: 300;
  --wco-font-weight-regular: 400;
  --wco-font-weight-500: 500;
  --wco-font-weight-bold: 700;
  --wco-font-weight-black: 900;
  --wco-radius-none: 0px;
  --wco-radius-sm: 4px;
  --wco-radius-md: 8px;
  --wco-radius-lg: 24px;
  --wco-radius-pill: 500px;
  --wco-radius-circular: 50%;
  --wco-borderwidth-none: 0px;
  --wco-borderwidth-hairline: 0.5px;
  --wco-borderwidth-thin: 1px;
  --wco-borderwidth-thick: 2px;
  --wco-opacity-semi-transparent: 16%;
  --wco-opacity-100: 20%;
  --wco-opacity-500: 32%;
  --wco-shadow-level-0: 0px 0px 0px 0px rgba(0, 0, 0, 0.2);
  --wco-shadow-level-1: 0px 2px 16px 0px rgba(0, 0, 0, 0.2);
  --wco-shadow-level-2: 0px 4px 16px 0px rgba(0, 0, 0, 0.2);
  --wco-shadow-level-3: 0px 16px 32px rgba(0, 0, 0, 0.2);
  --wco-iconography-size-xxs: 16px;
  --wco-iconography-size-xs: 20px;
  --wco-iconography-size-sm: 24px;
  --wco-iconography-size-md: 28px;
  --wco-iconography-size-lg: 32px;
  --wco-iconography-size-xl: 48px;
  --wco-iconography-size-xxl: 64px; }

[data-tooltip] {
  position: relative;
  /* opinion 1 */ }

/* Applies to all tooltips */
[data-tooltip]::before,
[data-tooltip]::after {
  text-transform: none;
  /* opinion 2 */
  font-size: .9em;
  /* opinion 3 */
  line-height: 1;
  user-select: none;
  pointer-events: none;
  position: absolute;
  display: none;
  opacity: 0; }

[data-tooltip]::before {
  content: '';
  border: 5px solid transparent;
  /* opinion 4 */
  z-index: 1001;
  /* absurdity 1 */ }

[data-tooltip]::after {
  content: attr(data-tooltip);
  /* magic! */
  /* most of the rest of this is opinion */
  text-align: center;
  /*
    Let the content set the size of the tooltips
    but this will also keep them from being obnoxious
    */
  min-width: 3em;
  max-width: 21em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 1ch 1.5ch;
  border-radius: .3ch;
  box-shadow: 0 1em 2em -0.5em rgba(0, 0, 0, 0.35);
  background: var(--tooltip-background, var(--wco-color-neutral-600est, #333));
  color: var(--tooltip-color, var(--wco-color-primary-50, #fff));
  z-index: 1000;
  /* absurdity 2 */ }

/* Make the tooltips respond to hover */
[data-tooltip]:hover::before,
[data-tooltip]:hover::after {
  display: block; }

/* don't show empty tooltips */
[data-tooltip='']::before,
[data-tooltip='']::after {
  display: none !important; }

/* FLOW: top */
[data-tooltip]:not([data-flow])::before,
[data-tooltip][data-flow^="top"]::before {
  bottom: 100%;
  border-bottom-width: 0;
  border-top-color: var(--tooltip-background, var(--wco-color-neutral-600est, #333)); }

[data-tooltip]:not([data-flow])::after,
[data-tooltip][data-flow^="top"]::after {
  bottom: calc(100% + 5px); }

[data-tooltip]:not([data-flow])::before,
[data-tooltip]:not([data-flow])::after,
[data-tooltip][data-flow^="top"]::before,
[data-tooltip][data-flow^="top"]::after {
  left: 50%;
  transform: translate(-50%, -0.5em); }

/* FLOW: bottom */
[data-tooltip][data-flow^="bottom"]::before {
  top: 100%;
  border-top-width: 0;
  border-bottom-color: var(--tooltip-background, var(--wco-color-neutral-600est, #333)); }

[data-tooltip][data-flow^="bottom"]::after {
  top: calc(100% + 5px); }

[data-tooltip][data-flow^="bottom"]::before,
[data-tooltip][data-flow^="bottom"]::after {
  left: 50%;
  transform: translate(-50%, 0.5em); }

/* FLOW: LEFT */
[data-tooltip][data-flow^="left"]::before {
  top: 50%;
  border-right-width: 0;
  border-left-color: var(--tooltip-background, var(--wco-color-neutral-600est, #333));
  left: calc(0em - 5px);
  transform: translate(-0.5em, -50%); }

[data-tooltip][data-flow^="left"]::after {
  top: 50%;
  right: calc(100% + 5px);
  transform: translate(-0.5em, -50%); }

/* FLOW: RIGHT */
[data-tooltip][data-flow^="right"]::before {
  top: 50%;
  border-left-width: 0;
  border-right-color: var(--tooltip-background, var(--wco-color-neutral-600est, #333));
  right: calc(0em - 5px);
  transform: translate(0.5em, -50%); }

[data-tooltip][data-flow^="right"]::after {
  top: 50%;
  left: calc(100% + 5px);
  transform: translate(0.5em, -50%); }

/* KEYFRAMES */
@keyframes tooltips-vert {
  to {
    opacity: .9;
    transform: translate(-50%, 0); } }

@keyframes tooltips-horz {
  to {
    opacity: .9;
    transform: translate(0, -50%); } }

/* FX All The Things */
[data-tooltip]:not([data-flow]):hover::before,
[data-tooltip]:not([data-flow]):hover::after,
[data-tooltip][data-flow^="top"]:hover::before,
[data-tooltip][data-flow^="top"]:hover::after,
[data-tooltip][data-flow^="bottom"]:hover::before,
[data-tooltip][data-flow^="bottom"]:hover::after {
  animation: tooltips-vert 300ms ease-out forwards; }

[data-tooltip][data-flow^="left"]:hover::before,
[data-tooltip][data-flow^="left"]:hover::after,
[data-tooltip][data-flow^="right"]:hover::before,
[data-tooltip][data-flow^="right"]:hover::after {
  animation: tooltips-horz 300ms ease-out forwards; }

.tooltip-white {
  --tooltip-background: var(--wco-color-neutral-50);
  --tooltip-color: var(--wco-color-neutral-900); }

.tooltip-primary {
  --tooltip-background: var(--wco-color-primary-500);
  --tooltip-color: var(--wco-color-primary-900); }

.tooltip-secondary {
  --tooltip-background: var(--wco-color-secondary-500);
  --tooltip-color: var(--wco-color-secondary-50); }

.tooltip-warning {
  --tooltip-background: var(--wco-color-warning-500);
  --tooltip-color: var(--wco-color-warning-extradark); }

.tooltip-error {
  --tooltip-background: var(--wco-color-danger-500);
  --tooltip-color: var(--wco-color-danger-900-extradark); }

.tooltip-success {
  --tooltip-background: var(--wco-color-success-500);
  --tooltip-color: var(--wco-color-success-extradark); }

.tooltip-info {
  --tooltip-background: var(--wco-color-info-500);
  --tooltip-color: var(--wco-color-info-900); }

.display-1,
.display-2,
.display-3,
.display-4,
.display-5,
.display-6 {
  font-family: var(--wco-font-family);
  line-height: var(--wco-font-lineheight-500);
  color: var(--wco-color-neutral-900);
  font-weight: var(--wco-font-weight-500); }
  .display-1 strong, .display-1.bold,
  .display-2 strong,
  .display-2.bold,
  .display-3 strong,
  .display-3.bold,
  .display-4 strong,
  .display-4.bold,
  .display-5 strong,
  .display-5.bold,
  .display-6 strong,
  .display-6.bold {
    font-weight: var(--wco-font-weight-bold); }

.display-1 {
  font-size: var(--wco-font-size-huge);
  font-weight: var(--wco-font-weight-bold); }
  @media (max-width: 768px) {
    .display-1 {
      font-size: var(--wco-font-size-xxl); } }

.display-2 {
  font-size: var(--wco-font-size-xxxl);
  color: var(--wco-color-neutral-900); }
  @media (max-width: 768px) {
    .display-2 {
      font-size: var(--wco-font-size-xl); } }

.display-3 {
  font-size: var(--wco-font-size-xxl);
  color: var(--wco-color-neutral-900); }
  @media (max-width: 768px) {
    .display-3 {
      font-size: var(--wco-font-size-xl); } }

.display-4 {
  font-size: var(--wco-font-size-xl); }
  @media (max-width: 768px) {
    .display-4 {
      font-size: var(--wco-font-size-lg); } }

.display-5 {
  font-size: var(--wco-font-size-lg); }
  @media (max-width: 768px) {
    .display-5 {
      font-size: var(--wco-font-size-md); } }

.display-6 {
  font-size: var(--wco-font-size-md); }
  @media (max-width: 768px) {
    .display-6 {
      font-size: var(--wco-font-size-sm); } }

.display-body {
  font-size: var(--wco-font-size-sm);
  line-height: var(--wco-font-lineheight-super-distant); }
  @media (max-width: 768px) {
    .display-body {
      font-size: var(--wco-font-size-sm); } }

.display-text {
  font-size: var(--wco-font-size-xxs);
  line-height: var(--wco-font-lineheight-500); }
  @media (max-width: 768px) {
    .display-text {
      font-size: var(--wco-font-size-xxs); } }

.display-p {
  font-size: var(--wco-font-size-xs);
  line-height: var(--wco-font-lineheight-500); }

.display-caption {
  font-size: var(--wco-font-size-xxxs);
  line-height: var(--wco-font-lineheight-500); }

@keyframes skeletonShine {
  to {
    background-position: 500px 0; } }

.wco-skeleton:empty,
.wco-skeleton *:empty {
  background: #f6f7f8;
  background-position: -500px 0;
  animation: skeletonShine 1s linear 0s infinite normal forwards;
  background-image: linear-gradient(135deg, #f6f7f8 0%, #edeef1 20%, #f6f7f8 40%, #f6f7f8 100%);
  background-repeat: no-repeat;
  background-size: 1000px 100%; }

@keyframes wco-spin {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(360deg); } }

.wco-spinner {
  width: 48px;
  height: 48px;
  border: 5px solid var(--wco-color-primary-500);
  border-bottom-color: transparent;
  border-radius: 50%;
  display: inline-block;
  box-sizing: border-box;
  animation: wco-spin 1s linear infinite; }

button.wco-btn,
a.wco-btn,
button.btn,
a.btn {
  font-size: var(--btn-size, 16px);
  gap: var(--btn-gap, 8px);
  border-radius: var(--btn-radius, 8px);
  min-height: var(--btn-min-h, 48px);
  padding: var(--btn-padding, 8px 16px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  border: none;
  width: fit-content;
  letter-spacing: 0.4px;
  transition: all 300ms ease-in-out, outline 0ms linear;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  font-family: var(--wco-font-family); }
  button.wco-btn:focus-visible,
  a.wco-btn:focus-visible,
  button.btn:focus-visible,
  a.btn:focus-visible {
    outline: 2px solid var(--btn-focus, var(--textBtn)); }
  button.wco-btn:not([class*=" bg-"]),
  a.wco-btn:not([class*=" bg-"]),
  button.btn:not([class*=" bg-"]),
  a.btn:not([class*=" bg-"]) {
    background-color: var(--bgBtn);
    color: var(--textBtn); }
  button.wco-btn:disabled:not(.btn-loading),
  a.wco-btn:disabled:not(.btn-loading),
  button.btn:disabled:not(.btn-loading),
  a.btn:disabled:not(.btn-loading) {
    text-decoration: none;
    --bgBtn: var(--wco-color-neutral-300);
    --textBtn: var(--wco-color-neutral-900);
    pointer-events: none;
    opacity: 0.4; }
  button.wco-btn:not(:disabled):hover, button.wco-btn:not(.btn-loading):hover,
  a.wco-btn:not(:disabled):hover,
  a.wco-btn:not(.btn-loading):hover,
  button.btn:not(:disabled):hover,
  button.btn:not(.btn-loading):hover,
  a.btn:not(:disabled):hover,
  a.btn:not(.btn-loading):hover {
    transform: scale(1);
    box-shadow: var(--wco-shadow-level-1); }
  button.wco-btn:not(:disabled):active, button.wco-btn:not(.btn-loading):active,
  a.wco-btn:not(:disabled):active,
  a.wco-btn:not(.btn-loading):active,
  button.btn:not(:disabled):active,
  button.btn:not(.btn-loading):active,
  a.btn:not(:disabled):active,
  a.btn:not(.btn-loading):active {
    transform: scale(0.99) translateY(0.5px);
    box-shadow: var(--wco-shadow-level-0); }
  button.wco-btn:not([class*=" btn-loading"]):after,
  a.wco-btn:not([class*=" btn-loading"]):after,
  button.btn:not([class*=" btn-loading"]):after,
  a.btn:not([class*=" btn-loading"]):after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    height: 0px;
    width: 100%;
    background-color: black;
    filter: contrast(100px);
    opacity: 0.1;
    transition: all 300ms ease; }
  button.wco-btn.btn-primary,
  a.wco-btn.btn-primary,
  button.btn.btn-primary,
  a.btn.btn-primary {
    --bgBtn: var(--wco-color-primary-600);
    --textBtn: var(--wco-color-primary-text);
    --btn-focus: var(--wco-color-primary-900); }
    button.wco-btn.btn-primary:hover:not(.btn-outline),
    a.wco-btn.btn-primary:hover:not(.btn-outline),
    button.btn.btn-primary:hover:not(.btn-outline),
    a.btn.btn-primary:hover:not(.btn-outline) {
      --bgBtn: var(--wco-color-primary-700);
      --textBtn: var(--wco-color-primary-50); }
    button.wco-btn.btn-primary:active:not(.btn-outline),
    a.wco-btn.btn-primary:active:not(.btn-outline),
    button.btn.btn-primary:active:not(.btn-outline),
    a.btn.btn-primary:active:not(.btn-outline) {
      --bgBtn: var(--wco-color-primary-700);
      --textBtn: var(--wco-color-primary-50); }
    button.wco-btn.btn-primary.btn-outline,
    a.wco-btn.btn-primary.btn-outline,
    button.btn.btn-primary.btn-outline,
    a.btn.btn-primary.btn-outline {
      background-color: transparent;
      --textBtn: var(--wco-color-primary-600);
      --btn-focus: var(--wco-color-primary-600); }
      button.wco-btn.btn-primary.btn-outline:hover,
      a.wco-btn.btn-primary.btn-outline:hover,
      button.btn.btn-primary.btn-outline:hover,
      a.btn.btn-primary.btn-outline:hover {
        background-color: var(--wco-color-primary-50);
        --textBtn: var(--wco-color-primary-700);
        --bgBtn: var(--wco-color-primary-700); }
      button.wco-btn.btn-primary.btn-outline:active,
      a.wco-btn.btn-primary.btn-outline:active,
      button.btn.btn-primary.btn-outline:active,
      a.btn.btn-primary.btn-outline:active {
        background-color: var(--wco-color-primary-50); }
    button.wco-btn.btn-primary.btn-basic,
    a.wco-btn.btn-primary.btn-basic,
    button.btn.btn-primary.btn-basic,
    a.btn.btn-primary.btn-basic {
      box-shadow: none;
      --bgBtn: transparent;
      --textBtn: var(--wco-color-primary-600); }
      button.wco-btn.btn-primary.btn-basic:hover,
      a.wco-btn.btn-primary.btn-basic:hover,
      button.btn.btn-primary.btn-basic:hover,
      a.btn.btn-primary.btn-basic:hover {
        --textBtn: var(--wco-color-primary-700);
        --bgBtn: var(--wco-color-primary-50); }
      button.wco-btn.btn-primary.btn-basic:focus-visible, button.wco-btn.btn-primary.btn-basic:active,
      a.wco-btn.btn-primary.btn-basic:focus-visible,
      a.wco-btn.btn-primary.btn-basic:active,
      button.btn.btn-primary.btn-basic:focus-visible,
      button.btn.btn-primary.btn-basic:active,
      a.btn.btn-primary.btn-basic:focus-visible,
      a.btn.btn-primary.btn-basic:active {
        --textBtn: var(--wco-color-primary-900);
        --bgBtn: var(--wco-color-primary-100); }
  button.wco-btn.btn-secondary,
  a.wco-btn.btn-secondary,
  button.btn.btn-secondary,
  a.btn.btn-secondary {
    --bgBtn: var(--wco-color-secondary-100);
    --textBtn: var(--wco-color-secondary-900);
    --btn-focus: var(--wco-color-secondary-900); }
    button.wco-btn.btn-secondary:hover:not(.btn-outline),
    a.wco-btn.btn-secondary:hover:not(.btn-outline),
    button.btn.btn-secondary:hover:not(.btn-outline),
    a.btn.btn-secondary:hover:not(.btn-outline) {
      --bgBtn: var(--wco-color-secondary-50);
      --textBtn: var(--wco-color-secondary-900);
      box-shadow: none; }
    button.wco-btn.btn-secondary:active:not(.btn-outline),
    a.wco-btn.btn-secondary:active:not(.btn-outline),
    button.btn.btn-secondary:active:not(.btn-outline),
    a.btn.btn-secondary:active:not(.btn-outline) {
      --bgBtn: var(--wco-color-secondary-50);
      --textBtn: var(--wco-color-secondary-900); }
    button.wco-btn.btn-secondary.btn-outline,
    a.wco-btn.btn-secondary.btn-outline,
    button.btn.btn-secondary.btn-outline,
    a.btn.btn-secondary.btn-outline {
      background-color: transparent;
      --textBtn: var(--wco-color-secondary-600);
      --btn-focus: var(--wco-color-secondary-600); }
      button.wco-btn.btn-secondary.btn-outline:hover,
      a.wco-btn.btn-secondary.btn-outline:hover,
      button.btn.btn-secondary.btn-outline:hover,
      a.btn.btn-secondary.btn-outline:hover {
        background-color: var(--wco-color-secondary-50); }
      button.wco-btn.btn-secondary.btn-outline:active,
      a.wco-btn.btn-secondary.btn-outline:active,
      button.btn.btn-secondary.btn-outline:active,
      a.btn.btn-secondary.btn-outline:active {
        background-color: var(--wco-color-secondary-100); }
    button.wco-btn.btn-secondary.btn-basic,
    a.wco-btn.btn-secondary.btn-basic,
    button.btn.btn-secondary.btn-basic,
    a.btn.btn-secondary.btn-basic {
      box-shadow: none;
      --bgBtn: transparent;
      --textBtn: var(--wco-color-secondary-600); }
      button.wco-btn.btn-secondary.btn-basic:hover,
      a.wco-btn.btn-secondary.btn-basic:hover,
      button.btn.btn-secondary.btn-basic:hover,
      a.btn.btn-secondary.btn-basic:hover {
        --textBtn: var(--wco-color-secondary-700);
        --bgBtn: var(--wco-color-secondary-50); }
      button.wco-btn.btn-secondary.btn-basic:focus-visible, button.wco-btn.btn-secondary.btn-basic:active,
      a.wco-btn.btn-secondary.btn-basic:focus-visible,
      a.wco-btn.btn-secondary.btn-basic:active,
      button.btn.btn-secondary.btn-basic:focus-visible,
      button.btn.btn-secondary.btn-basic:active,
      a.btn.btn-secondary.btn-basic:focus-visible,
      a.btn.btn-secondary.btn-basic:active {
        --textBtn: var(--wco-color-secondary-900);
        --bgBtn: var(--wco-color-secondary-100); }
  button.wco-btn.btn-link,
  a.wco-btn.btn-link,
  button.btn.btn-link,
  a.btn.btn-link {
    background-color: transparent;
    --textBtn: var(--wco-color-primary-600);
    text-decoration: underline; }
    button.wco-btn.btn-link:hover:not(.btn-outline),
    a.wco-btn.btn-link:hover:not(.btn-outline),
    button.btn.btn-link:hover:not(.btn-outline),
    a.btn.btn-link:hover:not(.btn-outline) {
      --textBtn: var(--wco-color-primary-700);
      box-shadow: none; }
    button.wco-btn.btn-link:active:not(.btn-outline),
    a.wco-btn.btn-link:active:not(.btn-outline),
    button.btn.btn-link:active:not(.btn-outline),
    a.btn.btn-link:active:not(.btn-outline) {
      background-color: var(--wco-color-primary-100);
      --bgBtn: var(--wco-color-primary-900);
      --textBtn: var(--wco-color-primary-900);
      box-shadow: none; }
    button.wco-btn.btn-link.btn-outline,
    a.wco-btn.btn-link.btn-outline,
    button.btn.btn-link.btn-outline,
    a.btn.btn-link.btn-outline {
      border: 0px solid transparent; }
  button.wco-btn.btn-full,
  a.wco-btn.btn-full,
  button.btn.btn-full,
  a.btn.btn-full {
    width: 100%;
    min-width: max-content; }
  button.wco-btn.btn-md,
  a.wco-btn.btn-md,
  button.btn.btn-md,
  a.btn.btn-md {
    --btn-min-h: 40px; }
  button.wco-btn.btn-sm,
  a.wco-btn.btn-sm,
  button.btn.btn-sm,
  a.btn.btn-sm {
    --btn-min-h: 32px;
    --btn-size: 14px;
    --btn-padding: 4px 16px; }
  button.wco-btn.btn-outline,
  a.wco-btn.btn-outline,
  button.btn.btn-outline,
  a.btn.btn-outline {
    border: 2px solid var(--bgBtn); }
    button.wco-btn.btn-outline:disabled,
    a.wco-btn.btn-outline:disabled,
    button.btn.btn-outline:disabled,
    a.btn.btn-outline:disabled {
      background-color: transparent;
      --textBtn: var(--wco-color-neutral-700);
      --bgBtn: var(--wco-color-neutral-700); }
  button.wco-btn.btn-loading,
  a.wco-btn.btn-loading,
  button.btn.btn-loading,
  a.btn.btn-loading {
    position: relative;
    overflow: hidden;
    pointer-events: none;
    cursor: none; }
    button.wco-btn.btn-loading:before,
    a.wco-btn.btn-loading:before,
    button.btn.btn-loading:before,
    a.btn.btn-loading:before {
      position: absolute;
      top: 0;
      left: 0;
      width: 0%;
      height: 100%; }
    button.wco-btn.btn-loading:before,
    a.wco-btn.btn-loading:before,
    button.btn.btn-loading:before,
    a.btn.btn-loading:before {
      content: "";
      background-color: rgba(33, 29, 29, 0.15);
      animation: loadingButton 2s ease infinite;
      z-index: 22; }

@keyframes loadingButton {
  to {
    width: 100%; } }
  button.wco-btn.btn-icon,
  a.wco-btn.btn-icon,
  button.btn.btn-icon,
  a.btn.btn-icon {
    --btn-padding: 4px;
    min-height: var(--btn-min-h, 48px);
    min-width: var(--btn-min-h, 48px); }
  button.wco-btn.btn.btn-notification,
  a.wco-btn.btn.btn-notification,
  button.btn.btn.btn-notification,
  a.btn.btn.btn-notification {
    --btn-notification-size: var(--wco-spacing-xxs);
    --btn-notification-time: 2s;
    --btn-notification-count: infinite;
    --btn-notification-color: var(--bgBtn); }
    button.wco-btn.btn.btn-notification:not(.btn-outline):before,
    a.wco-btn.btn.btn-notification:not(.btn-outline):before,
    button.btn.btn.btn-notification:not(.btn-outline):before,
    a.btn.btn.btn-notification:not(.btn-outline):before {
      outline: 2px solid var(--textBtn); }
    button.wco-btn.btn.btn-notification:before,
    a.wco-btn.btn.btn-notification:before,
    button.btn.btn.btn-notification:before,
    a.btn.btn.btn-notification:before {
      content: "";
      position: absolute;
      top: calc(var(--btn-notification-size) / -2);
      right: calc(var(--btn-notification-size) / -2);
      height: 16px;
      width: 16px;
      border-radius: 50%;
      background-color: var(--btn-notification-color);
      filter: saturate(0.8);
      opacity: 1;
      transition: all 300ms ease;
      animation: btnNotificationAnimation var(--btn-notification-time, 300ms) ease var(--btn-notification-count) alternate;
      box-shadow: var(--wco-shadow-level-1); }

@keyframes btnNotificationAnimation {
  0% {
    transform: scale(1); }
  50% {
    transform: scale(1.2);
    box-shadow: var(--wco-shadow-level-2); }
  100% {
    transform: scale(1); } }

.wco-card, .wco-content {
  display: block;
  padding: var(--wco-spacing-xs);
  border-radius: var(--wco-radius-md);
  background-color: var(--wco-color-panel);
  width: 100%; }

.form-field,
.wco-form-field {
  --wco-input-color-label: var(--wco-color-neutral-700, #50555a);
  --wco-input-color-outline: var(--wco-color-neutral-500, #8d9399);
  --wco-input-color-icon: var(--wco-color-primary-600, #bf5600);
  --wco-input-color-text: var(--wco-color-neutral-900, #080809);
  --wco-input-color-placeholder: var(--wco-color-neutral-600, #6d747a);
  --wco-input-color-bg: var(--wco-color-neutral-50, #fcfcfc);
  --wco-input-radius: var(--wco-radius-sm, 4px);
  --wco-input-border: var(--wco-borderwidth-thin, 1px) solid var(--wco-input-color-outline);
  --wco-input-size: var(--wco-font-size-xs, 16px);
  --wco-input-shadow: var(--wco-shadow-level-0, 0px 0px 0px 0px rgba(0, 0, 0, 0.2));
  --wco-input-color-required: var(--wco-color-danger-600, #e00707);
  --wco-input-color-helptext: var(--wco-color-neutral-900, #6d747a);
  --wco-input-font: var(--wco-font-family, 'Figtree', sans-serif);
  --wco-input-padding: 16px;
  --wco-input-min-height: 48px; }

.wco-form-field,
.form-field * {
  box-sizing: border-box; }

.wco-form-field,
.form-field {
  display: flex;
  position: relative;
  accent-color: var(--wco-input-color-text);
  transition: box-shadow 300ms ease-in-out, border-color 300ms ease-in-out; }
  .wco-form-field:has(input:required) label::after,
  .wco-form-field:has(select:required) label::after,
  .wco-form-field:has(textarea:required) label::after,
  .wco-form-field input:required + label::after,
  .wco-form-field textarea:required + label::after,
  .wco-form-field input:invalid:not(:placeholder-shown):required + label,
  .wco-form-field .form-field__input.multiSelect.required + label::after,
  .form-field:has(input:required) label::after,
  .form-field:has(select:required) label::after,
  .form-field:has(textarea:required) label::after,
  .form-field input:required + label::after,
  .form-field textarea:required + label::after,
  .form-field input:invalid:not(:placeholder-shown):required + label,
  .form-field .form-field__input.multiSelect.required + label::after {
    content: " *";
    color: var(--wco-input-color-required); }
  .wco-form-field .form-field__input,
  .wco-form-field .form-field__textarea,
  .wco-form-field input,
  .wco-form-field textarea,
  .wco-form-field select,
  .form-field .form-field__input,
  .form-field .form-field__textarea,
  .form-field input,
  .form-field textarea,
  .form-field select {
    border: var(--wco-input-border);
    border-radius: var(--wco-input-radius);
    font-size: var(--wco-input-size, 16px);
    box-shadow: var(--wco-input-shadow);
    padding: var(--wco-input-padding, 16px);
    font-family: var(--wco-font-family);
    font-style: normal;
    font-weight: 400;
    line-height: 1.375;
    letter-spacing: 0.4px;
    color: var(--wco-input-color-text);
    outline: none;
    width: 100%;
    background-color: var(--wco-input-color-bg); }
    .wco-form-field .form-field__input::placeholder,
    .wco-form-field .form-field__textarea::placeholder,
    .wco-form-field input::placeholder,
    .wco-form-field textarea::placeholder,
    .wco-form-field select::placeholder,
    .form-field .form-field__input::placeholder,
    .form-field .form-field__textarea::placeholder,
    .form-field input::placeholder,
    .form-field textarea::placeholder,
    .form-field select::placeholder {
      color: var(--wco-input-color-placeholder);
      font-family: var(--wco-font-family); }
    .wco-form-field .form-field__input:invalid:not(:placeholder-shown), .wco-form-field .form-field__input.wco-form-field--error:not(:placeholder-shown), .wco-form-field .form-field__input.form-field--error:not(:placeholder-shown), .wco-form-field .form-field__input.form--error:not(:placeholder-shown),
    .wco-form-field .form-field__textarea:invalid:not(:placeholder-shown),
    .wco-form-field .form-field__textarea.wco-form-field--error:not(:placeholder-shown),
    .wco-form-field .form-field__textarea.form-field--error:not(:placeholder-shown),
    .wco-form-field .form-field__textarea.form--error:not(:placeholder-shown),
    .wco-form-field input:invalid:not(:placeholder-shown),
    .wco-form-field input.wco-form-field--error:not(:placeholder-shown),
    .wco-form-field input.form-field--error:not(:placeholder-shown),
    .wco-form-field input.form--error:not(:placeholder-shown),
    .wco-form-field textarea:invalid:not(:placeholder-shown),
    .wco-form-field textarea.wco-form-field--error:not(:placeholder-shown),
    .wco-form-field textarea.form-field--error:not(:placeholder-shown),
    .wco-form-field textarea.form--error:not(:placeholder-shown),
    .wco-form-field select:invalid:not(:placeholder-shown),
    .wco-form-field select.wco-form-field--error:not(:placeholder-shown),
    .wco-form-field select.form-field--error:not(:placeholder-shown),
    .wco-form-field select.form--error:not(:placeholder-shown),
    .form-field .form-field__input:invalid:not(:placeholder-shown),
    .form-field .form-field__input.wco-form-field--error:not(:placeholder-shown),
    .form-field .form-field__input.form-field--error:not(:placeholder-shown),
    .form-field .form-field__input.form--error:not(:placeholder-shown),
    .form-field .form-field__textarea:invalid:not(:placeholder-shown),
    .form-field .form-field__textarea.wco-form-field--error:not(:placeholder-shown),
    .form-field .form-field__textarea.form-field--error:not(:placeholder-shown),
    .form-field .form-field__textarea.form--error:not(:placeholder-shown),
    .form-field input:invalid:not(:placeholder-shown),
    .form-field input.wco-form-field--error:not(:placeholder-shown),
    .form-field input.form-field--error:not(:placeholder-shown),
    .form-field input.form--error:not(:placeholder-shown),
    .form-field textarea:invalid:not(:placeholder-shown),
    .form-field textarea.wco-form-field--error:not(:placeholder-shown),
    .form-field textarea.form-field--error:not(:placeholder-shown),
    .form-field textarea.form--error:not(:placeholder-shown),
    .form-field select:invalid:not(:placeholder-shown),
    .form-field select.wco-form-field--error:not(:placeholder-shown),
    .form-field select.form-field--error:not(:placeholder-shown),
    .form-field select.form--error:not(:placeholder-shown) {
      --input-border: 1px solid var(--input-color-error);
      --input-shadow: 0px 2px 0px 1px var(--input-color-error);
      color: var(--input-color-error); }
  .wco-form-field label,
  .form-field label {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    color: var(--wco-input-color-label);
    font-family: var(--wco-input-font);
    font-size: var(--wco-input-size);
    font-weight: 400;
    padding: 0 4px;
    margin-left: 20px;
    transition: 100ms linear;
    transform-origin: left top;
    pointer-events: none; }
    .wco-form-field label::before,
    .form-field label::before {
      content: '';
      position: absolute;
      top: calc(50% - -2px);
      z-index: -1;
      left: 0;
      transform: translateY(-50%);
      width: 100%;
      height: 4px;
      background-color: var(--wco-input-color-bg); }
  .wco-form-field:has(input:focus, textarea:focus, select:focus),
  .form-field:has(input:focus, textarea:focus, select:focus) {
    --wco-input-color-label: var(--wco-color-primary-700);
    --wco-input-color-outline: var(--wco-color-primary-600);
    --wco-input-color-icon: var(--wco-color-primary-600);
    --wco-input-color-text: var(--wco-color-neutral-900);
    --wco-input-color-placeholder: var(--wco-color-neutral-600);
    --wco-input-shadow: inset 0px 0px 0px 1px var(--wco-input-color-outline); }
  .wco-form-field:hover,
  .form-field:hover {
    --wco-input-color-label: var(--wco-color-neutral-700, #50555a);
    --wco-input-color-outline: var(--wco-color-neutral-900, #8d9399); }
  .wco-form-field:has(
  input:disabled,
  textarea:disabled,
  select:disabled,
  .form-field__input.form-field--disabled), .wco-form-field.form-disabled,
  .form-field:has(
  input:disabled,
  textarea:disabled,
  select:disabled,
  .form-field__input.form-field--disabled),
  .form-field.form-disabled {
    --wco-input-color-label: var(--wco-color-neutral-500, #C3C8CC);
    --wco-input-color-outline: var(--wco-color-neutral-300, #C3C8CC);
    --wco-input-color-icon: var(--wco-color-neutral-300, #C3C8CC);
    --wco-input-color-text: var(--wco-color-neutral-600, #C3C8CC);
    --wco-input-color-placeholder: var(--wco-color-neutral-300, #C3C8CC);
    --wco-input-color-bg: var(--wco-color-neutral-100, #E9EBEC); }
  .wco-form-field:has(
  input:read-only:not(:disabled),
  textarea:read-only:not(:disabled),
  select[readonly]:not(:disabled)
), .wco-form-field.form--readonly:not(.form-field--disabled), .wco-form-field.form-field--readonly:not(.form-field--disabled),
  .form-field:has(
  input:read-only:not(:disabled),
  textarea:read-only:not(:disabled),
  select[readonly]:not(:disabled)
),
  .form-field.form--readonly:not(.form-field--disabled),
  .form-field.form-field--readonly:not(.form-field--disabled) {
    --wco-input-color-label: var(--wco-color-neutral-900, #C3C8CC);
    --wco-input-color-outline: transparent;
    --wco-input-color-icon: var(--wco-color-neutral-300, #C3C8CC);
    --wco-input-color-text: var(--wco-color-neutral-900, #C3C8CC);
    --wco-input-color-bg: var(--wco-color-neutral-100, #E9EBEC); }
  .wco-form-field.form-field--error:not(:placeholder-shown) ~ label,
  .wco-form-field.form--error:not(:placeholder-shown) ~ label, .wco-form-field.form-field--error, .wco-form-field:has(input:invalid:not(:placeholder-shown)), .wco-form-field:has(.form-field--error), .wco-form-field.form--error,
  .form-field.form-field--error:not(:placeholder-shown) ~ label,
  .form-field.form--error:not(:placeholder-shown) ~ label,
  .form-field.form-field--error,
  .form-field:has(input:invalid:not(:placeholder-shown)),
  .form-field:has(.form-field--error),
  .form-field.form--error {
    --wco-input-color-label: var(--wco-color-danger-600, #e00707);
    --wco-input-color-outline: var(--wco-color-danger-600, #e00707);
    --wco-input-color-icon: var(--wco-color-danger-600, #e00707);
    --wco-input-color-text: var(--wco-color-neutral-900, #e00707);
    --wco-input-shadow: inset 0px 0px 0px 1px var(--wco-input-color-outline); }
  .wco-form-field textarea ~ label,
  .wco-form-field:has(textarea) label,
  .form-field textarea ~ label,
  .form-field:has(textarea) label {
    top: 16px;
    transform: translateY(0); }
  .wco-form-field:has(input:focus) label,
  .wco-form-field:has(select) label,
  .wco-form-field:has(textarea:focus) label,
  .wco-form-field textarea:focus + label,
  .wco-form-field .readonly + label,
  .form-field:has(input:focus) label,
  .form-field:has(select) label,
  .form-field:has(textarea:focus) label,
  .form-field textarea:focus + label,
  .form-field .readonly + label {
    color: var(--wco-input-color-label);
    top: 0;
    transform: translateY(-50%) translateX(-10px) scale(0.9) !important; }
  .wco-form-field:has(input:not(:placeholder-shown)) label,
  .wco-form-field:has(select:not(:placeholder-shown)) label,
  .wco-form-field:has(textarea:not(:placeholder-shown)) label,
  .wco-form-field textarea:not(:placeholder-shown) + label,
  .wco-form-field input:not(:placeholder-shown) + label,
  .wco-form-field .readonly + label,
  .form-field:has(input:not(:placeholder-shown)) label,
  .form-field:has(select:not(:placeholder-shown)) label,
  .form-field:has(textarea:not(:placeholder-shown)) label,
  .form-field textarea:not(:placeholder-shown) + label,
  .form-field input:not(:placeholder-shown) + label,
  .form-field .readonly + label {
    top: 0;
    transform: translateY(-50%) translateX(-10px) scale(0.9) !important;
    font-weight: 500; }
  .wco-form-field textarea:not(:focus)::placeholder,
  .wco-form-field input:not(:focus)::placeholder,
  .form-field textarea:not(:focus)::placeholder,
  .form-field input:not(:focus)::placeholder {
    opacity: 0; }
  .wco-form-field > i:first-child,
  .wco-form-field > span:first-child,
  .form-field > i:first-child,
  .form-field > span:first-child {
    position: absolute;
    top: 50%;
    left: 12px;
    transform: translateY(-50%);
    color: var(--wco-input-color-icon);
    width: fit-content; }
  .wco-form-field:has(input):has(i:first-child) label,
  .wco-form-field:has(input):has(span:first-child) label,
  .wco-form-field > span ~ .form-field__input + label,
  .wco-form-field > span ~ .form-field__select + label,
  .form-field:has(input):has(i:first-child) label,
  .form-field:has(input):has(span:first-child) label,
  .form-field > span ~ .form-field__input + label,
  .form-field > span ~ .form-field__select + label {
    margin-left: 44px; }
  .wco-form-field:has(input):has(i:first-child) input,
  .wco-form-field:has(input):has(span:first-child) input,
  .wco-form-field > span ~ .form-field__select,
  .wco-form-field > span ~ .form-field__input,
  .form-field:has(input):has(i:first-child) input,
  .form-field:has(input):has(span:first-child) input,
  .form-field > span ~ .form-field__select,
  .form-field > span ~ .form-field__input {
    padding-left: 44px; }
  .wco-form-field:has(input):has(i:last-child) input,
  .wco-form-field:has(input):has(span:last-child) input,
  .form-field:has(input):has(i:last-child) input,
  .form-field:has(input):has(span:last-child) input {
    padding-right: 44px; }
  .wco-form-field:has(input):has(i:last-child) i,
  .wco-form-field:has(input):has(span:last-child) span,
  .wco-form-field > .form-field__select + label + span,
  .wco-form-field > .form-field__input + label + span,
  .form-field:has(input):has(i:last-child) i,
  .form-field:has(input):has(span:last-child) span,
  .form-field > .form-field__select + label + span,
  .form-field > .form-field__input + label + span {
    width: fit-content;
    position: absolute;
    top: 50%;
    right: 12px;
    transform: translateY(-50%); }
    .wco-form-field:has(input):has(i:last-child) i::before,
    .wco-form-field:has(input):has(span:last-child) span::before,
    .wco-form-field > .form-field__select + label + span::before,
    .wco-form-field > .form-field__input + label + span::before,
    .form-field:has(input):has(i:last-child) i::before,
    .form-field:has(input):has(span:last-child) span::before,
    .form-field > .form-field__select + label + span::before,
    .form-field > .form-field__input + label + span::before {
      content: '';
      position: relative;
      top: 2px;
      width: 30px;
      height: 30px; }
  .wco-form-field.form--sm,
  .form-field.form--sm {
    --wco-input-min-height: 32px; }
  .wco-form-field.form--md,
  .form-field.form--md {
    --wco-input-min-height: 40px; }
  .wco-form-field.form--lg,
  .form-field.form--lg {
    --wco-input-min-height: 48px; }
  .wco-form-field:has(input) input,
  .form-field:has(input) input {
    min-height: var(--wco-input-min-height);
    padding-top: 0;
    padding-bottom: 0; }
  .wco-form-field:has(select) label,
  .form-field:has(select) label {
    z-index: 1; }
  .wco-form-field:has(select) select,
  .wco-form-field:has(select) select.form-field__select,
  .form-field:has(select) select,
  .form-field:has(select) select.form-field__select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    padding-right: var(--wco-spacing-md, 40px);
    min-height: var(--wco-input-min-height);
    padding-top: 0;
    padding-bottom: 0; }
  .wco-form-field:has(select).form--readonly, .wco-form-field:has(select):has([readonly]):not(:disabled),
  .form-field:has(select).form--readonly,
  .form-field:has(select):has([readonly]):not(:disabled) {
    pointer-events: none; }
    .wco-form-field:has(select).form--readonly::after, .wco-form-field:has(select):has([readonly]):not(:disabled)::after,
    .form-field:has(select).form--readonly::after,
    .form-field:has(select):has([readonly]):not(:disabled)::after {
      display: none; }
  .wco-form-field:has(select)::after,
  .form-field:has(select)::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 19px;
    transform: translateY(-50%);
    width: min-content;
    height: min-content;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid var(--wco-color-primary-600);
    background-size: 30px;
    background-position: center;
    background-repeat: no-repeat;
    pointer-events: none; }
  .wco-form-field:has(select + i):after,
  .form-field:has(select + i):after {
    display: none; }
  .wco-form-field:has(select + i) select + i,
  .form-field:has(select + i) select + i {
    position: absolute;
    top: 50%;
    right: var(--wco-spacing-nano, 8px);
    transform: translateY(-50%);
    width: 30px; }
  .wco-form-field:has(i + label) select,
  .form-field:has(i + label) select {
    padding-left: var(--wco-spacing-md, 40px); }
  .wco-form-field:has(i + label) i,
  .form-field:has(i + label) i {
    position: absolute;
    top: 50%;
    left: var(--wco-spacing-nano, 8px);
    transform: translateY(-50%);
    width: 30px; }

label.wco-form-radio, .wco-form-radio,
label.form-radio, .form-radio {
  --accent-color: var(--wco-color-primary-700);
  --radio-size: 16px;
  --radio-gap: 8px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: var(--radio-gap); }
  label.wco-form-radio label, .wco-form-radio label,
  label.form-radio label, .form-radio label {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: var(--radio-gap); }
  label.wco-form-radio input[type="radio"], .wco-form-radio input[type="radio"],
  label.form-radio input[type="radio"], .form-radio input[type="radio"] {
    display: none; }
  label.wco-form-radio input[type="radio"] ~ .radio, .wco-form-radio input[type="radio"] ~ .radio,
  label.form-radio input[type="radio"] ~ .radio, .form-radio input[type="radio"] ~ .radio {
    height: var(--radio-size);
    width: var(--radio-size);
    display: inline-flex;
    position: relative;
    border-radius: 50%;
    border: 1px solid var(--wco-color-neutral-500); }
    label.wco-form-radio input[type="radio"] ~ .radio::before, .wco-form-radio input[type="radio"] ~ .radio::before,
    label.form-radio input[type="radio"] ~ .radio::before, .form-radio input[type="radio"] ~ .radio::before {
      content: "";
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: 50%;
      height: 50%;
      border-radius: 50%;
      transition: box-shadow 300ms ease-in-out;
      box-shadow: inset 0px 0px 0px 0px var(--accent-color); }
  label.wco-form-radio input[type="radio"]:checked ~ .radio, .wco-form-radio input[type="radio"]:checked ~ .radio,
  label.form-radio input[type="radio"]:checked ~ .radio, .form-radio input[type="radio"]:checked ~ .radio {
    border: 1px solid var(--accent-color); }
    label.wco-form-radio input[type="radio"]:checked ~ .radio::before, .wco-form-radio input[type="radio"]:checked ~ .radio::before,
    label.form-radio input[type="radio"]:checked ~ .radio::before, .form-radio input[type="radio"]:checked ~ .radio::before {
      box-shadow: inset 0px 0px 12px 12px var(--accent-color); }
  label.wco-form-radio .label, .wco-form-radio .label,
  label.form-radio .label, .form-radio .label {
    color: var(--wco-color-primary-700);
    font-size: var(--wco-font-size-xs);
    font-weight: 400; }
  label.wco-form-radio input[type="radio"]:disabled ~ .radio, .wco-form-radio input[type="radio"]:disabled ~ .radio,
  label.form-radio input[type="radio"]:disabled ~ .radio, .form-radio input[type="radio"]:disabled ~ .radio {
    --accent-color: var(--wco-color-neutral-600);
    background-color: var(--wco-color-neutral-100est); }
  label.wco-form-radio input[type="radio"]:checked:disabled ~ .radio, .wco-form-radio input[type="radio"]:checked:disabled ~ .radio,
  label.form-radio input[type="radio"]:checked:disabled ~ .radio, .form-radio input[type="radio"]:checked:disabled ~ .radio {
    --accent-color: var(--wco-color-neutral-600);
    border: 1px solid var(--wco-color-neutral-600); }
    label.wco-form-radio input[type="radio"]:checked:disabled ~ .radio::before, .wco-form-radio input[type="radio"]:checked:disabled ~ .radio::before,
    label.form-radio input[type="radio"]:checked:disabled ~ .radio::before, .form-radio input[type="radio"]:checked:disabled ~ .radio::before {
      box-shadow: inset 0px 0px 12px 12px var(--wco-color-neutral-600); }

label.wco-form-check, .wco-form-check,
label.form-check, .form-check {
  --wco-checkbox-default-color-label: var(--wco-color-neutral-900);
  --wco-checkbox-default-color-iconunchecked: var(--wco-color-neutral-500);
  --wco-checkbox-default-color-iconchecked: var(--wco-color-primary-600);
  --wco-checkbox-hover-color-label: var(--wco-color-neutral-900);
  --wco-checkbox-hover-color-iconunchecked: var(--wco-color-primary-700);
  --wco-checkbox-hover-color-iconchecked: var(--wco-color-primary-600);
  --wco-checkbox-hover-color-bg: var(--wco-color-primary-50);
  --wco-checkbox-disabled-color-label: var(--wco-color-neutral-700);
  --wco-checkbox-disabled-color-iconunchecked: var(--wco-color-neutral-700);
  --wco-checkbox-disabled-color-iconchecked: var(--wco-color-neutral-500);
  --wco-checkbox-disabled-color-bg: var(--wco-color-neutral-700);
  --wco-checkbox-checkbox-size: 18px;
  --wco-checkbox-checkbox-gap: 12px;
  --wco-checkbox-checkbox-radius: 4px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: var(--wco-checkbox-checkbox-gap); }
  label.wco-form-check.form--readonly, .wco-form-check.form--readonly,
  label.form-check.form--readonly, .form-check.form--readonly {
    pointer-events: none; }
  label.wco-form-check label, .wco-form-check label,
  label.form-check label, .form-check label {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: var(--wco-checkbox-checkbox-gap); }
  label.wco-form-check input[type="checkbox"], .wco-form-check input[type="checkbox"],
  label.form-check input[type="checkbox"], .form-check input[type="checkbox"] {
    display: none; }
  label.wco-form-check input[type="checkbox"] ~ .check, .wco-form-check input[type="checkbox"] ~ .check,
  label.form-check input[type="checkbox"] ~ .check, .form-check input[type="checkbox"] ~ .check {
    height: var(--wco-checkbox-checkbox-size);
    width: var(--wco-checkbox-checkbox-size);
    display: inline-flex;
    position: relative;
    border-radius: var(--wco-checkbox-checkbox-radius);
    border: 2px solid var(--wco-checkbox-default-color-iconunchecked); }
    label.wco-form-check input[type="checkbox"] ~ .check::before, .wco-form-check input[type="checkbox"] ~ .check::before,
    label.form-check input[type="checkbox"] ~ .check::before, .form-check input[type="checkbox"] ~ .check::before {
      content: "";
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: 80%;
      height: 100%;
      background-position: center;
      background-repeat: no-repeat;
      background-size: 0px;
      opacity: 0;
      transition: background-size 100ms linear;
      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 -3 12 15' fill='white' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.00009 6.77988L1.68676 4.46655C1.42676 4.20655 1.00676 4.20655 0.746758 4.46655C0.486758 4.72655 0.486758 5.14655 0.746758 5.40655L3.53342 8.19322C3.79342 8.45322 4.21342 8.45322 4.47342 8.19322L11.5268 1.13988C11.7868 0.879883 11.7868 0.459883 11.5268 0.199883C11.2668 -0.0601172 10.8468 -0.0601172 10.5868 0.199883L4.00009 6.77988Z' fill='%23F9F7F7'/%3E%3C/svg%3E%0A"); }
  label.wco-form-check input[type="checkbox"]:checked ~ .check, .wco-form-check input[type="checkbox"]:checked ~ .check,
  label.form-check input[type="checkbox"]:checked ~ .check, .form-check input[type="checkbox"]:checked ~ .check {
    border: 2px solid var(--wco-checkbox-default-color-iconchecked);
    background-color: var(--wco-checkbox-default-color-iconchecked); }
    label.wco-form-check input[type="checkbox"]:checked ~ .check::before, .wco-form-check input[type="checkbox"]:checked ~ .check::before,
    label.form-check input[type="checkbox"]:checked ~ .check::before, .form-check input[type="checkbox"]:checked ~ .check::before {
      opacity: 1;
      background-size: 100%; }
  label.wco-form-check .label, .wco-form-check .label,
  label.form-check .label, .form-check .label {
    color: var(--wco-checkbox-default-color-label);
    font-size: var(--wco-font-size-xs);
    font-family: var(--wco-font-family);
    font-weight: 400;
    letter-spacing: 0.4px; }
  label.wco-form-check:hover:has(input[type="checkbox"]:not(:checked):not(:disabled)) .check, .wco-form-check:hover:has(input[type="checkbox"]:not(:checked):not(:disabled)) .check,
  label.form-check:hover:has(input[type="checkbox"]:not(:checked):not(:disabled)) .check, .form-check:hover:has(input[type="checkbox"]:not(:checked):not(:disabled)) .check {
    border: 2px solid var(--wco-checkbox-default-color-iconchecked); }
  label.wco-form-check:hover:has(input[type="checkbox"]:not(:disabled)) .check::after, .wco-form-check:hover:has(input[type="checkbox"]:not(:disabled)) .check::after,
  label.form-check:hover:has(input[type="checkbox"]:not(:disabled)) .check::after, .form-check:hover:has(input[type="checkbox"]:not(:disabled)) .check::after {
    background-color: var(--wco-checkbox-hover-color-bg);
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0);
    width: calc(var(--wco-checkbox-checkbox-size) * 2);
    height: calc(var(--wco-checkbox-checkbox-size) * 2);
    border-radius: 50%;
    z-index: -1;
    transition: transform 300ms ease-in-out;
    animation: introScaleCheckboxWco 300ms ease-in-out forwards; }
  label.wco-form-check:hover:has(input[type="checkbox"]:not(:disabled)) .label, .wco-form-check:hover:has(input[type="checkbox"]:not(:disabled)) .label,
  label.form-check:hover:has(input[type="checkbox"]:not(:disabled)) .label, .form-check:hover:has(input[type="checkbox"]:not(:disabled)) .label {
    cursor: pointer; }

@keyframes introScaleCheckboxWco {
  0% {
    transform: translate(-50%, -50%) scale(0); }
  70% {
    transform: translate(-50%, -50%) scale(1.1); }
  100% {
    transform: translate(-50%, -50%) scale(1); } }
  label.wco-form-check:has(input[type="checkbox"]:disabled), .wco-form-check:has(input[type="checkbox"]:disabled),
  label.form-check:has(input[type="checkbox"]:disabled), .form-check:has(input[type="checkbox"]:disabled) {
    opacity: 0.3; }
  label.wco-form-check input[type="checkbox"]:disabled ~ .check, .wco-form-check input[type="checkbox"]:disabled ~ .check,
  label.form-check input[type="checkbox"]:disabled ~ .check, .form-check input[type="checkbox"]:disabled ~ .check {
    border: 2px solid var(--wco-checkbox-disabled-color-iconchecked);
    background-color: var(--wco-color-neutral-50); }
  label.wco-form-check input[type="checkbox"]:disabled ~ .label, .wco-form-check input[type="checkbox"]:disabled ~ .label,
  label.form-check input[type="checkbox"]:disabled ~ .label, .form-check input[type="checkbox"]:disabled ~ .label {
    color: var(--wco-checkbox-disabled-color-label); }
  label.wco-form-check input[type="checkbox"]:checked:disabled ~ .check, .wco-form-check input[type="checkbox"]:checked:disabled ~ .check,
  label.form-check input[type="checkbox"]:checked:disabled ~ .check, .form-check input[type="checkbox"]:checked:disabled ~ .check {
    --accent-color: var(--wco-color-neutral-600);
    border: 2px solid var(--wco-color-neutral-600);
    background-color: var(--wco-checkbox-disabled-color-iconchecked); }
  label.wco-form-check input[type="checkbox"]:checked:disabled ~ .label, .wco-form-check input[type="checkbox"]:checked:disabled ~ .label,
  label.form-check input[type="checkbox"]:checked:disabled ~ .label, .form-check input[type="checkbox"]:checked:disabled ~ .label {
    color: var(--wco-checkbox-disabled-color-label); }
  label.wco-form-check.form--error, label.wco-form-check.form-field--error, .wco-form-check.form--error, .wco-form-check.form-field--error,
  label.form-check.form--error,
  label.form-check.form-field--error, .form-check.form--error, .form-check.form-field--error {
    --wco-checkbox-default-color-label: var(--wco-color-danger-900);
    --wco-checkbox-default-color-iconunchecked: var(--wco-color-danger-600);
    --wco-checkbox-default-color-iconchecked: var(--wco-color-danger-600); }

.wco-form-switch {
  --wco-switch-color-label: var(--wco-switch-custom-color-label, var(--wco-color-neutral-700));
  --wco-switch-color-bg: var(--wco-switch-custom-color-bg, var(--wco-color-neutral-50));
  --wco-switch-color-border-color: var(--wco-switch-custom-color-border, var(--wco-color-neutral-600));
  --wco-switch-color-bullet: var(--wco-switch-custom-color-bullet, var(--wco-color-neutral-600));
  --wco-switch-color-icon: var(--wco-switch-custom-color-icon, var(--wco-color-neutral-50));
  --wco-switch-general-spacing: 8px;
  --wco-switch-radius: calc(var(--wco-radius-md) * 2);
  --wco-switch-size-max-w: 48px;
  --wco-switch-size-max-h: 28px;
  --wco-switch-size-bullet: 18px;
  --wco-switch-checked-spaceInner: 3px;
  display: flex;
  align-items: center;
  gap: var(--wco-spacing-nano); }
  .wco-form-switch input[type="checkbox"] {
    display: none; }
  .wco-form-switch span.label {
    color: var(--wco-switch-color-label);
    font-size: var(--wco-font-size-xs);
    font-family: var(--wco-font-family);
    font-weight: 400;
    letter-spacing: 0.4px; }
  .wco-form-switch span.toggle {
    display: inline-flex;
    min-width: 40px;
    align-items: center;
    position: relative;
    z-index: 1;
    border-radius: var(--wco-switch-radius);
    width: calc(var(--wco-switch-size-max-w, 48px) + 4px);
    background-color: var(--wco-switch-color-bg, #f1f1f1);
    height: var(--wco-switch-size-max-h, 28px);
    border: 2px solid var(--wco-switch-color-border-color, #8d9399);
    padding: var(--wco-switch-checked-spaceInner, 3px);
    transform-origin: center center;
    perspective: 1000px; }
    .wco-form-switch span.toggle:before, .wco-form-switch span.toggle:after, .wco-form-switch span.toggle i {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      transition: all 300ms ease-in-out;
      display: flex;
      align-items: center;
      justify-content: center;
      pointer-events: none;
      user-select: none;
      left: var(--wco-switch-checked-position, 3px);
      font-size: var(--wco-font-size-xxxs);
      width: var(--wco-switch-size-bullet, 24px);
      height: var(--wco-switch-size-bullet, 24px);
      color: var(--wco-switch-color-icon, #8d9399);
      line-height: var(--wco-switch-size-bullet, 24px); }
    .wco-form-switch span.toggle:before, .wco-form-switch span.toggle:after {
      content: '';
      border-radius: 100%;
      background-color: var(--wco-switch-color-bullet, #8d9399);
      color: var(--wco-switch-color-bullet, #8d9399);
      z-index: -1; }
  .wco-form-switch:has(input[type="checkbox"]:checked) {
    --wco-switch-custom-color-bg: var(--wco-color-primary-600);
    --wco-switch-custom-color-border:  var(--wco-color-primary-600);
    --wco-switch-custom-color-bullet: var(--wco-color-neutral-50);
    --wco-switch-custom-color-icon: var(--wco-color-primary-600);
    --wco-switch-checked-position: calc(100% - var(--wco-switch-size-bullet, 24px) - var(--wco-switch-checked-spaceInner, 3px)); }
  .wco-form-switch:has(input[type="checkbox"]:not(:disabled)) {
    cursor: pointer; }
    .wco-form-switch:has(input[type="checkbox"]:not(:disabled)):has(input[type="checkbox"]:hover):has(input[type="checkbox"]:checked) span.toggle::before {
      background-color: var(--wco-switch-custom-color-shadow, var(--wco-color-primary-500)); }
    .wco-form-switch:has(input[type="checkbox"]:not(:disabled)):has(input[type="checkbox"]:hover) span.toggle:before {
      transform: translateY(-50%) scale(1.8);
      opacity: 0.3; }
  .wco-form-switch.form--error {
    --wco-switch-custom-color-border:  var(--wco-color-danger-600);
    --wco-switch-custom-color-bullet: var(--wco-color-danger-600);
    --wco-switch-custom-color-icon: var(--wco-color-danger-50);
    --wco-switch-custom-color-label: var(--wco-color-danger-600); }
    .wco-form-switch.form--error:has(input[type="checkbox"]:checked) {
      --wco-switch-custom-color-border:  var(--wco-color-danger-600);
      --wco-switch-custom-color-bullet: var(--wco-color-danger-600);
      --wco-switch-custom-color-icon: var(--wco-color-danger-50);
      --wco-switch-custom-color-bg: var(--wco-color-danger-50); }
  .wco-form-switch.switch-secondary:has(input[type="checkbox"]:checked) {
    --wco-switch-custom-color-shadow: var(--wco-color-secondary-500);
    --wco-switch-custom-color-border:  var(--wco-color-secondary-600);
    --wco-switch-custom-color-bullet: var(--wco-color-secondary-50);
    --wco-switch-custom-color-icon: var(--wco-color-secondary-600);
    --wco-switch-custom-color-bg: var(--wco-color-secondary-600); }
  .wco-form-switch.switch-success:has(input[type="checkbox"]:checked) {
    --wco-switch-custom-color-shadow: var(--wco-color-success-500);
    --wco-switch-custom-color-border:  var(--wco-color-success-600);
    --wco-switch-custom-color-bullet: var(--wco-color-success-50);
    --wco-switch-custom-color-icon: var(--wco-color-success-600);
    --wco-switch-custom-color-bg: var(--wco-color-success-600); }
  .wco-form-switch.switch-info:has(input[type="checkbox"]:checked) {
    --wco-switch-custom-color-bg: var(--wco-color-info-500);
    --wco-switch-custom-color-shadow: var(--wco-color-info-500);
    --wco-switch-custom-color-border:  var(--wco-color-info-600);
    --wco-switch-custom-color-bullet: var(--wco-color-info-50);
    --wco-switch-custom-color-icon: var(--wco-color-info-600);
    --wco-switch-custom-color-bg: var(--wco-color-info-600); }
  .wco-form-switch.switch-danger:has(input[type="checkbox"]:checked) {
    --wco-switch-custom-color-bg: var(--wco-color-danger-500);
    --wco-switch-custom-color-shadow: var(--wco-color-danger-500);
    --wco-switch-custom-color-border:  var(--wco-color-danger-600);
    --wco-switch-custom-color-bullet: var(--wco-color-danger-50);
    --wco-switch-custom-color-icon: var(--wco-color-danger-600);
    --wco-switch-custom-color-bg: var(--wco-color-danger-600); }
  .wco-form-switch.switch-warning:has(input[type="checkbox"]:checked) {
    --wco-switch-custom-color-shadow: var(--wco-color-warning-500);
    --wco-switch-custom-color-border:  var(--wco-color-warning-600);
    --wco-switch-custom-color-bullet: var(--wco-color-warning-50);
    --wco-switch-custom-color-icon: var(--wco-color-warning-600);
    --wco-switch-custom-color-bg: var(--wco-color-warning-600); }
  .wco-form-switch:has(input[type="checkbox"]:disabled), .wco-form-switch.wco-form-disabled {
    opacity: 0.3; }
    .wco-form-switch:has(input[type="checkbox"]:disabled) span.toggle, .wco-form-switch.wco-form-disabled span.toggle {
      filter: grayscale(1); }
  .wco-form-switch.form--readonly {
    pointer-events: none;
    user-select: none; }
    .wco-form-switch.form--readonly .label {
      color: var(--wco-color-neutral-900); }

.wco-form-upload {
  --wco-attachment-default-color-border: var(--wco-color-neutral-500);
  --wco-attachment-default-color-bg: var(--wco-color-neutral-50);
  --wco-attachment-default-color-title: var(--wco-color-neutral-900);
  --wco-attachment-default-color-body: var(--wco-color-neutral-700);
  --wco-attachment-default-color-loading-elements: var(--wco-color-neutral-500);
  --wco-attachment-default-color-finalize-elements: var(--wco-color-neutral-600);
  --wco-attachment-hover-color-border: var(--wco-color-primary-600);
  --wco-attachment-hover-color-bg: var(--wco-color-primary-50);
  --color-button: var(--wco-color-primary-600);
  --color-button-hover: var(--wco-color-primary-700);
  border: 2px dashed var(--wco-attachment-default-color-border);
  border-radius: 10px;
  padding: var(--wco-spacing-xxs);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--wco-spacing-nano);
  cursor: pointer;
  transition: all 0.3s;
  container-type: inline-size;
  overflow: hidden;
  min-width: max-content;
  position: relative; }
  .wco-form-upload:has(input[type="file"]:not(:disabled)):not(.wco-form-disabled):hover {
    border-color: var(--wco-attachment-hover-color-border);
    background-color: var(--wco-attachment-hover-color-bg); }
    .wco-form-upload:has(input[type="file"]:not(:disabled)):not(.wco-form-disabled):hover .wco-form-upload__info > span + span {
      color: var(--wco-attachment-hover-color-bg);
      background-color: var(--wco-attachment-hover-color-border);
      box-shadow: 1px 4px 11px var(--wco-attachment-hover-color-border); }
  .wco-form-upload:has(input[type="file"]:disabled), .wco-form-upload.wco-form-disabled {
    background-color: var(--wco-color-neutral-100);
    color: var(--wco-color-neutral-300);
    opacity: 0.8;
    cursor: not-allowed; }
    .wco-form-upload:has(input[type="file"]:disabled) input, .wco-form-upload.wco-form-disabled input {
      pointer-events: none; }
  .wco-form-upload.form--error {
    border-color: var(--wco-color-danger-600); }
    .wco-form-upload.form--error .wco-form-upload__info > span + span {
      color: var(--wco-color-danger-600);
      background-color: var(--wco-color-danger-50);
      box-shadow: 1px 4px 11px var(--wco-color-danger-50); }
  .wco-form-upload > input[type="file"] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer; }
  .wco-form-upload__info {
    display: inherit;
    justify-content: center;
    align-items: center;
    font-family: var(--wco-font-family);
    font-size: var(--wco-font-size-xs);
    font-weight: var(--wco-font-weight-regular);
    letter-spacing: 0.4px; }
    .wco-form-upload__info > span {
      color: var(--wco-attachment-default-color-title);
      font-family: var(--wco-font-family); }
    .wco-form-upload__info > span + span {
      color: var(--wco-attachment-hover-color-border);
      margin-left: var(--wco-spacing-quark);
      min-height: 32px;
      padding: var(--wco-spacing-quark) var(--wco-spacing-xxs);
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: var(--wco-spacing-quark);
      gap: var(--wco-spacing-nano);
      font-weight: 600;
      transform: scale(0.99);
      transition: box-shadow 0.3s ease-in-out;
      box-shadow: 0px 0px 0px var(--wco-attachment-hover-color-border); }

@container (width < 550px) {
  .wco-form-upload__info {
    flex-direction: column; } }
  .wco-form-upload p {
    font-family: var(--wco-font-family);
    font-size: var(--wco-font-size-xxs);
    font-weight: 300;
    color: var(--wco-attachment-default-color-body, #50555A);
    letter-spacing: 0.35px;
    padding-top: var(--wco-spacing-nano);
    text-align: center; }
    .wco-form-upload p strong {
      font-weight: 600; }
  .wco-form-upload .upload__info {
    font-size: var(--wco-font-size-xxs);
    font-weight: 300;
    color: var(--wco-attachment-default-color-body);
    letter-spacing: 0.45px;
    padding-top: var(--wco-spacing-nano);
    text-align: center; }
  .wco-form-upload .upload__button {
    display: inherit;
    justify-content: center;
    gap: 8px; }
    .wco-form-upload .upload__button span,
    .wco-form-upload .upload__button label {
      color: var(--color-button);
      cursor: pointer; }

.helper-text {
  display: flex;
  gap: var(--wco-spacing-nano);
  align-items: center;
  font-size: var(--wco-font-size-xxs);
  font-family: var(--wco-font-family);
  font-weight: 400;
  line-height: 170%;
  color: #080809; }
  .helper-text .icon {
    color: var(--wco-input-color-helptext);
    width: 20px;
    height: 20px;
    display: block;
    transform: translateY(-1px);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain; }
  .helper-text.error > :is(i, span:first-child) {
    color: var(--wco-color-danger-600); }
  .helper-text.warning > :is(i, span:first-child) {
    color: var(--wco-color-warning-600); }
  .helper-text.success > :is(i, span:first-child) {
    color: var(--wco-color-success-600); }
  .helper-text.info > :is(i, span:first-child) {
    color: var(--wco-color-info-600); }

.wco-chip {
  --wco-chip-size: 21px;
  --wco-chip-spacing: var(--wco-spacing-none) var(--wco-spacing-nano);
  --wco-chip-gap: var(--wco-spacing-nano, 8px);
  --wco-chip-border-radius: var(--wco-radius-md, 8px);
  --wco-chip-background-color: transparent;
  --wco-chip-color: var(--wco-color-primary-600);
  --wco-chip-font-size: var(--wco-font-size-xxs);
  --wco-chip-line-height: var(--wco-font-lineheight-500);
  --wco-chip-icon-size: var(--wco-icon-size-small);
  --wco-chip-icon-color: var(--wco-color-gray-800);
  font-size: var(--wco-chip-font-size, 14px);
  color: var(--wco-chip-color, #333);
  border: inherit;
  background-color: var(--wco-chip-background-color, #fff);
  border-radius: var(--wco-chip-border-radius, 4px);
  gap: var(--wco-chip-gap, 4px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--wco-chip-spacing, 0 4px);
  min-height: var(--wco-chip-size, 24px);
  width: fit-content;
  font-style: normal;
  font-weight: 600;
  text-align: center;
  font-family: var(--wco-font-family);
  line-height: 150%;
  letter-spacing: 0.35px;
  transition: transform 200ms linear, background-color 300ms ease-in-out; }
  .wco-chip > span, .wco-chip i {
    font-size: var(--wco-chip-icon-size, 14px); }
  .wco-chip:not(:disabled):hover, .wco-chip:not(.chip-error):hover, .wco-chip:not(.chip-disabled):hover, .wco-chip:not(.chip-active):hover {
    cursor: pointer;
    --wco-chip-background-color: var(--wco-color-primary-50);
    --wco-chip-color: var(--wco-color-primary-700);
    transform: scale(1); }
  .wco-chip:not(:disabled):focus, .wco-chip:not(.chip-error):focus, .wco-chip:not(.chip-disabled):focus, .wco-chip:not(.chip-active):focus {
    transform: scale(0.99) translateY(0.5px);
    box-shadow: var(--wco-shadow-level-0);
    --wco-chip-background-color: var(--wco-color-primary-100);
    --wco-chip-color: var(--wco-color-primary-900); }
  .wco-chip.chip-disabled, .wco-chip:disabled {
    --wco-chip-background-color: transparent;
    --wco-chip-color: var(--wco-color-neutral-700);
    pointer-events: none;
    opacity: 0.4; }
  .wco-chip.chip-selected, .wco-chip.chip-active {
    --wco-chip-background-color: var(--wco-color-primary-100);
    --wco-chip-color: var(--wco-color-primary-900); }
    .wco-chip.chip-selected:hover, .wco-chip.chip-active:hover {
      --wco-chip-background-color: var(--wco-color-primary-100);
      --wco-chip-color: var(--wco-color-primary-900); }
    .wco-chip.chip-selected:focus, .wco-chip.chip-active:focus {
      --wco-chip-background-color: var(--wco-color-primary-100);
      --wco-chip-color: var(--wco-color-primary-900); }
  .wco-chip.chip-outline {
    border: 1px solid var(--wco-chip-color, #333); }
  .wco-chip.chip-md {
    --wco-chip-spacing: var(--wco-spacing-quark) var(--wco-spacing-xxxs);
    --wco-chip-size: 29px; }
  .wco-chip.chip-lg {
    --wco-chip-spacing: var(--wco-spacing-nano) var(--wco-spacing-xxs);
    --wco-chip-size: 37px; }
  .wco-chip.chip-error {
    --wco-chip-background-color: transparent;
    --wco-chip-color: var(--wco-color-danger-700); }
    .wco-chip.chip-error:hover {
      --wco-chip-background-color: transparent
            --wco-chip-color: var(--wco-color-danger-600); }
    .wco-chip.chip-error:focus {
      --wco-chip-background-color: transparent;
      --wco-chip-color: var(--wco-color-danger-600); }

.wco-group-chips {
  display: flex;
  flex-wrap: wrap;
  gap: var(--wco-spacing-nano, 12px); }

.wco-tag {
  --wco-tag-size: 29px;
  --wco-tag-spacing: var(--wco-spacing-quark) var(--wco-spacing-xxxs);
  --wco-tag-gap: var(--wco-spacing-nano, 8px);
  --wco-tag-color: var(--wco-color-neutral-700);
  --wco-tag-background-color: transparent;
  --wco-tag-border-radius: var(--wco-radius-lg, 24px);
  --wco-tag-border-color: var(--wco-color-neutral-700);
  --wco-tag-font-size: var(--wco-font-size-xxs, 14px);
  --wco-tag-icon-size: var(--wco-icon-size-small);
  --wco-tag-icon-color: var(--wco-color-neutral-700);
  font-size: var(--wco-tag-font-size, 14px);
  color: var(--wco-tag-color, #333);
  background-color: var(--wco-tag-background-color, #fff);
  border: 1px solid var(--wco-tag-border-color);
  border-radius: var(--wco-tag-border-radius, 24px);
  gap: var(--wco-tag-gap, 4px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--wco-tag-spacing, 0 4px);
  min-height: var(--wco-tag-size, 24px);
  width: fit-content;
  font-style: normal;
  font-weight: 600;
  text-align: center;
  font-family: var(--wco-font-family);
  line-height: 150%;
  letter-spacing: 0.35px;
  text-wrap: nowrap; }
  .wco-tag span,
  .wco-tag i {
    color: var(--wco-tag-icon-color);
    font-size: var(--wco-tag-icon-size, 14px);
    line-height: 150%; }
  .wco-tag.tag-icon-toggle {
    position: relative;
    padding-inline-end: calc(var(--wco-spacing-xxxs) + 2px); }
    .wco-tag.tag-icon-toggle > i, .wco-tag.tag-icon-toggle > span, .wco-tag.tag-icon-toggle > button {
      position: absolute;
      right: -4px;
      height: 100%;
      opacity: 0;
      display: inline-flex;
      align-items: center;
      width: min-content;
      visibility: hidden;
      --wco-tag-icon-size: calc(var(--wco-tag-font-size) - 2px);
      transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out, right 0.2s ease-in-out; }
    .wco-tag.tag-icon-toggle:has(button:last-child):hover > button {
      cursor: pointer;
      opacity: 1;
      visibility: visible;
      right: 2px; }
    .wco-tag.tag-icon-toggle:is(button, a):not(:disabled) {
      cursor: pointer; }
      .wco-tag.tag-icon-toggle:is(button, a):not(:disabled):hover i, .wco-tag.tag-icon-toggle:is(button, a):not(:disabled):hover span {
        opacity: 1;
        visibility: visible;
        right: 2px; }

.tag-success {
  --wco-tag-color: var(--wco-color-success-700);
  --wco-tag-border-color: var(--wco-color-success-700);
  --wco-tag-background-color: var(--wco-color-success-50); }
  .tag-success span,
  .tag-success i {
    --wco-tag-icon-color: var(--wco-color-success-700); }

.tag-warning {
  --wco-tag-color: var(--wco-color-warning-700);
  --wco-tag-border-color: var(--wco-color-warning-700);
  --wco-tag-background-color: var(--wco-color-warning-50); }
  .tag-warning span,
  .tag-warning i {
    --wco-tag-icon-color: var(--wco-color-warning-700); }

.tag-error {
  --wco-tag-color: var(--wco-color-danger-700);
  --wco-tag-border-color: var(--wco-color-danger-700);
  --wco-tag-background-color: var(--wco-color-danger-50); }
  .tag-error span,
  .tag-error i {
    --wco-tag-icon-color: var(--wco-color-danger-700); }

.tag-info {
  --wco-tag-color: var(--wco-color-info-700);
  --wco-tag-border-color: var(--wco-color-info-700);
  --wco-tag-background-color: var(--wco-color-info-50); }
  .tag-info span,
  .tag-info i {
    --wco-tag-icon-color: var(--wco-color-info-700); }

.tag-disabled {
  --wco-tag-color: var(--wco-color-neutral-500);
  --wco-tag-border-color: var(--wco-color-neutral-500);
  --wco-tag-background-color: var(--wco-color-neutral-50);
  cursor: default; }
  .tag-disabled span,
  .tag-disabled i {
    --wco-tag-icon-color: var(--wco-color-neutral-500); }

.tag-basic {
  --wco-tag-size: 28px;
  --wco-tag-spacing: var(--wco-spacing-quark) var(--wco-spacing-xxxs);
  --wco-tag-gap: var(--wco-spacing-quark, 4px);
  --wco-tag-color: var(--wco-color-neutral-900);
  --wco-tag-background-color: var(--wco-color-neutral-100);
  --wco-tag-border-radius: var(--wco-radius-nano, 8px);
  --wco-tag-border-color: transparent; }
  .tag-basic span, .tag-basic i {
    font-size: calc(var(--wco-tag-font-size) - 2px); }
  .tag-basic:is(button):disabled {
    --wco-tag-background-color: var(--wco-color-neutral-300); }
  .tag-basic:not(.tag-icon-toggle):has(i:last-child) {
    padding-right: var(--wco-spacing-quark); }
  .tag-basic:not(.tag-icon-toggle):has(i:first-child) {
    padding-left: var(--wco-spacing-quark); }

.wco-group-tags {
  display: flex;
  flex-wrap: wrap;
  gap: var(--wco-spacing-nano, 12px); }

dialog.wco-modal {
  --wco-modal-size: 640px;
  --wco-modal-padding: var(--wco-spacing-xl) var(--wco-spacing-md);
  --wco-modal-bg: var(--wco-color-neutral-50);
  --wco-modal-border-radius: var(--wco-radius-sm);
  --wco-modal-shadow: var(--wco-shadow-level-2);
  --wco-animate-modal-top: 10px;
  --wco-animate-modal-opacity: 0;
  background-color: transparent;
  box-shadow: none;
  container-name: modalWco;
  container-type: inline-size;
  border: none;
  place-items: center;
  max-width: 100vw;
  max-height: 100vh;
  width: 100%;
  height: 100%;
  display: none;
  transition: display 0.7s allow-discrete, overlay 0.7s allow-discrete, transform 0.7s ease-in-out allow-discrete; }
  dialog.wco-modal[open] {
    display: grid; }
    dialog.wco-modal[open] main {
      margin: var(--wco-spacing-lg);
      --wco-animate-modal-top: 0;
      --wco-animate-modal-opacity: 1;
      transition: all 300ms ease-in-out allow-discrete; }
      @media screen and (max-width: 768px) {
        dialog.wco-modal[open] main {
          margin: 0; } }

@starting-style {
  dialog.wco-modal[open] main {
    --wco-animate-modal-top: 10px;
    --wco-animate-modal-opacity: 0; } }
  dialog.wco-modal > main {
    position: relative;
    min-width: var(--wco-modal-size);
    width: min-content;
    background-color: var(--wco-modal-bg);
    border-radius: var(--wco-modal-border-radius);
    box-shadow: var(--wco-modal-shadow);
    padding: var(--wco-modal-padding);
    display: flex;
    flex-direction: column;
    opacity: var(--wco-animate-modal-opacity);
    transform: translateY(var(--wco-animate-modal-top));
    transition: all 0.4s ease-in-out; }
    @media screen and (max-width: 768px) {
      dialog.wco-modal > main {
        --wco-modal-size: calc(100vw - var(--wco-spacing-md));
        --wco-modal-padding: var(--wco-spacing-xs) var(--wco-spacing-xxs); } }
    @media screen and (max-width: 550px) {
      dialog.wco-modal > main {
        --wco-modal-padding: var(--wco-spacing-xxxs) var(--wco-spacing-nano); } }
  dialog.wco-modal button.wco-modal--close {
    padding: var(--wco-spacing-nano);
    position: absolute;
    top: 0;
    right: 0;
    background: none;
    border: none;
    cursor: pointer;
    font-size: var(--wco-font-size-md);
    color: var(--wco-color-primary-700);
    transition: color 0.3s; }
    dialog.wco-modal button.wco-modal--close:hover {
      color: var(--wco-color-primary-500); }
  dialog.wco-modal::backdrop {
    background-color: rgba(0, 0, 0, 0.5);
    transition: display 0.1s allow-discrete, overlay 0.1s allow-discrete, background-color 0.1s; }

.m-none {
  margin: var(--wco-spacing-none); }

.m-quark {
  margin: var(--wco-spacing-quark); }

.m-nano {
  margin: var(--wco-spacing-nano); }

.m-xxxs {
  margin: var(--wco-spacing-xxxs); }

.m-xxs {
  margin: var(--wco-spacing-xxs); }

.m-xs {
  margin: var(--wco-spacing-xs); }

.m-sm {
  margin: var(--wco-spacing-sm); }

.m-md {
  margin: var(--wco-spacing-md); }

.m-lg {
  margin: var(--wco-spacing-lg); }

.m-xl {
  margin: var(--wco-spacing-xl); }

.m-xxl {
  margin: var(--wco-spacing-xxl); }

.m-xxxl {
  margin: var(--wco-spacing-xxxl); }

.m-huge {
  margin: var(--wco-spacing-huge); }

.mx-none {
  margin-left: var(--wco-spacing-none);
  margin-right: var(--wco-spacing-none); }

.mx-quark {
  margin-left: var(--wco-spacing-quark);
  margin-right: var(--wco-spacing-quark); }

.mx-nano {
  margin-left: var(--wco-spacing-nano);
  margin-right: var(--wco-spacing-nano); }

.mx-xxxs {
  margin-left: var(--wco-spacing-xxxs);
  margin-right: var(--wco-spacing-xxxs); }

.mx-xxs {
  margin-left: var(--wco-spacing-xxs);
  margin-right: var(--wco-spacing-xxs); }

.mx-xs {
  margin-left: var(--wco-spacing-xs);
  margin-right: var(--wco-spacing-xs); }

.mx-sm {
  margin-left: var(--wco-spacing-sm);
  margin-right: var(--wco-spacing-sm); }

.mx-md {
  margin-left: var(--wco-spacing-md);
  margin-right: var(--wco-spacing-md); }

.mx-lg {
  margin-left: var(--wco-spacing-lg);
  margin-right: var(--wco-spacing-lg); }

.mx-xl {
  margin-left: var(--wco-spacing-xl);
  margin-right: var(--wco-spacing-xl); }

.mx-xxl {
  margin-left: var(--wco-spacing-xxl);
  margin-right: var(--wco-spacing-xxl); }

.mx-xxxl {
  margin-left: var(--wco-spacing-xxxl);
  margin-right: var(--wco-spacing-xxxl); }

.mx-huge {
  margin-left: var(--wco-spacing-huge);
  margin-right: var(--wco-spacing-huge); }

.my-none {
  margin-top: var(--wco-spacing-none);
  margin-bottom: var(--wco-spacing-none); }

.my-quark {
  margin-top: var(--wco-spacing-quark);
  margin-bottom: var(--wco-spacing-quark); }

.my-nano {
  margin-top: var(--wco-spacing-nano);
  margin-bottom: var(--wco-spacing-nano); }

.my-xxxs {
  margin-top: var(--wco-spacing-xxxs);
  margin-bottom: var(--wco-spacing-xxxs); }

.my-xxs {
  margin-top: var(--wco-spacing-xxs);
  margin-bottom: var(--wco-spacing-xxs); }

.my-xs {
  margin-top: var(--wco-spacing-xs);
  margin-bottom: var(--wco-spacing-xs); }

.my-sm {
  margin-top: var(--wco-spacing-sm);
  margin-bottom: var(--wco-spacing-sm); }

.my-md {
  margin-top: var(--wco-spacing-md);
  margin-bottom: var(--wco-spacing-md); }

.my-lg {
  margin-top: var(--wco-spacing-lg);
  margin-bottom: var(--wco-spacing-lg); }

.my-xl {
  margin-top: var(--wco-spacing-xl);
  margin-bottom: var(--wco-spacing-xl); }

.my-xxl {
  margin-top: var(--wco-spacing-xxl);
  margin-bottom: var(--wco-spacing-xxl); }

.my-xxxl {
  margin-top: var(--wco-spacing-xxxl);
  margin-bottom: var(--wco-spacing-xxxl); }

.my-huge {
  margin-top: var(--wco-spacing-huge);
  margin-bottom: var(--wco-spacing-huge); }

.mt-none {
  margin-top: var(--wco-spacing-none); }

.mt-quark {
  margin-top: var(--wco-spacing-quark); }

.mt-nano {
  margin-top: var(--wco-spacing-nano); }

.mt-xxxs {
  margin-top: var(--wco-spacing-xxxs); }

.mt-xxs {
  margin-top: var(--wco-spacing-xxs); }

.mt-xs {
  margin-top: var(--wco-spacing-xs); }

.mt-sm {
  margin-top: var(--wco-spacing-sm); }

.mt-md {
  margin-top: var(--wco-spacing-md); }

.mt-lg {
  margin-top: var(--wco-spacing-lg); }

.mt-xl {
  margin-top: var(--wco-spacing-xl); }

.mt-xxl {
  margin-top: var(--wco-spacing-xxl); }

.mt-xxxl {
  margin-top: var(--wco-spacing-xxxl); }

.mt-huge {
  margin-top: var(--wco-spacing-huge); }

.mr-none {
  margin-right: var(--wco-spacing-none); }

.mr-quark {
  margin-right: var(--wco-spacing-quark); }

.mr-nano {
  margin-right: var(--wco-spacing-nano); }

.mr-xxxs {
  margin-right: var(--wco-spacing-xxxs); }

.mr-xxs {
  margin-right: var(--wco-spacing-xxs); }

.mr-xs {
  margin-right: var(--wco-spacing-xs); }

.mr-sm {
  margin-right: var(--wco-spacing-sm); }

.mr-md {
  margin-right: var(--wco-spacing-md); }

.mr-lg {
  margin-right: var(--wco-spacing-lg); }

.mr-xl {
  margin-right: var(--wco-spacing-xl); }

.mr-xxl {
  margin-right: var(--wco-spacing-xxl); }

.mr-xxxl {
  margin-right: var(--wco-spacing-xxxl); }

.mr-huge {
  margin-right: var(--wco-spacing-huge); }

.mb-none {
  margin-bottom: var(--wco-spacing-none); }

.mb-quark {
  margin-bottom: var(--wco-spacing-quark); }

.mb-nano {
  margin-bottom: var(--wco-spacing-nano); }

.mb-xxxs {
  margin-bottom: var(--wco-spacing-xxxs); }

.mb-xxs {
  margin-bottom: var(--wco-spacing-xxs); }

.mb-xs {
  margin-bottom: var(--wco-spacing-xs); }

.mb-sm {
  margin-bottom: var(--wco-spacing-sm); }

.mb-md {
  margin-bottom: var(--wco-spacing-md); }

.mb-lg {
  margin-bottom: var(--wco-spacing-lg); }

.mb-xl {
  margin-bottom: var(--wco-spacing-xl); }

.mb-xxl {
  margin-bottom: var(--wco-spacing-xxl); }

.mb-xxxl {
  margin-bottom: var(--wco-spacing-xxxl); }

.mb-huge {
  margin-bottom: var(--wco-spacing-huge); }

.ml-none {
  margin-left: var(--wco-spacing-none); }

.ml-quark {
  margin-left: var(--wco-spacing-quark); }

.ml-nano {
  margin-left: var(--wco-spacing-nano); }

.ml-xxxs {
  margin-left: var(--wco-spacing-xxxs); }

.ml-xxs {
  margin-left: var(--wco-spacing-xxs); }

.ml-xs {
  margin-left: var(--wco-spacing-xs); }

.ml-sm {
  margin-left: var(--wco-spacing-sm); }

.ml-md {
  margin-left: var(--wco-spacing-md); }

.ml-lg {
  margin-left: var(--wco-spacing-lg); }

.ml-xl {
  margin-left: var(--wco-spacing-xl); }

.ml-xxl {
  margin-left: var(--wco-spacing-xxl); }

.ml-xxxl {
  margin-left: var(--wco-spacing-xxxl); }

.ml-huge {
  margin-left: var(--wco-spacing-huge); }

.block {
  display: block; }

.inline-block {
  display: inline-block; }

.inline {
  display: inline; }

.flex {
  display: flex; }

.inline-flex {
  display: inline-flex; }

.table {
  display: table; }

.inline-table {
  display: inline-table; }

.table-caption {
  display: table-caption; }

.table-cell {
  display: table-cell; }

.table-column {
  display: table-column; }

.table-column-group {
  display: table-column-group; }

.table-footer-group {
  display: table-footer-group; }

.table-header-group {
  display: table-header-group; }

.table-row-group {
  display: table-row-group; }

.table-row {
  display: table-row; }

.flow-root {
  display: flow-root; }

.grid {
  display: grid; }

.inline-grid {
  display: inline-grid; }

.contents {
  display: contents; }

.list-item {
  display: list-item; }

.hidden {
  display: none; }

.flex-1 {
  flex: 1 1 0%; }

.flex-auto {
  flex: 1 1 auto; }

.flex-initial {
  flex: 0 1 auto; }

.flex-none {
  flex: none; }

.flex-row {
  flex-direction: row; }

.flex-row-reverse {
  flex-direction: row-reverse; }

.flex-col {
  flex-direction: column; }

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

.flex-wrap {
  flex-wrap: wrap; }

.flex-wrap-reverse {
  flex-wrap: wrap-reverse; }

.flex-nowrap {
  flex-wrap: nowrap; }

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

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

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

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

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

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

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

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

.justify-between {
  justify-content: space-between; }

.justify-around {
  justify-content: space-around; }

.justify-evenly {
  justify-content: space-evenly; }

.gap-none {
  gap: var(--wco-spacing-none); }

.gap-quark {
  gap: var(--wco-spacing-quark); }

.gap-nano {
  gap: var(--wco-spacing-nano); }

.gap-xxxs {
  gap: var(--wco-spacing-xxxs); }

.gap-xxs {
  gap: var(--wco-spacing-xxs); }

.gap-xs {
  gap: var(--wco-spacing-xs); }

.gap-sm {
  gap: var(--wco-spacing-sm); }

.gap-md {
  gap: var(--wco-spacing-md); }

.gap-lg {
  gap: var(--wco-spacing-lg); }

.gap-xl {
  gap: var(--wco-spacing-xl); }

.gap-xxl {
  gap: var(--wco-spacing-xxl); }

.gap-xxxl {
  gap: var(--wco-spacing-xxxl); }

.gap-huge {
  gap: var(--wco-spacing-huge); }

.gap-x-none {
  -moz-column-gap: var(--wco-spacing-none);
  column-gap: var(--wco-spacing-none); }

.gap-x-quark {
  -moz-column-gap: var(--wco-spacing-quark);
  column-gap: var(--wco-spacing-quark); }

.gap-x-nano {
  -moz-column-gap: var(--wco-spacing-nano);
  column-gap: var(--wco-spacing-nano); }

.gap-x-xxxs {
  -moz-column-gap: var(--wco-spacing-xxxs);
  column-gap: var(--wco-spacing-xxxs); }

.gap-x-xxs {
  -moz-column-gap: var(--wco-spacing-xxs);
  column-gap: var(--wco-spacing-xxs); }

.gap-x-xs {
  -moz-column-gap: var(--wco-spacing-xs);
  column-gap: var(--wco-spacing-xs); }

.gap-x-sm {
  -moz-column-gap: var(--wco-spacing-sm);
  column-gap: var(--wco-spacing-sm); }

.gap-x-md {
  -moz-column-gap: var(--wco-spacing-md);
  column-gap: var(--wco-spacing-md); }

.gap-x-lg {
  -moz-column-gap: var(--wco-spacing-lg);
  column-gap: var(--wco-spacing-lg); }

.gap-x-xl {
  -moz-column-gap: var(--wco-spacing-xl);
  column-gap: var(--wco-spacing-xl); }

.gap-x-xxl {
  -moz-column-gap: var(--wco-spacing-xxl);
  column-gap: var(--wco-spacing-xxl); }

.gap-x-xxxl {
  -moz-column-gap: var(--wco-spacing-xxxl);
  column-gap: var(--wco-spacing-xxxl); }

.gap-x-huge {
  -moz-column-gap: var(--wco-spacing-huge);
  column-gap: var(--wco-spacing-huge); }

.gap-y-none {
  row-gap: var(--wco-spacing-none); }

.gap-y-quark {
  row-gap: var(--wco-spacing-quark); }

.gap-y-nano {
  row-gap: var(--wco-spacing-nano); }

.gap-y-xxxs {
  row-gap: var(--wco-spacing-xxxs); }

.gap-y-xxs {
  row-gap: var(--wco-spacing-xxs); }

.gap-y-xs {
  row-gap: var(--wco-spacing-xs); }

.gap-y-sm {
  row-gap: var(--wco-spacing-sm); }

.gap-y-md {
  row-gap: var(--wco-spacing-md); }

.gap-y-lg {
  row-gap: var(--wco-spacing-lg); }

.gap-y-xl {
  row-gap: var(--wco-spacing-xl); }

.gap-y-xxl {
  row-gap: var(--wco-spacing-xxl); }

.gap-y-xxxl {
  row-gap: var(--wco-spacing-xxxl); }

.gap-y-huge {
  row-gap: var(--wco-spacing-huge); }

.bg-primary-50 {
  background-color: var(--wco-color-primary-50); }

.bg-primary-100 {
  background-color: var(--wco-color-primary-100); }

.bg-primary-300 {
  background-color: var(--wco-color-primary-300); }

.bg-primary-500 {
  background-color: var(--wco-color-primary-500); }

.bg-primary-600 {
  background-color: var(--wco-color-primary-600); }

.bg-primary-700 {
  background-color: var(--wco-color-primary-700); }

.bg-primary-900 {
  background-color: var(--wco-color-primary-900); }

.bg-primary-text {
  background-color: var(--wco-color-primary-text); }

.bg-secondary-50 {
  background-color: var(--wco-color-secondary-50); }

.bg-secondary-100 {
  background-color: var(--wco-color-secondary-100); }

.bg-secondary-300 {
  background-color: var(--wco-color-secondary-300); }

.bg-secondary-500 {
  background-color: var(--wco-color-secondary-500); }

.bg-secondary-600 {
  background-color: var(--wco-color-secondary-600); }

.bg-secondary-700 {
  background-color: var(--wco-color-secondary-700); }

.bg-secondary-900 {
  background-color: var(--wco-color-secondary-900); }

.bg-secondary-text {
  background-color: var(--wco-color-secondary-text); }

.bg-neutral-50 {
  background-color: var(--wco-color-neutral-50); }

.bg-neutral-100 {
  background-color: var(--wco-color-neutral-100); }

.bg-neutral-300 {
  background-color: var(--wco-color-neutral-300); }

.bg-neutral-500 {
  background-color: var(--wco-color-neutral-500); }

.bg-neutral-600 {
  background-color: var(--wco-color-neutral-600); }

.bg-neutral-700 {
  background-color: var(--wco-color-neutral-700); }

.bg-neutral-900 {
  background-color: var(--wco-color-neutral-900); }

.bg-success-50 {
  background-color: var(--wco-color-success-50); }

.bg-success-100 {
  background-color: var(--wco-color-success-100); }

.bg-success-300 {
  background-color: var(--wco-color-success-300); }

.bg-success-500 {
  background-color: var(--wco-color-success-500); }

.bg-success-600 {
  background-color: var(--wco-color-success-600); }

.bg-success-700 {
  background-color: var(--wco-color-success-700); }

.bg-success-900 {
  background-color: var(--wco-color-success-900); }

.bg-warning-50 {
  background-color: var(--wco-color-warning-50); }

.bg-warning-100 {
  background-color: var(--wco-color-warning-100); }

.bg-warning-300 {
  background-color: var(--wco-color-warning-300); }

.bg-warning-500 {
  background-color: var(--wco-color-warning-500); }

.bg-warning-600 {
  background-color: var(--wco-color-warning-600); }

.bg-warning-700 {
  background-color: var(--wco-color-warning-700); }

.bg-warning-900 {
  background-color: var(--wco-color-warning-900); }

.bg-error-50 {
  background-color: var(--wco-color-danger-50); }

.bg-error-100 {
  background-color: var(--wco-color-danger-100); }

.bg-error-300 {
  background-color: var(--wco-color-danger-300); }

.bg-error-500 {
  background-color: var(--wco-color-danger-500); }

.bg-error-600 {
  background-color: var(--wco-color-danger-600); }

.bg-error-700 {
  background-color: var(--wco-color-danger-700); }

.bg-error-900 {
  background-color: var(--wco-color-danger-900); }

.bg-info-50 {
  background-color: var(--wco-color-info-50); }

.bg-info-100 {
  background-color: var(--wco-color-info-100); }

.bg-info-300 {
  background-color: var(--wco-color-info-300); }

.bg-info-500 {
  background-color: var(--wco-color-info-500); }

.bg-info-600 {
  background-color: var(--wco-color-info-600); }

.bg-info-700 {
  background-color: var(--wco-color-info-700); }

.bg-info-900 {
  background-color: var(--wco-color-info-900); }

.p-none {
  padding: var(--wco-spacing-none); }

.p-quark {
  padding: var(--wco-spacing-quark); }

.p-nano {
  padding: var(--wco-spacing-nano); }

.p-xxxs {
  padding: var(--wco-spacing-xxxs); }

.p-xxs {
  padding: var(--wco-spacing-xxs); }

.p-xs {
  padding: var(--wco-spacing-xs); }

.p-sm {
  padding: var(--wco-spacing-sm); }

.p-md {
  padding: var(--wco-spacing-md); }

.p-lg {
  padding: var(--wco-spacing-lg); }

.p-xl {
  padding: var(--wco-spacing-xl); }

.p-xxl {
  padding: var(--wco-spacing-xxl); }

.p-xxxl {
  padding: var(--wco-spacing-xxxl); }

.p-huge {
  padding: var(--wco-spacing-huge); }

.px-none {
  padding-left: var(--wco-spacing-none);
  padding-right: var(--wco-spacing-none); }

.px-quark {
  padding-left: var(--wco-spacing-quark);
  padding-right: var(--wco-spacing-quark); }

.px-nano {
  padding-left: var(--wco-spacing-nano);
  padding-right: var(--wco-spacing-nano); }

.px-xxxs {
  padding-left: var(--wco-spacing-xxxs);
  padding-right: var(--wco-spacing-xxxs); }

.px-xxs {
  padding-left: var(--wco-spacing-xxs);
  padding-right: var(--wco-spacing-xxs); }

.px-xs {
  padding-left: var(--wco-spacing-xs);
  padding-right: var(--wco-spacing-xs); }

.px-sm {
  padding-left: var(--wco-spacing-sm);
  padding-right: var(--wco-spacing-sm); }

.px-md {
  padding-left: var(--wco-spacing-md);
  padding-right: var(--wco-spacing-md); }

.px-lg {
  padding-left: var(--wco-spacing-lg);
  padding-right: var(--wco-spacing-lg); }

.px-xl {
  padding-left: var(--wco-spacing-xl);
  padding-right: var(--wco-spacing-xl); }

.px-xxl {
  padding-left: var(--wco-spacing-xxl);
  padding-right: var(--wco-spacing-xxl); }

.px-xxxl {
  padding-left: var(--wco-spacing-xxxl);
  padding-right: var(--wco-spacing-xxxl); }

.px-huge {
  padding-left: var(--wco-spacing-huge);
  padding-right: var(--wco-spacing-huge); }

.py-none {
  padding-top: var(--wco-spacing-none);
  padding-bottom: var(--wco-spacing-none); }

.py-quark {
  padding-top: var(--wco-spacing-quark);
  padding-bottom: var(--wco-spacing-quark); }

.py-nano {
  padding-top: var(--wco-spacing-nano);
  padding-bottom: var(--wco-spacing-nano); }

.py-xxxs {
  padding-top: var(--wco-spacing-xxxs);
  padding-bottom: var(--wco-spacing-xxxs); }

.py-xxs {
  padding-top: var(--wco-spacing-xxs);
  padding-bottom: var(--wco-spacing-xxs); }

.py-xs {
  padding-top: var(--wco-spacing-xs);
  padding-bottom: var(--wco-spacing-xs); }

.py-sm {
  padding-top: var(--wco-spacing-sm);
  padding-bottom: var(--wco-spacing-sm); }

.py-md {
  padding-top: var(--wco-spacing-md);
  padding-bottom: var(--wco-spacing-md); }

.py-lg {
  padding-top: var(--wco-spacing-lg);
  padding-bottom: var(--wco-spacing-lg); }

.py-xl {
  padding-top: var(--wco-spacing-xl);
  padding-bottom: var(--wco-spacing-xl); }

.py-xxl {
  padding-top: var(--wco-spacing-xxl);
  padding-bottom: var(--wco-spacing-xxl); }

.py-xxxl {
  padding-top: var(--wco-spacing-xxxl);
  padding-bottom: var(--wco-spacing-xxxl); }

.py-huge {
  padding-top: var(--wco-spacing-huge);
  padding-bottom: var(--wco-spacing-huge); }

.pt-none {
  padding-top: var(--wco-spacing-none); }

.pt-quark {
  padding-top: var(--wco-spacing-quark); }

.pt-nano {
  padding-top: var(--wco-spacing-nano); }

.pt-xxxs {
  padding-top: var(--wco-spacing-xxxs); }

.pt-xxs {
  padding-top: var(--wco-spacing-xxs); }

.pt-xs {
  padding-top: var(--wco-spacing-xs); }

.pt-sm {
  padding-top: var(--wco-spacing-sm); }

.pt-md {
  padding-top: var(--wco-spacing-md); }

.pt-lg {
  padding-top: var(--wco-spacing-lg); }

.pt-xl {
  padding-top: var(--wco-spacing-xl); }

.pt-xxl {
  padding-top: var(--wco-spacing-xxl); }

.pt-xxxl {
  padding-top: var(--wco-spacing-xxxl); }

.pt-huge {
  padding-top: var(--wco-spacing-huge); }

.pr-none {
  padding-right: var(--wco-spacing-none); }

.pr-quark {
  padding-right: var(--wco-spacing-quark); }

.pr-nano {
  padding-right: var(--wco-spacing-nano); }

.pr-xxxs {
  padding-right: var(--wco-spacing-xxxs); }

.pr-xxs {
  padding-right: var(--wco-spacing-xxs); }

.pr-xs {
  padding-right: var(--wco-spacing-xs); }

.pr-sm {
  padding-right: var(--wco-spacing-sm); }

.pr-md {
  padding-right: var(--wco-spacing-md); }

.pr-lg {
  padding-right: var(--wco-spacing-lg); }

.pr-xl {
  padding-right: var(--wco-spacing-xl); }

.pr-xxl {
  padding-right: var(--wco-spacing-xxl); }

.pr-xxxl {
  padding-right: var(--wco-spacing-xxxl); }

.pr-huge {
  padding-right: var(--wco-spacing-huge); }

.pb-none {
  padding-bottom: var(--wco-spacing-none); }

.pb-quark {
  padding-bottom: var(--wco-spacing-quark); }

.pb-nano {
  padding-bottom: var(--wco-spacing-nano); }

.pb-xxxs {
  padding-bottom: var(--wco-spacing-xxxs); }

.pb-xxs {
  padding-bottom: var(--wco-spacing-xxs); }

.pb-xs {
  padding-bottom: var(--wco-spacing-xs); }

.pb-sm {
  padding-bottom: var(--wco-spacing-sm); }

.pb-md {
  padding-bottom: var(--wco-spacing-md); }

.pb-lg {
  padding-bottom: var(--wco-spacing-lg); }

.pb-xl {
  padding-bottom: var(--wco-spacing-xl); }

.pb-xxl {
  padding-bottom: var(--wco-spacing-xxl); }

.pb-xxxl {
  padding-bottom: var(--wco-spacing-xxxl); }

.pb-huge {
  padding-bottom: var(--wco-spacing-huge); }

.pl-none {
  padding-left: var(--wco-spacing-none); }

.pl-quark {
  padding-left: var(--wco-spacing-quark); }

.pl-nano {
  padding-left: var(--wco-spacing-nano); }

.pl-xxxs {
  padding-left: var(--wco-spacing-xxxs); }

.pl-xxs {
  padding-left: var(--wco-spacing-xxs); }

.pl-xs {
  padding-left: var(--wco-spacing-xs); }

.pl-sm {
  padding-left: var(--wco-spacing-sm); }

.pl-md {
  padding-left: var(--wco-spacing-md); }

.pl-lg {
  padding-left: var(--wco-spacing-lg); }

.pl-xl {
  padding-left: var(--wco-spacing-xl); }

.pl-xxl {
  padding-left: var(--wco-spacing-xxl); }

.pl-xxxl {
  padding-left: var(--wco-spacing-xxxl); }

.pl-huge {
  padding-left: var(--wco-spacing-huge); }

.text-left {
  text-align: left; }

.text-center {
  text-align: center; }

.text-right {
  text-align: right; }

.text-justify {
  text-align: justify; }

.text-primary-50 {
  color: var(--wco-color-primary-50); }

.text-primary-100 {
  color: var(--wco-color-primary-100); }

.text-primary-300 {
  color: var(--wco-color-primary-300); }

.text-primary-500 {
  color: var(--wco-color-primary-500); }

.text-primary-600 {
  color: var(--wco-color-primary-600); }

.text-primary-700 {
  color: var(--wco-color-primary-700); }

.text-primary-900 {
  color: var(--wco-color-primary-900); }

.text-primary-text {
  color: var(--wco-color-primary-text); }

.text-secondary-50 {
  color: var(--wco-color-secondary-50); }

.text-secondary-100 {
  color: var(--wco-color-secondary-100); }

.text-secondary-300 {
  color: var(--wco-color-secondary-300); }

.text-secondary-500 {
  color: var(--wco-color-secondary-500); }

.text-secondary-600 {
  color: var(--wco-color-secondary-600); }

.text-secondary-700 {
  color: var(--wco-color-secondary-700); }

.text-secondary-900 {
  color: var(--wco-color-secondary-900); }

.text-secondary-text {
  color: var(--wco-color-secondary-text); }

.text-neutral-50 {
  color: var(--wco-color-neutral-50); }

.text-neutral-100 {
  color: var(--wco-color-neutral-100); }

.text-neutral-300 {
  color: var(--wco-color-neutral-300); }

.text-neutral-500 {
  color: var(--wco-color-neutral-500); }

.text-neutral-600 {
  color: var(--wco-color-neutral-600); }

.text-neutral-700 {
  color: var(--wco-color-neutral-700); }

.text-neutral-900 {
  color: var(--wco-color-neutral-900); }

.text-success-50 {
  color: var(--wco-color-success-50); }

.text-success-100 {
  color: var(--wco-color-success-100); }

.text-success-300 {
  color: var(--wco-color-success-300); }

.text-success-500 {
  color: var(--wco-color-success-500); }

.text-success-600 {
  color: var(--wco-color-success-600); }

.text-success-700 {
  color: var(--wco-color-success-700); }

.text-success-900 {
  color: var(--wco-color-success-900); }

.text-warning-50 {
  color: var(--wco-color-warning-50); }

.text-warning-100 {
  color: var(--wco-color-warning-100); }

.text-warning-300 {
  color: var(--wco-color-warning-300); }

.text-warning-500 {
  color: var(--wco-color-warning-500); }

.text-warning-600 {
  color: var(--wco-color-warning-600); }

.text-warning-700 {
  color: var(--wco-color-warning-700); }

.text-warning-900 {
  color: var(--wco-color-warning-900); }

.text-error-50 {
  color: var(--wco-color-danger-50); }

.text-error-100 {
  color: var(--wco-color-danger-100); }

.text-error-300 {
  color: var(--wco-color-danger-300); }

.text-error-500 {
  color: var(--wco-color-danger-500); }

.text-error-600 {
  color: var(--wco-color-danger-600); }

.text-error-700 {
  color: var(--wco-color-danger-700); }

.text-error-900 {
  color: var(--wco-color-danger-900); }

.text-info-50 {
  color: var(--wco-color-info-50); }

.text-info-100 {
  color: var(--wco-color-info-100); }

.text-info-300 {
  color: var(--wco-color-info-300); }

.text-info-500 {
  color: var(--wco-color-info-500); }

.text-info-600 {
  color: var(--wco-color-info-600); }

.text-info-700 {
  color: var(--wco-color-info-700); }

.text-info-900 {
  color: var(--wco-color-info-900); }

@media (min-width: 640px) {
  .md\:m-none {
    margin: var(--wco-spacing-none); }
  .md\:m-quark {
    margin: var(--wco-spacing-quark); }
  .md\:m-nano {
    margin: var(--wco-spacing-nano); }
  .md\:m-xxxs {
    margin: var(--wco-spacing-xxxs); }
  .md\:m-xxs {
    margin: var(--wco-spacing-xxs); }
  .md\:m-xs {
    margin: var(--wco-spacing-xs); }
  .md\:m-sm {
    margin: var(--wco-spacing-sm); }
  .md\:m-md {
    margin: var(--wco-spacing-md); }
  .md\:m-lg {
    margin: var(--wco-spacing-lg); }
  .md\:m-xl {
    margin: var(--wco-spacing-xl); }
  .md\:m-xxl {
    margin: var(--wco-spacing-xxl); }
  .md\:m-xxxl {
    margin: var(--wco-spacing-xxxl); }
  .md\:m-huge {
    margin: var(--wco-spacing-huge); }
  .md\:mx-none {
    margin-left: var(--wco-spacing-none);
    margin-right: var(--wco-spacing-none); }
  .md\:mx-quark {
    margin-left: var(--wco-spacing-quark);
    margin-right: var(--wco-spacing-quark); }
  .md\:mx-nano {
    margin-left: var(--wco-spacing-nano);
    margin-right: var(--wco-spacing-nano); }
  .md\:mx-xxxs {
    margin-left: var(--wco-spacing-xxxs);
    margin-right: var(--wco-spacing-xxxs); }
  .md\:mx-xxs {
    margin-left: var(--wco-spacing-xxs);
    margin-right: var(--wco-spacing-xxs); }
  .md\:mx-xs {
    margin-left: var(--wco-spacing-xs);
    margin-right: var(--wco-spacing-xs); }
  .md\:mx-sm {
    margin-left: var(--wco-spacing-sm);
    margin-right: var(--wco-spacing-sm); }
  .md\:mx-md {
    margin-left: var(--wco-spacing-md);
    margin-right: var(--wco-spacing-md); }
  .md\:mx-lg {
    margin-left: var(--wco-spacing-lg);
    margin-right: var(--wco-spacing-lg); }
  .md\:mx-xl {
    margin-left: var(--wco-spacing-xl);
    margin-right: var(--wco-spacing-xl); }
  .md\:mx-xxl {
    margin-left: var(--wco-spacing-xxl);
    margin-right: var(--wco-spacing-xxl); }
  .md\:mx-xxxl {
    margin-left: var(--wco-spacing-xxxl);
    margin-right: var(--wco-spacing-xxxl); }
  .md\:mx-huge {
    margin-left: var(--wco-spacing-huge);
    margin-right: var(--wco-spacing-huge); }
  .md\:my-none {
    margin-top: var(--wco-spacing-none);
    margin-bottom: var(--wco-spacing-none); }
  .md\:my-quark {
    margin-top: var(--wco-spacing-quark);
    margin-bottom: var(--wco-spacing-quark); }
  .md\:my-nano {
    margin-top: var(--wco-spacing-nano);
    margin-bottom: var(--wco-spacing-nano); }
  .md\:my-xxxs {
    margin-top: var(--wco-spacing-xxxs);
    margin-bottom: var(--wco-spacing-xxxs); }
  .md\:my-xxs {
    margin-top: var(--wco-spacing-xxs);
    margin-bottom: var(--wco-spacing-xxs); }
  .md\:my-xs {
    margin-top: var(--wco-spacing-xs);
    margin-bottom: var(--wco-spacing-xs); }
  .md\:my-sm {
    margin-top: var(--wco-spacing-sm);
    margin-bottom: var(--wco-spacing-sm); }
  .md\:my-md {
    margin-top: var(--wco-spacing-md);
    margin-bottom: var(--wco-spacing-md); }
  .md\:my-lg {
    margin-top: var(--wco-spacing-lg);
    margin-bottom: var(--wco-spacing-lg); }
  .md\:my-xl {
    margin-top: var(--wco-spacing-xl);
    margin-bottom: var(--wco-spacing-xl); }
  .md\:my-xxl {
    margin-top: var(--wco-spacing-xxl);
    margin-bottom: var(--wco-spacing-xxl); }
  .md\:my-xxxl {
    margin-top: var(--wco-spacing-xxxl);
    margin-bottom: var(--wco-spacing-xxxl); }
  .md\:my-huge {
    margin-top: var(--wco-spacing-huge);
    margin-bottom: var(--wco-spacing-huge); }
  .md\:mt-none {
    margin-top: var(--wco-spacing-none); }
  .md\:mt-quark {
    margin-top: var(--wco-spacing-quark); }
  .md\:mt-nano {
    margin-top: var(--wco-spacing-nano); }
  .md\:mt-xxxs {
    margin-top: var(--wco-spacing-xxxs); }
  .md\:mt-xxs {
    margin-top: var(--wco-spacing-xxs); }
  .md\:mt-xs {
    margin-top: var(--wco-spacing-xs); }
  .md\:mt-sm {
    margin-top: var(--wco-spacing-sm); }
  .md\:mt-md {
    margin-top: var(--wco-spacing-md); }
  .md\:mt-lg {
    margin-top: var(--wco-spacing-lg); }
  .md\:mt-xl {
    margin-top: var(--wco-spacing-xl); }
  .md\:mt-xxl {
    margin-top: var(--wco-spacing-xxl); }
  .md\:mt-xxxl {
    margin-top: var(--wco-spacing-xxxl); }
  .md\:mt-huge {
    margin-top: var(--wco-spacing-huge); }
  .md\:mr-none {
    margin-right: var(--wco-spacing-none); }
  .md\:mr-quark {
    margin-right: var(--wco-spacing-quark); }
  .md\:mr-nano {
    margin-right: var(--wco-spacing-nano); }
  .md\:mr-xxxs {
    margin-right: var(--wco-spacing-xxxs); }
  .md\:mr-xxs {
    margin-right: var(--wco-spacing-xxs); }
  .md\:mr-xs {
    margin-right: var(--wco-spacing-xs); }
  .md\:mr-sm {
    margin-right: var(--wco-spacing-sm); }
  .md\:mr-md {
    margin-right: var(--wco-spacing-md); }
  .md\:mr-lg {
    margin-right: var(--wco-spacing-lg); }
  .md\:mr-xl {
    margin-right: var(--wco-spacing-xl); }
  .md\:mr-xxl {
    margin-right: var(--wco-spacing-xxl); }
  .md\:mr-xxxl {
    margin-right: var(--wco-spacing-xxxl); }
  .md\:mr-huge {
    margin-right: var(--wco-spacing-huge); }
  .md\:mb-none {
    margin-bottom: var(--wco-spacing-none); }
  .md\:mb-quark {
    margin-bottom: var(--wco-spacing-quark); }
  .md\:mb-nano {
    margin-bottom: var(--wco-spacing-nano); }
  .md\:mb-xxxs {
    margin-bottom: var(--wco-spacing-xxxs); }
  .md\:mb-xxs {
    margin-bottom: var(--wco-spacing-xxs); }
  .md\:mb-xs {
    margin-bottom: var(--wco-spacing-xs); }
  .md\:mb-sm {
    margin-bottom: var(--wco-spacing-sm); }
  .md\:mb-md {
    margin-bottom: var(--wco-spacing-md); }
  .md\:mb-lg {
    margin-bottom: var(--wco-spacing-lg); }
  .md\:mb-xl {
    margin-bottom: var(--wco-spacing-xl); }
  .md\:mb-xxl {
    margin-bottom: var(--wco-spacing-xxl); }
  .md\:mb-xxxl {
    margin-bottom: var(--wco-spacing-xxxl); }
  .md\:mb-huge {
    margin-bottom: var(--wco-spacing-huge); }
  .md\:ml-none {
    margin-left: var(--wco-spacing-none); }
  .md\:ml-quark {
    margin-left: var(--wco-spacing-quark); }
  .md\:ml-nano {
    margin-left: var(--wco-spacing-nano); }
  .md\:ml-xxxs {
    margin-left: var(--wco-spacing-xxxs); }
  .md\:ml-xxs {
    margin-left: var(--wco-spacing-xxs); }
  .md\:ml-xs {
    margin-left: var(--wco-spacing-xs); }
  .md\:ml-sm {
    margin-left: var(--wco-spacing-sm); }
  .md\:ml-md {
    margin-left: var(--wco-spacing-md); }
  .md\:ml-lg {
    margin-left: var(--wco-spacing-lg); }
  .md\:ml-xl {
    margin-left: var(--wco-spacing-xl); }
  .md\:ml-xxl {
    margin-left: var(--wco-spacing-xxl); }
  .md\:ml-xxxl {
    margin-left: var(--wco-spacing-xxxl); }
  .md\:ml-huge {
    margin-left: var(--wco-spacing-huge); }
  .md\:block {
    display: block; }
  .md\:inline-block {
    display: inline-block; }
  .md\:inline {
    display: inline; }
  .md\:flex {
    display: flex; }
  .md\:inline-flex {
    display: inline-flex; }
  .md\:table {
    display: table; }
  .md\:inline-table {
    display: inline-table; }
  .md\:table-caption {
    display: table-caption; }
  .md\:table-cell {
    display: table-cell; }
  .md\:table-column {
    display: table-column; }
  .md\:table-column-group {
    display: table-column-group; }
  .md\:table-footer-group {
    display: table-footer-group; }
  .md\:table-header-group {
    display: table-header-group; }
  .md\:table-row-group {
    display: table-row-group; }
  .md\:table-row {
    display: table-row; }
  .md\:flow-root {
    display: flow-root; }
  .md\:grid {
    display: grid; }
  .md\:inline-grid {
    display: inline-grid; }
  .md\:contents {
    display: contents; }
  .md\:list-item {
    display: list-item; }
  .md\:hidden {
    display: none; }
  .md\:flex-1 {
    flex: 1 1 0%; }
  .md\:flex-auto {
    flex: 1 1 auto; }
  .md\:flex-initial {
    flex: 0 1 auto; }
  .md\:flex-none {
    flex: none; }
  .md\:flex-row {
    flex-direction: row; }
  .md\:flex-row-reverse {
    flex-direction: row-reverse; }
  .md\:flex-col {
    flex-direction: column; }
  .md\:flex-col-reverse {
    flex-direction: column-reverse; }
  .md\:flex-wrap {
    flex-wrap: wrap; }
  .md\:flex-wrap-reverse {
    flex-wrap: wrap-reverse; }
  .md\:flex-nowrap {
    flex-wrap: nowrap; }
  .md\:items-start {
    align-items: flex-start; }
  .md\:items-end {
    align-items: flex-end; }
  .md\:items-center {
    align-items: center; }
  .md\:items-baseline {
    align-items: baseline; }
  .md\:items-stretch {
    align-items: stretch; }
  .md\:justify-start {
    justify-content: flex-start; }
  .md\:justify-end {
    justify-content: flex-end; }
  .md\:justify-center {
    justify-content: center; }
  .md\:justify-between {
    justify-content: space-between; }
  .md\:justify-around {
    justify-content: space-around; }
  .md\:justify-evenly {
    justify-content: space-evenly; }
  .md\:gap-none {
    gap: var(--wco-spacing-none); }
  .md\:gap-quark {
    gap: var(--wco-spacing-quark); }
  .md\:gap-nano {
    gap: var(--wco-spacing-nano); }
  .md\:gap-xxxs {
    gap: var(--wco-spacing-xxxs); }
  .md\:gap-xxs {
    gap: var(--wco-spacing-xxs); }
  .md\:gap-xs {
    gap: var(--wco-spacing-xs); }
  .md\:gap-sm {
    gap: var(--wco-spacing-sm); }
  .md\:gap-md {
    gap: var(--wco-spacing-md); }
  .md\:gap-lg {
    gap: var(--wco-spacing-lg); }
  .md\:gap-xl {
    gap: var(--wco-spacing-xl); }
  .md\:gap-xxl {
    gap: var(--wco-spacing-xxl); }
  .md\:gap-xxxl {
    gap: var(--wco-spacing-xxxl); }
  .md\:gap-huge {
    gap: var(--wco-spacing-huge); }
  .md\:gap-x-none {
    -moz-column-gap: var(--wco-spacing-none);
    column-gap: var(--wco-spacing-none); }
  .md\:gap-x-quark {
    -moz-column-gap: var(--wco-spacing-quark);
    column-gap: var(--wco-spacing-quark); }
  .md\:gap-x-nano {
    -moz-column-gap: var(--wco-spacing-nano);
    column-gap: var(--wco-spacing-nano); }
  .md\:gap-x-xxxs {
    -moz-column-gap: var(--wco-spacing-xxxs);
    column-gap: var(--wco-spacing-xxxs); }
  .md\:gap-x-xxs {
    -moz-column-gap: var(--wco-spacing-xxs);
    column-gap: var(--wco-spacing-xxs); }
  .md\:gap-x-xs {
    -moz-column-gap: var(--wco-spacing-xs);
    column-gap: var(--wco-spacing-xs); }
  .md\:gap-x-sm {
    -moz-column-gap: var(--wco-spacing-sm);
    column-gap: var(--wco-spacing-sm); }
  .md\:gap-x-md {
    -moz-column-gap: var(--wco-spacing-md);
    column-gap: var(--wco-spacing-md); }
  .md\:gap-x-lg {
    -moz-column-gap: var(--wco-spacing-lg);
    column-gap: var(--wco-spacing-lg); }
  .md\:gap-x-xl {
    -moz-column-gap: var(--wco-spacing-xl);
    column-gap: var(--wco-spacing-xl); }
  .md\:gap-x-xxl {
    -moz-column-gap: var(--wco-spacing-xxl);
    column-gap: var(--wco-spacing-xxl); }
  .md\:gap-x-xxxl {
    -moz-column-gap: var(--wco-spacing-xxxl);
    column-gap: var(--wco-spacing-xxxl); }
  .md\:gap-x-huge {
    -moz-column-gap: var(--wco-spacing-huge);
    column-gap: var(--wco-spacing-huge); }
  .md\:gap-y-none {
    row-gap: var(--wco-spacing-none); }
  .md\:gap-y-quark {
    row-gap: var(--wco-spacing-quark); }
  .md\:gap-y-nano {
    row-gap: var(--wco-spacing-nano); }
  .md\:gap-y-xxxs {
    row-gap: var(--wco-spacing-xxxs); }
  .md\:gap-y-xxs {
    row-gap: var(--wco-spacing-xxs); }
  .md\:gap-y-xs {
    row-gap: var(--wco-spacing-xs); }
  .md\:gap-y-sm {
    row-gap: var(--wco-spacing-sm); }
  .md\:gap-y-md {
    row-gap: var(--wco-spacing-md); }
  .md\:gap-y-lg {
    row-gap: var(--wco-spacing-lg); }
  .md\:gap-y-xl {
    row-gap: var(--wco-spacing-xl); }
  .md\:gap-y-xxl {
    row-gap: var(--wco-spacing-xxl); }
  .md\:gap-y-xxxl {
    row-gap: var(--wco-spacing-xxxl); }
  .md\:gap-y-huge {
    row-gap: var(--wco-spacing-huge); }
  .md\:p-none {
    padding: var(--wco-spacing-none); }
  .md\:p-quark {
    padding: var(--wco-spacing-quark); }
  .md\:p-nano {
    padding: var(--wco-spacing-nano); }
  .md\:p-xxxs {
    padding: var(--wco-spacing-xxxs); }
  .md\:p-xxs {
    padding: var(--wco-spacing-xxs); }
  .md\:p-xs {
    padding: var(--wco-spacing-xs); }
  .md\:p-sm {
    padding: var(--wco-spacing-sm); }
  .md\:p-md {
    padding: var(--wco-spacing-md); }
  .md\:p-lg {
    padding: var(--wco-spacing-lg); }
  .md\:p-xl {
    padding: var(--wco-spacing-xl); }
  .md\:p-xxl {
    padding: var(--wco-spacing-xxl); }
  .md\:p-xxxl {
    padding: var(--wco-spacing-xxxl); }
  .md\:p-huge {
    padding: var(--wco-spacing-huge); }
  .md\:px-none {
    padding-left: var(--wco-spacing-none);
    padding-right: var(--wco-spacing-none); }
  .md\:px-quark {
    padding-left: var(--wco-spacing-quark);
    padding-right: var(--wco-spacing-quark); }
  .md\:px-nano {
    padding-left: var(--wco-spacing-nano);
    padding-right: var(--wco-spacing-nano); }
  .md\:px-xxxs {
    padding-left: var(--wco-spacing-xxxs);
    padding-right: var(--wco-spacing-xxxs); }
  .md\:px-xxs {
    padding-left: var(--wco-spacing-xxs);
    padding-right: var(--wco-spacing-xxs); }
  .md\:px-xs {
    padding-left: var(--wco-spacing-xs);
    padding-right: var(--wco-spacing-xs); }
  .md\:px-sm {
    padding-left: var(--wco-spacing-sm);
    padding-right: var(--wco-spacing-sm); }
  .md\:px-md {
    padding-left: var(--wco-spacing-md);
    padding-right: var(--wco-spacing-md); }
  .md\:px-lg {
    padding-left: var(--wco-spacing-lg);
    padding-right: var(--wco-spacing-lg); }
  .md\:px-xl {
    padding-left: var(--wco-spacing-xl);
    padding-right: var(--wco-spacing-xl); }
  .md\:px-xxl {
    padding-left: var(--wco-spacing-xxl);
    padding-right: var(--wco-spacing-xxl); }
  .md\:px-xxxl {
    padding-left: var(--wco-spacing-xxxl);
    padding-right: var(--wco-spacing-xxxl); }
  .md\:px-huge {
    padding-left: var(--wco-spacing-huge);
    padding-right: var(--wco-spacing-huge); }
  .md\:py-none {
    padding-top: var(--wco-spacing-none);
    padding-bottom: var(--wco-spacing-none); }
  .md\:py-quark {
    padding-top: var(--wco-spacing-quark);
    padding-bottom: var(--wco-spacing-quark); }
  .md\:py-nano {
    padding-top: var(--wco-spacing-nano);
    padding-bottom: var(--wco-spacing-nano); }
  .md\:py-xxxs {
    padding-top: var(--wco-spacing-xxxs);
    padding-bottom: var(--wco-spacing-xxxs); }
  .md\:py-xxs {
    padding-top: var(--wco-spacing-xxs);
    padding-bottom: var(--wco-spacing-xxs); }
  .md\:py-xs {
    padding-top: var(--wco-spacing-xs);
    padding-bottom: var(--wco-spacing-xs); }
  .md\:py-sm {
    padding-top: var(--wco-spacing-sm);
    padding-bottom: var(--wco-spacing-sm); }
  .md\:py-md {
    padding-top: var(--wco-spacing-md);
    padding-bottom: var(--wco-spacing-md); }
  .md\:py-lg {
    padding-top: var(--wco-spacing-lg);
    padding-bottom: var(--wco-spacing-lg); }
  .md\:py-xl {
    padding-top: var(--wco-spacing-xl);
    padding-bottom: var(--wco-spacing-xl); }
  .md\:py-xxl {
    padding-top: var(--wco-spacing-xxl);
    padding-bottom: var(--wco-spacing-xxl); }
  .md\:py-xxxl {
    padding-top: var(--wco-spacing-xxxl);
    padding-bottom: var(--wco-spacing-xxxl); }
  .md\:py-huge {
    padding-top: var(--wco-spacing-huge);
    padding-bottom: var(--wco-spacing-huge); }
  .md\:pt-none {
    padding-top: var(--wco-spacing-none); }
  .md\:pt-quark {
    padding-top: var(--wco-spacing-quark); }
  .md\:pt-nano {
    padding-top: var(--wco-spacing-nano); }
  .md\:pt-xxxs {
    padding-top: var(--wco-spacing-xxxs); }
  .md\:pt-xxs {
    padding-top: var(--wco-spacing-xxs); }
  .md\:pt-xs {
    padding-top: var(--wco-spacing-xs); }
  .md\:pt-sm {
    padding-top: var(--wco-spacing-sm); }
  .md\:pt-md {
    padding-top: var(--wco-spacing-md); }
  .md\:pt-lg {
    padding-top: var(--wco-spacing-lg); }
  .md\:pt-xl {
    padding-top: var(--wco-spacing-xl); }
  .md\:pt-xxl {
    padding-top: var(--wco-spacing-xxl); }
  .md\:pt-xxxl {
    padding-top: var(--wco-spacing-xxxl); }
  .md\:pt-huge {
    padding-top: var(--wco-spacing-huge); }
  .md\:pr-none {
    padding-right: var(--wco-spacing-none); }
  .md\:pr-quark {
    padding-right: var(--wco-spacing-quark); }
  .md\:pr-nano {
    padding-right: var(--wco-spacing-nano); }
  .md\:pr-xxxs {
    padding-right: var(--wco-spacing-xxxs); }
  .md\:pr-xxs {
    padding-right: var(--wco-spacing-xxs); }
  .md\:pr-xs {
    padding-right: var(--wco-spacing-xs); }
  .md\:pr-sm {
    padding-right: var(--wco-spacing-sm); }
  .md\:pr-md {
    padding-right: var(--wco-spacing-md); }
  .md\:pr-lg {
    padding-right: var(--wco-spacing-lg); }
  .md\:pr-xl {
    padding-right: var(--wco-spacing-xl); }
  .md\:pr-xxl {
    padding-right: var(--wco-spacing-xxl); }
  .md\:pr-xxxl {
    padding-right: var(--wco-spacing-xxxl); }
  .md\:pr-huge {
    padding-right: var(--wco-spacing-huge); }
  .md\:pb-none {
    padding-bottom: var(--wco-spacing-none); }
  .md\:pb-quark {
    padding-bottom: var(--wco-spacing-quark); }
  .md\:pb-nano {
    padding-bottom: var(--wco-spacing-nano); }
  .md\:pb-xxxs {
    padding-bottom: var(--wco-spacing-xxxs); }
  .md\:pb-xxs {
    padding-bottom: var(--wco-spacing-xxs); }
  .md\:pb-xs {
    padding-bottom: var(--wco-spacing-xs); }
  .md\:pb-sm {
    padding-bottom: var(--wco-spacing-sm); }
  .md\:pb-md {
    padding-bottom: var(--wco-spacing-md); }
  .md\:pb-lg {
    padding-bottom: var(--wco-spacing-lg); }
  .md\:pb-xl {
    padding-bottom: var(--wco-spacing-xl); }
  .md\:pb-xxl {
    padding-bottom: var(--wco-spacing-xxl); }
  .md\:pb-xxxl {
    padding-bottom: var(--wco-spacing-xxxl); }
  .md\:pb-huge {
    padding-bottom: var(--wco-spacing-huge); }
  .md\:pl-none {
    padding-left: var(--wco-spacing-none); }
  .md\:pl-quark {
    padding-left: var(--wco-spacing-quark); }
  .md\:pl-nano {
    padding-left: var(--wco-spacing-nano); }
  .md\:pl-xxxs {
    padding-left: var(--wco-spacing-xxxs); }
  .md\:pl-xxs {
    padding-left: var(--wco-spacing-xxs); }
  .md\:pl-xs {
    padding-left: var(--wco-spacing-xs); }
  .md\:pl-sm {
    padding-left: var(--wco-spacing-sm); }
  .md\:pl-md {
    padding-left: var(--wco-spacing-md); }
  .md\:pl-lg {
    padding-left: var(--wco-spacing-lg); }
  .md\:pl-xl {
    padding-left: var(--wco-spacing-xl); }
  .md\:pl-xxl {
    padding-left: var(--wco-spacing-xxl); }
  .md\:pl-xxxl {
    padding-left: var(--wco-spacing-xxxl); }
  .md\:pl-huge {
    padding-left: var(--wco-spacing-huge); }
  .md\:text-left {
    text-align: left; }
  .md\:text-center {
    text-align: center; }
  .md\:text-right {
    text-align: right; }
  .md\:text-justify {
    text-align: justify; } }

@media (min-width: 1024px) {
  .lg\:m-none {
    margin: var(--wco-spacing-none); }
  .lg\:m-quark {
    margin: var(--wco-spacing-quark); }
  .lg\:m-nano {
    margin: var(--wco-spacing-nano); }
  .lg\:m-xxxs {
    margin: var(--wco-spacing-xxxs); }
  .lg\:m-xxs {
    margin: var(--wco-spacing-xxs); }
  .lg\:m-xs {
    margin: var(--wco-spacing-xs); }
  .lg\:m-sm {
    margin: var(--wco-spacing-sm); }
  .lg\:m-md {
    margin: var(--wco-spacing-md); }
  .lg\:m-lg {
    margin: var(--wco-spacing-lg); }
  .lg\:m-xl {
    margin: var(--wco-spacing-xl); }
  .lg\:m-xxl {
    margin: var(--wco-spacing-xxl); }
  .lg\:m-xxxl {
    margin: var(--wco-spacing-xxxl); }
  .lg\:m-huge {
    margin: var(--wco-spacing-huge); }
  .lg\:mx-none {
    margin-left: var(--wco-spacing-none);
    margin-right: var(--wco-spacing-none); }
  .lg\:mx-quark {
    margin-left: var(--wco-spacing-quark);
    margin-right: var(--wco-spacing-quark); }
  .lg\:mx-nano {
    margin-left: var(--wco-spacing-nano);
    margin-right: var(--wco-spacing-nano); }
  .lg\:mx-xxxs {
    margin-left: var(--wco-spacing-xxxs);
    margin-right: var(--wco-spacing-xxxs); }
  .lg\:mx-xxs {
    margin-left: var(--wco-spacing-xxs);
    margin-right: var(--wco-spacing-xxs); }
  .lg\:mx-xs {
    margin-left: var(--wco-spacing-xs);
    margin-right: var(--wco-spacing-xs); }
  .lg\:mx-sm {
    margin-left: var(--wco-spacing-sm);
    margin-right: var(--wco-spacing-sm); }
  .lg\:mx-md {
    margin-left: var(--wco-spacing-md);
    margin-right: var(--wco-spacing-md); }
  .lg\:mx-lg {
    margin-left: var(--wco-spacing-lg);
    margin-right: var(--wco-spacing-lg); }
  .lg\:mx-xl {
    margin-left: var(--wco-spacing-xl);
    margin-right: var(--wco-spacing-xl); }
  .lg\:mx-xxl {
    margin-left: var(--wco-spacing-xxl);
    margin-right: var(--wco-spacing-xxl); }
  .lg\:mx-xxxl {
    margin-left: var(--wco-spacing-xxxl);
    margin-right: var(--wco-spacing-xxxl); }
  .lg\:mx-huge {
    margin-left: var(--wco-spacing-huge);
    margin-right: var(--wco-spacing-huge); }
  .lg\:my-none {
    margin-top: var(--wco-spacing-none);
    margin-bottom: var(--wco-spacing-none); }
  .lg\:my-quark {
    margin-top: var(--wco-spacing-quark);
    margin-bottom: var(--wco-spacing-quark); }
  .lg\:my-nano {
    margin-top: var(--wco-spacing-nano);
    margin-bottom: var(--wco-spacing-nano); }
  .lg\:my-xxxs {
    margin-top: var(--wco-spacing-xxxs);
    margin-bottom: var(--wco-spacing-xxxs); }
  .lg\:my-xxs {
    margin-top: var(--wco-spacing-xxs);
    margin-bottom: var(--wco-spacing-xxs); }
  .lg\:my-xs {
    margin-top: var(--wco-spacing-xs);
    margin-bottom: var(--wco-spacing-xs); }
  .lg\:my-sm {
    margin-top: var(--wco-spacing-sm);
    margin-bottom: var(--wco-spacing-sm); }
  .lg\:my-md {
    margin-top: var(--wco-spacing-md);
    margin-bottom: var(--wco-spacing-md); }
  .lg\:my-lg {
    margin-top: var(--wco-spacing-lg);
    margin-bottom: var(--wco-spacing-lg); }
  .lg\:my-xl {
    margin-top: var(--wco-spacing-xl);
    margin-bottom: var(--wco-spacing-xl); }
  .lg\:my-xxl {
    margin-top: var(--wco-spacing-xxl);
    margin-bottom: var(--wco-spacing-xxl); }
  .lg\:my-xxxl {
    margin-top: var(--wco-spacing-xxxl);
    margin-bottom: var(--wco-spacing-xxxl); }
  .lg\:my-huge {
    margin-top: var(--wco-spacing-huge);
    margin-bottom: var(--wco-spacing-huge); }
  .lg\:mt-none {
    margin-top: var(--wco-spacing-none); }
  .lg\:mt-quark {
    margin-top: var(--wco-spacing-quark); }
  .lg\:mt-nano {
    margin-top: var(--wco-spacing-nano); }
  .lg\:mt-xxxs {
    margin-top: var(--wco-spacing-xxxs); }
  .lg\:mt-xxs {
    margin-top: var(--wco-spacing-xxs); }
  .lg\:mt-xs {
    margin-top: var(--wco-spacing-xs); }
  .lg\:mt-sm {
    margin-top: var(--wco-spacing-sm); }
  .lg\:mt-md {
    margin-top: var(--wco-spacing-md); }
  .lg\:mt-lg {
    margin-top: var(--wco-spacing-lg); }
  .lg\:mt-xl {
    margin-top: var(--wco-spacing-xl); }
  .lg\:mt-xxl {
    margin-top: var(--wco-spacing-xxl); }
  .lg\:mt-xxxl {
    margin-top: var(--wco-spacing-xxxl); }
  .lg\:mt-huge {
    margin-top: var(--wco-spacing-huge); }
  .lg\:mr-none {
    margin-right: var(--wco-spacing-none); }
  .lg\:mr-quark {
    margin-right: var(--wco-spacing-quark); }
  .lg\:mr-nano {
    margin-right: var(--wco-spacing-nano); }
  .lg\:mr-xxxs {
    margin-right: var(--wco-spacing-xxxs); }
  .lg\:mr-xxs {
    margin-right: var(--wco-spacing-xxs); }
  .lg\:mr-xs {
    margin-right: var(--wco-spacing-xs); }
  .lg\:mr-sm {
    margin-right: var(--wco-spacing-sm); }
  .lg\:mr-md {
    margin-right: var(--wco-spacing-md); }
  .lg\:mr-lg {
    margin-right: var(--wco-spacing-lg); }
  .lg\:mr-xl {
    margin-right: var(--wco-spacing-xl); }
  .lg\:mr-xxl {
    margin-right: var(--wco-spacing-xxl); }
  .lg\:mr-xxxl {
    margin-right: var(--wco-spacing-xxxl); }
  .lg\:mr-huge {
    margin-right: var(--wco-spacing-huge); }
  .lg\:mb-none {
    margin-bottom: var(--wco-spacing-none); }
  .lg\:mb-quark {
    margin-bottom: var(--wco-spacing-quark); }
  .lg\:mb-nano {
    margin-bottom: var(--wco-spacing-nano); }
  .lg\:mb-xxxs {
    margin-bottom: var(--wco-spacing-xxxs); }
  .lg\:mb-xxs {
    margin-bottom: var(--wco-spacing-xxs); }
  .lg\:mb-xs {
    margin-bottom: var(--wco-spacing-xs); }
  .lg\:mb-sm {
    margin-bottom: var(--wco-spacing-sm); }
  .lg\:mb-md {
    margin-bottom: var(--wco-spacing-md); }
  .lg\:mb-lg {
    margin-bottom: var(--wco-spacing-lg); }
  .lg\:mb-xl {
    margin-bottom: var(--wco-spacing-xl); }
  .lg\:mb-xxl {
    margin-bottom: var(--wco-spacing-xxl); }
  .lg\:mb-xxxl {
    margin-bottom: var(--wco-spacing-xxxl); }
  .lg\:mb-huge {
    margin-bottom: var(--wco-spacing-huge); }
  .lg\:ml-none {
    margin-left: var(--wco-spacing-none); }
  .lg\:ml-quark {
    margin-left: var(--wco-spacing-quark); }
  .lg\:ml-nano {
    margin-left: var(--wco-spacing-nano); }
  .lg\:ml-xxxs {
    margin-left: var(--wco-spacing-xxxs); }
  .lg\:ml-xxs {
    margin-left: var(--wco-spacing-xxs); }
  .lg\:ml-xs {
    margin-left: var(--wco-spacing-xs); }
  .lg\:ml-sm {
    margin-left: var(--wco-spacing-sm); }
  .lg\:ml-md {
    margin-left: var(--wco-spacing-md); }
  .lg\:ml-lg {
    margin-left: var(--wco-spacing-lg); }
  .lg\:ml-xl {
    margin-left: var(--wco-spacing-xl); }
  .lg\:ml-xxl {
    margin-left: var(--wco-spacing-xxl); }
  .lg\:ml-xxxl {
    margin-left: var(--wco-spacing-xxxl); }
  .lg\:ml-huge {
    margin-left: var(--wco-spacing-huge); }
  .lg\:block {
    display: block; }
  .lg\:inline-block {
    display: inline-block; }
  .lg\:inline {
    display: inline; }
  .lg\:flex {
    display: flex; }
  .lg\:inline-flex {
    display: inline-flex; }
  .lg\:table {
    display: table; }
  .lg\:inline-table {
    display: inline-table; }
  .lg\:table-caption {
    display: table-caption; }
  .lg\:table-cell {
    display: table-cell; }
  .lg\:table-column {
    display: table-column; }
  .lg\:table-column-group {
    display: table-column-group; }
  .lg\:table-footer-group {
    display: table-footer-group; }
  .lg\:table-header-group {
    display: table-header-group; }
  .lg\:table-row-group {
    display: table-row-group; }
  .lg\:table-row {
    display: table-row; }
  .lg\:flow-root {
    display: flow-root; }
  .lg\:grid {
    display: grid; }
  .lg\:inline-grid {
    display: inline-grid; }
  .lg\:contents {
    display: contents; }
  .lg\:list-item {
    display: list-item; }
  .lg\:hidden {
    display: none; }
  .lg\:flex-1 {
    flex: 1 1 0%; }
  .lg\:flex-auto {
    flex: 1 1 auto; }
  .lg\:flex-initial {
    flex: 0 1 auto; }
  .lg\:flex-none {
    flex: none; }
  .lg\:flex-row {
    flex-direction: row; }
  .lg\:flex-row-reverse {
    flex-direction: row-reverse; }
  .lg\:flex-col {
    flex-direction: column; }
  .lg\:flex-col-reverse {
    flex-direction: column-reverse; }
  .lg\:flex-wrap {
    flex-wrap: wrap; }
  .lg\:flex-wrap-reverse {
    flex-wrap: wrap-reverse; }
  .lg\:flex-nowrap {
    flex-wrap: nowrap; }
  .lg\:items-start {
    align-items: flex-start; }
  .lg\:items-end {
    align-items: flex-end; }
  .lg\:items-center {
    align-items: center; }
  .lg\:items-baseline {
    align-items: baseline; }
  .lg\:items-stretch {
    align-items: stretch; }
  .lg\:justify-start {
    justify-content: flex-start; }
  .lg\:justify-end {
    justify-content: flex-end; }
  .lg\:justify-center {
    justify-content: center; }
  .lg\:justify-between {
    justify-content: space-between; }
  .lg\:justify-around {
    justify-content: space-around; }
  .lg\:justify-evenly {
    justify-content: space-evenly; }
  .lg\:gap-none {
    gap: var(--wco-spacing-none); }
  .lg\:gap-quark {
    gap: var(--wco-spacing-quark); }
  .lg\:gap-nano {
    gap: var(--wco-spacing-nano); }
  .lg\:gap-xxxs {
    gap: var(--wco-spacing-xxxs); }
  .lg\:gap-xxs {
    gap: var(--wco-spacing-xxs); }
  .lg\:gap-xs {
    gap: var(--wco-spacing-xs); }
  .lg\:gap-sm {
    gap: var(--wco-spacing-sm); }
  .lg\:gap-md {
    gap: var(--wco-spacing-md); }
  .lg\:gap-lg {
    gap: var(--wco-spacing-lg); }
  .lg\:gap-xl {
    gap: var(--wco-spacing-xl); }
  .lg\:gap-xxl {
    gap: var(--wco-spacing-xxl); }
  .lg\:gap-xxxl {
    gap: var(--wco-spacing-xxxl); }
  .lg\:gap-huge {
    gap: var(--wco-spacing-huge); }
  .lg\:gap-x-none {
    -moz-column-gap: var(--wco-spacing-none);
    column-gap: var(--wco-spacing-none); }
  .lg\:gap-x-quark {
    -moz-column-gap: var(--wco-spacing-quark);
    column-gap: var(--wco-spacing-quark); }
  .lg\:gap-x-nano {
    -moz-column-gap: var(--wco-spacing-nano);
    column-gap: var(--wco-spacing-nano); }
  .lg\:gap-x-xxxs {
    -moz-column-gap: var(--wco-spacing-xxxs);
    column-gap: var(--wco-spacing-xxxs); }
  .lg\:gap-x-xxs {
    -moz-column-gap: var(--wco-spacing-xxs);
    column-gap: var(--wco-spacing-xxs); }
  .lg\:gap-x-xs {
    -moz-column-gap: var(--wco-spacing-xs);
    column-gap: var(--wco-spacing-xs); }
  .lg\:gap-x-sm {
    -moz-column-gap: var(--wco-spacing-sm);
    column-gap: var(--wco-spacing-sm); }
  .lg\:gap-x-md {
    -moz-column-gap: var(--wco-spacing-md);
    column-gap: var(--wco-spacing-md); }
  .lg\:gap-x-lg {
    -moz-column-gap: var(--wco-spacing-lg);
    column-gap: var(--wco-spacing-lg); }
  .lg\:gap-x-xl {
    -moz-column-gap: var(--wco-spacing-xl);
    column-gap: var(--wco-spacing-xl); }
  .lg\:gap-x-xxl {
    -moz-column-gap: var(--wco-spacing-xxl);
    column-gap: var(--wco-spacing-xxl); }
  .lg\:gap-x-xxxl {
    -moz-column-gap: var(--wco-spacing-xxxl);
    column-gap: var(--wco-spacing-xxxl); }
  .lg\:gap-x-huge {
    -moz-column-gap: var(--wco-spacing-huge);
    column-gap: var(--wco-spacing-huge); }
  .lg\:gap-y-none {
    row-gap: var(--wco-spacing-none); }
  .lg\:gap-y-quark {
    row-gap: var(--wco-spacing-quark); }
  .lg\:gap-y-nano {
    row-gap: var(--wco-spacing-nano); }
  .lg\:gap-y-xxxs {
    row-gap: var(--wco-spacing-xxxs); }
  .lg\:gap-y-xxs {
    row-gap: var(--wco-spacing-xxs); }
  .lg\:gap-y-xs {
    row-gap: var(--wco-spacing-xs); }
  .lg\:gap-y-sm {
    row-gap: var(--wco-spacing-sm); }
  .lg\:gap-y-md {
    row-gap: var(--wco-spacing-md); }
  .lg\:gap-y-lg {
    row-gap: var(--wco-spacing-lg); }
  .lg\:gap-y-xl {
    row-gap: var(--wco-spacing-xl); }
  .lg\:gap-y-xxl {
    row-gap: var(--wco-spacing-xxl); }
  .lg\:gap-y-xxxl {
    row-gap: var(--wco-spacing-xxxl); }
  .lg\:gap-y-huge {
    row-gap: var(--wco-spacing-huge); }
  .lg\:p-none {
    padding: var(--wco-spacing-none); }
  .lg\:p-quark {
    padding: var(--wco-spacing-quark); }
  .lg\:p-nano {
    padding: var(--wco-spacing-nano); }
  .lg\:p-xxxs {
    padding: var(--wco-spacing-xxxs); }
  .lg\:p-xxs {
    padding: var(--wco-spacing-xxs); }
  .lg\:p-xs {
    padding: var(--wco-spacing-xs); }
  .lg\:p-sm {
    padding: var(--wco-spacing-sm); }
  .lg\:p-md {
    padding: var(--wco-spacing-md); }
  .lg\:p-lg {
    padding: var(--wco-spacing-lg); }
  .lg\:p-xl {
    padding: var(--wco-spacing-xl); }
  .lg\:p-xxl {
    padding: var(--wco-spacing-xxl); }
  .lg\:p-xxxl {
    padding: var(--wco-spacing-xxxl); }
  .lg\:p-huge {
    padding: var(--wco-spacing-huge); }
  .lg\:px-none {
    padding-left: var(--wco-spacing-none);
    padding-right: var(--wco-spacing-none); }
  .lg\:px-quark {
    padding-left: var(--wco-spacing-quark);
    padding-right: var(--wco-spacing-quark); }
  .lg\:px-nano {
    padding-left: var(--wco-spacing-nano);
    padding-right: var(--wco-spacing-nano); }
  .lg\:px-xxxs {
    padding-left: var(--wco-spacing-xxxs);
    padding-right: var(--wco-spacing-xxxs); }
  .lg\:px-xxs {
    padding-left: var(--wco-spacing-xxs);
    padding-right: var(--wco-spacing-xxs); }
  .lg\:px-xs {
    padding-left: var(--wco-spacing-xs);
    padding-right: var(--wco-spacing-xs); }
  .lg\:px-sm {
    padding-left: var(--wco-spacing-sm);
    padding-right: var(--wco-spacing-sm); }
  .lg\:px-md {
    padding-left: var(--wco-spacing-md);
    padding-right: var(--wco-spacing-md); }
  .lg\:px-lg {
    padding-left: var(--wco-spacing-lg);
    padding-right: var(--wco-spacing-lg); }
  .lg\:px-xl {
    padding-left: var(--wco-spacing-xl);
    padding-right: var(--wco-spacing-xl); }
  .lg\:px-xxl {
    padding-left: var(--wco-spacing-xxl);
    padding-right: var(--wco-spacing-xxl); }
  .lg\:px-xxxl {
    padding-left: var(--wco-spacing-xxxl);
    padding-right: var(--wco-spacing-xxxl); }
  .lg\:px-huge {
    padding-left: var(--wco-spacing-huge);
    padding-right: var(--wco-spacing-huge); }
  .lg\:py-none {
    padding-top: var(--wco-spacing-none);
    padding-bottom: var(--wco-spacing-none); }
  .lg\:py-quark {
    padding-top: var(--wco-spacing-quark);
    padding-bottom: var(--wco-spacing-quark); }
  .lg\:py-nano {
    padding-top: var(--wco-spacing-nano);
    padding-bottom: var(--wco-spacing-nano); }
  .lg\:py-xxxs {
    padding-top: var(--wco-spacing-xxxs);
    padding-bottom: var(--wco-spacing-xxxs); }
  .lg\:py-xxs {
    padding-top: var(--wco-spacing-xxs);
    padding-bottom: var(--wco-spacing-xxs); }
  .lg\:py-xs {
    padding-top: var(--wco-spacing-xs);
    padding-bottom: var(--wco-spacing-xs); }
  .lg\:py-sm {
    padding-top: var(--wco-spacing-sm);
    padding-bottom: var(--wco-spacing-sm); }
  .lg\:py-md {
    padding-top: var(--wco-spacing-md);
    padding-bottom: var(--wco-spacing-md); }
  .lg\:py-lg {
    padding-top: var(--wco-spacing-lg);
    padding-bottom: var(--wco-spacing-lg); }
  .lg\:py-xl {
    padding-top: var(--wco-spacing-xl);
    padding-bottom: var(--wco-spacing-xl); }
  .lg\:py-xxl {
    padding-top: var(--wco-spacing-xxl);
    padding-bottom: var(--wco-spacing-xxl); }
  .lg\:py-xxxl {
    padding-top: var(--wco-spacing-xxxl);
    padding-bottom: var(--wco-spacing-xxxl); }
  .lg\:py-huge {
    padding-top: var(--wco-spacing-huge);
    padding-bottom: var(--wco-spacing-huge); }
  .lg\:pt-none {
    padding-top: var(--wco-spacing-none); }
  .lg\:pt-quark {
    padding-top: var(--wco-spacing-quark); }
  .lg\:pt-nano {
    padding-top: var(--wco-spacing-nano); }
  .lg\:pt-xxxs {
    padding-top: var(--wco-spacing-xxxs); }
  .lg\:pt-xxs {
    padding-top: var(--wco-spacing-xxs); }
  .lg\:pt-xs {
    padding-top: var(--wco-spacing-xs); }
  .lg\:pt-sm {
    padding-top: var(--wco-spacing-sm); }
  .lg\:pt-md {
    padding-top: var(--wco-spacing-md); }
  .lg\:pt-lg {
    padding-top: var(--wco-spacing-lg); }
  .lg\:pt-xl {
    padding-top: var(--wco-spacing-xl); }
  .lg\:pt-xxl {
    padding-top: var(--wco-spacing-xxl); }
  .lg\:pt-xxxl {
    padding-top: var(--wco-spacing-xxxl); }
  .lg\:pt-huge {
    padding-top: var(--wco-spacing-huge); }
  .lg\:pr-none {
    padding-right: var(--wco-spacing-none); }
  .lg\:pr-quark {
    padding-right: var(--wco-spacing-quark); }
  .lg\:pr-nano {
    padding-right: var(--wco-spacing-nano); }
  .lg\:pr-xxxs {
    padding-right: var(--wco-spacing-xxxs); }
  .lg\:pr-xxs {
    padding-right: var(--wco-spacing-xxs); }
  .lg\:pr-xs {
    padding-right: var(--wco-spacing-xs); }
  .lg\:pr-sm {
    padding-right: var(--wco-spacing-sm); }
  .lg\:pr-md {
    padding-right: var(--wco-spacing-md); }
  .lg\:pr-lg {
    padding-right: var(--wco-spacing-lg); }
  .lg\:pr-xl {
    padding-right: var(--wco-spacing-xl); }
  .lg\:pr-xxl {
    padding-right: var(--wco-spacing-xxl); }
  .lg\:pr-xxxl {
    padding-right: var(--wco-spacing-xxxl); }
  .lg\:pr-huge {
    padding-right: var(--wco-spacing-huge); }
  .lg\:pb-none {
    padding-bottom: var(--wco-spacing-none); }
  .lg\:pb-quark {
    padding-bottom: var(--wco-spacing-quark); }
  .lg\:pb-nano {
    padding-bottom: var(--wco-spacing-nano); }
  .lg\:pb-xxxs {
    padding-bottom: var(--wco-spacing-xxxs); }
  .lg\:pb-xxs {
    padding-bottom: var(--wco-spacing-xxs); }
  .lg\:pb-xs {
    padding-bottom: var(--wco-spacing-xs); }
  .lg\:pb-sm {
    padding-bottom: var(--wco-spacing-sm); }
  .lg\:pb-md {
    padding-bottom: var(--wco-spacing-md); }
  .lg\:pb-lg {
    padding-bottom: var(--wco-spacing-lg); }
  .lg\:pb-xl {
    padding-bottom: var(--wco-spacing-xl); }
  .lg\:pb-xxl {
    padding-bottom: var(--wco-spacing-xxl); }
  .lg\:pb-xxxl {
    padding-bottom: var(--wco-spacing-xxxl); }
  .lg\:pb-huge {
    padding-bottom: var(--wco-spacing-huge); }
  .lg\:pl-none {
    padding-left: var(--wco-spacing-none); }
  .lg\:pl-quark {
    padding-left: var(--wco-spacing-quark); }
  .lg\:pl-nano {
    padding-left: var(--wco-spacing-nano); }
  .lg\:pl-xxxs {
    padding-left: var(--wco-spacing-xxxs); }
  .lg\:pl-xxs {
    padding-left: var(--wco-spacing-xxs); }
  .lg\:pl-xs {
    padding-left: var(--wco-spacing-xs); }
  .lg\:pl-sm {
    padding-left: var(--wco-spacing-sm); }
  .lg\:pl-md {
    padding-left: var(--wco-spacing-md); }
  .lg\:pl-lg {
    padding-left: var(--wco-spacing-lg); }
  .lg\:pl-xl {
    padding-left: var(--wco-spacing-xl); }
  .lg\:pl-xxl {
    padding-left: var(--wco-spacing-xxl); }
  .lg\:pl-xxxl {
    padding-left: var(--wco-spacing-xxxl); }
  .lg\:pl-huge {
    padding-left: var(--wco-spacing-huge); }
  .lg\:text-left {
    text-align: left; }
  .lg\:text-center {
    text-align: center; }
  .lg\:text-right {
    text-align: right; }
  .lg\:text-justify {
    text-align: justify; } }

@media (min-width: 1280px) {
  .xl\:m-none {
    margin: var(--wco-spacing-none); }
  .xl\:m-quark {
    margin: var(--wco-spacing-quark); }
  .xl\:m-nano {
    margin: var(--wco-spacing-nano); }
  .xl\:m-xxxs {
    margin: var(--wco-spacing-xxxs); }
  .xl\:m-xxs {
    margin: var(--wco-spacing-xxs); }
  .xl\:m-xs {
    margin: var(--wco-spacing-xs); }
  .xl\:m-sm {
    margin: var(--wco-spacing-sm); }
  .xl\:m-md {
    margin: var(--wco-spacing-md); }
  .xl\:m-lg {
    margin: var(--wco-spacing-lg); }
  .xl\:m-xl {
    margin: var(--wco-spacing-xl); }
  .xl\:m-xxl {
    margin: var(--wco-spacing-xxl); }
  .xl\:m-xxxl {
    margin: var(--wco-spacing-xxxl); }
  .xl\:m-huge {
    margin: var(--wco-spacing-huge); }
  .xl\:mx-none {
    margin-left: var(--wco-spacing-none);
    margin-right: var(--wco-spacing-none); }
  .xl\:mx-quark {
    margin-left: var(--wco-spacing-quark);
    margin-right: var(--wco-spacing-quark); }
  .xl\:mx-nano {
    margin-left: var(--wco-spacing-nano);
    margin-right: var(--wco-spacing-nano); }
  .xl\:mx-xxxs {
    margin-left: var(--wco-spacing-xxxs);
    margin-right: var(--wco-spacing-xxxs); }
  .xl\:mx-xxs {
    margin-left: var(--wco-spacing-xxs);
    margin-right: var(--wco-spacing-xxs); }
  .xl\:mx-xs {
    margin-left: var(--wco-spacing-xs);
    margin-right: var(--wco-spacing-xs); }
  .xl\:mx-sm {
    margin-left: var(--wco-spacing-sm);
    margin-right: var(--wco-spacing-sm); }
  .xl\:mx-md {
    margin-left: var(--wco-spacing-md);
    margin-right: var(--wco-spacing-md); }
  .xl\:mx-lg {
    margin-left: var(--wco-spacing-lg);
    margin-right: var(--wco-spacing-lg); }
  .xl\:mx-xl {
    margin-left: var(--wco-spacing-xl);
    margin-right: var(--wco-spacing-xl); }
  .xl\:mx-xxl {
    margin-left: var(--wco-spacing-xxl);
    margin-right: var(--wco-spacing-xxl); }
  .xl\:mx-xxxl {
    margin-left: var(--wco-spacing-xxxl);
    margin-right: var(--wco-spacing-xxxl); }
  .xl\:mx-huge {
    margin-left: var(--wco-spacing-huge);
    margin-right: var(--wco-spacing-huge); }
  .xl\:my-none {
    margin-top: var(--wco-spacing-none);
    margin-bottom: var(--wco-spacing-none); }
  .xl\:my-quark {
    margin-top: var(--wco-spacing-quark);
    margin-bottom: var(--wco-spacing-quark); }
  .xl\:my-nano {
    margin-top: var(--wco-spacing-nano);
    margin-bottom: var(--wco-spacing-nano); }
  .xl\:my-xxxs {
    margin-top: var(--wco-spacing-xxxs);
    margin-bottom: var(--wco-spacing-xxxs); }
  .xl\:my-xxs {
    margin-top: var(--wco-spacing-xxs);
    margin-bottom: var(--wco-spacing-xxs); }
  .xl\:my-xs {
    margin-top: var(--wco-spacing-xs);
    margin-bottom: var(--wco-spacing-xs); }
  .xl\:my-sm {
    margin-top: var(--wco-spacing-sm);
    margin-bottom: var(--wco-spacing-sm); }
  .xl\:my-md {
    margin-top: var(--wco-spacing-md);
    margin-bottom: var(--wco-spacing-md); }
  .xl\:my-lg {
    margin-top: var(--wco-spacing-lg);
    margin-bottom: var(--wco-spacing-lg); }
  .xl\:my-xl {
    margin-top: var(--wco-spacing-xl);
    margin-bottom: var(--wco-spacing-xl); }
  .xl\:my-xxl {
    margin-top: var(--wco-spacing-xxl);
    margin-bottom: var(--wco-spacing-xxl); }
  .xl\:my-xxxl {
    margin-top: var(--wco-spacing-xxxl);
    margin-bottom: var(--wco-spacing-xxxl); }
  .xl\:my-huge {
    margin-top: var(--wco-spacing-huge);
    margin-bottom: var(--wco-spacing-huge); }
  .xl\:mt-none {
    margin-top: var(--wco-spacing-none); }
  .xl\:mt-quark {
    margin-top: var(--wco-spacing-quark); }
  .xl\:mt-nano {
    margin-top: var(--wco-spacing-nano); }
  .xl\:mt-xxxs {
    margin-top: var(--wco-spacing-xxxs); }
  .xl\:mt-xxs {
    margin-top: var(--wco-spacing-xxs); }
  .xl\:mt-xs {
    margin-top: var(--wco-spacing-xs); }
  .xl\:mt-sm {
    margin-top: var(--wco-spacing-sm); }
  .xl\:mt-md {
    margin-top: var(--wco-spacing-md); }
  .xl\:mt-lg {
    margin-top: var(--wco-spacing-lg); }
  .xl\:mt-xl {
    margin-top: var(--wco-spacing-xl); }
  .xl\:mt-xxl {
    margin-top: var(--wco-spacing-xxl); }
  .xl\:mt-xxxl {
    margin-top: var(--wco-spacing-xxxl); }
  .xl\:mt-huge {
    margin-top: var(--wco-spacing-huge); }
  .xl\:mr-none {
    margin-right: var(--wco-spacing-none); }
  .xl\:mr-quark {
    margin-right: var(--wco-spacing-quark); }
  .xl\:mr-nano {
    margin-right: var(--wco-spacing-nano); }
  .xl\:mr-xxxs {
    margin-right: var(--wco-spacing-xxxs); }
  .xl\:mr-xxs {
    margin-right: var(--wco-spacing-xxs); }
  .xl\:mr-xs {
    margin-right: var(--wco-spacing-xs); }
  .xl\:mr-sm {
    margin-right: var(--wco-spacing-sm); }
  .xl\:mr-md {
    margin-right: var(--wco-spacing-md); }
  .xl\:mr-lg {
    margin-right: var(--wco-spacing-lg); }
  .xl\:mr-xl {
    margin-right: var(--wco-spacing-xl); }
  .xl\:mr-xxl {
    margin-right: var(--wco-spacing-xxl); }
  .xl\:mr-xxxl {
    margin-right: var(--wco-spacing-xxxl); }
  .xl\:mr-huge {
    margin-right: var(--wco-spacing-huge); }
  .xl\:mb-none {
    margin-bottom: var(--wco-spacing-none); }
  .xl\:mb-quark {
    margin-bottom: var(--wco-spacing-quark); }
  .xl\:mb-nano {
    margin-bottom: var(--wco-spacing-nano); }
  .xl\:mb-xxxs {
    margin-bottom: var(--wco-spacing-xxxs); }
  .xl\:mb-xxs {
    margin-bottom: var(--wco-spacing-xxs); }
  .xl\:mb-xs {
    margin-bottom: var(--wco-spacing-xs); }
  .xl\:mb-sm {
    margin-bottom: var(--wco-spacing-sm); }
  .xl\:mb-md {
    margin-bottom: var(--wco-spacing-md); }
  .xl\:mb-lg {
    margin-bottom: var(--wco-spacing-lg); }
  .xl\:mb-xl {
    margin-bottom: var(--wco-spacing-xl); }
  .xl\:mb-xxl {
    margin-bottom: var(--wco-spacing-xxl); }
  .xl\:mb-xxxl {
    margin-bottom: var(--wco-spacing-xxxl); }
  .xl\:mb-huge {
    margin-bottom: var(--wco-spacing-huge); }
  .xl\:ml-none {
    margin-left: var(--wco-spacing-none); }
  .xl\:ml-quark {
    margin-left: var(--wco-spacing-quark); }
  .xl\:ml-nano {
    margin-left: var(--wco-spacing-nano); }
  .xl\:ml-xxxs {
    margin-left: var(--wco-spacing-xxxs); }
  .xl\:ml-xxs {
    margin-left: var(--wco-spacing-xxs); }
  .xl\:ml-xs {
    margin-left: var(--wco-spacing-xs); }
  .xl\:ml-sm {
    margin-left: var(--wco-spacing-sm); }
  .xl\:ml-md {
    margin-left: var(--wco-spacing-md); }
  .xl\:ml-lg {
    margin-left: var(--wco-spacing-lg); }
  .xl\:ml-xl {
    margin-left: var(--wco-spacing-xl); }
  .xl\:ml-xxl {
    margin-left: var(--wco-spacing-xxl); }
  .xl\:ml-xxxl {
    margin-left: var(--wco-spacing-xxxl); }
  .xl\:ml-huge {
    margin-left: var(--wco-spacing-huge); }
  .xl\:block {
    display: block; }
  .xl\:inline-block {
    display: inline-block; }
  .xl\:inline {
    display: inline; }
  .xl\:flex {
    display: flex; }
  .xl\:inline-flex {
    display: inline-flex; }
  .xl\:table {
    display: table; }
  .xl\:inline-table {
    display: inline-table; }
  .xl\:table-caption {
    display: table-caption; }
  .xl\:table-cell {
    display: table-cell; }
  .xl\:table-column {
    display: table-column; }
  .xl\:table-column-group {
    display: table-column-group; }
  .xl\:table-footer-group {
    display: table-footer-group; }
  .xl\:table-header-group {
    display: table-header-group; }
  .xl\:table-row-group {
    display: table-row-group; }
  .xl\:table-row {
    display: table-row; }
  .xl\:flow-root {
    display: flow-root; }
  .xl\:grid {
    display: grid; }
  .xl\:inline-grid {
    display: inline-grid; }
  .xl\:contents {
    display: contents; }
  .xl\:list-item {
    display: list-item; }
  .xl\:hidden {
    display: none; }
  .xl\:flex-1 {
    flex: 1 1 0%; }
  .xl\:flex-auto {
    flex: 1 1 auto; }
  .xl\:flex-initial {
    flex: 0 1 auto; }
  .xl\:flex-none {
    flex: none; }
  .xl\:flex-row {
    flex-direction: row; }
  .xl\:flex-row-reverse {
    flex-direction: row-reverse; }
  .xl\:flex-col {
    flex-direction: column; }
  .xl\:flex-col-reverse {
    flex-direction: column-reverse; }
  .xl\:flex-wrap {
    flex-wrap: wrap; }
  .xl\:flex-wrap-reverse {
    flex-wrap: wrap-reverse; }
  .xl\:flex-nowrap {
    flex-wrap: nowrap; }
  .xl\:items-start {
    align-items: flex-start; }
  .xl\:items-end {
    align-items: flex-end; }
  .xl\:items-center {
    align-items: center; }
  .xl\:items-baseline {
    align-items: baseline; }
  .xl\:items-stretch {
    align-items: stretch; }
  .xl\:justify-start {
    justify-content: flex-start; }
  .xl\:justify-end {
    justify-content: flex-end; }
  .xl\:justify-center {
    justify-content: center; }
  .xl\:justify-between {
    justify-content: space-between; }
  .xl\:justify-around {
    justify-content: space-around; }
  .xl\:justify-evenly {
    justify-content: space-evenly; }
  .xl\:gap-none {
    gap: var(--wco-spacing-none); }
  .xl\:gap-quark {
    gap: var(--wco-spacing-quark); }
  .xl\:gap-nano {
    gap: var(--wco-spacing-nano); }
  .xl\:gap-xxxs {
    gap: var(--wco-spacing-xxxs); }
  .xl\:gap-xxs {
    gap: var(--wco-spacing-xxs); }
  .xl\:gap-xs {
    gap: var(--wco-spacing-xs); }
  .xl\:gap-sm {
    gap: var(--wco-spacing-sm); }
  .xl\:gap-md {
    gap: var(--wco-spacing-md); }
  .xl\:gap-lg {
    gap: var(--wco-spacing-lg); }
  .xl\:gap-xl {
    gap: var(--wco-spacing-xl); }
  .xl\:gap-xxl {
    gap: var(--wco-spacing-xxl); }
  .xl\:gap-xxxl {
    gap: var(--wco-spacing-xxxl); }
  .xl\:gap-huge {
    gap: var(--wco-spacing-huge); }
  .xl\:gap-x-none {
    -moz-column-gap: var(--wco-spacing-none);
    column-gap: var(--wco-spacing-none); }
  .xl\:gap-x-quark {
    -moz-column-gap: var(--wco-spacing-quark);
    column-gap: var(--wco-spacing-quark); }
  .xl\:gap-x-nano {
    -moz-column-gap: var(--wco-spacing-nano);
    column-gap: var(--wco-spacing-nano); }
  .xl\:gap-x-xxxs {
    -moz-column-gap: var(--wco-spacing-xxxs);
    column-gap: var(--wco-spacing-xxxs); }
  .xl\:gap-x-xxs {
    -moz-column-gap: var(--wco-spacing-xxs);
    column-gap: var(--wco-spacing-xxs); }
  .xl\:gap-x-xs {
    -moz-column-gap: var(--wco-spacing-xs);
    column-gap: var(--wco-spacing-xs); }
  .xl\:gap-x-sm {
    -moz-column-gap: var(--wco-spacing-sm);
    column-gap: var(--wco-spacing-sm); }
  .xl\:gap-x-md {
    -moz-column-gap: var(--wco-spacing-md);
    column-gap: var(--wco-spacing-md); }
  .xl\:gap-x-lg {
    -moz-column-gap: var(--wco-spacing-lg);
    column-gap: var(--wco-spacing-lg); }
  .xl\:gap-x-xl {
    -moz-column-gap: var(--wco-spacing-xl);
    column-gap: var(--wco-spacing-xl); }
  .xl\:gap-x-xxl {
    -moz-column-gap: var(--wco-spacing-xxl);
    column-gap: var(--wco-spacing-xxl); }
  .xl\:gap-x-xxxl {
    -moz-column-gap: var(--wco-spacing-xxxl);
    column-gap: var(--wco-spacing-xxxl); }
  .xl\:gap-x-huge {
    -moz-column-gap: var(--wco-spacing-huge);
    column-gap: var(--wco-spacing-huge); }
  .xl\:gap-y-none {
    row-gap: var(--wco-spacing-none); }
  .xl\:gap-y-quark {
    row-gap: var(--wco-spacing-quark); }
  .xl\:gap-y-nano {
    row-gap: var(--wco-spacing-nano); }
  .xl\:gap-y-xxxs {
    row-gap: var(--wco-spacing-xxxs); }
  .xl\:gap-y-xxs {
    row-gap: var(--wco-spacing-xxs); }
  .xl\:gap-y-xs {
    row-gap: var(--wco-spacing-xs); }
  .xl\:gap-y-sm {
    row-gap: var(--wco-spacing-sm); }
  .xl\:gap-y-md {
    row-gap: var(--wco-spacing-md); }
  .xl\:gap-y-lg {
    row-gap: var(--wco-spacing-lg); }
  .xl\:gap-y-xl {
    row-gap: var(--wco-spacing-xl); }
  .xl\:gap-y-xxl {
    row-gap: var(--wco-spacing-xxl); }
  .xl\:gap-y-xxxl {
    row-gap: var(--wco-spacing-xxxl); }
  .xl\:gap-y-huge {
    row-gap: var(--wco-spacing-huge); }
  .xl\:p-none {
    padding: var(--wco-spacing-none); }
  .xl\:p-quark {
    padding: var(--wco-spacing-quark); }
  .xl\:p-nano {
    padding: var(--wco-spacing-nano); }
  .xl\:p-xxxs {
    padding: var(--wco-spacing-xxxs); }
  .xl\:p-xxs {
    padding: var(--wco-spacing-xxs); }
  .xl\:p-xs {
    padding: var(--wco-spacing-xs); }
  .xl\:p-sm {
    padding: var(--wco-spacing-sm); }
  .xl\:p-md {
    padding: var(--wco-spacing-md); }
  .xl\:p-lg {
    padding: var(--wco-spacing-lg); }
  .xl\:p-xl {
    padding: var(--wco-spacing-xl); }
  .xl\:p-xxl {
    padding: var(--wco-spacing-xxl); }
  .xl\:p-xxxl {
    padding: var(--wco-spacing-xxxl); }
  .xl\:p-huge {
    padding: var(--wco-spacing-huge); }
  .xl\:px-none {
    padding-left: var(--wco-spacing-none);
    padding-right: var(--wco-spacing-none); }
  .xl\:px-quark {
    padding-left: var(--wco-spacing-quark);
    padding-right: var(--wco-spacing-quark); }
  .xl\:px-nano {
    padding-left: var(--wco-spacing-nano);
    padding-right: var(--wco-spacing-nano); }
  .xl\:px-xxxs {
    padding-left: var(--wco-spacing-xxxs);
    padding-right: var(--wco-spacing-xxxs); }
  .xl\:px-xxs {
    padding-left: var(--wco-spacing-xxs);
    padding-right: var(--wco-spacing-xxs); }
  .xl\:px-xs {
    padding-left: var(--wco-spacing-xs);
    padding-right: var(--wco-spacing-xs); }
  .xl\:px-sm {
    padding-left: var(--wco-spacing-sm);
    padding-right: var(--wco-spacing-sm); }
  .xl\:px-md {
    padding-left: var(--wco-spacing-md);
    padding-right: var(--wco-spacing-md); }
  .xl\:px-lg {
    padding-left: var(--wco-spacing-lg);
    padding-right: var(--wco-spacing-lg); }
  .xl\:px-xl {
    padding-left: var(--wco-spacing-xl);
    padding-right: var(--wco-spacing-xl); }
  .xl\:px-xxl {
    padding-left: var(--wco-spacing-xxl);
    padding-right: var(--wco-spacing-xxl); }
  .xl\:px-xxxl {
    padding-left: var(--wco-spacing-xxxl);
    padding-right: var(--wco-spacing-xxxl); }
  .xl\:px-huge {
    padding-left: var(--wco-spacing-huge);
    padding-right: var(--wco-spacing-huge); }
  .xl\:py-none {
    padding-top: var(--wco-spacing-none);
    padding-bottom: var(--wco-spacing-none); }
  .xl\:py-quark {
    padding-top: var(--wco-spacing-quark);
    padding-bottom: var(--wco-spacing-quark); }
  .xl\:py-nano {
    padding-top: var(--wco-spacing-nano);
    padding-bottom: var(--wco-spacing-nano); }
  .xl\:py-xxxs {
    padding-top: var(--wco-spacing-xxxs);
    padding-bottom: var(--wco-spacing-xxxs); }
  .xl\:py-xxs {
    padding-top: var(--wco-spacing-xxs);
    padding-bottom: var(--wco-spacing-xxs); }
  .xl\:py-xs {
    padding-top: var(--wco-spacing-xs);
    padding-bottom: var(--wco-spacing-xs); }
  .xl\:py-sm {
    padding-top: var(--wco-spacing-sm);
    padding-bottom: var(--wco-spacing-sm); }
  .xl\:py-md {
    padding-top: var(--wco-spacing-md);
    padding-bottom: var(--wco-spacing-md); }
  .xl\:py-lg {
    padding-top: var(--wco-spacing-lg);
    padding-bottom: var(--wco-spacing-lg); }
  .xl\:py-xl {
    padding-top: var(--wco-spacing-xl);
    padding-bottom: var(--wco-spacing-xl); }
  .xl\:py-xxl {
    padding-top: var(--wco-spacing-xxl);
    padding-bottom: var(--wco-spacing-xxl); }
  .xl\:py-xxxl {
    padding-top: var(--wco-spacing-xxxl);
    padding-bottom: var(--wco-spacing-xxxl); }
  .xl\:py-huge {
    padding-top: var(--wco-spacing-huge);
    padding-bottom: var(--wco-spacing-huge); }
  .xl\:pt-none {
    padding-top: var(--wco-spacing-none); }
  .xl\:pt-quark {
    padding-top: var(--wco-spacing-quark); }
  .xl\:pt-nano {
    padding-top: var(--wco-spacing-nano); }
  .xl\:pt-xxxs {
    padding-top: var(--wco-spacing-xxxs); }
  .xl\:pt-xxs {
    padding-top: var(--wco-spacing-xxs); }
  .xl\:pt-xs {
    padding-top: var(--wco-spacing-xs); }
  .xl\:pt-sm {
    padding-top: var(--wco-spacing-sm); }
  .xl\:pt-md {
    padding-top: var(--wco-spacing-md); }
  .xl\:pt-lg {
    padding-top: var(--wco-spacing-lg); }
  .xl\:pt-xl {
    padding-top: var(--wco-spacing-xl); }
  .xl\:pt-xxl {
    padding-top: var(--wco-spacing-xxl); }
  .xl\:pt-xxxl {
    padding-top: var(--wco-spacing-xxxl); }
  .xl\:pt-huge {
    padding-top: var(--wco-spacing-huge); }
  .xl\:pr-none {
    padding-right: var(--wco-spacing-none); }
  .xl\:pr-quark {
    padding-right: var(--wco-spacing-quark); }
  .xl\:pr-nano {
    padding-right: var(--wco-spacing-nano); }
  .xl\:pr-xxxs {
    padding-right: var(--wco-spacing-xxxs); }
  .xl\:pr-xxs {
    padding-right: var(--wco-spacing-xxs); }
  .xl\:pr-xs {
    padding-right: var(--wco-spacing-xs); }
  .xl\:pr-sm {
    padding-right: var(--wco-spacing-sm); }
  .xl\:pr-md {
    padding-right: var(--wco-spacing-md); }
  .xl\:pr-lg {
    padding-right: var(--wco-spacing-lg); }
  .xl\:pr-xl {
    padding-right: var(--wco-spacing-xl); }
  .xl\:pr-xxl {
    padding-right: var(--wco-spacing-xxl); }
  .xl\:pr-xxxl {
    padding-right: var(--wco-spacing-xxxl); }
  .xl\:pr-huge {
    padding-right: var(--wco-spacing-huge); }
  .xl\:pb-none {
    padding-bottom: var(--wco-spacing-none); }
  .xl\:pb-quark {
    padding-bottom: var(--wco-spacing-quark); }
  .xl\:pb-nano {
    padding-bottom: var(--wco-spacing-nano); }
  .xl\:pb-xxxs {
    padding-bottom: var(--wco-spacing-xxxs); }
  .xl\:pb-xxs {
    padding-bottom: var(--wco-spacing-xxs); }
  .xl\:pb-xs {
    padding-bottom: var(--wco-spacing-xs); }
  .xl\:pb-sm {
    padding-bottom: var(--wco-spacing-sm); }
  .xl\:pb-md {
    padding-bottom: var(--wco-spacing-md); }
  .xl\:pb-lg {
    padding-bottom: var(--wco-spacing-lg); }
  .xl\:pb-xl {
    padding-bottom: var(--wco-spacing-xl); }
  .xl\:pb-xxl {
    padding-bottom: var(--wco-spacing-xxl); }
  .xl\:pb-xxxl {
    padding-bottom: var(--wco-spacing-xxxl); }
  .xl\:pb-huge {
    padding-bottom: var(--wco-spacing-huge); }
  .xl\:pl-none {
    padding-left: var(--wco-spacing-none); }
  .xl\:pl-quark {
    padding-left: var(--wco-spacing-quark); }
  .xl\:pl-nano {
    padding-left: var(--wco-spacing-nano); }
  .xl\:pl-xxxs {
    padding-left: var(--wco-spacing-xxxs); }
  .xl\:pl-xxs {
    padding-left: var(--wco-spacing-xxs); }
  .xl\:pl-xs {
    padding-left: var(--wco-spacing-xs); }
  .xl\:pl-sm {
    padding-left: var(--wco-spacing-sm); }
  .xl\:pl-md {
    padding-left: var(--wco-spacing-md); }
  .xl\:pl-lg {
    padding-left: var(--wco-spacing-lg); }
  .xl\:pl-xl {
    padding-left: var(--wco-spacing-xl); }
  .xl\:pl-xxl {
    padding-left: var(--wco-spacing-xxl); }
  .xl\:pl-xxxl {
    padding-left: var(--wco-spacing-xxxl); }
  .xl\:pl-huge {
    padding-left: var(--wco-spacing-huge); }
  .xl\:text-left {
    text-align: left; }
  .xl\:text-center {
    text-align: center; }
  .xl\:text-right {
    text-align: right; }
  .xl\:text-justify {
    text-align: justify; } }